:root{
  --stone:#E3E3E1; --stone-2:#DAD9D5; --ink:#1A1A1A;
  --ink-70:rgba(26,26,26,.7); --ink-45:rgba(26,26,26,.45); --ink-15:rgba(26,26,26,.13);
  --forest:#4F6F52; --forest-dark:#3A5340; --forest-tint:#E4EEE0;
  --card:#EDEDEB; --white:#FFFFFF; --amber:#B8863E; --amber-tint:#F3E7D2; --crash:#B5473C; --muted:#5A5A5A;
  --serif:'Fraunces', serif; --sans:'IBM Plex Sans', sans-serif; --mono:'IBM Plex Mono', monospace;
  --maxw:1180px; --radius:16px; --radius-sm:10px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
[id]{scroll-margin-top:90px;}
body{margin:0; background:var(--stone); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;}
img{max-width:100%; display:block;}
a{color:inherit;}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 32px;}
@media (max-width:720px){ .wrap{padding:0 22px;} }

/* ---- shared bits ---- */
.eyebrow-pill{
  display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:12px;
  letter-spacing:.06em; text-transform:uppercase; color:var(--forest-dark);
  background:var(--forest-tint); border:1px solid rgba(79,111,82,.25); border-radius:999px;
  padding:7px 14px 7px 10px;
}
.eyebrow-pill .dot{width:7px; height:7px; border-radius:50%; background:var(--forest); flex:0 0 auto;}
.btn{font-family:var(--sans); font-weight:600; font-size:15px; display:inline-flex; align-items:center; gap:8px;
  padding:14px 24px; border-radius:3px; text-decoration:none; border:1px solid transparent; cursor:pointer;
  transition:transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease;}
.btn-primary{background:var(--ink); color:var(--white); box-shadow:0 1px 0 rgba(0,0,0,.05);}
.btn-primary:hover{background:var(--forest-dark); transform:translateY(-1px);}
.btn-ghost{border-color:var(--ink-15); color:var(--ink); background:var(--white);}
.btn-ghost:hover{border-color:var(--ink); transform:translateY(-1px);}
.cta-row{display:flex; gap:14px; flex-wrap:wrap; align-items:center;}

h1,h2,h3,h4{font-family:var(--serif); margin:0; font-weight:600; letter-spacing:-.01em;}
.lede{font-size:19px; color:var(--ink-70); max-width:560px; line-height:1.65;}
.grad-word{background:linear-gradient(100deg, var(--forest-dark), var(--forest) 55%, var(--amber)); -webkit-background-clip:text; background-clip:text; color:transparent;}

/* ---- nav ---- */
header.lnav{position:sticky; top:0; z-index:60; backdrop-filter:blur(10px); background:rgba(245,244,241,.86); border-bottom:1px solid var(--ink-15);}
.lnav-row{display:flex; align-items:center; justify-content:space-between; height:76px; gap:20px;}
.lnav .brand{display:flex; align-items:center; gap:10px; font-family:var(--mono); font-weight:600; font-size:14px; letter-spacing:.03em; text-decoration:none; color:var(--ink);}
.lnav .brand img{height:32px; width:auto; display:block;}
.lnav-links{display:flex; gap:30px; align-items:center; font-size:14.5px;}
.lnav-links a{text-decoration:none; color:var(--ink-70); transition:color .15s;}
.lnav-links a:hover{color:var(--forest-dark);}
@media (max-width:860px){ .lnav-links{display:none;} }

/* ---- flow sections (the "flowed" narrative rhythm) ---- */
.flow{position:relative; padding:118px 0;}
.flow + .flow{padding-top:0;}
.flow-divider{height:1px; background:linear-gradient(90deg, transparent, var(--ink-15) 20%, var(--ink-15) 80%, transparent); margin:0 auto; max-width:var(--maxw);}
@media (max-width:860px){ .flow{padding:72px 0;} }

/* ---- corner-bracket grid marks (Website 31's section framing) ---- */
.flow, .landing-block{ --bracket:var(--ink-15); }
.landing-block.bg-ink, .landing-block.bg-forest{ --bracket:rgba(255,255,255,.22); }
.flow::before, .flow::after, .landing-block::before, .landing-block::after{
  content:''; position:absolute; left:32px; width:22px; height:22px; border-left:1px solid var(--bracket); pointer-events:none;
}
.flow::before, .landing-block::before{ top:40px; border-top:1px solid var(--bracket); }
.flow::after, .landing-block::after{ bottom:40px; border-bottom:1px solid var(--bracket); }
@media (max-width:720px){ .flow::before, .flow::after, .landing-block::before, .landing-block::after{display:none;} }

