@charset "UTF-8";
/* =========================================================
   SOLEIL DENTAL CLINIC — Top page
   Design tokens / base
   ========================================================= */
:root{
  --bg:#f5f6f3;
  --bg-2:#eceee9;
  --ink:#151714;
  --muted:#72776f;
  --line:#d7dbd2;
  --cyan:#a9f5ef;
  --violet:#cfc1ff;
  --lime:#d8ff7b;
  --blue:#6557e8;
  --navy-1:#26354b;
  --navy-2:#334865;
  --navy-3:#405673;
  --ease:cubic-bezier(.22,1,.36,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
  --header:86px;
  --font-en:"DM Sans","Noto Sans JP",sans-serif;
  --font-jp:"Noto Sans JP",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-en);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
ul,ol{margin:0;padding:0;list-style:none}
::selection{background:var(--ink);color:#fff}
svg{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}

/* =========================================================
   HEADER
   ========================================================= */
.site-header{height:var(--header);position:fixed;z-index:50;left:0;top:0;width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 3vw;border-bottom:1px solid rgba(21,23,20,.12);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:rgba(245,246,243,.8);transition:height .4s var(--ease),background .4s,transform .5s var(--ease)}
.site-header.is-scrolled{--header:70px;background:rgba(245,246,243,.92);box-shadow:0 8px 30px rgba(21,23,20,.06)}
.site-header.is-hidden{transform:translateY(-100%)}
.brand{display:inline-flex;align-items:center;gap:12px;justify-self:start}
.brand-mark{width:38px;height:38px;border-radius:50%;border:1.5px solid currentColor;display:grid;place-items:center;font-size:17px;position:relative;overflow:hidden;transition:background .4s,color .4s}
.brand-mark::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--cyan),var(--lime));transform:translateY(100%);transition:transform .5s var(--ease);z-index:-1}
.brand-mark svg{position:relative;z-index:1}
.brand:hover .brand-mark{border-color:transparent;color:var(--ink)}
.brand:hover .brand-mark::after{transform:none}
.brand-mark{isolation:isolate}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-text b{font-size:16px;letter-spacing:.2em}
.brand-text small{font-size:10px;margin-top:6px;letter-spacing:.08em}
.global-nav{display:flex;gap:2.2vw;font-size:12px;font-weight:600}
.global-nav a{position:relative;display:inline-block;overflow:hidden;height:1.5em;line-height:1.5em}
.global-nav a span{display:block;transition:transform .5s var(--ease)}
.global-nav a::before{content:attr(data-en);position:absolute;left:0;top:100%;width:100%;letter-spacing:.14em;font-size:11px;transition:transform .5s var(--ease)}
.global-nav a:hover span{transform:translateY(-100%)}
.global-nav a:hover::before{transform:translateY(-100%)}
.global-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--ink);transition:right .35s var(--ease)}
.global-nav a:hover::after{right:0}
.header-right{justify-self:end;display:flex;align-items:center;gap:20px}
.header-tel{display:flex;align-items:center;gap:10px}
.header-tel svg{font-size:20px;padding:8px;width:36px;height:36px;border-radius:50%;background:var(--ink);color:var(--lime);transition:transform .45s var(--ease)}
.header-tel:hover svg{transform:rotate(-14deg) scale(1.08)}
.header-tel span{display:flex;flex-direction:column;line-height:1.1}
.header-tel small{font-size:9px;letter-spacing:.12em;color:var(--muted)}
.header-tel b{font-size:17px;letter-spacing:.04em}
.header-contact{display:flex;gap:22px;align-items:center;border:1px solid var(--ink);padding:13px 14px 13px 20px;font-size:12px;font-weight:700;letter-spacing:.08em;position:relative;overflow:hidden;isolation:isolate;transition:color .45s var(--ease)}
.header-contact::before{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease);z-index:-1}
.header-contact:hover{color:#fff}
.header-contact:hover::before{transform:scaleX(1);transform-origin:left}
.header-contact i{display:grid;place-items:center;font-size:14px;transition:transform .45s var(--ease)}
.header-contact:hover i{transform:rotate(45deg)}
.menu-btn{display:none;background:none;border:0;width:46px;height:46px;position:relative;cursor:pointer;z-index:60}
.menu-btn i{position:absolute;width:22px;height:1.5px;background:currentColor;left:12px;top:19px;transition:transform .45s var(--ease),top .3s}
.menu-btn i+i{top:27px}
.menu-btn.is-open{color:#fff}
.menu-btn.is-open i{top:23px;transform:rotate(25deg)}
.menu-btn.is-open i+i{transform:rotate(-25deg)}
.mobile-menu{display:none}

/* =========================================================
   HERO
   ========================================================= */
.hero{min-height:100svh;padding:calc(var(--header) + 4vw) 4vw 4vw;position:relative;display:grid;grid-template-columns:1.2fr .8fr;gap:3vw;align-items:end;overflow:hidden}
.hero-grid-bg{position:absolute;inset:0;pointer-events:none;opacity:.5;background-image:linear-gradient(rgba(21,23,20,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(21,23,20,.05) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(circle at 30% 60%,#000 0%,transparent 70%);-webkit-mask-image:radial-gradient(circle at 30% 60%,#000 0%,transparent 70%)}
.hero-content{position:relative;z-index:2;padding-bottom:3vw}
.eyebrow,.section-no{font-size:11px;letter-spacing:.16em;font-weight:700;text-transform:uppercase;margin:0}
.eyebrow{display:flex;align-items:center;gap:10px}
.dot-live{width:8px;height:8px;border-radius:50%;background:#7ee8a0;box-shadow:0 0 0 0 rgba(126,232,160,.6);animation:livePulse 2s infinite}
@keyframes livePulse{70%{box-shadow:0 0 0 10px rgba(126,232,160,0)}100%{box-shadow:0 0 0 0 rgba(126,232,160,0)}}
.hero-title{margin:3vh 0 4vh;font-family:var(--font-jp);font-size:clamp(50px,7vw,122px);line-height:1.08;letter-spacing:-.05em;font-weight:600}
.hero-line-wrap{display:block;overflow:hidden;padding-bottom:.04em}
.hero-line{display:block;transform:translateY(110%);opacity:0}
.is-ready .hero-line{animation:heroIn 1.25s var(--ease) forwards}
.is-ready .hero-line.line-2{animation-delay:.12s}
.accent-word{display:inline-block;position:relative;z-index:1}
.accent-word::after{content:"";position:absolute;z-index:-1;left:2%;right:-2%;height:.26em;bottom:.08em;background:linear-gradient(90deg,var(--cyan),var(--lime));transform:scaleX(0);transform-origin:left}
.is-ready .accent-word::after{animation:accentIn .9s .9s var(--ease) forwards}
@keyframes heroIn{to{transform:none;opacity:1}}
@keyframes accentIn{to{transform:scaleX(1)}}
.hero-fade{opacity:0;transform:translateY(24px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.is-ready .hero-fade{opacity:1;transform:none}
.is-ready .hero-copy.hero-fade{transition-delay:.45s}
.is-ready .hero-badges.hero-fade{transition-delay:.6s}
.hero-copy{max-width:580px;font-size:14px;line-height:2;color:#444940;margin:0}
.hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.hero-badges li{display:flex;align-items:center;gap:10px;padding:10px 16px 10px 10px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.55);backdrop-filter:blur(6px);transition:transform .45s var(--ease),border-color .3s,background .3s}
.hero-badges li:hover{transform:translateY(-4px);border-color:var(--ink);background:#fff}
.hero-badges svg{width:32px;height:32px;padding:7px;border-radius:50%;background:var(--ink);color:var(--cyan)}
.hero-badges span{font-size:11px;line-height:1.2;display:flex;flex-direction:column}
.hero-badges b{font-size:13px}
.scroll-cue{position:absolute;bottom:0;right:0;display:flex;align-items:center;gap:14px;font-size:9px;letter-spacing:.2em}
.scroll-cue i{width:70px;height:1px;background:var(--ink);position:relative;overflow:hidden}
.scroll-cue i::after{content:"";position:absolute;width:30px;height:1px;background:var(--bg);animation:scrollLine 1.7s infinite}
@keyframes scrollLine{from{transform:translateX(-30px)}to{transform:translateX(80px)}}
.hero-visual{align-self:stretch;display:flex;align-items:center;justify-content:center;padding-top:2vw;position:relative;z-index:2}
.visual-frame{width:100%;height:min(68vh,720px);border-radius:0 0 48% 48%;position:relative;overflow:hidden;background:#d9ded6;box-shadow:0 30px 80px rgba(20,25,20,.18);clip-path:inset(100% 0 0 0);transition:clip-path 1.6s .25s var(--ease-io)}
.is-ready .visual-frame{clip-path:inset(0 0 0 0)}
.frame-photo{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover;filter:saturate(.82) contrast(.96);transform:scale(1.15);transition:transform 2.4s .3s var(--ease)}
.is-ready .frame-photo{transform:scale(1)}
.visual-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,15,12,.03) 35%,rgba(10,15,12,.55) 100%);pointer-events:none}
.visual-copy{position:absolute;z-index:2;left:9%;bottom:10%;color:#fff}
.visual-copy small{font-size:10px;letter-spacing:.18em}
.visual-copy strong{display:block;font-size:clamp(30px,3.8vw,60px);line-height:.98;margin-top:16px;letter-spacing:-.04em}
.visual-spark{position:absolute;z-index:2;top:8%;right:10%;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-size:24px;color:var(--ink);background:var(--lime);animation:sparkFloat 4s ease-in-out infinite}
@keyframes sparkFloat{50%{transform:translateY(-10px) rotate(8deg)}}
.hero-float-card{position:absolute;left:-12%;bottom:14%;z-index:3;display:flex;align-items:center;gap:14px;padding:16px 22px 16px 16px;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border-radius:16px;box-shadow:0 18px 50px rgba(20,25,20,.14);opacity:0;transform:translateY(30px);transition:opacity 1s 1.3s var(--ease),transform 1s 1.3s var(--ease)}
.is-ready .hero-float-card{opacity:1;transform:none}
.float-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-size:22px;background:linear-gradient(135deg,var(--cyan),var(--violet))}
.hero-float-card small{display:block;font-size:8px;letter-spacing:.18em;color:var(--muted)}
.hero-float-card b{font-size:13px;line-height:1.5;display:block;margin-top:4px}
.hero-index{position:absolute;right:1.2vw;bottom:4vw;display:flex;align-items:center;gap:9px;transform:rotate(90deg);transform-origin:right bottom;font-size:9px;letter-spacing:.16em;margin:0}
.hero-index i{width:50px;height:1px;background:var(--ink)}
.hero-orbit{position:absolute;border:1px solid rgba(21,23,20,.12);border-radius:50%;pointer-events:none}
.orbit-a{width:50vw;aspect-ratio:1;left:-22vw;top:-22vw;animation:orbitSpin 60s linear infinite}
.orbit-a::after{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:var(--blue);right:14%;bottom:14%;box-shadow:0 0 20px rgba(101,87,232,.5)}
.orbit-b{width:27vw;aspect-ratio:1;left:27vw;top:16vh;animation:orbitSpin 40s linear infinite reverse}
.orbit-b::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:#7ee8a0;left:6%;top:30%}
@keyframes orbitSpin{to{transform:rotate(360deg)}}

/* =========================================================
   MARQUEE
   ========================================================= */
.marquee{border-block:1px solid var(--line);padding:18px 0;overflow:hidden;background:var(--bg)}
.marquee-track{display:flex;width:max-content;animation:marquee 32s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-group{display:flex;flex-shrink:0;align-items:center;gap:40px;padding-right:40px;white-space:nowrap;font-size:15px;letter-spacing:.12em;font-weight:500}
.marquee-group i{font-style:normal;color:var(--blue)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* =========================================================
   SECTION COMMON
   ========================================================= */
.section{padding:clamp(70px,7vw,120px) 5vw}
.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:30px;margin-bottom:clamp(40px,4.5vw,70px)}
.section-head h2{margin:20px 0 0;font-size:clamp(40px,5.6vw,96px);line-height:1.08;letter-spacing:-.06em;font-weight:500;font-family:var(--font-jp)}
.section-head h2 em,.sticky-title h2 em,.message-copy h2 em,.news-side h2 em{font-style:normal;color:#6d736b}
.split-head{align-items:flex-end}
.split-head>p{font-size:13px;line-height:2;color:var(--muted);margin:0;max-width:440px}
.section-icon{width:clamp(70px,7vw,110px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;font-size:clamp(26px,2.6vw,40px);border:1px solid var(--line);background:#fff;position:relative}
.section-icon::before{content:"";position:absolute;inset:-10px;border-radius:50%;border:1px dashed rgba(21,23,20,.18);animation:orbitSpin 24s linear infinite}
.text-link{display:inline-flex;align-items:center;gap:50px;margin-top:25px;border-bottom:1px solid var(--ink);padding-bottom:9px;font-size:11px;letter-spacing:.16em;font-weight:700;position:relative}
.text-link::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:100%;background:linear-gradient(90deg,var(--blue),var(--cyan));transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.text-link:hover::after{transform:scaleX(1)}
.text-link i{display:grid;place-items:center;font-size:14px;transition:transform .45s var(--ease)}
.text-link:hover i{transform:translateX(8px)}
.text-link.light{border-color:#f5f6f3}
.btn-pill{display:inline-flex;align-items:center;gap:22px;padding:8px 8px 8px 28px;border-radius:999px;background:var(--ink);color:#fff;font-size:11px;letter-spacing:.16em;font-weight:700;position:relative;overflow:hidden;isolation:isolate;transition:color .45s var(--ease)}
.btn-pill::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--cyan),var(--lime));transform:translateY(101%);transition:transform .55s var(--ease);z-index:-1;border-radius:inherit}
.btn-pill:hover{color:var(--ink)}
.btn-pill:hover::before{transform:none}
.btn-pill i{width:42px;height:42px;border-radius:50%;background:#fff;color:var(--ink);display:grid;place-items:center;font-size:16px;transition:transform .5s var(--ease)}
.btn-pill:hover i{transform:rotate(-45deg)}

/* =========================================================
   ABOUT
   ========================================================= */
.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:8vw;margin-bottom:clamp(42px,5vw,72px)}
.about .lead{font-size:clamp(22px,2.6vw,40px);line-height:1.65;letter-spacing:-.035em;margin:0;font-family:var(--font-jp);font-weight:500}
.about-text{max-width:570px}
.about-text p{font-size:14px;line-height:2.2;margin:0 0 1.4em;color:#545951}
.about-points{border-top:1px solid var(--line);margin:30px 0 10px}
.about-points li{display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);font-size:13px;font-weight:500;transition:padding .4s var(--ease)}
.about-points li:hover{padding-left:10px}
.about-points svg{font-size:20px;color:var(--blue)}
.about-figure{height:40vw;min-height:380px;max-height:640px;border-radius:0 14vw 0 14vw;position:relative;overflow:hidden;background:#d8ddd7;margin:0}
.about-photo{position:absolute;inset:-8% 0;width:100%;height:116%;object-fit:cover;filter:saturate(.82) contrast(.96)}
.about-figure::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(12,16,13,.45) 100%)}
.about-figure figcaption{position:absolute;z-index:2;left:clamp(20px,4vw,60px);right:clamp(20px,4vw,60px);bottom:clamp(20px,3vw,44px);display:flex;justify-content:space-between;align-items:flex-end;color:#fff}
.about-figure figcaption span{font-size:clamp(28px,4vw,64px);font-weight:600;letter-spacing:-.04em;line-height:1}
.about-figure figcaption small{font-size:10px;letter-spacing:.14em}

/* =========================================================
   SERVICES — flip cards
   ========================================================= */
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.flip-card{height:420px;perspective:1200px;background:var(--bg);outline:none;cursor:pointer}
.flip-card-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .9s var(--ease)}
.flip-card:hover .flip-card-inner,.flip-card:focus-visible .flip-card-inner,.flip-card.is-flipped .flip-card-inner{transform:rotateY(180deg)}
.flip-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;padding:32px;display:flex;flex-direction:column}
.flip-front{background-color:#5f6870;background-size:cover;background-position:center;color:#fff;overflow:hidden}
.flip-front::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,14,12,.15) 0%,rgba(10,14,12,.65) 100%),linear-gradient(135deg,rgba(255,255,255,.12),transparent 42%);pointer-events:none}
.flip-front::after{content:"";position:absolute;inset:10px;border:1px solid rgba(255,255,255,0);transition:.45s var(--ease)}
.flip-card:hover .flip-front::after{border-color:rgba(255,255,255,.45);inset:18px}
.card-no,.flip-back>span:first-child{font-size:10px;letter-spacing:.18em;position:relative;z-index:2}
.flip-front b{position:absolute;z-index:2;right:28px;top:30px;font-size:8px;letter-spacing:.14em;font-weight:500}
.card-icon{position:relative;z-index:2;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-size:24px;margin-top:auto;margin-bottom:18px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);backdrop-filter:blur(8px)}
.card-icon.dark{margin:28px 0 0;background:linear-gradient(135deg,var(--cyan),var(--lime));border:0;color:var(--ink)}
.flip-front h3{position:relative;z-index:2;font-size:24px;margin:0 0 7px;font-family:var(--font-jp);text-shadow:0 2px 20px rgba(0,0,0,.28)}
.flip-front small{position:relative;z-index:2;font-size:9px;letter-spacing:.16em}
.flip-back{transform:rotateY(180deg);background:var(--ink);color:#fff;overflow:hidden}
.flip-back::before{content:"";position:absolute;width:260px;aspect-ratio:1;border-radius:50%;right:-90px;top:-90px;background:radial-gradient(circle,rgba(169,245,239,.22),transparent 65%)}
.flip-back h3{font-size:23px;margin:auto 0 14px;font-family:var(--font-jp);position:relative}
.flip-back p{font-size:13px;line-height:1.9;color:#cfd4cd;margin:0;position:relative}
.flip-back ul{margin:18px 0 0;border-top:1px solid #3a3d39;position:relative}
.flip-back li{font-size:11px;padding:9px 0 9px 18px;border-bottom:1px solid #3a3d39;position:relative}
.flip-back li::before{content:"";position:absolute;left:0;top:50%;width:7px;height:7px;border-radius:50%;background:var(--lime);transform:translateY(-50%)}
.service-more{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:40px;padding-top:30px;border-top:1px solid var(--line)}
.service-more p{margin:0;font-size:14px}

/* =========================================================
   CERTIFICATION BAND
   ========================================================= */
.cert-band{overflow:hidden;background:var(--ink);color:#fff;padding:22px 0}
.cert-track{display:flex;width:max-content;animation:marquee 40s linear infinite reverse}
.cert-group{display:flex;flex-shrink:0;gap:clamp(28px,3vw,52px);padding-right:clamp(28px,3vw,52px)}
.cert-group span{display:flex;align-items:center;gap:12px;font-size:clamp(14px,1.4vw,20px);letter-spacing:.06em;white-space:nowrap}
.cert-group svg{color:var(--lime);font-size:1.1em}

/* =========================================================
   STRENGTHS (dark)
   ========================================================= */
.dark{background:var(--ink);color:#f5f6f3}
.strengths{display:grid;grid-template-columns:.85fr 1.15fr;gap:10vw;align-items:start;position:relative;isolation:isolate;background:radial-gradient(ellipse at 8% 20%,#243934 0,transparent 48%),radial-gradient(ellipse at 95% 85%,#292635 0,transparent 45%),#171e1b}
.strengths-art{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.strengths-glow{position:absolute;left:-12%;top:5%;width:70%;height:70%;border-radius:50%;background:radial-gradient(ellipse,rgba(169,245,239,.08),transparent 65%);animation:strengthsGlow 18s ease-in-out infinite alternate}
.strengths-lines{position:absolute;inset:0;width:100%;height:100%;stroke-width:1;stroke-linecap:round}
.strengths-lines path{vector-effect:non-scaling-stroke}
.strengths-line-base{stroke:rgba(169,245,239,.1)}
.strengths-line-flow{stroke:var(--cyan);stroke-dasharray:100 1900;opacity:.38;animation:strengthsFlow 26s linear infinite}
.strengths-line-flow path:nth-child(2){stroke:var(--violet);stroke-dasharray:60 1800;animation:strengthsFlow 32s linear infinite reverse}
.strengths-line-flow path:nth-child(3){stroke:var(--lime);stroke-dasharray:75 2100;animation:strengthsFlow 36s linear infinite;animation-delay:-12s}
.strengths-line-flow path:nth-child(4){stroke-dasharray:120 1800;animation:strengthsFlow 30s linear infinite;animation-delay:-18s}
.strengths-orbit{position:absolute;width:clamp(240px,32vw,500px);aspect-ratio:1;left:-8%;bottom:6%;border:1px solid rgba(169,245,239,.12);border-radius:50%;animation:strengthsOrbit 50s linear infinite}
.strengths-orbit::before,.strengths-orbit::after{content:"";position:absolute;border:1px solid rgba(207,193,255,.09);border-radius:50%}
.strengths-orbit::before{inset:12%}.strengths-orbit::after{inset:26%;border-color:rgba(216,255,123,.08)}
.strengths-orbit span,.strengths-orbit i{position:absolute;left:50%;top:-3px;width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 16px rgba(169,245,239,.5)}
.strengths-orbit i{top:auto;bottom:12%;left:72%;width:4px;height:4px;background:var(--violet)}
.strengths .sticky-title,.strengths .strength-list{z-index:1}
.strengths .strength-list{position:relative}
.strengths .section-no{color:var(--cyan)}
.strengths .sticky-title h2 em{color:var(--cyan)}
.strengths .strength-no{color:var(--cyan)}
.strengths .strength-icon{background:rgba(169,245,239,.045);border-color:rgba(169,245,239,.22);box-shadow:inset 0 0 20px rgba(169,245,239,.025)}
@keyframes strengthsFlow{to{stroke-dashoffset:-2400}}
@keyframes strengthsGlow{to{transform:translate(15%,12%) scale(1.16);opacity:.65}}
@keyframes strengthsOrbit{to{transform:rotate(360deg)}}
@media(max-width:750px){.strengths-line-flow{opacity:.24}.strengths-orbit{left:-120px;bottom:3%;opacity:.7}.strengths-glow{width:130%;height:45%;left:-40%}}
/* @media(prefers-reduced-motion:reduce){.strengths-line-flow,.strengths-line-flow path,.strengths-glow,.strengths-orbit{animation:none!important}.strengths-line-flow{opacity:.18}} */
.sticky-title{position:sticky;top:140px}
.sticky-title h2{font-size:clamp(40px,4.4vw,70px);line-height:1.15;letter-spacing:-.055em;font-weight:500;margin:25px 0;font-family:var(--font-jp)}
.sticky-title h2 em{color:#8c928a}
.sticky-lead{font-size:13px;line-height:2;color:#aeb4aa;margin:0}
.strength-item{padding:3.5vw 0;border-top:1px solid #3b3f39;display:grid;grid-template-columns:90px 1fr;gap:25px;position:relative}
.strength-item:last-child{border-bottom:1px solid #3b3f39}
.strength-item::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:linear-gradient(90deg,var(--cyan),var(--violet),var(--lime));transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease)}
.strength-item:hover::before{transform:scaleX(1)}
.strength-no{font-size:11px;color:#8c928a;padding-top:10px}
.strength-icon{width:58px;height:58px;border-radius:16px;display:grid;place-items:center;font-size:26px;border:1px solid #3b3f39;color:var(--cyan);margin-bottom:24px;transition:transform .6s var(--ease),background .5s,color .5s,border-color .5s}
.strength-item:hover .strength-icon{transform:rotate(-8deg) scale(1.08);background:var(--cyan);color:var(--ink);border-color:var(--cyan)}
.strength-item small{font-size:9px;letter-spacing:.18em;color:#a6ada3}
.strength-item h3{font-size:clamp(26px,2.8vw,46px);line-height:1.3;letter-spacing:-.04em;margin:12px 0 22px;font-weight:500;font-family:var(--font-jp);transition:transform .6s var(--ease)}
.strength-item:hover h3{transform:translateX(10px)}
.strength-item p{max-width:520px;color:#abb1a8;font-size:13px;line-height:2;margin:0}

/* =========================================================
   MESSAGE
   ========================================================= */
.message{display:grid;grid-template-columns:1fr 1fr;gap:8vw;align-items:center}
.message-visual{height:48vw;max-height:720px;min-height:500px;overflow:hidden;border-radius:0 0 48% 48%;background:#d9ded6;position:relative}
.representative-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 24%;filter:saturate(.82) contrast(.96);transition:transform 1.4s var(--ease)}
.message-visual:hover .representative-photo{transform:scale(1.05)}
.message-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 58%,rgba(10,13,11,.5) 100%)}
.message-visual>small{position:absolute;z-index:2;left:5%;right:5%;bottom:6%;color:rgba(255,255,255,.66);font-size:clamp(26px,3vw,54px);font-weight:600;line-height:.94;letter-spacing:.03em;mix-blend-mode:screen}
.message-copy h2{font-size:clamp(40px,4.6vw,76px);line-height:1.15;letter-spacing:-.05em;font-weight:500;margin:25px 0 40px;font-family:var(--font-jp)}
.message-copy>p:not(.section-no){font-size:14px;line-height:2.2;color:#555b52}
.signature{margin-top:40px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:end}
.signature strong{font-size:11px}
.signature span{font-family:var(--font-jp);font-size:24px;letter-spacing:.12em}

/* =========================================================
   NUMBERS
   ========================================================= */
.numbers{background:var(--ink);color:#f7f8f4;position:relative;overflow:hidden}
.numbers::before{content:"92%";position:absolute;right:-2vw;top:-8vw;font-size:32vw;font-weight:700;line-height:1;color:rgba(255,255,255,.03);letter-spacing:-.09em;pointer-events:none}
.numbers-intro{display:grid;grid-template-columns:1fr .65fr;gap:5vw;align-items:end;margin-bottom:46px;position:relative;z-index:1}
.numbers .section-head{margin-bottom:0}
.numbers .section-no{color:#aab0a5}
.numbers .section-head h2{color:#fff}
.numbers .section-head h2 em{color:var(--cyan)}
.numbers-intro>p{max-width:440px;margin:0 0 8px auto;color:#aeb4aa;font-size:13px;line-height:2}
.number-grid{position:relative;z-index:1;display:grid;grid-template-columns:1.35fr .9fr .9fr .9fr;border:1px solid #3a3f38;background:#20231f}
.number-item{min-height:320px;padding:30px 28px 28px;border-right:1px solid #3a3f38;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;position:relative;transition:transform .5s var(--ease),background .5s var(--ease)}
.number-item:last-child{border-right:0}
.number-item:hover{background:#2a2f28;transform:translateY(-8px)}
.num-icon{position:absolute;top:26px;right:26px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-size:20px;border:1px solid currentColor;opacity:.6;transition:transform .6s var(--ease),opacity .4s}
.number-item:hover .num-icon{transform:rotate(-20deg) scale(1.1);opacity:1}
.number-value{display:flex;align-items:flex-start;line-height:.8;margin-bottom:auto;white-space:nowrap}
.number-item strong{font-size:clamp(64px,7vw,124px);font-weight:600;color:#fff;letter-spacing:-.075em;line-height:.82;font-variant-numeric:tabular-nums}
.number-item i{font-style:normal;font-size:11px;letter-spacing:.14em;color:#bbc2b7;margin:10px 0 0 10px}
.number-item>span:not(.num-icon){font-size:15px;font-weight:600;margin:0 0 8px;color:#fff;font-family:var(--font-jp)}
.number-item small{font-size:8px;letter-spacing:.2em;color:#858d82}
.number-item-primary{background:var(--cyan);color:var(--ink)}
.number-item-primary strong,.number-item-primary>span:not(.num-icon){color:var(--ink)}
.number-item-primary i,.number-item-primary small{color:#405d59}
.number-item-primary:hover{background:#c5fff9}
.number-item-accent{background:var(--violet);color:var(--ink)}
.number-item-accent strong,.number-item-accent>span:not(.num-icon){color:var(--ink)}
.number-item-accent i,.number-item-accent small{color:#5b526c}
.number-item-accent:hover{background:#ddd4ff}
.numbers-note{text-align:right;font-size:10px;color:#777f75;margin:12px 0 0;position:relative;z-index:1}

/* =========================================================
   WORKS
   ========================================================= */
.works{overflow:hidden}
.works .section-head{align-items:flex-end}
.works-track{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5vw}
.work-card{display:block;position:relative;transition:transform .72s var(--ease)}
.work-card:hover{transform:translateY(-14px)}
.work-image{height:28vw;min-height:340px;position:relative;overflow:hidden;background-color:#7b817a;background-size:cover;background-position:center;clip-path:inset(0 round 0);transition:clip-path .72s var(--ease),background-size 1s var(--ease)}
.work-image::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 50%,rgba(0,0,0,.3))}
.work-image::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(120deg,rgba(255,255,255,0),rgba(255,255,255,.25),rgba(255,255,255,0));transform:translateX(-130%);transition:transform .9s var(--ease)}
.work-card:hover .work-image{clip-path:inset(10px round 28px)}
.work-card:hover .work-image::before{transform:translateX(130%)}
.work-image>span{position:absolute;z-index:2;left:20px;top:18px;color:#fff;font-size:11px;letter-spacing:.14em}
.work-arrow{position:absolute;z-index:3;right:18px;bottom:18px;width:54px;height:54px;border-radius:50%;background:#fff;color:var(--ink);display:grid;place-items:center;font-size:20px;transform:scale(.8) rotate(-45deg);opacity:0;transition:.6s var(--ease)}
.work-card:hover .work-arrow{opacity:1;transform:none}
.work-meta{padding:22px 0;border-bottom:1px solid var(--line);transition:padding .72s var(--ease),border-color .72s var(--ease)}
.work-card:hover .work-meta{padding-left:15px;padding-right:15px;border-color:var(--ink)}
.work-meta small{display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.17em;color:#737871}
.work-meta small svg{font-size:14px;color:var(--blue)}
.work-meta h3{font-size:19px;line-height:1.6;margin:12px 0 16px;font-family:var(--font-jp)}
.work-tags{display:flex;flex-wrap:wrap;gap:6px}
.work-tags li{font-size:10px;padding:5px 11px;border:1px solid var(--line);border-radius:999px;transition:background .4s,border-color .4s}
.work-card:hover .work-tags li{border-color:var(--ink)}
.work-card:hover .work-tags li:last-child{background:var(--lime);border-color:var(--lime)}
.work-meta b{display:flex;align-items:center;gap:12px;font-size:9px;letter-spacing:.18em;margin-top:22px;opacity:.5;transition:opacity .5s var(--ease)}
.work-meta b i{display:grid;place-items:center;font-size:13px;transition:transform .5s var(--ease)}
.work-card:hover .work-meta b{opacity:1}
.work-card:hover .work-meta b i{transform:translateX(8px)}

/* =========================================================
   FLOW
   ========================================================= */
.flow{background:var(--bg-2)}
.flow-list{display:grid;grid-template-columns:repeat(5,1fr);gap:0;counter-reset:flow;position:relative}
.flow-list::before{content:"";position:absolute;left:0;right:0;top:118px;height:1px;background:repeating-linear-gradient(90deg,#b9beb5 0 6px,transparent 6px 12px)}
.flow-step{position:relative;padding:28px 22px 30px;border-left:1px solid #d0d4cb;transition:background .5s var(--ease)}
.flow-step:last-child{border-right:1px solid #d0d4cb}
.flow-step:hover{background:#fff}
.flow-no{font-size:10px;letter-spacing:.18em;font-weight:700;color:var(--muted)}
.flow-icon{position:relative;z-index:1;width:64px;height:64px;margin:24px 0 26px;border-radius:50%;display:grid;place-items:center;font-size:26px;background:var(--bg);border:1px solid var(--ink);transition:background .5s var(--ease),transform .6s var(--ease),color .5s}
.flow-step:hover .flow-icon{background:var(--ink);color:var(--lime);transform:scale(1.1) rotate(-10deg)}
.flow-step h3{font-size:18px;margin:0 0 10px;font-family:var(--font-jp)}
.flow-step p{font-size:12px;line-height:1.9;color:var(--muted);margin:0}

/* =========================================================
   RECRUIT BANNER
   ========================================================= */
.recruit-banner{padding:clamp(60px,6vw,100px) 5vw}
.recruit-inner{display:block;position:relative;min-height:540px;border-radius:clamp(20px,2.4vw,36px);overflow:hidden;color:#fff;isolation:isolate;padding:clamp(40px,6vw,90px)}
.recruit-media{position:absolute;inset:0;z-index:-2;background-color:#33403a;background-size:cover;background-position:center;transform:scale(1.04);transition:transform 1.6s var(--ease);filter:saturate(.8)}
.recruit-inner:hover .recruit-media{transform:scale(1.1)}
.recruit-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(8,12,10,.85) 0%,rgba(8,12,10,.55) 50%,rgba(8,12,10,.1) 100%)}
.recruit-copy{max-width:640px;position:relative}
.recruit-copy .section-no{color:var(--lime)}
.recruit-copy h2{font-size:clamp(36px,4.6vw,76px);line-height:1.15;letter-spacing:-.05em;font-weight:500;margin:22px 0 26px;font-family:var(--font-jp)}
.recruit-copy p:not(.section-no){font-size:13px;line-height:2;color:rgba(255,255,255,.78);margin:0}
.recruit-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.recruit-tags li{display:flex;align-items:center;gap:8px;font-size:12px;padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.25);backdrop-filter:blur(8px)}
.recruit-tags svg{color:var(--lime);font-size:15px}
.recruit-btn{position:absolute;right:clamp(30px,4vw,64px);bottom:clamp(30px,4vw,64px);width:clamp(120px,11vw,160px);aspect-ratio:1;border-radius:50%;background:var(--lime);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-size:12px;letter-spacing:.2em;transition:transform .7s var(--ease),background .5s}
.recruit-btn i{font-size:24px;display:grid;place-items:center;transition:transform .6s var(--ease)}
.recruit-inner:hover .recruit-btn{transform:scale(1.12) rotate(-8deg);background:var(--cyan)}
.recruit-inner:hover .recruit-btn i{transform:rotate(45deg)}
.recruit-word{position:absolute;right:-1vw;top:-2.4vw;font-size:14vw;font-weight:700;letter-spacing:-.08em;line-height:1;color:rgba(255,255,255,.07);z-index:-1;pointer-events:none}

/* =========================================================
   NEWS
   ========================================================= */
.news-layout{display:grid;grid-template-columns:.7fr 1.3fr;gap:7vw;align-items:start}
.news-side{position:sticky;top:130px}
.news-side h2{font-size:clamp(40px,4.4vw,68px);line-height:1.12;letter-spacing:-.05em;font-weight:500;margin:20px 0 0;font-family:var(--font-jp)}
.tabs{display:flex;gap:8px;margin-top:35px;flex-wrap:wrap}
.tabs button{border:1px solid var(--line);border-radius:40px;background:none;padding:9px 18px;font-size:10px;letter-spacing:.12em;cursor:pointer;transition:background .35s,color .35s,border-color .35s}
.tabs button:hover{border-color:var(--ink)}
.tabs button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.news-list{border-top:1px solid var(--line)}
.news-row{display:grid;grid-template-columns:110px 100px 1fr 44px;align-items:center;border-bottom:1px solid var(--line);padding:28px 0;position:relative;transition:padding .5s var(--ease),opacity .4s}
.news-row::before{content:"";position:absolute;inset:0;background:#fff;transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease);z-index:-1}
.news-row{isolation:isolate}
.news-row:hover{padding-left:18px}
.news-row:hover::before{transform:scaleY(1)}
.news-row time{font-size:11px;letter-spacing:.08em}
.news-row>span{font-size:9px;letter-spacing:.12em;justify-self:start;padding:5px 10px;border:1px solid var(--line);border-radius:99px;color:#5e645c}
.news-row h3{font-size:14px;font-weight:500;margin:0;font-family:var(--font-jp);line-height:1.7}
.news-row i{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);font-size:14px;transition:background .45s,color .45s,transform .5s var(--ease),border-color .45s}
.news-row:hover i{background:var(--ink);color:#fff;border-color:var(--ink);transform:rotate(45deg)}
.news-row.is-hidden{display:none}

/* =========================================================
   CONTACT
   ========================================================= */
.contact-modern{position:relative;min-height:760px;padding:clamp(80px,7vw,120px) 5vw;display:flex;align-items:center;overflow:hidden;background:#0d1110;color:#fff}
.contact-media{position:absolute;inset:0;background:url('../images/contact.jpg') center 50%/cover no-repeat;transform:scale(1.035);transition:transform 1.8s var(--ease);filter:saturate(.72) brightness(.72)}
.contact-modern:hover .contact-media{transform:scale(1.075)}
.contact-shade{position:absolute;inset:0;background:linear-gradient(100deg,rgba(5,8,7,.88) 0%,rgba(5,8,7,.70) 42%,rgba(5,8,7,.38) 68%,rgba(5,8,7,.62) 100%)}
.contact-shade::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 76% 34%,rgba(169,245,239,.18),transparent 30%),radial-gradient(circle at 82% 72%,rgba(207,193,255,.18),transparent 28%);mix-blend-mode:screen}
.contact-gridline{position:absolute;inset:0;opacity:.16;background-image:linear-gradient(rgba(255,255,255,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.18) 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(to right,rgba(0,0,0,.15),#000 48%,rgba(0,0,0,.2));-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,.15),#000 48%,rgba(0,0,0,.2))}
.contact-modern::after{content:"CONTACT";position:absolute;right:-1vw;bottom:-5vw;font-size:18vw;line-height:1;font-weight:700;letter-spacing:-.08em;color:rgba(255,255,255,.045);pointer-events:none}
.contact-inner{width:min(1500px,100%);margin:auto;position:relative;z-index:2}
.contact-topline{display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(255,255,255,.28);padding-top:18px}
.contact-modern .section-no{color:rgba(255,255,255,.72)}
.contact-status{display:inline-flex;align-items:center;gap:10px;font-size:9px;letter-spacing:.18em;color:rgba(255,255,255,.72);margin:0}
.contact-status i{width:7px;height:7px;border-radius:50%;background:#baf7ec;box-shadow:0 0 0 6px rgba(186,247,236,.1);animation:contactPulse 2s ease-in-out infinite}
@keyframes contactPulse{50%{box-shadow:0 0 0 11px rgba(186,247,236,0)}}
.contact-copy{position:relative;z-index:2;max-width:min(1000px,66%);margin-top:clamp(50px,5vw,80px)}
.contact-kicker{display:inline-block;margin:0 0 24px;font-size:10px;letter-spacing:.24em;font-weight:700;color:transparent;background:linear-gradient(100deg,#9ef5ec 0%,#b8e8ff 38%,#d3c3ff 72%,#f2bfff 100%);-webkit-background-clip:text;background-clip:text}
.contact-modern h2{margin:0;font-size:clamp(46px,6.4vw,112px);line-height:1.04;letter-spacing:-.06em;font-weight:500;font-family:var(--font-jp)}
.contact-modern h2 em{font-style:normal;color:rgba(255,255,255,.62)}
.contact-lead{margin:28px 0 0;color:rgba(255,255,255,.74);font-size:13px;line-height:2}
.contact-visual-cue{position:absolute;z-index:1;right:-5%;top:6%;width:clamp(380px,40vw,640px);aspect-ratio:1;pointer-events:none}
.contact-orbit{position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.34);animation:contactOrbit 9s ease-in-out infinite alternate}
.contact-orbit::after{content:"";position:absolute;width:12px;height:12px;border-radius:50%;background:#c8fff8;box-shadow:0 0 24px rgba(200,255,248,.85)}
.orbit-one{inset:0}.orbit-one::after{right:8%;top:23%}
.orbit-two{inset:16%;border-color:rgba(169,245,239,.48);animation-delay:-2.5s}.orbit-two::after{left:7%;bottom:22%;background:#d4c9ff}
.orbit-three{inset:33%;border-color:rgba(207,193,255,.62);animation-delay:-5s}.orbit-three::after{right:2%;bottom:44%;width:8px;height:8px;background:var(--lime)}
@keyframes contactOrbit{to{transform:rotate(14deg) scale(1.035)}}
.contact-glow-core{position:absolute;inset:42%;display:grid;place-items:center;border-radius:50%;font-size:clamp(28px,3vw,48px);color:#fff;background:linear-gradient(120deg,rgba(158,245,236,.28),rgba(211,195,255,.32),rgba(216,255,123,.2));border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(18px);box-shadow:0 0 80px rgba(175,216,255,.2),inset 0 0 35px rgba(255,255,255,.08);animation:contactCore 3.2s ease-in-out infinite alternate}
@keyframes contactCore{to{transform:scale(1.1);box-shadow:0 0 120px rgba(195,190,255,.35),inset 0 0 45px rgba(255,255,255,.12)}}
.contact-cards{display:grid;grid-template-columns:minmax(300px,.42fr) 1fr;gap:24px;margin-top:clamp(42px,4.5vw,68px);position:relative;z-index:3;align-items:stretch}
.contact-card{display:flex;align-items:center;gap:20px;padding:30px;border-radius:22px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(16px);position:relative;overflow:hidden;transition:background .5s var(--ease),transform .5s var(--ease),border-color .5s}
.contact-card:hover{background:rgba(255,255,255,.14);transform:translateY(-4px);border-color:rgba(255,255,255,.45)}
.cc-icon{width:58px;height:58px;border-radius:50%;flex-shrink:0;display:grid;place-items:center;font-size:24px;background:var(--lime);color:var(--ink);animation:ring 3s ease-in-out infinite}
@keyframes ring{0%,80%,100%{transform:rotate(0)}84%{transform:rotate(-14deg)}88%{transform:rotate(12deg)}92%{transform:rotate(-8deg)}96%{transform:rotate(4deg)}}
.contact-card small{display:block;font-size:9px;letter-spacing:.2em;color:rgba(255,255,255,.62)}
.contact-card strong{display:block;font-size:clamp(26px,2.4vw,38px);letter-spacing:-.02em;margin:8px 0 6px;font-weight:600}
.contact-card div>span{font-size:11px;color:rgba(255,255,255,.65)}
.cc-arrow{position:absolute;right:22px;top:22px;font-size:18px;transition:transform .5s var(--ease)}
.contact-card:hover .cc-arrow{transform:rotate(45deg)}
/* ticket */
.ticket{display:flex;position:relative;height:100%;min-height:210px;isolation:isolate;filter:drop-shadow(0 28px 55px rgba(0,0,0,.28));transition:filter .5s var(--ease),transform .5s var(--ease)}
.ticket:hover{filter:drop-shadow(0 34px 72px rgba(0,0,0,.4));transform:translateY(-3px)}
.ticket-main,.ticket-stub{display:flex;flex-direction:column;justify-content:center;position:relative;transition:transform .7s var(--ease);color:#101318}
.ticket-main{width:80%;padding:34px 48px;border-radius:22px 0 0 22px;overflow:hidden;background:linear-gradient(105deg,#9ef5ec 0%,#b7e8ff 41%,#d3c3ff 84%,#ddbfff 100%)}
.ticket-main::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 10%,rgba(255,255,255,.5) 42%,rgba(255,255,255,.16) 58%,transparent 84%);transform:translateX(-120%);transition:transform .9s var(--ease)}
.ticket:hover .ticket-main::before{transform:translateX(120%)}
.ticket-main small{position:relative;z-index:2;font-size:10px;font-weight:800;letter-spacing:.17em;color:#24303a}
.ticket-main strong{position:relative;z-index:2;font-size:clamp(44px,5vw,82px);line-height:.9;margin:14px 0 0;letter-spacing:-.065em;font-weight:600}
.ticket-jp{position:relative;z-index:2;font-size:14px;font-weight:700;letter-spacing:.07em;color:#202934;margin-top:12px}
.ticket-action{position:absolute;right:30px;bottom:26px;z-index:2;display:flex;align-items:center;gap:14px;font-size:10px;font-weight:800;letter-spacing:.14em}
.ticket-action b{width:40px;height:40px;border-radius:50%;background:#111;color:#fff;display:grid;place-items:center;font-size:16px;transition:transform .45s var(--ease),background .45s}
.ticket:hover .ticket-action b{transform:rotate(45deg) scale(1.08);background:var(--blue)}
.ticket-stub{width:20%;align-items:center;text-align:center;border-radius:0 22px 22px 0;background:linear-gradient(105deg,#ddbfff 0%,#e7bfff 52%,#f2bfff 100%)}
.ticket-stub::before,.ticket-stub::after{content:"";position:absolute;left:-20px;width:40px;height:40px;border-radius:50%;background:#0f1412;z-index:2}
.ticket-stub::before{top:-20px}
.ticket-stub::after{bottom:-20px}
.ticket-stub small,.ticket-stub span{font-size:9px;font-weight:800;letter-spacing:.16em;color:#222633}
.ticket-stub strong{font-size:clamp(38px,3.6vw,56px);margin:14px 0;display:grid;place-items:center;transition:transform .55s var(--ease)}
.ticket-tear{position:absolute;z-index:3;left:80%;top:20px;bottom:20px;width:1px;background:repeating-linear-gradient(to bottom,#6d7369 0 6px,transparent 6px 13px);transition:.45s}
.ticket:hover .ticket-main{transform:translateX(-8px) rotate(-.3deg)}
.ticket:hover .ticket-stub{transform:translateX(50px) rotate(5deg)}
.ticket:hover .ticket-stub strong{transform:translate(5px,-3px) rotate(-12deg) scale(1.1)}
.ticket:hover .ticket-tear{opacity:0;transform:scaleY(.4)}

/* =========================================================
   FOOTER
   ========================================================= */
.footer{background:linear-gradient(135deg,var(--navy-1) 0%,var(--navy-2) 52%,var(--navy-3) 100%);color:#f7f9fb;padding:clamp(40px,4vw,60px) 5vw}
.footer-top{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:clamp(26px,2.6vw,40px);border-bottom:1px solid rgba(255,255,255,.2)}
.footer-top>p{font-size:clamp(22px,2.5vw,38px);margin:0;letter-spacing:-.03em;font-family:var(--font-jp);font-weight:500}
.brand.light .brand-mark{border-color:#fff}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:6vw;padding:clamp(30px,3vw,44px) 0}
.footer-grid small{display:block;color:rgba(255,255,255,.6);font-size:9px;letter-spacing:.18em;margin-bottom:14px}
.footer-grid p,.footer-grid a{font-size:12px;line-height:1.9}
.footer-grid p{display:flex;gap:10px;margin:0 0 10px}
.footer-grid .fi{font-size:16px;margin-top:3px;color:var(--cyan)}
.footer-license{display:block!important;font-size:10px!important;color:rgba(255,255,255,.55);margin-top:16px!important}
.footer-grid a{display:block;width:fit-content;position:relative;transition:opacity .35s var(--ease),transform .35s var(--ease)}
.footer-grid a:hover{opacity:.72;transform:translateX(4px)}
.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid rgba(255,255,255,.2);padding-top:18px;font-size:9px;letter-spacing:.1em;color:rgba(255,255,255,.62)}
.footer-bottom div{display:flex;gap:30px}
.footer-bottom a{transition:color .3s}
.footer-bottom a:hover{color:#fff}

/* =========================================================
   REVEAL / CURSOR / PROGRESS
   ========================================================= */
.reveal{opacity:0;transform:translateY(50px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.is-visible{opacity:1;transform:none}
.reveal[data-delay="1"]{transition-delay:.1s}
.reveal[data-delay="2"]{transition-delay:.2s}
.reveal[data-delay="3"]{transition-delay:.3s}
.reveal[data-delay="4"]{transition-delay:.4s}
.reveal-scale{opacity:0;transform:scale(.94);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease)}
.reveal-scale.is-visible{opacity:1;transform:none}
.flip-card.reveal.is-visible:hover{transition-delay:0s}
.cursor{position:fixed;left:0;top:0;width:76px;height:76px;border-radius:50%;background:var(--ink);color:#fff;z-index:100;pointer-events:none;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%) scale(0);transition:transform .35s var(--ease),background .3s}
.cursor span{font-size:9px;letter-spacing:.14em;font-weight:700}
.cursor.active{transform:translate(-50%,-50%) scale(1)}
.cursor.on-light{background:var(--lime);color:var(--ink)}
.scroll-progress{position:fixed;left:0;top:0;height:2px;width:100%;z-index:60;background:linear-gradient(90deg,var(--cyan),var(--violet),var(--lime));transform-origin:left;transform:scaleX(0)}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1180px){
  .header-tel{display:none}
  .hero-float-card{left:-4%}
}
@media (max-width:980px){
  :root{--header:72px}
  .site-header{grid-template-columns:1fr auto;padding:0 20px}
  .site-header.is-scrolled{--header:64px}
  .global-nav,.header-right{display:none}
  .menu-btn{display:block;justify-self:end}
  .mobile-menu{display:flex;flex-direction:column;justify-content:space-between;position:fixed;z-index:45;inset:0;background:var(--ink);color:#fff;clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--ease-io);padding:110px 24px 40px;overflow-y:auto}
  .mobile-menu.open{clip-path:inset(0 0 0 0)}
  .mobile-menu-inner{display:flex;flex-direction:column}
  .mobile-menu-inner a{font-size:clamp(28px,8vw,50px);padding:12px 0;border-bottom:1px solid #333a34;opacity:0;transform:translateY(20px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
  .mobile-menu.open .mobile-menu-inner a{opacity:1;transform:none}
  .mobile-menu.open .mobile-menu-inner a:nth-child(2){transition-delay:.05s}
  .mobile-menu.open .mobile-menu-inner a:nth-child(3){transition-delay:.1s}
  .mobile-menu.open .mobile-menu-inner a:nth-child(4){transition-delay:.15s}
  .mobile-menu.open .mobile-menu-inner a:nth-child(5){transition-delay:.2s}
  .mobile-menu.open .mobile-menu-inner a:nth-child(6){transition-delay:.25s}
  .mobile-menu-inner a span{font-size:11px;color:#92988f;margin-left:12px}
  .mobile-tel{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:30px;padding:20px;border-radius:16px;background:var(--lime);color:var(--ink);font-size:24px;font-weight:700}
  .mobile-tel small{width:100%;font-size:11px;font-weight:500}
  .hero{grid-template-columns:1fr;padding:calc(var(--header) + 36px) 22px 40px;min-height:auto}
  .hero-content{padding-bottom:20px}
  .hero-title{font-size:clamp(46px,11vw,88px)}
  .scroll-cue,.hero-index{display:none}
  .hero-visual{padding:0}
  .visual-frame{height:62vh;min-height:460px}
  .hero-float-card{left:16px;bottom:24px}
  .section{padding:72px 22px}
  .section-head,.split-head{display:block}
  .split-head>p{margin-top:24px}
  .section-icon{display:none}
  .about-grid,.message{grid-template-columns:1fr;gap:40px}
  .about-figure{height:58vw}
  .service-grid{grid-template-columns:repeat(2,1fr)}
  .flip-card{height:380px}
  .flip-card:hover .flip-card-inner{transform:none}
  .flip-card.is-flipped .flip-card-inner{transform:rotateY(180deg)}
  .strengths{grid-template-columns:1fr;gap:50px}
  .sticky-title{position:relative;top:0}
  .strength-item{grid-template-columns:50px 1fr;padding:40px 0}
  .message-visual{order:2;height:80vw;min-height:480px}
  .numbers-intro{grid-template-columns:1fr}
  .numbers-intro>p{margin:20px 0 0}
  .number-grid{grid-template-columns:repeat(2,1fr)}
  .number-item{min-height:260px}
  .number-item:nth-child(2){border-right:0}
  .number-item:nth-child(-n+2){border-bottom:1px solid #3a3f38}
  .works-track{grid-template-columns:1fr;gap:40px}
  .work-image{height:58vw}
  .flow-list{grid-template-columns:1fr;border-top:1px solid #d0d4cb}
  .flow-list::before{left:54px;right:auto;top:0;bottom:0;width:1px;height:auto;background:repeating-linear-gradient(180deg,#b9beb5 0 6px,transparent 6px 12px)}
  .flow-step{display:grid;grid-template-columns:64px 1fr;column-gap:22px;padding:24px 22px;border:0;border-bottom:1px solid #d0d4cb}
  .flow-step:last-child{border-right:0}
  .flow-icon{grid-row:1/4;margin:0}
  .flow-no{grid-column:2}
  .recruit-banner{padding:56px 16px}
  .recruit-inner{min-height:620px;padding:40px 26px 180px}
  .news-layout{grid-template-columns:1fr;gap:30px}
  .news-side{position:static}
  .news-row{grid-template-columns:100px 90px 1fr 40px}
  .contact-modern{min-height:auto;padding:80px 22px}
  .contact-copy{max-width:100%}
  .contact-visual-cue{right:-30%;top:4%;opacity:.5}
  .contact-cards{grid-template-columns:1fr}
  .footer-top{display:block}
  .footer-top>p{margin-top:26px}
  .footer-grid{grid-template-columns:1.5fr 1fr 1fr}
  .cursor{display:none}
}
@media (max-width:640px){
  .hero-title{font-size:12.4vw}
  .hero-copy br{display:none}
  .hero-badges li{padding:8px 12px 8px 8px}
  .visual-frame{height:58vh;min-height:420px;border-radius:0 0 42% 42%}
  .visual-copy strong{font-size:38px}
  .hero-float-card{transform:scale(.9);transform-origin:left bottom}
  .section{padding:60px 18px}
  .section-head h2{font-size:11.4vw}
  .about .lead{font-size:22px}
  .about .lead br{display:none}
  .about-figure{height:80vw;min-height:300px;border-radius:0 25vw 0 25vw}
  .about-figure figcaption small{display:none}
  .service-grid{grid-template-columns:1fr}
  .flip-card{height:360px}
  .service-more{flex-direction:column;align-items:flex-start}
  .strength-item h3{font-size:27px}
  .message-copy h2{font-size:10.4vw}
  .number-grid{grid-template-columns:1fr}
  .number-item{min-height:210px;border-right:0!important;border-bottom:1px solid #3a3f38!important}
  .number-item:last-child{border-bottom:0!important}
  .number-item strong{font-size:22vw}
  .number-item:hover,.work-card:hover{transform:none}
  .work-image{height:72vw;min-height:280px}
  .recruit-copy h2{font-size:9.6vw}
  .recruit-word{font-size:24vw;top:auto;bottom:-2vw}
  .news-row{grid-template-columns:1fr 70px 36px;gap:8px;padding:20px 0}
  .news-row time{grid-column:1}
  .news-row>span{grid-column:2;grid-row:1}
  .news-row h3{grid-column:1/3;font-size:13px}
  .news-row i{grid-column:3;grid-row:1/3}
  .contact-modern{padding:64px 18px}
  .contact-modern h2{font-size:11.4vw}
  .contact-status{display:none}
  .contact-card{padding:22px}
  .ticket{min-height:170px}
  .ticket-main{width:76%;padding:22px 18px}
  .ticket-main strong{font-size:clamp(32px,10vw,44px)}
  .ticket-jp{font-size:11px}
  .ticket-action span{display:none}
  .ticket-action{right:14px;bottom:14px}
  .ticket-action b{width:32px;height:32px}
  .ticket-stub{width:24%}
  .ticket-tear{left:76%}
  .ticket:hover .ticket-stub{transform:translateX(16px) rotate(3deg)}
  .footer-grid{grid-template-columns:1fr;gap:28px}
  .footer-bottom{display:block}
  .footer-bottom div{margin-top:16px;justify-content:space-between}
}
@media (hover:none),(pointer:coarse){
  .flip-card:hover .flip-card-inner,.flip-card:focus-visible .flip-card-inner{transform:none}
  .flip-card.is-flipped .flip-card-inner{transform:rotateY(180deg)}
}
@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .reveal,.reveal-scale,.hero-fade{opacity:1;transform:none}
}
.ticket.touch-tear .ticket-main{transform:translateX(-5px) rotate(-.3deg)}
.ticket.touch-tear .ticket-stub{transform:translateX(16px) rotate(4deg)}
.ticket.touch-tear .ticket-tear{opacity:0}

/* =========================================================
   DENTAL — doctor career
   ========================================================= */
.doctor-career{margin-top:26px;border-top:1px solid var(--line)}
.doctor-career li{display:grid;grid-template-columns:70px 1fr;padding:12px 0;border-bottom:1px solid var(--line);font-size:12px;color:#555b52;transition:padding .4s var(--ease)}
.doctor-career li:hover{padding-left:8px}
.doctor-career span{font-weight:700;color:var(--ink);letter-spacing:.06em}

/* =========================================================
   DENTAL — hours & access
   ========================================================= */
.hours-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:stretch}
.hours-card,.access-card{background:#fff;border:1px solid var(--line);border-radius:28px;padding:clamp(24px,3vw,44px);transition:box-shadow .6s var(--ease),transform .6s var(--ease)}
.hours-card:hover,.access-card:hover{box-shadow:0 26px 60px rgba(21,23,20,.08);transform:translateY(-4px)}
.hours-table-wrap{overflow-x:auto}
.hours-table{width:100%;min-width:520px;border-collapse:collapse;font-size:13px;text-align:center}
.hours-table thead th{font-size:12px;font-weight:600;padding:0 6px 16px;border-bottom:1px solid var(--ink)}
.hours-table thead th:first-child{text-align:left;font-size:10px;letter-spacing:.14em;color:var(--muted)}
.hours-table tbody th{text-align:left;font-weight:600;padding:22px 6px 22px 0;white-space:nowrap;font-size:14px;letter-spacing:.02em}
.hours-table td,.hours-table tbody th{border-bottom:1px solid var(--line)}
.hours-table thead th:nth-child(7){color:#4a6fd8}
.hours-table thead th:nth-child(8),.hours-table thead th:nth-child(9){color:#d8584a}
.mk{display:inline-block;width:14px;height:14px;border-radius:50%;background:linear-gradient(135deg,#5fd3c9,var(--blue));vertical-align:middle}
.mk.tri{width:0;height:0;border-radius:0;background:none;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:14px solid #8fbf2a}
.mk.off{background:none;border-radius:0;width:14px;height:2px;background:#b9beb5}
.hours-table tbody tr td{transition:background .3s}
.hours-table tbody tr:hover td{background:rgba(169,245,239,.18)}
.hours-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:20px;font-size:11px;color:var(--muted)}
.hours-legend li{display:flex;align-items:center;gap:8px}
.hours-tel{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:30px;padding:22px;border-radius:20px;background:var(--bg-2)}
.hours-tel .cc-icon{width:52px;height:52px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;font-size:22px;background:var(--lime);color:var(--ink)}
.hours-tel small{display:block;font-size:9px;letter-spacing:.2em;color:var(--muted)}
.hours-tel div a{font-size:clamp(24px,2.4vw,34px);font-weight:600;letter-spacing:-.01em}
.hours-tel .btn-pill{margin-left:auto}
.access-card{display:flex;flex-direction:column;gap:22px}
.access-map{position:relative;min-height:260px;flex:1;border-radius:18px;overflow:hidden;background:#dfe3dc center/cover no-repeat}
.access-map::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(21,23,20,.15))}
.map-pin{position:absolute;left:50%;top:46%;z-index:2;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--ink);color:var(--lime);display:grid;place-items:center;box-shadow:0 10px 30px rgba(21,23,20,.3);animation:pinBounce 2.4s var(--ease) infinite}
.map-pin svg{transform:rotate(45deg);font-size:22px}
.map-pin::after{content:"";position:absolute;left:50%;top:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;border:2px solid var(--blue);opacity:0;animation:pinRing 2.4s ease-out infinite}
@keyframes pinBounce{0%,100%{translate:0 0}50%{translate:0 -8px}}
@keyframes pinRing{0%{transform:scale(.6);opacity:.8}100%{transform:scale(2.4);opacity:0}}
.access-list{margin:0;border-top:1px solid var(--line)}
.access-list div{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}
.access-list dt{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:600}
.access-list dt svg{font-size:16px;color:var(--blue)}
.access-list dd{margin:0;font-size:13px;line-height:1.8;color:#555b52}

/* =========================================================
   DENTAL — SP fixed CTA
   ========================================================= */
.sp-fixed-cta{display:none}
@media (max-width:980px){
  .hours-grid{grid-template-columns:1fr}
  .sp-fixed-cta{display:grid;grid-template-columns:1fr 1.3fr;gap:8px;position:fixed;left:12px;right:12px;bottom:12px;z-index:40;transform:translateY(140%);transition:transform .6s var(--ease)}
  .sp-fixed-cta.is-show{transform:none}
  .sp-fixed-cta a{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px 10px;border-radius:999px;background:var(--ink);color:#fff;font-size:13px;font-weight:700;box-shadow:0 12px 30px rgba(21,23,20,.25)}
  .sp-fixed-cta a.is-primary{background:linear-gradient(90deg,var(--cyan),var(--lime));color:var(--ink)}
  .sp-fixed-cta svg{font-size:17px}
  .footer{padding-bottom:110px}
}
@media (max-width:640px){
  .access-list div{grid-template-columns:1fr;gap:6px}
  .hours-tel .btn-pill{margin-left:0;width:100%;justify-content:space-between}
}

/* layout fixes */
html{overflow-x:clip}
.hours-card,.access-card{min-width:0}
.hero-float-card{left:-14%;bottom:auto;top:26%}
.recruit-copy{max-width:820px}
.recruit-copy h2{font-size:clamp(32px,4vw,64px)}
@media (max-width:980px){.hero-float-card{left:16px;top:auto;bottom:24px}.visual-copy{bottom:auto;top:12%}}

/* =========================================================
   v2 fixes — 2-line headings / footer white / SP menu close
   ========================================================= */
/* Headings that must always render in exactly 2 lines.
   CSS sets the max size; js/main.js (fitTwoLine) shrinks it to fit the container. */
.section-head>div{flex:1 1 auto;min-width:0}
.split-head>p{flex:0 0 auto}
.fit-2line{width:100%;max-width:100%}
.fit-2line .ln{display:block;width:max-content;max-width:none;white-space:nowrap}
.recruit-copy{max-width:min(820px,100%)}
.recruit-copy h2.fit-2line{font-size:clamp(34px,4.4vw,68px)}
.contact-modern h2.fit-2line{font-size:clamp(40px,6.6vw,116px)}
.about .section-head h2.fit-2line{font-size:clamp(40px,6.2vw,104px)}
@media (max-width:980px){
  .section-head h2.fit-2line,.about .section-head h2.fit-2line{font-size:9.6vw}
  .recruit-copy h2.fit-2line{font-size:8.4vw}
  .contact-modern h2.fit-2line{font-size:9.4vw}
}

/* Footer: all text white */
.footer,.footer a,.footer p,.footer-top>p,.footer-grid small,.footer-grid p,.footer-grid a,.footer-license,.footer-bottom,.footer-bottom a{color:#fff!important}
.footer-grid small{opacity:.75}
.footer-license{opacity:.8}

/* SP menu: header turns dark while the menu is open so the close button is visible */
@media (max-width:980px){
  body.menu-open .site-header{background:transparent;border-bottom-color:rgba(255,255,255,.14);backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none;color:#fff;transform:none}
  body.menu-open .site-header .brand-mark{border-color:#fff}
  .menu-btn{border-radius:50%;transition:background .4s,color .4s}
  .menu-btn.is-open{color:var(--ink);background:var(--lime)}
  .menu-btn.is-open i{left:12px}
  body.menu-open .sp-fixed-cta{transform:translateY(140%)}
}

/* =========================================================
   SUBPAGES — shared system
   ========================================================= */
.subhero{position:relative;overflow:hidden;color:#f7f8f4;padding:calc(var(--header) + clamp(48px,5vw,80px)) 5vw clamp(30px,3vw,44px);min-height:calc(var(--header) + 320px);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);grid-template-rows:1fr auto;gap:24px clamp(28px,5vw,80px);align-items:end;
  background:linear-gradient(90deg,rgba(255,255,255,.055) 0 1px,transparent 1px) 50% 0/1px 100% no-repeat,radial-gradient(circle at 88% 18%,rgba(207,193,255,.18),transparent 26%),radial-gradient(circle at 70% 90%,rgba(169,245,239,.12),transparent 30%),linear-gradient(118deg,#171a17 0%,#20241f 56%,#151815 100%)}
.subhero::before{content:"";position:absolute;z-index:1;left:0;right:0;bottom:0;height:4px;background:linear-gradient(90deg,var(--cyan) 0 34%,var(--violet) 34% 67%,var(--lime) 67% 100%);transform:scaleX(0);transform-origin:left;transition:transform 1.4s .4s var(--ease-io)}
.is-ready .subhero::before{transform:none}
.subhero-main{position:relative;z-index:2}
.subhero .eyebrow{color:#aeb5ac;margin-bottom:18px}
.subhero-jp{margin:0;font-family:var(--font-jp);font-size:clamp(34px,4.2vw,64px);line-height:1.15;font-weight:600;letter-spacing:.04em;overflow:hidden}
.subhero-jp span{display:block;transform:translateY(110%);transition:transform 1.2s var(--ease)}
.is-ready .subhero-jp span{transform:none}
.subhero-title{margin:12px 0 0;font-size:clamp(12px,1.1vw,16px);letter-spacing:.2em;font-weight:500;color:#9da49b;text-transform:uppercase}
.subhero-copy{position:relative;z-index:2;max-width:460px;padding-bottom:6px}
.subhero-copy p{margin:0;font-size:13px;line-height:2;color:#c5cbc2}
.subhero .hero-fade{transition-delay:.35s}
.breadcrumbs{grid-column:1/-1;position:relative;z-index:2;display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.14em;color:#9fa69d;padding-top:18px;border-top:1px solid rgba(255,255,255,.1)}
.breadcrumbs a{color:#dfe3dc;transition:color .3s}.breadcrumbs a:hover{color:var(--cyan)}
.breadcrumbs i{font-style:normal;color:#70766f}
.subhero-orbit{position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%;pointer-events:none}
.subhero-orbit-a{width:420px;aspect-ratio:1;right:-120px;top:-140px;animation:orbitSpin 50s linear infinite}
.subhero-orbit-a::after{content:"";position:absolute;width:10px;height:10px;border-radius:50%;background:var(--cyan);left:12%;bottom:22%;box-shadow:0 0 18px var(--cyan)}
.subhero-orbit-b{width:200px;aspect-ratio:1;right:14vw;top:calc(var(--header) + 30px);border-color:rgba(207,193,255,.24);animation:orbitSpin 30s linear infinite reverse}
.subhero-orbit-b::after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--lime);right:8%;top:30%}
.subhero-icon{position:absolute;z-index:1;right:calc(14vw + 70px);top:calc(var(--header) + 100px);font-size:56px;color:rgba(255,255,255,.22)}
.global-nav a[aria-current="page"]::after{right:0}

/* in-page index pills */
.page-index{position:sticky;top:var(--header);z-index:30;background:rgba(245,246,243,.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);transition:top .4s var(--ease)}
.site-header.is-hidden ~ main .page-index{top:0}
.page-index-inner{display:flex;gap:8px;overflow-x:auto;padding:14px 5vw;scrollbar-width:none}
.page-index-inner::-webkit-scrollbar{display:none}
.page-index a{flex-shrink:0;display:flex;align-items:center;gap:8px;padding:9px 16px;border:1px solid var(--line);border-radius:999px;font-size:12px;font-weight:500;background:#fff;transition:background .35s,color .35s,border-color .35s,transform .4s var(--ease)}
.page-index a svg{font-size:15px;color:var(--blue);transition:color .35s}
.page-index a:hover,.page-index a.is-active{background:var(--ink);color:#fff;border-color:var(--ink)}
.page-index a:hover svg,.page-index a.is-active svg{color:var(--lime)}
[id]{scroll-margin-top:calc(var(--header) + 80px)}

.sub-lead{max-width:880px;font-size:clamp(20px,2.2vw,32px);line-height:1.8;letter-spacing:-.02em;font-family:var(--font-jp);font-weight:500;margin:0}
.section-narrow{max-width:1440px;margin-inline:auto}
.note{font-size:11px;color:var(--muted);line-height:1.8;margin:18px 0 0}

/* FAQ accordion */
.faq-wrap{display:grid;grid-template-columns:minmax(220px,.42fr) minmax(0,1.58fr);gap:7vw;align-items:start}
.faq-wrap .faq-head{position:sticky;top:calc(var(--header) + 90px)}
.faq-wrap .faq-head h2{font-size:clamp(36px,4vw,62px);line-height:1.15;letter-spacing:-.05em;font-weight:500;margin:20px 0;font-family:var(--font-jp)}
.faq-wrap .faq-head h2 em{font-style:normal;color:#6d736b}
.faq-wrap .faq-head p{font-size:13px;line-height:2;color:var(--muted)}
.faq-list details{border-top:1px solid var(--line)}
.faq-list details:last-child{border-bottom:1px solid var(--line)}
.faq-list summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:44px 1fr 40px;align-items:center;gap:14px;padding:24px 0;font-size:clamp(15px,1.4vw,18px);font-weight:600;font-family:var(--font-jp);transition:padding .4s var(--ease)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:hover{padding-left:10px}
.faq-q{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:14px;font-weight:700;background:var(--ink);color:var(--lime);font-family:var(--font-en)}
.faq-toggle{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);position:relative;justify-self:end;transition:background .4s,border-color .4s,transform .5s var(--ease)}
.faq-toggle::before,.faq-toggle::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;background:currentColor;transform:translate(-50%,-50%)}
.faq-toggle::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .4s var(--ease)}
details[open] .faq-toggle{background:var(--ink);color:#fff;border-color:var(--ink);transform:rotate(180deg)}
details[open] .faq-toggle::after{transform:translate(-50%,-50%) rotate(0)}
.faq-a{display:grid;grid-template-columns:44px 1fr;gap:14px;padding:0 50px 26px 0}
.faq-a span{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-size:14px;font-weight:700;border:1px solid var(--ink)}
.faq-a p{margin:8px 0 0;font-size:13px;line-height:2;color:#555b52}
details[open] .faq-a{animation:faqIn .6s var(--ease)}
@keyframes faqIn{from{opacity:0;transform:translateY(-8px)}}

/* small CTA band used on subpages */
.mini-cta{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:clamp(28px,3vw,44px);border-radius:28px;background:linear-gradient(105deg,#9ef5ec 0%,#b7e8ff 40%,#d3c3ff 80%,#f2bfff 100%);position:relative;overflow:hidden}
.mini-cta::after{content:"";position:absolute;width:300px;aspect-ratio:1;border-radius:50%;border:1px solid rgba(21,23,20,.15);right:-80px;top:-150px}
.mini-cta h3{margin:0;font-size:clamp(20px,2.2vw,30px);font-family:var(--font-jp);position:relative;z-index:1}
.mini-cta p{margin:8px 0 0;font-size:13px;position:relative;z-index:1}
.mini-cta .btn-pill{position:relative;z-index:1}

/* =========================================================
   ABOUT page
   ========================================================= */
.concept{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7vw;align-items:center}
.concept-figure{margin:0;position:relative;border-radius:0 12vw 0 12vw;overflow:hidden;aspect-ratio:4/3.4;background:#d8ddd7}
.concept-figure img{width:100%;height:116%;object-fit:cover;position:absolute;inset:-8% 0}
.concept-body h2{font-size:clamp(34px,3.8vw,60px);line-height:1.3;letter-spacing:-.05em;font-weight:500;font-family:var(--font-jp);margin:20px 0 30px}
.concept-body h2 em{font-style:normal;color:#6d736b}
.concept-body p:not(.section-no){font-size:14px;line-height:2.2;color:#545951}
.concept-values{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:30px}
.concept-values li{padding:20px 16px;border:1px solid var(--line);border-radius:18px;background:#fff;text-align:center;transition:transform .5s var(--ease),border-color .4s}
.concept-values li:hover{transform:translateY(-6px);border-color:var(--ink)}
.concept-values svg{font-size:26px;color:var(--blue);margin:0 auto 10px;display:block}
.concept-values b{display:block;font-size:14px}
.concept-values small{font-size:9px;letter-spacing:.16em;color:var(--muted)}

.doctor-detail{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:7vw;align-items:start}
.doctor-photo{position:sticky;top:calc(var(--header) + 40px);border-radius:0 0 48% 48%;overflow:hidden;aspect-ratio:4/5;background:#d9ded6}
.doctor-photo img{width:100%;height:100%;object-fit:cover}
.doctor-photo small{position:absolute;left:6%;bottom:6%;color:rgba(255,255,255,.7);font-size:clamp(24px,2.6vw,44px);font-weight:600;line-height:.95;mix-blend-mode:screen}
.doctor-body h2{font-size:clamp(34px,3.8vw,58px);line-height:1.3;letter-spacing:-.05em;font-weight:500;font-family:var(--font-jp);margin:20px 0 34px}
.doctor-body h2 em{font-style:normal;color:#6d736b}
.doctor-body>p{font-size:14px;line-height:2.2;color:#545951}
.doctor-info{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:40px}
.doctor-info h3{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.14em;margin:0 0 12px}
.doctor-info h3 svg{font-size:18px;color:var(--blue)}
.doctor-info ul{border-top:1px solid var(--line)}
.doctor-info li{padding:11px 0;border-bottom:1px solid var(--line);font-size:12px;line-height:1.7;color:#555b52;display:grid;grid-template-columns:52px 1fr;gap:8px}
.doctor-info li span{font-weight:700;color:var(--ink)}
.doctor-info .qual li{grid-template-columns:18px 1fr}
.doctor-info .qual li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--lime);margin-top:7px;box-shadow:0 0 0 3px rgba(216,255,123,.3)}

.staff-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2vw}
.staff-card{position:relative}
.staff-img{aspect-ratio:3/4;border-radius:20px;overflow:hidden;background:#d9ded6 center/cover no-repeat;position:relative;transition:border-radius .7s var(--ease)}
.staff-img::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(10,14,12,.5));opacity:0;transition:opacity .6s var(--ease)}
.staff-card:hover .staff-img{border-radius:20px 80px 20px 20px}
.staff-card:hover .staff-img::after{opacity:1}
.staff-comment{position:absolute;z-index:2;left:16px;right:16px;bottom:16px;color:#fff;font-size:12px;line-height:1.7;opacity:0;transform:translateY(16px);transition:opacity .5s var(--ease),transform .6s var(--ease)}
.staff-card:hover .staff-comment{opacity:1;transform:none}
.staff-meta{padding:18px 4px 0}
.staff-meta small{font-size:9px;letter-spacing:.18em;color:var(--blue);font-weight:700}
.staff-meta h3{margin:6px 0 4px;font-size:18px;font-family:var(--font-jp)}
.staff-meta p{margin:0;font-size:11px;color:var(--muted)}

.gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(180px,17vw,260px);gap:12px}
.gallery-item{position:relative;overflow:hidden;border-radius:18px;background:#d9ded6;margin:0}
.gallery-item:nth-child(1){grid-column:span 2;grid-row:span 2}
.gallery-item:nth-child(4){grid-column:span 2}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),filter .6s}
.gallery-item:hover img{transform:scale(1.08);filter:saturate(1.05)}
.gallery-item figcaption{position:absolute;left:12px;bottom:12px;display:flex;align-items:center;gap:8px;padding:8px 14px 8px 8px;border-radius:999px;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);font-size:12px;font-weight:600;transform:translateY(6px);opacity:.92;transition:transform .5s var(--ease),opacity .4s}
.gallery-item:hover figcaption{transform:none;opacity:1}
.gallery-item figcaption svg{width:28px;height:28px;padding:6px;border-radius:50%;background:var(--ink);color:var(--lime)}

.equip-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.equip-card{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);background:var(--bg);min-height:280px;transition:background .5s var(--ease)}
.equip-card:hover{background:#fff}
.equip-img{background:#d9ded6 center/cover no-repeat;position:relative;overflow:hidden}
.equip-img::after{content:"";position:absolute;inset:0;background:inherit;transition:transform 1.2s var(--ease)}
.equip-card:hover .equip-img::after{transform:scale(1.08)}
.equip-body{padding:clamp(22px,2.6vw,38px);display:flex;flex-direction:column}
.equip-body .ei{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:22px;background:var(--ink);color:var(--cyan);transition:transform .6s var(--ease),background .4s,color .4s}
.equip-card:hover .ei{transform:rotate(-10deg) scale(1.08);background:var(--cyan);color:var(--ink)}
.equip-body small{margin-top:auto;font-size:9px;letter-spacing:.18em;color:var(--muted)}
.equip-body h3{margin:8px 0 12px;font-size:20px;font-family:var(--font-jp)}
.equip-body p{margin:0;font-size:12px;line-height:1.9;color:#5a6058}

.hygiene{background:var(--ink);color:#fff}
.hygiene .section-head h2 em{color:var(--cyan)}
.hygiene .split-head>p{color:#aeb4aa}
.hygiene-steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #3a3f38;border-left:1px solid #3a3f38}
.hygiene-steps li{padding:clamp(24px,2.6vw,36px);border-right:1px solid #3a3f38;border-bottom:1px solid #3a3f38;min-height:260px;display:flex;flex-direction:column;transition:background .5s var(--ease)}
.hygiene-steps li:hover{background:#20241f}
.hygiene-steps .hi{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-size:24px;border:1px solid #3a3f38;color:var(--lime);transition:transform .6s var(--ease),border-color .4s}
.hygiene-steps li:hover .hi{transform:scale(1.1) rotate(-12deg);border-color:var(--lime)}
.hygiene-steps span{margin-top:auto;font-size:10px;letter-spacing:.18em;color:#8c928a}
.hygiene-steps h3{margin:8px 0 10px;font-size:18px;font-family:var(--font-jp)}
.hygiene-steps p{margin:0;font-size:12px;line-height:1.9;color:#abb1a8}

.profile-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5vw;align-items:start}
.profile-table{margin:0;border-top:1px solid var(--ink)}
.profile-table>div{display:grid;grid-template-columns:150px 1fr;gap:24px;padding:20px 4px;border-bottom:1px solid var(--line);transition:background .35s}
.profile-table>div:hover{background:#fff}
.profile-table dt{font-size:12px;font-weight:600}
.profile-table dd{margin:0;font-size:13px;line-height:1.9;color:#545a53}

/* =========================================================
   TREATMENT page
   ========================================================= */
.symptom-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.symptom-card{display:flex;align-items:center;gap:14px;padding:18px 18px 18px 14px;border:1px solid var(--line);border-radius:18px;background:#fff;position:relative;overflow:hidden;isolation:isolate;transition:color .45s var(--ease),border-color .4s}
.symptom-card::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);transform:translateY(101%);transition:transform .55s var(--ease)}
.symptom-card:hover{color:#fff;border-color:var(--ink)}
.symptom-card:hover::before{transform:none}
.symptom-card .si{width:44px;height:44px;flex-shrink:0;border-radius:12px;display:grid;place-items:center;font-size:20px;background:var(--bg-2);color:var(--blue);transition:background .4s,color .4s}
.symptom-card:hover .si{background:var(--lime);color:var(--ink)}
.symptom-card b{display:block;font-size:14px;font-family:var(--font-jp)}
.symptom-card small{font-size:10px;color:var(--muted);transition:color .4s}
.symptom-card:hover small{color:#b9bfb7}
.symptom-card .sa{margin-left:auto;font-size:14px;transition:transform .45s var(--ease)}
.symptom-card:hover .sa{transform:translateX(4px) rotate(-45deg)}

.tx-block{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(30px,6vw,96px);align-items:center;padding:clamp(56px,6vw,96px) 0;border-top:1px solid var(--line)}
.tx-block:last-child{border-bottom:1px solid var(--line)}
.tx-block.reverse .tx-media{order:2}
.tx-media{position:relative;margin:0}
.tx-media .tx-img{aspect-ratio:4/3.3;border-radius:28px;overflow:hidden;background:#d9ded6 center/cover no-repeat;transition:border-radius .8s var(--ease)}
.tx-block:hover .tx-img{border-radius:28px 120px 28px 28px}
.tx-block.reverse:hover .tx-img{border-radius:120px 28px 28px 28px}
.tx-media .tx-badge{position:absolute;left:-18px;bottom:-18px;width:96px;height:96px;border-radius:50%;display:grid;place-items:center;font-size:38px;background:linear-gradient(135deg,var(--cyan),var(--lime));color:var(--ink);box-shadow:0 18px 40px rgba(20,25,20,.15);transition:transform .7s var(--ease)}
.tx-block.reverse .tx-badge{left:auto;right:-18px}
.tx-block:hover .tx-badge{transform:rotate(-14deg) scale(1.06)}
.tx-num{font-size:11px;letter-spacing:.18em;font-weight:700;color:var(--muted)}
.tx-body h2{margin:12px 0 6px;font-size:clamp(32px,3.6vw,56px);letter-spacing:-.04em;font-weight:500;font-family:var(--font-jp)}
.tx-en{font-size:10px;letter-spacing:.2em;color:var(--blue);font-weight:700}
.tx-body>p{font-size:14px;line-height:2.1;color:#545951;margin:24px 0}
.tx-reco{padding:22px 24px;border-radius:20px;background:#fff;border:1px solid var(--line)}
.tx-reco h3{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:12px;letter-spacing:.12em}
.tx-reco h3 svg{font-size:16px;color:var(--blue)}
.tx-reco ul{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px}
.tx-reco li{display:flex;gap:8px;font-size:12px;line-height:1.7}
.tx-reco li svg{font-size:15px;color:#3fb6a8;margin-top:2px}
.tx-menu{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.tx-menu li{font-size:11px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);transition:background .3s,border-color .3s}
.tx-menu li:hover{background:var(--lime);border-color:var(--lime)}
.tx-foot{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-top:24px}
.tx-foot .tx-time{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.tx-foot .tx-time svg{font-size:16px}

/* =========================================================
   PRICE page
   ========================================================= */
.policy-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.policy-card{background:var(--bg);padding:clamp(26px,3.2vw,46px);min-height:300px;display:flex;flex-direction:column;transition:background .5s var(--ease)}
.policy-card:hover{background:#fff}
.policy-card .pi{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-size:24px;background:var(--ink);color:var(--lime);transition:transform .6s var(--ease)}
.policy-card:hover .pi{transform:rotate(-14deg) scale(1.08)}
.policy-card span{margin-top:auto;font-size:10px;letter-spacing:.18em;color:var(--muted)}
.policy-card h3{margin:8px 0 12px;font-size:20px;font-family:var(--font-jp)}
.policy-card p{margin:0;font-size:12px;line-height:1.9;color:#5a6058}

.insurance-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ins-card{padding:24px;border-radius:20px;border:1px solid #3a3f38;background:#1d201c;transition:transform .5s var(--ease),border-color .4s}
.ins-card:hover{transform:translateY(-6px);border-color:var(--cyan)}
.ins-card small{font-size:9px;letter-spacing:.18em;color:#9aa198}
.ins-card h3{margin:8px 0 18px;font-size:15px;font-family:var(--font-jp)}
.ins-card strong{font-size:clamp(26px,2.4vw,36px);letter-spacing:-.03em;font-weight:600}
.ins-card strong i{font-style:normal;font-size:12px;margin-left:4px;color:#bbc2b7}
.ins-card p{font-size:11px;color:#9ea59c;margin:8px 0 0;line-height:1.7}

.price-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.price-tabs button{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;background:#fff;padding:11px 18px;font-size:12px;font-weight:600;cursor:pointer;transition:background .35s,color .35s,border-color .35s}
.price-tabs button svg{font-size:16px;color:var(--blue)}
.price-tabs button:hover{border-color:var(--ink)}
.price-tabs button.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.price-tabs button.active svg{color:var(--lime)}
.price-panel{display:none}
.price-panel.active{display:block;animation:faqIn .6s var(--ease)}
.price-table{width:100%;border-collapse:collapse}
.price-table caption{text-align:left;padding:0 0 14px;font-size:12px;letter-spacing:.14em;font-weight:700;color:var(--muted)}
.price-table th,.price-table td{padding:20px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.price-table thead th{font-size:10px;letter-spacing:.16em;color:var(--muted);font-weight:600;border-bottom:1px solid var(--ink);padding-top:0}
.price-table tbody th{font-size:15px;font-family:var(--font-jp);font-weight:600;width:30%}
.price-table tbody td{font-size:12px;line-height:1.8;color:#5a6058}
.price-table tbody td.yen{font-size:18px;font-weight:600;color:var(--ink);white-space:nowrap;width:22%}
.price-table tbody td.yen small{font-size:11px;font-weight:500;color:var(--muted);margin-left:2px}
.price-table tbody tr{transition:background .3s}
.price-table tbody tr:hover{background:#fff}

.pay-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.pay-card{padding:26px 22px;border-radius:20px;background:#fff;border:1px solid var(--line);transition:transform .5s var(--ease),box-shadow .5s}
.pay-card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(21,23,20,.08)}
.pay-card .pyi{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:22px;background:linear-gradient(135deg,var(--cyan),var(--violet))}
.pay-card h3{margin:18px 0 8px;font-size:16px;font-family:var(--font-jp)}
.pay-card p{margin:0;font-size:12px;line-height:1.8;color:var(--muted)}

.loan{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5vw;align-items:center}
.loan h2{font-size:clamp(34px,3.6vw,56px);line-height:1.25;letter-spacing:-.05em;font-weight:500;font-family:var(--font-jp);margin:20px 0}
.loan h2 em{font-style:normal;color:#6d736b}
.loan>div>p:not(.section-no){font-size:14px;line-height:2;color:#545951}
.loan-sim{padding:clamp(26px,3vw,42px);border-radius:28px;background:var(--ink);color:#fff;position:relative;overflow:hidden}
.loan-sim::before{content:"";position:absolute;width:300px;aspect-ratio:1;border-radius:50%;right:-100px;top:-100px;background:radial-gradient(circle,rgba(169,245,239,.25),transparent 65%)}
.loan-sim small{font-size:10px;letter-spacing:.18em;color:#9aa198}
.loan-sim label{display:block;margin:22px 0 10px;font-size:12px;position:relative}
.loan-sim output{float:right;font-weight:700;color:var(--lime)}
.loan-sim input[type=range]{width:100%;accent-color:#a9f5ef;position:relative}
.loan-result{margin-top:28px;padding-top:22px;border-top:1px solid #3a3f38;display:flex;align-items:flex-end;justify-content:space-between;gap:14px;position:relative}
.loan-result span{font-size:12px;color:#aeb4aa}
.loan-result strong{font-size:clamp(36px,4vw,60px);letter-spacing:-.04em;font-weight:600}
.loan-result strong i{font-style:normal;font-size:14px;margin-left:4px}
.loan-sim .note{color:#7f867e}

/* =========================================================
   CONTACT page
   ========================================================= */
.method-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.method-card{position:relative;display:flex;flex-direction:column;padding:clamp(26px,3vw,40px);border-radius:28px;background:#fff;border:1px solid var(--line);min-height:300px;overflow:hidden;isolation:isolate;transition:transform .6s var(--ease),color .5s var(--ease),border-color .4s}
.method-card::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink);clip-path:circle(0% at 90% 10%);transition:clip-path .8s var(--ease)}
.method-card:hover{color:#fff;transform:translateY(-6px);border-color:var(--ink)}
.method-card:hover::before{clip-path:circle(150% at 90% 10%)}
.method-card.is-primary{background:linear-gradient(135deg,#9ef5ec,#d3c3ff)}
.method-card .mi{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;font-size:26px;background:var(--ink);color:var(--lime);transition:background .4s,color .4s,transform .6s var(--ease)}
.method-card:hover .mi{background:var(--lime);color:var(--ink);transform:rotate(-12deg)}
.method-card .ma{position:absolute;right:26px;top:26px;width:42px;height:42px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;font-size:16px;transition:transform .5s var(--ease)}
.method-card:hover .ma{transform:rotate(45deg)}
.method-card small{margin-top:auto;font-size:10px;letter-spacing:.18em;font-weight:700;opacity:.7}
.method-card h3{margin:8px 0 6px;font-size:22px;font-family:var(--font-jp)}
.method-card strong{font-size:clamp(24px,2.2vw,32px);letter-spacing:-.01em}
.method-card p{margin:8px 0 0;font-size:12px;line-height:1.8;opacity:.8}

.form-section{display:grid;grid-template-columns:minmax(260px,.62fr) minmax(0,1.38fr);gap:6vw;background:var(--ink);color:#f5f6f3}
.form-aside{position:sticky;top:calc(var(--header) + 90px);align-self:start}
.form-aside h2{font-size:clamp(34px,3.8vw,58px);line-height:1.2;letter-spacing:-.05em;font-weight:500;font-family:var(--font-jp);margin:20px 0}
.form-aside h2 em{font-style:normal;color:var(--cyan)}
.form-aside>p:not(.section-no){font-size:13px;line-height:2;color:#aeb4aa}
.form-steps{margin-top:30px;border-top:1px solid #3a3f38}
.form-steps li{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid #3a3f38;font-size:13px;color:#8c928a;transition:color .4s}
.form-steps li span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;border:1px solid #3a3f38;font-size:11px;transition:background .4s,color .4s,border-color .4s}
.form-steps li.is-current{color:#fff}
.form-steps li.is-current span{background:var(--lime);color:var(--ink);border-color:var(--lime)}
.r-form{min-width:0}
.field{padding:20px 0;border-top:1px solid #3a3f38}
.field:last-of-type{border-bottom:1px solid #3a3f38}
.field>label,.field>.label{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:13px;font-weight:600}
.req,.opt{font-size:9px;letter-spacing:.1em;padding:3px 8px;border-radius:99px;font-weight:700}
.req{background:var(--lime);color:var(--ink)}
.opt{border:1px solid #4a4f48;color:#9aa198}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.r-form input[type=text],.r-form input[type=tel],.r-form input[type=email],.r-form input[type=date],.r-form select,.r-form textarea{width:100%;border:1px solid transparent;background:#232722;color:#fff;padding:15px 16px;font:inherit;font-size:15px;border-radius:12px;outline:0;transition:border-color .3s,background .3s,box-shadow .3s;color-scheme:dark}
.r-form textarea{min-height:160px;resize:vertical}
.r-form input:focus,.r-form select:focus,.r-form textarea:focus{border-color:var(--cyan);background:#272b26;box-shadow:0 0 0 4px rgba(169,245,239,.12)}
.r-form ::placeholder{color:#6e746c}
.field.is-error input,.field.is-error select,.field.is-error textarea{border-color:#ff8a7a}
.err-msg{display:none;margin-top:8px;font-size:11px;color:#ff9d8f}
.field.is-error .err-msg{display:block}
.choice-group{display:flex;flex-wrap:wrap;gap:8px}
.choice{position:relative}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice span{display:flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;border:1px solid #3a3f38;font-size:13px;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.choice span::before{content:"";width:14px;height:14px;border-radius:50%;border:1px solid #6e746c;transition:background .3s,border-color .3s,box-shadow .3s}
.choice input:checked+span{background:#fff;color:var(--ink);border-color:#fff}
.choice input:checked+span::before{background:var(--blue);border-color:var(--blue);box-shadow:inset 0 0 0 3px #fff}
.choice input:focus-visible+span{box-shadow:0 0 0 3px rgba(169,245,239,.35)}
.privacy-box{margin:22px 0 14px;padding:18px;border-radius:14px;background:#1d201c;font-size:11px;line-height:1.9;color:#9ea59c;max-height:130px;overflow:auto}
.agree{display:flex;align-items:center;gap:12px;font-size:13px;cursor:pointer}
.agree input{width:20px;height:20px;accent-color:#d8ff7b}
.agree a{text-decoration:underline}
.form-submit{margin-top:28px;width:100%;border:0;border-radius:999px;background:linear-gradient(90deg,var(--cyan),var(--lime));color:var(--ink);padding:10px 10px 10px 32px;display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:700;letter-spacing:.1em;cursor:pointer;position:relative;overflow:hidden;isolation:isolate}
.form-submit::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--violet),var(--cyan));opacity:0;transition:opacity .5s}
.form-submit:hover::before{opacity:1}
.form-submit i{width:52px;height:52px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:18px;transition:transform .5s var(--ease)}
.form-submit:hover i{transform:translateX(4px) rotate(-45deg)}
.form-note{font-size:11px;color:#7f867e;line-height:1.8;margin-top:14px}
.form-done{display:none;text-align:center;padding:60px 20px;border:1px solid #3a3f38;border-radius:28px}
.form-done .di{width:84px;height:84px;margin:0 auto 24px;border-radius:50%;display:grid;place-items:center;font-size:36px;background:var(--lime);color:var(--ink);animation:loaderPulse 1.6s ease-in-out infinite}
.form-done h3{font-size:clamp(24px,2.4vw,34px);font-family:var(--font-jp);margin:0 0 12px}
.form-done p{color:#aeb4aa;font-size:13px;line-height:2}
.r-form.is-sent .form-body{display:none}
.r-form.is-sent .form-done{display:block}

.prep-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.prep-card{padding:clamp(26px,3vw,40px);border-radius:28px;background:#fff;border:1px solid var(--line)}
.prep-card h3{display:flex;align-items:center;gap:12px;margin:0 0 20px;font-size:20px;font-family:var(--font-jp)}
.prep-card h3 svg{width:44px;height:44px;padding:10px;border-radius:12px;background:var(--ink);color:var(--lime)}
.check-list li{display:flex;align-items:flex-start;gap:12px;padding:14px 0;border-top:1px solid var(--line);font-size:13px;line-height:1.7;transition:padding .4s var(--ease)}
.check-list li:hover{padding-left:8px}
.check-list li svg{font-size:18px;color:#3fb6a8;margin-top:2px}
.check-list li b{display:block}
.check-list li small{color:var(--muted);font-size:11px}

/* =========================================================
   SUBPAGES responsive
   ========================================================= */
@media (max-width:1180px){
  .staff-grid{grid-template-columns:repeat(2,1fr);gap:24px}
  .symptom-grid{grid-template-columns:repeat(2,1fr)}
  .insurance-grid,.pay-grid{grid-template-columns:repeat(2,1fr)}
  .equip-grid{grid-template-columns:1fr}
}
@media (max-width:980px){
  .subhero{grid-template-columns:1fr;min-height:0;padding:calc(var(--header) + 48px) 22px 24px;gap:18px}
  .subhero-icon{display:none}
  .subhero-orbit-a{width:260px;right:-110px;top:-80px}
  .subhero-orbit-b{display:none}
  .page-index-inner{padding:12px 22px}
  .concept,.doctor-detail,.profile-grid,.faq-wrap,.loan,.form-section,.prep-grid{grid-template-columns:1fr;gap:40px}
  .doctor-photo,.faq-wrap .faq-head,.form-aside{position:static}
  .doctor-photo{max-width:520px}
  .gallery{grid-template-columns:repeat(2,1fr);grid-auto-rows:42vw}
  .gallery-item:nth-child(4){grid-column:span 1}
  .hygiene-steps{grid-template-columns:repeat(2,1fr)}
  .tx-block,.tx-block.reverse{grid-template-columns:1fr;gap:40px}
  .tx-block.reverse .tx-media{order:0}
  .policy-grid,.method-grid{grid-template-columns:1fr}
  .policy-card,.method-card{min-height:auto}
  .policy-card span,.method-card small{margin-top:30px}
  .form-section{padding-left:22px;padding-right:22px}
}
@media (max-width:640px){
  .subhero-jp{font-size:clamp(30px,9vw,40px)}
  .concept-values{grid-template-columns:1fr}
  .doctor-info{grid-template-columns:1fr}
  .staff-grid{grid-template-columns:1fr 1fr;gap:16px}
  .staff-comment{display:none}
  .gallery{grid-template-columns:1fr;grid-auto-rows:62vw}
  .gallery-item:nth-child(1){grid-column:auto;grid-row:auto}
  .equip-card{grid-template-columns:1fr}
  .equip-img{aspect-ratio:16/9}
  .hygiene-steps{grid-template-columns:1fr}
  .hygiene-steps li{min-height:auto}
  .hygiene-steps span{margin-top:24px}
  .profile-table>div{grid-template-columns:1fr;gap:6px}
  .symptom-grid,.insurance-grid,.pay-grid{grid-template-columns:1fr}
  .tx-reco ul{grid-template-columns:1fr}
  .tx-media .tx-badge{width:72px;height:72px;font-size:28px;left:12px;bottom:-24px}
  .tx-block.reverse .tx-badge{right:12px}
  .price-table thead{display:none}
  .price-table,.price-table tbody,.price-table tr,.price-table th,.price-table td{display:block;width:100%!important}
  .price-table tr{padding:16px 0;border-bottom:1px solid var(--line)}
  .price-table th,.price-table td{border:0;padding:4px 0}
  .price-table tbody td.yen{font-size:20px}
  .faq-list summary{grid-template-columns:36px 1fr 32px;gap:10px}
  .faq-q,.faq-a span{width:34px;height:34px;font-size:12px}
  .faq-a{grid-template-columns:36px 1fr;gap:10px;padding-right:0}
  .field-row{grid-template-columns:1fr}
  .mini-cta .btn-pill{width:100%;justify-content:space-between}
}
@media (min-width:981px){.gallery-item:nth-child(5),.gallery-item:nth-child(6){grid-column:span 2}}
@media (max-width:980px){
  .menu-btn.is-open i{top:22px;transform:rotate(45deg)}
  .menu-btn.is-open i+i{top:22px;transform:rotate(-45deg)}
}
@keyframes loaderPulse{50%{box-shadow:0 0 0 18px rgba(169,245,239,0),0 0 60px rgba(216,255,123,.45);transform:scale(1.06)}}

/* =========================================================
   NEWS — list
   ========================================================= */
.news-meta{display:flex;align-items:center;flex-wrap:wrap;gap:12px;font-size:11px;letter-spacing:.08em}
.news-meta time{color:var(--muted)}
.cat-chip{display:inline-flex;align-items:center;padding:5px 11px;border-radius:999px;font-size:9px;letter-spacing:.14em;font-weight:700;background:var(--bg-2);color:var(--ink)}
.cat-chip.is-news{background:var(--cyan)}
.cat-chip.is-column{background:var(--violet)}
.cat-chip.is-info{background:var(--lime)}

.news-pickup{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);border-radius:32px;overflow:hidden;background:#fff;border:1px solid var(--line);transition:box-shadow .7s var(--ease),transform .7s var(--ease)}
.news-pickup:hover{box-shadow:0 30px 70px rgba(21,23,20,.1);transform:translateY(-6px)}
.pickup-img{position:relative;min-height:420px;background:#d9ded6 center/cover no-repeat;overflow:hidden}
.pickup-img::after{content:"";position:absolute;inset:0;background:inherit;transition:transform 1.4s var(--ease)}
.news-pickup:hover .pickup-img::after{transform:scale(1.07)}
.pickup-label{position:absolute;z-index:2;left:22px;top:22px;display:flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;background:var(--ink);color:#fff;font-size:10px;letter-spacing:.18em;font-weight:700}
.pickup-label svg{color:var(--lime)}
.pickup-body{padding:clamp(30px,4vw,60px);display:flex;flex-direction:column;justify-content:center}
.pickup-body h2{margin:22px 0 18px;font-size:clamp(24px,2.4vw,36px);line-height:1.5;letter-spacing:-.02em;font-family:var(--font-jp);font-weight:600}
.pickup-body p{margin:0;font-size:13px;line-height:2;color:#5a6058}
.pickup-more{display:inline-flex;align-items:center;gap:14px;margin-top:30px;font-size:11px;letter-spacing:.16em;font-weight:700}
.pickup-more i{width:44px;height:44px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:16px;transition:transform .5s var(--ease),background .4s,color .4s}
.news-pickup:hover .pickup-more i{transform:translateX(6px);background:var(--lime);color:var(--ink)}

.news-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:34px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.news-tabs{margin-top:0}
.news-tabs button{display:flex;align-items:center;gap:8px}
.news-tabs button span{min-width:20px;height:20px;border-radius:99px;display:grid;place-items:center;font-size:9px;background:var(--bg-2);color:var(--ink);padding:0 6px;transition:background .3s}
.news-tabs button.active span{background:var(--lime)}
.news-count{margin:0;font-size:10px;letter-spacing:.16em;color:var(--muted)}
.news-count b{font-size:22px;color:var(--ink);margin-right:6px;letter-spacing:-.02em}

.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.4vw,36px)}
.news-card{display:flex;flex-direction:column;transition:transform .7s var(--ease)}
.news-card:hover{transform:translateY(-10px)}
.news-card.is-hidden{display:none}
.nc-img{position:relative;aspect-ratio:16/10;border-radius:22px;overflow:hidden;background:#d9ded6 center/cover no-repeat;clip-path:inset(0 round 22px);transition:clip-path .7s var(--ease)}
.nc-img::before{content:"";position:absolute;inset:0;background:inherit;transition:transform 1.2s var(--ease)}
.nc-img::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.28),transparent);transform:translateX(-130%);transition:transform .9s var(--ease)}
.news-card:hover .nc-img{clip-path:inset(8px round 30px)}
.news-card:hover .nc-img::before{transform:scale(1.08)}
.news-card:hover .nc-img::after{transform:translateX(130%)}
.nc-arrow{position:absolute;z-index:2;right:14px;bottom:14px;width:44px;height:44px;border-radius:50%;background:#fff;color:var(--ink);display:grid;place-items:center;font-size:16px;opacity:0;transform:scale(.8) rotate(-45deg);transition:.6s var(--ease)}
.news-card:hover .nc-arrow{opacity:1;transform:none}
.nc-body{padding:18px 4px 0}
.nc-body h3{margin:12px 0 8px;font-size:16px;line-height:1.65;font-family:var(--font-jp);font-weight:600;transition:color .3s}
.news-card:hover .nc-body h3{color:var(--blue)}
.nc-body p{margin:0;font-size:12px;line-height:1.8;color:var(--muted)}
.news-empty{display:none;text-align:center;padding:60px 0;color:var(--muted);font-size:13px}
.news-empty.is-show{display:block}

.pager{display:flex;justify-content:center;align-items:center;gap:8px;margin-top:clamp(50px,5vw,80px)}
.pager a,.pager span{min-width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:600}
.pager a{border:1px solid var(--line);background:#fff;transition:background .35s,color .35s,border-color .35s,transform .45s var(--ease)}
.pager a:hover{border-color:var(--ink);transform:translateY(-3px)}
.pager a.is-current{background:var(--ink);color:#fff;border-color:var(--ink)}
.pager-arrow:first-child svg{transform:rotate(180deg)}
.pager a.is-disabled{opacity:.35;pointer-events:none}

/* =========================================================
   NEWS — detail
   ========================================================= */
.subhero-article{grid-template-columns:1fr;min-height:calc(var(--header) + 300px)}
.subhero-article .news-meta time{color:#c5cbc2}
.subhero-article .read-time{display:flex;align-items:center;gap:6px;color:#9da49b}
.article-title{margin:22px 0 0;font-family:var(--font-jp);font-size:clamp(26px,3.2vw,48px);line-height:1.45;font-weight:600;letter-spacing:.01em;overflow:hidden;max-width:1100px}
.article-title span{display:block;transform:translateY(110%);transition:transform 1.2s var(--ease)}
.is-ready .article-title span{transform:none}
.article-section{padding-top:clamp(50px,5vw,80px)}
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(40px,5vw,80px);align-items:start;max-width:1320px;margin:0 auto}
.article{min-width:0}
.article-eyecatch{margin:0;border-radius:28px;overflow:hidden;aspect-ratio:16/9;background:#d9ded6}
.article-eyecatch img{width:100%;height:100%;object-fit:cover}
.article-tags{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0}
.article-tags span{font-size:11px;padding:6px 12px;border-radius:999px;border:1px solid var(--line);color:#5a6058;transition:background .3s,border-color .3s}
.article-tags span:hover{background:var(--lime);border-color:var(--lime)}
.article-lead{margin:30px 0;font-size:15px;line-height:2.2;color:#3f443d;font-family:var(--font-jp)}
.toc{border-radius:22px;background:#fff;border:1px solid var(--line);padding:24px 26px}
.toc-title{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:11px;letter-spacing:.16em;font-weight:700}
.toc-title svg{font-size:18px;color:var(--blue)}
.toc ol{counter-reset:toc}
.toc li{counter-increment:toc}
.toc a{display:grid;grid-template-columns:34px 1fr;align-items:start;padding:10px 0;border-top:1px solid var(--line);font-size:13px;line-height:1.6;transition:color .3s,padding .4s var(--ease)}
.toc a::before{content:counter(toc,decimal-leading-zero);font-size:11px;font-weight:700;color:var(--muted);padding-top:2px}
.toc a:hover{color:var(--blue);padding-left:6px}
.toc a.is-active{color:var(--ink);font-weight:600}
.toc a.is-active::before{color:var(--blue)}
.toc-side{display:block}
.toc-inline{display:none}
.article-body{margin-top:10px}
.article-body h2{display:flex;align-items:flex-start;gap:16px;margin:clamp(50px,5vw,72px) 0 24px;padding-bottom:18px;border-bottom:1px solid var(--ink);font-size:clamp(22px,2.2vw,30px);line-height:1.5;font-family:var(--font-jp);font-weight:600;letter-spacing:-.01em;position:relative}
.article-body h2::after{content:"";position:absolute;left:0;bottom:-1px;width:80px;height:3px;background:linear-gradient(90deg,var(--cyan),var(--lime))}
.article-body h2 span{flex-shrink:0;font-size:12px;font-weight:700;padding:6px 10px;border-radius:8px;background:var(--ink);color:var(--lime);font-family:var(--font-en);margin-top:4px}
.article-body h3{margin:36px 0 14px;padding-left:16px;border-left:3px solid var(--blue);font-size:18px;font-family:var(--font-jp)}
.article-body p{font-size:14px;line-height:2.2;color:#454a43;margin:0 0 1.4em}
.article-body strong{background:linear-gradient(transparent 62%,rgba(216,255,123,.8) 62%)}
.point-box{margin:30px 0;padding:24px 26px;border-radius:20px;background:linear-gradient(135deg,rgba(169,245,239,.4),rgba(207,193,255,.35))}
.point-title{display:flex;align-items:center;gap:8px;font-size:11px!important;letter-spacing:.18em;font-weight:700;margin:0 0 8px!important;color:var(--ink)!important}
.point-box p:last-child{margin:0}
.article-figure{margin:24px 0 10px}
.article-figure img{width:100%;border-radius:20px;aspect-ratio:16/9;object-fit:cover}
.article-figure figcaption{margin-top:10px;font-size:11px;color:var(--muted)}
.article-table{width:100%;border-collapse:collapse;margin:30px 0;font-size:13px}
.article-table th,.article-table td{padding:14px 16px;border:1px solid var(--line);text-align:left;line-height:1.7}
.article-table thead th{background:var(--ink);color:#fff;font-weight:600;font-size:12px;border-color:var(--ink)}
.article-table tbody tr:nth-child(even) td{background:#fff}
.article-check{margin:10px 0 30px}
.article-check li{display:flex;gap:14px;padding:18px 0;border-top:1px solid var(--line);font-size:13px;line-height:1.8;color:#555b52}
.article-check li:last-child{border-bottom:1px solid var(--line)}
.article-check svg{font-size:22px;color:#3fb6a8;flex-shrink:0;margin-top:2px}
.article-check b{display:block;color:var(--ink);font-size:15px;font-family:var(--font-jp)}
.article-quote{margin:40px 0;padding:30px;border-radius:24px;background:var(--ink);color:#fff;position:relative}
.article-quote::before{content:"“";position:absolute;right:24px;top:-10px;font-size:110px;line-height:1;color:var(--lime);font-family:Georgia,serif}
.article-quote p{color:#e7ebe5!important;margin:0 0 18px!important;font-size:14px!important}
.article-quote cite{display:flex;align-items:center;gap:12px;font-style:normal;font-size:12px;color:#aeb4aa}
.q-avatar{width:42px;height:42px;border-radius:50%;background:#555 center/cover}
.article-cta{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:44px;padding:26px 28px;border-radius:24px;background:#fff;border:1px solid var(--line)}
.article-cta small{font-size:9px;letter-spacing:.18em;color:var(--blue);font-weight:700}
.article-cta p{margin:6px 0 0!important;font-size:16px!important;font-weight:600;color:var(--ink)!important;font-family:var(--font-jp)}
.article-share{display:flex;align-items:center;gap:10px;margin-top:50px;padding:22px 0;border-block:1px solid var(--line)}
.article-share>span{font-size:10px;letter-spacing:.2em;font-weight:700;margin-right:8px}
.article-share a,.article-share button{height:44px;min-width:44px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:#fff;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:700;cursor:pointer;transition:background .35s,color .35s,border-color .35s,transform .45s var(--ease)}
.article-share a:hover,.article-share button:hover{background:var(--ink);color:#fff;border-color:var(--ink);transform:translateY(-3px)}
.article-share button em{font-style:normal;font-size:11px;font-weight:600}
.article-share button.is-copied{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.author-box{display:flex;gap:22px;align-items:center;margin-top:30px;padding:26px;border-radius:24px;background:var(--bg-2)}
.author-img{width:84px;height:84px;flex-shrink:0;border-radius:50%;background:#888 center/cover}
.author-box small{font-size:9px;letter-spacing:.18em;color:var(--muted);font-weight:700}
.author-box b{display:block;margin:4px 0 6px;font-size:15px;font-family:var(--font-jp)}
.author-box p{margin:0;font-size:12px;line-height:1.8;color:#5a6058}
.post-nav{display:grid;grid-template-columns:1fr 64px 1fr;gap:12px;margin-top:40px;align-items:stretch}
.post-nav>a:not(.post-list){padding:20px 22px;border-radius:20px;border:1px solid var(--line);background:#fff;transition:background .45s var(--ease),color .45s,border-color .45s}
.post-nav>a:not(.post-list):hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.post-nav small{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.18em;font-weight:700;color:var(--muted)}
.post-prev small svg{transform:rotate(180deg)}
.post-next{text-align:right}
.post-next small{justify-content:flex-end}
.post-nav span{display:block;margin-top:8px;font-size:13px;line-height:1.6;font-weight:600}
.post-list{border-radius:20px;background:var(--ink);display:grid;grid-template-columns:repeat(2,8px);gap:6px;place-content:center;transition:transform .5s var(--ease),background .4s}
.post-list i{width:8px;height:8px;border-radius:2px;background:var(--lime);transition:transform .5s var(--ease)}
.post-list:hover{transform:rotate(45deg);background:var(--blue)}
.article-aside{position:sticky;top:calc(var(--header) + 24px);display:flex;flex-direction:column;gap:18px}
.aside-block{padding:22px 24px;border-radius:22px;background:#fff;border:1px solid var(--line)}
.aside-title{margin:0 0 10px;font-size:10px;letter-spacing:.2em;font-weight:700}
.aside-cats a{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line);font-size:13px;transition:padding .4s var(--ease)}
.aside-cats a:hover{padding-left:6px}
.aside-cats b{margin-left:auto;font-size:11px;color:var(--muted)}
.aside-recent a{display:grid;grid-template-columns:70px 1fr;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line);font-size:12px;line-height:1.6;font-weight:500}
.ar-img{aspect-ratio:1;border-radius:12px;background:#ccc center/cover;transition:border-radius .5s var(--ease)}
.aside-recent a:hover .ar-img{border-radius:50%}
.aside-recent a:hover{color:var(--blue)}
.aside-recent time{display:block;font-size:10px;color:var(--muted);letter-spacing:.06em}
.aside-reserve{position:relative;display:block;padding:24px;border-radius:22px;background:linear-gradient(135deg,#9ef5ec,#d3c3ff);overflow:hidden;transition:transform .5s var(--ease)}
.aside-reserve:hover{transform:translateY(-4px)}
.ar-icon{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;font-size:22px;background:var(--ink);color:var(--lime);margin-bottom:24px}
.aside-reserve small{display:block;font-size:9px;letter-spacing:.18em;font-weight:700}
.aside-reserve b{font-size:18px;font-family:var(--font-jp)}
.aside-reserve>i{position:absolute;right:20px;top:20px;width:40px;height:40px;border-radius:50%;border:1px solid var(--ink);display:grid;place-items:center;font-size:15px;transition:transform .5s var(--ease)}
.aside-reserve:hover>i{transform:rotate(45deg)}

@media (max-width:1180px){
  .article-layout{grid-template-columns:1fr}
  .article-aside{position:static;display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .toc-side{display:none}
  .toc-inline{display:block;margin-bottom:10px}
}
@media (max-width:980px){
  .news-pickup{grid-template-columns:1fr}
  .pickup-img{min-height:0;aspect-ratio:16/10}
  .news-grid{grid-template-columns:repeat(2,1fr)}
  .subhero-article{min-height:0}
}
@media (max-width:640px){
  .news-grid{grid-template-columns:1fr}
  .news-toolbar{flex-direction:column;align-items:flex-start}
  .news-tabs{flex-wrap:nowrap;overflow-x:auto;width:100%;scrollbar-width:none}
  .pager a,.pager span{min-width:40px;height:40px}
  .article-aside{grid-template-columns:1fr}
  .article-lead{font-size:14px}
  .article-table{display:block;overflow-x:auto;white-space:nowrap}
  .author-box{flex-direction:column;align-items:flex-start}
  .post-nav{grid-template-columns:1fr 1fr}
  .post-list{display:none}
  .article-share{flex-wrap:wrap}
}