:root{
  --bg:#ffffff; --ink:#1d1d1f; --muted:#6e6e73; --line:#e8eaed; --gray50:#f5f5f7;
  --dark:#07160e; --dark-ink:#f2f7f3; --dark-muted:#9fb3a6; --dark-line:#1b3324;
  --brand:#007a00; --brand-light:#38b000;
  --wrap:1080px; --gutter:24px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:clip;background:var(--bg);color:var(--ink);
  font-family:"Inter","Noto Sans JP",-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans CJK JP",sans-serif;
  font-size:17px;line-height:1.75;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.lang-ja{font-feature-settings:"palt" 1;letter-spacing:.01em}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.narrow{max-width:720px}

/* nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.9);
  -webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(0,0,0,.06)}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter);height:52px;display:flex;align-items:center;gap:24px}
.brand img{height:22px;width:auto}
.links{display:flex;gap:22px;margin-left:auto;font-size:13px}
.links a,.switch{text-decoration:none;color:var(--ink);opacity:.8}
.links a:hover,.switch:hover{opacity:1}
.switch{font-size:12px;font-weight:600;border:1px solid var(--line);border-radius:999px;padding:3px 10px}
@media (max-width:760px){.links{display:none}.switch{margin-left:auto}}

/* hero */
.hero{min-height:calc(100svh - 52px);display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.hero-in{padding-top:40px;padding-bottom:96px;will-change:transform,opacity}
.kicker{font-size:15px;font-weight:600;color:var(--brand);margin:0 0 18px;letter-spacing:.02em}
.hero-h{margin:0;font-weight:700;letter-spacing:-.02em;line-height:1.12;font-size:clamp(28px,7.2vw,88px)}
.lang-ja .hero-h{letter-spacing:-.01em;line-height:1.2;font-size:clamp(30px,7.2vw,80px)}
.hero-h .line{display:block;overflow:hidden}
.hero-h .line>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--ease)}
.hero.on .hero-h .line>span{transform:none}
.hero.on .hero-h .line:nth-child(2)>span{transition-delay:.12s}
.lead{max-width:34em;font-size:clamp(17px,2vw,21px);color:var(--muted);margin:32px 0 0;line-height:1.7}
.cue{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;
  font-size:12px;color:var(--muted);text-decoration:none}
.cue i{width:1px;height:36px;background:linear-gradient(var(--muted),transparent);animation:cue 2s infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* sections */
.sec{padding:clamp(96px,14vw,168px) 0}
.light{background:var(--bg)}
.gray{background:var(--gray50)}
.dark{background:var(--dark);color:var(--dark-ink)}
.dark .label,.dark .intro,.dark p{color:var(--dark-muted)}
.dark h2,.dark h3{color:var(--dark-ink)}
.label{font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--muted);margin:0 0 14px}
h2{font-size:clamp(30px,5.4vw,56px);line-height:1.15;letter-spacing:-.015em;margin:0 0 28px;font-weight:700}
h3{font-size:19px;line-height:1.4;margin:0 0 6px;font-weight:600}
.intro{max-width:36em;font-size:19px;color:var(--muted);margin:0 0 56px}
.body p{max-width:36em;font-size:19px;margin:0 0 1em}

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

/* facts */
.facts{list-style:none;padding:0;margin:72px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:32px;border-top:1px solid var(--line);padding-top:40px}
.fact{display:grid;grid-template-columns:auto 1fr;align-items:baseline;column-gap:4px}
.num{font-size:clamp(56px,8vw,96px);font-weight:700;letter-spacing:-.03em;line-height:1;color:var(--brand);font-variant-numeric:tabular-nums}
.unit{font-size:20px;font-weight:600}
.flabel{grid-column:1/-1;font-size:14px;color:var(--muted);margin-top:10px;line-height:1.6}
@media (max-width:760px){.facts{grid-template-columns:1fr;gap:28px}}

/* how */
.how{display:grid;grid-template-columns:5fr 6fr;gap:64px}
.how-sticky{position:sticky;top:120px;align-self:start}
.meter{height:2px;background:var(--dark-line);margin-top:24px;max-width:280px;border-radius:2px;overflow:hidden}
.meter i{display:block;height:100%;width:0;background:var(--brand-light);transition:width .4s var(--ease)}
.steps{list-style:none;margin:0;padding:0}
.step{padding:56px 0;border-top:1px solid var(--dark-line);opacity:.28;transition:opacity .6s var(--ease)}
.step:first-child{border-top:0;padding-top:0}
.step.active{opacity:1}
.sn{display:block;font-size:13px;font-weight:600;color:var(--brand-light);margin-bottom:10px;letter-spacing:.06em}
.step h3{font-size:clamp(24px,3vw,32px);margin-bottom:12px}
.step p{font-size:18px;margin:0;max-width:28em}
@media (max-width:860px){.how{grid-template-columns:1fr;gap:24px}.how-sticky{position:static}.step{opacity:1;padding:36px 0}}

