/* ══════════════════════════════════════════════════════════════════════════
   MAVEN HOMES — PUBLIC SHELL STYLESHEET  (public-shell.css)
   Extracted from the owner-approved Phase 3B shell reference:
     WEBSITE_GOVERNANCE/APPROVED_PROTOTYPES/phase3b-shell-preview-approved-2026-09-02.html
     (SHA-256 e691c37a…670af1, 35,225 bytes)
   Reusable presentation for FUTURE PUBLIC MARKETING PAGES ONLY. Values are the
   approved values, preserved verbatim — not reinterpreted. This file links no
   remote resource, embeds no font, and contains no operational/portal styling.
   Pair with public-shell.js (enhancement only) and the existing, unmodified
   /revo-chat.css (public Revo widget). The Revo rules below are shell OVERRIDES
   of the launcher only; they never touch the chat panel (.revo-window).
   ══════════════════════════════════════════════════════════════════════════ */

/* ── DESIGN TOKENS ──────────────────────────────────────────────────────── */
:root{
  --black:#0A0A0A; --dark:#111111; --charcoal:#1A1A1A; --surface:#1c1c1c;
  --gold:#C8A951; --gold-bright:#D8BC78; --sunrise:#C8963E;
  --cream:#F5F0E8; --text-primary:#E8E2D8; --text-secondary:#A09888; --text-tertiary:#8A8175; /* AA (>=4.5:1) on footer/dark grounds */
  --border:rgba(200,169,81,0.12); --border-strong:rgba(200,169,81,0.24);
  --ease-out:cubic-bezier(0.33,1,0.68,1);
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --editorial:'Cormorant Garamond',Georgia,serif;
  --sans:'Outfit','Helvetica Neue',Arial,sans-serif;
  --header-h:76px;
}

/* ── FOUNDATIONS ────────────────────────────────────────────────────────── */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--black); color:var(--cream);
  font-family:var(--sans); font-weight:300; line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px; border-radius:2px;}

/* ── SKIP LINK ──────────────────────────────────────────────────────────── */
.skip-link{
  position:absolute; left:12px; top:-48px; z-index:100;
  background:var(--gold); color:var(--black); padding:.6rem 1rem;
  border-radius:4px; font-weight:500; transition:top .2s var(--ease-out);
}
.skip-link:focus{top:12px;}

/* ── HEADER ─────────────────────────────────────────────────────────────── */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:50; height:var(--header-h);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 clamp(1.1rem,4vw,3rem);
  background:var(--black);   /* fully opaque — page content must never leak through/behind the header (was rgba .82 + backdrop-blur, which also flickered on dropdown-child repaint) */
  border-bottom:1px solid var(--border);
}
.brand{display:flex; align-items:center; gap:.7rem;}
.brand img{width:38px; height:38px;}
.brand-text{display:flex; flex-direction:column; line-height:1;}
.brand-name{font-family:var(--serif); font-size:1.16rem; font-weight:600; color:var(--cream); letter-spacing:.02em;}
.brand-sub{font-size:.6rem; text-transform:uppercase; letter-spacing:.28em; color:var(--text-secondary); margin-top:.28rem;}

/* ── DESKTOP NAVIGATION ─────────────────────────────────────────────────── */
.primary-nav{display:flex; align-items:center; gap:.35rem;}
.primary-nav > a,
.services-toggle{
  font-family:var(--sans); font-size:.86rem; font-weight:300; letter-spacing:.03em;
  color:var(--text-primary); padding:.55rem .85rem; border-radius:4px;
  background:none; transition:color .3s var(--ease-out);
}
.primary-nav > a:hover,
.services-toggle:hover{color:var(--gold);}

/* ── SERVICES DROPDOWN ──────────────────────────────────────────────────── */
.has-dropdown{position:relative;}
.services-toggle{display:inline-flex; align-items:center; gap:.4rem; cursor:pointer;}
.services-toggle .caret{width:8px; height:8px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg) translateY(-1px); transition:transform .3s var(--ease-out);}
.services-toggle[aria-expanded="true"] .caret{transform:rotate(-135deg) translateY(-1px);}
.services-toggle[aria-expanded="true"]{color:var(--gold);}

