/* ============================================================
   HIGGS FIELD - SERVICES
   Page stylesheet. Loaded after style.css, on /services only.

   Generated from the standalone design file; scoped to the
   .hf-services wrapper on <main> so the shared navbar and footer
   fragments are untouched. See the scoped-reset note below.

   NOTE: the HEADER and FOOTER sections below are carried over from the
   standalone design and are currently INERT - this page renders the
   shared fragments/navbar.html and fragments/footer.html instead, so no
   .hdr / .ftr / .brand / .burger / .mobile-menu element ever exists.
   They are kept only because --hdr-h (which the hero offset reads) is
   declared alongside them. Safe to delete if that variable survives.
   ============================================================ */

/* ============================================================
   HIGGS FIELD — SERVICES
   Design system: "Institutional Finance × Digital Infrastructure"
   ============================================================ */

:root{
  /* ---- Ink / paper ------------------------------------------------ */
  /* Text palette aliased onto style.css's scale so these pages read
     with the same ink as the rest of the site. --ink is the heading
     colour (style.css --primary); --ink-70 is body copy (--text-main). */
  --ink:        #0F172A;
  --ink-90:     #1E293B;
  --ink-70:     #334155;
  --ink-55:     #64748B;
  --ink-40:     #94A3B8;
  --ink-25:     rgba(148,163,184,.55);
  --rule:       rgba(17,17,17,.14);
  --rule-soft:  rgba(17,17,17,.08);

  --paper:      #F7F7F5;   /* warm white */
  --paper-2:    #F1F1EE;   /* warm white, one step down */
  --white:      #FFFFFF;

  /* ---- Brand accent (existing Higgs field orange) ----------------- */
  --orange:      #F97316;
  --orange-deep: #C2410C;
  --orange-lit:  #FB923C;
  --orange-glow: rgba(249,115,22,.30);
  --orange-dim:  rgba(249,115,22,.10);
  --orange-hair: rgba(249,115,22,.28);
  --grad-accent: linear-gradient(90deg, var(--orange-deep) 0%, var(--orange) 55%, var(--orange-lit) 100%);

  /* ---- Dark surface (footer only) ----------------------------------- */
  --night:      #111111;
  --night-2:    #1A1A1A;
  --night-rule: rgba(255,255,255,.14);
  --night-soft: rgba(255,255,255,.07);
  --snow:       #F5F5F3;
  --snow-70:    rgba(245,245,243,.70);
  --snow-45:    rgba(245,245,243,.45);

  /* ---- Radii -------------------------------------------------------- */
  --r-pill:  999px;
  --r-card:  14px;
  --r-sm:    10px;

  /* ---- Type ------------------------------------------------------- */
  /* One face, matching style.css. Inter is still fetched in head.html
     but is no longer referenced by either page stylesheet. */
  --sans: "Noto Sans JP", sans-serif;
  --jp:   "Noto Sans JP", sans-serif;

  /* Fixed rem scale, mapped onto style.css:
       --fs-body  1rem     16px    body
       --fs-lead  1.1rem   17.6px  .subpage-hero p
       --fs-h1    3rem     48px    .subpage-hero h1
       --fs-h2    2.25rem  36px    .section-title
       --fs-h3    1.5rem   24px    .news-title
       --fs-num   3rem     48px    capped at the site's largest type */
  --fs-eyebrow: 0.71rem;
  --fs-body:    1rem;
  --fs-lead:    1.1rem;
  --fs-h1:      3rem;
  --fs-h2:      2.25rem;
  --fs-h3:      1.5rem;
  --fs-num:     3rem;

  /* ---- Layout ----------------------------------------------------- */
  --maxw:   1400px;
  --gutter: clamp(20px, 4.6vw, 84px);
  --sect:   clamp(86px, 10.5vw, 176px);
  --hdr-h:  80px;

  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-io: cubic-bezier(.65,.05,.36,1);
}

/* ---- Scoped reset -----------------------------------------------
   The standalone design file reset bare elements (body, a, ul, p...).
   Those would restyle the shared navbar/footer fragments, so every reset
   below is confined to .hf-services -- the <main> wrapper.

   Each is wrapped in :where(.hf-services), which contributes ZERO
   specificity. That keeps each selector's original weight intact:
   `:where(.hf-services) p` is still 0,0,1, so it beats style.css's bare
   `p` on load order but never overrides this file's own single-class
   rules (0,1,0). A plain `.hf-services p` (0,1,1) would out-specify the
   design's own component rules and quietly break them.
   ------------------------------------------------------------------ */
html{ scroll-behavior:smooth; }

:where(.hf-services),:where(.hf-services) *,:where(.hf-services) *::before,:where(.hf-services) *::after{ box-sizing:border-box; }
.hf-services{
  -webkit-text-size-adjust:100%;
  background:var(--paper); color:var(--ink-70);
  font-family:var(--sans); font-size:var(--fs-body); font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  font-feature-settings:"palt" 1;
}
:where(.hf-services) img{ max-width:100%; display:block; }
:where(.hf-services) a{ color:inherit; text-decoration:none; }
:where(.hf-services) button,:where(.hf-services) input,:where(.hf-services) select,:where(.hf-services) textarea{ font:inherit; color:inherit; }
:where(.hf-services) h1,:where(.hf-services) h2,:where(.hf-services) h3,:where(.hf-services) h4,:where(.hf-services) p,:where(.hf-services) figure,:where(.hf-services) blockquote{ margin:0; }
:where(.hf-services) ul{ margin:0; padding:0; list-style:none; }
:where(.hf-services) ::selection{ background:var(--orange); color:#fff; }
:where(.hf-services) :focus-visible{ outline:2px solid var(--orange); outline-offset:3px; border-radius:6px; }

/* ---- Shell ------------------------------------------------------- */
.wrap{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); }
.hf-services .fs-crumb{ background:var(--white); border-bottom:1px solid var(--rule-soft); }
.hf-services .fs-crumb ol{ display:flex; align-items:center; gap:10px; padding-block:14px; list-style:none; }
.hf-services .fs-crumb li:not(:last-child)::after{ content:"/"; margin-left:10px; color:var(--ink-25); }
.hf-services .fs-crumb a:hover{ color:var(--orange); }
.hf-services .fs-crumb [aria-current]{ color:var(--ink); }
.hf-section{ padding-block:var(--sect); position:relative; }