/* ---- landing blocks (full-bleed statement sections) ---- */
.landing-block{padding:110px 0; position:relative;}
.landing-block.bg-ink{background:var(--ink); color:var(--white);}
.landing-block.bg-forest{background:var(--forest); color:var(--white);}
@media (max-width:860px){ .landing-block{padding:72px 0;} }
.eyebrow-dark{font-family:var(--mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--forest-tint); margin-bottom:20px; display:block;}
.landing-block.bg-forest .eyebrow-dark{color:rgba(255,255,255,.85);}
.lb-statement{font-family:var(--serif); font-weight:600; font-size:clamp(32px,4.6vw,52px); line-height:1.14; margin:0 0 22px; max-width:820px;}
.lb-body{font-size:clamp(16px,1.6vw,18.5px); line-height:1.7; max-width:620px; color:rgba(255,255,255,.72); margin:0;}
.lb-link{font-family:var(--mono); font-size:14px; font-weight:600; letter-spacing:.02em; text-decoration:none; border-bottom:1.5px solid currentColor; padding-bottom:4px; display:inline-block; color:#fff; margin-top:36px;}
.lb-link:hover{opacity:.75;}

/* ---- modular hex diagram (six-capability puzzle, dark variant) ---- */
.combo-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:50px; align-items:center; margin-top:56px;}
@media (max-width:920px){ .combo-grid{grid-template-columns:1fr; gap:32px;} }
.puzzle-wrap{position:relative; width:100%; max-width:520px; margin:0 auto;}
.puzzle-hint{text-align:center; font-family:var(--mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-top:14px;}
.piece{cursor:pointer; transform-box:fill-box; transform-origin:center; transition:transform .3s ease;}
.piece rect{transition:fill .3s ease, stroke .3s ease, stroke-width .3s ease, filter .3s ease;}
.piece text{transition:fill .3s ease;}
.piece.active{transform:scale(1.06);}
.piece.active rect{fill:var(--forest-dark); stroke:var(--amber); stroke-width:2.5; filter:drop-shadow(0 10px 18px rgba(0,0,0,.4));}
.piece.active text{fill:#fff !important;}
.stud{transition:r .3s ease, fill .3s ease;}
.stud.active{fill:#fff; r:14;}
.detail-panel{
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.16); border-radius:6px; padding:32px 30px;
  min-height:260px; display:flex; flex-direction:column; justify-content:center;
}
.dp-idle .dp-num{display:none;}
.dp-num{font-family:var(--mono); font-size:11px; color:rgba(255,255,255,.5); letter-spacing:.05em; margin-bottom:10px;}
.dp-title{font-family:var(--serif); font-size:24px; font-weight:600; margin-bottom:14px; color:#fff;}
.dp-body{font-size:14px; color:rgba(255,255,255,.72); line-height:1.65; margin-bottom:20px;}
.dp-idle-note{font-size:13px; color:rgba(255,255,255,.5); font-style:italic; margin:0;}
.dp-link{display:inline-flex; align-items:center; gap:8px; font-family:var(--mono); font-size:12.5px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--amber); text-decoration:none; padding-bottom:2px; border-bottom:1.5px solid transparent; transition:border-color .15s ease, gap .15s ease;}
.dp-link:hover{border-bottom-color:var(--amber); gap:12px;}

.flow-grid{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center;}
.flow-grid.reverse > *:first-child{order:2;}
.flow-grid.reverse > *:last-child{order:1;}
@media (max-width:860px){
  .flow-grid{grid-template-columns:1fr; gap:36px;}
  .flow-grid.reverse > *:first-child{order:1;}
  .flow-grid.reverse > *:last-child{order:2;}
}
.flow-kicker{font-family:var(--mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--forest-dark); margin-bottom:16px; display:block;}
.flow-copy h2{font-size:clamp(28px,3.4vw,40px); line-height:1.12; margin-bottom:18px;}
.flow-copy p{font-size:16.5px; color:var(--ink-70); line-height:1.7; max-width:520px;}
.flow-copy p + p{margin-top:14px;}
.flow-link{display:inline-flex; align-items:center; gap:8px; margin-top:22px; font-weight:600; color:var(--forest-dark); text-decoration:none; font-size:14.5px;}
.flow-link:hover{color:var(--ink);}

/* ---- hero ---- */
.hero{position:relative; padding:120px 0 70px; min-height:82vh; display:flex; align-items:center;}
@media (max-width:860px){ .hero{min-height:0; padding:80px 0 56px;} }
.hero-inner{position:relative; max-width:800px;}
.hero h1{font-size:clamp(42px,6vw,72px); line-height:1.04; margin-top:22px;}
.hero .lede{margin-top:24px; font-size:20px; max-width:600px;}

/* ---- opener brand lockup (SBO™ / Solv Build Office™) ---- */
.opener-brand{display:flex; align-items:baseline; gap:14px; flex-wrap:wrap;}
.opener-sbo{font-family:var(--serif); font-weight:700; font-size:clamp(26px,3.6vw,38px); color:var(--forest-dark); letter-spacing:-.01em;}
.opener-brand-sub{font-family:var(--mono); font-size:12.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted);}
.hero-stats{display:flex; gap:40px; margin-top:64px; flex-wrap:wrap;}
.hstat b{display:block; font-family:var(--serif); font-size:28px; color:var(--ink);}
.hstat span{font-family:var(--mono); font-size:11.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--muted);}