.dropdown-menu{
  position:absolute; top:calc(100% + 10px); left:50%; transform:translateX(-50%) translateY(-6px);
  min-width:288px; margin:0; padding:.5rem; list-style:none;
  background:var(--dark); border:1px solid var(--border-strong); border-radius:10px;
  box-shadow:0 24px 50px -20px rgba(0,0,0,0.75);
  opacity:0; visibility:hidden; pointer-events:none; transition:opacity .22s var(--ease-out), transform .22s var(--ease-out), visibility .22s;
}
.has-dropdown.open .dropdown-menu{opacity:1; visibility:visible; pointer-events:auto; transform:translateX(-50%) translateY(0);}
.dropdown-menu li{margin:0;}
.dropdown-menu a{
  display:block; padding:.72rem .9rem; border-radius:6px;
  font-size:.9rem; color:var(--text-primary); transition:background .2s var(--ease-out), color .2s var(--ease-out);
}
.dropdown-menu a:hover,
.dropdown-menu a:focus-visible{background:var(--charcoal); color:var(--gold);}
.dropdown-menu .overview{color:var(--gold); font-weight:400; border-bottom:1px solid var(--border); border-radius:6px 6px 0 0; margin-bottom:.25rem;}

/* ── HEADER CTA (Get a Quote) ───────────────────────────────────────────── */
.primary-nav a.nav-cta{
  margin-left:.5rem; padding:.6rem 1.35rem; border-radius:40px;
  background:var(--gold); color:var(--black); font-weight:500; font-size:.84rem; letter-spacing:.03em;
  transition:background .3s var(--ease-out), transform .3s var(--ease-out);
}
.primary-nav a.nav-cta:hover{background:var(--gold-bright); color:var(--black); transform:translateY(-1px);}

/* ── HAMBURGER ──────────────────────────────────────────────────────────── */
.menu-toggle{
  display:none; width:44px; height:44px; align-items:center; justify-content:center;
  flex-direction:column; gap:5px; background:none; cursor:pointer; border-radius:6px;
}
.menu-toggle span{display:block; width:24px; height:1.6px; background:var(--cream); transition:transform .3s var(--ease-out), opacity .3s var(--ease-out);}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(6.6px) rotate(45deg);}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg);}

/* ── MOBILE DRAWER + SCRIM ──────────────────────────────────────────────── */
.mobile-scrim{
  position:fixed; inset:0; z-index:60; background:rgba(0,0,0,0.55);
  opacity:0; visibility:hidden; transition:opacity .3s var(--ease-out), visibility .3s;
}
.mobile-scrim.open{opacity:1; visibility:visible;}
.mobile-menu{
  position:fixed; top:0; right:0; z-index:70; height:100dvh; width:min(86vw,360px);
  background:var(--dark); border-left:1px solid var(--border-strong);
  transform:translateX(100%); visibility:hidden; transition:transform .34s var(--ease-out), visibility 0s linear .34s;
  display:flex; flex-direction:column; padding:calc(var(--header-h) + .5rem) 1.4rem 2rem; overflow-y:auto;
}
.mobile-menu.open{transform:translateX(0); visibility:visible; transition:transform .34s var(--ease-out), visibility 0s;}
.mobile-close{position:absolute; top:20px; right:18px; width:42px; height:42px; font-size:1.5rem; color:var(--text-secondary); background:none; border-radius:6px;}
.mobile-menu a{padding:.85rem .25rem; font-size:1.02rem; color:var(--text-primary); border-bottom:1px solid var(--border);}
.mobile-menu a:hover{color:var(--gold);}
.mobile-group-label{margin:1rem .25rem .25rem; font-size:.66rem; text-transform:uppercase; letter-spacing:.22em; color:var(--text-tertiary);}
.mobile-menu .child{padding-left:1rem; font-size:.95rem; color:var(--text-secondary);}
.mobile-menu .mobile-cta{
  margin-top:1.4rem; text-align:center; background:var(--gold); color:var(--black);
  border-radius:40px; font-weight:500; border-bottom:none; padding:.9rem;
}
.mobile-menu .mobile-cta:hover{background:var(--gold-bright); color:var(--black);}

/* Body scroll-lock state while the drawer is open (set by public-shell.js). */
body.drawer-open{overflow:hidden;}

