/* Glossmith 2.1 — Calm primary-site layer
   Goal: same product and functionality, less visual competition + a genuinely light light-theme. */

:root{
  --gm-page-max:1120px;
  --gm-section-pad:clamp(3.8rem,7vw,6.2rem);
  --gm-soft-shadow:0 12px 34px rgba(0,0,0,.14);
}

/* -------------------------
   CALMER HOMEPAGE RHYTHM
   ------------------------- */
body[data-gm-page="index"] .wrap{max-width:var(--gm-page-max)}
body[data-gm-page="index"] section{padding-top:var(--gm-section-pad);padding-bottom:var(--gm-section-pad)}
body[data-gm-page="index"] .sec-title{margin-bottom:1.55rem}
body[data-gm-page="index"] .eyebrow{letter-spacing:.22em}

/* Header: fewer competing destinations on desktop. All pages remain reachable in footer / mobile menu. */
@media(min-width:1101px){
  body[data-gm-page="index"] .nav-links{gap:.48rem}
  body[data-gm-page="index"] .nav-links li:has(a[href="experience.html"]),
  body[data-gm-page="index"] .nav-links li:has(a[href="pricing.html"]),
  body[data-gm-page="index"] .nav-links li:has(a[href="knowledge.html"]),
  body[data-gm-page="index"] .nav-links li:has(a[href="#contact"]){display:none}
  body[data-gm-page="index"] .nav-links a{padding:.46rem .72rem!important;background:transparent!important;border-color:transparent!important;backdrop-filter:none!important;letter-spacing:.1em!important}
}

/* Hero: one primary + one secondary action. Keep Knowledge Centre reachable elsewhere. */
body[data-gm-page="index"] .hero-actions a[href="knowledge.html"]{display:none}
body[data-gm-page="index"] .hero-actions{gap:.75rem;margin-top:2rem}
body[data-gm-page="index"] .hero-glasscard{
  margin-top:1.7rem;padding:.72rem 1rem;gap:1rem;border-radius:999px;box-shadow:none;
  background:rgba(10,10,10,.28);border-color:rgba(255,255,255,.16)
}
body[data-gm-page="index"] .hero-glasscard .hg-num{font-size:.92rem;font-weight:600}
body[data-gm-page="index"] .hero-glasscard .hg-label{font-family:var(--sans);font-size:.52rem;letter-spacing:.08em}
body[data-gm-page="index"] .hero-sub{max-width:500px}

/* Statement becomes a quiet bridge, not another hero. */
body[data-gm-page="index"] #statement{padding-top:3.2rem;padding-bottom:3.2rem}
body[data-gm-page="index"] #statement .statement-grid{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(2rem,5vw,5rem);align-items:center}
body[data-gm-page="index"] #statement .statement-grid h2{font-size:clamp(1.65rem,3.5vw,2.45rem)}
body[data-gm-page="index"] #statement .statement-grid p{font-size:.92rem;line-height:1.65;margin:0}
body[data-gm-page="index"] #statement .statement-grid p:nth-child(2){display:none}

/* Experience promo stays, but no longer dominates the homepage. */
body[data-gm-page="index"] #experience-promo{padding-top:clamp(3.2rem,6vw,5rem)!important;padding-bottom:clamp(3.2rem,6vw,5rem)!important;min-height:0}
body[data-gm-page="index"] #experience-promo .xp-content{max-width:680px}
body[data-gm-page="index"] #experience-promo .xp-content h2{font-size:clamp(1.8rem,4.2vw,2.8rem)!important}
body[data-gm-page="index"] #experience-promo .xp-content p{font-size:.95rem!important;max-width:48ch!important;margin-bottom:1.35rem!important}

/* Turn the stats section into a compact trust strip. */
body[data-gm-page="index"] #stats{padding-top:2.2rem;padding-bottom:2.2rem}
body[data-gm-page="index"] #stats>.wrap>.eyebrow,
body[data-gm-page="index"] #stats>.wrap>.sec-title,
body[data-gm-page="index"] #stats>.wrap>div:last-child{display:none}
body[data-gm-page="index"] #stats .stats-grid{margin:0;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:var(--panel)}
body[data-gm-page="index"] #stats .stat{padding:1.15rem 1rem;border:0;border-right:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none;text-align:left}
body[data-gm-page="index"] #stats .stat:last-child{border-right:0}
body[data-gm-page="index"] #stats .stat:hover{transform:none}
body[data-gm-page="index"] #stats .stat-num{font-size:1.55rem}
body[data-gm-page="index"] #stats .stat-label{font-family:var(--sans);font-size:.63rem;letter-spacing:.06em;text-transform:none;margin-top:.32rem;line-height:1.3}

