/* ============================================================
   7Sardar — v3 skin
   Layers the homepage (index.html) design language onto every
   other page. Load AFTER landing.css / blog.css.
   ============================================================ */
:root{--lime:oklch(0.85 0.17 143);--sand:oklch(0.85 0.1 76);--night:oklch(0.175 0.026 162);--night-2:oklch(0.235 0.038 165);--night-3:oklch(0.295 0.045 166);--disp:'Bricolage Grotesque','Hanken Grotesk',system-ui,sans-serif;--ease:cubic-bezier(.22,1,.36,1)}

/* display typography — the strongest v3 signature */
h1,h2,h3,.ctaband h2,.sec-head h2,.b-hero h1,.b-item h2,.a-head h1{font-family:var(--disp);letter-spacing:-0.03em}
.sec-head h2,.b-hero h1{font-weight:800}

/* section rhythm */
.sec{padding:78px 0}
.sec-head{margin-bottom:44px}
.sec-head .kicker{color:var(--green);font-size:12.5px;letter-spacing:.12em}

/* dark hero band, matching the homepage */
.lhero{background:var(--night);color:oklch(0.94 0.014 155);padding:56px 0 68px;position:relative}
.lhero p,.lhero span,.lhero small,.lhero li,.lhero label,.lhero strong{color:oklch(0.86 0.018 155)}
.lhero h2,.lhero h3,.lhero h4,.lhero b{color:#fff}
.lhero h1{color:#fff;font-size:clamp(34px,4.8vw,54px)}
.lhero h1 .accent{color:var(--lime)}
.lhero p,.lhero .hero-sub,.lhero p.lede{color:oklch(0.84 0.018 155)}
.lhero .eyebrow{color:var(--lime);background:oklch(1 0 0 / .08);border-color:oklch(1 0 0 / .18)}
.lhero .hero-roles span{color:oklch(0.9 0.02 155);background:oklch(1 0 0 / .08);border-color:oklch(1 0 0 / .14)}
.lhero .btn-ghost{color:#fff;border-color:oklch(1 0 0 / .28)}
.lhero .btn-ghost:hover{background:oklch(1 0 0 / .1);border-color:oklch(1 0 0 / .45);color:#fff}
.lhero .lhero-badge,.lhero .card,.lhero form{color:var(--ink)}
.lhero .lhero-badge b{color:var(--ink)}
.lhero .lhero-badge span{color:var(--muted)}
.lhero .accent,.lhero h1 .accent,.lhero .hero-copy h1 .accent{color:var(--lime)}
.lhero a:not(.btn){color:var(--lime)}
.lhero a:not(.btn):hover{color:#fff}
.lhero .lhero-media{border-color:oklch(1 0 0 / .16)}
/* the breadcrumb strip sits directly above the dark hero */
.crumb{padding:18px 0 16px}

/* CTA band — the homepage contact panel treatment */
.ctaband{background:linear-gradient(160deg,var(--night-2),var(--night));border-radius:32px;padding:56px 48px}
.ctaband h2{letter-spacing:-0.03em}
.ctaband p{color:oklch(0.84 0.018 155)}
.ctaband .btn-primary{background:var(--lime);border-color:var(--lime);color:oklch(0.2 0.03 165)}
.ctaband .btn-primary:hover{background:#fff;border-color:#fff;color:oklch(0.2 0.03 165)}

/* cards & link grids pick up the softer v3 radii */
.linkcard,.faq details,.card{border-radius:16px}

/* header: French labels are longer — keep the row from breaking */
.logo-text span{white-space:nowrap}
@media (max-width:1080px) and (min-width:901px){.nav-links{gap:14px}}
html[lang="fr-CA"] .nav-links,html[lang="fr"] .nav-links{gap:18px}
@media (max-width:1040px){html[lang="fr-CA"] .nav-links,html[lang="fr"] .nav-links{display:none}html[lang="fr-CA"] .menu-btn,html[lang="fr"] .menu-btn{display:flex}}

@media (max-width:980px){
  .sec{padding:58px 0}
  .lhero{padding:40px 0 52px}
  .ctaband{padding:40px 26px;border-radius:24px}
}