
:root{--gold:#C8A200;--yellow:#FFD34E;--ink:#0F1115;--bg:#FAFAF8;--card:#FFFFFF;--muted:#6b7280}
*{box-sizing:border-box}html,body{margin:0;padding:0}
body{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:#1f2937}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block;height:auto}
.container{width:min(1100px,92%);margin-inline:auto}
.topbar{background:var(--ink);color:#fff}
.topbar .container{display:flex;justify-content:space-between;align-items:center;padding:.55rem 0;font-size:.9rem;gap:1rem}
.topbar a{color:#fff;opacity:.9}
.header{background:linear-gradient(120deg,var(--yellow),var(--gold));color:#111}
.nav{display:flex;gap:1rem;align-items:center;justify-content:space-between;padding:1rem 0;flex-wrap:wrap}
.brand{font-weight:800;letter-spacing:.2px}
.menu{display:flex;gap:.55rem;flex-wrap:wrap}
.menu a{padding:.5rem .8rem;border-radius:999px;background:rgba(255,255,255,.7);border:1px solid rgba(0,0,0,.06);transition:.2s}
.menu a:hover{background:#fff;transform:translateY(-1px)}.menu a.active{background:#111;color:#fff}
.hero{padding:2.2rem 0}.hero h1{margin:0 0 .5rem;font-size:clamp(1.6rem,3.2vw,2.6rem)}
.kicker{font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:#374151;font-size:.85rem}
.quote{background:#fff;border:1px solid #eee;border-radius:1rem;padding:1rem;box-shadow:0 10px 22px rgba(0,0,0,.05)}
.section{padding:2rem 0}.grid{display:grid;gap:1rem}
@media(min-width:780px){.grid.cols-3{grid-template-columns:repeat(3,1fr)}}
.card{background:var(--card);border:1px solid #eee;border-radius:1rem;padding:1rem;box-shadow:0 6px 16px rgba(0,0,0,.04)}
.card h3{margin:.3rem 0 .4rem}.badge{display:inline-block;padding:.25rem .6rem;border-radius:.6rem;border:1px solid rgba(0,0,0,.08);background:#fff;font-weight:700}
.cta{display:inline-flex;align-items:center;gap:.5rem;background:var(--ink);color:#fff;border-radius:.8rem;padding:.7rem 1rem;font-weight:700}
.cta:hover{opacity:.9;transform:translateY(-1px)}
.footer{padding:2rem 0;color:var(--muted);font-size:.95rem}.small{font-size:.92rem;color:#4b5563}
.table{width:100%;border-collapse:collapse}.table th,.table td{border-bottom:1px solid #eee;padding:.6rem .5rem;text-align:left}
.pillars{display:grid;gap:1rem}@media(min-width:800px){.pillars{grid-template-columns:repeat(3,1fr)}}
.pillar{border-left:6px solid var(--gold);padding-left:.8rem}
.gallery-toolbar{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.btn{border:1px solid #ddd;border-radius:999px;padding:.4rem .8rem;background:#fff;cursor:pointer}
.btn.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.gallery{columns:1;column-gap:1rem}@media(min-width:640px){.gallery{columns:2}}@media(min-width:960px){.gallery{columns:3}}
.gallery figure{break-inside:avoid;margin:0 0 1rem;background:#fff;border:1px solid #eee;border-radius:.8rem;overflow:hidden}
.gallery figcaption{padding:.5rem .6rem;font-size:.9rem;color:#444}
.notice{background:#fff3cd;border:1px solid #ffe69c;padding:.8rem;border-radius:.6rem}
.form{display:grid;gap:.8rem}input,textarea,select{width:100%;padding:.65rem;border:1px solid #ddd;border-radius:.6rem;background:#fff}label{font-weight:600}

.form{display:grid;gap:.8rem}
input,textarea,select{width:100%;padding:.65rem;border:1px solid #ddd;border-radius:.6rem;background:#fff}
label{font-weight:600}

/* --- global reset for mobile gutters --- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; width: 100%; }
img, video { max-width: 100%; height: auto; }

/* ===== HERO (desktop defaults) ===== */
.hero-video { position: relative; }

.hero-video__overlay{
  position: absolute; inset: 0;
  pointer-events: none; display: grid; place-items: center; z-index: 1;
}
.hero-video__overlay h1,
.hero-video__overlay p{
  position: absolute; left: 50%; transform: translateX(-50%);
  margin: 0; color: #0b2a5b !important; text-shadow: none; z-index: 2;
}
.hero-video__overlay h1{ bottom: clamp(58px, 7.5vh, 110px) !important; font-weight: 700; }
.hero-video__overlay p { bottom: clamp(36px, 5.8vh, 86px) !important; }

.hero-video__buttons{
  position: absolute;
  left: clamp(20px, 12vw, 260px);
  bottom: clamp(130px, 18vh, 210px);
  display: flex; gap: .75rem; pointer-events: auto; z-index: 3;
}

/* ribbons if present */
.hero-video__overlay figure.left figcaption,
.hero-video__overlay figure.right figcaption { position: absolute; bottom: clamp(32px, 6vh, 72px) !important; }
.hero-video__overlay .name-left,
.hero-video__overlay .name-right { position: absolute; bottom: clamp(40px, 6vh, 48px) !important; }

/* === Small screens (≤1024px): full-bleed gold bar everywhere === */
@media (max-width: 1024px) {
  header, .header, .site-header, .topbar,
  .header > .container, .header .container, .header .nav, .header .menu, .header nav.menu {
    margin-left:  calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    width: 100vw !important;
    border-radius: 0 !important;
    position: sticky; top: 0; z-index: 999;
  }
  .header { background: var(--gold, #f3c23a) !important; }
  .header > .container, .header .container, .header .nav, .header .menu, .header nav.menu {
    background: transparent !important;
  }
  body { overflow-x: hidden; }
}

/* === PHONE (≤600px) — single source of truth === */
@media (max-width: 600px) {
  .hero-video .hero-video__overlay h1,
  .hero-video .hero-video__overlay p{
    position: absolute !important; top: auto !important;
    left: 59% !important; transform: translateX(-50%) !important;
    text-align: center !important; padding-inline: 8px !important;
    max-width: 92vw !important; color: #0b2a5b !important; z-index: 2 !important;
  }
  .hero-video .hero-video__overlay h1{ bottom: 62px !important; line-height: 1.15 !important; font-weight: 700 !important; }
  .hero-video .hero-video__overlay p { bottom: 40px !important; line-height: 1.25 !important; }

  .hero-video .hero-video__buttons{
    position: absolute !important; top: auto !important; transform: none !important;
    left: clamp(20px, 12vw, 260px) !important;
    bottom: clamp(112px, 15vh, 200px) !important;
    display: flex !important; gap: .6rem !important; z-index: 3 !important; pointer-events: auto !important;
  }
}




/* (keep your gold-header full-bleed rules as you have them) */