/* timeline */
.timeline{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.t-item{display:grid;grid-template-columns:140px 1fr;gap:24px;padding:28px 0;border-bottom:1px solid var(--line)}
.ty{font-size:14px;color:var(--muted);font-variant-numeric:tabular-nums;padding-top:3px}
.t-item p{margin:0;color:var(--muted);font-size:16px}
.t-item .role{color:var(--ink);font-size:15px;margin-bottom:4px}
.talk{margin:40px 0 0;font-size:15px;color:var(--muted)}
@media (max-width:640px){.t-item{grid-template-columns:1fr;gap:4px}}

/* offer */
.grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:#fff;border-radius:18px;padding:28px 26px}
.card p{margin:0;color:var(--muted);font-size:15px}
.forms{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;border-top:1px solid var(--line);padding-top:32px}
.forms p{margin:0;color:var(--muted);font-size:15px}
.cta-row{margin:48px 0 0}
.btn{display:inline-block;background:var(--brand);color:#fff;text-decoration:none;font-weight:600;font-size:17px;padding:14px 26px;border-radius:999px;transition:background .2s}
.btn:hover{background:#006400}
@media (max-width:860px){.grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.grid,.forms{grid-template-columns:1fr}}

/* next */
.ngrid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.ncard{background:var(--gray50);border-radius:22px;overflow:hidden;display:flex;flex-direction:column}
.ncard.wide{grid-column:1/-1}
.ntext{padding:30px 28px 32px}
.ntext p{margin:0;color:var(--muted);font-size:16px}
.badge{display:inline-block;font-size:12px;font-weight:600;color:var(--brand);border:1px solid rgba(0,122,0,.35);border-radius:999px;padding:2px 10px;margin-bottom:14px}
.more{display:inline-block;margin-top:14px;font-size:16px;font-weight:500;color:var(--brand);text-decoration:none}
.more:hover{text-decoration:underline}
.nimg{margin:0;position:relative}
.nimg img{width:100%;aspect-ratio:16/8;object-fit:cover}
.nimg figcaption{position:absolute;left:16px;bottom:12px;font-size:12px;color:#fff;background:rgba(0,0,0,.45);padding:3px 10px;border-radius:999px}
@media (max-width:760px){.ngrid{grid-template-columns:1fr}}

/* lab */
.big-links{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.big-link{display:flex;flex-direction:column;justify-content:space-between;min-height:180px;padding:28px;border:1px solid var(--dark-line);border-radius:22px;text-decoration:none;transition:border-color .3s,background .3s}
.big-link span{font-size:clamp(36px,5vw,56px);font-weight:700;letter-spacing:-.02em;color:var(--dark-ink)}
.big-link small{font-size:14px;color:var(--dark-muted)}
.big-link:hover{border-color:var(--brand-light);background:#0b0b0c}
@media (max-width:560px){.big-links{grid-template-columns:1fr}}

/* profile */
.prof{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:start}
.portrait{margin:0;border-radius:22px;overflow:hidden;position:sticky;top:96px}
.pname{font-size:24px;font-weight:700;margin:0}
.pname span{display:block;font-size:14px;font-weight:500;color:var(--muted);margin-top:2px}
.prole{font-size:15px;color:var(--muted);margin:6px 0 32px}
.bio{font-size:16px;color:var(--muted)}
.future{font-size:21px;font-weight:600;margin:32px 0 0;line-height:1.5}
@media (max-width:860px){.prof{grid-template-columns:1fr;gap:32px}.portrait{position:static;max-width:420px}}

/* contact */
.co{display:grid;grid-template-columns:9em 1fr;margin:64px 0 0;border-top:1px solid var(--line);font-size:16px}
.co dt,.co dd{margin:0;padding:14px 0;border-bottom:1px solid var(--line)}
.co dt{color:var(--muted)}
@media (max-width:560px){.co{grid-template-columns:1fr}.co dt{border-bottom:0;padding-bottom:0}.co dd{padding-top:2px}}

/* sub */
.sub{padding-top:96px}
.sub-h{font-size:clamp(32px,5vw,48px);margin:0 0 40px}

/* footer */
.foot{border-top:1px solid var(--line);background:var(--gray50);font-size:12px;color:var(--muted)}
.foot-in{display:flex;justify-content:space-between;gap:16px;padding-top:22px;padding-bottom:28px;flex-wrap:wrap}
.foot-links{display:flex;gap:18px}
.foot a{text-decoration:none;color:var(--muted)}
.foot a:hover{color:var(--ink)}

@media (max-width:480px){
  body{font-size:16px}
  .intro,.body p{font-size:17px}
  .wrap{padding:0 16px}.nav-in{padding:0 16px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .hero-h .line>span{transform:none;transition:none}
  .cue i{animation:none}
  .step{opacity:1}
}

/* ===== motion layer v2.1 ===== */
.hero-in{transform:translateY(calc(var(--sy,0) * .18px)) scale(calc(1 - var(--hp,0) * .06));opacity:calc(1 - var(--hp,0) * 1.1);transform-origin:50% 60%}
.hero{background:
  radial-gradient(60% 50% at 80% 20%, rgba(0,122,0,.07), transparent 70%),
  radial-gradient(50% 40% at 10% 90%, rgba(56,176,0,.06), transparent 70%), #fff}

/* kinetic band */
.band{overflow:hidden;background:var(--brand);color:#fff;transform:rotate(-3deg) scale(1.08);margin:-20px 0 -10px;position:relative;z-index:2}
.band-in{white-space:nowrap;padding:14px 0;font-weight:700;font-size:clamp(18px,3.2vw,30px);letter-spacing:.04em}
.band-in span{display:inline-block;transform:translateX(calc(var(--bx,0) * -1px));will-change:transform}

/* facts: typographic numbers */
.facts{list-style:none;padding:48px 0 0;margin:64px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:40px 32px;border-top:1px solid var(--line)}
.fact{display:flex;flex-direction:column;align-items:flex-start;position:relative}
.numwrap{display:inline-flex;align-items:baseline;gap:6px;line-height:.9}
.num{font-size:clamp(88px,11vw,136px);font-weight:700;letter-spacing:-.05em;color:var(--brand);font-variant-numeric:tabular-nums;line-height:.9}
.unit{font-size:clamp(16px,2vw,22px);font-weight:600;color:var(--ink)}
.flabel{font-size:15px;color:var(--muted);margin-top:16px;line-height:1.6;max-width:16em;border-top:1px solid var(--line);padding-top:12px}
@media (max-width:760px){.facts{grid-template-columns:1fr;gap:28px;padding-top:36px}.fact{flex-direction:row;align-items:baseline;gap:14px}.numwrap{flex:none;width:118px;gap:8px}.num{font-size:84px}.unit{font-size:15px}.flabel{margin-top:0;border-top:0;padding-top:0;max-width:none;flex:1;font-size:15px}}

/* timeline draw */
.tl-wrap{position:relative;padding-left:28px}
.tl-line{position:absolute;left:0;top:0;width:2px;height:calc(var(--tp,0) * 100%);background:linear-gradient(var(--brand-light),var(--brand));border-radius:2px;transition:height .25s linear}
.tl-wrap .timeline{border-top:0}
.t-item{position:relative;transition:opacity .5s var(--ease),transform .5s var(--ease)}
.t-item::before{content:"";position:absolute;left:-33px;top:36px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--line);transition:border-color .4s,background .4s}
.t-item.lit::before{border-color:var(--brand);background:var(--brand)}
.t-item:not(.lit){opacity:.45}
@media (max-width:640px){.tl-wrap{padding-left:22px}.t-item::before{left:-27px;top:30px}}

/* how meter scroll-linked */
.meter i{width:calc(var(--mp,0) * 100%);transition:none}
.dark{background:
  radial-gradient(70% 60% at 100% 0%, rgba(56,176,0,.14), transparent 60%),
  radial-gradient(60% 50% at 0% 100%, rgba(0,122,0,.12), transparent 60%), var(--dark)}

/* zoom on scroll */
[data-zoom]{overflow:hidden}
[data-zoom] img{transform:scale(calc(1.18 - var(--zp,0) * .18));transform-origin:50% 40%;will-change:transform}
.portrait img{filter:none}
.portrait{border-radius:0;background:#fff}

/* offer card lift */
.card{transition:opacity .9s var(--ease),transform .9s var(--ease),box-shadow .5s var(--ease)}
.card.in:hover{transform:translateY(-4px)}

/* staggered reveal */
.grid .card:nth-child(2),.ngrid .ncard:nth-child(2){transition-delay:.08s}
.grid .card:nth-child(3),.ngrid .ncard:nth-child(3){transition-delay:.16s}
.grid .card:nth-child(4),.ngrid .ncard:nth-child(4){transition-delay:.24s}
.grid .card:nth-child(5),.ngrid .ncard:nth-child(5){transition-delay:.32s}
.reveal{transform:translateY(36px) scale(.985)}
.reveal.in{transform:none}

@media (prefers-reduced-motion:reduce){
  .hero-in,[data-zoom] img,.band-in span{transform:none!important;opacity:1!important}
  .ring .arc{stroke-dashoffset:0}
  .tl-line{height:100%}.t-item:not(.lit){opacity:1}
}

/* ===== v2.2 diagrams ===== */
/* org diagram */
.org{margin:56px 0 0;max-width:460px}
.org svg{overflow:visible}
.org svg{width:100%;height:auto;display:block;font-family:inherit}
.org .o-link{stroke:var(--line);stroke-width:1.5;stroke-dasharray:140;stroke-dashoffset:140;transition:stroke-dashoffset 1s var(--ease)}
.org.in .o-link{stroke-dashoffset:0}
.org .o-node rect{fill:#fff;stroke:var(--brand);stroke-width:1.5;opacity:0;transform-origin:center;transform:scale(.9);transition:opacity .6s var(--ease),transform .6s var(--ease);transition-delay:calc(.5s + var(--i) * .12s)}
.org.in .o-node rect{opacity:1;transform:none}
.org .o-node text{font-size:13px;font-weight:600;fill:var(--ink);text-anchor:middle;opacity:0;transition:opacity .6s;transition-delay:calc(.7s + var(--i) * .12s)}
.org .o-node .o-ai{font-size:10px;font-weight:700;fill:var(--brand);letter-spacing:.08em;text-anchor:middle}
.org.in .o-node text{opacity:1}
.org .o-center circle{fill:var(--brand)}
.org .o-center text{font-size:14px;font-weight:700;fill:#fff;text-anchor:middle}
.org figcaption{font-size:14px;color:var(--muted);margin-top:4px}

/* breakdown bar */
.bar{margin:0 0 64px}
.bar-t{font-size:13px;font-weight:600;color:var(--muted);margin:0 0 12px;letter-spacing:.04em}
.bar-track{display:flex;height:14px;border-radius:999px;overflow:hidden;background:var(--line);gap:2px}
.bar-track i{display:block;width:0;background:color-mix(in srgb, var(--brand) calc(100% - var(--i) * 13%), #bfe3bf);transition:width 1.1s var(--ease);transition-delay:calc(var(--i) * .1s)}
.bar.in .bar-track i{width:var(--w)}
.bar-legend{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13px;color:var(--muted)}
.bar-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px;background:color-mix(in srgb, var(--brand) calc(100% - var(--i) * 13%), #bfe3bf)}
.bar-legend span{margin-left:4px;color:var(--ink);font-variant-numeric:tabular-nums}

/* scroll timeline（巻物） */
.scroll-tl{position:relative;padding-left:84px;margin-top:8px;padding-bottom:28px}
.tl-rail{position:absolute;left:60px;top:0;bottom:0;width:2px;background:var(--line)}
.tl-line{position:absolute;left:60px;top:0;width:2px;height:calc(var(--tp,0) * 100%);background:var(--brand);border-radius:2px}
.scroll-tl .timeline{list-style:none;margin:0;padding:0;border:0}
.scroll-tl .t-item{display:block;position:relative;border:0;padding:0 0 8px;min-height:calc(var(--yrs) * 30px);grid-template-columns:none}
.scroll-tl .t-item::before{content:"";position:absolute;left:-30px;top:6px;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--line);transition:border-color .4s,background .4s,transform .4s}
.scroll-tl .t-item.lit::before{border-color:var(--brand);background:var(--brand);transform:scale(1.15)}
.scroll-tl .t-item:not(.lit){opacity:.4}
.tick{position:absolute;left:-84px;top:2px;width:48px;text-align:right;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.tick b{font-weight:600;color:var(--ink)}
.tick-end{top:auto;bottom:-10px;left:0}
.tick-end::after{content:"";position:absolute;right:-19px;top:2px;width:14px;height:14px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px rgba(0,122,0,.15)}
.t-body{padding-top:0}
.t-body .ty{display:block;margin-bottom:2px}
.t-body h3{margin-bottom:4px}
@media (max-width:640px){.scroll-tl{padding-left:68px}.tl-rail,.tl-line{left:48px}.tick{left:-68px;width:38px;font-size:11px}.scroll-tl .t-item::before{left:-26px}.tick-end{left:0}.tick-end::after{right:-17px}}

/* loop diagram */
.loop{width:min(100%,300px);height:auto;display:block;margin-top:28px;font-family:inherit;overflow:visible}
.l-rail{fill:none;stroke:var(--dark-line);stroke-width:2}
.l-prog{fill:none;stroke:var(--brand-light);stroke-width:3;stroke-linecap:round;stroke-dasharray:var(--c);stroke-dashoffset:calc(var(--c) * (1 - var(--mp,0)));transform:rotate(-90deg);transform-origin:150px 150px}
.l-arrow{fill:var(--dark-line)}
.l-node circle{fill:var(--dark);stroke:var(--dark-line);stroke-width:2;transition:stroke .4s,fill .4s}
.l-node text{font-size:12px;font-weight:600;fill:var(--dark-muted);text-anchor:middle;transition:fill .4s}
.l-node.active circle{stroke:var(--brand-light);fill:#0e2a1a}
.l-node.active text{fill:#fff}
@media (max-width:860px){.loop{margin:12px auto 0}}
@media (prefers-reduced-motion:reduce){.org .o-link{stroke-dashoffset:0}.org .o-node rect,.org .o-node text{opacity:1;transform:none}.bar .bar-track i{width:var(--w)}.scroll-tl .t-item:not(.lit){opacity:1}}

/* father: editorial still, no frame/card */
.father{position:relative;margin:44px 0;border-radius:26px;overflow:hidden;background:#04100a}
.father img{display:block;width:100%;height:auto}
.father::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,16,10,0) 38%,rgba(4,16,10,.88) 100%)}
.father figcaption{position:absolute;left:22px;right:22px;bottom:20px;z-index:1;color:#fff;display:block}
.father figcaption b{display:block;font-weight:700;font-size:clamp(17px,4.6vw,22px);line-height:1.5}
.father figcaption span{display:block;margin-top:6px;font-size:12px;color:rgba(255,255,255,.72)}

/* keep the tilted band from widening the page (iOS Safari) */
.band-clip{overflow:hidden;position:relative;z-index:2;margin:-20px 0 -10px;padding:20px 0 10px}
.band-clip .band{margin:0}

/* hamburger + section sheet (Apple-like) */
.burger{appearance:none;border:0;background:none;width:40px;height:40px;margin-right:-8px;padding:0;position:relative;cursor:pointer;color:var(--ink)}
.burger i{position:absolute;left:11px;right:11px;height:1.5px;background:currentColor;border-radius:2px;transition:transform .45s var(--ease),top .45s var(--ease)}
.burger i:nth-child(1){top:16px}.burger i:nth-child(2){top:23px}
.menu-open .burger i:nth-child(1){top:19.5px;transform:rotate(45deg)}
.menu-open .burger i:nth-child(2){top:19.5px;transform:rotate(-45deg)}
.switch{margin-left:auto}.links{margin-left:auto}.links+.switch{margin-left:0}
@media (max-width:760px){.links+.switch{margin-left:auto}}
.sheet{position:fixed;inset:52px 0 0 0;z-index:49;background:rgba(255,255,255,.96);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);
  opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility 0s .4s;overflow-y:auto}
.menu-open .sheet{opacity:1;visibility:visible;transition:opacity .4s var(--ease)}
.menu-open{overflow:hidden}
.sheet-in{max-width:var(--wrap);margin:0 auto;padding:28px 16px 48px}
.sheet-list{list-style:none;margin:0;padding:0}
.sheet-list li{border-bottom:1px solid rgba(0,0,0,.06);opacity:0;transform:translateY(-8px);transition:opacity .4s var(--ease),transform .4s var(--ease)}
.menu-open .sheet-list li{opacity:1;transform:none}
.menu-open .sheet-list li:nth-child(2){transition-delay:.03s}.menu-open .sheet-list li:nth-child(3){transition-delay:.06s}.menu-open .sheet-list li:nth-child(4){transition-delay:.09s}
.menu-open .sheet-list li:nth-child(5){transition-delay:.12s}.menu-open .sheet-list li:nth-child(6){transition-delay:.15s}.menu-open .sheet-list li:nth-child(7){transition-delay:.18s}.menu-open .sheet-list li:nth-child(8){transition-delay:.21s}
.sheet-list a{display:flex;align-items:baseline;gap:16px;padding:14px 0;text-decoration:none;color:var(--ink)}
.sheet-list b{font-size:12px;font-weight:600;color:var(--brand);font-variant-numeric:tabular-nums;width:20px}
.sheet-list span{font-size:clamp(22px,6vw,28px);font-weight:700;letter-spacing:-.01em}
.sheet-sub{display:flex;flex-wrap:wrap;gap:20px;margin:28px 0 0;font-size:13px}
.sheet-sub a{color:var(--muted);text-decoration:none}

/* back to top: same taste as the hero cue, reversed */
.cue.up{position:static;transform:none;margin:0 auto;padding:56px 0 28px;width:max-content}
.cue.up i{background:linear-gradient(transparent,var(--muted));animation:cueup 2s infinite}
@keyframes cueup{0%{transform:scaleY(0);transform-origin:bottom}50%{transform:scaleY(1);transform-origin:bottom}51%{transform-origin:top}100%{transform:scaleY(0);transform-origin:top}}
@media (prefers-reduced-motion:reduce){.cue.up i{animation:none}.sheet,.sheet-list li,.burger i{transition:none}}

.num{font-feature-settings:"tnum" 1}
.unit{white-space:nowrap}

@media (max-width:760px){
  .facts{gap:36px}
  .fact{flex-direction:column;align-items:flex-start;gap:10px}
  .numwrap{width:auto;gap:8px}
  .flabel{font-size:15px;color:var(--muted)}
}

/* mobile: cards enter one by one as they come in, same rhythm as the "next" cards */
@media (max-width:760px){.grid .card,.ngrid .ncard,.forms li{transition-delay:0s!important}}
.forms li:nth-child(2){transition-delay:.08s}.forms li:nth-child(3){transition-delay:.16s}

/* contact modal (Apple-like sheet) */
.mail-alt{margin:14px 0 0;font-size:14px}.mail-alt a{color:var(--muted)}
.modal{position:fixed;inset:0;z-index:80;display:flex;align-items:flex-end;justify-content:center;visibility:hidden;transition:visibility 0s .45s}
.modal.open{visibility:visible;transition:none}
.modal-bg{position:absolute;inset:0;background:rgba(7,22,14,.42);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .45s var(--ease)}
.modal.open .modal-bg{opacity:1}
.modal-card{position:relative;width:100%;max-width:560px;max-height:92svh;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#fff;border-radius:22px 22px 0 0;padding:28px 20px calc(28px + env(safe-area-inset-bottom));
  transform:translateY(100%);transition:transform .5s var(--ease)}
.modal.open .modal-card{transform:none}
@media (min-width:700px){.modal{align-items:center}.modal-card{border-radius:22px;padding:40px 40px 36px;transform:translateY(24px) scale(.98);opacity:0;transition:transform .5s var(--ease),opacity .4s var(--ease)}.modal.open .modal-card{opacity:1}}
.modal-x{position:absolute;top:14px;right:14px;width:36px;height:36px;border:0;border-radius:50%;background:var(--gray50);cursor:pointer}
.modal-x i{position:absolute;left:11px;right:11px;top:17.5px;height:1.5px;background:var(--ink)}.modal-x i:first-child{transform:rotate(45deg)}.modal-x i:last-child{transform:rotate(-45deg)}
.cform h2,.cform-done h2{margin:0 0 6px;font-size:26px;letter-spacing:-.01em}
.cform-lead{margin:0 0 22px;color:var(--muted);font-size:15px}
.cform label{display:block;margin:0 0 14px}
.cform label>span{display:block;font-size:13px;font-weight:600;margin:0 0 6px}
.cform input:not([type=checkbox]),.cform select,.cform textarea{width:100%;box-sizing:border-box;font:inherit;font-size:16px;color:var(--ink);background:var(--gray50);border:1px solid transparent;border-radius:12px;padding:12px 14px;appearance:none;-webkit-appearance:none;transition:border-color .2s,background .2s}
.cform select{background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 15px) 52%;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
.cform input:focus,.cform select:focus,.cform textarea:focus{outline:0;border-color:var(--brand);background:#fff}
.cform .bad{border-color:#c0392b!important}
.cform textarea{resize:vertical;min-height:120px}
.cform .agree{display:flex;gap:10px;align-items:flex-start;font-size:14px;margin:18px 0 22px}
.cform .agree input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--brand);flex:none}
.cform .agree span{font-weight:400;font-size:14px;margin:0}
.cform .agree.bad span{color:#c0392b}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.cform-send{width:100%;border:0;cursor:pointer;font:inherit;font-weight:600}
.cform-send[disabled]{opacity:.6}
.cform-err{margin:14px 0 0;font-size:14px;color:#c0392b}
.cform-done{padding:24px 0 8px}.cform-done p{color:var(--muted);margin:0 0 24px}
html.modal-lock{overflow:hidden}
@media (prefers-reduced-motion:reduce){.modal,.modal-bg,.modal-card{transition:none}}

/* subpages: tighter, Apple spec-sheet rows (label | value) also on phones */
.sub{padding-top:56px;padding-bottom:72px}
.sub-h{margin:0 0 28px;line-height:1.2}
.co{margin:0;grid-template-columns:7.5em 1fr!important;font-size:15px}
.co dt,.co dd{padding:16px 0!important;border-bottom:1px solid var(--line)!important;line-height:1.6}
.co dt{padding-right:12px!important}
.sub .body p{font-size:15px;line-height:1.8;margin:0 0 16px}
.sub .more{display:inline-block;margin-top:24px;font-size:15px;text-decoration:none}
/* footer sits at the bottom on short pages */
body{min-height:100svh;display:flex;flex-direction:column}
main{flex:1 0 auto}
/* footer: comfortable tap targets, clear of the Safari toolbar / home indicator */
.foot-in{padding-top:20px;padding-bottom:calc(56px + env(safe-area-inset-bottom));align-items:center;row-gap:8px}
.foot-links{gap:8px}
.foot-links a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px;font-size:13px}
.foot-links a:last-child{margin-right:-10px}
@media (max-width:560px){.foot-in{flex-direction:column-reverse;align-items:flex-start}.foot-links{margin-left:-10px}.foot-links a:last-child{margin-right:0}}

/* ===== v2.19 detail pass ===== */
/* Japanese line breaking: break only between phrases (BudouX <wbr>), no orphans */
.lang-ja{word-break:keep-all;overflow-wrap:break-word;line-break:strict}
p,li,dd,figcaption{text-wrap:pretty}
h1,h2,h3,.hero-h,.sub-h{text-wrap:balance}

/* tap targets ≥44px without changing the look */
.brand{display:inline-flex;align-items:center;min-height:44px}
.switch{position:relative}
.switch::after{content:"";position:absolute;inset:-8px -6px}
.burger{width:44px;height:44px;margin-right:-10px}
.burger i{left:13px;right:13px}.burger i:nth-child(1){top:18px}.burger i:nth-child(2){top:25px}
.menu-open .burger i:nth-child(1),.menu-open .burger i:nth-child(2){top:21.5px}
.sub .more,.mail-alt a,.ncard .more,.ntext a{display:inline-flex;align-items:center;min-height:44px}
.cue{padding-left:10px;padding-right:10px;min-width:44px}

/* ===== v2.19 detail pass — design review fixes ===== */
:root{--r-card:20px;--r-photo:28px;--pad-card:28px}

/* #3 hero aligns to the same left edge as every section */
.hero-in{width:100%;box-sizing:border-box}
/* #22 EN headline: 2 balanced lines on phones */
.lang-en .hero-h{font-size:clamp(26px,6.9vw,80px)}

/* band: tilted ticker (restored at the owner's request), clipped so it never widens the page */

/* #1 #2 image placeholders: never a blank box while loading */
.portrait{background:#eef1ee;aspect-ratio:4/5;border-radius:0}
.portrait img{width:100%;height:100%;object-fit:cover}
.father{background:#2b302c;aspect-ratio:898/680;border-radius:var(--r-photo)}
.father img{width:100%;height:100%;object-fit:cover}
.nimg{background:#dfe6df}

/* #27 #28 one radius, one inner padding for every card */
.card,.ncard,.big-link{border-radius:var(--r-card)}
.card{padding:var(--pad-card)}
.ntext{padding:var(--pad-card)}
.big-link{padding:var(--pad-card)}
.father figcaption{left:var(--pad-card);right:var(--pad-card);bottom:24px}
.nimg figcaption{left:var(--pad-card);bottom:16px}

/* #10 grids without holes: 5 offer cards = 2 + 3 on desktop */
@media (min-width:861px){
  .grid{grid-template-columns:repeat(6,1fr)}
  .grid .card{grid-column:span 2}
  .grid .card:nth-child(-n+2){grid-column:span 3}
}

/* #14 #15 #16 facts: smaller, quiet, full-width rule, optical alignment */
.num{margin-left:-.06em}
.flabel{max-width:none!important}
@media (min-width:761px){.flabel{border-top:1px solid var(--line);padding-top:12px;margin-top:16px;width:100%}}
@media (max-width:760px){.num{font-size:72px!important}.facts{gap:28px!important}.fact{gap:6px!important}}

/* #9 bar: distinguishable steps + legend in a tidy 2/3-column grid */
.bar-track i:nth-child(1),.bar-legend li:nth-child(1) i{background:#0a4f14}
.bar-track i:nth-child(2),.bar-legend li:nth-child(2) i{background:#007A00}
.bar-track i:nth-child(3),.bar-legend li:nth-child(3) i{background:#38b000}
.bar-track i:nth-child(4),.bar-legend li:nth-child(4) i{background:#8fd16a}
.bar-track i:nth-child(5),.bar-legend li:nth-child(5) i{background:#9aa59c}
.bar-track i:nth-child(6),.bar-legend li:nth-child(6) i{background:#cfd6d0}
.bar-legend{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:10px 28px}
@media (max-width:560px){.bar-legend{grid-template-columns:1fr 1fr;gap:10px 16px}}
.bar-legend li{white-space:nowrap}

/* #7 #17 #18 #19 timeline: even spacing, no duplicate year, readable when static */
.scroll-tl{padding-left:40px!important}
.tl-rail,.tl-line{left:6px!important}
.scroll-tl .t-item{min-height:0!important;padding-bottom:40px!important}
.scroll-tl .t-item::before{left:-40px!important}
.scroll-tl .t-item:not(.lit){opacity:.6}
.t-item .role{font-size:16px!important;font-weight:500;color:var(--ink)}
.t-body p:not(.role){font-size:15px;color:var(--muted);max-width:36em}
.tick-end{position:relative;display:block;padding-left:0;margin-left:-40px;font-size:13px;color:var(--brand);font-weight:600}
.tick-end b{display:inline-block;margin-left:40px}
.tick-end::before{content:"";position:absolute;left:0;top:3px;width:14px;height:14px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px rgba(0,122,0,.15)}
.tick-end::after{display:none!important}

/* #5 steps legible when not active */
@media (min-width:861px){.step{opacity:.45}.step.active{opacity:1}}

/* #4 loop: larger nodes, 2-line labels inside */
.l-node text{font-size:12px}
@media (min-width:861px){.loop{width:min(100%,380px)}}  /* #34 */

/* #6 org pills: centered label group */
.org .o-node text{text-anchor:middle}
.org .o-node .o-ai{font-size:10px;font-weight:700;fill:var(--brand);letter-spacing:.08em}

/* #20 desktop: links OR burger, not both */
@media (min-width:761px){.burger{display:none}}
/* #30 language pill aligned with the burger */
.switch{height:30px;display:inline-flex;align-items:center;padding:0 12px;box-sizing:border-box}

/* #29 note / X cards */
.big-link{min-height:0;gap:10px}
.big-link span{display:flex;justify-content:space-between;align-items:flex-start;font-size:clamp(34px,5vw,48px)}
.big-link span i{font-style:normal;font-size:22px;font-weight:500;color:var(--dark-muted);transition:transform .3s var(--ease),color .3s}
.big-link:hover span i{transform:translate(2px,-2px);color:var(--brand-light)}
.big-link em{font-style:normal;font-size:15px;color:var(--dark-ink);opacity:.85}
.big-link small{color:rgba(255,255,255,.62)}

/* #31 one text-link style: green, no underline */
.tlink,.more{color:var(--brand);text-decoration:none;font-weight:500}
.tlink:hover,.more:hover{text-decoration:underline;text-underline-offset:3px}

/* #11 #12 contact table spacing on the home page; back-to-top lives in the footer */
.co-top{margin-top:48px!important}
.foot .cue.up{padding:40px 0 8px}
.foot{border-top:0}

/* #33 subpages share the site's left edge */
.sub .wrap.narrow{max-width:var(--wrap)}
.sub .wrap.narrow>*{max-width:720px}

/* #37 profile: one body size, closing line set apart */
.bio{font-size:17px;color:var(--ink)}
.future{margin-top:40px}
.pname .roman{display:block;font-size:14px;font-weight:500;color:var(--muted);margin-top:2px}
.lang-en .pname .jp{font-feature-settings:"palt" 1;font-family:"Noto Sans JP",sans-serif}

/* #38 footer bottom space only where a home indicator exists */
@media (min-width:561px){.foot-in{padding-bottom:28px}}
.co .tlink{display:inline-block;padding:13px 0;margin:-13px 0}
/* about: text and diagram side by side on desktop (no empty half) */
@media (min-width:861px){
  .about-grid{display:grid;grid-template-columns:6fr 5fr;gap:64px;align-items:center}
  .about-grid .org{margin:0;justify-self:end;width:100%}
}
.pname .jp{display:block;font-size:24px;font-weight:700;color:var(--ink);margin:0;letter-spacing:.01em}
@media (max-width:760px){.nav-in{gap:12px}}
/* father photo: full bleed on phones */
@media (max-width:860px){
  .father{margin-left:calc(-1 * max(16px, env(safe-area-inset-left, 0px)));margin-right:calc(-1 * max(16px, env(safe-area-inset-right, 0px)));border-radius:0;width:auto}
  .father figcaption{left:max(16px, env(safe-area-inset-left, 0px));right:max(16px, env(safe-area-inset-right, 0px))}
}
.numwrap{gap:2px!important}.unit{margin-left:0}

/* hero: living network — one human node, AI nodes around it (ヒトとAIの協働) */
.hero-net{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 46%,transparent 74%);mask-image:linear-gradient(180deg,#000 0%,#000 46%,transparent 74%)}
.hero-in{position:relative;z-index:1}
.hero .cue{z-index:1}
@media (min-width:861px){
  .hero-net{left:42%;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 100%);mask-image:linear-gradient(90deg,transparent 0%,#000 30%,#000 100%)}
}
@media (max-width:860px){.hero{justify-content:flex-end}.hero-in{padding-bottom:120px}}
/* tilted ticker: edge to edge with no visible ends; room for the tilt at any width */
.band-clip{padding:calc(3vw + 10px) 0!important;margin:calc(-3vw - 10px) 0!important}
.band{transform:rotate(-3deg) scale(1.16)!important;transform-origin:50% 50%}
/* hero: title centered vertically, set over the network; a soft light scrim keeps text contrast */
.hero{justify-content:center!important}
.hero-in{padding-top:0!important;padding-bottom:0!important}
.hero-net{left:0!important;-webkit-mask-image:none!important;mask-image:none!important;opacity:.9}
.hero-in::before{content:"";position:absolute;z-index:-1;left:-8%;right:-8%;top:-18%;bottom:-18%;
  background:radial-gradient(closest-side,rgba(255,255,255,.92),rgba(255,255,255,.78) 55%,rgba(255,255,255,0) 100%);pointer-events:none}
@media (min-width:861px){.hero-in::before{right:30%}}
@media (max-width:860px){.hero-in::before{top:-6%;bottom:-6%;left:-4%;right:-4%;background:radial-gradient(closest-side,rgba(255,255,255,.88),rgba(255,255,255,.6) 60%,rgba(255,255,255,0) 100%)}}

/* ticker: the green band is a still, anti-aliased shape (clip-path, no rotation);
   only the text moves, tilted to match */
.band-clip{padding:0!important;margin:-2vw 0 -1vw!important;overflow:hidden}
.band{transform:none!important;background:none!important;position:relative;padding:calc(1.6vw + 12px) 0}
.band::before{content:"";position:absolute;inset:0;background:var(--brand);clip-path:polygon(0 calc(5.24vw + 0px),100% 0,100% calc(100% - 5.24vw),0 100%)}
.band-in{position:relative;transform:rotate(-3deg);transform-origin:50% 50%;width:112%;margin-left:-6%;padding:6px 0!important}

/* climax: green fills the screen (scroll-linked circle), mark lands in the middle */
.poc{position:relative;height:200svh;background:var(--bg)}
.poc-stick{position:sticky;top:0;height:100svh;overflow:hidden;display:grid;place-items:center}
.poc-fill{position:absolute;inset:0;background:var(--brand);clip-path:circle(calc(var(--gp,0) * 75%) at 50% 50%)}
.poc-in{position:relative;width:min(78vw,640px);opacity:calc(var(--gp,0) * 2.2 - 1.2);transform:scale(calc(.92 + var(--gp,0) * .08))}
.poc-in img{width:100%;height:auto;display:block}
@media (prefers-reduced-motion:reduce){.poc{height:100svh}.poc-fill{clip-path:none}.poc-in{opacity:1;transform:none}}
.prole{margin-bottom:16px!important}.bio{margin:0 0 40px;padding-bottom:32px;border-bottom:1px solid var(--line)}
/* page end: no stray white below the footer, tighter close */
html{background:var(--gray50)}
#contact{padding-bottom:24px!important}
.foot .cue.up{padding:24px 0 4px}
.foot .cue.up i{animation:none;background:linear-gradient(transparent,var(--muted));height:32px}
.foot-in{padding-top:12px}
@media (max-width:560px){.foot-in{padding-bottom:calc(32px + env(safe-area-inset-bottom))}}
.lang-en .lead{font-size:clamp(15px,3.9vw,21px)}
.nimg figcaption{top:16px;bottom:auto!important}

/* first view A: diagonal colour wipe on arrival (odd visits) */
.fv-wipe{display:none}
.fv-intro .fv-wipe{display:block;position:fixed;inset:0;z-index:100;pointer-events:none;overflow:hidden}
.fv-wipe i{position:absolute;top:-20%;bottom:-20%;left:-40%;right:-40%;transform:translateX(130%) skewX(-18deg)}
.fv-wipe i:nth-child(1){background:var(--fv1,#FF5A1F);animation:fvw 1.5s cubic-bezier(.7,0,.2,1) forwards}
.fv-wipe i:nth-child(2){background:var(--fv2,#2EA8FF);animation:fvw 1.5s .18s cubic-bezier(.7,0,.2,1) forwards}
.fv-wipe i:nth-child(3){background:var(--brand);animation:fvw3 2.6s .36s cubic-bezier(.7,0,.2,1) forwards}
.fv-wipe img{position:absolute;left:50%;top:50%;width:min(76vw,560px);height:auto;transform:translate(-50%,-50%);opacity:0;animation:fvl 2.6s .6s ease forwards}
@keyframes fvw{0%{transform:translateX(130%) skewX(-18deg)}45%{transform:translateX(0) skewX(-18deg)}100%{transform:translateX(-140%) skewX(-18deg)}}
@keyframes fvw3{0%{transform:translateX(130%) skewX(-18deg)}28%,62%{transform:translateX(0) skewX(-18deg)}100%{transform:translateX(-140%) skewX(-18deg)}}
@keyframes fvl{0%{opacity:0;transform:translate(-50%,-50%) scale(.96)}20%,55%{opacity:1;transform:translate(-50%,-50%)}75%,100%{opacity:0;transform:translate(-50%,-50%) scale(1.04)}}
.fv-intro .hero-h .line>span{transition-delay:2.5s!important}
.fv-intro .hero-h .line:nth-child(2)>span{transition-delay:2.65s!important}
/* first view D: touch the network (even visits) */
.fv-d .hero{touch-action:pan-y;cursor:crosshair}
.fv-hint{display:none}
.fv-d .fv-hint{display:block;position:absolute;left:0;right:0;top:calc(52px + 20px);text-align:center;font-size:13px;font-weight:600;color:var(--brand);margin:0;z-index:2;transition:opacity .5s;animation:fvh 2.4s ease-in-out infinite}
.fv-touched .fv-hint{opacity:0}
@keyframes fvh{50%{opacity:.45}}
@media (prefers-reduced-motion:reduce){.fv-intro .fv-wipe{display:none}.fv-hint{animation:none}}
.fv-d .hero{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
/* facts: proportional digits so the unit sits right against the numeral (tabular "1" left a gap) */
.num{font-variant-numeric:proportional-nums!important;font-feature-settings:"pnum" 1!important;letter-spacing:-.04em}
.numwrap{gap:0!important}
.unit{margin-left:.12em!important}

/* one bracket under every segment: the common thread across industries */
.bar-span{position:relative;margin:10px 0 18px;padding-top:12px;text-align:center;font-size:13px;font-weight:700;color:var(--brand)}
.bar-span::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;border:2px solid var(--brand);border-top:0;border-radius:0 0 6px 6px}
.bar-span span{position:relative;top:-2px;display:inline-block;background:var(--bg);padding:0 8px;margin-top:-20px}

/* green climax: "Proof of Concept | cyborg21" set in type, letters arrive with the scroll */
.poc-in{width:auto!important;opacity:1!important;transform:none!important;display:flex;flex-direction:column;align-items:center;gap:18px;color:#fff;text-align:center;padding:0 24px}
.poc-in p{margin:0;font-family:"Jost","Futura","Avenir Next",sans-serif;line-height:1;white-space:nowrap}
.poc-a{font-weight:500;font-size:clamp(26px,7.4vw,56px);letter-spacing:.01em}
.poc-b{font-weight:600;font-size:clamp(64px,19vw,150px);letter-spacing:-.02em}
.poc-in span{display:inline-block;opacity:0;transform:translateY(.5em) rotateX(70deg);transform-origin:50% 100%}
.poc-bar{display:block;width:clamp(48px,14vw,96px);height:3px;background:#fff;border-radius:2px;transform:scaleX(0)}
@media (min-width:861px){.poc-in{flex-direction:row;align-items:baseline;gap:32px}.poc-bar{width:3px;height:.9em;align-self:center;font-size:clamp(64px,10vw,130px);transform:scaleY(0)}.poc-b{font-size:clamp(64px,10vw,130px)}.poc-a{font-size:clamp(32px,4vw,56px)}}
@media (prefers-reduced-motion:reduce){.poc-in span{opacity:1;transform:none}.poc-bar{transform:none}}
/* splash word */
.fv-word{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:600 clamp(64px,19vw,150px)/1 "Jost","Futura","Avenir Next",sans-serif;color:#fff;letter-spacing:-.02em;white-space:nowrap}
.fv-word span{display:inline-block;opacity:0;animation:fvch 2.2s calc(.75s + var(--i) * .05s) cubic-bezier(.2,.8,.2,1) forwards}
@keyframes fvch{0%{opacity:0;transform:translateY(.4em)}25%,70%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-.2em)}}
.brand-word{font:600 22px/1 "Jost","Futura","Avenir Next",sans-serif;color:var(--brand);letter-spacing:-.01em}
.brand{text-decoration:none}
/* facts on phones: three columns side by side, no empty right half */
@media (max-width:760px){
  .facts{grid-template-columns:repeat(3,1fr)!important;gap:0 14px!important;padding-top:32px!important}
  .fact{flex-direction:column!important;align-items:flex-start!important;gap:8px!important;padding-right:4px;border-left:0}
  .fact+.fact{border-left:1px solid var(--line);padding-left:14px;margin-left:-14px}
  .num{font-size:clamp(56px,17vw,72px)!important}
  .unit{font-size:14px!important}
  .flabel{font-size:12.5px!important;line-height:1.55!important;margin-top:4px!important}
}
.poc{height:180svh!important}
.poc-fill{clip-path:circle(calc(var(--gp,0) * 80%) at 50% 50%)!important}

/* vector wordmark everywhere */
.brand-mark{height:22px;width:auto;display:block}
.fv-word{width:min(70vw,520px)!important;height:auto;font:inherit!important}
.fv-word{animation:fvl 2.6s .6s ease forwards;opacity:0}
/* climax: one line — "Proof of Concept |" is set; the wordmark slides out of the pipe (ease-in) */
.poc-in{flex-direction:row!important;align-items:center!important;flex-wrap:nowrap!important;gap:0!important;white-space:nowrap;padding:0!important}
.poc-a{font:500 clamp(17px,5.1vw,52px)/1 "Jost","Futura","Avenir Next",sans-serif;color:#fff;letter-spacing:.005em}
.poc-pipe{display:block;width:2px;height:clamp(28px,8.4vw,86px);background:#fff;margin:0 clamp(10px,3vw,30px);flex:none}
.poc-clip{display:block;overflow:hidden;flex:none}
.poc-logo{display:block;height:clamp(30px,9.4vw,96px);width:auto;transform:translateX(calc(-105% + 105% * var(--lk,0)))}
@media (prefers-reduced-motion:reduce){.poc-logo{transform:none}}
.poc-in .poc-a,.poc-in .poc-clip{opacity:1!important;transform:none!important;display:block}
.poc-in .poc-logo{width:auto!important;height:clamp(30px,9.4vw,96px)!important;max-width:none!important}.poc-in{justify-content:center!important;width:max-content!important;max-width:100%}

/* case-study button + document modal */
.case-row{margin:20px 0 0}
.case-btn{appearance:none;width:100%;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:18px var(--pad-card);border:0;border-radius:var(--r-card);background:var(--ink);color:#fff;font:600 16px/1.5 inherit;font-family:inherit;text-align:left;cursor:pointer;transition:background .3s}
.case-btn i{font-style:normal;font-size:20px;transition:transform .3s var(--ease)}
.case-btn:hover{background:var(--brand)}.case-btn:hover i{transform:translateX(4px)}
.modal.doc .modal-card{max-width:720px}
@media (min-width:700px){.modal.doc .modal-card{max-height:88vh}}
.case{padding-bottom:8px}
.case-k{margin:0 0 10px;font-size:13px;font-weight:600;color:var(--brand)}
.case h2{margin:0 0 14px;font-size:clamp(24px,6vw,34px);line-height:1.3;text-wrap:balance;padding-right:36px}
.case-lead{margin:0 0 28px;color:var(--muted);font-size:15px;line-height:1.8}
.case section{padding:24px 0;border-top:1px solid var(--line)}
.case h3{margin:0 0 10px;font-size:18px;line-height:1.5}
.case p{margin:0 0 10px;font-size:15px;line-height:1.85}
.cfacts{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.cfacts li{background:var(--gray50);border-radius:14px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.cfacts b{font-size:20px;color:var(--brand);font-variant-numeric:tabular-nums;line-height:1.3}
.cfacts span{font-size:13px;line-height:1.5}
.cfacts small{font-size:11px;color:var(--muted);line-height:1.5}
.cpillars{margin:6px 0 0;padding:0;list-style:none;counter-reset:p}
.cpillars li{counter-increment:p;position:relative;padding:12px 0 4px 40px}
.cpillars li::before{content:counter(p);position:absolute;left:0;top:12px;width:26px;height:26px;border-radius:50%;background:var(--brand);color:#fff;font:700 13px/26px inherit;font-family:inherit;text-align:center}
.cpillars h4{margin:0 0 4px;font-size:16px}
.case-note{margin:8px 0 22px!important;padding:16px;border-radius:14px;background:var(--gray50);font-size:12.5px!important;line-height:1.7!important;color:var(--muted)}
.case-cta{width:100%;text-align:center;box-sizing:border-box}

/* facts on phones: each column centered, bigger numerals, tighter spacing */
@media (max-width:760px){
  .facts{gap:0!important;padding-top:28px!important;margin-top:40px!important}
  .fact{align-items:center!important;text-align:center;padding:0 6px!important;margin:0!important}
  .fact+.fact{padding-left:6px!important;margin-left:0!important}
  .numwrap{justify-content:center}
  .num{font-size:clamp(68px,21vw,88px)!important}
  .flabel{font-size:12.5px!important;line-height:1.6!important;text-align:center}
}
@media (max-width:760px){#about{padding-bottom:72px!important}}
@media (max-width:760px){
  .facts{align-items:stretch!important;padding:40px 0!important}
  .fact{justify-content:center!important;height:100%}
  #about{padding-bottom:0!important}
}
@media (max-width:760px){.fact .flabel{flex:none!important}}
.case-open{border:0;cursor:pointer;font-family:inherit}
.case-row{margin:28px 0 0}
@media (max-width:760px){.fact{justify-content:flex-start!important}.facts{padding:44px 0 48px!important}}

/* section 04 rises over the pinned green climax (card stacking) */
.poc{height:280svh!important;background:var(--brand)}
.poc-stick{transform-origin:50% 40%;will-change:transform}
#how{position:relative;z-index:2;margin-top:-100svh;border-radius:28px 28px 0 0;box-shadow:0 -24px 60px rgba(0,0,0,.25)}
@media (prefers-reduced-motion:reduce){#how{margin-top:0;border-radius:0}.poc{height:100svh!important}}

/* fact labels as bullet lists, left-aligned; the list block sits centered under its numeral */
.fl-list{list-style:none;padding:0;margin:0}
.fl-list li{position:relative;padding-left:.95em;text-align:left}
.fl-list li::before{content:"";position:absolute;left:0;top:.72em;width:.36em;height:.36em;border-radius:50%;background:var(--brand)}
@media (max-width:760px){.fact .fl-list{display:inline-block;align-self:center;text-align:left!important}}
.fl-list li::before{top:.6em!important}

/* one button size site-wide */
.cta-row .btn{display:inline-flex;align-items:center;justify-content:center;min-width:220px;min-height:52px;padding:0 28px;box-sizing:border-box;font-size:17px}

/* footer: one row — links | copyright; small bottom clearance */
.foot-in{flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:flex-start!important;gap:0!important;padding-top:4px!important;padding-bottom:calc(14px + env(safe-area-inset-bottom))!important;white-space:nowrap}
.foot-links{margin-left:-10px!important;gap:0!important}
.foot-links a{padding:0 10px!important;font-size:12px!important}
.foot-pipe{display:block;width:1px;height:12px;background:var(--line);margin:0 10px 0 2px;flex:none}
.foot-copy{font-size:12px}
@media (max-width:370px){.foot-links a,.foot-copy{font-size:11px!important}.foot-links a{padding:0 7px!important}}
.foot .cue.up{padding:28px 0 0!important}
/* closed modals must never catch taps (the case modal was intercepting the footer / back-to-top) */
.modal:not(.open),.modal:not(.open) *{pointer-events:none!important}
/* facts caption: what the number means */
.fcap{display:block;margin:6px 0 10px;font-size:14px;font-weight:600;line-height:1.45;color:var(--ink);text-align:left;word-break:keep-all}
@media (max-width:760px){.fact .fcap{font-size:12.5px;align-self:center;max-width:100%}}
#about .case-row{margin-top:8px;text-align:center}
/* bridge from the name story to the closing line */
.future-lead{margin:40px 0 0;font-size:15px;line-height:1.7;color:var(--muted)}
.future-lead+.future{margin-top:10px!important}
/* closing quote: poetic, serif, centred both ways */
.quote{margin:0;min-height:72svh;display:flex;align-items:center;justify-content:center;text-align:center;padding:64px 0;position:relative}
.quote p{margin:0;font-family:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;font-weight:500;font-size:clamp(22px,6vw,34px);line-height:1.9;letter-spacing:.06em;color:var(--ink);position:relative;padding:0 .9em}
.quote p::before,.quote p::after{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:2.6em;line-height:1;color:var(--brand);position:absolute}
.quote p::before{content:"\201C";left:-.05em;top:-.45em}
.quote p::after{content:"\201D";right:-.05em;bottom:-.85em}
.lang-en .quote p,html[lang=en] .quote p{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;letter-spacing:.01em;font-size:clamp(25px,6.6vw,38px);line-height:1.5}
.q-line{display:inline-block;transition-delay:var(--d)!important;white-space:nowrap}
.quote p{font-size:clamp(19px,5.2vw,30px)!important;letter-spacing:.04em!important}
.lang-en .quote p,html[lang=en] .quote p{font-size:clamp(20px,5.5vw,34px)!important;letter-spacing:0!important}
.quote .q-line{white-space:nowrap!important}
/* 06 rises over 05 (same transition as 04 over the climax) */
#next{position:sticky;top:var(--nt,0px);z-index:1;transform-origin:50% 100%;will-change:transform}
#lab{position:relative;z-index:2;border-radius:28px 28px 0 0;box-shadow:0 -24px 60px rgba(0,0,0,.22)}
@media (prefers-reduced-motion:reduce){#next{position:relative;top:0}#lab{border-radius:0}}
/* 01: button sits inside the section with breathing room (was touching the next section) */
#about .case-row{margin:8px 0 0!important;padding:0 0 clamp(64px,10vw,96px)}
#about .facts{padding-bottom:40px!important}
/* keep 05's pin inside the 05+06 pair so it never shows over 07 */
.rise-pair{position:relative}
#profile{position:relative;z-index:3}
/* all section buttons centred horizontally */
.cta-row{display:flex!important;justify-content:center!important;text-align:center!important}
/* closing quote: back to the site font (quotes and centring stay) */
.quote p,.lang-en .quote p,html[lang=en] .quote p{font-family:inherit!important;font-style:normal!important;font-weight:600!important;letter-spacing:.02em!important;line-height:1.8!important;font-size:clamp(19px,5.2vw,30px)!important}
.lang-en .quote p,html[lang=en] .quote p{font-size:clamp(17px,4.6vw,30px)!important;letter-spacing:0!important}
@media (max-width:760px){.fact .fcap{min-height:2.9em}}
/* one clearance between a section-ending button and the next section */
:root{--cta-gap:96px}
@media (min-width:761px){:root{--cta-gap:128px}}
.sec:has(> .wrap > .cta-row:last-child){padding-bottom:0!important}
.sec > .wrap > .cta-row:last-child{padding-bottom:var(--cta-gap)!important;margin-bottom:0!important}
#about .case-row{padding-bottom:var(--cta-gap)!important}
/* one clearance above and below every section button, site-wide */
:root{--cta-gap:64px}
@media (min-width:761px){:root{--cta-gap:96px}}
.cta-row,#about .case-row,.case-row{margin:var(--cta-gap) 0 var(--cta-gap)!important;padding:0!important}
.sec > .wrap > .cta-row:last-child,#about .case-row{margin-bottom:0!important;padding-bottom:var(--cta-gap)!important}
.cta-row + *{margin-top:0!important}
#about .facts{padding-bottom:0!important}
/* VSP line: short, so larger */
.quote p{font-size:clamp(24px,6.8vw,44px)!important}
.lang-en .quote p,html[lang=en] .quote p{font-size:clamp(20px,5.4vw,38px)!important}
.lang-en .quote p,html[lang=en] .quote p{font-size:clamp(19px,5.1vw,38px)!important}
/* first view: original crew (one human + four AI) replaces the network */
.hero-net{display:none!important}
.crew{position:absolute;left:50%;bottom:clamp(64px,10svh,110px);width:min(92vw,560px);transform:translateX(-50%);overflow:visible;z-index:0;pointer-events:none}
@media (min-width:861px){.crew{left:auto;right:4vw;bottom:auto;top:50%;transform:translateY(-50%);width:min(42vw,620px)}}
.crew .bob{animation:crew-bob 3.2s ease-in-out infinite;animation-delay:calc(var(--i,2) * -.7s);transform-box:fill-box;transform-origin:50% 100%}
.crew .human .bob{animation-duration:4s}
@keyframes crew-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.crew .lid{animation:crew-blink 4.6s infinite;animation-delay:calc(var(--i,2) * .9s);transform-box:fill-box;transform-origin:50% 50%}
@keyframes crew-blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.1)}}
.crew .eyes{transition:transform .25s ease-out}
.crew .bot,.crew .human{transition:none}
.crew.cheer .bob{animation:crew-hop .5s cubic-bezier(.3,1.6,.5,1) 1;animation-delay:calc(var(--i,2) * .06s)}
@keyframes crew-hop{0%{transform:translateY(0)}40%{transform:translateY(-22px) scale(1.06)}100%{transform:translateY(0)}}
.crew{opacity:0;transition:opacity .8s ease .2s}
.hero.on .crew{opacity:1}
@media (max-width:860px){.hero-in{padding-bottom:clamp(220px,34svh,320px)!important}}
@media (prefers-reduced-motion:reduce){.crew .bob,.crew .lid{animation:none}}
.quote p::before,.quote p::after{color:var(--ink)!important}
@media (max-width:860px){.crew{bottom:clamp(96px,14svh,140px)}.hero-in{padding-bottom:clamp(230px,36svh,330px)!important}}
.crew{z-index:1!important}.hero-in{z-index:2!important}
@media (min-width:861px){.crew{top:auto!important;bottom:13svh!important;transform:none!important;right:4vw!important;width:min(36vw,520px)!important}}
.hero-in::before{display:none!important}
/* quotes: same size as the text, attached to the first and last words */
.quote p{padding:0!important}
.quote p::before,.quote p::after{position:static!important;font-family:inherit!important;font-style:normal!important;font-size:1em!important;line-height:inherit!important;color:var(--ink)!important;display:inline}
.quote p::before{content:"\201C";margin-right:.05em}
.quote p::after{content:"\201D";margin-left:.02em}
.quote .q-line:first-child{margin-left:-.5em}
.quote p::before,.quote p::after{content:none!important}
.quote .q-line:first-child{margin-left:0!important;text-indent:-.5em}
/* pixel crew: two-frame sprites, stepped march like an 8-bit game */
.crew.pix .fb{display:none}
.crew.pix .bob{animation:pix-step .9s steps(1) infinite;animation-delay:calc(var(--i,2) * -.3s)}
@keyframes pix-step{0%{transform:translateY(0)}50%{transform:translateY(-5px)}}
.crew.pix .fa{animation:pix-fa .9s steps(1) infinite;animation-delay:calc(var(--i,2) * -.3s)}
.crew.pix .fb{display:inline;animation:pix-fb .9s steps(1) infinite;animation-delay:calc(var(--i,2) * -.3s)}
@keyframes pix-fa{0%{opacity:1}50%{opacity:0}}
@keyframes pix-fb{0%{opacity:0}50%{opacity:1}}
.crew.pix{animation:pix-march 6s steps(12) infinite alternate}
@keyframes pix-march{0%{translate:-14px 0}100%{translate:14px 0}}
.crew.pix.cheer .bob{animation:crew-hop .5s cubic-bezier(.3,1.6,.5,1) 1;animation-delay:calc(var(--i,2) * .06s)}
@media (prefers-reduced-motion:reduce){.crew.pix,.crew.pix .bob,.crew.pix .fa,.crew.pix .fb{animation:none}.crew.pix .fb{opacity:0}}
/* mosaic portrait */
.crew{display:none!important}
.hero-mosaic{position:absolute;z-index:1;left:50%;transform:translateX(-50%);bottom:clamp(96px,13svh,140px);width:min(78vw,340px);height:min(36svh,340px);pointer-events:none}
@media (min-width:861px){.hero-mosaic{left:auto;transform:none;right:6vw;bottom:10svh;width:min(34vw,460px);height:min(62svh,520px)}}
/* mosaic fills the first view; text sits on top */
.hero-mosaic{left:0!important;right:0!important;top:0!important;bottom:0!important;transform:none!important;width:100%!important;height:100%!important;z-index:0!important}
@media (min-width:861px){.hero-mosaic{left:auto!important;width:62%!important}}
.hero-in{z-index:2!important}
.hero-in::before{display:block!important;content:"";position:absolute;z-index:-1;left:-10%;right:-10%;top:-14%;bottom:-14%;background:radial-gradient(closest-side,rgba(255,255,255,.9),rgba(255,255,255,.7) 60%,rgba(255,255,255,0) 100%);pointer-events:none}
@media (max-width:860px){.hero-in{padding-bottom:0!important}.hero{justify-content:center!important}}
.inlink{display:inline-block;padding-block:12px;margin-block:-12px;word-break:break-all}
/* ===== audit pass 2026-11-01 ===== */
.nw{white-space:nowrap}
/* privacy inline link: plain inline, URL kept whole */
.inlink{display:inline!important;padding:0!important;margin:0!important;word-break:normal!important;overflow-wrap:anywhere}
/* timeline + steps: fully visible when motion is reduced */
@media (prefers-reduced-motion:reduce){.t-item,.scroll-tl .t-item,.step,[data-step]{opacity:1!important}}
/* first view: the tilted band starts below the fold (no green corner peeking) */
.hero{min-height:calc(100svh - 52px + 48px)!important}
/* section-ending button: bottom = the section's own bottom padding */
:root{--sec-pad:96px}
@media (min-width:761px){:root{--sec-pad:168px}}
:root{--cta-gap:var(--sec-pad)}
@media (min-width:761px){:root{--cta-gap:96px}}
.sec > .wrap > .cta-row:last-child,#about .case-row{padding-bottom:var(--sec-pad)!important}
/* modal buttons: same size as page buttons, centred */
.modal .btn,.case-cta{display:flex!important;width:auto!important;min-width:220px;min-height:52px;height:52px;margin:0 auto!important;justify-content:center;align-items:center;padding:0 28px!important;box-sizing:border-box}
.modal form .btn[type=submit]{width:100%!important}
/* modal close stays reachable while scrolling */
.modal-card{position:relative}
.modal-x{position:sticky!important;top:0;float:right;z-index:3;margin:-8px -8px 0 0}
/* 05/06 boundary: no muddy shadow */
#lab{box-shadow:none!important}
/* bucciless card: caption under the image, not on it */
.nimg figcaption{position:static!important;margin-top:10px;background:none!important;color:var(--muted)!important;backdrop-filter:none!important;padding:0!important;font-size:12px}
/* closing quote: own full-width block, standard section rhythm */
#profile .quote{min-height:0!important;padding:var(--sec-pad) 0 0!important;margin:0!important}
#profile{padding-bottom:var(--sec-pad)!important}
.quote p{hanging-punctuation:first last}
/* narrow phones + English: stack the three facts */
@media (max-width:374px){.facts{grid-template-columns:1fr!important}.fact{align-items:flex-start!important;text-align:left}}
@media (max-width:560px){.lang-en .facts,html[lang=en] .facts{grid-template-columns:1fr!important}}
/* footer: 12px minimum, centred on desktop with the pipe visible */
@media (max-width:370px){.foot-links a,.foot-copy{font-size:12px!important}.foot-links a{padding:0 6px!important}.foot-pipe{margin:0 6px 0 0!important}}
@media (min-width:561px){.foot-in{justify-content:center!important}}
.foot-pipe{display:block!important}
/* tap targets */
.switch{min-height:44px;min-width:44px;display:inline-flex!important;align-items:center;justify-content:center;box-sizing:border-box}
.more{display:inline-flex;align-items:center;min-height:44px}
/* diagram labels */
.org text tspan,.org .o-ai{font-size:12px}
/* button clearance: one value above and below every button (phone 96 = section padding; desktop 120) */
:root{--cta-gap:96px}
@media (min-width:761px){:root{--cta-gap:120px}}
.sec > .wrap > .cta-row:last-child,#about .case-row{padding-bottom:var(--cta-gap)!important}
.inlink{white-space:nowrap!important;overflow-wrap:normal!important}
.nimg figcaption{padding:0 var(--pad-card,24px) 4px!important}
/* facts (3 columns): columns sized to their content, spread evenly; dividers drawn at the exact middle of each gap */
@media (min-width:375px){
  .facts{grid-template-columns:repeat(3,max-content)!important;justify-content:space-between!important;position:relative}
  .lang-en .facts,html[lang=en] .facts{grid-template-columns:1fr!important}
  .fact,.fact+.fact{border-left:0!important;padding-left:0!important;margin-left:0!important;padding-right:0!important}
  .facts .fdiv{position:absolute;top:44px;bottom:48px;width:1px;background:var(--line);pointer-events:none}
}
@media (max-width:374px){.facts .fdiv{display:none}}
@media (min-width:375px) and (max-width:760px){
  .facts .fcap{max-width:7.2em;white-space:normal}
  .facts .fl-list li{font-size:13.5px!important}
  .facts .num{letter-spacing:-.02em}
}
@media (min-width:375px) and (max-width:760px){
  .facts .fcap{max-width:none!important;white-space:nowrap}
  .facts .fact{align-items:flex-start!important;text-align:left!important}
  .facts .fact .fl-list{align-self:flex-start!important}
}
/* offer: engagement forms are cards too (same family as the skill cards) */
.forms{border-top:0!important;padding-top:0!important;margin-top:0!important;gap:var(--grid-gap,16px)!important}
.forms .card h3{margin:0 0 8px}
@media (min-width:561px){.forms{grid-template-columns:repeat(3,1fr)!important}}
/* facts: caption left-aligned with its number and bullets */
@media (min-width:375px) and (max-width:760px){.facts .fcap{text-align:left!important;align-self:flex-start!important;margin-left:0!important}}
/* closing quote: vertically centred in its band (equal space above and below) */
#profile{padding-bottom:0!important}
#profile .prof{margin-bottom:0!important;padding-bottom:0!important}
#profile .prof .father{margin-bottom:0!important}
#profile .quote{padding:var(--sec-pad) 0!important}
#profile .quote p{line-height:1.6!important}
/* English (and very narrow phones): facts stacked as rows — number on the left, caption + list on the right, hairline between rows */
@media (max-width:560px){
  .lang-en .facts,html[lang=en] .facts{display:flex!important;flex-direction:column!important;gap:0!important}
  .lang-en .fact,html[lang=en] .fact{display:grid!important;grid-template-columns:120px 1fr!important;column-gap:16px;align-items:start!important;padding:28px 0!important;border-top:1px solid var(--line)!important}
  .lang-en .fact:first-child,html[lang=en] .fact:first-child{border-top:0!important;padding-top:0!important}
  .lang-en .fact .numwrap,html[lang=en] .fact .numwrap{grid-row:1 / span 2}
  .lang-en .fact .fcap,html[lang=en] .fact .fcap{min-height:0!important;margin:6px 0 8px!important}
  .lang-en .facts .fdiv,html[lang=en] .facts .fdiv{display:none}
}
@media (max-width:374px){
  .facts{display:flex!important;flex-direction:column!important;gap:0!important}
  .fact{display:grid!important;grid-template-columns:104px 1fr!important;column-gap:14px;align-items:start!important;padding:24px 0!important;border-top:1px solid var(--line)!important}
  .fact:first-child{border-top:0!important;padding-top:0!important}
  .fact .numwrap{grid-row:1 / span 2}
  .fact .fcap{min-height:0!important;margin:6px 0 8px!important}
}
@media (max-width:560px){
  .lang-en .fact .numwrap,html[lang=en] .fact .numwrap{grid-column:1;justify-self:start}
  .lang-en .fact .fcap,html[lang=en] .fact .fcap,.lang-en .fact .fl-list,html[lang=en] .fact .fl-list{grid-column:2!important;align-self:start!important}
  .lang-en .fact,html[lang=en] .fact{border-left:0!important;margin-left:0!important}
}
@media (max-width:374px){
  .fact .numwrap{grid-column:1;justify-self:start}
  .fact .fcap,.fact .fl-list{grid-column:2!important;align-self:start!important}
  .fact,.fact+.fact{border-left:0!important;margin-left:0!important;padding-left:0!important}
}
/* footer centred at every width */
.foot-in{justify-content:center!important}
.foot-links{margin-left:0!important}
.foot-links a:first-child{padding-left:0!important}
/* father photo: caption sits under the photo (never over the face); name spans stay inline */
.father figcaption{position:static!important;color:var(--ink)!important;padding:16px max(16px, env(safe-area-inset-left, 0px)) 0!important;left:auto!important;right:auto!important;bottom:auto!important}
.father figcaption b{color:var(--ink)!important}
.father figcaption > span{color:var(--muted)!important}
.father::after,.father::before{display:none!important}
.nw,.father figcaption .nw{display:inline!important;margin:0!important;font:inherit!important;color:inherit!important}
@media (min-width:761px){.father figcaption{padding:16px 0 0!important}}
.father{aspect-ratio:auto!important;overflow:visible!important;background:none!important;border-radius:0!important}
.father img{position:static!important;display:block;width:100%!important;height:auto!important;aspect-ratio:898/680;object-fit:cover;border-radius:var(--r-photo)}
@media (max-width:760px){.father img{border-radius:0}}
/* back-to-top: the line flows upward (mirror of the hero's downward cue) */
.foot .cue.up i{animation:cueup 2s infinite!important;height:36px!important;background:linear-gradient(transparent,var(--muted))!important}
@media (prefers-reduced-motion:reduce){.foot .cue.up i{animation:none!important}}
/* facts (3 columns, Japanese): equal columns; each column's block is centred in its column,
   while number / caption / bullets keep one shared left edge inside the block (owner's rule, 2026-11-01) */
@media (min-width:375px){
  .facts{grid-template-columns:repeat(3,minmax(0,1fr))!important;justify-content:stretch!important}
  .fact{display:flex!important;flex-direction:column!important;align-items:center!important}
  .fact .fin{display:flex;flex-direction:column;align-items:flex-start;text-align:left}
  .fact .fin .fcap,.fact .fin .fl-list{align-self:flex-start!important;margin-left:0!important}
}
@media (max-width:560px){.lang-en .fact .fin,html[lang=en] .fact .fin{display:contents}}
@media (max-width:374px){.fact .fin{display:contents}}
@media (min-width:375px){
  .facts > .fact{align-items:center!important}
}
@media (min-width:375px) and (max-width:560px){
  .facts .num{font-size:clamp(60px,18vw,78px)!important}
  .facts .fl-list li{font-size:13px!important}
}
/* father photo: caption ON the photo, over the suit — the crop keeps the face in the upper part (owner, 2026-11-01) */
.father{position:relative!important;overflow:hidden!important;border-radius:var(--r-photo)!important}
.father img{aspect-ratio:4/5!important;object-fit:cover;object-position:50% 28%;border-radius:0!important;filter:sepia(.12) hue-rotate(60deg) saturate(.6)}
.father::after{display:block!important;content:"";position:absolute;left:0;right:0;bottom:0;height:46%;background:linear-gradient(180deg,rgba(4,16,10,0),rgba(4,16,10,.86));pointer-events:none}
.father figcaption{position:absolute!important;left:20px!important;right:20px!important;bottom:20px!important;padding:0!important;z-index:1;color:#fff!important}
.father figcaption b{color:#fff!important}
.father figcaption > span{color:rgba(255,255,255,.75)!important}
@media (max-width:760px){.father{border-radius:0!important}.father figcaption{left:max(16px, env(safe-area-inset-left, 0px))!important;right:max(16px, env(safe-area-inset-right, 0px))!important}}
.father::after{top:auto!important;inset:auto 0 0 0!important;height:52%!important;background:linear-gradient(180deg,rgba(4,16,10,0),rgba(4,16,10,.9) 78%)!important}
.father img{aspect-ratio:449/548!important;object-position:50% 0%!important}
/* facts: number and caption centred in each column; the bullet list is a centred block with left-aligned lines */
@media (min-width:375px){
  .facts > .fact .fin{align-items:center!important;text-align:center}
  .facts > .fact .fin .numwrap{align-self:center!important}
  .facts > .fact .fin .fcap{align-self:center!important;text-align:center!important}
  .facts > .fact .fin .fl-list{align-self:center!important;text-align:left!important}
}
.father img{aspect-ratio:449/476!important;object-position:50% 35%!important}
/* mosaic: always fills the first view box; the canvas re-measures itself */
.hero-mosaic{display:block}
/* first view: the face stays readable — the glow only hugs the text block */
.hero-in::before{left:-4%!important;right:-4%!important;top:-6%!important;bottom:-6%!important;background:radial-gradient(closest-side,rgba(255,255,255,.82),rgba(255,255,255,.55) 65%,rgba(255,255,255,0) 100%)!important}
@media (max-width:860px){.hero{justify-content:flex-end!important}.hero-in{padding-bottom:clamp(110px,16svh,150px)!important}}
.hero .reveal{opacity:1!important;transform:none!important}
@media (min-width:861px){.hero-in::before{right:38%!important}}

/* in-app browsers (LINE etc.): drop the costly effects so scrolling stays smooth */
html.lite .nav,html.lite .sheet,html.lite .modal-bg{-webkit-backdrop-filter:none!important;backdrop-filter:none!important}
html.lite .nav{background:rgba(255,255,255,.98)!important}
html.lite .sheet{background:#fff!important}
html.lite .hero-in,html.lite .poc-stick,html.lite #next,html.lite .band-in span,html.lite [data-zoom] img{will-change:auto}