/* ── HERO ───────────────────────────────────────────────────────────────── */
main{display:block;}
.page-hero{
  padding:calc(var(--header-h) + clamp(3rem,9vw,6.5rem)) clamp(1.2rem,5vw,3rem) clamp(3rem,7vw,5rem);
  background:radial-gradient(120% 90% at 50% 0%, #141210 0%, var(--black) 62%);
  border-bottom:1px solid var(--border); text-align:center;
}
.hero-inner{max-width:820px; margin:0 auto;}
.eyebrow{font-size:.72rem; text-transform:uppercase; letter-spacing:.34em; color:var(--gold); margin-bottom:1.3rem;}
.page-hero h1{
  font-family:var(--serif); font-weight:600; color:var(--cream);
  font-size:clamp(2.1rem,5.4vw,3.5rem); line-height:1.12; margin:0 0 1.3rem; letter-spacing:.005em;
}
.hero-lede{font-family:var(--editorial); font-size:clamp(1.1rem,2.4vw,1.4rem); color:var(--text-secondary); font-weight:300; max-width:600px; margin:0 auto 2.3rem;}
.hero-ctas{display:flex; gap:1rem; justify-content:center; flex-wrap:wrap;}

/* ── BUTTONS ────────────────────────────────────────────────────────────── */
.btn-gold{background:var(--gold); color:var(--black); padding:.85rem 1.9rem; border-radius:40px; font-weight:500; font-size:.9rem; letter-spacing:.02em; transition:background .3s var(--ease-out), transform .3s var(--ease-out);}
.btn-gold:hover{background:var(--gold-bright); transform:translateY(-2px);}
.btn-gold:focus-visible{outline:2px solid var(--cream); outline-offset:3px;}
.btn-outline{border:1px solid var(--border-strong); color:var(--cream); padding:.85rem 1.9rem; border-radius:40px; font-size:.9rem; letter-spacing:.02em; transition:border-color .3s var(--ease-out), color .3s var(--ease-out);}
.btn-outline:hover{border-color:var(--gold); color:var(--gold);}

/* ── SECTION BANDS & CARDS ──────────────────────────────────────────────── */
.section{padding:clamp(3rem,7vw,5.5rem) clamp(1.2rem,5vw,3rem);}
.section-inner{max-width:960px; margin:0 auto;}
.section h2{font-family:var(--serif); font-weight:500; color:var(--cream); font-size:clamp(1.5rem,3.4vw,2.1rem); margin:0 0 1.1rem;}
.section p{color:var(--text-secondary); max-width:640px; margin:0 0 1rem;}
.placeholder-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; margin-top:2.2rem;}
.placeholder-card{background:var(--charcoal); border:1px solid var(--border); border-radius:10px; padding:1.6rem;}
.placeholder-card h3{font-family:var(--serif); font-weight:500; font-size:1.1rem; color:var(--gold); margin:0 0 .6rem;}
.placeholder-card p{font-size:.88rem; margin:0;}
.alt-band{background:var(--dark); border-top:1px solid var(--border); border-bottom:1px solid var(--border);}

/* ── FOOTER (four-column) ───────────────────────────────────────────────── */
.site-footer{background:#080808; border-top:1px solid var(--border); padding:clamp(2.8rem,6vw,4rem) clamp(1.2rem,5vw,3rem) 1.6rem;}
.footer-main{max-width:1120px; margin:0 auto; display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:2.4rem;}
.footer-brand-name{font-family:var(--serif); font-size:1.25rem; font-weight:600; color:var(--cream);}
.footer-tagline{font-family:var(--editorial); color:var(--gold); font-size:1rem; margin:.5rem 0 .9rem;}
.footer-desc{color:var(--text-secondary); font-size:.86rem; max-width:320px;}
.footer-heading{font-size:.7rem; text-transform:uppercase; letter-spacing:.2em; color:var(--gold); margin-bottom:1rem;}
.footer-col a, .footer-col span{display:block; color:var(--text-secondary); font-size:.88rem; padding:.32rem 0; transition:color .25s var(--ease-out);}
.footer-col a:hover{color:var(--gold);}
.footer-col .addr{color:var(--text-tertiary); font-size:.82rem; line-height:1.5; padding-top:.5rem;}
.footer-bottom{max-width:1120px; margin:2.6rem auto 0; padding-top:1.5rem; border-top:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap;}
.footer-copy{color:var(--text-tertiary); font-size:.78rem;}
.footer-social{display:flex; gap:1rem;}
.footer-social a{color:var(--text-secondary); transition:color .25s var(--ease-out);}
.footer-social a:hover{color:var(--gold);}

/* ── RESPONSIVE BREAKPOINTS ─────────────────────────────────────────────── */
@media (max-width:900px){
  .primary-nav{display:none;}
  .menu-toggle{display:flex;}
  .placeholder-grid{grid-template-columns:1fr;}
  .footer-main{grid-template-columns:1fr 1fr;}
}
@media (max-width:560px){
  .footer-main{grid-template-columns:1fr; gap:1.8rem;}
  .footer-bottom{flex-direction:column; align-items:flex-start;}
  .hero-ctas{flex-direction:column;}
  .hero-ctas .btn-gold,.hero-ctas .btn-outline{width:100%; text-align:center;}
}

/* ── REDUCED MOTION (global shell protection) ───────────────────────────── */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important; transition-duration:.001ms!important; scroll-behavior:auto!important;}
  .mobile-menu{transition-delay:0s!important;}
}

