/* ============================================================
   JK Accounting Group — "Atlas" website styles
   Tokens, type, and components lifted verbatim from the
   design system (jk-brand-showcase.html). Petrol teal +
   warm bronze on soft ivory. Content renders with zero JS;
   any script only enhances.
   ============================================================ */
:root{
  --teal-50:#EAF1F2; --teal-100:#CFE0E2; --teal-200:#A6C4C8; --teal-300:#6F9DA4;
  --teal-400:#3F767F; --teal-500:#245C66; --teal-600:#1A4C55; --teal-700:#163F47;
  --teal-800:#123841; --teal-900:#0D2A31; --teal-950:#091F24;
  --bronze-50:#F7F0E6; --bronze-100:#EFDDC6; --bronze-200:#E1C195; --bronze-300:#CFA268;
  --bronze-400:#B98545; --bronze-500:#9C6A39; --bronze-600:#7E5430; --bronze-700:#61411F; --bronze-800:#49321A;
  --greige-50:#F6F3EC; --greige-100:#EDE9DF; --greige-150:#E5E0D4; --greige-200:#DAD4C6;
  --greige-300:#C5BEAD; --greige-400:#A19986; --greige-500:#6F6857; --greige-600:#534D40;
  --greige-700:#3C372E; --greige-800:#28241D; --greige-900:#1A1713;
  --sage-50:#E9F2EF; --sage-100:#D2E5E0; --sage-300:#84B4A8; --sage-500:#3E7D6E; --sage-600:#2E6457; --sage-700:#234E44;
  --success:#2F8F5E; --success-text:#1F7049; --success-bg:#E3F1EA;
  --warning:#B8841C; --warning-text:#8A6111; --warning-bg:#F6ECD2;
  --error:#B23A3A; --error-text:#8C2A2A; --error-bg:#F6E3DF;
  --info:#2F5E8C; --info-text:#214668; --info-bg:#E3EAF3;
  --bg-page:#F6F3EC; --surface:#FFFFFF; --paper:#FBF8F2; --bg-inverse:#123841; --bg-inverse-deep:#0D2A31;
  --text-primary:#0D2A31; --text-body:#22201A; --text-muted:#6F6857;
  --text-on-dark:#ECE6DA; --text-on-dark-muted:#9FB3B6; --text-gold:#7E5430;
  --brand:#123841; --accent:#9C6A39; --border:#C5BEAD; --border-subtle:#DAD4C6;
  --serif:"Source Serif 4", Georgia, "Times New Roman", serif;
  --sans:"IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --shadow-sm:0 1px 2px rgba(9,38,44,0.07), 0 2px 6px rgba(9,38,44,0.06);
  --shadow-md:0 2px 4px rgba(9,38,44,0.06), 0 6px 16px rgba(9,38,44,0.09);
  --shadow-lg:0 4px 8px rgba(9,38,44,0.07), 0 14px 32px rgba(9,38,44,0.11);
  --shadow-xl:0 8px 16px rgba(9,38,44,0.09), 0 28px 56px rgba(9,38,44,0.15);
  --maxw:1180px; --gutter:clamp(20px,5vw,40px); --appbar-h:64px;
  --ease-out:cubic-bezier(0.22,1,0.36,1);
  --z-appbar:100; --z-scrim:200; --z-drawer:300;
}
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth;}}
body{margin:0; background:var(--bg-page); color:var(--text-body); font-family:var(--sans); font-size:17px; line-height:1.6; font-weight:400; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; padding-top:var(--appbar-h);}
h1,h2,h3,h4,h5{font-family:var(--serif); font-weight:600; color:var(--text-primary); margin:0; text-wrap:balance; letter-spacing:-0.012em;}
p{margin:0; text-wrap:pretty;}
a{color:inherit;}
img,svg{display:block; max-width:100%; height:auto;}
ul{margin:0;}
::selection{background:var(--bronze-200); color:var(--teal-900);}
:focus-visible{outline:2px solid var(--bronze-400); outline-offset:3px; border-radius:4px;}

/* skip link */
.skip{position:absolute; left:-9999px; top:0; z-index:400; background:var(--teal-800); color:var(--text-on-dark); font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; padding:12px 18px; border-radius:0 0 10px 0;}
.skip:focus{left:0;}

