/* Brand mockup (2026-10-05): the Fiverr brand sheet applied to the final layout.
   Colors from the sheet: navy #15214A, gold #957233, cream #FCF8F3, charcoal #231F20.
   Gold family: #957233 for rules and ornaments, a deeper #7A5A22 for small gold text on cream
   (passes contrast), and a lighter #C9A35E for gold on navy.
   Type: Cinzel (sheet primary, capitals only) for short labels; Fraunces for headlines because
   they need lowercase; Montserrat (sheet secondary) for body text.
   Rules are scoped to [data-theme=brand] because dev mode injects base.css after this file. */
:root{
  --bg:#FCF8F3;--bg-alt:#F6EFE4;--card:#FFFFFF;--rule:#E6DCCB;
  --ink:#231F20;--ink-soft:#4A4546;--muted:#5E5A57;
  --navy:#15214A;--gold:#957233;--gold-ink:#7A5A22;--gold-light:#C9A35E;
  --accent:#15214A;--on-accent:#FCF8F3;
  --band:#15214A;--on-band:#FCF8F3;--band-btn:#FCF8F3;--band-btn-ink:#15214A;
  --ph-bg:#F1E9DC;--ph-line:#D2C3A6;
  --font-head:'Fraunces',Georgia,serif;
  --font-body:'Montserrat',system-ui,sans-serif;
  --font-label:'Cinzel',Georgia,serif;
  --head-weight:500;--radius:12px;--radius-btn:999px;--measure:68rem;
}
[data-theme=brand] body{font-size:1.075rem;line-height:1.7}
[data-theme=brand] h1,[data-theme=brand] h2,[data-theme=brand] h3{color:var(--navy)}
[data-theme=brand] h3{font-weight:600}

/* Cinzel labels flanked by gold rules, like "— THE —" in the logo */
[data-theme=brand] .kicker,[data-theme=brand] .hero .kicker{font-family:var(--font-label);font-weight:600;font-size:.9rem;letter-spacing:.2em;color:var(--gold-ink)}
[data-theme=brand] .section-head .kicker,[data-theme=brand] .hero .kicker{display:flex;align-items:center;justify-content:center;gap:.9rem}
[data-theme=brand] .section-head .kicker::before,[data-theme=brand] .section-head .kicker::after,[data-theme=brand] .hero .kicker::before,[data-theme=brand] .hero .kicker::after{content:'';flex:0 0 2.5rem;height:1px;background:var(--gold)}

/* header: logo carries the name, gold hairline underneath */
[data-theme=brand] .site-header{background:var(--bg);border-bottom:1px solid var(--rule);box-shadow:inset 0 -3px 0 -2px var(--gold)}
[data-theme=brand] .brand img.logo-h{height:52px;width:auto}
[data-theme=brand] .nav{font-weight:500}
[data-theme=brand] .nav .btn{opacity:1}
[data-theme=brand] .nav a[aria-current=page]{border-bottom:2px solid var(--gold);padding-bottom:2px}

