/* ============================================================
   NewToSaudi.com — Shared Design System v3.0
   All pages import this file. Page-specific CSS lives inline.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

/* === TOKENS === */
:root {
  /* Core palette */
  --navy:          #1B2A4A;
  --navy-90:       rgba(27,42,74,.9);
  --navy-light:    #253A5E;
  --navy-dark:     #111D33;
  --navy-deeper:   #0B1422;
  --gold:          #D4A853;
  --gold-light:    #E8C97A;
  --gold-dark:     #B8903F;
  --gold-muted:    rgba(212,168,83,.12);
  --white:         #FFFFFF;
  --off-white:     #FAF8F4;
  --cream:         #F2EEE5;
  --light-gray:    #EAE5DA;
  --mid-gray:      #E0DDD5;
  --border-gray:   #D6D3CB;
  --text-gray:     #8A8780;
  --text-mid:      #6B6860;
  --text-dark:     #2C2A25;
  --text-body:     #3D3B35;

  /* Layout */
  --max-w:       1380px;
  --nav-h:       80px;
  --section-gap: 8rem;

  /* Easing */
  --ease-out-expo:   cubic-bezier(0.16,1,0.3,1);
  --ease-out-quart:  cubic-bezier(0.25,1,0.5,1);
  --ease-spring:     cubic-bezier(0.34,1.56,0.64,1);

  /* Shadows */
  --shadow-sm:   0 1px 3px rgba(15,30,54,.08),0 1px 2px rgba(15,30,54,.06);
  --shadow-md:   0 4px 6px rgba(15,30,54,.06),0 10px 32px rgba(15,30,54,.08);
  --shadow-lg:   0 20px 50px rgba(15,30,54,.14);
  --shadow-gold: 0 0 0 1.5px rgba(212,168,83,.25);

  /* Radii */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 28px;
}

/* Ultra-wide */
@media(min-width:1600px) {
  :root { --max-w:1520px; --section-gap:9rem }
  h1 { font-size:5.4rem }
}

/* === RESET & BASE === */
*,*::before,*::after { margin:0; padding:0; box-sizing:border-box }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased }
body {
  font-family:'Plus Jakarta Sans',system-ui,-apple-system,sans-serif;
  color:var(--text-body); background:var(--off-white);
  line-height:1.7; overflow-x:hidden; font-size:16px
}
a { color:inherit; text-decoration:none; transition:color .25s }
img,svg { max-width:100%; display:block }
button { font-family:inherit; cursor:pointer }
::selection { background:var(--gold-muted); color:var(--navy) }
/* Shared JS hook */
.body-lock { overflow:hidden }

/* === TYPOGRAPHY === */
h1,h2,h3,h4 { color:var(--navy); font-weight:700; line-height:1.18 }
h1 { font-size:clamp(2rem,5vw,3.5rem); font-weight:800; letter-spacing:-.03em }
h2 { font-size:clamp(1.6rem,3.5vw,2.4rem); font-weight:700; letter-spacing:-.02em }
h3 { font-size:1.2rem; letter-spacing:-.01em }
p  { line-height:1.75; color:var(--text-body) }

/* === LAYOUT === */
.container { max-width:var(--max-w); margin:0 auto; padding:0 clamp(1.5rem,5vw,4rem) }

/* === GEOMETRIC TEXTURE === */
/* Applied to light sections and special containers */
.section,
.personas {
  background-image:
    repeating-linear-gradient(58deg,rgba(27,42,74,.018) 0,rgba(27,42,74,.018) 1px,transparent 0,transparent 72px),
    repeating-linear-gradient(-58deg,rgba(27,42,74,.012) 0,rgba(27,42,74,.012) 1px,transparent 0,transparent 72px)
}

/* === SECTION SYSTEM === */
.section    { padding:clamp(5rem,9vw,var(--section-gap)) 0; position:relative }
.section > .container { position:relative; z-index:1 }
.section-sm { padding:clamp(3rem,5vw,5rem) 0; position:relative }
.section-lg { padding:clamp(6rem,10vw,10rem) 0; position:relative }

/* Background variants */
.section--white    { background:#fff }
.section--off-white{ background:var(--off-white) }
.section--cream    { background-color:var(--cream) }
.section--navy {
  background-color:#060E1E;
  background-image:
    linear-gradient(140deg,#060E1E 0%,#0B1422 40%,#0F1C33 70%,#0A1020 100%),
    repeating-linear-gradient(58deg,rgba(255,255,255,.018) 0,rgba(255,255,255,.018) 1px,transparent 0,transparent 72px),
    repeating-linear-gradient(-58deg,rgba(255,255,255,.012) 0,rgba(255,255,255,.012) 1px,transparent 0,transparent 72px)
}
.section--navy h2,.section--navy h3,.section--navy p { color:#fff }
.section--navy .section-eyebrow { color:var(--gold) }

/* Section arch watermark */
.section-arch { position:absolute; pointer-events:none; z-index:0; opacity:.032; overflow:hidden }
.section-arch svg { display:block }
.section-arch--tr { top:-40px; right:-30px }
.section-arch--bl { bottom:-40px; left:-30px; transform:rotate(180deg) }
.section-arch--br { bottom:-20px; right:-20px; transform:scaleX(-1) }

/* === NAV === */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  transition:all .4s var(--ease-out-expo)
}
.nav--transparent { background:linear-gradient(180deg,rgba(0,0,0,.32) 0%,transparent 100%) }
.nav--solid {
  background:rgba(255,255,255,.97); backdrop-filter:blur(20px) saturate(1.2);
  -webkit-backdrop-filter:blur(20px) saturate(1.2);
  box-shadow:0 1px 0 rgba(15,30,54,.07)
}
/* Strip the .container wrapper inside nav — nav__inner handles all sizing */
.nav .container { max-width:none !important; padding:0 !important }

.nav__inner {
  display:flex; align-items:center; justify-content:space-between;
  height:var(--nav-h); max-width:var(--max-w); margin:0 auto;
  padding:0 clamp(1.5rem,4vw,4rem)
}
.nav__logo { display:flex; align-items:center; gap:.5rem; text-decoration:none; z-index:10 }
.nav__logo-primary { display:none }
.nav__logo-white   { display:block }
.nav--solid .nav__logo-primary { display:block }
.nav--solid .nav__logo-white   { display:none }
.nav__logo img { height:38px; width:auto; transition:transform .3s var(--ease-spring) }
.nav__logo:hover img { transform:scale(1.04) }

.nav__links { display:flex; align-items:center; gap:2.25rem; list-style:none }
.nav__link {
  font-size:.87rem; font-weight:500; position:relative; padding:.25rem 0;
  transition:color .25s; text-decoration:none
}
.nav--transparent .nav__link { color:rgba(255,255,255,.75); text-shadow:0 1px 6px rgba(0,0,0,.55) }
.nav--transparent .nav__link:hover { color:var(--white) }
.nav--solid .nav__link { color:var(--text-mid) }
.nav--solid .nav__link:hover { color:var(--navy) }
.nav__link.active { color:var(--gold) !important }
.nav__link::after {
  content:''; position:absolute; bottom:-2px; left:0; width:0; height:2px;
  background:var(--gold); border-radius:1px; transition:width .35s var(--ease-out-expo)
}
.nav__link:hover::after,.nav__link.active::after { width:100% }

.nav__cta {
  font-size:.84rem; font-weight:700; padding:.65rem 1.6rem; border-radius:100px;
  transition:all .3s var(--ease-out-quart); text-decoration:none; letter-spacing:.01em
}
.nav--transparent .nav__cta {
  background:rgba(255,255,255,.1); color:var(--white); border:1.5px solid rgba(255,255,255,.22)
}
.nav--transparent .nav__cta:hover { background:var(--gold); color:var(--navy); border-color:var(--gold) }
.nav--solid .nav__cta { background:var(--navy); color:var(--white); border:1.5px solid var(--navy) }
.nav--solid .nav__cta:hover { background:var(--navy-light); box-shadow:0 4px 14px rgba(27,42,74,.22); transform:translateY(-1px) }

/* Hamburger */
.nav__toggle {
  display:none; flex-direction:column; gap:5px; background:none; border:none; padding:8px; z-index:10
}
.nav__toggle span { display:block; width:22px; height:2px; border-radius:2px; transition:all .35s var(--ease-out-expo) }
.nav--transparent .nav__toggle span { background:var(--white) }
.nav--solid .nav__toggle span { background:var(--navy) }
.nav__toggle.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px) }
.nav__toggle.active span:nth-child(2) { opacity:0 }
.nav__toggle.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px) }