/* ---- Type utilities ---------------------------------------------- */
.eyebrow{
  font-size:var(--fs-eyebrow); font-weight:600; letter-spacing:.32em;
  text-transform:uppercase; color:var(--ink-40); line-height:1;
  display:inline-flex; align-items:center; gap:14px; font-family:var(--sans);
}
.eyebrow::before{
  content:""; width:28px; height:1px; background:var(--orange); flex:none;
  transform-origin:left center;
}
.eyebrow.no-rule::before{ display:none; }
.eyebrow--light{ color:var(--snow-45); }
.h1{
  font-family:var(--jp); font-size:var(--fs-h1); font-weight:700;
  line-height:1.28; letter-spacing:.004em; color:var(--ink);
}
.h2{
  font-family:var(--jp); font-size:var(--fs-h2); font-weight:700;
  line-height:1.34; letter-spacing:.006em; color:var(--ink);
}
.h3{ font-family:var(--jp); font-size:var(--fs-h3); font-weight:700; line-height:1.5; letter-spacing:.01em; color:var(--ink); }
.lead{ font-size:var(--fs-lead); line-height:1.9; color:var(--ink-70); font-family:var(--jp); font-weight:400; }
.body{ font-family:var(--jp); color:var(--ink-70); line-height:1.9; }
.mono{
  font-family:var(--sans); font-variant-numeric:tabular-nums;
  letter-spacing:.14em; text-transform:uppercase; font-size:11px; font-weight:500;
}
.accent-line{ width:100%; height:1px; background:var(--rule); }

/* =============================================================
   HEADER
   ============================================================= */
.hdr{
  position:fixed; inset:0 0 auto 0; z-index:120; height:var(--hdr-h);
  display:flex; align-items:center;
  transition:height .45s var(--ease), background-color .45s var(--ease),
             box-shadow .45s var(--ease), border-color .45s var(--ease), backdrop-filter .45s var(--ease);
  border-bottom:1px solid var(--rule-soft); color:var(--ink);
  background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:saturate(180%) blur(16px); backdrop-filter:saturate(180%) blur(16px);
}
.hdr__in{
  width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter);
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.brand{ display:flex; align-items:center; gap:13px; flex:none; }
.brand__logo{ width:38px; height:38px; flex:none; transition:transform .6s var(--ease); }
.brand:hover .brand__logo{ transform:rotate(72deg); }
.brand__mark{
  font-family:var(--sans); font-weight:400; font-size:20px;
  letter-spacing:.14em; text-transform:uppercase; line-height:1; color:#5A5F66;
  transition:font-size .45s var(--ease);
}
.hdr.is-stuck .brand__logo{ width:32px; height:32px; }
.hdr.is-stuck .brand__mark{ font-size:18px; }

.nav{ display:flex; align-items:center; gap:clamp(18px,2.1vw,38px); }
.nav__link{ position:relative; display:block; padding-block:6px; }
.nav__en{
  display:block; font-family:var(--sans); font-size:8.5px; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; opacity:.42; line-height:1; margin-bottom:6px;
  transition:opacity .3s var(--ease), color .3s var(--ease);
}
.nav__jp{
  display:block; font-family:var(--jp); font-size:13px; font-weight:500;
  letter-spacing:.06em; line-height:1;
}
.nav__link::after{
  content:""; position:absolute; left:0; bottom:-5px; height:1px; width:100%;
  background:var(--orange); transform:scaleX(0); transform-origin:left center;
  transition:transform .45s var(--ease);
}
.nav__link:hover::after,.nav__link[aria-current="page"]::after{ transform:scaleX(1); }
.nav__link[aria-current="page"] .nav__en{ color:var(--orange); opacity:1; }

.nav-cta{
  display:inline-flex; align-items:center; gap:10px; padding:12px 24px;
  border:1px solid var(--orange); color:var(--orange-deep); border-radius:var(--r-pill);
  font-family:var(--sans);
  font-size:11px; font-weight:600; letter-spacing:.18em; text-transform:uppercase;
  background:var(--orange-dim);
  transition:background-color .3s var(--ease), color .3s var(--ease),
             box-shadow .3s var(--ease), transform .3s var(--ease);
}
.nav-cta:hover{
  background:var(--orange); border-color:var(--orange); color:#fff;
  box-shadow:0 4px 14px 0 var(--orange-glow); transform:translateY(-1px);
}
.nav-cta__arrow{ transition:transform .35s var(--ease); }
.nav-cta:hover .nav-cta__arrow{ transform:translateX(4px); }

/* scrolled state */
.hdr.is-stuck{
  height:64px; background:rgba(255,255,255,.94);
  box-shadow:0 1px 0 rgba(17,17,17,.03), 0 14px 34px -30px rgba(17,17,17,.55);
}

/* mobile menu button */
.burger{
  display:none; width:44px; height:44px; margin-right:-10px; background:none; border:0;
  cursor:pointer; position:relative; flex:none;
}
.burger span{
  position:absolute; left:11px; width:22px; height:1.5px; background:currentColor;
  transition:transform .45s var(--ease), opacity .3s var(--ease);
}
.burger span:nth-child(1){ top:18px; } .burger span:nth-child(2){ top:25px; }
body.menu-open .burger span:nth-child(1){ transform:translateY(3.5px) rotate(45deg); }
body.menu-open .burger span:nth-child(2){ transform:translateY(-3.5px) rotate(-45deg); }

.mobile-menu{
  position:fixed; inset:0; z-index:110; background:var(--white); color:var(--ink);
  padding:calc(var(--hdr-h) + 28px) var(--gutter) 40px;
  display:flex; flex-direction:column; justify-content:space-between;
  clip-path:inset(0 0 100% 0); transition:clip-path .7s var(--ease-io);
  pointer-events:none; overflow-y:auto;
}
body.menu-open .mobile-menu{ clip-path:inset(0 0 0 0); pointer-events:auto; }
.mobile-menu__list li{ border-bottom:1px solid var(--rule-soft); }
.mobile-menu__list a{ display:flex; align-items:baseline; gap:14px; padding:20px 0; }
.mobile-menu__list .n{ font-family:var(--sans); font-size:9px; letter-spacing:.24em; color:var(--orange); width:26px; flex:none; }
.mobile-menu__list .jp{ font-family:var(--jp); font-size:21px; font-weight:500; letter-spacing:.04em; }
.mobile-menu__list .en{ margin-left:auto; font-size:9.5px; letter-spacing:.22em; color:var(--ink-40); font-family:var(--sans); }
.mobile-menu__foot{ margin-top:40px; font-size:12px; color:var(--ink-40); line-height:2; }
.mobile-menu__foot a{ color:var(--ink-70); }

