:root{
  --brand-900:#05302A; --brand-700:#0D5245; --brand-500:#17796A; --brand-300:#6FB3A5;
  --brand-100:#DCEFE9; --brand-050:#F0F8F5;
  --accent-700:#8F5A1C; --accent-600:#B4762A; --accent-400:#D9983F; --accent-100:#F7EAD6;
  --ink-900:#0B1418; --ink-700:#263840; --ink-500:#46555C; --ink-400:#76868D;
  --surface:#FFFFFF; --surface-2:#F5F8F7; --surface-3:#EBF1EF; --line:#DCE6E3;
  --btn-fg:#0B1418;
  --hero-grad: radial-gradient(1200px 520px at 78% -8%, rgba(23,121,106,.16), transparent 62%),
               radial-gradient(760px 420px at 6% 8%, rgba(180,118,42,.10), transparent 60%);
  --shadow-sm:0 1px 2px rgba(11,20,24,.05), 0 1px 1px rgba(11,20,24,.03);
  --shadow-md:0 10px 30px -14px rgba(5,48,42,.30), 0 2px 6px rgba(11,20,24,.04);
  --radius:14px; --radius-sm:10px;
  --maxw:1140px;
  --fs-h1:clamp(2.15rem,6.1vw,3.95rem);
  --fs-h2:clamp(1.62rem,4vw,2.6rem);
  --fs-h3:1.14rem;
  --fs-body:1.0625rem;
}
@media (prefers-color-scheme: dark){
  :root{
    --brand-900:#071A17; --brand-700:#2B9683; --brand-500:#3FB09B; --brand-300:#6FC9B7;
    --brand-100:#143A33; --brand-050:#0D241F;
    --accent-700:#C98B45; --accent-600:#E0A153; --accent-400:#EEBB7B; --accent-100:#2E2214;
    --ink-900:#EAF2EF; --ink-700:#C6D5D1; --ink-500:#9AADA8; --ink-400:#738782;
    --surface:#080F12; --surface-2:#0E181C; --surface-3:#152227; --line:#1F3036;
    --btn-fg:#07201C;
    --hero-grad: radial-gradient(1200px 520px at 78% -8%, rgba(63,176,155,.14), transparent 62%),
                 radial-gradient(760px 420px at 6% 8%, rgba(224,161,83,.09), transparent 60%);
    --shadow-sm:0 1px 2px rgba(0,0,0,.4);
    --shadow-md:0 14px 36px -16px rgba(0,0,0,.72), 0 2px 8px rgba(0,0,0,.35);
  }
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--surface); color:var(--ink-900);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:var(--fs-body); line-height:1.65; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:Newsreader,Georgia,serif; font-weight:500; line-height:1.1; letter-spacing:-.022em; margin:0 0 .5em; color:var(--ink-900)}
h1{font-size:var(--fs-h1)} h2{font-size:var(--fs-h2)} h3{font-size:var(--fs-h3); font-family:Inter,sans-serif; font-weight:600; line-height:1.35; letter-spacing:-.01em}
p{margin:0 0 1.05em; color:var(--ink-500)}
em{font-style:italic; color:var(--brand-500)}
strong{color:var(--ink-900); font-weight:600}
a{color:var(--brand-500); text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2.5px solid var(--accent-600); outline-offset:3px; border-radius:4px}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 16px}
@media(min-width:720px){.wrap{padding:0 28px}}
.eyebrow{font-size:.75rem; font-weight:600; letter-spacing:.13em; text-transform:uppercase; color:var(--ink-400); margin:0 0 1.1rem}
.lede{font-size:clamp(1.02rem,2.1vw,1.2rem); color:var(--ink-500); max-width:62ch}
.num{font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1}