/* ---- stat boxes (bordered grid variant, used in the SBO™ opener) ---- */
.stat-boxes{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--ink-15); border:1px solid var(--ink-15); border-radius:6px; overflow:hidden; margin-top:56px;}
@media (max-width:920px){ .stat-boxes{grid-template-columns:repeat(3,1fr);} }
@media (max-width:560px){ .stat-boxes{grid-template-columns:1fr 1fr;} }
.sb-box{background:var(--card); padding:22px 18px; display:flex; flex-direction:column; gap:6px;}
.sb-box b{font-family:var(--serif); font-weight:700; font-size:clamp(20px,2.4vw,28px); color:var(--forest-dark); line-height:1;}
.sb-box span{font-family:var(--mono); font-size:10.5px; letter-spacing:.03em; text-transform:uppercase; color:var(--muted); line-height:1.35;}

/* ---- mission statement (value-chain block) ---- */
.mission-statement{font-family:var(--serif); font-weight:500; font-size:clamp(22px,3vw,32px); line-height:1.45; color:var(--forest-dark); max-width:820px; margin:0 auto;}

/* ---- approach headline (leads the page, right after the hero) ---- */
.approach-headline{font-size:clamp(30px,4.2vw,44px); line-height:1.14; max-width:900px;}

/* ---- soft visual cards used inside flow sections ---- */
.mosaic{display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.mosaic.mosaic-4col{grid-template-columns:repeat(4,1fr);}
@media (max-width:960px){ .mosaic.mosaic-4col{grid-template-columns:1fr 1fr;} }
@media (max-width:560px){ .mosaic.mosaic-4col{grid-template-columns:1fr;} }
.mosaic-card{background:var(--card); border:1px solid var(--ink-15); border-radius:var(--radius-sm); padding:20px; min-height:132px; display:flex; flex-direction:column; justify-content:space-between;}
.mosaic-card .mk{font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted);}
.mosaic-card h5{font-family:var(--serif); font-size:16px; margin:6px 0 0; font-weight:600;}
.mosaic-card p{font-size:12.5px; color:var(--ink-70); margin:6px 0 0; line-height:1.5;}

.cap-orbit{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
.cap-chip{background:var(--card); border:1px solid var(--ink-15); border-radius:var(--radius-sm); padding:16px 16px 14px; display:flex; gap:12px; align-items:flex-start;}
.cap-chip .cn{font-family:var(--mono); font-size:12px; color:var(--forest-dark); background:var(--forest-tint); width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex:0 0 auto;}
.cap-chip h5{font-size:14.5px; margin:0; font-weight:600; font-family:var(--sans);}
.cap-chip p{font-size:12px; color:var(--ink-70); margin:4px 0 0; line-height:1.5;}

/* ---- ontology-style diagram (Our Approach) ---- */
.ontology-diagram{display:grid; grid-template-columns:1fr 2fr 1fr; gap:28px; align-items:center; margin-top:56px;}
@media (max-width:860px){ .ontology-diagram{grid-template-columns:1fr; gap:20px;} }
.ontology-side{display:flex; flex-direction:column; align-items:center; gap:14px;}
.os-label{font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); text-align:center;}
.os-chips{display:flex; flex-direction:column; gap:8px; width:100%;}
.os-chip{background:var(--card); border:1px solid var(--ink-15); border-radius:999px; padding:9px 16px; font-size:13px; color:var(--ink-70); text-align:center;}
.os-arrow{font-family:var(--mono); font-size:24px; color:var(--forest); line-height:1;}
.arrow-v{display:none;}
@media (max-width:860px){ .arrow-h{display:none;} .arrow-v{display:block;} }