/* =============================================================
   HERO
   ============================================================= */
.hf-hero{
  position:relative; margin-top:var(--hdr-h); overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:#C9D6E2;
  padding:clamp(74px,9.5vw,140px) 0 clamp(80px,10vw,150px);
  min-height:clamp(300px,40vw,520px);
}
.hf-hero__media{ position:absolute; inset:0; overflow:hidden; }
.hf-hero__img{
  position:absolute; inset:0; width:100%; height:100%;
  background-image:url("/images/services-hero.webp");
  background-size:cover; background-position:50% 60%;
  transform:scale(1.06); opacity:0;
  animation:heroIn 2.2s var(--ease-io) .05s forwards;
}
@keyframes heroIn{ to{ transform:scale(1); opacity:1; } }

/* Bright overlay stack — the photograph stays light; only enough scrim
   for AA text contrast, plus a warm accent wash and a fade into --paper. */
.hf-hero__veil{ position:absolute; inset:0; pointer-events:none; }
.hf-hero__veil--base{
  background:linear-gradient(180deg, rgba(20,28,42,.34) 0%, rgba(20,28,42,.30) 46%, rgba(20,28,42,.36) 100%);
}
.hf-hero__veil--warm{
  background:radial-gradient(62% 88% at 84% 88%, rgba(249,115,22,.26) 0%, rgba(249,115,22,0) 62%);
  mix-blend-mode:screen;
}
.hf-hero__veil--fade{
  background:linear-gradient(180deg, rgba(247,247,245,0) 78%, rgba(247,247,245,.55) 93%, var(--paper) 100%);
}
.hf-hero__grid{
  position:absolute; inset:0; opacity:.13; pointer-events:none;
  background-image:linear-gradient(90deg, rgba(255,255,255,.6) 1px, transparent 1px);
  background-size:calc(100% / 6) 100%;
  mask-image:linear-gradient(180deg, transparent 0%, #000 34%, #000 70%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 34%, #000 70%, transparent 100%);
}

.hf-hero__content{ position:relative; z-index:2; color:#fff; width:100%; }
.hf-hero__inner{ max-width:860px; margin-inline:auto; text-align:center; }
.hf-hero .eyebrow{
  color:rgba(255,255,255,.9); justify-content:center;
  margin-bottom:clamp(16px,2vw,24px); text-shadow:0 1px 12px rgba(10,16,26,.5);
}
.hf-hero .eyebrow::before,.hf-hero .eyebrow::after{
  content:""; width:30px; height:1px; background:var(--orange-lit); flex:none;
}
.hf-hero__title{
  color:#fff; font-weight:700; letter-spacing:.05em; line-height:1.4;
  font-size:var(--fs-h1);
  text-shadow:0 2px 26px rgba(10,16,26,.45);
}
.hf-hero__title .ln{ display:block; overflow:hidden; }
.hf-hero__title .ln > span{ display:block; transform:translateY(105%); animation:lineUp 1.05s var(--ease-io) forwards; }
.hf-hero__title .ln:nth-child(1) > span{ animation-delay:.3s; }
.hf-hero__title .ln:nth-child(2) > span{ animation-delay:.42s; }
@keyframes lineUp{ to{ transform:translateY(0); } }

.hf-hero__rule{
  width:52px; height:2px; background:var(--grad-accent); border-radius:2px;
  margin:clamp(20px,2.4vw,30px) auto 0; transform:scaleX(0);
  animation:ruleIn .9s var(--ease-io) .95s forwards;
}
@keyframes ruleIn{ to{ transform:scaleX(1); } }
.hf-hero__lead{
  margin-top:clamp(18px,2.2vw,26px); color:rgba(255,255,255,.94);
  font-family:var(--jp); font-weight:500; letter-spacing:.03em;
  font-size:var(--fs-lead); line-height:1.9;
  text-shadow:0 1px 16px rgba(10,16,26,.5);
  opacity:0; animation:fadeUp 1s var(--ease) .8s forwards;
}
@keyframes fadeUp{ from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }

.hf-hero__tags{
  display:flex; flex-wrap:wrap; justify-content:center; gap:10px;
  margin-top:clamp(24px,3vw,36px);
  opacity:0; animation:fadeUp 1s var(--ease) .98s forwards;
}
.hf-tag{
  display:inline-flex; align-items:center; gap:9px; padding:9px 18px;
  border:1px solid rgba(255,255,255,.42); border-radius:var(--r-pill);
  background:rgba(255,255,255,.13);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  font-family:var(--sans); font-size:10px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:#fff;
}
.hf-tag::before{ content:""; width:5px; height:5px; background:var(--orange-lit); border-radius:50%; }


/* =============================================================
   STATEMENT
   ============================================================= */
.statement{ background:var(--paper); }
.statement__grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(32px,4vw,64px) 24px; }
.statement__head{ grid-column:1 / span 7; }
.statement__aside{ grid-column:9 / span 4; align-self:end; }
.statement__rule{
  height:1px; background:var(--grad-accent); margin:clamp(28px,3.6vw,48px) 0 0;
  transform:scaleX(0); transform-origin:left center; transition:transform 1.4s var(--ease-io);
  width:clamp(120px,20vw,260px);
}
.reveal.is-in .statement__rule{ transform:scaleX(1); }
.statement__h2{ margin-top:clamp(24px,3vw,40px); }
.statement__body{ margin-top:clamp(26px,3vw,40px); max-width:38ch; }
.statement__aside dl{ border-top:1px solid var(--rule); padding-top:18px; }
.statement__aside dt{ font-family:var(--sans); font-size:9.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-40); }
.statement__aside dd{ margin:8px 0 0; font-family:var(--jp); font-size:14px; color:var(--ink-90); line-height:1.9; }

/* =============================================================
   SERVICES
   ============================================================= */
.services{ background:var(--paper); padding-top:0; }
.services__head{ display:grid; grid-template-columns:repeat(12,1fr); gap:24px; align-items:end; margin-bottom:clamp(48px,6vw,88px); }
.services__head .l{ grid-column:1 / span 6; }
.services__head .r{ grid-column:8 / span 5; }
.services__h2{ margin-top:22px; }