/* Mobile menu — full-screen overlay with proper touch targets */
.nav__mobile-menu {
  display:none; position:fixed; inset:0; background:var(--navy-deeper);
  z-index:999; flex-direction:column; justify-content:flex-start; align-items:stretch;
  gap:0; opacity:0; transition:opacity .35s; overflow-y:auto;
  padding-top:var(--nav-h)
}
.nav__mobile-menu.open { display:flex; opacity:1 }
.nav__mobile-menu a {
  font-size:1.15rem; font-weight:600; color:rgba(255,255,255,.72);
  transition:color .2s; padding:1rem 2rem; min-height:54px;
  display:flex; align-items:center; justify-content:center; text-align:center;
  border-bottom:1px solid rgba(255,255,255,.06); text-decoration:none
}
.nav__mobile-menu a:hover,.nav__mobile-menu a:active { color:var(--gold); background:rgba(255,255,255,.03) }

/* Dropdown nav */
.nav__dropdown { position:relative; padding-bottom:8px }
.nav__dropdown-menu {
  display:none; position:absolute; top:100%; left:50%; transform:translateX(-50%);
  background:#fff; border-radius:12px; padding:.5rem 0; min-width:210px;
  box-shadow:0 12px 40px rgba(27,42,74,.15); border:1px solid rgba(27,42,74,.08);
  z-index:100; margin-top:0
}
/* Invisible bridge fills the 8px gap so hover never breaks */
.nav__dropdown-menu::before {
  content:''; position:absolute; top:-8px; left:0; right:0; height:8px
}
.nav__dropdown:hover .nav__dropdown-menu,
.nav__dropdown.open .nav__dropdown-menu { display:block }
.nav__dropdown-menu a {
  display:block; padding:.65rem 1.35rem; font-size:.88rem; font-weight:500;
  color:var(--navy); text-decoration:none; transition:background .15s,color .15s;
  white-space:nowrap
}
.nav__dropdown-menu a:hover { background:var(--cream); color:var(--navy) }
.nav__dropdown-all {
  color:#D4A853 !important; font-weight:600 !important; font-size:.82rem !important;
  border-top:1px solid rgba(27,42,74,.07); margin-top:.25rem; padding-top:.6rem !important
}
.nav__dropdown-all:hover { background:rgba(212,168,83,.08) !important; color:#B8903F !important }
.nav__mobile-all {
  color:#D4A853 !important; font-weight:600 !important; font-style:italic;
  border-top:1px solid rgba(255,255,255,.06); margin-top:.25rem; padding-top:.6rem !important
}
.nav__link--dropdown { cursor:pointer }
.nav__link--dropdown::after { display:none }
.nav__caret {
  display:inline-block; width:0; height:0; margin-left:.35rem; vertical-align:middle;
  border-left:4px solid transparent; border-right:4px solid transparent;
  border-top:4px solid currentColor; opacity:.6; transition:transform .2s
}
.nav__dropdown:hover .nav__caret,
.nav__dropdown.open .nav__caret { transform:rotate(180deg) }

/* Mobile menu — accordion style, reliable on all touch devices */
.nav__mobile-section { width:100%; display:block; border-bottom:1px solid rgba(255,255,255,.06) }
.nav__mobile-section-title {
  font-size:.82rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(255,255,255,.55); padding:1rem 2rem; display:flex; align-items:center;
  justify-content:space-between; cursor:pointer; user-select:none; min-height:52px
}
.nav__mobile-section-title::after {
  content:''; width:0; height:0;
  border-left:5px solid transparent; border-right:5px solid transparent;
  border-top:5px solid rgba(255,255,255,.4); transition:transform .25s; flex-shrink:0
}
.nav__mobile-section.open .nav__mobile-section-title::after { transform:rotate(180deg) }
.nav__mobile-section-links {
  display:none; flex-direction:column; background:rgba(0,0,0,.15); padding:.25rem 0
}
.nav__mobile-section.open .nav__mobile-section-links { display:flex }
.nav__mobile-section-links a {
  font-size:.93rem; padding:.7rem 2.5rem; min-height:44px; display:flex; align-items:center;
  font-weight:500; color:rgba(255,255,255,.65); text-decoration:none; transition:color .2s;
  border:none !important
}
.nav__mobile-section-links a:hover,
.nav__mobile-section-links a:active { color:var(--gold) }
/* Top-level standalone links in mobile menu */
.nav__mobile-menu > a {
  font-size:.97rem; font-weight:600; padding:1rem 2rem; min-height:52px;
  display:flex; align-items:center; color:rgba(255,255,255,.75);
  border-bottom:1px solid rgba(255,255,255,.06); text-decoration:none
}
.nav__mobile-menu > a:hover { color:var(--gold) }

/* === BUTTONS === */
.btn {
  display:inline-flex; align-items:center; gap:.5rem; font-weight:700; font-family:inherit;
  border-radius:100px; transition:all .3s var(--ease-out-quart); cursor:pointer;
  text-decoration:none; font-size:.9rem; letter-spacing:.01em; border:none; white-space:nowrap
}
.btn-primary {
  display:inline-flex; align-items:center; gap:.6rem; padding:.85rem 2.2rem;
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  color:var(--navy); font-weight:800; font-size:.95rem;
  border-radius:100px; border:none; cursor:pointer; transition:all .3s var(--ease-out-quart);
  letter-spacing:.01em; text-decoration:none;
  box-shadow:0 4px 20px rgba(212,168,83,.3)
}
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 32px rgba(212,168,83,.45) }
.btn-secondary {
  display:inline-flex; align-items:center; gap:.6rem; padding:.85rem 2.2rem;
  background:transparent; color:var(--white); font-weight:700; font-size:.95rem;
  border-radius:100px; border:1.5px solid rgba(255,255,255,.25); cursor:pointer;
  transition:all .3s; text-decoration:none
}
.btn-secondary:hover { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.5) }
.btn-navy {
  display:inline-flex; align-items:center; gap:.6rem; padding:.85rem 2.2rem;
  background:var(--navy); color:var(--white); font-weight:700; font-size:.95rem;
  border-radius:100px; border:none; cursor:pointer; transition:all .3s; text-decoration:none
}
.btn-navy:hover { background:var(--navy-light); transform:translateY(-2px); box-shadow:0 8px 24px rgba(27,42,74,.25) }
.btn-ghost {
  display:inline-flex; align-items:center; gap:.6rem; padding:.85rem 2.2rem;
  background:transparent; color:var(--gold); font-weight:700; font-size:.95rem;
  border-radius:100px; border:1.5px solid rgba(212,168,83,.3); cursor:pointer;
  transition:all .3s; text-decoration:none
}
.btn-ghost:hover { background:var(--gold-muted); border-color:var(--gold) }
.btn-sm { padding:.55rem 1.25rem; font-size:.82rem }
.btn-lg { padding:1rem 2.5rem; font-size:1rem }
.btn-icon { width:16px; height:16px; transition:transform .25s var(--ease-spring) }
.btn:hover .btn-icon,.btn:hover .btn-arrow { transform:translateX(3px) }