.ontology-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
.ont-cell{border:1px solid var(--ink-15); border-radius:var(--radius-sm); background:var(--card); padding:16px 14px; min-height:88px; display:flex; flex-direction:column; justify-content:center; gap:5px;}
.ont-cell .oc-name{font-family:var(--sans); font-weight:600; font-size:13.5px; color:var(--ink);}
.ont-cell .oc-tag{font-family:var(--mono); font-size:9.5px; letter-spacing:.03em; text-transform:uppercase; color:var(--muted);}
.ont-cell.core{background:var(--forest-dark); border-color:var(--forest-dark); align-items:center; justify-content:center; text-align:center;}
.ont-cell.core .oc-name{font-family:var(--serif); font-size:19px; color:var(--white); letter-spacing:0;}
.ont-cell.open{background:transparent; border-style:dashed; align-items:center; justify-content:center; text-align:center;}
.ont-cell.open .oc-name{color:var(--muted); font-size:12px; font-style:italic; font-weight:500;}
@media (max-width:560px){ .ont-cell{padding:12px 10px; min-height:72px;} .ont-cell .oc-name{font-size:12px;} }

/* ---- stats band ---- */
.stat-band{background:var(--ink); color:var(--white); border-radius:28px; margin:0 auto; max-width:calc(var(--maxw) + 64px); padding:64px 48px;}
.stat-band .wrap{padding:0;}
.stat-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:36px;}
@media (max-width:860px){ .stat-grid{grid-template-columns:repeat(2,1fr); gap:28px;} }
.stat-grid b{display:block; font-family:var(--serif); font-size:34px; background:linear-gradient(100deg,#fff,var(--forest-tint) 70%); -webkit-background-clip:text; background-clip:text; color:transparent;}
.stat-grid span{font-family:var(--mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:rgba(255,255,255,.55); display:block; margin-top:6px;}
.stat-head{max-width:520px; margin-bottom:40px;}
.stat-head span.flow-kicker{color:var(--forest-tint);}

.why-links{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
@media (max-width:860px){ .why-links{grid-template-columns:repeat(2,1fr);} }
@media (max-width:480px){ .why-links{grid-template-columns:1fr;} }
.why-link{display:flex; flex-direction:column; gap:22px; padding:26px 22px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:12px; text-decoration:none; transition:background .2s ease, transform .2s ease, border-color .2s ease;}
.why-link:hover{background:rgba(255,255,255,.12); transform:translateY(-4px); border-color:var(--amber);}
.wl-num{font-family:var(--mono); font-size:11px; letter-spacing:.06em; color:var(--amber);}
.wl-label{font-family:var(--serif); font-size:19px; font-weight:600; color:#fff; line-height:1.25;}
.wl-arrow{font-family:var(--mono); font-size:18px; color:var(--amber); margin-top:auto;}
.stat-head h3{color:var(--white); font-size:clamp(24px,2.8vw,32px);}

/* ---- process timeline ---- */
.timeline{display:grid; grid-template-columns:1fr 1fr; gap:28px; position:relative; margin-top:56px;}
@media (max-width:860px){ .timeline{grid-template-columns:1fr;} }
.tl-card{background:var(--card); border:1px solid var(--ink-15); border-radius:var(--radius); padding:30px 30px 26px;}
.tl-card .tk{font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; color:var(--forest-dark); display:block; margin-bottom:14px;}
.tl-card ol{margin:0; padding:0 0 0 20px; display:flex; flex-direction:column; gap:10px;}
.tl-card li{font-size:14.5px; color:var(--ink-70); line-height:1.55;}

/* ---- final cta ---- */
.final-cta{background:linear-gradient(135deg, var(--forest-dark), var(--forest) 65%, var(--amber)); border-radius:28px; margin:0 auto; max-width:calc(var(--maxw) + 64px); padding:80px 48px; text-align:center; color:var(--white);}
.final-cta h2{color:var(--white); font-size:clamp(30px,4vw,46px); line-height:1.1; max-width:640px; margin:0 auto 18px;}
.final-cta p{color:rgba(255,255,255,.85); max-width:520px; margin:0 auto 34px; font-size:16.5px;}
.final-cta .cta-row{justify-content:center;}
.final-cta .btn-primary{background:var(--ink);}
.final-cta .btn-ghost{background:transparent; border-color:rgba(255,255,255,.4); color:var(--white);}
.final-cta .btn-ghost:hover{border-color:var(--white);}

/* ---- our role: depth rings ---- */
.rings-wrap{position:relative; width:100%; max-width:380px; margin:0 auto;}
.ring{transition:stroke .25s ease, opacity .25s ease; cursor:pointer;}
.ring.dim{opacity:.4;}
.ring.active{stroke:var(--amber) !important;}
.depth-toggle{display:flex; gap:10px; margin-top:26px; justify-content:center; flex-wrap:wrap;}
.dt-btn{
  font-family:var(--mono); font-size:12.5px; text-transform:uppercase; letter-spacing:.04em;
  background:rgba(255,255,255,.06); border:1.5px solid rgba(255,255,255,.22); border-radius:20px; padding:10px 20px;
  cursor:pointer; color:rgba(255,255,255,.75); transition:all .15s;
}
.dt-btn:hover{border-color:rgba(255,255,255,.5);}
.dt-btn.active{background:var(--amber); border-color:var(--amber); color:var(--ink);}

.are-section{margin-top:70px;}
.are-head{text-align:center; margin-bottom:32px;}
.are-head h4{font-family:var(--serif); font-size:22px; font-weight:600; color:#fff;}
.are-icon-grid{display:grid; grid-template-columns:1fr 1fr; gap:40px;}
@media (max-width:760px){ .are-icon-grid{grid-template-columns:1fr; gap:28px;} }
.are-col-label{font-family:var(--mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; margin-bottom:16px; display:block;}
.are-col-label.yes{color:var(--forest-tint);}
.are-col-label.no{color:rgba(255,255,255,.45);}
.tag-row{display:flex; flex-wrap:wrap; gap:10px;}
.are-tag{display:flex; align-items:center; gap:8px; padding:10px 16px; border-radius:20px; font-family:var(--sans); font-size:13px; font-weight:500;}
.are-tag.yes{background:rgba(184,134,62,.16); color:var(--amber);}
.are-tag.no{background:rgba(255,255,255,.05); color:rgba(255,255,255,.5); border:1px solid rgba(255,255,255,.16);}
.are-tag svg{flex-shrink:0;}

/* ---- challenge flight-path chart ---- */
.chart-wrap{background:var(--card); border:1px solid var(--ink-15); border-radius:var(--radius-sm); padding:40px 30px 24px; margin:44px auto 0; max-width:87%;}
@media (max-width:760px){ .chart-wrap{max-width:100%;} }
.axis-label{font-family:var(--mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted);}
.axis-row{display:flex; justify-content:space-between;}
.axis-row .left, .axis-row .right{color:var(--forest-dark); font-weight:700;}

.route{transition:opacity .25s ease, stroke-width .25s ease; cursor:pointer;}
.route.dim{opacity:.18;}
.route.active{stroke-width:4.5;}
.checkpoints{transition:opacity .25s ease;}
.checkpoints.hidden{opacity:0; pointer-events:none;}
.cp-label{font-family:'IBM Plex Mono'; font-size:8.5px; letter-spacing:.3px;}
.cp-sub{font-family:'IBM Plex Sans'; font-size:7.5px;}

.cp-legend{display:flex; justify-content:center; gap:22px; margin-top:6px; flex-wrap:wrap;}
.cp-legend span{display:flex; align-items:center; gap:7px; font-family:var(--mono); font-size:10.5px; color:var(--muted);}
.cp-legend i{width:11px; height:11px; border-radius:50%; display:inline-block;}

.path-toggle{display:flex; gap:10px; justify-content:center; margin-top:28px; flex-wrap:wrap;}
.pt-btn{
  font-family:var(--mono); font-size:12px; text-transform:uppercase; letter-spacing:.03em;
  background:var(--white); border:1.5px solid var(--ink-15); border-radius:20px; padding:10px 18px;
  cursor:pointer; color:var(--ink-70); transition:all .15s; display:flex; align-items:center; gap:8px;
}
.pt-btn i{width:10px; height:10px; border-radius:50%; display:inline-block;}
.pt-btn:hover{border-color:var(--ink-45);}
.pt-btn.active{background:var(--ink); border-color:var(--ink); color:var(--white);}

.flight-detail{background:var(--white); border:1px solid var(--ink-15); border-radius:var(--radius-sm); padding:26px 28px; min-height:200px; display:flex; flex-direction:column; justify-content:center;}
.fd-title{font-family:var(--serif); font-size:19px; font-weight:600; margin-bottom:8px; color:var(--ink);}
.fd-body{font-size:14px; color:var(--ink-70); line-height:1.65; margin:0;}

.challenge-link-bar{display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:40px; padding:34px 42px; background:linear-gradient(120deg, var(--forest-dark), var(--forest) 55%, var(--amber)); border-radius:18px; text-decoration:none; box-shadow:0 16px 36px rgba(0,0,0,.32); transition:transform .2s ease, box-shadow .2s ease;}
.challenge-link-bar:hover{transform:translateY(-4px); box-shadow:0 22px 46px rgba(0,0,0,.4);}
.challenge-link-bar span:first-child{font-family:var(--serif); font-size:22px; font-weight:700; color:#fff; line-height:1.35;}
.challenge-link-bar .clb-arrow{font-family:var(--mono); font-size:24px; color:var(--forest-dark); width:56px; height:56px; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:transform .2s ease;}
.challenge-link-bar:hover .clb-arrow{transform:translateX(6px);}
@media (max-width:600px){ .challenge-link-bar{flex-direction:column; align-items:flex-start; gap:20px; padding:28px;} .challenge-link-bar span:first-child{font-size:19px;} }

/* ---- footer ---- */
footer.lfoot{background:var(--ink); border-top:1px solid rgba(255,255,255,.12); padding:26px 0; color:rgba(255,255,255,.4); font-family:var(--mono); font-size:11.5px;}
.lfoot-row{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px;}
.lfoot-brand{display:flex; align-items:center; gap:10px;}
.lfoot-brand img{height:20px; width:auto; border-radius:3px;}
.lfoot-links{display:flex; gap:18px;}
.lfoot-links a{text-decoration:none; color:rgba(255,255,255,.55);}
.lfoot-links a:hover{color:var(--forest-tint);}

/* ---- mobile toggle (simple) ---- */
.lnav-cta{display:flex; align-items:center; gap:14px;}
.lmobile-toggle{display:none; background:none; border:none; font-size:20px; cursor:pointer; color:var(--ink);}
@media (max-width:860px){ .lmobile-toggle{display:block;} }

/* ---- unified site header (shared with all standard pages) ---- */
header.site{position:sticky; top:0; z-index:60; backdrop-filter:blur(8px); background:rgba(227,227,225,.92); border-bottom:1px solid var(--ink-15);}
.nav-row{display:flex; align-items:center; justify-content:space-between; height:72px; gap:20px;}
@media (max-width:720px){ .nav-row{height:64px;} }
.brand{display:flex; align-items:center; gap:10px; font-family:var(--mono); font-weight:600; font-size:14px; letter-spacing:.04em; cursor:pointer; flex:0 0 auto; text-decoration:none;}
.brand .logo-chip{height:40px; width:40px; display:flex; align-items:center; justify-content:center;}
.brand .logo-chip img{height:34px; width:auto; display:block;}
nav.links{display:flex; gap:22px; font-size:13.5px; align-items:center;}
nav.links > a{text-decoration:none; color:var(--ink-70); transition:color .15s; white-space:nowrap; padding:4px 0;}
nav.links > a:hover{color:var(--forest-dark);}
nav.links > a.current{color:var(--forest-dark); font-weight:600;}
.nav-cta{flex:0 0 auto;}
@media (max-width:1080px){ nav.links{display:none;} }
.mobile-toggle{display:none; font-family:var(--mono); font-size:20px; background:none; border:none; cursor:pointer; color:var(--ink);}
@media (max-width:1080px){ .mobile-toggle{display:block;} }
.mobile-nav{display:none; flex-direction:column; padding-top:10px; padding-bottom:20px; border-top:1px solid var(--ink-15);}
.mobile-nav.open{display:flex;}
.mobile-nav a{padding:12px 4px; text-decoration:none; color:var(--ink-70); font-size:14.5px; border-bottom:1px solid var(--ink-15);}
.mobile-nav a.current{color:var(--forest-dark); font-weight:600;}
.mobile-nav .mn-group{font-family:var(--mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--forest-dark); padding:16px 4px 6px; border-bottom:none;}
.mobile-nav a.mn-sub{padding-left:18px; font-size:13.5px; color:var(--muted);}

/* ---- small-phone header safety (≤420px) ---- */
@media (max-width:420px){
.brand{gap:6px; font-size:12px;}
.brand .logo-chip{height:32px; width:32px;}
.brand .logo-chip img{height:26px;}
.brand .brand-suffix{display:none;}
.nav-cta .btn{padding:11px 16px; font-size:11.5px;}
.nav-row{gap:10px;}
}

/* ---- desktop dropdown ---- */
.nav-dropdown{position:relative; display:flex; align-items:center;}
.nav-parent-btn{
background:none; border:none; font-family:var(--sans); font-size:13.5px; color:var(--ink-70);
cursor:pointer; padding:4px 0; display:flex; align-items:center; gap:4px;
transition:color .15s; text-decoration:none;
}
.nav-parent-btn:hover, .nav-dropdown:hover .nav-parent-btn{color:var(--forest-dark);}
.nav-parent-btn .car{font-size:9px; transition:transform .15s;}
.nav-dropdown:hover .nav-parent-btn .car{transform:rotate(180deg);}
.nav-dropdown.current > .nav-parent-btn, .nav-dropdown.current > a.nav-parent-btn{color:var(--forest-dark); font-weight:600;}
.nav-dropdown-menu{
position:absolute; top:100%; left:50%; transform:translateX(-50%); margin-top:14px;
background:var(--white); border:1px solid var(--ink-15); border-radius:6px; padding:8px;
box-shadow:0 16px 32px -14px rgba(0,0,0,.22); min-width:190px;
opacity:0; visibility:hidden; transform:translateX(-50%) translateY(-6px); transition:opacity .15s, transform .15s, visibility .15s;
}
.nav-dropdown:hover .nav-dropdown-menu, .nav-dropdown.open .nav-dropdown-menu{
opacity:1; visibility:visible; transform:translateX(-50%) translateY(0);
}
.nav-dropdown-menu a{
display:block; padding:9px 12px; font-size:13px; color:var(--ink-70); text-decoration:none;
border-radius:4px; white-space:nowrap;
}
.nav-dropdown-menu a:hover{background:var(--forest-tint); color:var(--forest-dark);}
.nav-dropdown-menu a.current{color:var(--forest-dark); font-weight:600; background:var(--forest-tint);}

/* ---- nav-cta "Let's talk" dropdown: WhatsApp / Call / Email ---- */
.nav-cta{position:relative;}
.nav-cta-btn{display:inline-flex; align-items:center; gap:8px;}
.nav-cta-menu{left:auto; right:0; transform:translateY(-6px); min-width:236px;}
.nav-cta:hover .nav-cta-menu, .nav-cta.open .nav-cta-menu{transform:translateY(0);}
.nav-cta-menu a{display:flex; align-items:center; gap:10px;}
.nav-cta-menu .cta-chan{font-family:var(--mono); font-size:9.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--forest-dark); font-weight:700; flex:0 0 auto; width:64px;}

/* ---- contact-trio: WhatsApp / Call / Email button row (used on page CTAs) ---- */
.contact-trio{display:flex; gap:14px; margin-top:26px; flex-wrap:wrap;}

/* ---- GDPR cookie consent banner ---- */
.cookie-banner{display:none; background:var(--ink); color:rgba(255,255,255,.82); padding:16px 0; font-size:13px; line-height:1.6;}
.cookie-banner.show{display:block;}
.cookie-banner-inner{display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap;}
.cookie-banner p{margin:0; max-width:760px;}
.cookie-banner a{color:var(--forest-tint);}
.cookie-banner-actions{display:flex; gap:10px; flex:0 0 auto;}
.cookie-banner .btn{padding:9px 18px; font-size:11px;}
.cookie-banner .btn-ghost{border-color:rgba(255,255,255,.3); color:#fff;}
.cookie-banner .btn-primary{background:var(--forest);}
.cookie-banner .btn-primary:hover{background:var(--forest-tint); color:var(--ink);}
@media (max-width:720px){ .cookie-banner-inner{flex-direction:column; align-items:flex-start;} }