.svc-list{ border-top:1px solid var(--rule); }
.svc{
  position:relative; border-bottom:1px solid var(--rule);
  transition:background-color .55s var(--ease);
}
.svc::before{ /* orange wash on hover */
  content:""; position:absolute; inset:0; pointer-events:none; opacity:0;
  background:linear-gradient(100deg, rgba(249,115,22,.09) 0%, rgba(249,115,22,.03) 34%, rgba(249,115,22,0) 62%);
  transition:opacity .6s var(--ease);
}
.svc:hover::before{ opacity:1; }
.svc::after{ /* top hairline that draws in */
  content:""; position:absolute; left:0; top:-1px; height:1px; width:100%;
  background:var(--grad-accent); transform:scaleX(0); transform-origin:left center;
  transition:transform .7s var(--ease);
}
.svc:hover::after{ transform:scaleX(1); }

.svc__inner{
  display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(18px,2.4vw,40px) 24px;
  align-items:start; padding-block:clamp(40px,5.2vw,78px);
  transition:transform .6s var(--ease);
}
.svc:hover .svc__inner{ transform:translateX(7px); }
.svc__num{
  grid-column:1 / span 2; display:flex; align-items:flex-start; gap:14px;
  font-family:var(--sans); font-variant-numeric:tabular-nums;
  font-size:2.25rem; font-weight:700; line-height:.9;
  color:var(--ink-25); letter-spacing:-.02em;
  transition:color .5s var(--ease);
}
.svc:hover .svc__num{ color:var(--orange); }

.svc__title{ grid-column:3 / span 5; }
.svc__kicker{
  display:inline-block; border-radius:var(--r-pill); font-family:var(--jp); font-size:11.5px; font-weight:500;
  letter-spacing:.1em; color:var(--orange-deep); background:var(--orange-dim);
  padding:5px 11px; margin-bottom:14px;
}
.svc__en{
  display:block; font-family:var(--sans); font-size:10px; font-weight:600;
  letter-spacing:.26em; text-transform:uppercase; color:var(--ink-40); margin-bottom:12px;
  transition:color .5s var(--ease);
}
.svc:hover .svc__en{ color:var(--ink-70); }
.svc__name{ font-family:var(--jp); font-size:var(--fs-h3); font-weight:700; line-height:1.5; letter-spacing:.01em; color:var(--ink); }

.svc__desc{ grid-column:8 / span 4; }
.svc__desc p{ font-family:var(--jp); color:var(--ink-55); line-height:2.15; font-size:14.6px; transition:color .5s var(--ease); }
.svc__desc p + p{ margin-top:1.1em; }
.svc:hover .svc__desc p{ color:var(--ink-90); }