/* ---------- header ---------- */
header{position:sticky; top:0; z-index:60; background:color-mix(in srgb, var(--surface) 88%, transparent); backdrop-filter:saturate(1.5) blur(14px); border-bottom:1px solid var(--line)}
.nav{display:flex; align-items:center; gap:14px; height:66px; max-width:var(--maxw); margin:0 auto; padding:0 16px}
@media(min-width:720px){.nav{padding:0 28px}}
.logo{display:flex; align-items:center; gap:10px; text-decoration:none; flex:0 0 auto}
.logo:hover{text-decoration:none}
.logo .bar{width:2px; height:21px; background:var(--accent-600); border-radius:2px}
.logo .wm{font-family:Newsreader,serif; font-weight:500; font-size:1.04rem; letter-spacing:.085em; color:var(--ink-900); text-transform:uppercase; white-space:nowrap}
.logo .wm span{font-size:.62em; color:var(--ink-400); letter-spacing:.14em; margin-left:.42em}
nav.links{display:none; gap:26px; margin-left:auto; margin-right:8px}
@media(min-width:1000px){nav.links{display:flex}}
nav.links a{color:var(--ink-700); font-size:.9rem; font-weight:500}
nav.links a:hover{color:var(--brand-500); text-decoration:none}
.nav-right{display:flex; align-items:center; gap:10px; margin-left:auto}
@media(min-width:1000px){.nav-right{margin-left:0}}
.tel{display:none; font-size:.875rem; font-weight:600; color:var(--ink-700); white-space:nowrap}
@media(min-width:620px){.tel{display:inline}}
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.5em; border-radius:999px; font-weight:600; font-size:.9rem; padding:.68em 1.35em; border:1px solid transparent; cursor:pointer; transition:transform .12s ease, background .16s ease, box-shadow .16s ease; white-space:nowrap; text-align:center}
.btn:hover{text-decoration:none; transform:translateY(-1px)}
.btn:active{transform:translateY(0)}
.btn-primary{background:var(--accent-600); color:var(--btn-fg); box-shadow:var(--shadow-sm)}
.btn-primary:hover{background:var(--accent-400)}
.btn-ghost{background:transparent; color:var(--ink-900); border-color:var(--line)}
.btn-ghost:hover{border-color:var(--brand-500); color:var(--brand-500)}
.btn-lg{font-size:1rem; padding:.86em 1.7em}
.btn-light{background:var(--surface); color:var(--ink-900)}
.btn-light:hover{background:var(--brand-100)}

/* ---------- sections ---------- */
section{padding:clamp(52px,7.5vw,96px) 0}
.sec-alt{background:var(--surface-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.sec-head{max-width:62ch; margin-bottom:clamp(28px,4vw,46px)}

/* ---------- hero ---------- */
.hero{position:relative; padding-top:clamp(44px,6vw,80px); padding-bottom:clamp(40px,5vw,66px); background-image:var(--hero-grad); overflow:hidden}
.hero::after{content:""; position:absolute; inset:auto 0 0 0; height:1px; background:var(--line)}
.hero h1{max-width:16ch; margin-bottom:.38em}
.hero .lede{font-size:clamp(1.04rem,2.3vw,1.28rem); max-width:58ch; line-height:1.6}
.cta-row{display:flex; flex-wrap:wrap; gap:12px; margin:30px 0 18px}
.trust{font-size:.83rem; color:var(--ink-400); display:flex; flex-wrap:wrap; gap:.45em 1em; margin:0 0 6px}
.trust span{white-space:nowrap}
.stats{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; margin-top:clamp(34px,5vw,54px); background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden}
@media(min-width:760px){.stats{grid-template-columns:repeat(4,1fr)}}
.stat{background:var(--surface); padding:20px 16px}
.stat .v{font-family:Newsreader,serif; font-size:clamp(1.55rem,4vw,2.1rem); font-weight:500; color:var(--brand-700); letter-spacing:-.025em; line-height:1}
.stat .k{font-size:.775rem; color:var(--ink-400); margin-top:.6em; line-height:1.4}

/* ---------- tables ---------- */
.tscroll{overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface)}
table{border-collapse:collapse; width:100%; min-width:460px; font-size:.925rem}
caption{text-align:left; padding:14px 18px; font-size:.78rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-400); border-bottom:1px solid var(--line); background:var(--surface-3)}
th,td{text-align:left; padding:12px 18px; border-bottom:1px solid var(--line); vertical-align:top}
thead th{background:var(--surface-3); font-size:.74rem; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-400); font-weight:600; white-space:nowrap}
tbody th{font-weight:500; color:var(--ink-700); width:46%}
tbody td{color:var(--ink-900); font-weight:500; font-variant-numeric:tabular-nums}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--brand-050)}
.hl{color:var(--brand-700); font-weight:600}

