/* ============================================================
   Lux4Rides — opt-in LIGHT theme for landing-render pages
   Added 2026-10-07. A page turns it on with
       $page_body_class = 'l4r-light';
       $page_styles     = ['/assets/css/landing-light-20261007.css'];
   Every rule is scoped to body.l4r-light, so the 300+ landing pages
   that do not set the class render exactly as before.
   Palette (owner's light directive, 2026-09-17): ink #14130F, body
   #3A3832, muted #6E6A61, hairline #E6E3DC, cream #FAF9F6, gold text
   #7A5F22 (6:1 on white); bright gold stays for icons and button fills.
   The photo hero keeps its dark overlay and white type; the final CTA
   is a deliberate ink band. Everything between is white.
   ============================================================ */

body.l4r-light{ background:#FFFFFF; color:#14130F; }

body.l4r-light main.l4r-page{
  --bg:#FFFFFF; --bg-dark:#14130F; --bg-card:#FFFFFF;
  --fg:#14130F; --fg-muted:#3A3832; --fg-subtle:#6E6A61;
  --border:#E6E3DC; --border-accent:#D9C79E;
  --grad-card:#FFFFFF;
  --shadow-card:0 12px 32px -20px rgba(20,19,15,.28);
  --shadow-gold:0 14px 34px -18px rgba(122,95,34,.30);
  background:#FFFFFF; color:#14130F;
}

/* ---- Hero: photo + overlay stays dark, so its type stays light ---- */
body.l4r-light .l4r-page .hero{
  --fg:#f5f5f0; --fg-muted:rgba(255,255,255,.84); --border:rgba(255,255,255,.22);
}
body.l4r-light .l4r-page .hero .hero-badge{
  color:#FFD27A; background:rgba(255,165,0,.12); border-color:rgba(255,194,75,.38);
}
body.l4r-light .l4r-page .hero .btn-glass{
  background:rgba(255,255,255,.08); color:#FFFFFF; border-color:rgba(255,255,255,.28);
}
body.l4r-light .l4r-page .hero .btn-glass:hover{ background:rgba(255,255,255,.16); color:#FFFFFF; border-color:#FFD27A; }
/* the generic white-area p/li rules below must not reach the hero's copy */
body.l4r-light .l4r-page .hero p, body.l4r-light .l4r-page .hero .hero-subtitle,
body.l4r-light .l4r-page .hero li{ color:rgba(255,255,255,.90); }
body.l4r-light .l4r-page .hero .hero-subtitle strong{ color:#FFFFFF; }

/* ---- Type and links in the white area ---- */
body.l4r-light .l4r-page h1, body.l4r-light .l4r-page h2, body.l4r-light .l4r-page h3,
body.l4r-light .l4r-page h4{ color:#14130F; }
body.l4r-light .l4r-page p, body.l4r-light .l4r-page li{ color:#3A3832; }
body.l4r-light .l4r-page .card p a,
body.l4r-light .l4r-page .accordion-content a,
body.l4r-light .l4r-page .l4r-sources-list a{
  color:#7A5F22; font-weight:600; text-decoration:underline; text-underline-offset:3px;
  text-decoration-thickness:1.5px; border-bottom:0;
}
body.l4r-light .l4r-page .card p a:hover,
body.l4r-light .l4r-page .accordion-content a:hover,
body.l4r-light .l4r-page .l4r-sources-list a:hover{ color:#5C4718; opacity:1; }

/* ---- Breadcrumb + trust strip ---- */
body.l4r-light .l4r-page .breadcrumb{ color:#6E6A61; }
body.l4r-light .l4r-page .breadcrumb a{ color:#3A3832; }
body.l4r-light .l4r-page .breadcrumb a:hover,
body.l4r-light .l4r-page .breadcrumb span{ color:#7A5F22; }
body.l4r-light .l4r-page .trust-strip{
  background:#FAF9F6; border-top:1px solid #E6E3DC; border-bottom:1px solid #E6E3DC;
}
body.l4r-light .l4r-page .trust-item{ color:#3A3832; }
body.l4r-light .l4r-page .trust-item svg{ stroke:#B8965A; }

/* ---- Cards ---- */
body.l4r-light .l4r-page .card{
  background:#FFFFFF; border:1px solid #E6E3DC; box-shadow:0 1px 2px rgba(20,19,15,.04);
}
body.l4r-light .l4r-page .card:hover{ border-color:#D9C79E; box-shadow:0 14px 34px -18px rgba(122,95,34,.30); }
body.l4r-light .l4r-page .card h3, body.l4r-light .l4r-page .card h4{ color:#14130F; }
body.l4r-light .l4r-page .card ul li{ color:#3A3832; }
body.l4r-light .l4r-page .card ul li::before{ background:#B8965A; }

/* badges used as section eyebrows inside the white area */
body.l4r-light .l4r-page .hero-badge{
  color:#7A5F22; background:#FBF4E3; border:1px solid #E6D9BE;
}

/* ---- Quick answer ---- */
body.l4r-light .l4r-page .l4r-qa{
  background:#FAF9F6; border:1px solid #E6D9BE; border-left:4px solid #B8965A;
  box-shadow:0 1px 2px rgba(20,19,15,.04);
}
body.l4r-light .l4r-page .l4r-qa-tag{ color:#7A5F22; }
body.l4r-light .l4r-page .l4r-qa p{ color:#14130F; }

/* ---- Buttons in the white area ---- */
body.l4r-light .l4r-page .btn-glass{
  background:#FFFFFF; color:#14130F; border:1px solid #CFCAC0;
  backdrop-filter:none; -webkit-backdrop-filter:none;
}
body.l4r-light .l4r-page .btn-glass:hover{ background:#FAF9F6; color:#7A5F22; border-color:#7A5F22; }
body.l4r-light .l4r-page .btn-primary{ color:#14130F; box-shadow:0 10px 26px -14px rgba(122,95,34,.55); }

/* ---- Quick facts table ---- */
body.l4r-light .l4r-page .l4r-facts th{ color:#7A5F22; }
body.l4r-light .l4r-page .l4r-facts td{ color:#3A3832; }
body.l4r-light .l4r-page .l4r-facts th, body.l4r-light .l4r-page .l4r-facts td{ border-bottom-color:#E6E3DC; }

/* ---- Steps ---- */
body.l4r-light .l4r-page .l4r-step-n{ color:#14130F; box-shadow:0 8px 18px -10px rgba(122,95,34,.6); }
body.l4r-light .l4r-page .l4r-step-body p{ color:#3A3832; }

/* ---- Do / avoid checklist ---- */
body.l4r-light .l4r-page .l4r-check{ border-color:#E6E3DC; }
body.l4r-light .l4r-page .l4r-check--do{ background:#F1FAF4; border-color:#BFE3CC; }
body.l4r-light .l4r-page .l4r-check--avoid{ background:#FCF2EF; border-color:#F0C7BC; }
body.l4r-light .l4r-page .l4r-check--do h3{ color:#1E7A45; }
body.l4r-light .l4r-page .l4r-check--avoid h3{ color:#B3412B; }
body.l4r-light .l4r-page .l4r-check--do .l4r-check-ic{ stroke:#1E7A45; }
body.l4r-light .l4r-page .l4r-check--avoid .l4r-check-ic{ stroke:#B3412B; }
body.l4r-light .l4r-page .l4r-check li{ color:#3A3832; }

/* ---- Sources ---- */
body.l4r-light .l4r-page .l4r-note{ color:#6E6A61; }

/* ---- Fleet cards ---- */
body.l4r-light .l4r-page .fleet-card{ background:#FFFFFF; border-color:#E6E3DC; }
body.l4r-light .l4r-page .fleet-card p{ color:#3A3832; }

/* ---- Why Lux4Rides band ---- */
body.l4r-light .l4r-page .l4r-why{ background:#FAF9F6; border:1px solid #E6D9BE; }
body.l4r-light .l4r-page .l4r-why-card p{ color:#3A3832; }
body.l4r-light .l4r-page .l4r-why-ic{ background:#FBF4E3; border-color:#E6D9BE; }
body.l4r-light .l4r-page .l4r-why-laweekly{ color:#7A5F22; }

/* ---- FAQ accordion ---- */
body.l4r-light .l4r-page .accordion-item{ background:#FFFFFF; border-color:#E6E3DC; }
body.l4r-light .l4r-page .accordion-header{ color:#14130F; }
body.l4r-light .l4r-page .accordion-header:hover{ background:#FAF9F6; }
body.l4r-light .l4r-page .accordion-icon{ color:#7A5F22; }
body.l4r-light .l4r-page .accordion-content p{ color:#3A3832; }

/* ---- Final CTA: a deliberate ink band (its inline white type stays white) ---- */
body.l4r-light .l4r-page .cta-section.section-dark{
  background:linear-gradient(135deg,#1F1C16 0%,#14130F 100%); border:1px solid #E6E3DC;
}
body.l4r-light .l4r-page .cta-section .btn-glass{
  background:rgba(255,255,255,.08); color:#FFFFFF; border-color:rgba(255,255,255,.28);
}
body.l4r-light .l4r-page .cta-section .btn-glass:hover{ background:rgba(255,255,255,.16); color:#FFFFFF; border-color:#FFD27A; }

/* ---- Focus rings visible on white ---- */
body.l4r-light .l4r-page a:focus-visible,
body.l4r-light .l4r-page .btn:focus-visible,
body.l4r-light .l4r-page .accordion-header:focus-visible{ outline:3px solid #7A5F22; outline-offset:3px; border-radius:6px; }