.svc__arrow{
  grid-column:12 / span 1; justify-self:end; align-self:start;
  width:44px; height:44px; border:1px solid var(--rule); border-radius:50%;
  display:grid; place-items:center; flex:none;
  transition:border-color .5s var(--ease), background-color .5s var(--ease), transform .5s var(--ease);
}
.svc__arrow svg{ width:14px; height:14px; transition:transform .5s var(--ease); }
.svc:hover .svc__arrow{ border-color:var(--orange); background:var(--orange); color:#fff; }
.svc:hover .svc__arrow svg{ transform:translate(3px,-3px); }

/* =============================================================
   FEATURED SUB-SERVICE LINK (→ ファン型STO)
   ============================================================= */
.feature-link{
  display:grid; grid-template-columns:1fr auto; align-items:center;
  gap:clamp(24px,3vw,56px);
  margin-bottom:clamp(44px,5.5vw,80px);
  padding:clamp(30px,3.6vw,56px) clamp(26px,3.4vw,56px);
  border:1px solid var(--rule); border-radius:var(--r-card);
  background:
    linear-gradient(102deg, rgba(249,115,22,.07) 0%, rgba(249,115,22,.02) 38%, rgba(255,255,255,0) 68%),
    var(--white);
  position:relative; overflow:hidden;
  transition:transform .45s var(--ease), box-shadow .45s var(--ease), border-color .45s var(--ease);
}
.feature-link::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:3px;
  background:var(--grad-accent); transform:scaleY(0); transform-origin:top center;
  transition:transform .6s var(--ease);
}
.feature-link:hover{
  transform:translateY(-3px); border-color:var(--orange-hair);
  box-shadow:0 18px 40px -28px rgba(17,17,17,.5);
}
.feature-link:hover::before{ transform:scaleY(1); }
.feature-link__eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--sans); font-size:10px; font-weight:600;
  letter-spacing:.24em; text-transform:uppercase; color:var(--orange-deep);
  background:var(--orange-dim); padding:6px 14px; border-radius:var(--r-pill);
}
.feature-link__title{ font-family:var(--jp); font-weight:700; letter-spacing:.01em;
  font-size:var(--fs-h3); line-height:1.5; color:var(--ink);
}
.feature-link__desc{
  margin-top:14px; max-width:58ch; font-family:var(--jp); font-size:14.4px;
  line-height:2.1; color:var(--ink-55);
}
.feature-link__facts{
  display:flex; flex-wrap:wrap; gap:10px; margin-top:22px;
}
.feature-link__facts li{
  display:inline-flex; align-items:baseline; gap:8px;
  border:1px solid var(--rule); border-radius:var(--r-pill);
  padding:8px 16px; font-family:var(--jp); font-size:12px; color:var(--ink-55);
}
.feature-link__facts b{ font-family:var(--sans); font-size:13px; color:var(--ink); font-weight:600; }
.feature-link__go{
  display:inline-flex; align-items:center; gap:14px; flex:none;
  font-family:var(--sans); font-size:11px; font-weight:600;
  letter-spacing:.2em; text-transform:uppercase; color:var(--orange-deep);
}
.feature-link__go i{
  width:46px; height:46px; border-radius:50%; border:1px solid var(--orange);
  display:grid; place-items:center; color:var(--orange);
  transition:background-color .4s var(--ease), color .4s var(--ease), transform .4s var(--ease);
}
.feature-link__go svg{ width:15px; height:15px; }
.feature-link:hover .feature-link__go i{ background:var(--orange); color:#fff; transform:translateX(4px); }
@media (max-width:900px){
  .feature-link{ grid-template-columns:1fr; }
  .feature-link__go{ justify-content:space-between; width:100%; }
}

/* =============================================================
   ECOSYSTEM
   ============================================================= */
.eco{ background:var(--paper-2); }
.eco__head{ display:grid; grid-template-columns:repeat(12,1fr); gap:24px; align-items:end; margin-bottom:clamp(44px,5vw,72px); }
.eco__head .l{ grid-column:1 / span 6; }
.eco__head .r{ grid-column:8 / span 5; }

.eco__stage{ position:relative; }
.eco__svg{ width:100%; height:auto; display:block; overflow:visible; }
.eco-line{ stroke:rgba(17,17,17,.18); stroke-width:1; fill:none; }
.eco-line--dash{
  stroke:var(--orange); stroke-width:1; stroke-dasharray:3 9; opacity:.85;
  animation:dashFlow 3.4s linear infinite;
}
@keyframes dashFlow{ to{ stroke-dashoffset:-48; } }
.eco-ring{ fill:none; stroke:rgba(17,17,17,.13); stroke-width:1; }
.eco-ring--dot{ stroke-dasharray:1.5 7; }
.eco-node{ fill:var(--paper-2); stroke:rgba(17,17,17,.22); stroke-width:1; }
.eco-node--hub{ fill:var(--ink); stroke:none; }
.eco-dot{ fill:var(--orange); }
.eco-pulse{ fill:var(--orange); opacity:.4; animation:pulseRing 3s var(--ease-io) infinite; transform-origin:center; }
@keyframes pulseRing{ 0%{ r:3; opacity:.5; } 70%,100%{ r:13; opacity:0; } }
.eco-lbl{ font-family:var(--sans); font-size:9.5px; font-weight:600; letter-spacing:.2em; text-transform:uppercase; fill:var(--ink); }
.eco-lbl--sub{ font-family:"Noto Sans JP",sans-serif; font-size:11px; font-weight:400; letter-spacing:.06em; fill:rgba(17,17,17,.5); text-transform:none; }
.eco-hub{ font-family:var(--sans); font-size:12px; font-weight:600; letter-spacing:.22em; fill:#fff; }
.eco-hub--sub{ font-family:var(--sans); font-size:8px; font-weight:500; letter-spacing:.22em; fill:rgba(255,255,255,.5); }

.eco__mobile{ display:none; }
.eco-step{ display:flex; gap:18px; padding:22px 0; border-bottom:1px solid var(--rule); position:relative; }
.eco-step:first-child{ border-top:1px solid var(--rule); }
.eco-step__dot{ width:7px; height:7px; border-radius:50%; background:var(--orange); margin-top:9px; flex:none; }
.eco-step__en{ font-family:var(--sans); font-size:10px; font-weight:600; letter-spacing:.22em; text-transform:uppercase; }
.eco-step__jp{ font-family:var(--jp); font-size:13px; color:var(--ink-55); margin-top:5px; }
.eco-hub-m{
  background:var(--ink); color:#fff; padding:26px; text-align:center;
  margin-bottom:26px; border-radius:var(--r-card);
}
.eco-hub-m span{ display:block; font-family:var(--sans); font-size:13px; font-weight:600; letter-spacing:.24em; }
.eco-hub-m small{ display:block; margin-top:8px; font-size:9px; letter-spacing:.22em; color:rgba(255,255,255,.5); }

.eco__words{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(20px,3vw,48px);
  margin-top:clamp(48px,6vw,88px); padding-top:clamp(28px,3vw,44px); border-top:1px solid var(--rule);
}
.eco-word__en{ font-family:var(--sans); font-size:1.25rem; font-weight:600; letter-spacing:.16em; text-transform:uppercase; }
.eco-word__en em{ font-style:normal; color:var(--orange); }
.eco-word__jp{ margin-top:10px; font-family:var(--jp); font-size:13.5px; color:var(--ink-55); line-height:1.9; }

/* =============================================================
   WHY
   ============================================================= */
.why{ background:var(--paper); }
.why__grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:24px; }
.why__aside{ grid-column:1 / span 4; }
.why__sticky{ position:sticky; top:calc(64px + clamp(40px,7vw,110px)); }
.why__title{ font-family:var(--sans); font-weight:600; font-size:2.25rem; line-height:1.02; letter-spacing:-.015em; margin-top:22px; }
.why__title span{ display:block; }
.why__title .orange{ color:var(--orange); }
.why__jp{ margin-top:20px; font-family:var(--jp); font-size:14px; color:var(--ink-55); line-height:2; }
.why__progress{ margin-top:clamp(30px,4vw,54px); display:flex; flex-direction:column; gap:0; }
.why__tick{
  display:flex; align-items:center; gap:14px; padding:11px 0; border-top:1px solid var(--rule-soft);
  font-family:var(--sans); font-size:10.5px; font-weight:600; letter-spacing:.2em;
  color:var(--ink-25); transition:color .5s var(--ease);
}
.why__tick:last-child{ border-bottom:1px solid var(--rule-soft); }
.why__tick i{ display:block; width:22px; height:1px; background:currentColor; transition:width .5s var(--ease); }
.why__tick.is-active{ color:var(--orange); }
.why__tick.is-active i{ width:44px; }

.why__items{ grid-column:6 / span 7; }
.why-item{
  padding-block:clamp(40px,5.4vw,86px); border-bottom:1px solid var(--rule);
  opacity:.34; transition:opacity .6s var(--ease);
}
.why-item:first-child{ padding-top:0; }
.why-item:last-child{ border-bottom:0; }
.why-item.is-active{ opacity:1; }
.why-item__num{
  font-family:var(--sans); font-variant-numeric:tabular-nums;
  font-size:2.25rem; font-weight:700; line-height:1; color:var(--ink-25);
  transition:color .6s var(--ease); letter-spacing:-.02em;
}
.why-item.is-active .why-item__num{ color:var(--orange); }
.why-item__bar{
  width:100%; height:1px; background:var(--rule-soft); margin:18px 0 24px; position:relative; overflow:hidden;
}
.why-item__bar::after{
  content:""; position:absolute; inset:0; background:var(--grad-accent);
  transform:scaleX(0); transform-origin:left center; transition:transform 1s var(--ease-io);
}
.why-item.is-active .why-item__bar::after{ transform:scaleX(1); }
.why-item__title{ font-family:var(--jp); font-size:var(--fs-h3); font-weight:700; line-height:1.55; letter-spacing:.01em; color:var(--ink); }
.why-item__body{ margin-top:18px; font-family:var(--jp); color:var(--ink-55); line-height:2.15; font-size:14.6px; max-width:52ch; }
.why-item__note{
  margin-top:16px; padding-left:14px; border-left:2px solid var(--orange-hair);
  font-family:var(--jp); font-size:12.5px; color:var(--ink-40); line-height:1.95;
}

/* =============================================================
   MARKET (dark feature section)
   ============================================================= */
.market{
  /* local light palette — flip these seven back to the :root dark values
     if a dark market section is ever wanted again */
  --night:#FFFFFF; --night-2:#FBFBF9;
  --night-rule:rgba(17,17,17,.13); --night-soft:rgba(17,17,17,.08);
  --snow:#111111; --snow-70:rgba(17,17,17,.62); --snow-45:rgba(17,17,17,.42);
  background:var(--white); color:var(--ink); position:relative; overflow:hidden;
}
.market::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:
    radial-gradient(58% 46% at 78% 6%, rgba(249,115,22,.10) 0%, rgba(249,115,22,0) 62%),
    radial-gradient(46% 40% at 6% 98%, rgba(249,115,22,.07) 0%, rgba(249,115,22,0) 66%);
}
.market::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.55;
  background-image:linear-gradient(90deg, rgba(17,17,17,.03) 1px, transparent 1px);
  background-size:calc(100% / 6) 100%;
  mask-image:linear-gradient(180deg, transparent, #000 22%, #000 78%, transparent);
  -webkit-mask-image:linear-gradient(180deg, transparent, #000 22%, #000 78%, transparent);
}
.market > *{ position:relative; z-index:1; }
.market__head{ display:grid; grid-template-columns:repeat(12,1fr); gap:24px; align-items:end; }
.market__head .l{ grid-column:1 / span 6; }
.market__head .r{ grid-column:8 / span 5; }
.market__h2{ margin-top:22px; color:var(--snow); }
.market__lead{ color:var(--snow-70); font-family:var(--jp); line-height:2.1; font-size:15px; }

.stat{
  margin-top:clamp(52px,6.5vw,104px); padding-top:clamp(30px,3.4vw,54px);
  border-top:1px solid var(--night-rule);
  display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(24px,3vw,40px) 24px; align-items:end;
}
.stat__figure{ grid-column:1 / span 7; }
.stat__label{
  font-family:var(--sans); font-size:10px; font-weight:600; letter-spacing:.26em;
  text-transform:uppercase; color:var(--snow-45); margin-bottom:clamp(14px,1.6vw,26px);
  display:flex; align-items:center; gap:12px;
}
.stat__label::before{ content:""; width:24px; height:1px; background:var(--orange); }
.stat__num{
  font-family:var(--sans); font-variant-numeric:tabular-nums;
  font-size:var(--fs-num); font-weight:700; line-height:.86; letter-spacing:-.035em;
  display:flex; align-items:baseline; gap:.06em; flex-wrap:wrap;
  background:linear-gradient(96deg,#111111 0%,#1C1C1C 24%,var(--orange-deep) 70%,var(--orange) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.stat__approx{
  font-family:var(--jp); font-size:.2em; font-weight:400; letter-spacing:.06em;
  align-self:center; margin-right:.14em;
  color:var(--snow-70); -webkit-text-fill-color:var(--snow-70);
}
.stat__unit{
  font-family:var(--jp); font-size:.2em; font-weight:400; letter-spacing:.02em;
  color:var(--ink-40); -webkit-text-fill-color:var(--ink-40);
}
.stat__plus{
  font-family:var(--jp); font-size:.2em; font-weight:500; letter-spacing:.02em;
  color:var(--orange); -webkit-text-fill-color:var(--orange); margin-left:.06em;
}
.stat__num > [data-count]{ display:inline-block; text-align:left; }
.stat__cap{
  margin-top:clamp(18px,2vw,30px); font-family:var(--jp); font-size:13.5px;
  color:var(--snow-70); letter-spacing:.04em;
}
.stat__meta{ grid-column:9 / span 4; padding-bottom:clamp(6px,1vw,16px); }
.stat__meta dl{ border-left:1px solid var(--night-rule); padding-left:20px; }
.stat__meta dt{ font-family:var(--sans); font-size:9px; letter-spacing:.24em; text-transform:uppercase; color:var(--snow-45); }
.stat__meta dd{ margin:7px 0 18px; font-family:var(--jp); font-size:13px; color:var(--snow); line-height:1.8; }
.stat__meta dd:last-child{ margin-bottom:0; }

.market__note{
  margin-top:clamp(34px,4vw,60px); display:grid; grid-template-columns:repeat(12,1fr); gap:24px;
}
.market__note p{ grid-column:1 / span 5; font-family:var(--jp); font-size:14px; color:var(--snow-70); line-height:2.15; }
.market__note p:last-child{ grid-column:7 / span 5; }

.assets{
  margin-top:clamp(52px,6.5vw,100px); padding-top:clamp(26px,3vw,44px);
  border-top:1px solid var(--night-rule);
}
.assets__cap{ font-family:var(--sans); font-size:10px; font-weight:600; letter-spacing:.26em; text-transform:uppercase; color:var(--snow-45); margin-bottom:clamp(22px,2.6vw,36px); }
.assets__grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--night-rule); border:1px solid var(--night-rule);
  border-radius:var(--r-card); overflow:hidden;
}
.asset{
  background:var(--night); padding:clamp(22px,2.6vw,40px) clamp(18px,2vw,30px);
  position:relative; overflow:hidden; transition:background-color .5s var(--ease);
}
.asset::before{
  content:""; position:absolute; left:0; top:0; width:100%; height:2px;
  background:var(--grad-accent); transform:scaleX(0); transform-origin:left center;
  transition:transform .6s var(--ease);
}
.asset:hover::before{ transform:scaleX(1); }
.asset:hover{ background:var(--night-2); }
.asset__i{ font-family:var(--sans); font-size:9.5px; letter-spacing:.2em; color:var(--orange); }
.asset__jp{ margin-top:16px; font-family:var(--jp); font-size:1.1rem; font-weight:700; letter-spacing:.02em; color:var(--ink); }
.asset__en{ margin-top:8px; font-family:var(--sans); font-size:9.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--snow-45); }