/* === CARDS === */
.card {
  background:var(--white); border:1.5px solid var(--mid-gray); border-radius:var(--radius-lg);
  transition:all .4s var(--ease-out-expo); position:relative; overflow:hidden; display:block;
  box-shadow:var(--shadow-sm)
}
.card:hover { transform:translateY(-6px); box-shadow:var(--shadow-lg); border-color:rgba(212,168,83,.3) }

/* === HERO COMPONENTS === */
.breadcrumb {
  display:flex; align-items:center; gap:.5rem; font-size:.8rem; color:rgba(255,255,255,.45);
  margin-bottom:2rem; flex-wrap:wrap
}
.breadcrumb a { color:rgba(255,255,255,.5); transition:color .2s }
.breadcrumb a:hover { color:var(--gold) }
.breadcrumb span { color:rgba(255,255,255,.25) }

/* === SECTION HEADERS === */
.section-eyebrow {
  display:inline-flex; align-items:center; gap:.55rem; font-size:.7rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--navy); margin-bottom:.85rem
}
.section-eyebrow::before { content:''; width:28px; height:1.5px; background:var(--navy); display:inline-block; border-radius:1px }
/* On dark/navy sections, eyebrow reverts to gold */
.section--navy .section-eyebrow,
.page-hero .section-eyebrow,
[style*="background:var(--navy"] .section-eyebrow,
[style*="background:#0B1422"] .section-eyebrow,
[style*="background:#1B2A4A"] .section-eyebrow { color:var(--gold) }
.section--navy .section-eyebrow::before,
.page-hero .section-eyebrow::before { background:var(--gold) }
.section-heading   { margin-bottom:.6rem; letter-spacing:-.025em }
.section-desc      { font-size:1.05rem; color:var(--text-mid); max-width:540px; line-height:1.75 }
.section-header    { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:3.5rem; gap:2.5rem }
.section-header-left { flex:1 }
.view-all {
  font-size:.88rem; font-weight:700; color:var(--gold); display:inline-flex; align-items:center;
  padding:.55rem 1.25rem; border-radius:100px; border:1.5px solid rgba(212,168,83,.25);
  transition:all .3s var(--ease-out-quart)
}
.view-all:hover { background:var(--gold-muted); border-color:var(--gold); color:var(--gold-dark) }

/* Stat badge */
.stat-badge {
  display:inline-flex; align-items:center; gap:.5rem; background:rgba(212,168,83,.1);
  border:1px solid rgba(212,168,83,.25); border-radius:100px; padding:.4rem 1rem;
  font-size:.78rem; font-weight:700; color:var(--gold-dark)
}

/* === NEWSLETTER === */
.newsletter {
  position:relative; overflow:hidden;
  background:linear-gradient(150deg,#060E1E 0%,#0D1830 40%,#111D33 70%,#0A1220 100%);
  padding:clamp(5rem,10vw,9rem) 0
}
.newsletter__bg { position:absolute; inset:0 }
.newsletter__bg-pattern {
  position:absolute; inset:0; opacity:.04;
  background-image:
    repeating-linear-gradient(60deg,var(--gold) 0,var(--gold) 1px,transparent 1px,transparent 80px),
    repeating-linear-gradient(-60deg,var(--gold) 0,var(--gold) 1px,transparent 1px,transparent 80px)
}
.newsletter__bg-glow {
  position:absolute; width:1100px; height:700px; border-radius:50%; top:50%; left:50%;
  transform:translate(-50%,-50%);
  background:radial-gradient(ellipse,rgba(212,168,83,.12) 0%,transparent 65%)
}
.newsletter::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg,transparent,var(--gold) 20%,var(--gold-light) 50%,var(--gold) 80%,transparent)
}
.newsletter__inner { position:relative; z-index:2; text-align:center; max-width:860px; margin:0 auto }
.newsletter__eyebrow {
  display:inline-flex; align-items:center; gap:.75rem; margin-bottom:1.5rem;
  font-size:.72rem; font-weight:700; letter-spacing:.22em; text-transform:uppercase; color:var(--gold)
}
.newsletter__eyebrow::before { content:''; width:40px; height:1px; background:rgba(212,168,83,.6) }
.newsletter__eyebrow::after  { content:''; width:40px; height:1px; background:rgba(212,168,83,.6) }
.newsletter__title {
  font-size:clamp(2.2rem,4.5vw,3.8rem); font-weight:800; color:var(--white);
  margin-bottom:1rem; letter-spacing:-.025em; line-height:1.1
}
.newsletter__sub {
  font-size:clamp(1rem,1.5vw,1.2rem); color:rgba(255,255,255,.5);
  margin:0 auto 3rem; line-height:1.8; max-width:600px
}
.newsletter__form { display:flex; gap:.85rem; max-width:580px; margin:0 auto }
.newsletter__input {
  flex:1; padding:1.1rem 1.75rem; border-radius:100px;
  border:1.5px solid rgba(255,255,255,.12); background:rgba(255,255,255,.07);
  color:var(--white); font-family:inherit; font-size:1rem; outline:none; transition:all .3s
}
.newsletter__input::placeholder { color:rgba(255,255,255,.3) }
.newsletter__input:focus { border-color:var(--gold); background:rgba(255,255,255,.1); box-shadow:0 0 0 5px rgba(212,168,83,.12) }
.newsletter__submit {
  padding:1.1rem 2.6rem; border-radius:100px; border:none;
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  color:var(--navy); font-family:inherit; font-size:1rem; font-weight:800; cursor:pointer;
  transition:all .3s var(--ease-spring); white-space:nowrap
}
.newsletter__submit:hover { transform:scale(1.05); box-shadow:0 10px 30px rgba(212,168,83,.4) }
.newsletter__note { font-size:.8rem; color:rgba(255,255,255,.62); margin-top:1.75rem }