/* ---------- cards ---------- */
.grid{display:grid; gap:16px}
.g2{grid-template-columns:1fr}
@media(min-width:720px){.g2{grid-template-columns:1fr 1fr}}
.g3{grid-template-columns:1fr}
@media(min-width:620px){.g3{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.g3{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:22px; box-shadow:var(--shadow-sm)}
.card h3{margin-bottom:.45em}
.card p{margin:0; font-size:.93rem}
.card .big{font-family:Newsreader,serif; font-size:1.65rem; color:var(--brand-700); font-weight:500; letter-spacing:-.02em; display:block; margin-bottom:.1em; font-variant-numeric:tabular-nums}
.tag{display:inline-block; font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:.32em .7em; border-radius:999px; margin-bottom:12px}
.tag-house{background:var(--brand-100); color:var(--brand-700)}
.tag-partner{background:var(--accent-100); color:var(--accent-700)}

/* ---------- steps ---------- */
.steps{counter-reset:s; display:grid; gap:14px; margin-top:8px}
@media(min-width:900px){.steps{grid-template-columns:repeat(4,1fr)}}
.step{counter-increment:s; position:relative; padding:24px 20px 20px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius)}
.step::before{content:counter(s); position:absolute; top:-14px; left:20px; width:28px; height:28px; border-radius:50%; background:var(--brand-700); color:var(--surface); display:grid; place-items:center; font-size:.8rem; font-weight:700; font-family:Inter,sans-serif}
@media (prefers-color-scheme: dark){.step::before{color:#07201C}}
.step h3{margin-bottom:.35em}
.step p{margin:0; font-size:.9rem}

/* ---------- eligibility ---------- */
.elig{background:linear-gradient(180deg,var(--brand-050),var(--surface)); border:1px solid var(--brand-300); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow-md)}
@media (prefers-color-scheme: dark){.elig{background:linear-gradient(180deg,var(--brand-050),var(--surface-2)); border-color:var(--brand-100)}}
.elig .eh{padding:clamp(22px,3.4vw,32px) clamp(18px,3vw,32px) 0}
.elig .eh h2{margin-bottom:.3em}
.elig .tscroll{border:none; border-radius:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin-top:20px; background:transparent}
.elig table{min-width:420px}
.elig caption{display:none}
.elig tbody tr:nth-child(odd){background:color-mix(in srgb,var(--surface) 70%, transparent)}
.elig tbody tr:hover{background:var(--brand-100)}
.elig .ef{padding:clamp(20px,3vw,28px) clamp(18px,3vw,32px)}
.elig .ef p:last-of-type{margin-bottom:0}
.note{font-size:.845rem; color:var(--ink-400); line-height:1.6; border-left:2px solid var(--accent-600); padding-left:14px; margin-top:18px}

/* ---------- estimator ---------- */
.est{display:grid; gap:0; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--surface); box-shadow:var(--shadow-md)}
@media(min-width:880px){.est{grid-template-columns:1.05fr .95fr}}
.est-ctl{padding:clamp(22px,3.5vw,34px)}
.est-out{padding:clamp(22px,3.5vw,34px); background:var(--brand-900); color:#EAF2EF; border-top:1px solid var(--line)}
@media(min-width:880px){.est-out{border-top:none; border-left:1px solid var(--line)}}
@media (prefers-color-scheme: dark){.est-out{background:var(--surface-3)}}
.field{margin-bottom:26px}
.field:last-child{margin-bottom:0}
.flab{display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:12px}
.flab .l{font-size:.78rem; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-400)}
.flab .v{font-family:Newsreader,serif; font-size:1.7rem; font-weight:500; color:var(--brand-700); letter-spacing:-.02em; font-variant-numeric:tabular-nums}
input[type=range]{-webkit-appearance:none; appearance:none; width:100%; height:26px; background:transparent; cursor:pointer; display:block; margin:0}
input[type=range]::-webkit-slider-runnable-track{height:6px; border-radius:99px; background:var(--surface-3); border:1px solid var(--line)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; appearance:none; width:24px; height:24px; margin-top:-10px; border-radius:50%; background:var(--accent-600); border:3px solid var(--surface); box-shadow:0 1px 6px rgba(0,0,0,.28)}
input[type=range]::-moz-range-track{height:6px; border-radius:99px; background:var(--surface-3); border:1px solid var(--line)}
input[type=range]::-moz-range-thumb{width:20px; height:20px; border-radius:50%; background:var(--accent-600); border:3px solid var(--surface); box-shadow:0 1px 6px rgba(0,0,0,.28)}
.scale{display:flex; justify-content:space-between; font-size:.73rem; color:var(--ink-400); margin-top:4px; font-variant-numeric:tabular-nums}
.ro{display:flex; justify-content:space-between; align-items:baseline; gap:14px; padding:13px 0; border-bottom:1px solid rgba(255,255,255,.12)}
@media (prefers-color-scheme: dark){.ro{border-bottom-color:var(--line)}}
.ro:last-of-type{border-bottom:none}
.ro .rl{font-size:.86rem; color:#A9C3BC}
@media (prefers-color-scheme: dark){.ro .rl{color:var(--ink-400)}}
.ro .rv{font-family:Newsreader,serif; font-size:1.3rem; font-weight:500; letter-spacing:-.02em; font-variant-numeric:tabular-nums; color:#fff; white-space:nowrap}
@media (prefers-color-scheme: dark){.ro .rv{color:var(--ink-900)}}
.ro.lead .rv{font-size:1.95rem; color:var(--accent-400)}
.est-out .btn{width:100%; margin-top:20px}
.fineprint{font-size:.76rem; line-height:1.55; color:#8FAAA3; margin:16px 0 0}
@media (prefers-color-scheme: dark){.fineprint{color:var(--ink-400)}}

/* ---------- industries ---------- */
.ind{display:grid; gap:12px; grid-template-columns:1fr}
@media(min-width:560px){.ind{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.ind{grid-template-columns:repeat(3,1fr)}}
.ic{display:block; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:18px; transition:border-color .16s ease, transform .12s ease}
.ic:hover{text-decoration:none; border-color:var(--brand-500); transform:translateY(-2px)}
.ic .n{font-weight:600; color:var(--ink-900); font-size:.97rem; display:flex; align-items:center; gap:9px}
.ic .n svg{flex:0 0 auto; color:var(--brand-500)}
.ic .d{font-size:.845rem; color:var(--ink-500); margin-top:8px; line-height:1.55}
.ic .d b{color:var(--brand-700); font-weight:600; font-variant-numeric:tabular-nums}

/* ---------- faq ---------- */
.faq{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer; list-style:none; padding:20px 38px 20px 0; position:relative; font-weight:600; font-size:1.02rem; color:var(--ink-900); line-height:1.45}
summary::-webkit-details-marker{display:none}
summary{list-style:none}
.faq summary::after{content:""; position:absolute; right:6px; top:28px; width:9px; height:9px; border-right:2px solid var(--ink-400); border-bottom:2px solid var(--ink-400); transform:rotate(45deg); transition:transform .18s ease}
.faq details[open] summary::after{transform:rotate(-135deg); top:31px}
.faq details .ans{padding:0 0 22px; max-width:78ch}
.faq details .ans p{margin:0 0 .8em; font-size:.955rem}
.faq details .ans p:last-child{margin-bottom:0}

/* ---------- closing ---------- */
.close{background:var(--brand-900); color:#EAF2EF; border-radius:var(--radius); padding:clamp(34px,5.5vw,60px) clamp(22px,4vw,54px); text-align:center}
@media (prefers-color-scheme: dark){.close{background:var(--surface-2); border:1px solid var(--line)}}
.close h2{color:#fff; margin-bottom:.3em}
@media (prefers-color-scheme: dark){.close h2{color:var(--ink-900)}}
.close p{color:#A9C3BC; max-width:52ch; margin:0 auto 26px}
@media (prefers-color-scheme: dark){.close p{color:var(--ink-500)}}
.close .cta-row{justify-content:center; margin:0}

/* ---------- footer ---------- */
footer{background:var(--brand-900); color:#B9CFC9; padding:clamp(44px,6vw,70px) 0 110px; border-top:1px solid var(--line)}
@media(min-width:720px){footer{padding-bottom:44px}}
@media (prefers-color-scheme: dark){footer{background:var(--surface-2)}}
footer .wm{color:#fff}
@media (prefers-color-scheme: dark){footer .wm{color:var(--ink-900)}}
.fgrid{display:grid; gap:30px; grid-template-columns:1fr 1fr; margin:30px 0 34px}
@media(min-width:860px){.fgrid{grid-template-columns:repeat(4,1fr)}}
.fcol h4{font-family:Inter,sans-serif; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:#7FA299; margin:0 0 14px; font-weight:700}
@media (prefers-color-scheme: dark){.fcol h4{color:var(--ink-400)}}
.fcol a{display:block; color:#B9CFC9; font-size:.885rem; padding:4px 0}
@media (prefers-color-scheme: dark){.fcol a{color:var(--ink-500)}}
.fcol a:hover{color:#fff}
@media (prefers-color-scheme: dark){.fcol a:hover{color:var(--ink-900)}}
.fbase{border-top:1px solid rgba(255,255,255,.12); padding-top:24px; font-size:.8rem; line-height:1.65; color:#88A69E}
@media (prefers-color-scheme: dark){.fbase{border-top-color:var(--line); color:var(--ink-400)}}
.fbase p{color:inherit; font-size:inherit}
.fbase strong{color:#DCEFE9}
@media (prefers-color-scheme: dark){.fbase strong{color:var(--ink-700)}}

/* ---------- sticky mobile ---------- */
.sticky{position:fixed; left:0; right:0; bottom:0; z-index:70; display:flex; gap:10px; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:color-mix(in srgb,var(--surface) 94%, transparent); backdrop-filter:blur(14px); border-top:1px solid var(--line)}
@media(min-width:720px){.sticky{display:none}}
.sticky .btn{flex:1}
@media (prefers-reduced-motion: reduce){*{animation:none!important; transition:none!important}}

/* ---------- additions for the multi-page build ---------- */
.skip{position:absolute; left:-9999px; top:0; background:var(--surface); color:var(--ink-900); padding:10px 16px; border:1px solid var(--line); border-radius:var(--radius-sm); z-index:200}
.skip:focus{left:12px; top:10px}
.mmenu{position:relative; flex:0 0 auto}
@media(min-width:1000px){.mmenu{display:none}}
.mmenu>summary{display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border:1px solid var(--line); border-radius:999px; cursor:pointer; color:var(--ink-900); background:var(--surface)}
.mmenu>summary svg{display:block}
.mpanel{position:absolute; right:0; top:calc(100% + 13px); min-width:210px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-md); padding:8px; z-index:90}
.mpanel a{display:block; padding:9px 12px; font-size:.93rem; font-weight:500; color:var(--ink-700); border-radius:var(--radius-sm)}
.mpanel a:hover{background:var(--surface-2); color:var(--brand-500); text-decoration:none}
.page-head{padding-top:clamp(36px,5vw,60px); padding-bottom:clamp(28px,4vw,44px); background-image:var(--hero-grad); border-bottom:1px solid var(--line)}
.page-head h1{max-width:20ch; margin-bottom:.34em}
.crumb{font-size:.8rem; color:var(--ink-400); margin:0 0 18px}
.crumb a{color:var(--ink-400)}
.crumb a:hover{color:var(--brand-500)}
.crumb span{margin:0 .5em}
.glance{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden}
@media(min-width:760px){.glance{grid-template-columns:repeat(4,1fr)}}
.glance div{background:var(--surface); padding:16px 14px}
.glance .gk{font-size:.72rem; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-400); font-weight:600}
.glance .gv{font-size:1rem; font-weight:600; color:var(--ink-900); margin-top:.35em; font-variant-numeric:tabular-nums; line-height:1.35}
.prose{max-width:74ch}
.prose h2{margin-top:1.6em}
.prose h2:first-child{margin-top:0}
.prose h3{margin-top:1.8em; margin-bottom:.5em}
.prose ul,.prose ol{color:var(--ink-500); padding-left:1.25em; margin:0 0 1.05em}
.prose li{margin-bottom:.5em}
.prose li::marker{color:var(--brand-500)}
ul.plain{list-style:none; padding-left:0}
ul.plain li{position:relative; padding-left:1.3em; color:var(--ink-500); margin-bottom:.55em}
ul.plain li::before{content:""; position:absolute; left:0; top:.62em; width:7px; height:7px; border-radius:2px; background:var(--accent-600)}
.callout{border:1px solid var(--brand-300); background:var(--brand-050); border-radius:var(--radius); padding:clamp(18px,3vw,26px); margin:0 0 24px}
@media (prefers-color-scheme: dark){.callout{border-color:var(--brand-100); background:var(--brand-050)}}
.callout p:last-child{margin-bottom:0}
.rail{display:grid; gap:16px; grid-template-columns:1fr}
@media(min-width:860px){.rail{grid-template-columns:1.35fr .65fr; align-items:start}}
.dl{border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--surface)}
.dl div{display:flex; flex-wrap:wrap; gap:4px 16px; padding:12px 18px; border-bottom:1px solid var(--line)}
.dl div:last-child{border-bottom:none}
.dl dt{font-weight:500; color:var(--ink-700); flex:1 1 44%; margin:0}
.dl dd{margin:0; flex:1 1 44%; color:var(--ink-900); font-weight:500; font-variant-numeric:tabular-nums}
.form{border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); padding:clamp(20px,3.4vw,30px); box-shadow:var(--shadow-sm)}
.form label{display:block; font-size:.78rem; font-weight:600; letter-spacing:.09em; text-transform:uppercase; color:var(--ink-400); margin:0 0 7px}
.form .fi{margin-bottom:18px}
.form input,.form select,.form textarea{width:100%; font:inherit; font-size:.97rem; color:var(--ink-900); background:var(--surface-2); border:1px solid var(--line); border-radius:var(--radius-sm); padding:.68em .85em}
.form textarea{min-height:94px; resize:vertical}
.form input:focus,.form select:focus,.form textarea:focus{outline:2.5px solid var(--accent-600); outline-offset:2px}
.form .btn{width:100%}
.reslist{display:grid; gap:14px; grid-template-columns:1fr}
@media(min-width:680px){.reslist{grid-template-columns:1fr 1fr}}
.rc{display:block; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:20px; transition:border-color .16s ease, transform .12s ease}
.rc:hover{text-decoration:none; border-color:var(--brand-500); transform:translateY(-2px)}
.rc .big{font-family:Newsreader,serif; font-size:1.55rem; color:var(--brand-700); font-weight:500; letter-spacing:-.02em; display:block; font-variant-numeric:tabular-nums}
.rc .t{display:block; font-weight:600; color:var(--ink-900); margin:.35em 0 .3em; font-size:1rem; line-height:1.35}
.rc .s{display:block; font-size:.86rem; color:var(--ink-500); line-height:1.55}
.anchors{display:flex; flex-wrap:wrap; gap:8px; margin:0 0 6px}
.anchors a{font-size:.83rem; font-weight:500; color:var(--ink-700); border:1px solid var(--line); border-radius:999px; padding:.4em .9em; background:var(--surface)}
.anchors a:hover{text-decoration:none; border-color:var(--brand-500); color:var(--brand-500)}
.ind-sec{border-top:1px solid var(--line); padding-top:clamp(30px,4vw,44px); margin-top:clamp(30px,4vw,44px); scroll-margin-top:84px}
.ind-sec:first-of-type{border-top:none; padding-top:0; margin-top:0}
.tfile{border-left:2px solid var(--accent-600); padding-left:14px; font-size:.93rem; color:var(--ink-500)}
.tfile strong{color:var(--ink-900)}
.err{text-align:center; padding:clamp(60px,10vw,120px) 0}
.err .code{font-family:Newsreader,serif; font-size:clamp(3.4rem,13vw,6rem); color:var(--brand-700); line-height:1; letter-spacing:-.03em}
.mt0{margin-top:0}
.mb0{margin-bottom:0}
.sec-tight{padding-top:clamp(34px,4.5vw,52px)}

/* ---------- 360px safety ---------- */
@media(max-width:430px){
  .rc .big{font-size:1.28rem}
  .card .big{font-size:1.42rem}
  .ro.lead .rv{font-size:1.6rem}
  .ro .rv{font-size:1.14rem}
  .flab .v{font-size:1.4rem}
  .anchors a{font-size:.78rem; padding:.36em .75em}
  .glance .gv{font-size:.95rem}
  .err .code{font-size:clamp(3rem,16vw,4.4rem)}
}
.prose p,.prose li,.card p,.ic .d,.dl dd,.glance .gv,.fbase p,.rc .s{overflow-wrap:anywhere}
code{font-size:.92em; background:var(--surface-3); padding:.1em .35em; border-radius:4px; overflow-wrap:anywhere}
img,svg,table{max-width:100%}
.tscroll table{max-width:none}