.market__band{
  margin-top:clamp(56px,7vw,112px); padding-top:clamp(30px,3.4vw,52px); border-top:1px solid var(--night-rule);
  display:grid; grid-template-columns:repeat(12,1fr); gap:24px; align-items:end;
}
.market__band .big{
  grid-column:1 / span 8;
  font-family:var(--sans); font-weight:700; letter-spacing:-.01em;
  font-size:2.25rem; line-height:1.22; color:var(--snow);
}
.market__band .big em{ font-style:normal; color:var(--orange); }
.market__band .src{ grid-column:10 / span 3; font-family:var(--sans); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--snow-45); text-align:right; }

/* =============================================================
   CTA
   ============================================================= */
.cta{ background:var(--paper); position:relative; overflow:hidden; }
.cta::before{
  content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(52% 62% at 88% 42%, rgba(249,115,22,.13) 0%, rgba(249,115,22,0) 66%);
}
.cta__grid{ position:relative; display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(30px,4vw,56px) 24px; align-items:end; }
.cta__l{ grid-column:1 / span 7; }
.cta__r{ grid-column:9 / span 4; }
.cta__h2{ margin-top:24px; font-size:var(--fs-h2); line-height:1.62; }
.btn{
  display:inline-flex; align-items:center; justify-content:space-between; gap:32px;
  padding:19px 30px; min-width:min(320px,100%); border:0; border-radius:var(--r-pill);
  background:var(--orange); color:#fff;
  box-shadow:0 4px 16px 0 var(--orange-glow);
  font-family:var(--sans); font-size:12px; font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; cursor:pointer;
  transition:background-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease);
}
.btn:hover{ background:#EA580C; box-shadow:0 8px 24px 0 var(--orange-glow); transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }
.btn svg{ width:16px; height:16px; transition:transform .35s var(--ease); }
.btn:hover svg{ transform:translateX(5px); }
.cta__contacts{ margin-top:30px; border-top:1px solid var(--rule); }
.cta__contacts a,.cta__contacts span{
  display:flex; align-items:baseline; gap:16px; padding:15px 0; border-bottom:1px solid var(--rule);
  font-family:var(--sans); font-size:14px; letter-spacing:.04em; transition:color .35s var(--ease);
}
.cta__contacts b{ font-size:9px; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-40); width:52px; flex:none; }
.cta__contacts a:hover{ color:var(--orange); }