.wrap{max-width:var(--maxw); margin:0 auto; padding-inline:var(--gutter);}
.dsec{padding-block:clamp(60px,8vw,104px);}
.sec-eyebrow{font-family:var(--mono); font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent); margin-bottom:18px;}
.sec-head{max-width:720px; margin-bottom:clamp(40px,6vw,60px);}
.sec-head h2{font-size:clamp(30px,5vw,46px); line-height:1.08;}
.sec-head .lede{margin-top:18px; font-size:clamp(17px,2.2vw,19px); line-height:1.62; color:var(--text-muted); max-width:64ch;}
.sec-head.center{margin-inline:auto; text-align:center;}
.sec-head.center .lede{margin-inline:auto;}
.on-dark .sec-head h2{color:var(--text-on-dark);}
.on-dark .sec-head .lede{color:#bcd0d2;}
.on-dark .sec-eyebrow{color:var(--bronze-300);}
.ledger{height:2px; width:46px; background:var(--accent); border:0; margin:0 0 24px; border-radius:2px;}
.center .ledger{margin-inline:auto;}

/* ============================================================
   App bar / primary navigation (real links; CSS-only mobile menu)
   ============================================================ */
.nav-toggle{position:absolute; width:1px; height:1px; opacity:0; overflow:hidden; clip:rect(0 0 0 0); pointer-events:none;}
.appbar{position:fixed; top:0; left:0; right:0; height:var(--appbar-h); z-index:var(--z-appbar); background:rgba(18,56,65,0.92); backdrop-filter:saturate(140%) blur(10px); -webkit-backdrop-filter:saturate(140%) blur(10px); border-bottom:1px solid rgba(236,230,218,0.12);}
.appbar .wrap{height:100%; display:flex; align-items:center; justify-content:space-between; gap:18px;}
.brandmark{display:flex; align-items:center; gap:11px; text-decoration:none; flex:0 0 auto;}
.brandmark img{height:38px; width:auto;}
.brandmark .bm-fallback{display:flex; align-items:center; gap:11px;}
.brandmark .bm-fallback svg{width:30px; height:30px;}
.brandmark b{font-family:var(--serif); font-weight:600; font-size:16px; color:var(--text-on-dark); letter-spacing:-0.01em;}
.primary-nav{display:flex; align-items:center; gap:6px;}
.primary-nav a{font-family:var(--sans); font-size:14.5px; font-weight:500; color:var(--text-on-dark); text-decoration:none; padding:9px 13px; border-radius:8px; transition:background .18s, color .18s; opacity:.92; white-space:nowrap;}
.primary-nav a:hover{background:rgba(236,230,218,0.09); opacity:1;}
.primary-nav .nav-cta-m{display:none;} /* mobile-only CTA inside the menu */
.nav-right{display:flex; align-items:center; gap:14px; flex:0 0 auto;}
.lang-toggle{display:inline-flex; align-items:center; font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; border:1px solid rgba(236,230,218,0.28); border-radius:999px; overflow:hidden;}
.lang-toggle a{padding:6px 11px; color:var(--text-on-dark-muted); text-decoration:none; transition:background .18s, color .18s;}
.lang-toggle a[aria-current="true"]{background:rgba(236,230,218,0.14); color:var(--text-on-dark);}
.lang-toggle a:hover{color:var(--text-on-dark);}
.nav-cta{font-family:var(--sans); font-size:13.5px; font-weight:600; background:var(--accent); color:#fff; text-decoration:none; padding:9px 16px; border-radius:9px; transition:background .18s; white-space:nowrap;}
.nav-cta:hover{background:var(--bronze-600);}
.menu-btn{display:none; align-items:center; justify-content:center; width:42px; height:42px; background:transparent; border:1px solid rgba(236,230,218,0.3); color:var(--text-on-dark); border-radius:9px; cursor:pointer;}
.menu-btn svg{width:20px; height:20px;}
.menu-btn .x{display:none;}
.scrim{display:none;}

@media (max-width:920px){
  .menu-btn{display:inline-flex;}
  .primary-nav{position:fixed; top:var(--appbar-h); left:0; right:0; flex-direction:column; align-items:stretch; gap:2px; background:linear-gradient(180deg,#10333b,#0b232a); border-bottom:1px solid rgba(236,230,218,0.12); padding:14px var(--gutter) 22px; transform:translateY(-12px); opacity:0; visibility:hidden; transition:opacity .26s var(--ease-out), transform .26s var(--ease-out), visibility .26s; box-shadow:var(--shadow-xl);}
  .primary-nav a{padding:13px 12px; font-size:16px; border-radius:9px;}
  .primary-nav .nav-cta-m{display:block; margin-top:8px; background:var(--accent); color:#fff; text-align:center; font-weight:600;}
  .nav-right .nav-cta{display:none;} /* the bar CTA folds into the menu on mobile */
  .nav-toggle:checked ~ .appbar .primary-nav,
  .appbar:has(.nav-toggle:checked) .primary-nav{transform:none; opacity:1; visibility:visible;}
  #nav-toggle:checked ~ .scrim{display:block; position:fixed; inset:var(--appbar-h) 0 0; z-index:calc(var(--z-appbar) - 1); background:rgba(9,31,36,0.4);}
}
/* the checkbox lives before .appbar so sibling selector works */
#nav-toggle:checked ~ .appbar .primary-nav{transform:none; opacity:1; visibility:visible;}
#nav-toggle:checked ~ .appbar .menu-btn .x{display:block;}
#nav-toggle:checked ~ .appbar .menu-btn .bars{display:none;}
@media (prefers-reduced-motion:reduce){.primary-nav{transition:none;}}

/* ============================================================
   Buttons (verbatim from system)
   ============================================================ */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:9px; font-family:var(--sans); font-size:14.5px; font-weight:600; border-radius:10px; padding:11px 19px; border:1px solid transparent; cursor:pointer; text-decoration:none; transition:background .18s, border-color .18s, transform .12s; text-align:center;}
.btn:active{transform:translateY(1px);}
.btn.primary{background:var(--teal-800); color:#F4F1E9;} .btn.primary:hover{background:var(--teal-900);}
.btn.secondary{background:transparent; color:var(--teal-800); border-color:var(--teal-800);} .btn.secondary:hover{background:var(--teal-50);}
.btn.ghost{background:transparent; color:var(--teal-700);} .btn.ghost:hover{background:var(--greige-100);}
.btn.cta{background:var(--accent); color:#fff;} .btn.cta:hover{background:var(--bronze-600);}
.btn.sm{padding:8px 14px; font-size:13px;} .btn.lg{padding:14px 26px; font-size:16px;}
.btn[disabled]{opacity:.5; cursor:not-allowed;}
.on-dark .btn.secondary,.hero .btn.secondary,.cta-band .btn.secondary{color:var(--text-on-dark); border-color:rgba(236,230,218,0.45);}
.on-dark .btn.secondary:hover,.hero .btn.secondary:hover,.cta-band .btn.secondary:hover{background:rgba(236,230,218,0.08); border-color:rgba(236,230,218,0.7);}

.badge{font-family:var(--sans); font-size:12px; font-weight:600; padding:4px 11px; border-radius:999px; display:inline-flex; align-items:center; gap:6px;}
.badge.navy{background:var(--teal-50); color:var(--teal-700);}
.badge.brass{background:var(--bronze-50); color:var(--bronze-600);}

/* ============================================================
   Hero
   ============================================================ */
.hero{position:relative; overflow:hidden; color:var(--text-on-dark); background:radial-gradient(1200px 620px at 78% -10%, rgba(62,125,110,0.32), transparent 60%), radial-gradient(900px 520px at 6% 112%, rgba(156,106,57,0.18), transparent 55%), linear-gradient(158deg,#143b44 0%,#102f37 48%,#0c252b 100%); padding-block:clamp(56px,10vw,104px);}
.hero .wrap{position:relative; z-index:1;}
.hero-logo{width:min(150px,30vw); margin-bottom:clamp(26px,4vw,40px);}
.hero-grid{display:grid; gap:clamp(30px,5vw,64px);}
.hero-content{min-width:0;}
.hero-portrait{display:none;}
@media (min-width:960px){
  .hero-grid{grid-template-columns:minmax(0,1fr) clamp(290px,30vw,380px); align-items:center;}
  .hero-portrait{display:block; justify-self:end; width:100%;}
  .hero-portrait img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:20px; box-shadow:var(--shadow-xl); outline:1px solid rgba(236,230,218,0.16); outline-offset:-1px;}
}
.hero .kicker{font-family:var(--mono); font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--bronze-300); margin:0 0 22px;}
.hero h1{color:var(--text-on-dark); font-size:clamp(34px,6vw,62px); line-height:1.05; letter-spacing:-0.02em; max-width:20ch; font-weight:600;}
.hero h1 .em{color:var(--bronze-300); font-style:italic;}
.hero .positioning{margin-top:24px; max-width:58ch; font-size:clamp(17px,2.3vw,20px); line-height:1.62; color:var(--text-on-dark); opacity:.92;}
.hero .hero-cta{margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; align-items:center;}
.hero .hero-trust{margin-top:22px; font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-on-dark-muted);}
.statband-hero{margin-top:clamp(40px,6vw,56px); padding-top:30px; border-top:1px solid rgba(236,230,218,0.18); display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.statband-hero .s .fig{font-family:var(--serif); font-size:clamp(28px,4vw,44px); font-weight:600; color:var(--text-on-dark); line-height:1; letter-spacing:-0.02em;}
.statband-hero .s .fig sup{color:var(--bronze-300); font-size:0.5em; vertical-align:super;}
.statband-hero .s .lbl{margin-top:10px; font-size:12.5px; color:var(--text-on-dark-muted); line-height:1.4;}
@media (max-width:640px){.statband-hero{grid-template-columns:repeat(2,1fr); gap:22px;}}

/* ============================================================
   "At a glance" intro band
   ============================================================ */
.atglance{display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(32px,6vw,72px); align-items:start;}
@media (max-width:760px){.atglance{grid-template-columns:1fr; gap:34px;}}
.atglance .idea{font-family:var(--serif); font-size:clamp(24px,3.6vw,34px); line-height:1.3; color:var(--text-primary); letter-spacing:-0.012em;}
.atglance .idea .accent{color:var(--accent);} .atglance .idea em{font-style:italic; color:var(--teal-600);}
.atglance .idea + p{margin-top:20px; font-size:17px; line-height:1.7; color:var(--text-muted);}
.svc-list{list-style:none; margin:0; padding:0; border-top:1px solid var(--border-subtle);}
.svc-list li{display:flex; align-items:center; gap:14px; padding:15px 0; border-bottom:1px solid var(--border-subtle); font-size:16px; color:var(--text-body);}
.svc-list li .ic{flex:0 0 auto; color:var(--teal-600);}
.svc-list li .ic svg{width:22px; height:22px;}
.svc-list li b{font-weight:600; color:var(--text-primary);}

/* ============================================================
   Services grid (svc-card)
   ============================================================ */
.card-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media (max-width:860px){.card-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.card-grid{grid-template-columns:1fr;}}
.svc-card{background:var(--surface); border:1px solid var(--border-subtle); border-radius:14px; padding:26px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; transition:transform .2s var(--ease-out), box-shadow .2s var(--ease-out);}
.svc-card:hover{transform:translateY(-3px); box-shadow:var(--shadow-md);}
.svc-card .ci{width:44px; height:44px; border-radius:11px; background:var(--teal-50); color:var(--teal-700); display:grid; place-items:center; margin-bottom:18px;}
.svc-card .ci svg{width:24px; height:24px;}
.svc-card h3{font-size:19px; margin-bottom:8px;}
.svc-card p{font-size:14.5px; color:var(--text-muted); line-height:1.6; margin-bottom:16px;}
.svc-card .lk{margin-top:auto; font-family:var(--mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent);}

/* ============================================================
   Why-us pillars + process steps
   ============================================================ */
.pillars{display:grid; grid-template-columns:repeat(2,1fr); gap:32px 64px;}
.pillar h3{font-size:20px; margin-bottom:8px; padding-top:16px; position:relative;}
.pillar h3::before{content:""; position:absolute; top:0; left:0; width:28px; height:2px; background:var(--bronze-400); border-radius:2px;}
.pillar p{font-size:15.5px; line-height:1.62; color:var(--text-muted); max-width:46ch;}
.on-dark .pillar h3{color:var(--text-on-dark);}
.on-dark .pillar p{color:#bcd0d2;}
@media (max-width:680px){.pillars{grid-template-columns:1fr; gap:28px;}}

.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:26px; margin-top:8px;}
@media (max-width:760px){.steps{grid-template-columns:1fr 1fr; gap:28px;}}
@media (max-width:460px){.steps{grid-template-columns:1fr;}}
.step .n{font-family:var(--serif); font-size:28px; font-weight:600; color:var(--bronze-400); line-height:1;}
.step .bar{height:2px; background:var(--border-subtle); margin:14px 0 16px; position:relative;}
.step .bar::before{content:""; position:absolute; left:0; top:0; height:2px; width:28px; background:var(--accent);}
.step h3{font-size:17px; margin-bottom:7px;}
.step p{font-size:14px; color:var(--text-muted); line-height:1.55;}
.on-dark .step h3{color:var(--text-on-dark);}
.on-dark .step p{color:#bcd0d2;}
.on-dark .step .bar{background:rgba(236,230,218,0.18);}

/* ============================================================
   Proof: testimonials + stat motif + imagery band
   ============================================================ */
.proof-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:stretch;}
@media (max-width:860px){.proof-grid{grid-template-columns:1fr;}}
.testi-col{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
@media (max-width:560px){.testi-col{grid-template-columns:1fr;}}
.testi-card{background:linear-gradient(160deg,#143b44,#0d272e); border-radius:16px; padding:26px; display:flex; flex-direction:column;}
.testi-card .stars{color:var(--bronze-300); letter-spacing:3px; font-size:13px; margin-bottom:14px;}
.testi-card blockquote{font-family:var(--serif); font-size:18px; font-weight:600; color:var(--text-on-dark); line-height:1.4; margin:0;}
.testi-card .by{margin-top:auto; padding-top:16px; font-family:var(--mono); font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:#9FB3B6;}
.stat-motif{background:linear-gradient(160deg,#143b44,#0d272e); border-radius:16px; padding:30px; display:flex; flex-direction:column; justify-content:center;}
.stat-motif .fig{font-family:var(--serif); font-size:clamp(46px,7vw,60px); font-weight:600; color:var(--text-on-dark); line-height:1; letter-spacing:-0.02em;}
.stat-motif .fig sup{color:var(--bronze-300); font-size:0.45em; vertical-align:super;}
.stat-motif .u{height:2px; width:40px; background:var(--bronze-400); margin:16px 0 12px;}
.stat-motif .lbl{font-size:15px; color:#bcd0d2; line-height:1.5; max-width:26ch;}

.img-band{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
@media (max-width:760px){.img-band{grid-template-columns:1fr 1fr;} .img-band .frame:last-child{display:none;}}
.frame{aspect-ratio:4/5; border-radius:14px; overflow:hidden; position:relative; box-shadow:var(--shadow-md); background:#16373d;}
.frame img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.frame .tone{position:absolute; inset:0; pointer-events:none;}
.frame.duo .tone{background:linear-gradient(158deg, rgba(18,56,65,0.42), rgba(13,42,49,0.82)); mix-blend-mode:multiply;}
.frame.duo::after{content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(120% 80% at 30% 18%, rgba(207,162,104,0.16), transparent 60%); mix-blend-mode:screen;}
.frame .cap{position:absolute; left:14px; bottom:12px; font-family:var(--mono); font-size:9.5px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(236,230,218,0.92); text-shadow:0 1px 6px rgba(0,0,0,0.5); z-index:2;}

/* ============================================================
   Team
   ============================================================ */
.team-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media (max-width:860px){.team-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.team-grid{grid-template-columns:1fr;}}
.team-card{display:flex; gap:18px; align-items:center; background:var(--surface); border:1px solid var(--border-subtle); border-radius:16px; padding:18px; box-shadow:var(--shadow-sm); height:100%;}
.team-card .ph{width:104px; height:130px; border-radius:12px; overflow:hidden; flex:0 0 auto; background:var(--greige-100);}
.team-card .ph img{width:100%; height:100%; object-fit:cover;}
.team-card .ph.placeholder{display:grid; place-items:center; background:radial-gradient(120px 90px at 70% 10%,rgba(62,125,110,0.4),transparent 60%),linear-gradient(150deg,#143b44,#0c252b);}
.team-card .ph.placeholder svg{width:54px; height:54px;}
.team-card h3{font-size:18px;}
.team-card .role{color:var(--text-gold); font-size:13px; margin:3px 0 9px;}
.team-card .langs{font-family:var(--mono); font-size:10.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--text-muted);}
.team-card p{font-size:13.5px; color:var(--text-muted); line-height:1.5; margin-top:9px;}

/* ============================================================
   Pricing
   ============================================================ */
.pricing-row{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; align-items:start;}
@media (max-width:860px){.pricing-row{grid-template-columns:1fr;}}
.ptier{background:var(--surface); border:1px solid var(--border-subtle); border-radius:16px; padding:30px 28px; display:flex; flex-direction:column; box-shadow:var(--shadow-sm);}
.ptier.feat{background:var(--paper); border-color:var(--bronze-300); box-shadow:var(--shadow-lg);}
.ptier .feat-tag{align-self:flex-start; font-family:var(--mono); font-size:10px; letter-spacing:0.12em; text-transform:uppercase; color:#fff; background:var(--accent); padding:5px 11px; border-radius:999px; margin-bottom:16px;}
.ptier .tier{font-family:var(--serif); font-size:23px; font-weight:600; color:var(--text-primary);}
.ptier .price{font-family:var(--serif); font-size:40px; font-weight:600; color:var(--teal-800); margin:5px 0; letter-spacing:-0.02em;}
.ptier .price span{font-family:var(--sans); font-size:15px; font-weight:400; color:var(--text-muted);}
.ptier .tagline{font-size:14px; color:var(--text-muted); line-height:1.5; padding-bottom:16px; border-bottom:1px solid var(--border-subtle); margin-bottom:16px;}
.ptier ul{list-style:none; margin:0 0 20px; padding:0; display:flex; flex-direction:column; gap:10px;}
.ptier li{font-size:14px; color:var(--text-body); padding-left:24px; position:relative; line-height:1.45;}
.ptier li::before{content:""; position:absolute; left:0; top:6px; width:11px; height:7px; border-left:2px solid var(--accent); border-bottom:2px solid var(--accent); transform:rotate(-45deg);}
.ptier .btn{margin-top:auto; align-self:stretch;}
.pricing-note{margin-top:24px; text-align:center; font-size:14px; color:var(--text-muted);}

/* ============================================================
   FAQ (native <details>, visible without JS)
   ============================================================ */
.faq{max-width:780px; margin:0 auto; border-top:1px solid var(--border-subtle);}
.faq details{border-bottom:1px solid var(--border-subtle);}
.faq summary{list-style:none; cursor:pointer; padding:22px 44px 22px 2px; position:relative; font-family:var(--serif); font-size:19px; font-weight:600; color:var(--text-primary); line-height:1.35;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:""; position:absolute; right:6px; top:27px; width:13px; height:13px; border-right:2px solid var(--accent); border-bottom:2px solid var(--accent); transform:rotate(45deg); transition:transform .22s var(--ease-out);}
.faq details[open] summary::after{transform:rotate(-135deg);}
.faq .ans{padding:0 44px 24px 2px; font-size:15.5px; line-height:1.65; color:var(--text-muted);}
@media (prefers-reduced-motion:reduce){.faq summary::after{transition:none;}}

/* ============================================================
   Lead form
   ============================================================ */
.contact-grid{display:grid; grid-template-columns:0.85fr 1.15fr; gap:clamp(32px,5vw,56px); align-items:start;}
@media (max-width:840px){.contact-grid{grid-template-columns:1fr; gap:36px;}}
.contact-aside .lede{font-size:17px; line-height:1.7; color:var(--text-muted); margin-top:18px; max-width:42ch;}
.contact-points{list-style:none; margin:26px 0 0; padding:0; display:flex; flex-direction:column; gap:14px;}
.contact-points li{display:flex; gap:13px; align-items:flex-start; font-size:15px; line-height:1.5; color:var(--text-body);}
.contact-points li svg{flex:0 0 auto; width:20px; height:20px; color:var(--teal-600); margin-top:2px;}
.form-card{background:var(--surface); border:1px solid var(--border-subtle); border-radius:18px; padding:clamp(26px,4vw,38px); box-shadow:var(--shadow-md);}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.field{margin:0;}
.field.full{grid-column:1 / -1;}
.field label{display:block; font-size:13.5px; font-weight:600; color:var(--text-primary); margin-bottom:7px;}
.field label .req{color:var(--accent);}
.field input,.field select,.field textarea{width:100%; font-family:var(--sans); font-size:15px; color:var(--text-body); background:var(--surface); border:1px solid var(--border); border-radius:10px; padding:11px 13px;}
.field textarea{resize:vertical; min-height:110px; line-height:1.55;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--teal-500); box-shadow:0 0 0 3px rgba(156,106,57,0.18);}
.field .help{font-size:12.5px; color:var(--text-muted); margin-top:6px;}
.lang-pref{grid-column:1 / -1; display:flex; gap:10px; flex-wrap:wrap;}
.lang-pref legend{font-size:13.5px; font-weight:600; color:var(--text-primary); margin-bottom:9px; padding:0;}
.lang-pref fieldset{border:0; padding:0; margin:0; width:100%;}
.lang-pref .opts{display:flex; gap:10px; flex-wrap:wrap;}
.lang-pref label{display:inline-flex; align-items:center; gap:9px; border:1px solid var(--border); border-radius:10px; padding:10px 15px; font-size:14.5px; cursor:pointer; transition:border-color .18s, background .18s;}
.lang-pref input{accent-color:var(--teal-700); width:16px; height:16px;}
.lang-pref label:has(input:checked){border-color:var(--teal-600); background:var(--teal-50);}
.form-actions{grid-column:1 / -1; display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:4px;}
.form-actions .fine{font-size:12.5px; color:var(--text-muted); line-height:1.5; max-width:34ch;}

/* ============================================================
   Final CTA band
   ============================================================ */
.cta-band{color:var(--text-on-dark); text-align:center; padding-block:clamp(70px,11vw,116px); background:radial-gradient(900px 460px at 50% -20%, rgba(62,125,110,0.28), transparent 60%), radial-gradient(700px 360px at 50% 130%, rgba(156,106,57,0.16), transparent 55%), linear-gradient(160deg,#143b44,#0b242a);}
.cta-band .mk{width:clamp(86px,16vw,104px); height:auto; margin:0 auto 26px;}
.cta-band h2{color:var(--text-on-dark); font-size:clamp(30px,5.4vw,50px); line-height:1.08; max-width:18ch; margin-inline:auto;}
.cta-band .tag{margin:20px auto 0; max-width:50ch; font-size:clamp(16px,2.3vw,19px); line-height:1.6; color:var(--text-on-dark); opacity:.92;}
.cta-band .actions{margin-top:32px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
.cta-band .loc{margin-top:30px; font-family:var(--mono); font-size:11.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-on-dark-muted);}

/* ============================================================
   Footer
   ============================================================ */
.site-footer{background:var(--bg-inverse-deep); color:var(--text-on-dark-muted); padding-block:clamp(48px,7vw,72px) 28px;}
.footer-top{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:clamp(28px,5vw,56px);}
@media (max-width:820px){.footer-top{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer-top{grid-template-columns:1fr;}}
.footer-brand img{height:54px; width:auto; margin-bottom:18px;}
.footer-brand p{font-size:14.5px; line-height:1.65; color:var(--text-on-dark-muted); max-width:34ch;}
.footer-col h4{font-family:var(--mono); font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-on-dark-muted); margin-bottom:16px;}
.footer-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px;}
.footer-col a{font-size:14.5px; color:var(--text-on-dark); text-decoration:none; opacity:.86; transition:opacity .18s;}
.footer-col a:hover{opacity:1; color:var(--bronze-300);}
.footer-bottom{margin-top:clamp(40px,6vw,60px); padding-top:24px; border-top:1px solid rgba(236,230,218,0.12); display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; justify-content:space-between; font-family:var(--mono); font-size:11px; letter-spacing:0.06em;}
.footer-bottom .ll{text-transform:uppercase;}

/* ============================================================
   Scroll-reveal (enhancement only; visible by default)
   ============================================================ */
.reveal{opacity:1; transform:none;}
@media (prefers-reduced-motion:no-preference){
  html.js .reveal{opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease-out), transform .6s var(--ease-out);}
  html.js .reveal.in{opacity:1; transform:none;}
}