/* === FOOTER === */
.footer,.site-footer,.s-footer {
  background:#0B1422;
  border-top:1px solid rgba(212,168,83,.15);
  padding:0 0 2.5rem;
  color:rgba(255,255,255,.65)
}
.s-footer .wrap { max-width:var(--max-w); margin:0 auto; padding:0 clamp(1.5rem,5vw,4rem) }

/* ── Header row: wordmark + tagline aligned to the 4-column grid below ── */
.footer__header {
  display:grid;
  grid-template-columns:4fr 1fr 1fr 1fr;
  gap:3rem;
  align-items:center;
  padding:2.25rem 0 1.75rem;
  border-bottom:1px solid rgba(255,255,255,.07);
  margin-bottom:0
}
.footer__wordmark {
  font-size:1.5rem; font-weight:800; color:#fff; letter-spacing:-.03em;
  grid-column:1
}
.footer__wordmark span { color:#D4A853 }
.footer__wordmark small { color:rgba(212,168,83,.38); font-size:.95rem }
.footer__tagline {
  font-size:.78rem; color:rgba(255,255,255,.58); letter-spacing:.01em;
  grid-column:4; text-align:left; white-space:nowrap
}

/* ── 4-column grid ── */
.footer__top,.footer__grid,.s-footer__top {
  display:grid;
  grid-template-columns:4fr 1fr 1fr 1fr;
  gap:3rem;
  padding:2.5rem 0 3rem;
  border-bottom:1px solid rgba(255,255,255,.08)
}

/* Social icons — used in bottom bar */
.footer__bottom-social { display:flex; gap:.5rem; align-items:center }
.footer__social-link,.s-footer__social-link {
  width:28px; height:28px; border-radius:6px;
  border:1px solid rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center;
  transition:all .25s
}
.footer__social-link:hover { border-color:rgba(212,168,83,.4); background:rgba(212,168,83,.1) }
.footer__social-link svg { width:13px; height:13px; stroke:rgba(255,255,255,.45); fill:none; stroke-width:1.8 }
.footer__social-link:hover svg { stroke:#D4A853 }

/* Newsletter panel — gold-tinted card */
.footer__nl {
  margin-top:1.75rem; background:rgba(212,168,83,.07);
  border:1px solid rgba(212,168,83,.18); border-radius:12px; padding:1.35rem 1.5rem
}
.footer__nl-eyebrow {
  font-size:.65rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(212,168,83,.7); margin-bottom:.65rem;
  display:flex; align-items:center; gap:8px
}
.footer__nl-eyebrow::before { content:''; display:block; width:18px; height:1.5px; background:rgba(212,168,83,.5) }
.footer__nl-heading { font-size:.95rem; font-weight:700; color:#fff; margin-bottom:.3rem }
.footer__nl-sub { font-size:.76rem; color:rgba(255,255,255,.38); margin-bottom:.9rem; line-height:1.6 }
.footer__nl-bullets { list-style:none; margin-bottom:1rem }
.footer__nl-bullets li {
  font-size:.75rem; color:rgba(255,255,255,.45); padding:.2rem 0;
  display:flex; align-items:center; gap:7px
}
.footer__nl-bullets li::before {
  content:''; width:5px; height:5px; border-radius:50%; background:#D4A853; flex-shrink:0
}
.footer__nl-form { display:flex; gap:.45rem }
.footer__nl-input {
  flex:1; min-width:0; padding:.6rem .9rem; border-radius:8px;
  border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.06);
  color:#fff; font-family:inherit; font-size:.8rem; outline:none; transition:border-color .2s
}
.footer__nl-input::placeholder { color:rgba(255,255,255,.28) }
.footer__nl-input:focus { border-color:#D4A853 }
.footer__nl-btn {
  padding:.6rem 1rem; border-radius:8px; border:none;
  background:#D4A853; color:#1B2A4A; font-family:inherit;
  font-size:.78rem; font-weight:800; cursor:pointer; white-space:nowrap; transition:background .2s
}
.footer__nl-btn:hover { background:#E8C97A }
.footer__nl-note { font-size:.67rem; color:rgba(255,255,255,.22); margin-top:.5rem }

/* Nav columns */
.footer__col-title,.s-footer__col-title {
  font-size:.68rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase;
  color:#D4A853; margin-bottom:1.25rem
}
.footer__link,.s-footer__link {
  display:block; font-size:.84rem; padding:.3rem 0;
  color:rgba(255,255,255,.5); transition:all .2s
}
.footer__link:hover,.s-footer__link:hover { color:#fff; transform:translateX(3px) }

.footer__bottom,.s-footer__bottom {
  display:flex; justify-content:space-between; align-items:center;
  padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.07);
  font-size:.78rem; gap:1rem; flex-wrap:wrap; color:rgba(255,255,255,.35)
}
.footer__bottom a,.s-footer__bottom a { transition:color .2s; color:rgba(255,255,255,.35) }
.footer__bottom a:hover,.s-footer__bottom a:hover { color:#fff }
.footer__bottom-links a,.s-footer__bottom-links a { margin-left:1.5rem }

/* Responsive */
@media(max-width:1024px) {
  .footer__top,.footer__grid { grid-template-columns:1fr 1fr; gap:2.5rem }
  .footer__header { grid-template-columns:1fr 1fr; gap:1.5rem }
  .footer__tagline { grid-column:2; text-align:right }
}
@media(max-width:640px) {
  .footer__top,.footer__grid { grid-template-columns:1fr 1fr; gap:2rem }
  .footer__header { grid-template-columns:1fr; gap:.5rem }
  .footer__tagline { grid-column:1; text-align:left }
}
@media(max-width:480px) {
  .footer__top,.footer__grid { grid-template-columns:1fr 1fr; gap:1.5rem }
  .footer__bottom { flex-direction:column; text-align:center; gap:.75rem }
  .footer__bottom-links a { margin:0 .5rem }
}
@media(max-width:360px) {
  .footer__top,.footer__grid { grid-template-columns:1fr }
}

/* === COMPONENT: FAQ ACCORDION === */
.faq-list { display:flex; flex-direction:column; gap:.75rem; margin:2rem 0 }
.faq-item {
  border-radius:var(--radius-md); border:1.5px solid var(--border-gray);
  overflow:hidden; background:#fff; transition:border-color .3s,box-shadow .3s
}
.faq-item.open { border-color:rgba(212,168,83,.4); box-shadow:0 4px 24px rgba(212,168,83,.1) }
.faq-q {
  width:100%; text-align:left; background:none; border:none; cursor:pointer;
  padding:1.25rem 1.5rem; font-size:1rem; font-weight:600; color:var(--navy);
  display:flex; justify-content:space-between; align-items:center; gap:1rem;
  font-family:inherit; line-height:1.4; transition:color .25s
}
.faq-q:hover { color:var(--gold) }
/* SVG icon variant (existing pages) */
.faq-q svg { width:20px; height:20px; stroke:var(--text-gray); flex-shrink:0; transition:transform .35s var(--ease-spring) }
.faq-item.open .faq-q svg { transform:rotate(45deg); stroke:var(--gold) }
/* CSS ::after + variant */
.faq-q.faq-q--plus::after {
  content:'+'; font-size:1.5rem; font-weight:300; color:var(--gold);
  flex-shrink:0; transition:transform .35s var(--ease-out-expo); line-height:1; width:24px;
  text-align:center
}
.faq-item.open .faq-q.faq-q--plus::after { transform:rotate(45deg) }
/* Answer panel — smooth height transition using scrollHeight in JS */
.faq-a {
  max-height:0; overflow:hidden;
  transition:max-height .5s var(--ease-out-expo)
}
.faq-item.open .faq-a { max-height:2000px }
.faq-a-inner,.faq-a p { padding:.25rem 1.5rem 1.5rem; font-size:.95rem; color:var(--text-body); line-height:1.8 }
.faq-a a { color:var(--gold); text-decoration:underline; text-underline-offset:2px }
/* Dark background FAQ variant */
.section--navy .faq-item { background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.1) }
.section--navy .faq-q { color:#fff }
.section--navy .faq-item.open { border-color:rgba(212,168,83,.35) }
.section--navy .faq-a-inner,.section--navy .faq-a p { color:rgba(255,255,255,.65) }

/* === COMPONENT: STEP LIST === */
.step-list { display:flex; flex-direction:column; gap:2rem; position:relative; margin:2rem 0 }
.step-list::before {
  content:''; position:absolute; left:25px; top:26px;
  bottom:26px; width:2px;
  background:linear-gradient(to bottom,var(--gold),rgba(212,168,83,.15)); z-index:0
}
.step-item { display:grid; grid-template-columns:52px 1fr; gap:1.5rem; position:relative; z-index:1; align-items:start }
.step-num {
  width:52px; height:52px; border-radius:50%;
  background:linear-gradient(135deg,var(--navy),var(--navy-light));
  border:3px solid var(--gold); display:flex; align-items:center; justify-content:center;
  font-size:1rem; font-weight:800; color:var(--gold); flex-shrink:0;
  box-shadow:0 4px 14px rgba(27,42,74,.2)
}
/* Legacy ol li step-item compatibility */
ol.step-list { list-style:none; padding:0 }
.step-body { padding-top:.65rem }
.step-body h3 { font-size:1.05rem; font-weight:700; color:var(--navy); margin-bottom:.45rem }
.step-body p  { font-size:.92rem; color:var(--text-body); line-height:1.75 }
.step-timeline {
  display:inline-flex; align-items:center; gap:.4rem; font-size:.72rem;
  font-weight:700; color:var(--gold); background:rgba(212,168,83,.1);
  border-radius:100px; padding:.2rem .7rem; margin-top:.5rem
}

/* === COMPONENT: DATA TABLE === */
.data-table-wrap {
  border-radius:var(--radius-lg); overflow:hidden;
  border:1.5px solid var(--border-gray); box-shadow:var(--shadow-sm); margin:1.5rem 0
}
@media(max-width:640px) { .data-table-wrap { overflow-x:auto } }
.data-table { width:100%; border-collapse:collapse; font-size:.9rem; min-width:480px }
.data-table th {
  background:var(--navy); color:#fff; padding:.9rem 1.25rem;
  text-align:left; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; font-weight:700
}
/* Remove the first/last radius override that breaks table borders when wrapped */
.data-table-wrap .data-table th:first-child,
.data-table-wrap .data-table th:last-child { border-radius:0 }
/* Legacy standalone table (backwards compat) */
.data-table:not(.data-table-wrap .data-table) { margin:2rem 0 }
.data-table:not(.data-table-wrap .data-table) th:first-child { border-radius:12px 0 0 0 }
.data-table:not(.data-table-wrap .data-table) th:last-child  { border-radius:0 12px 0 0 }
.data-table td {
  padding:.85rem 1.25rem; border-bottom:1px solid var(--light-gray);
  vertical-align:top; color:var(--text-body)
}
.data-table tr:last-child td { border-bottom:none }
.data-table tr:nth-child(even) td { background:var(--off-white) }
.data-table tbody tr:hover td { background:rgba(212,168,83,.04) }
.data-table .highlight { color:var(--gold); font-weight:700 }

/* === COMPONENT: TIP/WARNING BOXES === */
/* Simple variant (existing pages: tip-box__icon / tip-box__title / tip-box__body) */
.tip-box {
  background:rgba(212,168,83,.08); border:1.5px solid rgba(212,168,83,.25); border-radius:var(--radius-md);
  padding:1.25rem 1.5rem; display:flex; gap:1rem; align-items:flex-start; margin:1.5rem 0;
  font-size:.92rem; line-height:1.75
}
.tip-box__icon { font-size:1.4rem; flex-shrink:0; margin-top:.1rem }
.tip-box__title { font-weight:700; color:var(--navy); margin-bottom:.25rem; font-size:.95rem }
.tip-box__body  { font-size:.88rem; color:var(--text-mid); line-height:1.7 }

.warning-box {
  background:rgba(220,38,38,.05); border:1.5px solid rgba(220,38,38,.18); border-radius:var(--radius-md);
  padding:1.25rem 1.5rem; display:flex; gap:1rem; align-items:flex-start; margin:1.5rem 0;
  font-size:.92rem; line-height:1.75
}
.warning-box .tip-box__title { color:#B91C1C }

/* Semantic ::before emoji variant */
.info-box {
  background:#EFF6FF; border:1.5px solid rgba(59,130,246,.25); border-radius:var(--radius-md);
  padding:1.25rem 1.5rem; display:flex; gap:1rem; align-items:flex-start; margin:1.5rem 0;
  color:#1E3A8A; font-size:.92rem; line-height:1.75
}
.success-box {
  background:#F0FDF4; border:1.5px solid rgba(34,197,94,.25); border-radius:var(--radius-md);
  padding:1.25rem 1.5rem; display:flex; gap:1rem; align-items:flex-start; margin:1.5rem 0;
  color:#14532D; font-size:.92rem; line-height:1.75
}
.tip-box::before    { content:'💡'; font-size:1.1rem; flex-shrink:0 }
.warning-box::before{ content:'⚠️'; font-size:1.1rem; flex-shrink:0 }
.info-box::before   { content:'ℹ️'; font-size:1.1rem; flex-shrink:0 }
.success-box::before{ content:'✅'; font-size:1.1rem; flex-shrink:0 }
/* Suppress duplicate icon when tip-box__icon is also present */
.tip-box .tip-box__icon     ~ *,.warning-box .tip-box__icon ~ * { }
.tip-box:has(.tip-box__icon)::before,
.warning-box:has(.tip-box__icon)::before { display:none }
.tip-box strong,.warning-box strong,.info-box strong { display:block; margin-bottom:.25rem }

/* === COMPONENT: PILLS/TAGS === */
.pill {
  display:inline-flex; align-items:center; padding:.28rem .8rem; border-radius:100px;
  font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; white-space:nowrap
}
.pill-gold    { background:rgba(212,168,83,.15); color:var(--gold-dark); border:1px solid rgba(212,168,83,.3) }
.pill-navy    { background:rgba(27,42,74,.1); color:var(--navy); border:1px solid rgba(27,42,74,.15) }
.pill-white   { background:rgba(255,255,255,.1); color:rgba(255,255,255,.8); border:1px solid rgba(255,255,255,.15) }
.pill-success { background:#ECFDF5; color:#065F46; border:1px solid #A7F3D0 }
.pill-warn    { background:#FFFBEB; color:#92400E; border:1px solid #FDE68A }

/* === COMPONENT: IMG PLACEHOLDER === */
.img-placeholder {
  background:linear-gradient(135deg,var(--light-gray) 0%,var(--cream) 100%);
  position:relative; overflow:hidden; display:flex; align-items:center; justify-content:center
}
.img-placeholder::after {
  content:''; position:absolute; inset:0;
  background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.5) 50%,transparent 70%);
  animation:shimmer-sweep 2.5s ease infinite
}
.img-placeholder img { width:100%; height:100%; object-fit:cover; display:block; position:relative; z-index:1 }

/* === ANIMATIONS & KEYFRAMES === */
@keyframes heroFadeUp    { from { opacity:0; transform:translateY(24px) } to { opacity:1; transform:translateY(0) } }
@keyframes archReveal    { to   { opacity:.22 } }
@keyframes shimmer-sweep { 0%   { transform:translateX(-120%) } 100% { transform:translateX(120%) } }
@keyframes float         { 0%,100% { transform:translateY(0) }         50%  { transform:translateY(-10px) } }
@keyframes float-slow    { 0%,100% { transform:translateY(0) rotate(0deg) } 50% { transform:translateY(-16px) rotate(3deg) } }
@keyframes pingDot       { 0%,100% { transform:scale(1);opacity:.5 }   55%  { transform:scale(2);opacity:0 } }
@keyframes btnGlow       { 0%,100% { box-shadow:0 4px 20px rgba(212,168,83,.2) } 50% { box-shadow:0 4px 32px rgba(212,168,83,.45),0 0 0 6px rgba(212,168,83,.08) } }

/* === REVEAL SYSTEM === */
.reveal {
  opacity:0; transform:translateY(28px);
  transition:opacity .75s var(--ease-out-expo),transform .75s var(--ease-out-expo)
}
.reveal-left {
  opacity:0; transform:translateX(-28px);
  transition:opacity .75s var(--ease-out-expo),transform .75s var(--ease-out-expo)
}
.reveal-right {
  opacity:0; transform:translateX(28px);
  transition:opacity .75s var(--ease-out-expo),transform .75s var(--ease-out-expo)
}
.reveal-scale {
  opacity:0; transform:scale(.94);
  transition:opacity .75s var(--ease-out-expo),transform .75s var(--ease-out-expo)
}
.reveal.visible,
.reveal-left.visible,
.reveal-right.visible,
.reveal-scale.visible { opacity:1; transform:none }

.reveal-delay-1.visible { transition-delay:.1s }
.reveal-delay-2.visible { transition-delay:.18s }
.reveal-delay-3.visible { transition-delay:.26s }
.reveal-delay-4.visible { transition-delay:.34s }
.reveal-delay-5.visible { transition-delay:.42s }
.reveal-delay-6.visible { transition-delay:.5s }

/* ============================================================
   RESPONSIVE — shared across all pages
   Breakpoints: 1024 → 860 → 768 → 640 → 480 → 380
   ============================================================ */

/* Prevent horizontal scroll from decorative overflowing elements */
body { overflow-x:hidden }

/* ── Tablet landscape (768–1024px) ── */
@media(max-width:1024px) {
  :root { --nav-h:70px }
  h1 { font-size:clamp(2rem,4vw,3.5rem) }
  .section     { padding:clamp(4rem,7vw,6rem) 0 }
  .section-sm  { padding:clamp(2.5rem,5vw,4rem) 0 }
  .section-lg  { padding:clamp(5rem,8vw,7rem) 0 }
  .footer__top,.footer__grid,.s-footer__top { grid-template-columns:1fr 1fr; gap:2rem }
  .footer__brand,.s-footer__brand { grid-column:1/-1 }
  /* Data tables always scrollable at this size */
  .data-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch }
}

/* ── Nav hamburger breakpoint ── */
@media(max-width:860px) {
  .nav__links  { display:none }
  .nav__toggle { display:flex }
}

/* ── Tablet portrait (480–768px) ── */
@media(max-width:768px) {
  :root { --section-gap:4.5rem; --nav-h:64px }
  h1 { font-size:clamp(1.95rem,5.5vw,3rem) }
  h2 { font-size:clamp(1.55rem,4.5vw,2.2rem) }
  h3 { font-size:1.05rem }
  .section    { padding:clamp(3rem,6vw,4.5rem) 0 }
  .section-sm { padding:clamp(2rem,4vw,3rem) 0 }
  .section-lg { padding:clamp(3.5rem,6vw,5rem) 0 }
  .container  { padding:0 1.25rem }

  /* Section header */
  .section-header { flex-direction:column; gap:1rem; margin-bottom:2rem }
  .section-header-left { width:100% }
  .view-all { align-self:flex-start }
  .section-desc { font-size:.95rem; max-width:100% }

  /* Footer */
  .footer__top,.footer__grid,.s-footer__top { grid-template-columns:1fr 1fr; gap:1.75rem }
  .footer__bottom,.s-footer__bottom { flex-direction:column; gap:1rem; text-align:center }
  .footer__bottom-links,.s-footer__bottom-links { display:flex; flex-wrap:wrap; justify-content:center }
  .footer__bottom-links a,.s-footer__bottom-links a { margin:0 .5rem }

  /* Newsletter */
  .newsletter__form { flex-direction:column; align-items:stretch; max-width:440px; margin:0 auto }
  .newsletter__submit { width:100%; justify-content:center }
  .newsletter__title { font-size:clamp(1.8rem,5.5vw,2.8rem) }
  .newsletter__sub   { font-size:.95rem; margin-bottom:2rem }

  /* Step list */
  .step-list::before { left:20px }
  .step-item { grid-template-columns:42px 1fr; gap:1rem }
  .step-num  { width:42px; height:42px; font-size:.88rem }
  .step-body { padding-top:.5rem }

  /* FAQ */
  .faq-q { padding:1.1rem 1.25rem; font-size:.95rem }
  .faq-a-inner,.faq-a p { padding:.2rem 1.25rem 1.25rem }

  /* Breadcrumb */
  .breadcrumb { font-size:.75rem }

  /* Tip/warning boxes */
  .tip-box,.warning-box,.info-box,.success-box { padding:1rem 1.25rem; font-size:.88rem }

  /* Buttons full-width helper on mobile */
  .btn-block-mobile { width:100%; justify-content:center }
}

/* ── Phone (480–640px) ── */
@media(max-width:640px) {
  h1 { font-size:clamp(1.85rem,7vw,2.6rem) }
  h2 { font-size:clamp(1.45rem,5.5vw,2rem) }
  .section    { padding:clamp(2.5rem,6vw,3.5rem) 0 }
  .container  { padding:0 1rem }

  /* Newsletter */
  .newsletter { padding:clamp(3rem,8vw,5rem) 0 }
  .newsletter__title { font-size:clamp(1.65rem,7vw,2.2rem) }

  /* Buttons */
  .btn-primary,.btn-secondary,.btn-navy,.btn-ghost { padding:.8rem 1.6rem; font-size:.88rem }
  .btn-sm { padding:.5rem 1rem; font-size:.78rem }

  /* Data table */
  .data-table { font-size:.82rem }
  .data-table th,.data-table td { padding:.7rem .9rem }
}

/* ── Small phone (≤480px) ── */
@media(max-width:480px) {
  h1 { font-size:clamp(1.7rem,8.5vw,2.3rem) }
  h2 { font-size:clamp(1.35rem,6.5vw,1.85rem) }
  .container { padding:0 1rem }
  .section    { padding:2.5rem 0 }
  .section-sm { padding:1.75rem 0 }

  /* Footer two-column on small phones */
  .footer__top,.footer__grid,.s-footer__top { grid-template-columns:1fr 1fr }
  .footer__brand,.s-footer__brand { grid-column:1/-1 }
  .footer,.site-footer,.s-footer { padding:3.5rem 0 1.75rem }
  /* Hide newsletter form in footer at small sizes */
  .footer__nl-form { flex-direction:column }
  .footer__nl-btn { width:100% }

  /* Nav mobile menu bigger tappable rows on tiny screens */
  .nav__mobile-menu a { font-size:1rem; padding:.95rem 1.5rem; min-height:52px }

  /* Step list compact */
  .step-item { grid-template-columns:36px 1fr; gap:.75rem }
  .step-num  { width:36px; height:36px; font-size:.8rem }
  .step-list::before { left:18px; top:22px }

  /* Pill wrapping */
  .pill { white-space:normal }
}

/* ── Very small phone (≤380px) ── */
@media(max-width:380px) {
  .footer__top,.footer__grid,.s-footer__top { grid-template-columns:1fr }
  h1 { font-size:1.65rem }
  h2 { font-size:1.3rem }
  .container { padding:0 .875rem }
}

/* ============================================================
   SHARED INNER-PAGE PATTERNS
   Classes used across multiple inner pages
   ============================================================ */

/* Page hero — used on almost every inner page */
.page-hero {
  padding:calc(var(--nav-h) + 4.5rem) 0 5rem;
  position:relative; overflow:hidden
}

/* Common two-col layout */
.two-col,.two-col--3-2,.two-col--2-3 {
  display:grid; gap:3rem; align-items:start
}
.two-col         { grid-template-columns:1fr 1fr }
.two-col--3-2    { grid-template-columns:3fr 2fr }
.two-col--2-3    { grid-template-columns:2fr 3fr }

/* Newsletter form used in inner pages (not homepage) */
.newsletter-form {
  display:flex; gap:.75rem; max-width:480px; margin:0 auto
}
.newsletter-form input {
  flex:1; padding:.9rem 1.25rem; border-radius:100px;
  font-family:inherit; font-size:.9rem; outline:none; transition:border-color .2s
}
.newsletter-form button {
  padding:.9rem 1.8rem; border-radius:100px; font-family:inherit;
  font-size:.9rem; font-weight:700; cursor:pointer; white-space:nowrap; border:none
}

@media(max-width:860px) {
  .two-col,.two-col--3-2,.two-col--2-3 { grid-template-columns:1fr }
}

@media(max-width:768px) {
  .page-hero { padding:calc(var(--nav-h,64px) + 2.5rem) 0 3rem }
  .page-hero h1 { font-size:clamp(1.9rem,5.5vw,3rem) }
  /* Newsletter form stacking */
  .newsletter-form { flex-direction:column; align-items:stretch }
  .newsletter-form input,.newsletter-form button { width:100% }
  /* Related grids used on multiple pages */
  [id$="-related-grid"] { grid-template-columns:1fr!important }
}

@media(max-width:480px) {
  .page-hero { padding:calc(var(--nav-h,64px) + 1.75rem) 0 2.25rem }
  .page-hero h1 { font-size:clamp(1.7rem,8vw,2.3rem) }
  /* All page-level section paddings tighten */
  .s-cream,.s-white,.s-dark,.light-section,.dark-section,.facts-section { padding:2.5rem 0 }
}

/* ── Accessibility: skip-to-content ── */
.skip-link {
  position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;
  background:var(--gold);color:var(--navy);font-weight:700;padding:.75rem 1.5rem;
  border-radius:0 0 8px 8px;z-index:9999;text-decoration:none;
}
.skip-link:focus { left:50%;transform:translateX(-50%);width:auto;height:auto; }

/* ── Accessibility: focus-visible ── */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible {
  outline:3px solid var(--gold);
  outline-offset:3px;
  border-radius:4px;
}

/* ── Accessibility: prefers-reduced-motion ── */
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}

/* ==========================================================================
   FINAL PRODUCTION RECONSTRUCTION - FULL WIDTH INTEGRATED LEFTSIDE GRID
   ========================================================================== */

/* 1. BREAK THE CONTAINER SPELL (Safety First) */
.references-section .container {
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

/* 2. THE OUTER SECTION ANCHOR */
.references-section {
    background: transparent !important;
    padding: 60px 0 40px 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    clear: both !important;
}

/* 3. THE MAIN IVORY PANEL */
.references__inner {
    max-width: 1200px !important;
    margin: 0 auto !important;
    background: #FBFBFA !important;
    border-left: 4px solid #C5A059 !important;
    border-top: 1px solid #EDECE9 !important;
    border-right: 1px solid #EDECE9 !important;
    border-bottom: 1px solid #EDECE9 !important;
    border-radius: 12px !important;
    padding: 40px !important;
    box-shadow: 0 10px 30px rgba(27, 42, 74, 0.02) !important;
    box-sizing: border-box !important;
}

.references__heading {
    font-family: 'Playfair Display', 'Georgia', serif !important;
    font-size: 24px !important;
    font-weight: 400 !important;
    text-transform: none !important;
    letter-spacing: 0px !important;
    color: #1A1A1A !important;
    margin: 0 0 12px 0 !important;
    text-align: left !important;
    line-height: 1.3 !important;
}

.references__intro {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 14px !important;
    color: #666666 !important;
    line-height: 1.6 !important;
    margin: 0 0 32px 0 !important;
    text-align: left !important;
    max-width: 850px !important;
}

.references__list {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100% !important;
}

.references__item {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 0 !important;
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #EFEFEF !important;
    border-radius: 0 !important;
    margin: 0 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 14.5px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.references__item:last-child {
    border-bottom: none !important;
}

.references__body-name {
    color: #1A1A1A !important;
    font-weight: 700 !important;
    text-align: left !important;
    flex-shrink: 0 !important;
    margin-right: 15px !important;
}

.references__separator {
    display: none !important;
}

.references__claim {
    color: #555555 !important;
    text-align: left !important;
    font-weight: 400 !important;
    margin-right: 20px !important;
    border-bottom: 1px dotted #E5E5E2 !important;
    padding-bottom: 2px !important;
    width: 100% !important;
}

.references__link {
    color: #C5A059 !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-flex !important;
    align-items: center !important;
    text-align: right !important;
    flex-shrink: 0 !important;
    transition: color 0.2s ease !important;
}

.references__link:hover {
    color: #1A1A1A !important;
}

.references__footer {
    margin-top: 24px !important;
    font-size: 12.5px !important;
    color: #888888 !important;
    text-align: left !important;
    line-height: 1.5 !important;
}

.references__footer a {
    color: #666666 !important;
    text-decoration: underline !important;
    margin-left: 8px !important;
}

.references__footer a:hover {
    color: #1A1A1A !important;
}

@media (max-width: 1240px) {
    .references__inner {
        margin: 0 24px !important;
    }
}

@media (max-width: 768px) {
    .references__item {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 8px !important;
        padding: 18px 0 !important;
    }
    .references__claim {
        border-bottom: none !important;
        margin-right: 0 !important;
        padding-bottom: 0 !important;
    }
    .references__link {
        margin-top: 2px !important;
    }
}

/* ==========================================================================
   END OF REFERENCES PATCH
   ========================================================================== */


/* ==========================================================================
   CONTACT PAGE — CLIENT CONCIERGE HUB
   Isolated block. All selectors are prefixed contact- to avoid cascade bleed.
   ========================================================================== */

/* --- Grid layout --------------------------------------------------------- */
.contact-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: start;
}
@media (min-width: 768px) {
  .contact-grid {
    grid-template-columns: 35% 1fr;
    gap: 50px;
  }
}

/* --- Left: Trust column -------------------------------------------------- */
.contact-trust__heading {
  font-family: 'Playfair Display', 'Georgia', serif;
  font-size: clamp(1.7rem, 2.5vw, 2.2rem);
  font-weight: 800;
  color: var(--navy, #1B2A4A);
  line-height: 1.2;
  letter-spacing: -.02em;
  margin-bottom: .9rem;
}
.contact-trust__lead {
  font-size: .92rem;
  color: #666;
  line-height: 1.75;
  margin-bottom: 2rem;
}

/* --- Info cards ---------------------------------------------------------- */
.contact-info-stack {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-bottom: 2rem;
  border-radius: 16px;
  overflow: hidden;
  border: 1.5px solid #E8E4DC;
  background: #fff;
}
.contact-info-card {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.1rem 1.25rem;
  border-bottom: 1px solid #EDECE9;
}
.contact-info-card:last-child { border-bottom: none; }
.contact-info-card__icon {
  width: 38px;
  height: 38px;
  background: var(--navy, #1B2A4A);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: var(--gold, #D4A853);
}
.contact-info-card__label {
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #999;
  margin-bottom: .2rem;
}
.contact-info-card__value {
  font-size: .88rem;
  font-weight: 600;
  color: var(--navy, #1B2A4A);
  line-height: 1.5;
}
.contact-info-card__value a {
  color: inherit;
  text-decoration: none;
}
.contact-info-card__value a:hover { color: var(--gold, #D4A853); }

/* --- Trust badges -------------------------------------------------------- */
.contact-trust-badges {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.contact-trust-badge {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: .9rem 1.1rem;
  background: rgba(212,168,83,.07);
  border: 1px solid rgba(212,168,83,.2);
  border-radius: 12px;
  font-size: .82rem;
  color: var(--navy, #1B2A4A);
  line-height: 1.55;
}
.contact-trust-badge__icon {
  width: 30px;
  height: 30px;
  background: var(--gold, #D4A853);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #fff;
}

/* --- Right: Form wrapper ------------------------------------------------- */
.contact-form-wrap { position: sticky; top: calc(var(--nav-h, 80px) + 1.5rem); }
@media (max-width: 767px) { .contact-form-wrap { position: static; } }

.contact-form-inner {
  background: #fff;
  border: 1.5px solid #E8E4DC;
  border-radius: 24px;
  padding: 2.75rem;
  box-shadow: 0 4px 32px rgba(27,42,74,.06);
}
.contact-form-inner__title {
  font-size: 1.35rem;
  font-weight: 800;
  color: var(--navy, #1B2A4A);
  margin-bottom: .35rem;
  letter-spacing: -.02em;
}
.contact-form-inner__sub {
  font-size: .85rem;
  color: #888;
  line-height: 1.65;
  margin-bottom: 1.75rem;
}

/* --- Form fields --------------------------------------------------------- */
.cform-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
@media (max-width: 500px) { .cform-row { grid-template-columns: 1fr; } }

.cform-group { margin-bottom: 1.15rem; }
.cform-group label {
  display: block;
  font-size: .78rem;
  font-weight: 700;
  color: var(--navy, #1B2A4A);
  margin-bottom: .4rem;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.cform-group input,
.cform-group textarea,
.cform-group select {
  width: 100%;
  padding: .85rem 1rem;
  background: #FBFBFA;
  border: 1px solid #EDECE9;
  border-radius: 8px;
  font-family: inherit;
  font-size: .9rem;
  color: var(--navy, #1B2A4A);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
}
.cform-group select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231B2A4A' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
  cursor: pointer;
}
.cform-group input:focus,
.cform-group textarea:focus,
.cform-group select:focus {
  border-color: var(--gold, #D4A853);
  box-shadow: 0 0 0 3px rgba(212,168,83,.12);
}
.cform-group input::placeholder,
.cform-group textarea::placeholder { color: #bbb; }
.cform-group textarea {
  height: 140px;
  resize: vertical;
}

/* --- GDPR consent -------------------------------------------------------- */
.cform-consent {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  margin-bottom: 1.5rem;
  font-size: .78rem;
  color: #777;
  line-height: 1.55;
}
.cform-consent input[type="checkbox"] {
  width: 16px;
  height: 16px;
  margin-top: .1rem;
  flex-shrink: 0;
  accent-color: var(--gold, #D4A853);
  cursor: pointer;
}
.cform-consent a { color: var(--navy, #1B2A4A); text-decoration: underline; }

/* --- Submit button ------------------------------------------------------- */
.cform-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .65rem;
  width: 100%;
  padding: 1rem 1.5rem;
  background: var(--gold, #D4A853);
  color: #1B2A4A;
  font-family: inherit;
  font-size: .95rem;
  font-weight: 800;
  letter-spacing: .02em;
  border: none;
  border-radius: 10px;
  cursor: pointer;
  transition: background .2s, transform .15s, box-shadow .2s;
  box-shadow: 0 4px 16px rgba(212,168,83,.28);
}
.cform-submit:hover {
  background: #c8983e;
  box-shadow: 0 6px 22px rgba(212,168,83,.38);
  transform: translateY(-1px);
}
.cform-submit:active { transform: translateY(0); }

/* ==========================================================================
   END OF CONTACT PAGE STYLES
   ========================================================================== */


/* ==========================================================================
   NEWSLETTER HUB — asymmetric two-column block (used on directory + similar)
   ========================================================================== */
.nl-hub {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  align-items: center;
}
@media (min-width: 768px) {
  .nl-hub {
    grid-template-columns: 1fr 420px;
    gap: 5rem;
  }
}
/* ==========================================================================
   END OF NEWSLETTER HUB
   ========================================================================== */