/* buttons: navy pill, gold on hover; ghost is a gold hairline */
[data-theme=brand] .btn{font-weight:600;letter-spacing:.03em;transition:background .2s,border-color .2s,color .2s}
[data-theme=brand] .btn:hover{filter:none;background:var(--gold-ink);border-color:var(--gold-ink);color:#fff}
[data-theme=brand] .btn.ghost{color:var(--navy);border-color:var(--gold)}
[data-theme=brand] .btn.ghost:hover{background:transparent;color:var(--gold-ink);border-color:var(--gold-ink)}

/* hero: centered, with a small gold diamond on the rule */
[data-theme=brand] .hero{text-align:center}
[data-theme=brand] .hero h1,[data-theme=brand] .hero .lede,[data-theme=brand] .hero .sub{margin-inline:auto}
[data-theme=brand] .hero .actions{justify-content:center}
[data-theme=brand] .hero h1{max-width:22ch;font-weight:500}
[data-theme=brand] .hero h1::after{content:'\25C6';display:block;width:132px;margin:1.1rem auto 1.2rem;font-size:.55rem;line-height:1;color:var(--gold);
  background:linear-gradient(var(--gold),var(--gold)) left center/54px 1px no-repeat,
             linear-gradient(var(--gold),var(--gold)) right center/54px 1px no-repeat}
[data-theme=brand] .hero .sub{font-style:italic;font-weight:400;font-size:1.35rem;color:var(--gold-ink)}

[data-theme=brand] .section-head{margin-inline:auto;text-align:center}

/* cards: white with a thin gold top edge */
[data-theme=brand] .card{border-color:var(--rule);border-top:2px solid var(--gold);box-shadow:0 14px 34px -26px rgba(21,33,74,.4)}
[data-theme=brand] .card a{color:var(--navy);text-decoration-color:var(--gold);text-underline-offset:.2em}
[data-theme=brand] .num{font-family:var(--font-label);font-weight:600;font-size:1.6rem;color:var(--gold)}
[data-theme=brand] .tier .length{color:var(--navy)}
[data-theme=brand] .checks li::before{border-color:var(--gold)}
[data-theme=brand] .addons li{border-bottom-color:var(--rule)}

/* family quotes: Fraunces italic, gold opening mark */
[data-theme=brand] .voice{position:relative;border:0;border-radius:var(--radius);background:var(--card);font-weight:400;color:var(--navy);padding:1.6rem 1.6rem 1.4rem 3.2rem;box-shadow:0 14px 34px -28px rgba(21,33,74,.45)}
[data-theme=brand] .voice::before{content:'\201C';position:absolute;left:1rem;top:.6rem;font-size:3rem;line-height:1;color:var(--gold)}
[data-theme=brand] .voice::after{content:''}

[data-theme=brand] .person .portrait{box-shadow:0 0 0 1px var(--rule),0 0 0 6px var(--bg),0 0 0 7px var(--gold)}
[data-theme=brand] .person .role{font-family:var(--font-label);font-size:.82rem;letter-spacing:.1em;color:var(--gold-ink)}

/* CTA band: navy with gold rules */
[data-theme=brand] .cta-band{border-top:3px double var(--gold-light)}
[data-theme=brand] .cta-band h2{font-weight:500}
[data-theme=brand] .cta-band h2::after{content:'';display:block;width:56px;height:1px;background:var(--gold-light);margin:1.1rem auto 0}
[data-theme=brand] .cta-band .btn:hover{background:var(--gold-light);border-color:var(--gold-light);color:var(--navy)}

/* footer: navy, white logo, gold accents */
[data-theme=brand] .site-footer{background:#101A3B;color:#E9E3D8;border-top:0}
[data-theme=brand] .site-footer strong{color:#fff}
[data-theme=brand] .site-footer a{color:var(--gold-light)}
[data-theme=brand] .site-footer .brand img.logo-h{height:44px;margin-bottom:.8rem}
[data-theme=brand] .site-footer .fine{color:#B9B3AA;border-top-color:rgba(201,163,94,.35)}

/* four quotes sit as a tidy 2 x 2 instead of 3 + 1 */
@media (min-width:760px){[data-theme=brand] .voices{grid-template-columns:repeat(2,1fr);max-width:56rem;margin-inline:auto}}

/* Home hero: label, headline, lede, question, buttons on the left; photo (later the trailer) on the right.
   On phones the photo drops below the buttons so "Book" stays near the top. */
[data-theme=brand] .hero-split{text-align:left;padding-top:clamp(2.5rem,6vw,5rem)}
[data-theme=brand] .hero-split .wrap{display:grid;gap:clamp(2rem,4vw,3.5rem);align-items:center}
@media (min-width:900px){[data-theme=brand] .hero-split .wrap{grid-template-columns:1.05fr 1fr}}
[data-theme=brand] .hero-split .kicker{justify-content:flex-start}
[data-theme=brand] .hero-split .kicker::before{display:none}
[data-theme=brand] .hero-split h1{margin-inline:0;max-width:18ch;font-size:clamp(2rem,4.4vw,3.2rem)}
[data-theme=brand] .hero-split h1::after{margin:1.1rem 0 1.2rem;text-align:center}
[data-theme=brand] .hero-split .lede{margin-inline:0;font-size:1.12rem}
[data-theme=brand] .hero-split .ask{font-family:var(--font-head);font-style:italic;font-size:1.3rem;line-height:1.35;color:var(--gold-ink);margin:1.4rem 0 0}
[data-theme=brand] .hero-split .actions{justify-content:flex-start;margin-top:1rem}
[data-theme=brand] .hero-split .reassure{font-size:.95rem;color:var(--muted);margin:.9rem 0 0}
[data-theme=brand] .hero-photo{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);box-shadow:0 0 0 1px var(--rule),0 0 0 8px var(--bg),0 0 0 9px var(--gold),0 24px 48px -30px rgba(21,33,74,.5)}

/* Angie's line leads the "Why it matters" section */
[data-theme=brand] h2.angie{font-style:italic;font-weight:400;max-width:24ch;margin-inline:auto}

[data-theme=brand] .site-footer .tagline{font-family:var(--font-head);font-style:italic;color:var(--gold-light)}
@media (max-width:600px){[data-theme=brand] .brand img.logo-h{height:40px}}
[data-theme=brand] .cta-band .cta-phone a{color:var(--gold-light)}