/* =========================================================
   PartnerOptimize Inc. — Corporate Site
   Design system + motion
   ========================================================= */

:root{
  /* ---- palette ---- */
  --bg:        #0a0a0c;
  --bg-2:      #101013;
  --bg-3:      #17171b;
  --line:      rgba(255,255,255,.09);
  --line-2:    rgba(255,255,255,.16);
  --fg:        #f2f2f4;
  --fg-2:      #a9a9b1;
  --fg-3:      #70707a;

  --accent:    #be1c2d;
  --accent-2:  #ff5147;
  --accent-3:  #8f8f99;
  --grad:      linear-gradient(100deg, var(--accent) 0%, var(--accent-2) 100%);
  --grad-soft: linear-gradient(100deg, rgba(190,28,45,.18), rgba(255,81,71,.18));

  /* ---- type ---- */
  --ff-en: "Outfit", "Helvetica Neue", Arial, sans-serif;
  --ff-jp: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif;

  /* ---- layout ---- */
  --wrap: 1240px;
  --pad: clamp(20px, 5vw, 64px);
  --sec-y: clamp(90px, 12vw, 180px);

  /* ---- easing ---- */
  --e-out: cubic-bezier(.16,1,.3,1);
  --e-io:  cubic-bezier(.65,0,.35,1);
}

*,*::before,*::after{ box-sizing:border-box; }
[hidden]{ display:none !important; }

html{
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
}
html.is-locked, body.is-locked{ overflow:hidden; }

body{
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family:var(--ff-jp);
  font-size:16px;
  line-height:1.9;
  font-feature-settings:"palt" 1;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }

::selection{ background:rgba(255,81,71,.28); color:#fff; }

/* scrollbar */
::-webkit-scrollbar{ width:9px; }
::-webkit-scrollbar-track{ background:#08080a; }
::-webkit-scrollbar-thumb{ background:#26262c; border-radius:9px; }
::-webkit-scrollbar-thumb:hover{ background:#35353d; }

.wrap{
  width:100%;
  max-width:var(--wrap);
  margin-inline:auto;
  padding-inline:var(--pad);
  position:relative;
  z-index:2;
}

.sp-only{ display:none; }

/* =========================================================
   PRELOADER
   ========================================================= */
.loader{
  position:fixed; inset:0; z-index:9999;
  background:var(--bg);
  display:grid; place-items:center;
  transition:opacity .6s var(--e-out), visibility .6s;
}
.loader.is-done{ opacity:0; visibility:hidden; pointer-events:none; }
.loader__inner{ text-align:center; width:min(320px, 70vw); }
.loader__mark{
  font-family:var(--ff-en); font-weight:800; font-size:clamp(48px,9vw,78px);
  letter-spacing:-.04em; line-height:1;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;
  display:flex; justify-content:center; gap:.02em;
}
.loader__mark span{ display:inline-block; animation:markIn .9s var(--e-out) both; }
.loader__mark span:nth-child(2){ animation-delay:.1s; }
@keyframes markIn{ from{ opacity:0; transform:translateY(24px) rotateX(-60deg);} to{ opacity:1; transform:none;} }

.loader__name{
  font-family:var(--ff-en); font-size:12px; letter-spacing:.42em; text-transform:uppercase;
  color:var(--fg-3); margin:14px 0 26px; padding-left:.42em;
  animation:fadeIn .8s .35s both;
}
.loader__bar{ height:1px; background:var(--line); position:relative; overflow:hidden; }
.loader__bar i{ position:absolute; inset:0 auto 0 0; width:0%; background:var(--grad); transition:width .25s linear; }
.loader__num{
  margin-top:12px; font-family:var(--ff-en); font-size:12px; letter-spacing:.2em; color:var(--fg-3);
  display:flex; justify-content:flex-end; align-items:baseline; gap:2px;
}
.loader__curtain{
  position:absolute; inset:0; background:var(--bg-3);
  transform:scaleY(0); transform-origin:bottom; pointer-events:none;
}
@keyframes fadeIn{ from{opacity:0} to{opacity:1} }

/* =========================================================
   FIXED UI — progress / cursor / grain
   ========================================================= */
.progress{
  position:fixed; top:0; left:0; height:2px; width:0%; z-index:800;
  background:var(--grad); box-shadow:0 0 18px rgba(255,81,71,.6);
  transition:width .1s linear;
}

.cursor,.cursor-dot{
  position:fixed; top:0; left:0; z-index:9000; pointer-events:none; border-radius:50%;
  opacity:0; transition:opacity .4s;
}
body.has-cursor .cursor, body.has-cursor .cursor-dot{ opacity:1; }
.cursor{
  width:34px; height:34px; margin:-17px 0 0 -17px;
  border:1px solid rgba(255,255,255,.45);
  transition:width .3s var(--e-out), height .3s var(--e-out), margin .3s var(--e-out),
             background-color .3s, border-color .3s, opacity .3s;
}
.cursor.is-hover{
  width:64px; height:64px; margin:-32px 0 0 -32px;
  background:rgba(255,81,71,.12); border-color:rgba(255,81,71,.7);
}
.cursor-dot{ width:5px; height:5px; margin:-2.5px 0 0 -2.5px; background:var(--accent-2); }
@media (hover:none),(pointer:coarse){ .cursor,.cursor-dot{ display:none; } }

.grain{
  position:fixed; inset:-120%; z-index:700; pointer-events:none; opacity:.5; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.36'/%3E%3C/svg%3E");
  animation:grain 8s steps(10) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)} 10%{transform:translate(-4%,-4%)} 20%{transform:translate(-8%,2%)}
  30%{transform:translate(3%,-6%)} 40%{transform:translate(-2%,7%)} 50%{transform:translate(-8%,3%)}
  60%{transform:translate(4%,2%)} 70%{transform:translate(0,6%)} 80%{transform:translate(-3%,-4%)}
  90%{transform:translate(6%,0)} 100%{transform:translate(0,0)}
}

.glow-follow{
  position:fixed; width:620px; height:620px; margin:-310px 0 0 -310px; top:0; left:0;
  z-index:0; pointer-events:none; opacity:.5;
  background:radial-gradient(circle, rgba(190,28,45,.18) 0%, rgba(190,28,45,0) 62%);
  transition:opacity .5s;
}

/* =========================================================
   HEADER
   ========================================================= */
.header{
  position:fixed; top:0; left:0; right:0; z-index:600;
  display:flex; align-items:center; gap:24px;
  padding:20px var(--pad);
  border-bottom:1px solid transparent;
  transition:transform .5s var(--e-out), background-color .5s var(--e-out),
             padding .5s var(--e-out), border-color .5s, backdrop-filter .5s;
}
.header.is-stuck{
  padding:13px var(--pad);
  background:rgba(10,10,12,.72);
  backdrop-filter:blur(18px) saturate(140%);
  -webkit-backdrop-filter:blur(18px) saturate(140%);
  border-bottom-color:var(--line);
}
.header.is-hidden{ transform:translateY(-100%); }

.brand{ display:flex; align-items:center; gap:12px; margin-right:auto; }
.brand__mark svg{ overflow:visible; }
.brand__mark{ transition:transform .6s var(--e-out); }
.brand:hover .brand__mark{ transform:rotate(-8deg) scale(1.06); }
.brand__text b{
  display:block; font-family:var(--ff-en); font-weight:700; font-size:17px;
  letter-spacing:-.015em; line-height:1.2;
}
.brand__text em{
  display:block; font-style:normal; font-size:9.5px; letter-spacing:.14em;
  color:var(--fg-3); line-height:1.4; margin-top:2px;
}

.header__nav{ display:flex; align-items:center; gap:clamp(14px,2vw,30px); }
.header__nav > .navitem > a{
  position:relative; font-family:var(--ff-en); font-size:13.5px; font-weight:500; letter-spacing:.06em;
  color:var(--fg-2); padding:6px 0; display:inline-flex; align-items:baseline; gap:6px;
  transition:color .35s;
}
.header__nav > .navitem > a i{
  font-style:normal; font-size:9px; letter-spacing:.1em; color:var(--fg-3);
  transition:color .35s, transform .35s var(--e-out);
}
.header__nav > .navitem > a::after{
  content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:var(--grad); transform:scaleX(0); transform-origin:right;
  transition:transform .45s var(--e-out);
}
.header__nav > .navitem > a:hover, .header__nav > .navitem > a.is-active{ color:#fff; }
.header__nav > .navitem > a:hover i, .header__nav > .navitem > a.is-active i{ color:var(--accent-2); }
.header__nav > .navitem > a:hover::after, .header__nav > .navitem > a.is-active::after{ transform:scaleX(1); transform-origin:left; }

.header__cta{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--ff-en); font-size:13px; font-weight:600; letter-spacing:.05em;
  padding:11px 20px; border-radius:100px; position:relative; overflow:hidden;
  border:1px solid var(--line-2); color:#fff;
}
.header__cta::before{
  content:""; position:absolute; inset:0; background:var(--grad);
  transform:translateY(101%); transition:transform .5s var(--e-out); z-index:-1;
}
.header__cta > *{ position:relative; z-index:1; }
.header__cta:hover{ border-color:transparent; color:#fff; }
.header__cta:hover::before{ transform:translateY(0); }
.header__cta{ isolation:isolate; }

.burger{
  display:none; width:44px; height:44px; border:1px solid var(--line-2); border-radius:50%;
  position:relative; flex:none;
}
.burger span{
  position:absolute; left:13px; width:18px; height:1.5px; background:#fff; border-radius:2px;
  transition:transform .45s var(--e-out), opacity .3s, width .45s var(--e-out);
}
.burger span:nth-child(1){ top:19px; }
.burger span:nth-child(2){ top:25px; width:12px; }
.burger.is-open span:nth-child(1){ transform:translateY(3px) rotate(45deg); }
.burger.is-open span:nth-child(2){ transform:translateY(-3px) rotate(-45deg); width:18px; }

@media (max-width:1080px){
  .header__nav{ display:none; }
  .header__cta{ display:none; }
  .burger{ display:block; }
}

/* =========================================================
   FULLSCREEN MENU
   ========================================================= */
.menu{
  position:fixed; inset:0; z-index:590; visibility:hidden; pointer-events:none;
}
.menu.is-open{ visibility:visible; pointer-events:auto; }
.menu__bg{
  position:absolute; inset:0; background:var(--bg-2);
  clip-path:circle(0% at calc(100% - 42px) 42px);
  transition:clip-path .85s var(--e-out);
}
.menu.is-open .menu__bg{ clip-path:circle(150% at calc(100% - 42px) 42px); }
.menu__bg::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(60% 50% at 80% 10%, rgba(190,28,45,.16), transparent 70%);
}
.menu__inner{
  position:relative; height:100%; max-width:var(--wrap); margin-inline:auto;
  padding:118px var(--pad) 48px;
  display:grid; grid-template-columns:1.4fr .9fr; gap:48px; align-content:center;
  overflow-y:auto;
}
.menu__list{ display:flex; flex-direction:column; }
.menu__list a{
  display:flex; align-items:baseline; gap:16px; padding:clamp(8px,1.2vw,14px) 0;
  border-bottom:1px solid var(--line); position:relative;
  opacity:0; transform:translateY(26px);
}
.menu.is-open .menu__list a{ animation:menuIn .7s var(--e-out) forwards; }
.menu__list a:nth-child(1){ animation-delay:.30s } .menu__list a:nth-child(2){ animation-delay:.36s }
.menu__list a:nth-child(3){ animation-delay:.42s } .menu__list a:nth-child(4){ animation-delay:.48s }
.menu__list a:nth-child(5){ animation-delay:.54s } .menu__list a:nth-child(6){ animation-delay:.60s }
.menu__list a:nth-child(7){ animation-delay:.66s } .menu__list a:nth-child(8){ animation-delay:.72s }
.menu__list a:nth-child(9){ animation-delay:.78s }
@keyframes menuIn{ to{ opacity:1; transform:none; } }
.menu__list i{ font-style:normal; font-family:var(--ff-en); font-size:11px; color:var(--fg-3); letter-spacing:.12em; width:26px; }
.menu__list b{
  font-family:var(--ff-en); font-weight:600; font-size:clamp(26px,4vw,46px); letter-spacing:-.02em;
  line-height:1.15; transition:color .4s, transform .5s var(--e-out); color:var(--fg);
}
.menu__list em{ font-style:normal; font-size:12px; color:var(--fg-3); letter-spacing:.08em; }
.menu__list a::after{
  content:""; position:absolute; left:0; bottom:-1px; height:1px; width:100%; background:var(--grad);
  transform:scaleX(0); transform-origin:left; transition:transform .55s var(--e-out);
}
.menu__list a:hover b{ color:#fff; transform:translateX(10px); }
.menu__list a:hover em{ color:var(--accent-2); }
.menu__list a:hover::after{ transform:scaleX(1); }

.menu__side{ align-self:center; }
.menu__mission{
  font-size:clamp(18px,2vw,24px); font-weight:700; line-height:1.7; margin-bottom:34px;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.menu__meta dt{
  font-family:var(--ff-en); font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent-2); margin-top:22px;
}
.menu__meta dd{ font-size:12.5px; color:var(--fg-2); line-height:1.9; }

@media (max-width:900px){
  .menu__inner{ grid-template-columns:1fr; gap:28px; align-content:start; padding-top:104px; }
  .menu__side{ display:none; }
}

/* =========================================================
   BUTTONS
   ========================================================= */
.btn{
  position:relative; isolation:isolate; overflow:hidden;
  display:inline-flex; align-items:center; gap:10px;
  padding:15px 30px; border-radius:100px;
  font-size:14px; font-weight:700; letter-spacing:.03em;
  transition:color .4s, border-color .4s, transform .4s var(--e-out);
}
.btn--lg{ padding:19px 42px; font-size:15.5px; }
.btn--primary{ background:var(--grad); color:#fff; }
.btn--primary::before{
  content:""; position:absolute; inset:0; z-index:-1; background:#fff;
  transform:translateY(100%); transition:transform .5s var(--e-out);
}
.btn--primary:hover::before{ transform:translateY(0); }
.btn--primary:hover{ color:#0a0a0c; }
.btn--ghost{ border:1px solid var(--line-2); color:var(--fg); }
.btn--ghost::before{
  content:""; position:absolute; inset:0; z-index:-1; background:rgba(255,255,255,.08);
  transform:scaleX(0); transform-origin:right; transition:transform .5s var(--e-out);
}
.btn--ghost:hover{ border-color:rgba(255,255,255,.4); }
.btn--ghost:hover::before{ transform:scaleX(1); transform-origin:left; }
.btn svg{ transition:transform .45s var(--e-out); }
.btn:hover svg{ transform:translateX(5px); }

/* =========================================================
   HERO
   ========================================================= */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:center;
  padding:140px var(--pad) 120px; overflow:hidden;
}
.hero__canvas{ position:absolute; inset:0; width:100%; height:100%; z-index:0; opacity:.95; }
.hero__grid{
  position:absolute; inset:0; z-index:0; opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.028) 1px, transparent 1px);
  background-size:76px 76px;
  mask-image:radial-gradient(120% 90% at 50% 30%, #000 25%, transparent 78%);
  -webkit-mask-image:radial-gradient(120% 90% at 50% 30%, #000 25%, transparent 78%);
}
.hero__ray{
  position:absolute; top:-45%; left:50%; width:170vw; height:150vh; z-index:0;
  transform:translateX(-50%) rotate(-14deg); pointer-events:none; opacity:.9;
  background:
    conic-gradient(from 200deg at 50% 0%,
      transparent 0deg,
      rgba(190,28,45,.16) 12deg,
      rgba(255,81,71,.10) 22deg,
      transparent 34deg,
      transparent 330deg,
      rgba(150,150,160,.12) 344deg,
      transparent 360deg);
  filter:blur(18px); opacity:.5;
  animation:rayShift 16s ease-in-out infinite alternate;
}
@keyframes rayShift{
  from{ transform:translateX(-50%) rotate(-16deg) scale(1); opacity:.75; }
  to  { transform:translateX(-48%) rotate(-8deg)  scale(1.08); opacity:1; }
}
.hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:220px; z-index:1;
  background:linear-gradient(to bottom, transparent, var(--bg));
  pointer-events:none;
}

.hero__inner{
  position:relative; z-index:3; width:100%; max-width:var(--wrap); margin-inline:auto;
}

@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(255,81,71,.55); }
  70%{ box-shadow:0 0 0 12px rgba(255,81,71,0); }
  100%{ box-shadow:0 0 0 0 rgba(255,81,71,0); }
}

.hero__title{
  margin:28px 0 18px;
  font-size:clamp(38px, 7.4vw, 104px);
  font-weight:900; line-height:1.12; letter-spacing:-.035em;
}
.hero__title .line{ display:block; overflow:hidden; }
.hero__title b{
  font-weight:900; position:relative; white-space:nowrap;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.hero__title .char{
  display:inline-block; transform:translateY(110%) rotate(6deg); opacity:0;
  will-change:transform;
}
.is-ready .hero__title .char{ animation:charUp .95s var(--e-out) forwards; }
@keyframes charUp{ to{ transform:none; opacity:1; } }

.hero__en{
  font-family:var(--ff-en); font-size:clamp(11px,1.35vw,15px); font-weight:300;
  letter-spacing:.32em; text-transform:uppercase; color:var(--fg-3);
  display:flex; flex-wrap:wrap; gap:.32em; margin-bottom:30px;
}
.hero__en span{ display:inline-block; opacity:0; transform:translateY(14px); }
.is-ready .hero__en span{ animation:wordUp .8s var(--e-out) forwards; }
@keyframes wordUp{ to{ opacity:1; transform:none; } }

.hero__lead{
  max-width:640px; font-size:clamp(14px,1.5vw,16.5px); color:var(--fg-2); line-height:2.1;
}
.hero__lead b{
  color:#fff; font-weight:700;
  background:linear-gradient(transparent 62%, rgba(255,81,71,.24) 62%);
}
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:38px; }

.hero__side{
  position:absolute; right:calc(var(--pad) - 6px); top:50%; transform:translateY(-50%); z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:16px;
}
.hero__side span{
  writing-mode:vertical-rl; font-family:var(--ff-en); font-size:10.5px; letter-spacing:.42em;
  color:var(--fg-3); text-transform:uppercase;
}
.hero__side i{ width:1px; height:64px; background:linear-gradient(var(--accent-2), transparent); }

.hero__scroll{
  position:absolute; left:50%; bottom:34px; transform:translateX(-50%); z-index:3;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.hero__scroll span{
  font-family:var(--ff-en); font-size:9.5px; letter-spacing:.36em; color:var(--fg-3);
}
.hero__scroll i{ position:relative; display:block; width:1px; height:58px; background:var(--line-2); overflow:hidden; }
.hero__scroll i::after{
  content:""; position:absolute; inset:0; background:var(--accent-2);
  animation:scrollLine 2s var(--e-io) infinite;
}
@keyframes scrollLine{
  0%{ transform:translateY(-100%); } 55%{ transform:translateY(0); } 100%{ transform:translateY(100%); }
}
@media (max-width:900px){
  .hero__side{ display:none; }
  .sp-only{ display:inline; }
}

/* =========================================================
   MARQUEE
   ========================================================= */
.marquee{
  position:relative; z-index:3; overflow:hidden;
  border-block:1px solid var(--line);
  background:linear-gradient(90deg, rgba(190,28,45,.05), rgba(255,81,71,.05));
  padding:16px 0;
}
.marquee__track{
  display:flex; align-items:center; gap:34px; width:max-content;
  animation:marquee 34s linear infinite;
}
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee span{
  font-family:var(--ff-en); font-size:clamp(14px,1.7vw,20px); font-weight:600;
  letter-spacing:.14em; color:var(--fg-2); white-space:nowrap;
}
.marquee b{ color:var(--accent-2); font-size:9px; }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* =========================================================
   SECTION SHELL
   ========================================================= */
.section{ position:relative; padding-block:var(--sec-y); overflow:hidden; }
.section + .section{ border-top:1px solid rgba(255,255,255,.05); }
.section__bgnum{
  position:absolute; top:clamp(20px,4vw,60px); left:50%; transform:translateX(-50%);
  font-family:var(--ff-en); font-weight:800; font-size:clamp(90px, 17vw, 260px);
  letter-spacing:-.04em; line-height:1; white-space:nowrap; pointer-events:none; z-index:0;
  color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.045);
}

.sechead{ margin-bottom:clamp(46px,6vw,86px); max-width:900px; }
.sechead__label{
  display:inline-flex; align-items:center; gap:12px; margin-bottom:22px;
  font-family:var(--ff-en); font-size:12px; font-weight:600; letter-spacing:.28em; text-transform:uppercase;
  color:var(--accent-2);
}
.sechead__label i{
  font-style:normal; font-size:11px; color:var(--fg-3); padding-right:12px;
  border-right:1px solid var(--line-2);
}
.sechead__title{
  font-size:clamp(26px,4.4vw,58px); font-weight:800; line-height:1.35; letter-spacing:-.03em;
}
.sechead__title span{ display:block; overflow:hidden; }
.sechead__title span > i{
  font-style:normal; display:block; transform:translateY(110%);
  transition:transform 1s var(--e-out);
}
.reveal-mask.is-in span > i{ transform:none; }
.reveal-mask.is-in span:nth-child(2) > i{ transition-delay:.1s; }
.reveal-mask.is-in span:nth-child(3) > i{ transition-delay:.2s; }
.sechead__title b{
  font-weight:800; background:var(--grad);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.sechead__lead{
  margin-top:26px; font-size:clamp(14px,1.4vw,16px); color:var(--fg-2); line-height:2.15;
}
.sechead__lead b{ color:#fff; font-weight:700; }

/* =========================================================
   REVEAL ANIMATIONS
   ========================================================= */
.reveal-up{ opacity:0; transform:translateY(38px); transition:opacity .95s var(--e-out), transform .95s var(--e-out); }
.reveal-up.is-in{ opacity:1; transform:none; }
.reveal-card{
  opacity:0; transform:translateY(52px) scale(.975);
  transition:opacity 1s var(--e-out), transform 1s var(--e-out);
}
.reveal-card.is-in{ opacity:1; transform:none; }
[data-stagger]{ transition-delay:calc(var(--i,0) * 110ms); }

/* =========================================================
   ABOUT — pillars & stats
   ========================================================= */
.pillars{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(18px,2.2vw,28px); }
.pillar{
  position:relative; overflow:hidden; isolation:isolate;
  padding:clamp(28px,3.2vw,46px);
  border:1px solid var(--line); border-radius:20px;
  background:linear-gradient(160deg, rgba(255,255,255,.045), rgba(255,255,255,.012));
  transition:border-color .6s, transform .6s var(--e-out), box-shadow .6s;
  transform-style:preserve-3d;
}
.pillar:hover{
  border-color:rgba(255,81,71,.36);
  box-shadow:0 26px 70px -32px rgba(190,28,45,.55);
}
.pillar__shine{
  position:absolute; inset:0; z-index:-1; opacity:0; transition:opacity .6s;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%), rgba(255,81,71,.14), transparent 62%);
}
.pillar:hover .pillar__shine{ opacity:1; }
.pillar__num{
  font-family:var(--ff-en); font-weight:800; font-size:clamp(40px,5vw,66px); line-height:1;
  letter-spacing:-.04em; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.2);
  margin-bottom:22px; transition:-webkit-text-stroke-color .6s;
}
.pillar:hover .pillar__num{ -webkit-text-stroke-color:rgba(255,81,71,.7); }
.pillar__cat{
  font-family:var(--ff-en); font-size:11.5px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:10px; display:flex; flex-wrap:wrap; align-items:center; gap:10px;
}
.pillar__badge{
  font-family:var(--ff-jp); font-size:10px; letter-spacing:.06em; text-transform:none;
  padding:3px 10px; border-radius:100px; background:rgba(150,150,160,.18);
  border:1px solid rgba(150,150,160,.5); color:#dcdce1;
}
.pillar__title{ font-size:clamp(20px,2.4vw,30px); font-weight:800; line-height:1.5; letter-spacing:-.02em; margin-bottom:16px; }
.pillar__text{ font-size:14.5px; color:var(--fg-2); line-height:2.05; }
.pillar__text b{ color:#fff; }
.pillar__tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.pillar__tags li{
  font-size:11.5px; letter-spacing:.04em; color:var(--fg-2);
  padding:5px 13px; border:1px solid var(--line); border-radius:100px;
  background:rgba(255,255,255,.03);
}

.stats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  margin-top:clamp(40px,5vw,72px); background:var(--line);
  border:1px solid var(--line); border-radius:16px; overflow:hidden;
}
.stat{ background:var(--bg); padding:clamp(24px,2.6vw,34px); transition:background-color .5s; }
.stat:hover{ background:var(--bg-3); }
.stat b{
  display:flex; align-items:baseline; gap:4px;
  font-family:var(--ff-en); font-weight:800; font-size:clamp(34px,4.4vw,54px);
  letter-spacing:-.04em; line-height:1;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat b i{ font-family:var(--ff-jp); font-style:normal; font-size:13px; font-weight:700; letter-spacing:0; }
.stat p{ margin-top:14px; font-size:12.5px; color:var(--fg-3); line-height:1.85; }

@media (max-width:900px){
  .pillars{ grid-template-columns:1fr; }
  .stats{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:520px){ .stats{ grid-template-columns:1fr; } }

/* =========================================================
   SERVICE
   ========================================================= */
.svc{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,24px); }
.svc__card{
  position:relative; overflow:hidden;
  padding:clamp(28px,3vw,42px) clamp(24px,2.6vw,36px) clamp(34px,3.4vw,48px);
  border:1px solid var(--line); border-radius:20px; background:var(--bg-2);
  transition:transform .7s var(--e-out), border-color .6s, background-color .6s;
}
.svc__card:hover{ transform:translateY(-10px); border-color:rgba(255,81,71,.3); background:var(--bg-3); }
.svc__idx{
  position:absolute; top:22px; right:26px;
  font-family:var(--ff-en); font-size:12px; letter-spacing:.16em; color:var(--fg-3);
}
.svc__icon{
  width:64px; height:64px; display:grid; place-items:center; border-radius:16px;
  border:1px solid var(--line-2); color:var(--accent-2); margin-bottom:26px;
  background:rgba(255,81,71,.05);
  transition:transform .7s var(--e-out), background-color .6s, box-shadow .6s;
}
.svc__icon svg{ width:30px; height:30px; }
.svc__card:hover .svc__icon{
  transform:rotate(-8deg) scale(1.08);
  background:rgba(255,81,71,.14);
  box-shadow:0 0 34px -8px rgba(255,81,71,.55);
}
.svc__card h3{ font-size:clamp(21px,2.2vw,26px); font-weight:800; letter-spacing:-.02em; }
.svc__en{
  font-family:var(--ff-en); font-size:11px; letter-spacing:.26em; text-transform:uppercase;
  color:var(--fg-3); margin:6px 0 18px;
}
.svc__desc{ font-size:13.8px; color:var(--fg-2); line-height:2.05; min-height:5.6em; }
.svc__list{ margin-top:22px; border-top:1px solid var(--line); }
.svc__list li{
  display:flex; align-items:center; gap:10px; padding:13px 2px;
  border-bottom:1px solid var(--line); font-size:13.5px; color:var(--fg);
  transition:padding-left .45s var(--e-out), color .45s;
}
.svc__list li::before{
  content:""; width:5px; height:5px; border-radius:50%; background:var(--accent-2); flex:none;
  transition:transform .45s var(--e-out), box-shadow .45s;
}
.svc__list li:hover{ padding-left:8px; color:#fff; }
.svc__list li:hover::before{ transform:scale(1.6); box-shadow:0 0 12px rgba(255,81,71,.8); }
.svc__line{
  position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--grad);
  transform:scaleX(0); transform-origin:left; transition:transform .7s var(--e-out);
}
.svc__card:hover .svc__line{ transform:scaleX(1); }

@media (max-width:960px){ .svc{ grid-template-columns:1fr; } .svc__desc{ min-height:0; } }

/* =========================================================
   STRENGTH
   ========================================================= */
.str{ border-top:1px solid var(--line); }
.str__row{
  display:grid; grid-template-columns:210px 1fr; gap:clamp(22px,4vw,64px);
  padding:clamp(38px,4.6vw,68px) 0; border-bottom:1px solid var(--line);
  position:relative; transition:background-color .6s;
}
.str__row::before{
  content:""; position:absolute; left:-100vw; right:-100vw; top:0; bottom:0; z-index:-1;
  background:linear-gradient(90deg, transparent, rgba(190,28,45,.05), transparent);
  opacity:0; transition:opacity .6s;
}
.str__row:hover::before{ opacity:1; }
.str__num span{
  font-family:var(--ff-en); font-weight:800; font-size:clamp(58px,8vw,120px); line-height:.9;
  letter-spacing:-.05em; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.22);
  display:block; transition:-webkit-text-stroke-color .6s, transform .8s var(--e-out);
}
.str__row:hover .str__num span{ -webkit-text-stroke-color:rgba(255,81,71,.75); transform:translateX(6px); }
.str__body h3{
  font-size:clamp(20px,2.6vw,32px); font-weight:800; line-height:1.6; letter-spacing:-.02em; margin-bottom:20px;
}
.str__body p{ font-size:14.5px; color:var(--fg-2); line-height:2.15; max-width:820px; }
.str__body p b{ color:#fff; background:linear-gradient(transparent 62%, rgba(255,81,71,.22) 62%); }
.str__chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.str__chips li{
  font-size:11.5px; padding:6px 14px; border-radius:100px;
  border:1px solid var(--line); color:var(--fg-2); background:rgba(255,255,255,.03);
  transition:border-color .4s, color .4s, transform .4s var(--e-out);
}
.str__chips li:hover{ border-color:rgba(255,81,71,.5); color:#fff; transform:translateY(-3px); }

@media (max-width:820px){ .str__row{ grid-template-columns:1fr; } }

/* =========================================================
   MEMBER
   ========================================================= */
/* メンバーは1人1行の縦並び。カード内は「左＝プロフィール／右＝経歴」の2カラム */
.mem{ display:grid; grid-template-columns:1fr; gap:clamp(14px,1.7vw,20px); }
.mem__card{
  position:relative; overflow:hidden; isolation:isolate;
  padding:clamp(26px,3vw,40px); border:1px solid var(--line); border-radius:20px;
  background:linear-gradient(160deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
  transition:border-color .6s, transform .6s var(--e-out);
  display:grid; grid-template-columns:minmax(200px,264px) 1fr;
  column-gap:clamp(24px,3.4vw,56px); row-gap:16px; align-items:start;
}
.mem__card:hover{ border-color:rgba(150,150,160,.4); transform:translateY(-6px); }
.mem__glow{
  position:absolute; inset:auto -30% -60% -30%; height:200px; z-index:-1; opacity:0;
  background:radial-gradient(50% 100% at 50% 100%, rgba(150,150,160,.35), transparent 70%);
  transition:opacity .7s;
}
.mem__card:hover .mem__glow{ opacity:1; }
.mem__head{
  grid-column:1; grid-row:1 / span 2;
  display:flex; flex-direction:column; align-items:flex-start; gap:16px; margin-bottom:0;
}
.mem__avatar{
  width:64px; height:64px; flex:none; border-radius:50%; display:grid; place-items:center;
  font-family:var(--ff-en); font-weight:700; font-size:19px; letter-spacing:.02em; color:#fff;
  background:var(--grad); position:relative;
  transition:transform .7s var(--e-out);
}
.mem__avatar::after{
  content:""; position:absolute; inset:-5px; border-radius:50%;
  border:1px solid rgba(255,81,71,.35); opacity:0; transform:scale(.85);
  transition:opacity .6s, transform .6s var(--e-out);
}
.mem__card:hover .mem__avatar{ transform:scale(1.06); }
.mem__card:hover .mem__avatar::after{ opacity:1; transform:scale(1); }
.mem__role{
  font-family:var(--ff-en); font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:5px;
}
.mem__name{ font-size:clamp(19px,2.1vw,25px); font-weight:800; letter-spacing:-.01em; line-height:1.3; }
.mem__name em{
  display:block; font-style:normal; font-family:var(--ff-en); font-size:11px;
  letter-spacing:.16em; color:var(--fg-3); font-weight:400; margin-top:5px;
}
.mem__bio{ grid-column:2; grid-row:1; font-size:13.4px; color:var(--fg-2); line-height:2.05; }
.mem__link{
  grid-column:2; grid-row:2; justify-self:start;
  display:inline-flex; align-items:center; gap:6px; margin-top:0;
  font-family:var(--ff-en); font-size:12px; letter-spacing:.08em; color:var(--accent-2);
  padding-bottom:3px; border-bottom:1px solid rgba(255,81,71,.3);
  transition:color .4s, border-color .4s, gap .4s var(--e-out);
}
.mem__link:hover{ color:#fff; border-color:#fff; gap:11px; }

.mem__origin{
  margin-top:clamp(34px,4vw,56px); padding-top:32px; border-top:1px solid var(--line);
  display:flex; flex-wrap:wrap; align-items:center; gap:14px 28px;
}
.mem__origin-label{
  font-size:12px; letter-spacing:.14em; color:var(--fg-3);
  padding-right:26px; border-right:1px solid var(--line);
}
.mem__origin ul{ display:flex; flex-wrap:wrap; gap:10px 12px; }
.mem__origin li{
  font-family:var(--ff-en); font-size:13px; font-weight:500; letter-spacing:.04em; color:var(--fg-2);
  padding:7px 16px; border:1px solid var(--line); border-radius:8px;
  transition:color .4s, border-color .4s, background-color .4s;
}
.mem__origin li:hover{ color:#fff; border-color:var(--line-2); background:rgba(255,255,255,.04); }

@media (max-width:860px){
  .mem__card{ grid-template-columns:1fr; row-gap:20px; }
  .mem__head{ grid-column:1; grid-row:auto; flex-direction:row; align-items:center; gap:18px; }
  .mem__bio,
  .mem__link{ grid-column:1; grid-row:auto; }
}

/* =========================================================
   WORKS / CASE
   ========================================================= */
.case{
  border:1px solid var(--line); border-radius:22px; overflow:hidden;
  background:linear-gradient(165deg, rgba(255,255,255,.045), rgba(255,255,255,.008));
}
.case__head{
  display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:26px;
  padding:clamp(28px,3.2vw,46px); border-bottom:1px solid var(--line);
  background:radial-gradient(90% 140% at 0% 0%, rgba(190,28,45,.12), transparent 60%);
}
.case__tag{
  font-family:var(--ff-en); font-size:11.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:14px;
}
.case__client{ font-size:clamp(24px,3.4vw,42px); font-weight:800; letter-spacing:-.025em; line-height:1.3; }
.case__sub{ font-size:13px; color:var(--fg-3); margin-top:8px; }
.case__license{
  text-align:right; padding:16px 22px; border:1px solid var(--line-2); border-radius:14px;
  background:rgba(255,255,255,.03);
}
.case__license span{
  display:block; font-family:var(--ff-en); font-size:10px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--fg-3); margin-bottom:6px;
}
.case__license b{ font-size:13.5px; font-weight:700; line-height:1.6; }

.case__ba{
  display:grid; grid-template-columns:1fr auto 1fr; align-items:stretch; gap:0;
}
.case__col{ padding:clamp(26px,3vw,44px); }
.case__col--before{ border-right:1px solid var(--line); }
.case__col--after{ border-left:1px solid var(--line); background:rgba(255,81,71,.035); }
.case__coltitle{
  display:flex; align-items:center; gap:12px; margin-bottom:22px;
  font-size:13px; font-weight:700; letter-spacing:.06em; color:var(--fg-2);
}
.case__coltitle i{
  font-style:normal; font-family:var(--ff-en); font-size:10px; letter-spacing:.2em;
  text-transform:uppercase; padding:4px 11px; border-radius:100px;
  border:1px solid var(--line-2); color:var(--fg-3);
}
.case__col--after .case__coltitle i{ border-color:rgba(255,81,71,.5); color:var(--accent-2); }
.case__col ul li{
  position:relative; padding-left:22px; font-size:14px; color:var(--fg-2); line-height:2.05;
}
.case__col ul li + li{ margin-top:16px; }
.case__col ul li::before{
  content:""; position:absolute; left:0; top:13px; width:9px; height:1px; background:var(--fg-3);
}
.case__col--after ul li::before{ background:var(--accent-2); width:12px; box-shadow:0 0 10px rgba(255,81,71,.8); }
.case__col--after ul li{ color:var(--fg); }
.case__arrow{
  display:grid; place-items:center; width:86px; color:var(--accent-2);
  background:linear-gradient(90deg, transparent, rgba(255,81,71,.07), transparent);
}
.case__arrow svg{ width:52px; animation:arrowNudge 2.6s var(--e-io) infinite; }
@keyframes arrowNudge{ 0%,100%{ transform:translateX(-4px); opacity:.55 } 50%{ transform:translateX(4px); opacity:1 } }

@media (max-width:880px){
  .case__ba{ grid-template-columns:1fr; }
  .case__col--before{ border-right:0; border-bottom:1px solid var(--line); }
  .case__col--after{ border-left:0; }
  .case__arrow{ width:100%; height:64px; }
  .case__arrow svg{ transform:rotate(90deg); }
  .case__license{ text-align:left; }
}

/* =========================================================
   COMPANY
   ========================================================= */
.cinfo{ border-top:1px solid var(--line); }
.cinfo__row{
  display:grid; grid-template-columns:220px 1fr; gap:20px;
  padding:clamp(20px,2.4vw,30px) 6px; border-bottom:1px solid var(--line);
  transition:background-color .5s, padding-left .5s var(--e-out);
}
.cinfo__row:hover{ background:rgba(255,255,255,.025); padding-left:16px; }
.cinfo dt{
  font-size:12.5px; font-weight:700; letter-spacing:.14em; color:var(--accent-2);
  display:flex; align-items:center; gap:10px;
}
.cinfo dt::before{ content:""; width:14px; height:1px; background:var(--accent-2); flex:none; }
.cinfo dd{ font-size:15px; line-height:2; color:var(--fg); }

@media (max-width:680px){ .cinfo__row{ grid-template-columns:1fr; gap:8px; } }

/* =========================================================
   CONTACT
   ========================================================= */
.cta{ text-align:center; }
.cta__glow{
  position:absolute; left:50%; top:50%; width:min(1100px,120vw); height:660px;
  transform:translate(-50%,-50%); z-index:0; pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%, rgba(190,28,45,.20), transparent 68%);
  animation:breathe 7s ease-in-out infinite alternate;
}
@keyframes breathe{ from{ transform:translate(-50%,-50%) scale(.9); opacity:.7 } to{ transform:translate(-50%,-50%) scale(1.1); opacity:1 } }
.cta .sechead__label{ margin-inline:auto; }
.cta__title{
  font-size:clamp(28px,5.4vw,68px); font-weight:900; line-height:1.28; letter-spacing:-.035em;
}
.cta__title span{ display:block; overflow:hidden; }
.cta__title span > i{ font-style:normal; display:block; transform:translateY(110%); transition:transform 1s var(--e-out); }
.cta__title b{
  font-weight:900; background:var(--grad);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.cta__lead{ margin-top:26px; font-size:clamp(13.5px,1.4vw,15.5px); color:var(--fg-2); line-height:2.15; }
.cta__actions{ margin-top:42px; display:flex; justify-content:center; }

/* =========================================================
   FOOTER
   ========================================================= */
.footer{ border-top:1px solid var(--line); background:var(--bg-2); position:relative; z-index:2; }
.footer__inner{
  display:grid; grid-template-columns:1.2fr 1fr; gap:40px;
  padding-block:clamp(48px,5vw,76px);
}
.footer__logo{
  font-family:var(--ff-en); font-weight:800; font-size:clamp(26px,3.4vw,40px); letter-spacing:-.03em;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.footer__mission{ margin-top:12px; font-size:14px; font-weight:700; color:var(--fg); }
.footer__addr{ margin-top:16px; font-size:12.5px; color:var(--fg-3); line-height:1.9; }
.footer__nav{
  display:grid; grid-template-columns:repeat(2,1fr); gap:10px 20px; align-content:start;
}
.footer__nav a{
  font-family:var(--ff-en); font-size:13.5px; letter-spacing:.06em; color:var(--fg-2);
  display:inline-flex; align-items:center; gap:8px; width:fit-content;
  transition:color .4s, gap .4s var(--e-out);
}
.footer__nav a::before{
  content:""; width:0; height:1px; background:var(--accent-2); transition:width .4s var(--e-out);
}
.footer__nav a:hover{ color:#fff; }
.footer__nav a:hover::before{ width:16px; }

.footer__bottom{
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  padding-block:22px; border-top:1px solid var(--line);
}
.footer__bottom small{ font-family:var(--ff-en); font-size:11.5px; letter-spacing:.08em; color:var(--fg-3); }
.totop{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--ff-en); font-size:11px; letter-spacing:.2em; color:var(--fg-2);
  padding:10px 18px; border:1px solid var(--line-2); border-radius:100px;
  transition:color .4s, border-color .4s, background-color .4s;
}
.totop:hover{ color:#0a0a0c; background:var(--accent-2); border-color:transparent; }
.totop svg{ transition:transform .45s var(--e-out); }
.totop:hover svg{ transform:translateY(-3px); }

@media (max-width:760px){
  .footer__inner{ grid-template-columns:1fr; }
  .footer__bottom{ flex-direction:column; align-items:flex-start; }
}

/* =========================================================
   REDUCED MOTION
   ========================================================= */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important;
  }
  .reveal-up,.reveal-card{ opacity:1 !important; transform:none !important; }
  .sechead__title span > i,.cta__title span > i{ transform:none !important; }
  .hero__title .char,.hero__en span{ opacity:1 !important; transform:none !important; }
  .grain,.hero__ray,.pt{ display:none; }
  .page{ animation:none !important; }
}

/* =========================================================
   PAGE TRANSITION（画面遷移カーテン）
   ========================================================= */
.pt{
  position:fixed; inset:0; z-index:8000; pointer-events:none;
  display:grid; grid-template-columns:repeat(3,1fr);
}
.pt span{
  display:block; background:var(--bg-3);
  transform:scaleY(0); transform-origin:bottom;
  transition:transform .58s var(--e-io);
  box-shadow:0 -30px 60px -30px rgba(255,81,71,.35);
}
.pt span:nth-child(2){ transition-delay:.07s; }
.pt span:nth-child(3){ transition-delay:.14s; }
.pt.is-in{ pointer-events:auto; }
.pt.is-in span{ transform:scaleY(1); }
/* 退場（疑似ルーターのプレビューで使用）：上方向へ抜ける */
.pt.is-out span{ transform-origin:top; transform:scaleY(0); }

/* 遷移先ページの入場 */
.page{ animation:pageIn .9s var(--e-out) both; }
@keyframes pageIn{
  from{ opacity:0; transform:translateY(22px); }
  to  { opacity:1; transform:none; }
}

/* =========================================================
   PAGE HERO（下層ページの見出し）
   ========================================================= */
.phero{
  position:relative; overflow:hidden;
  padding:clamp(130px,15vw,190px) 0 clamp(48px,6vw,84px);
  border-bottom:1px solid var(--line);
}
.phero__bg{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(70% 90% at 12% 0%, rgba(190,28,45,.20), transparent 62%),
    radial-gradient(60% 80% at 88% 10%, rgba(255,81,71,.12), transparent 64%);
}
.phero::after{
  content:""; position:absolute; inset:0; z-index:0; opacity:.5; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:76px 76px;
  mask-image:radial-gradient(120% 100% at 30% 0%, #000 10%, transparent 72%);
  -webkit-mask-image:radial-gradient(120% 100% at 30% 0%, #000 10%, transparent 72%);
}
.crumb{
  display:flex; align-items:center; gap:10px; margin-bottom:26px;
  font-family:var(--ff-en); font-size:11.5px; letter-spacing:.14em; color:var(--fg-3);
}
.crumb a{ transition:color .35s; }
.crumb a:hover{ color:var(--accent-2); }
.crumb b{ color:var(--fg); font-weight:500; }
/* 英字タイトルの右隣に置くサービスロゴ（Salesforce など） */
.phero__head{
  display:flex; flex-wrap:nowrap; align-items:center;
  gap:clamp(14px,2.2vw,34px);
}
.phero__head .phero__en{ min-width:0; }
.phero__logo{ flex:none; animation:pheroIn 1s .18s var(--e-out) both; }
.phero__logo img{ display:block; width:auto; height:clamp(40px,4.6vw,62px); }
@media (max-width:700px){
  .phero__head{ flex-wrap:wrap; gap:14px; }
  .phero__logo img{ height:38px; }
}
.phero__en{
  font-family:var(--ff-en); font-weight:800; letter-spacing:-.03em; line-height:1;
  font-size:clamp(44px,9vw,110px);
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:pheroIn 1s .1s var(--e-out) both;
}
.phero__title{
  margin-top:10px; font-size:clamp(20px,2.6vw,30px); font-weight:800; letter-spacing:.02em;
  animation:pheroIn 1s .22s var(--e-out) both;
}
.phero__lead{
  margin-top:24px; max-width:760px; font-size:clamp(13.5px,1.4vw,15.5px);
  color:var(--fg-2); line-height:2.1;
  animation:pheroIn 1s .34s var(--e-out) both;
}
@keyframes pheroIn{ from{ opacity:0; transform:translateY(26px); } to{ opacity:1; transform:none; } }

/* 下層ページはセクション上部の余白を少し詰める */
.phero + .section{ padding-top:clamp(70px,9vw,130px); }

/* =========================================================
   LINK ARROW / SEE MORE
   ========================================================= */
.seemore{ margin-top:clamp(34px,4vw,52px); }
.link-arrow{
  display:inline-flex; align-items:center; gap:12px;
  font-size:14px; font-weight:700; letter-spacing:.02em;
  padding-bottom:10px; border-bottom:1px solid var(--line-2);
  transition:color .4s, border-color .4s, gap .4s var(--e-out);
}
.link-arrow svg{ color:var(--accent-2); transition:transform .45s var(--e-out); }
.link-arrow:hover{ color:#fff; border-color:var(--accent-2); gap:20px; }
.link-arrow:hover svg{ transform:translateX(4px); }

/* =========================================================
   CASE CARD（トップの実績カード）
   ========================================================= */
.casecard{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:clamp(26px,3.2vw,44px); border:1px solid var(--line); border-radius:20px;
  background:linear-gradient(120deg, rgba(190,28,45,.10), rgba(255,255,255,.02));
  transition:border-color .6s, transform .6s var(--e-out), background-color .6s;
}
.casecard:hover{ border-color:rgba(255,81,71,.4); transform:translateY(-6px); }
.casecard__arrow{
  flex:none; width:56px; height:56px; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--line-2); color:var(--accent-2);
  transition:background-color .45s, color .45s, transform .5s var(--e-out);
}
.casecard:hover .casecard__arrow{ background:var(--accent-2); color:#0a0a0c; transform:rotate(-45deg); }
@media (max-width:640px){ .casecard{ flex-direction:column; align-items:flex-start; } }

/* =========================================================
   FLOW（サービスの進め方）
   ========================================================= */
.flow{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,1.8vw,22px); }
.flow__step{
  position:relative; padding:clamp(24px,2.6vw,34px);
  border:1px solid var(--line); border-radius:18px; background:var(--bg-2);
  transition:transform .6s var(--e-out), border-color .6s;
}
.flow__step:hover{ transform:translateY(-8px); border-color:rgba(255,81,71,.32); }
.flow__num{ display:flex; align-items:baseline; gap:8px; margin-bottom:14px; font-family:var(--ff-en); color:var(--fg-3); }
.flow__num i{ font-style:normal; font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; }
.flow__num b{
  font-size:clamp(28px,3.2vw,40px); font-weight:800; letter-spacing:-.04em; line-height:1;
  background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.flow__step h3{ font-size:clamp(16px,1.8vw,19px); font-weight:800; margin-bottom:10px; }
.flow__text{ font-size:13.2px; color:var(--fg-2); line-height:2; }
@media (max-width:960px){ .flow{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .flow{ grid-template-columns:1fr; } }

/* =========================================================
   CONTACT PAGE
   ========================================================= */
.ct{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,4vw,60px); align-items:start; }
/* 左のリード列を置かず、フォームだけを中央に配置する場合 */
.ct--formonly{ grid-template-columns:minmax(0,640px); justify-content:center; }
.ct__lead .sechead{ margin-bottom:36px; }
.ct__info dt{
  font-family:var(--ff-en); font-size:10.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent-2); margin-top:24px;
}
.ct__info dd{ font-size:14.5px; color:var(--fg); line-height:1.95; margin-top:6px; }
.ct__info a{ border-bottom:1px solid rgba(255,81,71,.4); transition:color .4s, border-color .4s; }
.ct__info a:hover{ color:var(--accent-2); border-color:var(--accent-2); }

.ct__formwrap{
  padding:clamp(26px,3vw,42px); border:1px solid var(--line); border-radius:20px;
  background:linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.012));
}
.ct__formnote{ font-size:12px; color:var(--fg-3); line-height:1.9; margin-bottom:24px; }
.field{ display:block; margin-bottom:20px; }
.field__label{
  display:flex; align-items:center; gap:8px; margin-bottom:9px;
  font-size:12.5px; font-weight:700; letter-spacing:.06em; color:var(--fg-2);
}
.field__label i{
  font-style:normal; font-size:10px; letter-spacing:.08em; padding:2px 8px; border-radius:100px;
  background:rgba(255,81,71,.12); border:1px solid rgba(255,81,71,.4); color:var(--accent-2);
}
.field__input{
  width:100%; padding:13px 16px; border-radius:12px;
  border:1px solid var(--line-2); background:rgba(8,8,10,.55); color:var(--fg);
  font-family:var(--ff-jp); font-size:14.5px; line-height:1.7;
  transition:border-color .35s, background-color .35s, box-shadow .35s;
}
.field__input::placeholder{ color:#6d6d76; }
.field__input:focus{
  outline:none; border-color:rgba(255,81,71,.6); background:rgba(8,8,10,.8);
  box-shadow:0 0 0 3px rgba(255,81,71,.12);
}
.field__input--area{ resize:vertical; min-height:120px; }
select.field__input{ appearance:none; cursor:pointer;
  background-image:linear-gradient(45deg,transparent 50%,#8a8a93 50%),linear-gradient(135deg,#8a8a93 50%,transparent 50%);
  background-position:calc(100% - 20px) 22px, calc(100% - 14px) 22px;
  background-size:6px 6px, 6px 6px; background-repeat:no-repeat;
}
.btn--block{ width:100%; justify-content:center; margin-top:8px; }
@media (max-width:880px){ .ct{ grid-template-columns:1fr; } }

/* =========================================================
   NEXT NAV（次のページへ）
   ========================================================= */
.nextnav{ border-top:1px solid var(--line); background:var(--bg-2); }
.nextnav__inner{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; padding-inline:0; }
.nextnav__item{
  position:relative; overflow:hidden; isolation:isolate;
  display:flex; align-items:center; gap:16px;
  padding:clamp(30px,4vw,54px) var(--pad);
  border-left:1px solid var(--line);
  transition:color .4s;
}
.nextnav__item:first-child{ border-left:0; }
.nextnav__item::before{
  content:""; position:absolute; inset:0; z-index:-1; background:var(--grad-soft);
  transform:translateY(101%); transition:transform .6s var(--e-out);
}
.nextnav__item:hover::before{ transform:translateY(0); }
.nextnav__en{
  font-family:var(--ff-en); font-size:clamp(22px,3vw,38px); font-weight:700; letter-spacing:-.02em;
  transition:transform .6s var(--e-out);
}
.nextnav__item:hover .nextnav__en{ transform:translateX(8px); }
.nextnav__ja{ font-size:12.5px; color:var(--fg-3); margin-right:auto; }
.nextnav__arrow{
  flex:none; width:44px; height:44px; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--line-2); color:var(--accent-2);
  transition:background-color .45s, color .45s, transform .5s var(--e-out);
}
.nextnav__item:hover .nextnav__arrow{ background:var(--accent-2); color:#0a0a0c; transform:rotate(-45deg); }
@media (max-width:700px){
  .nextnav__inner{ grid-template-columns:1fr; }
  .nextnav__item{ border-left:0; border-top:1px solid var(--line); }
  .nextnav__item:first-child{ border-top:0; }
}

/* アクティブなメニュー項目 */
.menu__list a.is-active b{ color:#fff; }
.menu__list a.is-active em{ color:var(--accent-2); }
.menu__list a.is-active::after{ transform:scaleX(1); }

/* =========================================================
   MEGA MENU（グローバルナビのドロップダウン）
   ========================================================= */
.navitem{ position:relative; display:flex; align-items:center; }
/* メガメニューを画面全幅に出すため、包含ブロックを .header（position:fixed）にする */
.navitem--mega{ position:static; padding-block:20px; margin-block:-20px; }
.navitem__chev{ margin-left:5px; transition:transform .4s var(--e-out); }
.navitem--mega:hover .navitem__chev,
.navitem--mega:focus-within .navitem__chev{ transform:rotate(180deg); }

.mega{
  position:absolute; top:100%; left:0; right:0; z-index:580;
  opacity:0; visibility:hidden; transform:translateY(-10px);
  transition:opacity .38s var(--e-out), transform .45s var(--e-out), visibility .38s;
}
.navitem--mega:hover .mega,
.navitem--mega:focus-within .mega{ opacity:1; visibility:visible; transform:translateY(0); }

.mega__inner{
  position:relative;
  background:var(--bg-3);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.9);
  display:grid; grid-template-columns:230px 1fr;
  gap:clamp(24px,3vw,48px);
  padding:clamp(28px,3vw,44px) var(--pad) clamp(30px,3vw,44px);
}
.mega__inner::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(70% 100% at 100% 0%, rgba(190,28,45,.10), transparent 60%);
}
.mega__side{ position:relative; border-right:1px solid var(--line); padding-right:clamp(16px,2vw,28px); }
.mega__side-label{
  font-family:var(--ff-en); font-size:10.5px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--fg-3); margin-bottom:18px;
}
.mega__pick{
  display:block; padding:18px; border-radius:14px; border:1px solid var(--line);
  background:linear-gradient(150deg, rgba(190,28,45,.14), rgba(255,255,255,.02));
  transition:border-color .45s, transform .5s var(--e-out);
}
.mega__pick:hover{ border-color:rgba(255,81,71,.5); transform:translateY(-4px); }
.mega__pick-tag{
  display:inline-block; font-size:10px; letter-spacing:.06em; padding:3px 10px; border-radius:100px;
  border:1px solid rgba(255,81,71,.5); color:var(--accent-2); margin-bottom:12px;
}
.mega__pick b{ display:block; font-size:14.5px; font-weight:700; line-height:1.7; }
.mega__pick em{ display:block; font-style:normal; font-size:11.5px; color:var(--fg-3); margin-top:8px; }

.mega__main{ position:relative; display:flex; flex-direction:column; gap:clamp(20px,2.4vw,32px); }
.mega__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2.4vw,40px); }
.mega__cat{
  display:block; font-size:13px; font-weight:700; letter-spacing:.02em; line-height:1.6;
  padding-bottom:14px; margin-bottom:14px; border-bottom:1px solid var(--line);
  transition:color .35s;
}
.mega__cat:hover{ color:var(--accent-2); }
.mega__col ul li + li{ margin-top:10px; }
.mega__col ul a{
  display:block; font-size:12.5px; line-height:1.75; color:var(--fg-2);
  transition:color .3s, transform .4s var(--e-out);
}
.mega__col ul a:hover{ color:#fff; transform:translateX(4px); }

.mega__all{
  align-self:flex-end;
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--ff-en); font-size:12.5px; letter-spacing:.1em; color:var(--fg-2);
  transition:color .35s, gap .4s var(--e-out);
}
.mega__all:hover{ color:var(--accent-2); gap:16px; }

@media (max-width:1240px){
  .mega__inner{ grid-template-columns:1fr; }
  .mega__side{ display:none; }
  .mega__cols{ grid-template-columns:repeat(3,1fr); gap:22px 20px; }
}

/* フルスクリーンメニュー内のサービス一覧 */
.menu__side-label{
  font-family:var(--ff-en); font-size:10px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:14px;
}
.menu__services li + li{ margin-top:11px; }
.menu__services a{
  font-size:13.5px; color:var(--fg-2); transition:color .35s, padding-left .4s var(--e-out);
}
.menu__services a:hover{ color:#fff; padding-left:6px; }
.menu__meta dt{ margin-top:26px; }

/* =========================================================
   SECTION MODIFIERS
   ========================================================= */
.section--tight{ padding-block:clamp(56px,7vw,96px); }
.section--top0{ padding-top:0; }
.sechead--sm{ margin-bottom:clamp(28px,3vw,44px); }
.sechead--sm .sechead__title{ font-size:clamp(22px,3vw,36px); }

.bigtext{
  max-width:900px; font-size:clamp(15px,1.7vw,19px); line-height:2.3; color:var(--fg-2);
}
.bigtext b{ color:#fff; font-weight:700; }

/* =========================================================
   STATEMENT（Mission / Vision）
   ========================================================= */
.statement{ position:relative; text-align:center; overflow:hidden; }
.statement__bg{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(60% 70% at 50% 0%, rgba(190,28,45,.16), transparent 66%);
}
.statement--alt .statement__bg{
  background:radial-gradient(60% 70% at 50% 100%, rgba(150,150,160,.12), transparent 66%);
}
.statement__label{
  font-family:var(--ff-en); font-size:12px; font-weight:600; letter-spacing:.3em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:26px;
}
.statement__title{
  font-size:clamp(26px,5vw,62px); font-weight:900; line-height:1.32; letter-spacing:-.035em;
}
.statement__title span{ display:block; overflow:hidden; }
.statement__title span > i{ font-style:normal; display:block; transform:translateY(110%); transition:transform 1s var(--e-out); }
.statement__title b{
  font-weight:900; background:var(--grad);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.statement__text{
  margin:32px auto 0; max-width:820px; font-size:clamp(13.5px,1.4vw,16px);
  color:var(--fg-2); line-height:2.2;
}
.statement__text b{ color:#fff; font-weight:700; }

/* =========================================================
   VALUES
   ========================================================= */
.values{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden;
}
.value{ background:var(--bg); padding:clamp(26px,3vw,40px); transition:background-color .5s; }
.value:hover{ background:var(--bg-3); }
.value__num{
  font-family:var(--ff-en); font-weight:800; font-size:clamp(28px,3vw,40px); line-height:1;
  letter-spacing:-.04em; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.22);
  margin-bottom:18px; transition:-webkit-text-stroke-color .5s;
}
.value:hover .value__num{ -webkit-text-stroke-color:rgba(255,81,71,.8); }
.value__title{ font-size:clamp(17px,1.9vw,21px); font-weight:800; line-height:1.6; margin-bottom:14px; }
.value__text{ font-size:13.4px; color:var(--fg-2); line-height:2.05; }
.value--empty{ pointer-events:none; }
.value--empty:hover{ background:var(--bg); }
@media (max-width:1000px){ .values{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .values{ grid-template-columns:1fr; } }

/* =========================================================
   LEADERSHIP
   ========================================================= */
.leaders{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,1.8vw,22px); }
.leader{
  display:flex; flex-direction:column; align-items:flex-start;
  padding:clamp(22px,2.4vw,32px); border:1px solid var(--line); border-radius:18px;
  background:var(--bg-2); transition:transform .6s var(--e-out), border-color .6s, background-color .6s;
}
.leader:hover{ transform:translateY(-8px); border-color:rgba(255,81,71,.35); background:var(--bg-3); }
.leader__avatar{
  width:64px; height:64px; border-radius:50%; display:grid; place-items:center;
  font-family:var(--ff-en); font-weight:700; font-size:19px; color:#fff;
  background:var(--grad); margin-bottom:20px;
  transition:transform .6s var(--e-out);
}
.leader:hover .leader__avatar{ transform:scale(1.06); }
.leader__role{
  font-family:var(--ff-en); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:8px;
}
.leader__name{ font-size:clamp(16px,1.8vw,20px); font-weight:800; letter-spacing:-.01em; }
.leader__en{ font-family:var(--ff-en); font-size:10.5px; letter-spacing:.14em; color:var(--fg-3); margin-top:5px; }
@media (max-width:900px){ .leaders{ grid-template-columns:repeat(2,1fr); } }

/* =========================================================
   LOGOS（出身企業）
   ========================================================= */
.logos{ display:flex; flex-wrap:wrap; gap:10px 12px; }
.logos li{
  font-family:var(--ff-en); font-size:14px; font-weight:500; letter-spacing:.03em; color:var(--fg-2);
  padding:14px 24px; border:1px solid var(--line); border-radius:10px; background:var(--bg-2);
  transition:color .4s, border-color .4s, transform .4s var(--e-out);
}
.logos li:hover{ color:#fff; border-color:var(--line-2); transform:translateY(-3px); }
.logos__note{ margin-top:18px; font-size:11.5px; color:var(--fg-3); }

.cinfo__en{ font-family:var(--ff-en); font-size:12.5px; letter-spacing:.06em; color:var(--fg-3); }
.cinfo__link{ border-bottom:1px solid rgba(255,81,71,.4); transition:color .35s, border-color .35s; }
.cinfo__link:hover{ color:var(--accent-2); border-color:var(--accent-2); }

/* =========================================================
   SERVICE CARDS（トップの5カテゴリ）
   ========================================================= */
.svccards{
  display:grid; grid-template-columns:repeat(5,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:18px; overflow:hidden;
}
.svccard{
  position:relative; display:block; background:var(--bg-2);
  padding:clamp(24px,2.6vw,34px) clamp(20px,2.2vw,28px) clamp(56px,5vw,68px);
  transition:background-color .5s;
}
.svccard:hover{ background:var(--bg-3); }
.svccard__idx{ font-family:var(--ff-en); font-size:11px; letter-spacing:.18em; color:var(--fg-3); }
.svccard__ja{ margin-top:20px; font-size:clamp(16px,1.8vw,20px); font-weight:800; line-height:1.5; }
.svccard__en{
  font-family:var(--ff-en); font-size:10px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--fg-3); margin:7px 0 16px;
}
.svccard__desc{ font-size:12.8px; color:var(--fg-2); line-height:1.95; }
.svccard__arrow{
  position:absolute; left:clamp(20px,2.2vw,28px); bottom:clamp(20px,2vw,26px);
  width:36px; height:36px; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--line-2); color:var(--accent-2);
  transition:background-color .4s, color .4s, transform .5s var(--e-out);
}
.svccard:hover .svccard__arrow{ background:var(--accent-2); color:#0a0a0c; transform:rotate(-45deg); }
@media (max-width:1100px){ .svccards{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .svccards{ grid-template-columns:1fr; } }

/* =========================================================
   SOLUTIONS（サービス一覧ページ）
   ========================================================= */
.solgroup + .solgroup{ margin-top:clamp(48px,5vw,80px); }
.solgroup__head{
  display:flex; flex-wrap:wrap; align-items:baseline; gap:10px 24px;
  padding-bottom:20px; margin-bottom:24px; border-bottom:1px solid var(--line);
}
.solgroup__en{
  font-family:var(--ff-en); font-size:11px; letter-spacing:.24em; text-transform:uppercase;
  color:var(--accent-2); width:100%;
}
.solgroup__ja{ font-size:clamp(19px,2.4vw,28px); font-weight:800; letter-spacing:-.02em; margin-right:auto; }
.solgroup__head .link-arrow{ font-size:12.5px; padding-bottom:6px; }

.solcards{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.8vw,22px); }
.solcard{
  position:relative; display:block;
  padding:clamp(22px,2.4vw,32px); padding-bottom:clamp(54px,5vw,64px);
  border:1px solid var(--line); border-radius:16px; background:var(--bg-2);
  transition:transform .6s var(--e-out), border-color .6s, background-color .6s;
}
.solcard:hover{ transform:translateY(-8px); border-color:rgba(255,81,71,.35); background:var(--bg-3); }
.solcard__cat{
  display:inline-block; font-size:10.5px; letter-spacing:.06em; color:var(--fg-3);
  padding:4px 11px; border:1px solid var(--line); border-radius:100px; margin-bottom:16px;
}
.solcard h4{ font-size:clamp(16px,1.8vw,19px); font-weight:800; line-height:1.6; margin-bottom:12px; }
.solcard p{ font-size:13px; color:var(--fg-2); line-height:2; }
.solcard__arrow{
  position:absolute; left:clamp(22px,2.4vw,32px); bottom:clamp(20px,2vw,26px);
  width:34px; height:34px; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--line-2); color:var(--accent-2);
  transition:background-color .4s, color .4s, transform .5s var(--e-out);
}
.solcard:hover .solcard__arrow{ background:var(--accent-2); color:#0a0a0c; transform:rotate(-45deg); }
@media (max-width:960px){ .solcards{ grid-template-columns:1fr; } }

/* =========================================================
   SERVICE DETAIL（各サービスページ）
   ========================================================= */
.svcintro{ max-width:880px; font-size:clamp(14.5px,1.6vw,18px); line-height:2.25; color:var(--fg-2); }

/* サービスページ冒頭の商標注記（Salesforce など） */
.svclogo__note{ max-width:880px; margin-top:18px; font-size:11.5px; color:var(--fg-3); line-height:1.9; }
.svcdetail{
  display:grid; grid-template-columns:120px 1fr; gap:clamp(20px,3vw,48px);
  padding:clamp(38px,4.4vw,64px) 0; border-top:1px solid var(--line);
  scroll-margin-top:96px;
}
.svcdetail__idx{
  font-family:var(--ff-en); font-weight:800; font-size:clamp(40px,5vw,70px); line-height:.9;
  letter-spacing:-.05em; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.22);
}
.svcdetail__title{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px;
  font-size:clamp(21px,2.8vw,34px); font-weight:800; letter-spacing:-.02em; line-height:1.5;
  margin-bottom:18px;
}
.svcdetail__tag{
  font-size:10.5px; font-weight:500; letter-spacing:.06em; padding:4px 12px; border-radius:100px;
  border:1px solid rgba(255,81,71,.5); color:var(--accent-2);
}
.svcdetail__lead{ font-size:14.5px; color:var(--fg-2); line-height:2.15; max-width:820px; }
.svcdetail__grid{ display:grid; grid-template-columns:1.35fr 1fr; gap:clamp(16px,2vw,26px); margin-top:30px; }
.svcdetail__block{
  padding:clamp(20px,2.2vw,28px); border:1px solid var(--line); border-radius:16px; background:var(--bg-2);
}
.svcdetail__block--issue{ background:linear-gradient(150deg, rgba(190,28,45,.10), rgba(255,255,255,.015)); }
.svcdetail__blocktitle{
  font-family:var(--ff-en); font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:16px;
}
.svcdetail__list li{ position:relative; padding-left:20px; font-size:13.5px; color:var(--fg); line-height:1.95; }
.svcdetail__list li + li{ margin-top:11px; }
.svcdetail__list li::before{
  content:""; position:absolute; left:0; top:12px; width:9px; height:1px; background:var(--accent-2);
}
.svcdetail__issue{ font-size:14px; color:#fff; line-height:2.05; font-weight:700; }

/* 画面キャプチャ */
.svcshot{ margin-top:clamp(22px,2.6vw,34px); }
.svcshot img{
  display:block; width:100%; height:auto;
  border:1px solid var(--line); border-radius:16px; background:var(--bg-2);
}
.svcshot figcaption{
  margin-top:12px; font-size:12px; color:var(--fg-2); line-height:1.9;
}
@media (max-width:860px){
  .svcdetail{ grid-template-columns:1fr; }
  .svcdetail__grid{ grid-template-columns:1fr; }
}

/* 関連サービス */
.related{ border-top:1px solid var(--line); }
.related__item a{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:22px 6px; border-bottom:1px solid var(--line);
  font-size:clamp(15px,1.8vw,19px); font-weight:700;
  transition:padding-left .45s var(--e-out), color .4s;
}
.related__item a:hover{ padding-left:16px; color:var(--accent-2); }
.related__item i{ color:var(--accent-2); transition:transform .45s var(--e-out); }
.related__item a:hover i{ transform:translateX(6px); }

/* =========================================================
   FOOTER COLUMNS
   ========================================================= */
.footer__cols{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:30px; }
.footer__coltitle{
  font-family:var(--ff-en); font-size:10.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:16px;
}
.footer__col li + li{ margin-top:11px; }
.footer__col a{
  font-size:13px; color:var(--fg-2);
  display:inline-flex; align-items:center; gap:8px;
  transition:color .4s, gap .4s var(--e-out);
}
.footer__col a::before{
  content:""; width:0; height:1px; background:var(--accent-2); transition:width .4s var(--e-out);
}
.footer__col a:hover{ color:#fff; }
.footer__col a:hover::before{ width:14px; }
@media (max-width:760px){ .footer__cols{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .footer__cols{ grid-template-columns:1fr; } }

/* reduced motion 追記 */
@media (prefers-reduced-motion:reduce){
  .statement__title span > i{ transform:none !important; }
  .mega{ transition:none !important; }
}

/* =========================================================
   SOLUTION GROUP LEAD / DATA CATEGORIES（LandLens）
   ========================================================= */
.solgroup__lead{
  margin:-6px 0 24px; max-width:840px;
  font-size:14px; color:var(--fg-2); line-height:2.05;
}

.datacats{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(14px,1.8vw,22px); }
.datacat{
  padding:clamp(22px,2.4vw,32px); border:1px solid var(--line); border-radius:18px;
  background:var(--bg-2); transition:border-color .55s, background-color .55s;
}
.datacat:hover{ border-color:rgba(255,81,71,.32); background:var(--bg-3); }
.datacat__title{
  font-size:clamp(16px,1.8vw,19px); font-weight:800; letter-spacing:-.01em;
  padding-bottom:14px; margin-bottom:18px; border-bottom:1px solid var(--line);
}
.datacat__tags{ display:flex; flex-wrap:wrap; gap:8px; }
.datacat__tags li{
  font-size:11.5px; letter-spacing:.02em; color:var(--fg-2);
  padding:6px 13px; border:1px solid var(--line); border-radius:100px;
  background:rgba(255,255,255,.02);
  transition:color .35s, border-color .35s, transform .35s var(--e-out);
}
.datacat__tags li:hover{ color:#fff; border-color:rgba(255,81,71,.5); transform:translateY(-2px); }
@media (max-width:820px){ .datacats{ grid-template-columns:1fr; } }

/* =========================================================
   SYSTEM DIAGRAM（LandLens システム構成図）
   ========================================================= */
.diagram{ position:relative; }

.diagram__input{
  width:fit-content; margin-inline:auto; text-align:center;
  padding:18px 40px; border-radius:14px;
  border:1px solid rgba(255,81,71,.45);
  background:linear-gradient(150deg, rgba(190,28,45,.18), rgba(255,255,255,.02));
}
.diagram__inputlabel{
  display:block; font-family:var(--ff-en); font-size:10px; letter-spacing:.24em;
  text-transform:uppercase; color:var(--accent-2); margin-bottom:8px;
}
.diagram__inputtext{ font-size:clamp(17px,2vw,22px); font-weight:800; letter-spacing:.02em; }

.diagram__down{
  display:grid; place-items:center; color:var(--fg-3); padding:14px 0 4px;
}
.diagram__down svg{ animation:diagDown 2.4s var(--e-io) infinite; }
@keyframes diagDown{
  0%,100%{ transform:translateY(-3px); opacity:.5 }
  50%{ transform:translateY(3px); opacity:1 }
}

.diagram__panels{
  display:grid; grid-template-columns:1fr auto 1fr; align-items:stretch;
  gap:clamp(10px,1.4vw,18px);
}
.diagram__panel{
  position:relative; overflow:hidden;
  padding:clamp(24px,2.8vw,38px);
  border:1px solid var(--line); border-radius:20px; background:var(--bg-2);
  transition:border-color .55s, background-color .55s;
}
.diagram__panel:hover{ border-color:rgba(255,81,71,.3); background:var(--bg-3); }
.diagram__panelnum{
  position:absolute; top:18px; right:24px;
  font-family:var(--ff-en); font-weight:800; font-size:clamp(30px,3.4vw,46px); line-height:1;
  letter-spacing:-.04em; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.14);
}
.diagram__paneltitle{
  font-size:clamp(17px,2vw,22px); font-weight:800; line-height:1.65; letter-spacing:-.01em;
  padding-right:56px;
}
.diagram__panelnote{
  margin-top:10px; font-size:11.5px; letter-spacing:.12em; color:var(--fg-3);
}
.diagram__subtitle{
  margin:26px 0 14px; padding-bottom:10px; border-bottom:1px solid var(--line);
  font-family:var(--ff-en); font-size:10.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent-2);
}

/* 資料の矢印バーを再現 */
.techbars{ display:flex; flex-direction:column; gap:9px; }
.techbar{
  display:flex; align-items:baseline; gap:12px; flex-wrap:wrap;
  padding:12px 34px 12px 18px;
  background:linear-gradient(100deg, rgba(190,28,45,.85), rgba(255,81,71,.55));
  clip-path:polygon(0 0, calc(100% - 20px) 0, 100% 50%, calc(100% - 20px) 100%, 0 100%);
  transition:transform .5s var(--e-out), filter .5s;
}
.techbar:hover{ transform:translateX(6px); filter:brightness(1.12); }
.techbar b{ font-family:var(--ff-en); font-size:clamp(15px,1.7vw,19px); font-weight:700; color:#fff; letter-spacing:.01em; }
.techbar span{ font-size:11.5px; color:rgba(255,255,255,.86); }

.diagram__list{ margin-top:22px; }
.diagram__list li{
  position:relative; padding-left:18px; font-size:12.8px; color:var(--fg-2); line-height:1.95;
}
.diagram__list li + li{ margin-top:9px; }
.diagram__list li::before{
  content:""; position:absolute; left:0; top:11px; width:8px; height:1px; background:var(--accent-2);
}

.diagram__arrow{
  display:grid; place-items:center; width:56px; color:var(--accent-2);
}
.diagram__arrow svg{ animation:diagRight 2.6s var(--e-io) infinite; }
@keyframes diagRight{
  0%,100%{ transform:translateX(-4px); opacity:.5 }
  50%{ transform:translateX(4px); opacity:1 }
}

/* BI画面イメージ */
.mapviz{
  position:relative; margin-top:22px; border-radius:12px; overflow:hidden;
  border:1px solid var(--line); background:#0d0d10;
}
.mapviz svg{ display:block; width:100%; height:auto; }
.mapviz__legend{
  position:absolute; top:10px; right:10px;
  padding:8px 10px; border-radius:8px;
  background:rgba(10,10,12,.78); border:1px solid var(--line);
  backdrop-filter:blur(6px);
}
.mapviz__legend li{
  display:flex; align-items:center; gap:7px;
  font-family:var(--ff-en); font-size:8.5px; letter-spacing:.1em; color:var(--fg-3); line-height:1.9;
}
.mapviz__legend li::before{
  content:""; width:7px; height:7px; border-radius:2px; background:rgba(255,255,255,.22); flex:none;
}
.mapviz__legend li:first-child::before{ background:var(--accent-2); }

/* 用語 */
.glossary{
  display:flex; flex-wrap:wrap; gap:10px 28px;
  margin-top:clamp(24px,3vw,38px); padding-top:22px; border-top:1px solid var(--line);
}
.glossary li{ display:flex; align-items:baseline; gap:9px; font-size:11.5px; color:var(--fg-3); line-height:1.9; }
.glossary b{
  font-family:var(--ff-en); font-size:11px; font-weight:700; letter-spacing:.08em; color:var(--accent-2);
  white-space:nowrap;
}

@media (max-width:900px){
  .diagram__panels{ grid-template-columns:1fr; }
  .diagram__arrow{ width:100%; height:56px; }
  .diagram__arrow svg{ transform:rotate(90deg); animation:none; }
}

/* =========================================================
   BLOG
   ========================================================= */
.wrap--narrow{ max-width:820px; }

/* 記事ヘッダー */
.phero--article .phero__meta{
  display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-bottom:20px;
}
.phero--article time{
  font-family:var(--ff-en); font-size:12.5px; letter-spacing:.14em; color:var(--fg-3);
}
.phero--article .phero__meta span{
  font-size:11px; letter-spacing:.06em; padding:4px 13px; border-radius:100px;
  border:1px solid rgba(255,81,71,.45); color:var(--accent-2);
}
.phero__articletitle{
  max-width:900px;
  font-size:clamp(24px,3.6vw,44px); font-weight:800; line-height:1.55; letter-spacing:-.02em;
  animation:pheroIn 1s .12s var(--e-out) both;
}

/* 一覧 */
.posts{ border-top:1px solid var(--line); }
.post a{
  position:relative; display:block; padding:clamp(26px,3vw,40px) 6px;
  border-bottom:1px solid var(--line);
  transition:padding-left .5s var(--e-out), background-color .5s;
}
.post a:hover{ padding-left:18px; background:rgba(255,255,255,.022); }
.post__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-bottom:14px; }
.post__meta time{ font-family:var(--ff-en); font-size:12px; letter-spacing:.14em; color:var(--fg-3); }
.post__meta span{
  font-size:10.5px; letter-spacing:.06em; padding:3px 12px; border-radius:100px;
  border:1px solid var(--line-2); color:var(--fg-2);
  transition:color .4s, border-color .4s;
}
.post a:hover .post__meta span{ color:var(--accent-2); border-color:rgba(255,81,71,.45); }
.post__title{
  max-width:820px; font-size:clamp(18px,2.2vw,26px); font-weight:800; line-height:1.65; letter-spacing:-.01em;
  transition:color .4s;
}
.post a:hover .post__title{ color:var(--accent-2); }
.post__excerpt{ max-width:760px; margin-top:12px; font-size:13.5px; color:var(--fg-2); line-height:2; }
.post__arrow{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--line-2); color:var(--accent-2);
  transition:background-color .45s, color .45s, transform .5s var(--e-out);
}
.post a:hover .post__arrow{ background:var(--accent-2); color:#0a0a0c; transform:translateY(-50%) rotate(-45deg); }
@media (max-width:700px){ .post__arrow{ display:none; } }

/* 記事本文 */
.postbody{ padding-block:clamp(56px,7vw,100px); }
.postbody__lead{
  font-size:clamp(15px,1.7vw,18px); line-height:2.25; color:var(--fg);
  padding-bottom:clamp(28px,3vw,40px); margin-bottom:clamp(20px,2.4vw,32px);
  border-bottom:1px solid var(--line);
}
.postbody h2{
  margin:clamp(40px,4.4vw,64px) 0 20px;
  font-size:clamp(19px,2.4vw,28px); font-weight:800; line-height:1.6; letter-spacing:-.02em;
  padding-left:18px; border-left:3px solid var(--accent-2);
}
.postbody p{ font-size:14.5px; color:var(--fg-2); line-height:2.25; }
.postbody p + p{ margin-top:20px; }
.postbody b{ color:#fff; font-weight:700; }
.postbody ul{ margin:24px 0; }
.postbody ul li{
  position:relative; padding-left:22px; font-size:14px; color:var(--fg-2); line-height:2.05;
}
.postbody ul li + li{ margin-top:12px; }
.postbody ul li::before{
  content:""; position:absolute; left:0; top:14px; width:10px; height:1px; background:var(--accent-2);
}
.postbody blockquote{
  margin:32px 0; padding:clamp(22px,2.4vw,32px);
  border:1px solid var(--line); border-radius:16px;
  background:linear-gradient(150deg, rgba(190,28,45,.10), rgba(255,255,255,.015));
  font-size:clamp(15px,1.7vw,18px); font-weight:700; line-height:1.95; color:#fff;
}
.postbody__cta{
  margin-top:clamp(44px,5vw,72px); padding-top:clamp(28px,3vw,40px); border-top:1px solid var(--line);
}
.postbody__cta p{ font-size:13.5px; color:var(--fg-3); margin-bottom:16px; }

/* =========================================================
   BLOG — タグ絞り込み
   ========================================================= */
.filters{
  display:flex; flex-wrap:wrap; gap:9px;
  padding-bottom:clamp(22px,2.6vw,32px); margin-bottom:clamp(6px,1vw,12px);
}
.filter{
  display:inline-flex; align-items:center; gap:8px;
  padding:9px 17px; border-radius:100px;
  border:1px solid var(--line-2); background:transparent; color:var(--fg-2);
  font-size:12.5px; font-weight:700; letter-spacing:.02em; line-height:1;
  transition:color .35s, border-color .35s, background-color .35s, transform .35s var(--e-out);
}
.filter i{
  font-style:normal; font-family:var(--ff-en); font-size:10.5px; font-weight:500;
  color:var(--fg-3); transition:color .35s;
}
.filter:hover{ color:var(--fg); border-color:var(--accent-2); transform:translateY(-2px); }
.filter.is-on{ background:var(--accent); border-color:transparent; color:#fff; }
.filter.is-on i{ color:rgba(255,255,255,.72); }

.post__tags{ display:flex; flex-wrap:wrap; gap:7px; margin-top:16px; }
.post__tags li{
  font-size:10.5px; letter-spacing:.04em; color:var(--fg-3);
  padding:4px 11px; border:1px solid var(--line); border-radius:100px;
  transition:color .35s, border-color .35s;
}
.post a:hover .post__tags li{ color:var(--accent-2); border-color:rgba(255,81,71,.4); }

.posts__empty{
  padding:56px 6px; text-align:center; font-size:14px; color:var(--fg-3);
  border-bottom:1px solid var(--line);
}

/* =========================================================
   LIGHT THEME（ブログ）
   ========================================================= */
.theme-light{
  --bg:        #ffffff;
  --bg-2:      #f5f5f7;
  --bg-3:      #ececef;
  --line:      rgba(0,0,0,.10);
  --line-2:    rgba(0,0,0,.20);
  --fg:        #14141a;
  --fg-2:      #4b4b57;
  --fg-3:      #7c7c88;
}

.theme-light .grain{ display:none; }
.theme-light .glow-follow{ opacity:.22; }
.theme-light .cursor{ border-color:rgba(0,0,0,.42); }
.theme-light ::selection{ background:rgba(190,28,45,.20); color:#14141a; }
.theme-light ::-webkit-scrollbar-track{ background:#efeff2; }
.theme-light ::-webkit-scrollbar-thumb{ background:#c9c9d1; }
.theme-light ::-webkit-scrollbar-thumb:hover{ background:#b0b0ba; }

/* ヘッダー・メニュー */
.theme-light .header.is-stuck{
  background:rgba(255,255,255,.82); border-bottom-color:var(--line);
}
.theme-light .burger span{ background:#14141a; }
.theme-light .header__cta{ color:var(--fg); }
.theme-light .header__cta:hover{ color:#fff; }
.theme-light .mega__inner{ background:#fff; box-shadow:0 30px 60px -34px rgba(0,0,0,.30); }
.theme-light .mega__pick{ background:linear-gradient(150deg, rgba(190,28,45,.10), rgba(0,0,0,.02)); }
.theme-light .menu__bg{ background:#fff; }
.theme-light .menu__bg::after{ background:radial-gradient(60% 50% at 80% 10%, rgba(190,28,45,.08), transparent 70%); }
.theme-light .menu__list b{ color:var(--fg); }

/* 見出し・背景 */
.theme-light .section__bgnum{ -webkit-text-stroke-color:rgba(0,0,0,.07); }
.theme-light .phero__bg{
  background:
    radial-gradient(70% 90% at 12% 0%, rgba(190,28,45,.10), transparent 62%),
    radial-gradient(60% 80% at 88% 10%, rgba(255,81,71,.07), transparent 64%);
}
.theme-light .phero::after{
  background-image:
    linear-gradient(rgba(0,0,0,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,.04) 1px, transparent 1px);
}

/* 本文・リスト */
.theme-light .post a:hover{ background:rgba(0,0,0,.028); }
.theme-light .postbody b{ color:var(--fg); }
.theme-light .postbody blockquote{
  color:var(--fg);
  background:linear-gradient(150deg, rgba(190,28,45,.09), rgba(0,0,0,.015));
}
.theme-light .btn--ghost::before{ background:rgba(0,0,0,.06); }
.theme-light .pt span{ background:#ececef; box-shadow:0 -30px 60px -30px rgba(0,0,0,.25); }

/* ダーク前提で #fff を直書きしている箇所を打ち消す */
.theme-light :is(
  .link-arrow:hover,
  .footer__col a:hover,
  .menu__services a:hover,
  .mega__col ul a:hover,
  .menu__list a:hover b,
  .header__nav > .navitem > a:hover,
  .header__nav > .navitem > a.is-active,
  .cta__lead b,
  .sechead__lead b
){ color:var(--fg); }

/* アクセント地に載る文字は白に */
.theme-light :is(
  .post a:hover .post__arrow,
  .nextnav__item:hover .nextnav__arrow,
  .totop:hover
){ color:#fff; }

/* =========================================================
   お役立ち資料（一覧）
   ========================================================= */
.res{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(14px,1.8vw,22px); }
.rescard{
  display:flex; gap:clamp(18px,2.2vw,28px); align-items:flex-start;
  padding:clamp(24px,2.8vw,36px);
  border:1px solid var(--line); border-radius:20px; background:var(--bg-2);
  transition:transform .6s var(--e-out), border-color .6s, background-color .6s;
}
.rescard:hover{ transform:translateY(-8px); border-color:rgba(255,81,71,.35); background:var(--bg-3); }
.rescard__doc{
  position:relative; flex:none; width:64px; display:grid; place-items:center;
  color:var(--accent-2);
}
.rescard__doc svg{ width:46px; height:auto; }
.rescard__doc b{
  position:absolute; bottom:2px; right:2px;
  font-family:var(--ff-en); font-size:11px; letter-spacing:.08em; color:var(--fg-3);
}
.rescard__body{ display:block; min-width:0; }
.rescard__cat{
  display:inline-block; font-size:10.5px; letter-spacing:.06em; color:var(--fg-3);
  padding:4px 11px; border:1px solid var(--line); border-radius:100px; margin-bottom:14px;
}
.rescard__title{
  display:block; font-size:clamp(16px,1.9vw,20px); font-weight:800; line-height:1.6;
  letter-spacing:-.01em; transition:color .4s;
}
.rescard:hover .rescard__title{ color:var(--accent-2); }
.rescard__excerpt{ display:block; margin-top:12px; font-size:13px; color:var(--fg-2); line-height:2; }
.rescard__foot{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px;
  margin-top:20px; padding-top:16px; border-top:1px solid var(--line);
}
.rescard__format{ font-family:var(--ff-en); font-size:11px; letter-spacing:.1em; color:var(--fg-3); }
.rescard__dl{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; font-weight:700; color:var(--accent-2);
  transition:gap .4s var(--e-out);
}
.rescard:hover .rescard__dl{ gap:13px; }
@media (max-width:900px){ .res{ grid-template-columns:1fr; } }
@media (max-width:520px){ .rescard{ flex-direction:column; } }

/* =========================================================
   お役立ち資料（詳細）
   ========================================================= */
.resdetail{ display:grid; grid-template-columns:1fr 380px; gap:clamp(28px,4vw,60px); align-items:start; }
.resdetail__lead{
  font-size:clamp(15px,1.7vw,18px); line-height:2.25; color:var(--fg);
  padding-bottom:clamp(24px,3vw,36px); border-bottom:1px solid var(--line);
}
.resdetail__h{
  margin:clamp(32px,3.6vw,48px) 0 18px;
  font-size:clamp(17px,2vw,22px); font-weight:800; letter-spacing:-.01em;
  padding-left:16px; border-left:3px solid var(--accent-2);
}
.resdetail__list li{
  position:relative; padding-left:24px; font-size:14px; color:var(--fg-2); line-height:2.05;
}
.resdetail__list li + li{ margin-top:12px; }
.resdetail__list li::before{
  content:""; position:absolute; left:0; top:13px; width:11px; height:1px; background:var(--accent-2);
}
.resdetail__spec{
  display:flex; flex-wrap:wrap; gap:1px; margin-top:clamp(32px,3.6vw,44px);
  background:var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden;
}
.resdetail__spec > div{ flex:1 1 140px; background:var(--bg); padding:18px 20px; }
.resdetail__spec dt{
  font-family:var(--ff-en); font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:8px;
}
.resdetail__spec dd{ font-size:13.5px; font-weight:700; }

/* ダウンロードフォーム */
.resdetail__side{ position:sticky; top:96px; }
.resform{
  padding:clamp(24px,2.6vw,32px);
  border:1px solid var(--line); border-radius:20px;
  background:linear-gradient(160deg, rgba(190,28,45,.10), rgba(255,255,255,.02));
}
.resform__title{
  font-size:clamp(16px,1.8vw,19px); font-weight:800; letter-spacing:-.01em;
  padding-bottom:14px; margin-bottom:14px; border-bottom:1px solid var(--line);
}
.resform__note{ font-size:11.5px; color:var(--fg-3); line-height:1.9; margin-bottom:22px; }
.resform .field{ margin-bottom:16px; }
.resform .field__input{ padding:11px 14px; font-size:14px; }

@media (max-width:1000px){
  .resdetail{ grid-template-columns:1fr; }
  .resdetail__side{ position:static; }
}

/* ライトテーマ用 */
.theme-light .resform{ background:linear-gradient(160deg, rgba(190,28,45,.08), rgba(0,0,0,.015)); }

/* =========================================================
   LEGAL（プライバシーポリシー等）
   ========================================================= */
.legal h2{
  font-size:clamp(17px,2vw,22px);
  margin-top:clamp(38px,4.2vw,58px);
}
.legal ul li b{ display:inline-block; margin-bottom:2px; }

.legal__ext{
  margin:22px 0; padding:clamp(20px,2.2vw,28px);
  border:1px solid var(--line); border-radius:16px; background:var(--bg-2);
}
.legal__extname{
  font-size:15px; font-weight:800; letter-spacing:-.01em;
  padding-bottom:12px; margin-bottom:14px; border-bottom:1px solid var(--line);
}
.legal__ext dl > div,
.legal__box dl > div{
  display:grid; grid-template-columns:120px 1fr; gap:14px;
  padding:9px 0;
}
.legal__ext dl > div + div,
.legal__box dl > div + div{ border-top:1px solid var(--line); }
.legal__ext dt,
.legal__box dt{
  font-size:11.5px; font-weight:700; letter-spacing:.08em; color:var(--accent-2);
  display:flex; align-items:center; gap:9px;
}
.legal__ext dt::before,
.legal__box dt::before{ content:""; width:12px; height:1px; background:var(--accent-2); flex:none; }
.legal__ext dd,
.legal__box dd{ font-size:13.5px; color:var(--fg-2); line-height:1.95; }

.legal__box{
  margin-top:22px; padding:clamp(22px,2.4vw,30px);
  border:1px solid var(--line); border-radius:16px;
  background:linear-gradient(160deg, rgba(190,28,45,.08), rgba(0,0,0,.015));
}
.legal__box dd{ color:var(--fg); }

.legal__date{
  margin-top:clamp(38px,4vw,56px); padding-top:22px; border-top:1px solid var(--line);
  font-size:12.5px; color:var(--fg-3);
}

@media (max-width:600px){
  .legal__ext dl > div,
  .legal__box dl > div{ grid-template-columns:1fr; gap:6px; }
}

/* フッター下部の法務リンク */
.footer__legal{
  font-size:11.5px; letter-spacing:.06em; color:var(--fg-3);
  margin-right:auto; margin-left:24px;
  transition:color .35s;
}
.footer__legal:hover{ color:var(--accent-2); }
@media (max-width:760px){ .footer__legal{ margin-left:0; } }

/* フォームの同意文言 */
.formconsent{
  margin-top:16px; font-size:11.5px; color:var(--fg-3); line-height:1.9; text-align:center;
}
.formconsent a{
  color:var(--fg-2); border-bottom:1px solid var(--line-2);
  transition:color .35s, border-color .35s;
}
.formconsent a:hover{ color:var(--accent-2); border-color:var(--accent-2); }

/* =========================================================
   トップページ：サービスカードグリッド（カテゴリ絞り込み）
   ========================================================= */
.wgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,26px); }
.wcard{
  display:block; border-radius:16px; overflow:hidden;
  transition:transform .6s var(--e-out);
}
.wcard:hover{ transform:translateY(-8px); }
.wcard__visual{
  display:block; position:relative; overflow:hidden;
  border:1px solid var(--line); border-radius:14px; background:var(--bg-2);
  transition:border-color .5s;
}
.wcard:hover .wcard__visual{ border-color:rgba(255,81,71,.4); }
.wcard__visual .viz{ display:block; width:100%; height:auto; aspect-ratio:16/9; }
.wcard__visual::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(160deg, rgba(190,28,45,.16), transparent 55%);
  opacity:0; transition:opacity .5s;
}
.wcard:hover .wcard__visual::after{ opacity:1; }
.wcard__body{ display:block; padding:20px 4px 0; }
.wcard__cat{
  display:block; font-family:var(--ff-en); font-size:11px; font-weight:700;
  letter-spacing:.1em; color:var(--accent-2); margin-bottom:10px;
}
.wcard__title{
  display:block; font-size:clamp(16px,1.8vw,19px); font-weight:800; line-height:1.6;
  letter-spacing:-.01em; transition:color .4s;
}
.wcard:hover .wcard__title{ color:var(--accent-2); }
.wcard__desc{ display:block; margin-top:10px; font-size:13px; color:var(--fg-2); line-height:1.95; }
@media (max-width:1000px){ .wgrid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){ .wgrid{ grid-template-columns:1fr; } }

/* 絞り込みバーを中央に（トップページ） */
.wgrid + .filters, .filters:has(+ .wgrid){ justify-content:center; }

/* =========================================================
   FAQ（採用ページ）— JSなしのアコーディオン
   ========================================================= */
.faq{ border-top:1px solid var(--line); }
.faq__item{ border-bottom:1px solid var(--line); }
.faq__q{
  position:relative; display:block; cursor:pointer; list-style:none;
  padding:clamp(20px,2.2vw,26px) 52px clamp(20px,2.2vw,26px) 6px;
  font-size:clamp(14.5px,1.6vw,16.5px); font-weight:700; line-height:1.8;
  transition:color .35s, padding-left .45s var(--e-out);
}
.faq__q::-webkit-details-marker{ display:none; }
.faq__q:hover{ color:var(--accent-2); padding-left:16px; }
.faq__q::after{
  content:""; position:absolute; right:16px; top:50%; width:11px; height:11px;
  margin-top:-7px; border-right:1.6px solid var(--accent-2); border-bottom:1.6px solid var(--accent-2);
  transform:rotate(45deg); transition:transform .4s var(--e-out);
}
.faq__item[open] .faq__q{ color:var(--accent-2); }
.faq__item[open] .faq__q::after{ transform:rotate(-135deg); margin-top:-2px; }
.faq__a{
  padding:0 52px clamp(22px,2.4vw,30px) 6px;
  font-size:13.8px; color:var(--fg-2); line-height:2.1; max-width:900px;
}

/* =========================================================
   トップページ：ニュース
   ========================================================= */
.sechead--center{ margin-left:auto; margin-right:auto; text-align:center; }
.sechead--center .sechead__lead{ margin-left:auto; margin-right:auto; }

.news{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(14px,1.8vw,22px); }
.newscard{
  display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--line); border-radius:16px; background:var(--bg-2);
  transition:transform .6s var(--e-out), border-color .5s, background-color .5s;
}
a.newscard:hover{ transform:translateY(-8px); border-color:rgba(255,81,71,.35); background:var(--bg-3); }
.newscard__visual{ display:block; border-bottom:1px solid var(--line); }
.newscard__visual .viz{ display:block; width:100%; height:auto; aspect-ratio:16/9; }
.newscard__body{ display:block; flex:1; padding:clamp(16px,1.8vw,22px); }
.newscard__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:12px; }
.newscard__cat{
  font-size:10.5px; letter-spacing:.06em; padding:4px 11px; border-radius:100px;
  border:1px solid var(--line-2); color:var(--fg-2);
}
.newscard__meta time{ font-family:var(--ff-en); font-size:11.5px; letter-spacing:.12em; color:var(--fg-3); }
.newscard__title{ display:block; font-size:14px; font-weight:700; line-height:1.85; transition:color .4s; }
a.newscard:hover .newscard__title{ color:var(--accent-2); }
.newscard__arrow{
  align-self:flex-end; margin:0 clamp(16px,1.8vw,22px) clamp(16px,1.8vw,22px);
  width:32px; height:32px; flex:none; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--line-2); color:var(--accent-2);
  transition:background-color .4s, color .4s, transform .5s var(--e-out);
}
a.newscard:hover .newscard__arrow{ background:var(--accent-2); color:#0a0a0c; transform:rotate(-45deg); }
.newscard--static{ cursor:default; }
.news + .seemore{ text-align:center; }
@media (max-width:1080px){ .news{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .news{ grid-template-columns:1fr; } }

/* =========================================================
   記事：アイキャッチ・目次・著者・関連記事
   ========================================================= */
.eyecatch{
  border:1px solid var(--line); border-radius:18px; overflow:hidden; background:var(--bg-2);
}
.eyecatch .viz{ display:block; width:100%; height:auto; aspect-ratio:16/8; }

.toc{
  margin:clamp(26px,3vw,38px) 0 clamp(10px,1.4vw,18px);
  padding:clamp(20px,2.2vw,28px);
  border:1px solid var(--line); border-radius:16px; background:var(--bg-2);
}
.toc__title{
  font-family:var(--ff-en); font-size:10.5px; letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:16px;
}
.toc ol{ counter-reset:toc; }
.toc li{ counter-increment:toc; }
.toc li + li{ margin-top:10px; }
.toc a{
  display:flex; gap:12px; font-size:13.5px; color:var(--fg-2); line-height:1.8;
  transition:color .35s, transform .4s var(--e-out);
}
.toc a::before{
  content:counter(toc, decimal-leading-zero);
  font-family:var(--ff-en); font-size:11px; color:var(--fg-3); flex:none; padding-top:3px;
  transition:color .35s;
}
.toc a:hover{ color:#fff; transform:translateX(4px); }
.toc a:hover::before{ color:var(--accent-2); }

.author{
  display:flex; gap:clamp(16px,2vw,24px); align-items:flex-start;
  padding:clamp(22px,2.4vw,30px);
  border:1px solid var(--line); border-radius:18px;
  background:linear-gradient(160deg, rgba(255,255,255,.045), rgba(255,255,255,.012));
}
.author__avatar{
  flex:none; width:56px; height:56px; border-radius:50%; display:grid; place-items:center;
  font-family:var(--ff-en); font-weight:700; font-size:17px; color:#fff; background:var(--grad);
}
.author__role{
  font-family:var(--ff-en); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-2); margin-bottom:6px;
}
.author__name{ font-size:17px; font-weight:800; letter-spacing:-.01em; }
.author__name em{
  font-style:normal; font-family:var(--ff-en); font-size:10.5px; letter-spacing:.14em;
  color:var(--fg-3); margin-left:10px;
}
.author__bio{ margin-top:12px; font-size:13px; color:var(--fg-2); line-height:2; }

.relposts{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(14px,1.8vw,20px); }
.relpost{
  position:relative; display:block; padding:clamp(22px,2.4vw,30px);
  padding-right:70px;
  border:1px solid var(--line); border-radius:16px; background:var(--bg-2);
  transition:transform .6s var(--e-out), border-color .6s, background-color .6s;
}
.relpost:hover{ transform:translateY(-6px); border-color:rgba(255,81,71,.35); background:var(--bg-3); }
.relpost__meta{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-bottom:12px; }
.relpost__meta time{ font-family:var(--ff-en); font-size:11.5px; letter-spacing:.12em; color:var(--fg-3); }
.relpost__meta span{
  font-size:10px; letter-spacing:.06em; padding:3px 11px; border-radius:100px;
  border:1px solid var(--line-2); color:var(--fg-2);
}
.relpost__title{ display:block; font-size:15.5px; font-weight:800; line-height:1.75; transition:color .4s; }
.relpost:hover .relpost__title{ color:var(--accent-2); }
.relpost__arrow{
  position:absolute; right:22px; top:50%; transform:translateY(-50%);
  width:38px; height:38px; border-radius:50%; display:grid; place-items:center;
  border:1px solid var(--line-2); color:var(--accent-2);
  transition:background-color .45s, color .45s, transform .5s var(--e-out);
}
.relpost:hover .relpost__arrow{ background:var(--accent-2); color:#0a0a0c; transform:translateY(-50%) rotate(-45deg); }
@media (max-width:760px){ .relposts{ grid-template-columns:1fr; } }

.section--bottom0{ padding-bottom:0; }
.postbody{ padding-top:clamp(34px,4vw,52px); }

/* =========================================================
   ブランドロゴ（実ロゴ画像）
   ========================================================= */
.brand{ align-items:flex-start; flex-direction:column; gap:5px; }
.brand__logo{
  height:44px; width:auto; display:block;
  transition:transform .6s var(--e-out), opacity .4s;
}
.brand:hover .brand__logo{ transform:scale(1.03); }
.brand__sub{
  font-size:10px; letter-spacing:.14em; color:var(--fg-3); line-height:1;
  padding-left:2px;
}
.header.is-stuck .brand__logo{ height:36px; }
@media (max-width:600px){
  .brand__logo{ height:34px; }
  .brand__sub{ display:none; }
}

/* ローダー */
.loader__logo{
  width:96px; height:96px; margin:0 auto 18px; display:block;
  animation:markIn .9s var(--e-out) both;
}

/* フッター */
img.footer__logo{ height:46px; width:auto; display:block; }
@media (max-width:600px){ img.footer__logo{ height:32px; } }

/* ライトテーマでは原色ロゴ（黒文字）に差し替える */
.theme-light .brand__logo,
.theme-light img.footer__logo{ content:url("../img/logo.png"); }