/* Services: remove instruction/link noise; cards become calmer, smaller, easier to scan. */
body[data-gm-page="index"] #services .svc-swipe-hint{margin:.65rem 0 0;font-family:var(--sans);letter-spacing:.04em;text-transform:none}
body[data-gm-page="index"] #services .svc-swipe-hint+ p,
body[data-gm-page="index"] #services .svc-swipe-hint+ p + p{display:none}
body[data-gm-page="index"] .svc-tabs{margin-top:.15rem;padding:.28rem;border-radius:16px}
body[data-gm-page="index"] .svc-tab{padding:.58rem .9rem;border-radius:12px;letter-spacing:.08em}
body[data-gm-page="index"] .svc{padding:1.65rem 1.45rem;min-height:190px;border-radius:18px;box-shadow:none}
body[data-gm-page="index"] .svc:hover{transform:translateY(-2px);box-shadow:var(--gm-soft-shadow)}
body[data-gm-page="index"] .svc-cat{margin-bottom:.85rem;letter-spacing:.14em}
body[data-gm-page="index"] .svc-name{font-size:1.35rem;margin-bottom:.55rem}
body[data-gm-page="index"] .svc-desc{line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body[data-gm-page="index"] .spec-row{opacity:.76}

/* Product philosophy: keep the feature, reduce wall-of-copy feel. */
body[data-gm-page="index"] #products .prod-intro{font-size:.92rem;line-height:1.65;margin:1rem 0 1.7rem;max-width:58ch}
body[data-gm-page="index"] #products .prod-col{padding:1.45rem 1.35rem;border-radius:18px;border-top-width:1px;box-shadow:none}
body[data-gm-page="index"] #products .prod-list{max-height:300px;overflow:auto;padding-right:.45rem;scrollbar-width:thin;scrollbar-color:var(--line2) transparent}
body[data-gm-page="index"] #products .prod-list li{font-size:.82rem;padding:.48rem 0 .48rem 1.15rem;line-height:1.45}
body[data-gm-page="index"] #products .prod-swipe-hint{display:none}
body[data-gm-page="index"] #products .prod-tabs{margin-bottom:1.25rem}

/* Feature folds are intentionally compact when closed. */
body[data-gm-page="index"] .feature-foldhead{min-height:76px;padding-top:1rem;padding-bottom:1rem}
body[data-gm-page="index"] .feature-fold.collapsed .feature-foldhead{background:transparent}

/* Quote Builder is the star: remove duplicated callout and give the product room. */
body[data-gm-page="index"] #quote{padding-top:clamp(4.5rem,8vw,7rem);padding-bottom:clamp(4.5rem,8vw,7rem)}
body[data-gm-page="index"] #quote .quote-intro{max-width:610px;font-size:.93rem;line-height:1.6;margin-bottom:1.6rem}
body[data-gm-page="index"] #quote .qb-callout{display:none}
body[data-gm-page="index"] .quote-layout{max-width:980px;gap:1.2rem}
body[data-gm-page="index"] .qb-config,
body[data-gm-page="index"] .qb-estimate{border-radius:20px;box-shadow:none}
body[data-gm-page="index"] .qb-block{padding:1.2rem 1.3rem}
body[data-gm-page="index"] .qb-note-sub{font-size:.78rem}
body[data-gm-page="index"] .qb-estimate{padding:1.35rem}
body[data-gm-page="index"] .cov3d-stage{min-height:390px}

/* Why section: less card-grid, more editorial proof. */
body[data-gm-page="index"] #why .why-grid{gap:0;margin-top:2rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
body[data-gm-page="index"] #why .why-card{background:transparent;border:0;border-right:1px solid var(--line);border-radius:0;box-shadow:none;padding:1.55rem 1.2rem}
body[data-gm-page="index"] #why .why-card:last-child{border-right:0}
body[data-gm-page="index"] #why .why-card:hover{transform:none;box-shadow:none}
body[data-gm-page="index"] #why .why-num{margin-bottom:.6rem;font-size:1.1rem}
body[data-gm-page="index"] #why .why-desc{line-height:1.55}

/* Gallery and supporting content shouldn't fight the quote builder. */
body[data-gm-page="index"] #gallery .gal-grid{gap:.8rem}
body[data-gm-page="index"] #knowledge-promo{padding-top:3rem!important;padding-bottom:3rem!important}
body[data-gm-page="index"] #before-after{padding-top:3.6rem!important;padding-bottom:3.6rem!important}
body[data-gm-page="index"] #faq{padding-top:3.8rem;padding-bottom:3.8rem}
body[data-gm-page="index"] .faq-group-label{padding:.95rem 0}
body[data-gm-page="index"] .faq-q{padding:1rem 0;font-size:.92rem}
body[data-gm-page="index"] .cta-band{padding-top:4.2rem;padding-bottom:4.2rem}
body[data-gm-page="index"] #contact{padding-top:4.2rem;padding-bottom:4.2rem}

/* -------------------------
   HIGH-CONTRAST LIGHT THEME
   ------------------------- */
:root[data-theme="light"]{
  --bg:#F5F6F1;
  --bg2:#ECEEE7;
  --panel:#FFFFFF;
  --panel2:#F2F3EE;
  --line:rgba(20,24,18,.12);
  --line2:rgba(20,24,18,.22);
  --bone:#151812;
  --white:#10120F;
  --muted:#54594F;
  --faint:#777D71;
  --grey:#D8DBD1;
  --gold:#789D00;          /* readable brand-lime text on white */
  --gold-lt:#B8FF00;       /* original electric lime for fills / accents */
  --glass-bg:rgba(255,255,255,.78);
  --glass-brd:rgba(20,24,18,.14);
  color-scheme:light;
}
:root[data-theme="light"] body{background:var(--bg)!important;color:var(--bone)!important}
:root[data-theme="light"] body[data-gm-page="index"] #statement,
:root[data-theme="light"] body[data-gm-page="index"] #products,
:root[data-theme="light"] body[data-gm-page="index"] #quote,
:root[data-theme="light"] body[data-gm-page="index"] #gallery,
:root[data-theme="light"] body[data-gm-page="index"] #faq{background:var(--bg)!important}
:root[data-theme="light"] body[data-gm-page="index"] #services,
:root[data-theme="light"] body[data-gm-page="index"] #why,
:root[data-theme="light"] body[data-gm-page="index"] #contact,
:root[data-theme="light"] body[data-gm-page="index"] footer{background:var(--bg2)!important}

/* The hero stays cinematic, but a bright navigation immediately communicates Light mode. */
:root[data-theme="light"] nav{
  background:rgba(255,255,255,.94)!important;
  border-color:rgba(20,24,18,.16)!important;
  box-shadow:0 12px 34px rgba(31,36,25,.12)!important;
}
:root[data-theme="light"] nav .logo,
:root[data-theme="light"] nav.scrolled .logo{color:#161914!important}
:root[data-theme="light"] nav .nav-links a,
:root[data-theme="light"] nav.scrolled .nav-links a{color:#383D34!important}
:root[data-theme="light"] nav .nav-links a:hover{color:#151812!important;background:rgba(184,255,0,.18)!important}
:root[data-theme="light"] .theme-toggle,
:root[data-theme="light"] .theme-toggle .tt-label,
:root[data-theme="light"] nav.scrolled .theme-toggle,
:root[data-theme="light"] nav.scrolled .theme-toggle .tt-label{color:#20251C!important}
:root[data-theme="light"] .nav-toggle span{background:#20251C!important}
:root[data-theme="light"] .nav-book,
:root[data-theme="light"] .btn-solid,
:root[data-theme="light"] .hero-cta{background:linear-gradient(135deg,#CBFF4D,#B8FF00)!important;color:#11140D!important;border-color:#A5D900!important}

/* Mobile dropdown must also become genuinely light. */
@media(max-width:1100px){
  :root[data-theme="light"] .nav-links{background:rgba(255,255,255,.98)!important;border-color:rgba(20,24,18,.13)!important;box-shadow:0 22px 50px rgba(31,36,25,.14)!important}
  :root[data-theme="light"] .nav-links a{color:#242920!important;border:0!important;background:transparent!important}
}

/* White/light surfaces are explicit rather than barely changing from charcoal. */
:root[data-theme="light"] .svc,
:root[data-theme="light"] .prod-col,
:root[data-theme="light"] .qb-config,
:root[data-theme="light"] .qb-estimate,
:root[data-theme="light"] .qb-block,
:root[data-theme="light"] .why-card,
:root[data-theme="light"] .contact-form,
:root[data-theme="light"] .modal,
:root[data-theme="light"] .faq-item,
:root[data-theme="light"] .tldr,
:root[data-theme="light"] .related a{background:#FFFFFF!important;border-color:rgba(20,24,18,.13)!important;color:var(--bone)!important}

:root[data-theme="light"] .svc:hover,
:root[data-theme="light"] .prod-col:hover{box-shadow:0 14px 35px rgba(31,36,25,.10)!important}
:root[data-theme="light"] .form-control,
:root[data-theme="light"] select.form-control,
:root[data-theme="light"] textarea.form-control{background:#FFFFFF!important;color:#151812!important;border-color:rgba(20,24,18,.18)!important}
:root[data-theme="light"] .form-control::placeholder{color:#858B7E!important}
:root[data-theme="light"] .form-control option{background:#FFFFFF!important;color:#151812!important}

/* Choice controls */
:root[data-theme="light"] .svc-tabs,
:root[data-theme="light"] .qb-modetabs,
:root[data-theme="light"] .prod-tabs{background:rgba(20,24,18,.045)!important;border-color:rgba(20,24,18,.10)!important}
:root[data-theme="light"] .svc-tab,
:root[data-theme="light"] .prod-tab,
:root[data-theme="light"] .qb-modetab,
:root[data-theme="light"] .qb-opt,
:root[data-theme="light"] .qb-film,
:root[data-theme="light"] .tint-b{color:#4D5349!important;border-color:rgba(20,24,18,.15)!important;background:#FAFBF8!important}
:root[data-theme="light"] .svc-tab.on,
:root[data-theme="light"] .prod-tab.on,
:root[data-theme="light"] .qb-modetab.on,
:root[data-theme="light"] .qb-opt.on,
:root[data-theme="light"] .qb-film.on,
:root[data-theme="light"] .tint-b.on{color:#11140D!important;background:rgba(184,255,0,.32)!important;border-color:#789D00!important}

/* Keep the vehicle studio dark in either theme: it is a deliberate product stage, not a missed theme surface. */
:root[data-theme="light"] .cov3d-stage,
:root[data-theme="light"] .feature-media,
:root[data-theme="light"] .ba-slider{background:#101210!important;border-color:#2B3028!important;color:#F5F5F5!important}
:root[data-theme="light"] .cov3d-stage .cov-hint,
:root[data-theme="light"] .gm-model-badge{color:rgba(245,245,245,.75)!important}

/* Light mode copy / lines */
:root[data-theme="light"] .prod-head h3,
:root[data-theme="light"] .prod-list li b,
:root[data-theme="light"] .hl,
:root[data-theme="light"] .feature-link,
:root[data-theme="light"] .svc-from,
:root[data-theme="light"] .faq-icon{color:#6F9100!important}
:root[data-theme="light"] .prod-list li,
:root[data-theme="light"] .svc-desc,
:root[data-theme="light"] .why-desc,
:root[data-theme="light"] .faq-a .inner,
:root[data-theme="light"] .quote-intro{color:#555B51!important}
:root[data-theme="light"] .stat-num{background:linear-gradient(120deg,#161914,#789D00)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important}

/* Keep media overlays readable even in light theme. */
:root[data-theme="light"] .feature-media .cap,
:root[data-theme="light"] .ba-tag,
:root[data-theme="light"] .ba-caption{color:#fff!important}

/* Theme-aware floating controls */
:root[data-theme="light"] .scroll-toggle{background:#FFFFFF!important;color:#607F00!important;border-color:rgba(20,24,18,.16)!important;box-shadow:0 8px 24px rgba(31,36,25,.12)!important}

/* Mobile calmness */
@media(max-width:760px){
  body[data-gm-page="index"] section{padding-top:3.5rem;padding-bottom:3.5rem}
  body[data-gm-page="index"] #hero{padding-left:1.1rem;padding-right:1.1rem}
  body[data-gm-page="index"] .hero-glasscard{display:none}
  body[data-gm-page="index"] #statement .statement-grid{grid-template-columns:1fr;gap:1rem}
  body[data-gm-page="index"] #stats .stats-grid{grid-template-columns:1fr 1fr}
  body[data-gm-page="index"] #stats .stat:nth-child(2){border-right:0}
  body[data-gm-page="index"] #stats .stat:nth-child(-n+2){border-bottom:1px solid var(--line)}
  body[data-gm-page="index"] .why-grid{grid-template-columns:1fr!important}
  body[data-gm-page="index"] #why .why-card{border-right:0;border-bottom:1px solid var(--line)}
  body[data-gm-page="index"] #why .why-card:last-child{border-bottom:0}
  body[data-gm-page="index"] #products .prod-list{max-height:260px}
}