/* The Stanza Effect — brand layer (Jemma guidelines). Loaded after each page's base CSS. */
@font-face{font-family:'AnticD';src:url('/fonts/anticdidone.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Corin';src:url('/fonts/corinthia.woff2') format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Inter TSE';src:url('/fonts/inter-light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:'Inter TSE';src:url('/fonts/inter-medium.woff2') format('woff2');font-weight:500;font-display:swap}

:root{
  --burg:#351318;--cream:#EDE7DC;--navy:#384860;--slate:#737B93;--slatel:#939CB2;
  --alabaster:#EDE7DC;--white:#EDE7DC;--boucle:#E3DCCE;--border:#D9D2C6;
  --espresso:#384860;--text-body:#384860;--text-light:#737B93;
  --champagne:#737B93;--champagne-light:#939CB2;--champagne-dark:#737B93;
}
body{font-family:'Inter TSE',sans-serif;font-weight:300;letter-spacing:.025em;color:var(--navy)}
h1,h2,h3,h4{font-family:'AnticD',serif;text-transform:lowercase;color:var(--burg);font-weight:400}
h1 em,h2 em,h3 em{font-family:'Corin',cursive;font-weight:700;font-style:normal;text-transform:none;color:var(--slate)}

/* nav = navy bar, cream, roundel logo */
.nav-bar{background:var(--navy)!important;backdrop-filter:none;-webkit-backdrop-filter:none;border-bottom:none}
.nav-bar.scrolled{box-shadow:0 2px 20px rgba(0,0,0,.18)}
.nav-logo-img{height:42px;width:auto}
.nav-menu a{color:var(--cream)}
.nav-menu a:hover,.nav-menu a[aria-current="page"]{color:var(--slatel)}
.nav-toggle span{background:var(--cream)}
@media(max-width:820px){.nav-menu{background:var(--navy)}}
.nav-menu a.nav-cta{background:transparent!important;color:var(--cream)!important;border:1.5px solid var(--cream);border-radius:999px}
.nav-menu a.nav-cta:hover{background:var(--cream)!important;color:var(--navy)!important}

/* hero */
.hero-brand{width:min(480px,62vw);height:auto;display:block;margin:0 auto 1.4rem}
.hero-content h1{color:var(--burg)}
.hero-content h1 em{color:var(--slate)}
.hero-sub{color:var(--navy)}

/* eyebrows / labels */
.section-label,.card-label{color:var(--slate)}

/* buttons: pill, outlined, invert on hover */
.hero-scroll,.enquire-submit,.persona-secondary a{border:1.5px solid var(--burg);border-radius:999px;padding:.7rem 1.6rem;display:inline-flex;align-items:center;gap:.5rem;background:transparent;color:var(--burg);transition:.25s;letter-spacing:.12em;text-transform:uppercase;font-size:.72rem;font-weight:500}
.hero-scroll:hover,.enquire-submit:hover,.persona-secondary a:hover{background:var(--burg);color:var(--cream)}
.enquire-submit{width:auto}

/* Watch + Who We Are = burgundy blocks */
.section:has(.video-split),.section.about{background:var(--burg)}
.section:has(.video-split) .section-title,.section.about .section-title{color:var(--cream)}
.section:has(.video-split) .section-label,.section.about .section-label{color:var(--slatel)}
.section:has(.video-split) li,.section:has(.video-split) p,.section.about p{color:var(--cream)}

/* How it works = cream */
.how-it-works{background:var(--cream)}
.step-number{color:var(--slate)}

/* Personas: developer card navy, homeowner card burgundy */
.persona-card[href*="developers"]{background:var(--navy);border-color:var(--navy)}
.persona-card[href*="homeowners"]{background:var(--burg);border-color:var(--burg)}
.persona-card[href*="developers"] *,.persona-card[href*="homeowners"] *{color:var(--cream)!important}
.persona-card[href*="developers"] .card-label,.persona-card[href*="homeowners"] .card-label{color:var(--slatel)!important}

/* enquire + footer */
.enquire{background:var(--cream)!important;border-top:none}
.site-footer{background:var(--navy)!important;color:var(--cream)}
.footer-brand{height:64px;width:auto;display:block}
.site-footer a{color:var(--cream)}

/* login / auth pages (shared look) */
.auth-card,.login-card,.card{border-radius:12px}

/* chevron band (login/auth pages) — scaled to brand guide: 34px columns, ~2 rows */
.tse-chevband{height:104px;background-repeat:repeat;background-size:68px auto;background-position:center top}
.tse-chevband--burg{background-image:url("chevron-burgundy.svg")}
.tse-chevband--navy{background-image:url("chevron-navy.svg")}
@media(max-width:600px){.tse-chevband{height:78px}}
/* ══ App chrome: workspace / portal / admin / partner ══ */
/* Titles & numbers -> Antic; script accents -> Corinthia */
.nav-title,.welcome h1,.stat-value,.profile-stat-num,.project-client,.referral-client,
.ov-num,.panel-title,.fp-head,.dm-head,.shop-summary-main,.grand,.designer,
.partner-sub,.stat .n,.stat-row .n,.badge .n{font-family:'AnticD',serif!important}
.nav-title,.panel-title,.fp-head,.dm-head{text-transform:lowercase}
.nav-title em,.welcome h1 em,.stat-value em{font-family:'Corin',cursive!important;font-style:normal!important;text-transform:none;color:var(--slate)!important}
/* App top bar: cream on navy */
.nav-title{color:var(--cream)!important}
.nav-user-name{color:var(--cream)!important}
.nav-user-role{color:var(--slatel)!important}
.nav-avatar{background:var(--slate)!important;color:var(--cream)!important}
.nav-logout{color:var(--slatel)!important;border-color:rgba(237,231,220,.28)!important}
.nav-logout:hover{color:var(--cream)!important;border-color:var(--cream)!important}
/* Active tabs / accents -> slate (not gold) */
.tab-btn.active{color:var(--burg)!important;border-bottom-color:var(--slate)!important}
.tab-badge{background:var(--slate)!important;color:var(--cream)!important}
.br-tab.active,.sm-tab.active,.br-tier.active{border-color:var(--slate)!important;background:var(--cream)!important;color:var(--burg)!important}
.br-prompt textarea,.sm-sharenote,#am_matches,#clipMatches{background:var(--cream)!important;border-color:var(--slatel)!important}
.ph-step-row.current .ph-dot{background:var(--slate)!important;box-shadow:0 0 0 4px rgba(115,123,147,.18)!important}
.aw-prog-bar i,.bar-fill{background:var(--slate)!important}
/* Cards: consistent rounded */
.stat-card,.ov-card,.ov-panel,.panel,.fp-panel,.ph-panel,.project-card,.referral-card,.profile-sidebar,.dm-panel{border-radius:12px}
/* admin specifics */
.tab.active{color:var(--burg)!important;border-bottom-color:var(--slate)!important}
.nav .btn.ghost{color:var(--cream)!important;border-color:rgba(237,231,220,.4)!important}
.nav .btn.ghost:hover{background:rgba(237,231,220,.12)!important;color:var(--cream)!important}
.subtab.active{background:var(--navy)!important;border-color:var(--navy)!important;color:var(--cream)!important}
/* ── Hero script accent + nav logo (Jemma feedback) ── */
/* "perfect room" (Corinthia) scales with the sentence so it balances */
.hero h1 em,.hero-content h1 em{font-size:1.5em!important;line-height:1.05}
/* nudge the roundel down a touch so it sits centred in the bar */
.nav-bar .nav-logo-img{position:relative;top:2px}
/* ── Section eyebrows -> Corinthia script (match mockup) ── */
.section-label{font-family:'Corin',cursive!important;font-weight:700!important;text-transform:lowercase!important;letter-spacing:0!important;font-size:clamp(2rem,4vw,3rem)!important;line-height:1.05;margin-bottom:.1rem}
.section-label::first-letter{text-transform:uppercase}
/* tighten serif title under the script eyebrow */
.section-title{margin-top:0}
/* ── CTA panels: burgundy + branded pill buttons (brand review) ── */
.cta-section{background:var(--burg)!important}
.cta-section h2{color:var(--cream)!important}
.cta-section p{color:var(--cream)!important;opacity:.85}
.cta-section .cta-button{border-radius:999px!important;background:var(--cream)!important;color:var(--burg)!important;border:1.5px solid var(--cream)!important;letter-spacing:.12em}
.cta-section .cta-button:hover{background:#fff!important;color:var(--burg)!important}
.cta-section .cta-button--ghost{background:transparent!important;color:var(--cream)!important;border:1.5px solid var(--cream)!important}
.cta-section .cta-button--ghost:hover{background:rgba(237,231,220,.14)!important;color:var(--cream)!important}
/* ── Footers: full-bleed navy, edge to edge (brand review) ── */
.site-footer,.content-footer{max-width:none!important;width:100%!important;background:var(--navy)!important;color:var(--cream)!important;border-top:none!important;box-sizing:border-box;padding-left:max(2rem,calc((100% - 1160px)/2))!important;padding-right:max(2rem,calc((100% - 1160px)/2))!important}
.site-footer p,.site-footer a,.content-footer p,.content-footer a,.footer-text p,.footer-text a{color:var(--cream)!important}

/* ── Script (Corinthia) sizing: consistent ~1.4x the text it sits with ── */
h1 em,h2 em,h3 em{font-size:1.4em}
.nav-title em,.welcome h1 em,.stat-value em{font-size:1.4em!important}
/* ── Remap stray page vars the brand layer didn't cover (sell.html, privacy.html) ── */
:root{--charcoal:#384860;--gold:#737B93;--gold-light:#939CB2;--gold-dark:#737B93}
/* remaining Cormorant captions -> brand fonts */
.designer-title{font-family:'Corin',cursive!important;font-style:normal!important;font-size:1.3em!important;color:var(--slate)!important;text-transform:none}
.tagline,.rail-sub{font-family:'Inter TSE',sans-serif!important}