/* ══════════════════════════════════════════════════════════════════════════
   PUBLIC REVO LAUNCHER — SHELL OVERRIDES (closed launcher only)
   Layered over the unmodified /revo-chat.css by later cascade (!important).
   One smoked-glass language: desktop >=901px full pill (sunrise + "Ask
   Maven"); tablet 601-900px smaller pill; mobile <=600px icon circle. Subtle
   reflective sweep; restrained hover/focus/active; backdrop-filter fallback;
   reduced-motion disables the sweep; drawer-open + footer-proximity hides
   (proximity hide is applied by public-shell.js). These rules target only
   .revo-launcher — the chat panel (.revo-window) is never touched and stays
   opaque. The widget's ::after speech tail and (display:none) badge remain
   intact; the reflection is clipped by border-radius, not overflow:hidden.
   ══════════════════════════════════════════════════════════════════════════ */
/* Smoked-glass surface (all widths) */
.revo-launcher{
  background:rgba(12,11,9,0.55) !important;
  -webkit-backdrop-filter:blur(12px) saturate(1.3) !important;
  backdrop-filter:blur(12px) saturate(1.3) !important;
  border:1px solid rgba(200,169,81,0.62) !important;
  box-shadow:0 10px 28px -8px rgba(0,0,0,0.70), inset 0 1px 0 rgba(255,255,255,0.10) !important;
  /* Replace the widget's on-load "hello" glow + idle pulse with the single
     reflective sweep — no pulse, no continuous glow. */
  animation:none !important;
  transition:transform .3s ease, background-color .3s ease, border-color .3s ease, box-shadow .3s ease !important;
}
.revo-launcher.revo-pulsing{ animation:none !important; }   /* suppress idle glow pulse */
/* Keep icon/label/badge crisp above the reflection layer */
.revo-launcher > svg,
.revo-launcher > .revo-launch-lbl,
.revo-launcher > .revo-badge{ position:relative; z-index:1; }

/* Reflective light-sweep — faint diagonal cream/gold highlight travelling
   across the smoked glass, clipped to the pill/circle by border-radius. */
.revo-launcher::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background:linear-gradient(115deg, transparent 44%, rgba(245,240,232,0.20) 50%, rgba(200,169,81,0.10) 54%, transparent 60%);
  background-size:250% 100%; background-repeat:no-repeat; background-position:160% 0;
  animation:revoGlassSweep 10s ease-in-out infinite;
}
@keyframes revoGlassSweep{
  0%, 86% { background-position:160% 0; }   /* rest ~8.6s: reflection off-frame */
  100%    { background-position:-60% 0; }    /* ~1.4s: reflection passes across */
}

/* Restrained interaction feedback */
.revo-launcher:focus-visible{ outline:2px solid var(--gold) !important; outline-offset:3px !important; }
@media (hover:hover){
  .revo-launcher:hover{
    transform:translateY(-1px) !important;                       /* <=1px lift */
    background:rgba(20,18,14,0.62) !important;                    /* slight brighten */
    border-color:rgba(200,169,81,0.85) !important;
    box-shadow:0 12px 30px -8px rgba(0,0,0,0.72), inset 0 1px 0 rgba(255,255,255,0.14) !important;
  }
}
.revo-launcher:active{ transform:translateY(0) scale(0.99) !important; }

/* Tablet 601-900: smaller glass pill (sunrise + "Ask Maven") */
@media (max-width:900px){
  .revo-launcher{
    height:48px !important;
    padding:0 16px 0 12px !important;
    right:16px !important;
    bottom:calc(16px + env(safe-area-inset-bottom)) !important;
  }
  .revo-launcher .revo-launch-lbl{ display:inline !important; font-size:12.5px !important; }
}

/* Mobile <=600: compact glass circle (sunrise only) */
@media (max-width:600px){
  .revo-launcher{
    width:52px !important; min-width:52px !important; height:52px !important;
    padding:0 !important; gap:0 !important; justify-content:center !important;
    border-radius:50% !important;
  }
  .revo-launcher .revo-launch-lbl{ display:none !important; }
}

/* Fallback when backdrop-filter is unavailable: more opaque near-black so the
   control never becomes a barely-visible transparent shape (after the base
   rule so it wins). */
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .revo-launcher{ background:rgba(12,11,9,0.94) !important; }
}

/* Reduced motion: no sweep, no lift/transition movement; glass + focus remain. */
@media (prefers-reduced-motion:reduce){
  .revo-launcher{ transition:none !important; }
  .revo-launcher::before{ animation:none !important; background-position:160% 0 !important; }
  .revo-launcher:hover{ transform:none !important; }
}

/* Drawer open: hide the launcher entirely (display:none removes it from the
   tab order); restored when the drawer closes. */
body.drawer-open .revo-launcher{ display:none !important; }