/* =============================================================
   FORM
   ============================================================= */
.form-sect{ background:var(--white); }
.form-grid{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(34px,4vw,60px) 24px; }
.form-sect__aside{ grid-column:1 / span 4; }
.form-sect__aside .h3{ margin-top:20px; }
.form-sect__aside p{ margin-top:18px; font-family:var(--jp); font-size:14px; color:var(--ink-55); line-height:2.05; }
.form{ grid-column:6 / span 7; }
.field{ margin-bottom:clamp(24px,2.6vw,38px); }
.field__row{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(20px,2.4vw,36px); }
.field label{
  display:flex; align-items:center; gap:10px;
  font-family:var(--sans); font-size:10px; font-weight:600; letter-spacing:.22em;
  text-transform:uppercase; color:var(--ink-40); margin-bottom:6px;
}
.field label .jp{ font-family:var(--jp); font-size:12px; letter-spacing:.06em; text-transform:none; color:var(--ink-70); font-weight:500; }
.field label .req{ color:var(--orange); font-size:9px; letter-spacing:.16em; }
.field input,.field select,.field textarea{
  width:100%; background:transparent; border:0; border-bottom:1.5px solid var(--rule);
  padding:14px 2px; font-family:var(--jp); font-size:15.5px; color:var(--ink);
  border-radius:0; -webkit-appearance:none; appearance:none;
  transition:border-color .4s var(--ease);
}
.field select{
  background-image:linear-gradient(45deg,transparent 50%,var(--ink-40) 50%),linear-gradient(135deg,var(--ink-40) 50%,transparent 50%);
  background-position:calc(100% - 11px) 22px, calc(100% - 6px) 22px; background-size:5px 5px,5px 5px;
  background-repeat:no-repeat; padding-right:26px; cursor:pointer;
}
.field textarea{ resize:vertical; min-height:132px; line-height:1.95; }
.field input:focus,.field select:focus,.field textarea:focus{ outline:none; border-bottom-color:var(--orange); }
.field input::placeholder,.field textarea::placeholder{ color:var(--ink-25); }
.consent{ display:flex; gap:13px; align-items:flex-start; margin:6px 0 clamp(28px,3vw,44px); }
.consent input{ width:auto; margin-top:5px; accent-color:var(--orange); border-radius:4px; }
.consent label{ margin:0; text-transform:none; letter-spacing:.02em; font-family:var(--jp); font-size:13px; color:var(--ink-70); font-weight:400; }
.consent label a{ border-bottom:1px solid var(--orange-hair); }
.form__submit{ min-width:min(300px,100%); }

/* =============================================================
   FOOTER
   ============================================================= */
.ftr{ background:var(--night); color:var(--snow); padding-block:clamp(64px,7vw,110px) 0; }
.ftr__top{ display:grid; grid-template-columns:repeat(12,1fr); gap:clamp(38px,4vw,56px) 24px; }
.ftr__brand{ grid-column:1 / span 4; }
.ftr .brand__mark{ color:var(--snow); font-size:19px; }

