/* ==========================================================
   ANAGATA TOP 改修デモ  – Figma「ANAGATA-PCSP_改修版2026jul」準拠
   PC: 1366px 基準 / SP: 390px 基準（ブレークポイント 780px は現行サイトに合わせる）
   ========================================================== */
:root{
  --hd-h: 85px;
  --navy:#062557;
  --ink:#252728;
  --slate:#4D4D6B;
  --grad-ttl: linear-gradient(90deg,#5856D6 0%,#30B0C7 100%);
  --grad-contact: linear-gradient(90deg,#FFE259 0%,#FFA751 100%);
  --grad-doc: linear-gradient(90deg,#0071FF 0%,#54C4E8 100%);
  --bg-soft:#F6F9FD;
  --ease-out: cubic-bezier(.22,.8,.24,1);
  --ease-io: cubic-bezier(.65,0,.35,1);
  --ja: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  --seed: "LINE Seed JP", "Noto Sans JP", sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--hd-h)}
body{margin:0;background:#fff;color:var(--ink);font-family:var(--ja);font-feature-settings:"palt" 0;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
ul{list-style:none;margin:0;padding:0}
h1,h2,h3,p{margin:0}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sp-only{display:none!important}
@media (max-width:780px){
  :root{--hd-h:75px}
  .pc-only{display:none!important}
  .sp-only{display:revert!important}
  img.sp-only,picture.sp-only{display:block!important}
}
:focus-visible{outline:2px solid #0071FF;outline-offset:3px;border-radius:4px}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;height:41px;width:150px;border-radius:1000px;
  font-weight:700;font-size:15px;line-height:1;letter-spacing:0;box-shadow:2px 2px 8px rgba(0,0,0,.15);
  transition:transform .35s var(--ease-out),box-shadow .35s var(--ease-out),filter .35s;position:relative;overflow:hidden;isolation:isolate}
.btn img{width:24px;height:24px;flex:none}
.btn--contact{background:var(--grad-contact);color:#241D6D}
.btn--doc{background:var(--grad-doc);color:#fff}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.45) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .7s var(--ease-out);z-index:-1}
@media (hover:hover){
  .btn:hover{transform:translateY(-2px);box-shadow:3px 6px 16px rgba(0,0,0,.16)}
  .btn:hover::after{transform:translateX(120%)}
}
.btn--l{width:100%;height:52px;font-size:18px;gap:4px}
.btn--l img{width:28px;height:28px}
.btn--sp{height:58px}
.spmenu .btn--contact,.about__btns .btn--contact{background:linear-gradient(90deg,#FFA751 0%,#FFE259 100%);color:var(--ink)}
.spmenu .btn--doc,.about__btns .btn--doc{background:linear-gradient(90deg,#54C4E8 0%,#0071FF 100%)}

/* ---------- Header ---------- */
.hd{position:fixed;inset:0 0 auto;z-index:50;height:calc(var(--hd-h) + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px);background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.05);transition:box-shadow .4s,background .4s}
.hd.is-scrolled{box-shadow:0 4px 20px rgba(20,24,60,.08)}
.hd__in{height:100%;max-width:1366px;margin:0 auto;display:flex;align-items:center;padding:0 30px 0 29px}
.hd__logo{margin-right:auto;padding-top:0}
.hd__logo img{width:205px;height:25px}
.hd__nav{display:flex;align-items:center;gap:50px;margin-right:54px}
.hd__link{font-family:"Noto Sans JP",sans-serif;font-weight:800;font-size:15px;line-height:14px;color:#000;display:inline-flex;align-items:center;gap:1px;position:relative;letter-spacing:0}
.hd__link::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;background:var(--grad-doc);transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease-out)}
@media (hover:hover){.hd__link:hover::after{transform:scaleX(1);transform-origin:left}}
.hd__pullbtn img{width:10px;height:20px;transform:rotate(90deg);margin-left:10px;transition:transform .35s var(--ease-out)}
.hd__pull{position:relative}
.hd__pulllist{position:absolute;top:calc(100% + 8px);left:-44px;width:163px;background:#fff;border-radius:5px;box-shadow:5px 5px 5px rgba(0,0,0,.1);
  padding:20px 5px 20px 14px;display:grid;gap:25px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .3s,transform .3s var(--ease-out),visibility .3s}
.hd__pull:hover .hd__pulllist,.hd__pull:focus-within .hd__pulllist,.hd__pull.is-open .hd__pulllist{opacity:1;visibility:visible;transform:none}
.hd__pull:hover .hd__pullbtn img,.hd__pull.is-open .hd__pullbtn img{transform:rotate(270deg)}
.hd__pulllist a{display:block;font-weight:700;font-size:16px;line-height:14px;background:var(--grad-doc);-webkit-background-clip:text;background-clip:text;color:transparent;transition:opacity .2s}
.hd__pulllist a:hover{opacity:.65}
.hd__btns{display:flex;gap:20px}
.hd__menu{width:45px;height:45px;position:relative}
.hd__menu img{position:absolute;inset:0;width:45px;height:45px;transition:opacity .3s,transform .4s var(--ease-out)}
.hd__menu .i-close{opacity:0;transform:rotate(-45deg)}
.hd.is-menu .hd__menu .i-open{opacity:0;transform:rotate(45deg)}
.hd.is-menu .hd__menu .i-close{opacity:1;transform:none}

@media (max-width:780px){
  .hd{background:rgba(255,255,255,.95);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px)}
  .hd__in{padding:0 13px 0 15px}
  .hd__logo img{width:164px;height:20px}
}
/* SP menu */
.spmenu{position:fixed;top:calc(var(--hd-h) + env(safe-area-inset-top,0px));left:0;right:0;height:calc(100dvh - var(--hd-h));background:var(--slate);color:#fff;overflow:auto;
  clip-path:inset(0 0 100% 0);transition:clip-path .55s var(--ease-io)}
.spmenu{visibility:hidden}
.hd.is-menu .spmenu{clip-path:inset(0 0 0 0);visibility:visible}
.spmenu__in{padding:40px 52px 40px;display:flex;flex-direction:column;align-items:center;gap:40px;max-width:430px;margin:0 auto}
.spmenu__grp{display:flex;flex-direction:column;align-items:center;gap:25px;text-align:center}
.spmenu__grp a,.spmenu__grp span{font-size:16px;line-height:19px}
.spmenu__h{font-weight:700;font-size:24px!important;line-height:30px!important}
.spmenu__btns{width:100%;display:grid;gap:20px;margin-top:0}
.spmenu__grp>*,.spmenu__btns{opacity:0;transform:translateY(10px);transition:opacity .4s,transform .5s var(--ease-out)}
.hd.is-menu .spmenu__grp>*,.hd.is-menu .spmenu__btns{opacity:1;transform:none;transition-delay:calc(.15s + var(--i,0)*.035s)}

/* ---------- First View ---------- */
.fv{position:relative;margin-top:var(--hd-h);height:calc(100vh - var(--hd-h));height:calc(100svh - var(--hd-h));min-height:560px;max-height:1000px;overflow:hidden;background:#6d7fe0;isolation:isolate}
.fv__bg{position:absolute;inset:-4%;z-index:0;will-change:transform}
.fv__bg img,.fv__bg picture{width:100%;height:100%;object-fit:cover}
.fv__glow{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity .8s;
  background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.28),rgba(255,255,255,0) 70%);mix-blend-mode:soft-light}
.fv.is-glow.is-hover .fv__glow{opacity:1}
.fv__canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;opacity:0;transition:opacity 1.6s ease;display:block}
.fv.is-ready .fv__canvas{opacity:1}
.fv__content{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:83px;padding-top:44px;pointer-events:none;will-change:transform,opacity}
.fv__title{width:min(750px,58vw)}
.fv__wipe{display:block;clip-path:inset(0 100% 0 0);filter:drop-shadow(0 6px 24px rgba(30,20,90,.12))}
.fv__wipe img{width:100%;height:auto}
.fv.is-intro .fv__wipe{animation:wipe 1.5s var(--ease-io) .35s forwards}
@keyframes wipe{to{clip-path:inset(0 0 0 0)}}
.fv__tag{width:min(313px,24vw);min-width:250px;clip-path:inset(50% 0 50% 0)}
.fv__tag img{width:100%}
.fv.is-intro .fv__tag{animation:tag .9s var(--ease-io) 1.5s forwards}
@keyframes tag{to{clip-path:inset(0 0 0 0)}}
.fv__scroll{position:absolute;left:50%;bottom:27px;transform:translateX(-50%);z-index:3;display:flex!important;flex-direction:column;align-items:center;gap:0;color:#fff;font-family:var(--seed);font-size:10px;letter-spacing:.02em;line-height:16px}
.fv__scroll img{width:24px;height:24px;animation:bob 2.2s var(--ease-io) infinite}
@keyframes bob{0%,100%{transform:translateY(-2px);opacity:.6}50%{transform:translateY(3px);opacity:1}}

@media (max-width:780px){
  .fv{min-height:600px;max-height:none;background:#7a6fe0}
  .fv__content{justify-content:flex-start;gap:102px;padding-top:min(188px,26svh)}
  .fv__title{width:min(356px,calc(100vw - 34px))}
  .fv__tag{width:266px;min-width:0}
  .fv__scroll{display:flex!important}
}
@media (min-width:781px){.fv__scroll{display:none!important}}

/* ---------- Section title ---------- */
.grad-txt{background:var(--grad-ttl);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone}
.ttl{text-align:center;width:551px;max-width:100%;margin:0 auto}
.ttl__en{font-size:20px;line-height:30px}
.ttl__en--inc{font-family:"Titillium Web",sans-serif;font-weight:600}
.ttl__en--ja{font-family:var(--seed);font-weight:700;line-height:32px}
.ttl__main{font-family:var(--seed);font-weight:700;font-size:64px;line-height:103px;letter-spacing:0;display:inline-block;padding:0 4px;white-space:nowrap}

/* ---------- AI Solution Map ---------- */
.map{background:var(--bg-soft);padding:110px 20px 113px}
.map .ttl{margin-bottom:70px}
.map__card{max-width:1037px;margin:0 auto;background:#fff;border-radius:30px;box-shadow:0 0 50px rgba(0,0,0,.05);padding:40px 20px 20px}
.map__lead{text-align:center;color:var(--navy);margin-bottom:34px}
.map__h{font-weight:700;font-size:24px;line-height:1.2;letter-spacing:.05em;margin-bottom:30px}
.map__p{font-weight:500;font-size:16px;line-height:24px;letter-spacing:.05em}
.map__fig{max-width:933px;margin:0 auto;position:relative}
.map__scroller{border-radius:6px;overflow:hidden}

@media (max-width:780px){
  .map{padding:80px 15px 51px}
  .map .ttl{margin-bottom:40px;width:360px}
  .ttl__en{font-size:20px;line-height:30px}
  .ttl__main{font-size:40px;line-height:64px}
  .map__card{background:none;box-shadow:none;border-radius:0;padding:0}
  .map__lead{text-align:left;padding:0 10px;margin-bottom:10px}
  .map__h{font-size:20px;line-height:28px;letter-spacing:.05em;margin-bottom:25px}
  .map__p{font-size:16px;line-height:24px;margin-bottom:25px}
  .map__hint{display:block!important;text-align:center;color:#A7A9AC;font-weight:500;font-size:14px;line-height:24px;letter-spacing:.05em}
  .map__fig{background:#fff;padding:20px 0 26px;margin:0 auto;max-width:360px}
  .map__scroller{overflow-x:auto;overflow-y:hidden;border-radius:0;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;cursor:grab;touch-action:pan-x pan-y}
  .map__scroller::-webkit-scrollbar{display:none}
  .map__bar{position:absolute;left:50%;bottom:10px;width:60px;height:3px;border-radius:3px;transform:translateX(-50%);background:#e3e6ef;overflow:hidden}
  .map__bar i{position:absolute;top:0;bottom:0;left:0;width:39%;border-radius:3px;background:var(--grad-ttl);transform:translateX(var(--bx,78%))}
}

/* ---------- About ---------- */
.about{background:#fff;padding:110px 90px 128px}
.about__in{max-width:1082px;margin:0 auto 0 max(0px,calc(50% - 593px));display:grid;grid-template-columns:320px 647px;column-gap:115px;justify-content:space-between}
.about__side{display:flex;flex-direction:column;align-items:center;gap:50px}
.ttl--about{width:320px}
.about__tabs{display:grid;gap:25px;justify-items:start;width:98px;margin-left:0}
.about__tabs button{display:flex;align-items:center;gap:6px;height:30px;font-weight:700;font-size:16px;letter-spacing:.05em;color:#ccc;transition:color .3s}
.about__tabs button img{width:10px;height:10px;opacity:0;transform:rotate(90deg) translateY(4px);transition:opacity .3s,transform .4s var(--ease-out)}
.about__tabs button.is-active{color:var(--slate)}
.about__tabs button.is-active img{opacity:1;transform:rotate(90deg)}
@media (hover:hover){.about__tabs button:not(.is-active):hover{color:#8f90a6}}
.about__body{font-weight:500;font-size:16px;line-height:30px;color:var(--ink);letter-spacing:0}
.about__body p+p{margin-top:20px}
.about__body b{font-weight:700}
.b-lg{font-size:20px}
.b-deva [lang="sa"]{font-family:"Noto Sans Devanagari","Noto Sans JP",sans-serif}
.b-deva .iast{font-family:"Noto Sans","Noto Sans JP",sans-serif}
.about__body .about__quote{font-weight:900;font-size:24px;line-height:30px;margin:27px 0 33px}

@media (max-width:1180px) and (min-width:781px){
  .about{padding:110px 40px 128px}
  .about__in{grid-template-columns:280px 1fr;column-gap:60px}
  .ttl--about{width:280px}
  .about__body br{display:none}
}
@media (max-width:780px){
  .about{padding:100px 20px}
  .about__in{display:flex;flex-direction:column;gap:60px;max-width:351px}
  .about__side{gap:30px}
  .ttl--about{width:351px;max-width:100%}
  .ttl--about .ttl__en{font-size:16px;line-height:26px}
  .about__tabs{display:flex;gap:30px;width:auto}
  .about__body{font-size:16px;line-height:30px}
  .about__body br{display:none}
  .about__body p:nth-child(2) br,.about__body p:nth-child(3) br,.about__body p:nth-child(4) br,.about__body p:nth-child(6) br{display:inline}
  .about__btns{display:grid!important;gap:20px;width:300px;margin:0 auto}
}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s var(--ease-out),transform 1.1s var(--ease-out)}
.reveal.is-in{opacity:1;transform:none}

/* ---------- Demo switcher ---------- */
@media (max-width:780px){
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important}
  .fv__wipe,.fv__tag{clip-path:none!important}
  .reveal{opacity:1;transform:none}
}

/* ==========================================================
   KV 新案（ダーク）: ディープネイビー + ブランドカラーのオーロラ
   ブランド色は既存デザインの見出しグラデーション #5856D6→#30B0C7、
   ロゴ #54C4E8、ボタン #0071FF から採用
   ========================================================== */
:root{--kv-base:#060A1F}
.fv__aurora,.fv__grid{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .8s}
body[data-bg="dark"] .fv{background:var(--kv-base)}
body[data-bg="dark"] .fv__bg{opacity:0;visibility:hidden}
body[data-bg="dark"] .fv__aurora,body[data-bg="dark"] .fv__grid{opacity:1}
.fv__aurora{z-index:0;overflow:hidden;transform:translate3d(calc(var(--mx,0) * -26px),calc(var(--my,0) * -20px),0) scale(1.08)}
.au{position:absolute;display:block;border-radius:50%;will-change:transform}
.au--1{width:78vmax;height:78vmax;left:-24vmax;top:-30vmax;background:radial-gradient(closest-side,rgba(88,86,214,.62),rgba(88,86,214,0));animation:au1 26s var(--ease-io) infinite alternate}
.au--2{width:70vmax;height:70vmax;right:-22vmax;bottom:-34vmax;background:radial-gradient(closest-side,rgba(48,176,199,.5),rgba(48,176,199,0));animation:au2 32s var(--ease-io) infinite alternate}
.au--3{width:46vmax;height:46vmax;left:44%;top:-18vmax;background:radial-gradient(closest-side,rgba(0,113,255,.34),rgba(0,113,255,0));animation:au3 22s var(--ease-io) infinite alternate}
@keyframes au1{to{transform:translate3d(14vmax,10vmax,0) scale(1.1)}}
@keyframes au2{to{transform:translate3d(-16vmax,-8vmax,0) scale(.92)}}
@keyframes au3{to{transform:translate3d(-12vmax,14vmax,0) scale(1.15)}}
.fv__grid{z-index:1;background-image:linear-gradient(rgba(160,200,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(160,200,255,.05) 1px,transparent 1px);background-size:56px 56px;background-position:center center;
  -webkit-mask-image:radial-gradient(ellipse 70% 65% at 50% 45%,#000 30%,transparent 100%);mask-image:radial-gradient(ellipse 70% 65% at 50% 45%,#000 30%,transparent 100%)}
.fv::after{content:"";position:absolute;inset:auto 0 0;height:22%;z-index:2;pointer-events:none;opacity:0;background:linear-gradient(to bottom,rgba(6,10,31,0),rgba(6,10,31,.55))}
body[data-bg="dark"] .fv::after{opacity:1}
body[data-bg="dark"] .fv__wipe{filter:drop-shadow(0 0 32px rgba(88,86,214,.35))}
@media (min-width:781px){
  body[data-bg="dark"] .tag-figma{display:none!important}
  body[data-bg="dark"] .tag-dark{display:block!important}
}
body[data-bg="dark"] .fv.is-glow.is-hover .fv__glow{mix-blend-mode:screen}

/* ==========================================================
   AI Solution Map（アニメーション版）
   Figma「Group 327」(1113×696) の各パーツを SVG 化して同じ座標に配置
   ========================================================== */
.smap{--mw:1113;--mh:696;--cx:558.5px;--cy:259px;position:relative;width:100%;aspect-ratio:var(--mw)/var(--mh);--s:.838}
.smap__stage{position:absolute;left:0;top:0;width:calc(var(--mw) * 1px);height:calc(var(--mh) * 1px);transform:scale(var(--s));transform-origin:0 0}
.smap__lines{position:absolute;inset:0;overflow:visible;z-index:1}
.smap__p{position:absolute;max-width:none;left:calc((var(--x) - 14) * 1px);top:calc((var(--y) - 14) * 1px);width:calc((var(--w) + 28) * 1px);height:calc((var(--h) + 28) * 1px);z-index:2;
  transition:opacity .8s var(--ease-out),transform .9s var(--ease-out),filter .4s}
.smap__core-bg{position:absolute;left:386px;top:87px;width:344px;height:344px;border-radius:50%;background:#fff;box-shadow:0 0 30px rgba(0,0,0,.1);z-index:1;transition:opacity .9s var(--ease-out),transform 1.1s var(--ease-out),filter .45s}
.smap__core-bg::after{content:"";position:absolute;inset:-1px;border-radius:50%;box-shadow:0 0 0 0 rgba(88,86,214,.18);animation:corePulse 4s ease-out 3.4s infinite}
@keyframes corePulse{0%{box-shadow:0 0 0 0 rgba(88,86,214,.22)}70%{box-shadow:0 0 0 26px rgba(88,86,214,0)}100%{box-shadow:0 0 0 0 rgba(88,86,214,0)}}
.smap__fbody{position:absolute;left:0;top:544px;width:778px;height:152px;background:#F5F9FF;border-radius:0 0 5px 5px;z-index:0;transition:opacity .8s var(--ease-out),transform .9s var(--ease-out)}
.smap__ring .smap__dash{transform-box:fill-box;transform-origin:center;animation:ringSpin 90s linear infinite}
@keyframes ringSpin{to{transform:rotate(360deg)}}
.smap__arc,.smap__conn path{stroke-dasharray:1 1;stroke-dashoffset:0}
.smap__pulses circle{opacity:0}
.smap.is-play .smap__pulses circle{opacity:1;transition:opacity .6s 3.2s}

/* 初期状態（JS有効時のみ、再生前） */
.smap.is-armed:not(.is-play) .smap__p,.smap.is-armed:not(.is-play) .smap__fbody{opacity:0}
.smap.is-armed:not(.is-play) .smap__l{transform:translateX(-18px)}
.smap.is-armed:not(.is-play) .smap__r{transform:translateX(18px)}
.smap.is-armed:not(.is-play) .smap__f,.smap.is-armed:not(.is-play) .smap__fh,.smap.is-armed:not(.is-play) .smap__fbody{transform:translateY(16px)}
.smap.is-armed:not(.is-play) .smap__pill{transform:scaleY(.2)}
.smap.is-armed:not(.is-play) .smap__core{transform:scale(.92)}
.smap.is-armed:not(.is-play) .smap__core-bg{opacity:0;transform:scale(.86)}
.smap.is-armed:not(.is-play) .smap__arc,.smap.is-armed:not(.is-play) .smap__conn path{stroke-dashoffset:1}
.smap.is-armed:not(.is-play) .smap__dash,.smap.is-armed:not(.is-play) .smap__chev,.smap.is-armed:not(.is-play) .smap__div{opacity:0}

/* 再生シーケンス */
.smap.is-play .smap__p[data-k="heading"]{transition-delay:0s}
.smap.is-play .smap__l{transition-delay:calc(.1s + var(--d) * .12s)}
.smap.is-play .smap__conn--l path{transition:stroke-dashoffset .9s var(--ease-io) .55s}
.smap.is-play .smap__pill--l{transition-delay:.95s}
.smap.is-play .smap__core-bg{transition-delay:1.05s}
.smap.is-play .smap__core{transition-delay:1.25s}
.smap__dash,.smap__chev,.smap__div{transition:opacity 1s}
.smap.is-play .smap__dash{transition-delay:1.1s}
.smap.is-play .smap__arc{transition:stroke-dashoffset 1.1s var(--ease-io) 1.15s}
.smap.is-play .smap__chev{transition-delay:1.6s}
.smap.is-play .smap__pill--r{transition-delay:1.55s}
.smap.is-play .smap__conn--r path{transition:stroke-dashoffset .9s var(--ease-io) 1.7s}
.smap.is-play .smap__r{transition-delay:calc(1.95s + var(--d) * .1s)}
.smap.is-play .smap__fbody,.smap.is-play .smap__fh{transition-delay:2.35s}
.smap.is-play .smap__div{transition-delay:2.6s}
.smap.is-play .smap__f{transition-delay:calc(2.5s + var(--d) * .1s)}
.smap__pill{transform-origin:center}

/* ホバー：経路を強調 */
.smap__conn path{transition:stroke-width .3s,opacity .3s}
.smap.is-done .smap__p{transition:transform .45s var(--ease-out),filter .45s,opacity .45s}
.smap.is-done .smap__conn path{transition:stroke-width .3s,opacity .3s,stroke-dashoffset 0s}
@media (hover:hover){
  .smap.is-done .smap__l:hover,.smap.is-done .smap__r:hover{transform:translateY(-3px);filter:drop-shadow(0 8px 14px rgba(20,30,90,.12))}
  .smap.has-focus .smap__conn path{opacity:.28}
  .smap.has-focus .smap__conn path.is-hot{opacity:1;stroke-width:4.5}
}

@media (max-width:780px){
  .map__scroller .smap{width:932px;--s:.8374}
}
@media (prefers-reduced-motion:reduce){
  .smap__dash,.smap__core-bg::after{animation:none!important}
}

/* ==========================================================
   Solve Local. Scale Global. — A案 / B案
   ========================================================== */
.fv__tag{width:auto;min-width:0;clip-path:none!important;animation:none!important;display:flex;justify-content:center}
.fv__content{gap:64px}
.tagA{display:block}

/* A：大きな光の帯 */
.tagA{--tw:520px;--grad:linear-gradient(100deg,#0071FF 0%,#2FA8F0 38%,#54C4E8 60%,#5856D6 100%);position:relative;filter:drop-shadow(0 10px 34px rgba(0,113,255,.45))}
.tagA__band{position:relative;display:flex;align-items:center;justify-content:center;width:var(--tw);height:calc(var(--tw) * .112);
  background:var(--grad);background-size:200% 100%;overflow:hidden;clip-path:polygon(0 0,0 0,0 100%,0 100%);
  animation:tagBand 5s ease-in-out infinite alternate}
.tagA__band img{width:88%;height:auto;position:relative;z-index:1;opacity:0;transform:translateX(-14px)}
.tagA__sheen{position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);transform:translateX(-120%);z-index:2;mix-blend-mode:overlay}
.fv.is-intro .tagA__band{animation:tagBand 5s ease-in-out infinite alternate,tagWipe .9s var(--ease-io) 1.45s forwards}
.fv.is-intro .tagA__band img{animation:tagText .8s var(--ease-out) 1.95s forwards}
.fv.is-intro .tagA__sheen{animation:tagSheen 4.2s var(--ease-io) 2.6s infinite}
@keyframes tagWipe{from{clip-path:polygon(0 0,0 0,0 100%,0 100%)}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}}
@keyframes tagText{to{opacity:1;transform:none}}
@keyframes tagBand{from{background-position:0% 50%}to{background-position:100% 50%}}
@keyframes tagSheen{0%{transform:translateX(-120%)}45%,100%{transform:translateX(120%)}}
.tagA::before,.tagA::after{content:"";position:absolute;top:50%;width:0;height:1px;background:linear-gradient(90deg,rgba(84,196,232,0),rgba(84,196,232,.9));transition:width 1s var(--ease-out) 2.1s}
.tagA::before{right:100%;margin-right:14px}
.tagA::after{left:100%;margin-left:14px;transform:scaleX(-1)}
.fv.is-intro .tagA::before,.fv.is-intro .tagA::after{width:min(120px,9vw)}

/* B：Local（点）→ Global（波紋）のキネティック・タイポ */
@keyframes tagShimmer{to{background-position:-250% 0}}
/* 初期 */
@keyframes tbIn{to{opacity:1;transform:none}}
@keyframes tbDot{0%{box-shadow:0 0 0 0 rgba(127,227,255,.6),0 0 16px 2px rgba(127,227,255,.8)}70%{box-shadow:0 0 0 14px rgba(127,227,255,0),0 0 16px 2px rgba(127,227,255,.8)}100%{box-shadow:0 0 0 0 rgba(127,227,255,0),0 0 16px 2px rgba(127,227,255,.8)}}
@keyframes tbLink{to{stroke-dashoffset:0}}
@keyframes tbBig{to{opacity:1;transform:none;filter:none}}
@keyframes tbRing{0%{opacity:0;transform:scale(.25)}12%{opacity:.9}100%{opacity:0;transform:scale(4.2,2.4)}}

@media (max-width:780px){
  .fv__content{gap:84px}
  .tagA{--tw:min(330px,calc(100vw - 48px))}
  .tagA::before,.tagA::after{display:none}
}
@media (prefers-reduced-motion:reduce){
  .tagA__band{clip-path:none}.tagA__band img{opacity:1;transform:none}
}

/* ==========================================================
   AI Solution Map — A案（Explore）/ B案（Story）
   ========================================================== */
.smap__tilt{position:absolute;inset:0;transform-style:preserve-3d;transform:perspective(1600px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--ease-out)}
.smap__glare{position:absolute;inset:-4%;z-index:5;pointer-events:none;opacity:0;transition:opacity .4s;border-radius:24px;
  background:radial-gradient(420px circle at var(--gx,50%) var(--gy,50%),rgba(120,160,255,.12),rgba(120,160,255,0) 70%)}
.smap.is-hover .smap__glare{opacity:1}
.smap__stage{transition:transform .8s var(--ease-out)}
.smap__lines [data-g]{transition:opacity .45s var(--ease-out),filter .45s var(--ease-out)}
.smap.is-done .smap__p{cursor:default}
.smap.is-done .smap__l,.smap.is-done .smap__r,.smap.is-done .smap__core{cursor:pointer}

/* A：フォーカス */
body[data-v="a"] .smap.has-focus [data-g]:not(.is-rel){opacity:.28;filter:saturate(.3)}
body[data-v="a"] .smap.has-focus .smap__p.is-focus{transform:translateY(-4px) scale(1.03);filter:drop-shadow(0 10px 18px rgba(20,30,90,.16))}
.smap__conn path.is-hot{stroke-width:4.5}
.smap__hot circle{filter:drop-shadow(0 0 4px rgba(127,227,255,.9))}
.smap.is-burst .smap__core-bg{animation:coreBurst .9s var(--ease-out)}
@keyframes coreBurst{0%{box-shadow:0 0 30px rgba(0,0,0,.1),0 0 0 0 rgba(88,86,214,.45)}100%{box-shadow:0 0 30px rgba(0,0,0,.1),0 0 0 60px rgba(88,86,214,0)}}
.smap.is-fast .smap__dash{animation-duration:6s}
.mhint{display:none;text-align:center;font-size:12px;color:#8a90a8;margin-top:14px;letter-spacing:.04em}
body[data-v="a"] .mhint{display:block}
@media (hover:none){.mhint{display:none!important}}

/* B：スクロールで進むストーリー */
@media (max-width:780px){
}

/* ==========================================================
   AI Solution Map — テック演出（A/B共通）
   ========================================================== */
@property --ang{syntax:'<angle>';inherits:false;initial-value:0deg}
/* カード背景：ドットグリッド＋HUDコーナー */
.map__card{position:relative;background-color:#fff;
  background-image:radial-gradient(circle at 1px 1px,rgba(88,86,214,.13) 1px,transparent 1.4px);background-size:22px 22px;background-position:10px 10px}
.hud{position:absolute;width:22px;height:22px;border:0 solid rgba(88,86,214,.45);pointer-events:none;z-index:2}
.hud--tl{left:16px;top:16px;border-left-width:1.5px;border-top-width:1.5px;border-top-left-radius:6px}
.hud--tr{right:16px;top:16px;border-right-width:1.5px;border-top-width:1.5px;border-top-right-radius:6px}
.hud--bl{left:16px;bottom:16px;border-left-width:1.5px;border-bottom-width:1.5px;border-bottom-left-radius:6px}
.hud--br{right:16px;bottom:16px;border-right-width:1.5px;border-bottom-width:1.5px;border-bottom-right-radius:6px;border-color:rgba(48,176,199,.5)}
.hud--tr{border-color:rgba(48,176,199,.5)}
@media (max-width:780px){.hud{display:none}.map__card{background-image:none;background-color:transparent}.map__fig{background-image:radial-gradient(circle at 1px 1px,rgba(88,86,214,.12) 1px,transparent 1.4px);background-size:20px 20px}}

/* コア：ダイヤル目盛り・周回ノード・呼吸する光 */
.smap__ticks,.smap__ticks2,.smap__orbit,.smap__coreglow{transform-box:view-box;transform-origin:var(--cx) var(--cy)}
.smap__ticks{animation:ringSpin 140s linear infinite reverse}
.smap__ticks2{animation:ringSpin 60s linear infinite}
.smap__orbit--1{animation:ringSpin 18s linear infinite}
.smap__orbit--2{animation:ringSpin 26s linear infinite reverse}
.smap__coreglow{animation:coreBreath 5s ease-in-out infinite}
@keyframes coreBreath{0%,100%{opacity:.55;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
.smap.is-armed:not(.is-play) .smap__ticks,.smap.is-armed:not(.is-play) .smap__ticks2,.smap.is-armed:not(.is-play) .smap__orbit,.smap.is-armed:not(.is-play) .smap__coreglow{opacity:0}
.smap__ticks,.smap__ticks2,.smap__orbit,.smap__coreglow{transition:opacity 1.2s 1.2s}

/* データパケット（線の上を流れる光の短線） */
.smap__packets path{fill:none;stroke-linecap:round;stroke-width:3.2;stroke-dasharray:.07 .93;stroke-dashoffset:1;opacity:0}
.smap__packets .pk-l{stroke:#b9b8ff}
.smap__packets .pk-r{stroke:#b6f3ff}
.smap__packets .pk-glow{stroke-width:9;opacity:0;filter:url(#smapGlow)}
.smap.is-done .smap__packets path{animation:packet 2.8s cubic-bezier(.5,0,.3,1) infinite;animation-delay:var(--pd,0s)}
.smap.is-done .smap__packets .pk-glow{animation-name:packetGlow}
@keyframes packet{0%{stroke-dashoffset:1.07;opacity:0}8%{opacity:1}92%{opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes packetGlow{0%{stroke-dashoffset:1.07;opacity:0}8%{opacity:.55}92%{opacity:.55}100%{stroke-dashoffset:0;opacity:0}}
.smap__pulses{display:none}
/* 接続線そのものに淡いグロー */
.smap__conn{filter:drop-shadow(0 0 3px rgba(88,86,214,.25))}
.smap__conn--r{filter:drop-shadow(0 0 3px rgba(48,176,199,.3))}

/* スキャンライン（組み上がり時・中央クリック時） */
.smap__scan{opacity:0;transform:translateX(0)}
.smap.is-play .smap__scan{animation:scan 1.6s cubic-bezier(.6,0,.3,1) .15s 1}
.smap.is-burst .smap__scan{animation:scan 1.1s cubic-bezier(.6,0,.3,1) 1}
@keyframes scan{0%{opacity:0;transform:translateX(0)}10%{opacity:1}90%{opacity:1}100%{opacity:0;transform:translateX(calc(var(--mw) * 1px + 170px))}}

/* カードのライトトレース枠＋スポットライト */
.smap__hls{position:absolute;inset:0;z-index:3;pointer-events:none}
.smap__hl{position:absolute;border-radius:5px;opacity:0;transition:opacity .35s}
.smap__hl::before{content:"";position:absolute;inset:-1.5px;border-radius:6px;padding:1.5px;
  background:conic-gradient(from var(--ang),transparent 0 62%,#5856D6 78%,#54C4E8 88%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:trace 2.4s linear infinite}
.smap__hl::after{content:"";position:absolute;inset:0;border-radius:5px;background:radial-gradient(160px circle at var(--hx,50%) var(--hy,50%),rgba(84,196,232,.14),transparent 70%)}
.smap__hl.is-on{opacity:1}
@keyframes trace{to{--ang:360deg}}
.smap.has-focus .smap__hl.is-on{opacity:1}

/* 見出しのデコード演出 */
[data-decode]{font-variant-ligatures:none}
[data-decode] .dc{opacity:.55}

@media (prefers-reduced-motion:reduce){
  .smap__ticks,.smap__ticks2,.smap__orbit,.smap__coreglow,.smap__packets path,.smap__hl::before{animation:none!important}
  .smap__scan{display:none}
}

/* ==========================================================
   A案確定版：わかりやすさ改善
   ========================================================== */
/* PC：図の読み方（4ステップの流れ） */
.mflow{list-style:none;margin:0 -32px 18px;letter-spacing:0;padding:0;display:flex;justify-content:center;align-items:center;gap:0;max-width:none;white-space:nowrap}
.mflow li{display:flex;align-items:center}
.mflow li+li::before{content:"";width:22px;height:1px;margin:0 6px;background:linear-gradient(90deg,#5856D6,#30B0C7);position:relative}
.mflow button{display:flex;align-items:center;gap:8px;padding:6px 13px 6px 6px;border-radius:999px;background:#fff;border:1px solid #dfe3f0;font-size:12px;letter-spacing:.01em!important;white-space:nowrap;font-weight:700;color:var(--navy);letter-spacing:.03em;
  transition:border-color .3s,box-shadow .3s,transform .3s var(--ease-out)}
.mflow b{display:inline-grid;place-items:center;white-space:nowrap;min-width:38px;height:24px;padding:0 8px;border-radius:999px;font-size:11px;color:#fff;background:#5856D6;letter-spacing:.06em}
.mflow li:nth-child(2) b{background:linear-gradient(90deg,#5856D6,#4f7fd0)}
.mflow li:nth-child(3) b{background:linear-gradient(90deg,#5856D6,#30B0C7)}
.mflow li:nth-child(4) b{background:#30B0C7}
.mflow{flex-wrap:wrap;row-gap:8px}
@media (max-width:1100px){.mflow button{font-size:11.5px}}
.mflow button:hover,.mflow button.is-on{border-color:#5856D6;box-shadow:0 6px 16px rgba(88,86,214,.15);transform:translateY(-1px)}

/* SP：縦に読むマップ（横スクロールを廃止） */
.smapv{display:none}
@media (max-width:780px){
  .mflow{display:none}
  body[data-v="a"] .map__hint,body[data-v="a"] .map__scroller,body[data-v="a"] .map__bar{display:none!important}
  body[data-v="a"] .map__fig{background:none;padding:0;max-width:360px}
  body[data-v="a"] .smapv{display:flex;flex-direction:column;align-items:center;gap:0}
  .smapv__sec{width:100%;background:#fff;border-radius:14px;padding:22px 18px 18px;display:flex;flex-direction:column;gap:12px;position:relative;box-shadow:0 0 30px rgba(0,0,0,.05)}
  .smapv__tag{position:absolute;left:16px;top:-12px;padding:4px 12px;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.08em;color:#fff;background:#5856D6}
  .smapv__tag--r{background:#30B0C7}
  .smapv__tag--c{background:linear-gradient(90deg,#5856D6,#30B0C7);left:50%;transform:translateX(-50%);top:-6px;z-index:2}
  /* SVGパーツは周囲に14px（Figma座標）の余白付き → 負マージンで実寸に合わせる */
  .smapv__pc{width:100%;line-height:0}
  .smapv__img{width:calc(100% * (var(--w) + 28) / var(--w));max-width:none;height:auto;margin:calc(-100% * 14 / var(--w))}
  .smapv__card{border-radius:6px;transition:transform .3s var(--ease-out)}
  .smapv__card:active{transform:scale(.985)}
  .smapv__card--new{width:calc(100% * var(--pw) / var(--cw));margin-left:calc(-100% * var(--cx0) / var(--cw))}
  .smapv__link{display:flex;flex-direction:column;align-items:center;padding:6px 0}
  .smapv__wire{display:block;width:2px;height:22px;position:relative;overflow:hidden;background:rgba(88,86,214,.35)}
  .smapv__link--r .smapv__wire{background:rgba(48,176,199,.4)}
  .smapv__wire::after{content:"";position:absolute;left:0;right:0;top:-40%;height:40%;background:linear-gradient(to bottom,transparent,#9fe7ff,transparent);animation:wire 1.6s ease-in infinite}
  @keyframes wire{to{top:110%}}
  .smapv__pill{padding:8px 18px;border-radius:999px;color:#fff;font-weight:700;font-size:14px;letter-spacing:.04em;background:#5856D6;box-shadow:0 6px 16px rgba(88,86,214,.25)}
  .smapv__link--r .smapv__pill{background:#30B0C7;box-shadow:0 6px 16px rgba(48,176,199,.28)}
  .smapv__core{position:relative;width:300px;height:300px;display:grid;place-items:center}
  .smapv__ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
  .smapv__t1,.smapv__t2,.smapv__orb{transform-box:view-box;transform-origin:150px 150px}
  .smapv__t1{animation:ringSpin 120s linear infinite reverse}
  .smapv__t2{animation:ringSpin 60s linear infinite}
  .smapv__orb{animation:ringSpin 16s linear infinite}
  .smapv__disc{width:250px;height:250px;border-radius:50%;background:#fff;box-shadow:0 0 30px rgba(0,0,0,.08),0 0 0 8px rgba(88,86,214,.05);display:grid;place-items:center;position:relative}
  .smapv__disc .smapv__img{width:calc(210px * (var(--w) + 28) / var(--w));margin:0}
  .smapv__base{width:100%;margin-top:18px;border-radius:12px;overflow:hidden;background:#F5F9FF}
  .smapv__fh{background:#849AB7;color:#fff;font-weight:700;font-size:14px;text-align:center;padding:8px}
  .smapv__fgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px 10px;padding:16px 10px}
}
@media (prefers-reduced-motion:reduce){.smapv__wire::after,.smapv__t1,.smapv__t2,.smapv__orb{animation:none!important}}

/* ==========================================================
   About：タブ（VALUE / VISION / COMPANY）
   ========================================================== */
.about__panels{min-width:0}
.about__body[hidden]{display:none}
.about__body.is-active{animation:tabIn .5s var(--ease-out)}
@keyframes tabIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.about__tabs button{cursor:pointer}
.company{display:grid;grid-template-columns:140px 1fr;margin:0;border-top:1px solid #e3e6ee}
.company dt,.company dd{margin:0;padding:18px 4px;border-bottom:1px solid #e3e6ee;font-size:16px;line-height:30px}
.company dt{font-weight:700;color:var(--slate)}
@media (max-width:780px){.company{grid-template-columns:96px 1fr}.company dt,.company dd{padding:14px 2px;font-size:15px;line-height:28px}}

/* ==========================================================
   Our Service
   ========================================================== */
.svc{background:#54C4E8;color:#fff;padding:100px 0 100px;overflow:hidden}
.svc__in{max-width:1366px;margin:0 auto;position:relative}
.ttl--svc{width:402px;margin:0 0 60px 133px;text-align:center}
.ttl--svc .ttl__en,.ttl--svc .ttl__main{color:#fff;background:none;-webkit-text-fill-color:#fff}
.ttl--svc .ttl__en{margin-left:-82px}
.svc__lead{text-align:center;font-weight:700;font-size:18px;line-height:30px;letter-spacing:.02em;margin:0 0 50px}
.steps{list-style:none;margin:0 auto 50px;padding:0;display:flex;align-items:flex-start;justify-content:center;width:820px;max-width:calc(100% - 40px)}
.steps__i{width:100px;flex:none;display:flex;flex-direction:column;align-items:center;gap:10px}
.steps__c{width:60px;height:60px;border-radius:50%;border:3px solid #fff;background:#54C4E8;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:"Titillium Web",sans-serif;font-weight:600;font-size:22px;line-height:1;letter-spacing:.02em}
.steps__c small{font-size:10px;letter-spacing:.06em;margin-bottom:1px;font-weight:600}
.steps__t{font-weight:700;font-size:19px;line-height:24px;white-space:nowrap}
.steps__bar{flex:1;display:flex;align-items:center;height:60px;padding:0 6px;gap:0}
.steps__bar i{height:25px;display:block;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 50%,calc(100% - 9px) 100%,0 100%,9px 50%);margin-left:-5px}
.steps__bar i:nth-child(1){flex:143;background:#fff;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 50%,calc(100% - 9px) 100%,0 100%);margin-left:0}
.steps__bar i:nth-child(2){flex:92;background:rgba(255,255,255,.85)}
.steps__bar i:nth-child(3){flex:48;background:rgba(255,255,255,.6)}
.steps.is-in .steps__bar i{animation:stepFlow 2.8s ease-in-out infinite}
.steps.is-in .steps__bar i:nth-child(2){animation-delay:.15s}
.steps.is-in .steps__bar i:nth-child(3){animation-delay:.3s}
@keyframes stepFlow{0%,100%{opacity:1}50%{opacity:.55}}

/* 横に流れるカード列（サービス / 導入事例 共通） */
.rail{display:flex;gap:40px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;padding:20px calc((100% - 1200px) / 2) 30px;scroll-padding:0 calc((100% - 1200px) / 2)}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start;flex:none}
.rail.is-drag{scroll-snap-type:none;cursor:grabbing}
.rail--svc{justify-content:safe center}
@media (min-width:1241px){.rail--svc{overflow:visible}.rail--svc+.dots{visibility:hidden}}
.dots{display:flex;justify-content:center;gap:12px;margin-top:10px}
.dots button{width:10px;height:10px;padding:0;border:1px solid #54C4E8;background:#fff;cursor:pointer;transition:background .25s}
.dots button.is-on{background:#54C4E8}
.dots--w button{border-color:#fff;background:#54C4E8}
.dots--w button.is-on{background:#fff}

.scard{position:relative;width:270px;min-height:360px;border-radius:10px;background:#fff;box-shadow:0 0 30px rgba(0,0,0,.1);padding:35px 25px;display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--ink);
  transition:transform .45s var(--ease-out),box-shadow .45s var(--ease-out)}
.scard--rec{background:#FFF8EA;border:3px solid #FFBF3F;padding:32px 22px}
.scard__rib{position:absolute;left:-28px;top:20px;width:113px;height:30px;display:grid;place-items:center;transform:rotate(-30deg);background:linear-gradient(90deg,#EC008C,#FC6767);border:1px solid #fff;color:#fff;font-weight:700;font-size:14px;box-shadow:0 2px 4px rgba(0,0,0,.15)}
.scard__h{font-family:var(--seed);font-weight:700;font-size:26px;line-height:42px;color:var(--slate);text-align:center;white-space:nowrap}
.scard__ic{width:90px;height:90px}
.scard__p{font-weight:500;font-size:15px;line-height:26px;align-self:stretch;margin-top:10px;min-height:78px}
.morebtn{margin-top:auto;width:180px;height:46px;border-radius:999px;background:var(--slate);color:#fff;display:flex;align-items:center;justify-content:center;gap:10px;font-family:var(--seed);font-weight:700;font-size:16px;transition:background .3s,transform .3s var(--ease-out)}
.morebtn i{width:8px;height:8px;border-right:2px solid #fff;border-top:2px solid #fff;transform:rotate(45deg);transition:transform .3s var(--ease-out)}
@media (hover:hover){
  .scard:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(10,40,90,.18)}
  .morebtn:hover{background:#3b3b57}
  .morebtn:hover i{transform:translateX(3px) rotate(45deg)}
}

@media (max-width:780px){
  .svc{padding:70px 0 70px}
  .ttl--svc{width:auto;margin:0 0 40px;padding:0 20px}
  .ttl--svc .ttl__en{margin-left:0;font-size:16px;line-height:26px}
  .svc__lead{font-size:14px;line-height:28px;padding:0 20px;margin-bottom:45px}
  .steps{width:346px;margin-bottom:45px}
  .steps__i{width:65px;gap:5px}
  .steps__c{width:46px;height:46px;border-width:2px;font-size:17px}
  .steps__c small{font-size:8px}
  .steps__t{font-size:12px;line-height:16px}
  .steps__bar{height:46px;padding:0 2px}
  .steps__bar i{height:13px}
  .rail{gap:40px;padding:20px 20px 30px;scroll-padding:0 20px}
  .rail--svc{justify-content:flex-start}
}

/* ==========================================================
   自社AIプロダクト
   ========================================================== */
.prd{background:#fff;padding:100px 0 110px;position:relative;overflow:hidden}
.prd__tab{position:absolute;left:0;top:100px;width:196px;height:89px;display:flex;align-items:center;padding-left:30px;border-radius:0 5px 5px 0;background:linear-gradient(90deg,#3494E6,#EC6EAD);color:#fff;font-family:var(--seed);font-weight:700;font-size:18px}
.prd__hero{max-width:954px;margin-top:55px;display:flex;gap:44px;align-items:flex-start;padding:0 20px;box-sizing:content-box}
.prd__hero{margin-left:max(20px,calc(50% - 361px));margin-right:auto}
.prd__txt{width:640px;flex:none}
.prd__logo{margin:0 0 40px}
.prd__logo img{width:255px;height:auto}
.prd__h{font-weight:700;font-size:28px;line-height:40px;background:var(--grad-ttl);-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:30px;display:inline-block}
.prd__p{font-weight:500;font-size:16px;line-height:30px;color:var(--ink)}
.prd__ill{width:270px;flex:none}
.prd__ill img{width:100%;animation:floaty 6s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

.ps{display:flex;align-items:center;justify-content:center;gap:34px;margin:100px auto 0;padding:0 20px}
.ps__box{width:400px;border-radius:15px;overflow:hidden;background:#fff;flex:none}
.ps__h{height:60px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:24px;line-height:30px;letter-spacing:.02em}
.ps__box--q .ps__h{background:#EBEDF0;color:#241D6D}
.ps__box--a .ps__h{background:linear-gradient(90deg,#FC6767,#EC008C);color:#fff}
.ps__l{list-style:none;margin:0;padding:20px;border:2px solid #EBEDF0;border-top:0;border-radius:0 0 15px 15px;display:grid;gap:5px}
.ps__box--a .ps__l{border:2px solid transparent;border-top:0;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(90deg,#FC6767,#EC008C) border-box}
.ps__l li{position:relative;padding-left:20px;font-weight:500;font-size:16px;line-height:30px;color:#000}
.ps__l li::before{content:"";position:absolute;left:2px;top:9px;border-left:10px solid var(--slate);border-top:6px solid transparent;border-bottom:6px solid transparent}
.ps__box--q .ps__l li:first-child::before{border-left-color:#ED2B5B}
.ps__box--a .ps__l li::before{border-left-color:#54C4E8}
.ps__arrow{width:45px;flex:none;display:grid;place-items:center}
.ps.is-in .ps__arrow svg{animation:nudge 1.8s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(6px)}}
.ps.is-in .ps__box--a .ps__l li{animation:liIn .6s var(--ease-out) both}
.ps.is-in .ps__box--a .ps__l li:nth-child(1){animation-delay:.5s}.ps.is-in .ps__box--a .ps__l li:nth-child(2){animation-delay:.6s}.ps.is-in .ps__box--a .ps__l li:nth-child(3){animation-delay:.7s}.ps.is-in .ps__box--a .ps__l li:nth-child(4){animation-delay:.8s}.ps.is-in .ps__box--a .ps__l li:nth-child(5){animation-delay:.9s}
@keyframes liIn{from{opacity:0;transform:translateX(10px)}to{opacity:1;transform:none}}

.cases{margin-top:100px}
.cases__h{width:max-content;margin:0 auto 70px;font-weight:700;font-size:28px;line-height:30px;color:var(--ink);text-align:center;padding-bottom:18px;position:relative}
.cases__h::after{content:"";position:absolute;left:-4px;right:-4px;bottom:0;height:5px;background:linear-gradient(90deg,#0071FF,#54C4E8)}
.rail--case{gap:50px;padding-top:40px;padding-left:max(20px,calc(50% - 593px));scroll-padding-left:max(20px,calc(50% - 593px));padding-right:40px}
.case{width:330px;min-height:431px;background:#fff;border:2px solid var(--slate);border-radius:8px;padding:40px 25px 30px;position:relative;margin-top:31px}
.case__top{position:absolute;left:25px;right:25px;top:-31px;height:49px}
.case__ind{position:absolute;left:30px;top:0;width:200px;height:49px;background:var(--slate);color:#fff;display:grid;place-items:center;font-weight:700;font-size:20px;letter-spacing:.05em}
.case__av{position:absolute;left:217px;top:-17px;width:76px;height:76px;border-radius:50%;border:3px solid #fff}
.case__h{margin:18px 0 15px;text-align:center;font-family:var(--seed);font-weight:700;font-size:18px;line-height:34px;letter-spacing:.05em;background:linear-gradient(90deg,#EC008C,#FC6767);-webkit-background-clip:text;background-clip:text;color:transparent}
.case__h em{font-style:normal;font-size:24px}
.case__h em.s{font-size:20px}
.case__p{font-size:14px;line-height:28px;color:var(--ink)}
@media (hover:hover){.case{transition:transform .45s var(--ease-out),box-shadow .45s}.case:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(20,24,60,.12)}}

@media (max-width:1100px) and (min-width:781px){
  .prd__hero{margin-left:auto;margin-right:auto;max-width:900px}
  .prd__txt{width:auto;flex:1}
  .ps__box{width:calc(50% - 60px)}
}
@media (max-width:780px){
  .prd{padding:80px 0 80px}
  .prd__tab{top:80px;width:133px;height:58px;padding-left:10px;font-size:14px}
  .prd__hero{display:block;margin:0;padding:178px 20px 0;max-width:none;position:relative}
  .prd__ill{position:absolute;right:0;top:44px;width:150px}
  .prd__txt{width:auto}
  .prd__logo{margin-bottom:40px}
  .prd__logo img{width:218px}
  .prd__h{font-size:20px;line-height:30px}
  .prd__p{font-size:16px;line-height:30px}
  .ps{flex-direction:column;gap:25px;margin-top:90px}
  .ps__box{width:100%;max-width:350px}
  .ps__h{font-size:20px}
  .ps__l{padding:30px 20px;gap:15px}
  .ps__l li{line-height:24px}
  .ps__l li::before{top:6px}
  .ps__arrow{transform:rotate(90deg)}
  .ps.is-in .ps__arrow svg{animation:none}
  .cases{margin-top:100px}
  .cases__h{font-size:24px;margin-bottom:50px}
  .cases__h::after{height:4px}
  .rail--case{gap:40px;padding:40px 30px 30px;scroll-padding:0 30px}
  .case{width:329px;max-width:calc(100vw - 60px)}
  .case__ind{left:calc(50% - 130px)}
  .case__av{left:auto;right:-8px}
}

/* ==========================================================
   Footer
   ========================================================== */
.ft{background:var(--slate);color:#fff}
.ft__in{max-width:1366px;margin:0 auto;padding:73px 43px 0 90px;display:flex;justify-content:flex-start;gap:0}
.ft__main{width:670px;flex:none}
.ft__logo img{width:329px;height:40px}
.ft__msg{margin:30px 0 30px;font-weight:500;font-size:18px;line-height:22px}
.ft__btns{display:flex;gap:40px}
.ftbtn{width:315px;height:52px;border-radius:100px;display:flex;align-items:center;justify-content:center;gap:6px;font-weight:700;font-size:18px;transition:background .3s,color .3s,transform .3s var(--ease-out)}
.ftbtn--line{border:2px solid #fff;color:#fff}
.ftbtn--fill{background:#fff;color:var(--slate);border:2px solid var(--slate)}
@media (hover:hover){.ftbtn--line:hover{background:rgba(255,255,255,.12)}.ftbtn--fill:hover{background:#eef1fb}.ftbtn:hover{transform:translateY(-2px)}}
.ico{width:28px;height:28px;display:inline-block;background:currentColor;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat}
.ico--mail{--i:url(../svg/icon-mail.svg)}
.ico--doc{--i:url(../svg/icon-doc.svg)}
.ft__nav{display:flex;gap:60px;margin-left:124px}
.ft__col{min-width:112px}
.ft__t{font-weight:700;font-size:16px;line-height:30px;margin-bottom:10px}
.ft__col ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ft__col a{font-weight:500;font-size:14px;line-height:30px;opacity:.9;transition:opacity .2s}
.ft__col a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.ft__copy{text-align:center;font-size:10px;line-height:1;padding:62px 0 22px}
@media (max-width:1100px) and (min-width:781px){.ft__in{padding:73px 40px 0;flex-wrap:wrap;gap:40px}.ft__main{width:auto}.ft__nav{margin-left:0}.ftbtn{width:260px}}
@media (max-width:780px){
  .ft__in{flex-direction:column;align-items:center;padding:70px 30px 0;gap:60px}
  .ft__main{display:flex;flex-direction:column;align-items:center;width:100%;max-width:330px}
  .ft__nav{margin-left:0}
  .ft__logo img{width:288px;height:auto}
  .ft__msg{text-align:center;margin:60px 0 25px;font-size:16px;line-height:26px}
  .ft__btns{flex-direction:column;gap:25px;width:100%}
  .ftbtn{width:100%}
  .ftbtn--line{border-width:1px}
  .ft__nav{gap:50px;padding:0}
  .ft__col ul{gap:8px}
  .ft__col a{font-weight:400}
  .ft__copy{padding:60px 0 30px}
}

/* 言語切替 */
.hd__btns{align-items:center}
.hd__lang{display:inline-grid;place-items:center;height:30px;min-width:40px;padding:0 10px;margin-left:-4px;border:1.5px solid #c9cde0;border-radius:999px;font-family:"Titillium Web",sans-serif;font-weight:600;font-size:13px;letter-spacing:.06em;color:var(--slate);transition:border-color .25s,color .25s,background .25s}
.hd__lang:hover{border-color:#5856D6;color:#5856D6}
.spmenu__lang{display:flex;gap:18px;justify-content:center;font-size:14px;margin:0}
.spmenu__lang span{font-weight:700;border-bottom:1px solid #fff}
.spmenu__lang a{opacity:.75}
.spmenu__lang,.spmenu__btns{opacity:0;transform:translateY(10px);transition:opacity .4s,transform .5s var(--ease-out)}
.hd.is-menu .spmenu__lang{opacity:1;transform:none;transition-delay:.5s}
/* PC幅が狭いとき（781〜1180px）はナビの間隔を詰める */
@media (max-width:1180px) and (min-width:781px){.hd__nav{gap:28px;margin-right:24px}.hd__btns{gap:10px}.btn{width:136px;font-size:14px}}

/* 英語版：見出しはテキストで表示 */
.fv__title--en{width:auto;text-align:center}
.fv__title--en .fv__wipe{font-family:"Noto Sans JP",sans-serif;font-weight:700;color:#fff;font-size:clamp(40px,4.4vw,64px);line-height:1.28;letter-spacing:.005em;padding:0 .1em}
@media (max-width:780px){.fv__title--en .fv__wipe{font-size:34px;line-height:1.32}}
/* 英語版の調整 */
html[lang="en"] .scard__h{font-size:22px;line-height:28px;min-height:56px;display:flex;align-items:center}
html[lang="en"] .scard__p{font-size:14px;line-height:23px}
html[lang="en"] .steps__i{width:auto;min-width:100px}
html[lang="en"] .steps__t{font-size:16px}
html[lang="en"] .case__h{font-size:16px;line-height:28px;letter-spacing:.01em}
html[lang="en"] .case__h em{font-size:22px}
html[lang="en"] .case__p{line-height:24px}
html[lang="en"] .ps__l li{line-height:26px;padding-top:2px;padding-bottom:2px}
html[lang="en"] .ps__h{font-size:22px}
html[lang="en"] .about__body p b:not(.b-deva):not(.b-lg){color:var(--slate)}
html[lang="en"] .about__body .b-lg{font-size:inherit}
html[lang="en"] .prd__tab{font-size:16px}
html[lang="en"] .smapv__pill{font-size:13px;text-align:center}
html[lang="en"] .mflow button{font-size:12px}
@media (max-width:780px){
  html[lang="en"] .steps__t{font-size:11px;white-space:normal;text-align:center;max-width:80px}
  html[lang="en"] .ps__h{font-size:18px}
  html[lang="en"] .prd__tab{font-size:12px;width:150px}
}
html[lang="en"] .about__body br{display:inline!important}

/* ==========================================================
   Our Service：キービジュアルと同じ紺のトーンに統一
   ========================================================== */
.svc{background:var(--kv-base);position:relative;isolation:isolate}
.svc::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 55% at 12% 8%,rgba(88,86,214,.45),transparent 70%),radial-gradient(55% 60% at 92% 92%,rgba(48,176,199,.35),transparent 70%),radial-gradient(40% 40% at 70% 10%,rgba(0,113,255,.22),transparent 70%)}
.svc::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(160,200,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(160,200,255,.045) 1px,transparent 1px);background-size:56px 56px;
  -webkit-mask-image:linear-gradient(to bottom,transparent,#000 20%,#000 80%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 20%,#000 80%,transparent)}
.ttl--svc .ttl__main{background:linear-gradient(90deg,#fff 0%,#bfe9ff 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ttl--svc .ttl__en{color:#9fdcff;-webkit-text-fill-color:#9fdcff}
.steps__c{background:var(--kv-base);border-color:#54C4E8;color:#fff;box-shadow:0 0 18px rgba(84,196,232,.35)}
.steps__bar i:nth-child(1){background:linear-gradient(90deg,#5856D6,#54C4E8)}
.steps__bar i:nth-child(2){background:rgba(84,196,232,.7)}
.steps__bar i:nth-child(3){background:rgba(84,196,232,.4)}
.scard{box-shadow:0 12px 40px rgba(0,0,0,.35)}
.scard__h{font-size:22px;line-height:30px;min-height:60px;display:flex;align-items:center;justify-content:center;white-space:normal}
@media (hover:hover){.scard:hover{box-shadow:0 18px 44px rgba(0,0,0,.4),0 0 0 1px rgba(84,196,232,.6),0 0 30px rgba(84,196,232,.25)}}
.dots--w button{border-color:#54C4E8;background:transparent}
.dots--w button.is-on{background:#54C4E8}
html[lang="en"] .scard__h{font-size:20px;line-height:26px;min-height:60px}

/* スマホ版マップ：サービスから飛んだときの強調 */
.is-flash{animation:flash 1.1s ease-in-out 3}
@keyframes flash{0%,100%{box-shadow:0 0 0 0 rgba(84,196,232,0)}50%{box-shadow:0 0 0 4px rgba(84,196,232,.75),0 0 24px rgba(84,196,232,.5)}}
.smapv__link.is-flash{animation:none}
.smapv__link.is-flash .smapv__pill{animation:flash 1.1s ease-in-out 3}

/* ===== 2026-11 upgrade: Our Service motion / map-grade visuals ===== */
/* service icon orb (same ring language as the AI Solution Map) */
.scard__orb{position:relative;width:118px;height:118px;display:grid;place-items:center;flex:none;margin:2px 0}
.scard__orb::before{content:"";position:absolute;inset:0;background:url(../svg/orb-ring.svg) center/100% no-repeat;animation:ringSpin 18s linear infinite}
.scard__orb::after{content:"";position:absolute;inset:14px;border-radius:50%;box-shadow:0 0 0 0 rgba(88,86,214,.25);animation:orbPulse 3.2s ease-out infinite}
.scard__orb .scard__ic{position:relative;z-index:1;border-radius:50%;background:#fff;box-shadow:0 6px 18px rgba(4,38,91,.12)}
.scard:nth-child(2) .scard__orb::before{animation-duration:14s;animation-direction:reverse}
.scard:nth-child(3) .scard__orb::before{animation-duration:20s}
.scard:nth-child(4) .scard__orb::before{animation-duration:16s;animation-direction:reverse}
.scard:nth-child(2) .scard__orb::after{animation-delay:.8s}
.scard:nth-child(3) .scard__orb::after{animation-delay:1.6s}
.scard:nth-child(4) .scard__orb::after{animation-delay:2.4s}
.scard:hover .scard__orb::before{animation-duration:4s}
@keyframes orbPulse{0%{box-shadow:0 0 0 0 rgba(88,86,214,.28)}70%,100%{box-shadow:0 0 0 18px rgba(88,86,214,0)}}

/* cards: staggered entrance + one light sweep, then hover sheen */
.scard{position:relative;overflow:hidden;isolation:isolate}
.scard::after{content:"";position:absolute;inset:-20% -60%;z-index:2;pointer-events:none;
  background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%);transform:translateX(-100%)}
.scard--rec{overflow:visible}
.scard--rec::after{inset:0;border-radius:inherit}
.rail--svc.is-in .scard{animation:cardIn .9s cubic-bezier(.2,.7,.2,1) both}
.rail--svc.is-in .scard:nth-child(2){animation-delay:.12s}
.rail--svc.is-in .scard:nth-child(3){animation-delay:.24s}
.rail--svc.is-in .scard:nth-child(4){animation-delay:.36s}
.rail--svc.is-in .scard::after{animation:sweep 1.4s .7s ease-in-out both}
.rail--svc.is-in .scard:nth-child(2)::after{animation-delay:.85s}
.rail--svc.is-in .scard:nth-child(3)::after{animation-delay:1s}
.rail--svc.is-in .scard:nth-child(4)::after{animation-delay:1.15s}
.rail--svc .scard:hover::after{animation:sweep .9s ease-in-out both}
@keyframes cardIn{from{opacity:0;transform:translateY(40px) scale(.97)}to{opacity:1;transform:none}}
@keyframes sweep{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.scard--rec{box-shadow:0 12px 40px rgba(0,0,0,.35),0 0 0 0 rgba(255,191,63,.5);animation:none}
.rail--svc.is-in .scard--rec{animation:cardIn .9s .12s cubic-bezier(.2,.7,.2,1) both,recGlow 2.8s 1.4s ease-in-out infinite}
@keyframes recGlow{50%{box-shadow:0 12px 40px rgba(0,0,0,.35),0 0 0 4px rgba(255,191,63,.35),0 0 34px rgba(255,191,63,.35)}}

/* steps: 01 → 02 → 03 light up in turn, light runs along the arrows */
.steps.is-in .steps__c{animation:stepOn 4.5s ease-in-out infinite}
.steps.is-in .steps__i:nth-child(3) .steps__c{animation-delay:1.5s}
.steps.is-in .steps__i:nth-child(5) .steps__c{animation-delay:3s}
@keyframes stepOn{0%,30%,100%{box-shadow:0 0 18px rgba(84,196,232,.35);transform:scale(1)}12%{box-shadow:0 0 0 6px rgba(84,196,232,.18),0 0 34px rgba(84,196,232,.8);transform:scale(1.1)}}
.steps__bar{position:relative}
.steps__bar::after{content:"";position:absolute;top:50%;left:0;width:46px;height:6px;margin-top:-3px;border-radius:3px;opacity:0;
  background:radial-gradient(closest-side,#fff,rgba(159,231,255,.8) 40%,transparent);filter:blur(.5px)}
.steps.is-in .steps__bar::after{animation:barRun 4.5s ease-in-out infinite}
.steps.is-in .steps__bar:nth-child(4)::after{animation-delay:1.5s}
@keyframes barRun{0%{left:0;opacity:0}5%{opacity:1}28%{left:calc(100% - 46px);opacity:1}33%,100%{left:calc(100% - 46px);opacity:0}}

/* ANArag visual (replaces the stock illustration) */
.prd__ill{width:320px}
.prd__ill img{animation:none;width:100%;height:auto}
@media (max-width:780px){.prd__ill{width:170px;top:30px;right:6px}}

/* case studies: industry icons instead of stock avatars */
.case__av{background:#fff;border:0;box-shadow:0 6px 16px rgba(4,38,91,.15)}
.case:hover .case__av{animation:avBob .8s ease-in-out}
@keyframes avBob{50%{transform:translateY(-4px)}}

@media (prefers-reduced-motion:reduce){
  .scard__orb::before,.scard__orb::after,.steps__c,.steps__bar::after,.scard::after,.case__av{animation:none!important}
  .rail--svc.is-in .scard,.rail--svc.is-in .scard--rec{animation:none!important}
}

/* ===== 2026-11 wide screens: let the AI Solution Map grow with the window ===== */
@media (min-width:1281px){
  .map__card{max-width:min(1480px, calc(100vw - 120px));padding:48px 40px 32px}
  .map__fig{max-width:min(1360px, calc(100vw - 200px))}
  .map__h{font-size:clamp(24px, 1.7vw, 30px)}
  .map__p{font-size:clamp(16px, 1.05vw, 18px)}
  .mflow{transform:scale(1.08);transform-origin:center top;margin-bottom:10px}
}

/* ===== 2026-11 wide screens: fill the width instead of leaving wide side margins ===== */
@media (min-width:1281px){
  .hd__in,.ft__in{max-width:min(1600px, 94vw)}
  .map{padding:90px 20px 96px}
  .about{padding:100px 60px 110px}
  .about__in{max-width:min(1400px, 90vw);margin:0 auto;grid-template-columns:minmax(280px, 26%) minmax(0, 1fr);column-gap:clamp(60px, 6vw, 140px)}
  .about__body{font-size:clamp(16px, 1.05vw, 19px);line-height:2}
  .svc__in{max-width:min(1600px, 94vw)}
  .ttl--svc{margin-left:clamp(133px, 8vw, 200px)}
  .svc__lead{font-size:clamp(18px, 1.2vw, 22px);line-height:1.7}
  .steps{width:min(1000px, 62vw)}
  .rail--svc{gap:clamp(40px, 2.4vw, 56px);padding-left:0;padding-right:0;scroll-padding:0}
  .scard{width:clamp(270px, 19vw, 360px);min-height:clamp(360px, 25vw, 450px)}
  .scard__h{font-size:clamp(20px, 1.35vw, 26px);line-height:1.35}
  .scard__p{font-size:clamp(15px, 1vw, 17px);line-height:1.75}
  .scard__orb{width:clamp(118px, 8vw, 150px);height:clamp(118px, 8vw, 150px)}
  .scard__orb .scard__ic{width:clamp(90px, 6.1vw, 114px);height:auto}
  .prd{padding:90px 0 100px}
  .prd__hero{max-width:min(1300px, 84vw);margin-left:auto;margin-right:auto;gap:clamp(44px, 5vw, 100px)}
  .prd__txt{width:auto;flex:1;min-width:0}
  .prd__ill{width:clamp(320px, 25vw, 460px)}
  .prd__h{font-size:clamp(28px, 2vw, 38px);line-height:1.45}
  .prd__p{font-size:clamp(16px, 1.05vw, 18px);line-height:2}
  .ps{gap:clamp(34px, 3vw, 60px)}
  .ps__box{width:clamp(400px, 31vw, 580px)}
  .ps__h{font-size:clamp(22px, 1.5vw, 28px);height:auto;padding:14px 10px}
  .ps__l li{font-size:clamp(16px, 1.05vw, 18px);line-height:1.9}
  .rail--case{gap:clamp(50px, 3vw, 64px);padding-left:max(20px, calc(50% - min(820px, 47vw)));scroll-padding-left:max(20px, calc(50% - min(820px, 47vw)))}
  .case{width:clamp(330px, 22.5vw, 410px)}
  .case__p{font-size:clamp(14px, .95vw, 16px);line-height:1.95}
  .case__av{left:auto;right:-6px}
}

/* ===== 2026-11 service dropdown: readable list (name + one-line description) ===== */
.hd__pulllist{left:50%;width:auto;min-width:340px;padding:8px;gap:2px;border-radius:10px;
  transform:translate(-50%,-6px);box-shadow:0 18px 40px rgba(14,40,65,.16),0 0 0 1px rgba(14,40,65,.06)}
.hd__pull:hover .hd__pulllist,.hd__pull:focus-within .hd__pulllist,.hd__pull.is-open .hd__pulllist{transform:translate(-50%,0)}
.hd__pulllist::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px}
.hd__pulllist a{display:grid;grid-template-columns:4px 1fr 14px;grid-template-rows:auto auto;column-gap:14px;align-items:center;
  padding:12px 14px;border-radius:8px;line-height:1.35;background:none;-webkit-background-clip:border-box;background-clip:border-box;color:var(--navy,#0E2841);transition:background .2s}
.hd__pulllist a::before{content:"";grid-row:1/3;align-self:stretch;width:4px;border-radius:2px;background:var(--c,#5856D6)}
.hd__pulllist a::after{content:"";grid-row:1/3;grid-column:3;width:8px;height:8px;border-right:2px solid currentColor;border-top:2px solid currentColor;transform:rotate(45deg);opacity:.35;transition:transform .2s,opacity .2s}
.hd__pulllist a b{font-size:15px;font-weight:700;white-space:nowrap;color:#1A2233}
.hd__pulllist a small{grid-column:2;font-size:12px;font-weight:500;color:#6B7584;white-space:nowrap}
.hd__pulllist a:hover{opacity:1;background:#F2F5FA}
.hd__pulllist a:hover::after{opacity:.8;transform:translateX(3px) rotate(45deg)}
.hd__pulllist a:focus-visible{outline:2px solid var(--c,#5856D6);outline-offset:-2px}
