/* One big photo look (owner pick, Nov 2026): black site, Jost Light everywhere, no capitals on headings,
   clear regular weight headlines, a solid gold free consultation button. Loaded after brand.css on every page. */
@font-face { font-family:"Jost"; font-style:normal; font-weight:300 600; font-display:swap; src:url(../assets/fonts/jost.woff2) format("woff2"); }
:root { --display:"Jost",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; --font:"Jost",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; }
body { font-weight:300; font-size:.9375rem; line-height:1.8; background:#050506; }
h1, h2, h3, h4, .title, .ba-tag, .card .ph .sig, .steps .n, .steps h3, .article-top h1, .prose h2, .form legend, .links-in h1, .scene svg .big { font-family:var(--display); font-weight:400; text-transform:none; letter-spacing:.01em; }
h1, .article-top h1, .links-in h1 { font-size:clamp(1.9rem,3.4vw,3rem); line-height:1.15; }
.prose h2 { font-size:clamp(1.3rem,2vw,1.6rem); line-height:1.25; }
strong, b { font-weight:500; }
.title { font-size:clamp(1.5rem,2.4vw,2.1rem); line-height:1.2; max-width:32ch; }
.steps h3, .card h3 { font-size:1.05rem; }
.steps .n { font-size:1.25rem; }
.sig:has(+ .title), .sig:has(+ h2) { display:none; }
.nav a, .hdr .book { font-size:.75rem; letter-spacing:.2em; font-weight:400; }
.btn { min-height:46px; padding:0 24px; font-size:.6875rem; letter-spacing:.16em; font-weight:600; border-width:1px; }
.btn-line { border-color:rgba(236,236,238,.35); }
p { max-width:60ch; }
details summary, .rv-who, .rv-who *, .site-footer h2, .site-footer h3, .site-footer h4 { text-transform:none; letter-spacing:.02em; }

/* Home and staging: the photo fills the first screen; the headline and one gold button sit at the bottom. */
.hero[data-photo] { min-height:100svh; height:100svh; max-height:none; }
.hero[data-photo] .hero-poster, .hero[data-photo] .hero-poster img, .hero[data-photo] .hero-video, .hero[data-photo] .hv-slides, .hero[data-photo] .hv-slides img { position:absolute; inset:0; width:100%; height:100% !important; object-fit:cover; }
.hero[data-photo]::before { content:""; position:absolute; inset:0 0 auto 0; height:160px; background:linear-gradient(rgba(0,0,0,.4),transparent); pointer-events:none; z-index:1; } /* taste-skill-ignore: neutral scrim over the photo */
.hero[data-photo]::after { content:""; position:absolute; inset:auto 0 0 0; height:55%; background:linear-gradient(transparent,rgba(0,0,0,.6)); pointer-events:none; z-index:1; } /* taste-skill-ignore: neutral scrim over the photo */
.hero[data-photo] .copy { position:absolute; left:0; right:0; bottom:0; z-index:2; padding-bottom:clamp(36px,6vh,72px); }
.hero[data-photo] .copy .sig, .hero[data-photo] .copy .sub, .hero[data-photo] .scroll-cue { display:none; }
.hero[data-photo] h1 { font-size:clamp(1.8rem,3vw,2.75rem) !important; line-height:1.3; max-width:24ch !important; margin:0; text-shadow:none; }
.hero[data-photo] .actions { margin-top:20px; display:flex; }
.hero[data-photo] .actions .btn:not(:first-child) { display:none; }
.hero[data-photo] .actions .btn-gold { flex:0 0 auto; min-height:48px; padding:0 28px; background:var(--gold); color:var(--on-gold,#2c2c2c); border:0; font-size:.75rem; letter-spacing:.14em; }
.hero[data-photo] .actions .btn-gold:hover { background:#f3b94e; }
@media (max-width:760px) {
  body { font-size:.875rem; }
  h1, .article-top h1, .links-in h1 { font-size:clamp(1.55rem,7vw,1.9rem); }
  .title { font-size:clamp(1.35rem,6vw,1.6rem); }
  .hero[data-photo] h1 { font-size:clamp(1.55rem,7vw,1.85rem) !important; }
  .hero[data-photo] .copy { padding-bottom:calc(86px + env(safe-area-inset-bottom)); }
  .hero[data-photo] .actions .btn-gold { flex:0 0 100%; }
  /* The phone video is three clips stacked, so phones get one big staged photo. */
  .hero[data-photo] .hero-poster { display:none !important; }
  .hero[data-photo] .hv-phone { display:block !important; }
}
/* Page heroes on the other pages: same quiet headline, no capitals, readable size. */
.hero h1, .hero .copy h1, .hero .title { font-family:var(--display); font-weight:400; text-transform:none; letter-spacing:.01em; font-size:clamp(2rem,3.4vw,3.1rem); line-height:1.2; max-width:24ch; text-shadow:none; }
main p, main li, main dd { font-size:.9375rem; }
@media (max-width:760px) {
  .hero h1, .hero .copy h1, .hero .title { font-size:clamp(1.55rem,7vw,1.9rem); }
  main p, main li, main dd { font-size:.875rem; }
}
/* Section and page titles a size up, so nothing reads smaller than today. */
.title, main h1:not(.hero h1) { font-size:clamp(1.8rem,2.8vw,2.5rem); line-height:1.2; }
@media (max-width:760px) { .title, main h1:not(.hero h1) { font-size:clamp(1.45rem,6.4vw,1.75rem); } }
/* Owner: Jost looks good thin, not bold. All headings and the button in the light weights. */
h1, h2, h3, h4, .title, .hero h1, .hero .copy h1, .hero[data-photo] h1, main h1, .steps h3, .card h3, .prose h2, .article-top h1 { font-weight:300; }
strong, b { font-weight:400; }
.btn, .hero[data-photo] .actions .btn-gold { font-weight:500; }
.nav a, .hdr .book { font-weight:400; }
/* Owner: menu items start from the right. */
.hdr.open .nav a, .hdr.open .nav .book-m { justify-content:flex-end; text-align:right; }
/* Owner: on desktop the menu options start from the left, next to the logo; Book a free consultation stays on the right. */
@media (min-width:1061px) {
  .nav { margin-left:clamp(24px,3vw,48px); }
  .hdr .book { margin-left:auto; }
}
/* Owner: two before and after sliders side by side, smaller. */
.ba-pair { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
@media (max-width:700px) { .ba-pair { grid-template-columns:1fr; gap:14px; } }