.ftr__desc{ margin-top:24px; font-family:var(--jp); font-size:13.5px; color:var(--snow-70); line-height:2.05; max-width:34ch; }
.ftr__assoc{ margin-top:28px; padding-top:20px; border-top:1px solid var(--night-soft); }
.ftr__assoc dt{ font-family:var(--sans); font-size:9px; letter-spacing:.24em; text-transform:uppercase; color:var(--snow-45); }
.ftr__assoc dd{ margin:9px 0 0; font-family:var(--jp); font-size:13px; color:var(--snow); }
.ftr__col{ grid-column:span 2; }
.ftr__col--wide{ grid-column:span 3; }
.ftr__ttl{ font-family:var(--sans); font-size:9.5px; font-weight:600; letter-spacing:.24em; text-transform:uppercase; color:var(--snow-45); padding-bottom:16px; border-bottom:1px solid var(--night-soft); margin-bottom:16px; }
.ftr__col li a,.ftr__col li span{ display:block; padding:8px 0; font-family:var(--jp); font-size:13.5px; color:var(--snow-70); transition:color .3s var(--ease), transform .3s var(--ease); }
.ftr__col li a:hover{ color:var(--orange); transform:translateX(3px); }
.ftr__addr{ font-family:var(--jp); font-size:13px; color:var(--snow-70); line-height:2.05; font-style:normal; }
.ftr__addr a{ transition:color .3s var(--ease); }
.ftr__addr a:hover{ color:var(--orange); }
.ftr__disc{
  margin-top:clamp(52px,6vw,88px); padding-top:26px; border-top:1px solid var(--night-soft);
  font-family:var(--jp); font-size:11.5px; color:var(--snow-45); line-height:2; max-width:96ch;
}
.ftr__bar{
  margin-top:26px; padding-block:24px; border-top:1px solid var(--night-soft);
  display:flex; flex-wrap:wrap; gap:16px 28px; align-items:center; justify-content:space-between;
  font-family:var(--sans); font-size:10.5px; letter-spacing:.14em; color:var(--snow-45);
}
.ftr__bar nav{ display:flex; gap:26px; }
.ftr__bar a{ transition:color .3s var(--ease); }
.ftr__bar a:hover{ color:var(--orange); }

/* =============================================================
   REVEAL
   ============================================================= */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity 1s var(--ease), transform 1s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }
.reveal[data-d="1"]{ transition-delay:.09s; }
.reveal[data-d="2"]{ transition-delay:.18s; }
.reveal[data-d="3"]{ transition-delay:.27s; }

/* =============================================================
   RESPONSIVE
   ============================================================= */
@media (max-width:1200px){
  .svc__title{ grid-column:3 / span 4; }
  .svc__desc{ grid-column:7 / span 5; }
  .why__aside{ grid-column:1 / span 4; }
  .why__items{ grid-column:6 / span 7; }
  .market__note p{ grid-column:1 / span 6; }
  .market__note p:last-child{ grid-column:7 / span 6; }
}

@media (max-width:1024px){
  .nav{ display:none; }
  .burger{ display:block; }
  .statement__head{ grid-column:1 / span 8; }
  .statement__aside{ grid-column:1 / span 8; }
  .services__head .l,.services__head .r,
  .eco__head .l,.eco__head .r,
  .market__head .l,.market__head .r{ grid-column:1 / span 12; }
  .services__head .r,.eco__head .r,.market__head .r{ margin-top:26px; max-width:60ch; }
  .svc__inner{ grid-template-columns:repeat(8,1fr); }
.svc__num{ grid-column:1 / span 1; font-size:1.5rem; }
  .svc__title{ grid-column:2 / span 7; }
  .svc__desc{ grid-column:2 / span 7; }
  .svc__arrow{ grid-column:1 / span 8; justify-self:start; margin-left:0; }
  .svc:hover .svc__inner{ transform:none; }
  .why__grid{ grid-template-columns:repeat(8,1fr); }
  .why__aside{ grid-column:1 / span 8; }
  .why__sticky{ position:static; }
  .why__progress{ display:none; }
  .why__items{ grid-column:1 / span 8; margin-top:44px; }
  .why-item{ opacity:1; }
  .stat__figure{ grid-column:1 / span 12; }
  .stat__meta{ grid-column:1 / span 12; }
  .market__band .big{ grid-column:1 / span 12; }
  .market__band .src{ grid-column:1 / span 12; text-align:left; margin-top:18px; }
  .cta__l,.cta__r{ grid-column:1 / span 12; }
  .form-sect__aside,.form{ grid-column:1 / span 12; }
  .ftr__brand{ grid-column:1 / span 12; }
  .ftr__col{ grid-column:span 4; }
  .ftr__col--wide{ grid-column:span 4; }
  .eco__svg{ display:none; }
  .eco__mobile{ display:block; }
}

@media (max-width:760px){
  :root{ --sect:clamp(76px,15vw,110px); }
  .stat__approx,.stat__unit,.stat__plus{ font-size:16px; letter-spacing:0; }
  .stat__num{ align-items:flex-end; }
  .stat__label{ letter-spacing:.2em; }
  body{ line-height:1.85; }
  .hf-hero__img{ background-image:url("/images/services-hero-mobile.webp"); background-position:50% 56%; }
  .hf-hero__tags{ gap:8px; }
  .hf-tag{ padding:8px 12px; font-size:9px; letter-spacing:.16em; }
  .statement__head,.statement__aside{ grid-column:1 / span 12; }
  .svc__inner{ grid-template-columns:1fr; gap:0; padding-block:36px; }
  .svc__num{ grid-column:1; font-size:30px; margin-bottom:14px; }
  .svc__title{ grid-column:1; }
  .svc__desc{ grid-column:1; margin-top:18px; }
  .svc__arrow{ grid-column:1; margin-top:24px; width:40px; height:40px; }
  .svc__desc p{ color:var(--ink-70); }
  .eco__words{ grid-template-columns:1fr; gap:26px; }
  .eco__words > div{ padding-bottom:24px; border-bottom:1px solid var(--rule-soft); }
  .eco__words > div:last-child{ border-bottom:0; padding-bottom:0; }
  .assets__grid{ grid-template-columns:repeat(2,1fr); }
  .market__note p,.market__note p:last-child{ grid-column:1 / span 12; }
  .market__note{ gap:20px; }
  .field__row{ grid-template-columns:1fr; gap:0; }
  .field__row .field{ margin-bottom:clamp(24px,2.6vw,38px); }
  .btn{ width:100%; min-width:0; padding:20px 22px; gap:16px; font-size:11px; }
  .ftr__col,.ftr__col--wide{ grid-column:span 12; }
  .ftr__bar{ flex-direction:column; align-items:flex-start; gap:14px; }
  .ftr__bar nav{ flex-wrap:wrap; gap:16px 22px; }
}

@media (max-width:400px){
  :root{ --gutter:20px; }
  .assets__grid{ grid-template-columns:1fr; }
  .burger{ margin-right:0; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .hf-hero__img{ opacity:1; transform:none; }
  .hf-hero__title .ln > span{ transform:none; }
  .hf-hero__lead,.hf-hero__tags{ opacity:1; }
  .hf-hero__rule{ transform:none; }
  .reveal{ opacity:1; transform:none; }
}

@media print{ .hdr,.mobile-menu{ display:none; } }