/* Northbridge shared design system — the single source of truth for layout,
   spacing, and typography. Page-level <style> blocks must NOT redefine these
   classes; doing so silently overrides this file (page CSS loads later) and
   was previously causing inconsistent sizing across the site. */

/* Declared on html:root (specificity 0,1,1) rather than :root (0,1,0) so a
   stray third-party `:root{--nb-gold:...}` injected later in <head> cannot
   silently override the palette. A leftover WPCode snippet was doing exactly
   that and repainting components in the wrong colours. */
html:root{
  --nb-black:#0a0a0a; --nb-charcoal:#161513; --nb-charcoal2:#1e1c19;
  --nb-gold:#c9a227; --nb-gold2:#e6c158; --nb-gold-dim:#8a6f22;
  --nb-cream:#f3ede0; --nb-muted:#a89f8d; --nb-line:rgba(230,193,88,.18);
  --nb-gutter:40px;
}

/* ---------- Layout ---------- */
.nb-wrap{max-width:1180px; margin:0 auto; padding:0 var(--nb-gutter);}
.nb-sec{position:relative; padding:88px 0; background:var(--nb-black);}
.nb-sec--tight{padding:56px 0;}
.nb-sec--alt{background:var(--nb-charcoal);}

/* ---------- Typography ---------- */
.nb-kicker{color:var(--nb-gold2); font-weight:700; letter-spacing:.14em; text-transform:uppercase; font-size:.74rem; margin-bottom:12px; display:block; font-family:'Inter',Arial,sans-serif;}
.nb-sec h2{font-size:clamp(1.5rem,2.4vw,2.05rem); color:#fff; margin:0 0 14px; font-weight:600; line-height:1.25; font-family:'Fraunces',Georgia,serif;}
.nb-lead, .nb-sec p.nb-lead{color:var(--nb-muted); font-size:.98rem; line-height:1.7; max-width:620px; font-family:'Inter',Arial,sans-serif;}

/* ---------- Buttons ---------- */
.nb-btn{display:inline-flex; align-items:center; gap:9px; background:var(--nb-gold); color:#1a1200; padding:13px 26px; border-radius:100px; font-weight:700; font-size:.92rem; text-decoration:none; box-shadow:0 4px 14px rgba(201,162,39,.22); transition:transform .2s ease, box-shadow .2s ease; font-family:'Inter',Arial,sans-serif;}
.nb-btn:hover{transform:translateY(-2px); box-shadow:0 8px 20px rgba(201,162,39,.3);}
.nb-btn--ghost{background:transparent; border:1.5px solid rgba(230,193,88,.5); color:#fff; box-shadow:none;}
.nb-btn--ghost:hover{background:rgba(230,193,88,.08); transform:none;}

/* ---------- Lists ---------- */
.nb-check-list{list-style:none; padding:0; margin:22px 0;}
.nb-check-list li{display:flex; gap:11px; padding:8px 0; color:var(--nb-cream); font-size:.94rem; line-height:1.5; align-items:flex-start; font-family:'Inter',Arial,sans-serif;}
.nb-check-list svg{flex-shrink:0; margin-top:3px;}

/* ---------- Cards ---------- */
.nb-feature{background:var(--nb-charcoal2); border:1px solid var(--nb-line); border-radius:16px; padding:34px 32px; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;}
.nb-feature:hover{transform:translateY(-4px); box-shadow:0 16px 36px rgba(0,0,0,.4); border-color:var(--nb-gold);}
.nb-feature__icon{width:44px; height:44px; border-radius:12px; background:rgba(230,193,88,.1); display:flex; align-items:center; justify-content:center; margin-bottom:16px;}
.nb-feature__icon svg{width:22px; height:22px; stroke:var(--nb-gold2); fill:none;}
.nb-feature__icon svg[fill]:not([fill="none"]){fill:var(--nb-gold2);}
.nb-feature h3{color:#fff; font-size:1rem; margin:0 0 8px; font-family:'Fraunces',Georgia,serif;}
.nb-feature p{color:var(--nb-muted); font-size:.87rem; line-height:1.6; margin:0; font-family:'Inter',Arial,sans-serif;}

/* ---------- Testimonial grid (nbt- prefix avoids collision with the
   leftover WPCode landing-page CSS, which defines its own .nb-testi) ------ */
body .nbt-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:22px;}
body .nbt-card{background:var(--nb-charcoal2); border:1px solid var(--nb-line); border-radius:16px; padding:30px 28px; display:flex; flex-direction:column; transition:transform .25s ease, border-color .25s ease;}
body .nbt-card:hover{transform:translateY(-4px); border-color:var(--nb-gold);}
body .nbt-stars{color:var(--nb-gold2); letter-spacing:2px; font-size:.95rem; margin-bottom:14px;}
body .nbt-quote{font-family:'Fraunces',Georgia,serif; font-style:italic; color:#f3ede0; font-size:1rem; line-height:1.6; margin:0 0 20px; flex:1;}
body .nbt-author{display:flex; align-items:center; gap:12px; margin-top:auto;}
body .nbt-avatar{width:40px; height:40px; border-radius:50%; background:rgba(230,193,88,.14); border:1px solid var(--nb-line); color:var(--nb-gold2); display:flex; align-items:center; justify-content:center; font-family:'Fraunces',Georgia,serif; font-weight:700; font-size:.9rem; flex-shrink:0;}
body .nbt-name{font-weight:700; color:#fff; font-size:.88rem; font-family:'Inter',Arial,sans-serif; line-height:1.3;}
body .nbt-meta{color:var(--nb-muted); font-size:.78rem; font-family:'Inter',Arial,sans-serif; line-height:1.3;}
body .nbt-feature{background:var(--nb-charcoal); border:1px solid var(--nb-line); border-radius:22px; padding:44px; display:grid; grid-template-columns:170px 1fr; gap:36px; align-items:center; margin-bottom:26px;}
body .nbt-feature img{border-radius:14px; box-shadow:0 16px 34px rgba(0,0,0,.5); width:100%; display:block;}
body .nbt-feature .nbt-quote{font-size:1.2rem; margin-bottom:16px;}
@media (max-width:760px){
  body .nbt-feature{grid-template-columns:1fr; padding:28px; gap:22px;}
  body .nbt-card{padding:26px 22px;}
}

/* ---------- Testimonial (legacy single card) ---------- */
.nb-testi{background:var(--nb-charcoal); border:1px solid var(--nb-line); border-radius:22px; padding:44px; display:grid; grid-template-columns:170px 1fr; gap:36px; align-items:center;}
.nb-testi img{border-radius:14px; box-shadow:0 16px 34px rgba(0,0,0,.5); width:100%;}
.nb-testi blockquote{font-family:'Fraunces',Georgia,serif; font-size:1.2rem; font-style:italic; color:#fff; line-height:1.55; margin:0 0 14px;}
.nb-testi cite{font-style:normal; font-weight:700; color:var(--nb-muted); font-size:.84rem; font-family:'Inter',Arial,sans-serif;}

/* ---------- Lead form nested in the hero card ----------
   The form sits inside .nb-hero__form-card, which already provides the card
   framing, so strip the form's own duplicate card styling (card-in-a-card). */
.nb-hero__form-card .nblg-funnel{background:none; border:none; padding:0; box-shadow:none; margin:0; max-width:none;}
.nb-hero__form-card .nblg-funnel__header p{margin-bottom:16px;}
.nb-hero__form-card .nblg-form{gap:12px;}
.nb-hero__form-card .nblg-row{gap:5px;}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  :root{--nb-gutter:32px;}
}
@media (max-width:760px){
  :root{--nb-gutter:22px;}
  .nb-sec{padding:56px 0;}
  .nb-sec--tight{padding:40px 0;}
  .nb-testi{grid-template-columns:1fr; padding:28px; gap:24px;}
  .nb-feature{padding:26px 22px;}
}
