/*
Theme Name:   Stockton Limo Child
Theme URI:    https://stocktonlimoservice.com/
Description:  Child theme for Stockton Limo & Party Bus Service. Built on GeneratePress. Provides the site's brand design system (navy/gold palette, typography, buttons, cards) plus a reusable Location Page template for local-SEO city pages.
Author:       Stockton Limo Service
Template:     generatepress
Version:      1.0.0
Text Domain:  stockton-limo-child
*/

/* ==========================================================================
   Design tokens — brand palette (navy/gold), matches the approved prototype.
   Swap these values to re-theme the whole site from one place.
   ========================================================================== */
:root{
  --slo-navy:#101d33; --slo-navy2:#16294a; --slo-navy3:#1e3358;
  --slo-gold:#c9a227; --slo-gold2:#e3c05a; --slo-gold-ink:#8a6d12;
  --slo-ink:#1a1f2b; --slo-body:#2c3444; --slo-muted:#5b657a;
  --slo-line:#e4e7ee; --slo-bg:#ffffff; --slo-bg2:#f6f8fc; --slo-card:#ffffff;
  --slo-chip:#eef2f9; --slo-shadow:0 10px 30px rgba(16,29,51,.10); --slo-shadow-sm:0 3px 12px rgba(16,29,51,.08);
  --slo-radius:16px; --slo-maxw:1180px; --slo-hero-ink:#f4f1e8;
  --slo-sans:"Segoe UI",Roboto,Helvetica,Arial,system-ui,sans-serif;
  --slo-serif:"Georgia","Times New Roman",serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --slo-ink:#eef1f7; --slo-body:#c4ccdb; --slo-muted:#93a0b8;
    --slo-line:#25324a; --slo-bg:#0b1424; --slo-bg2:#0e1a2e; --slo-card:#101f38;
    --slo-chip:#16294a; --slo-shadow:0 12px 34px rgba(0,0,0,.45); --slo-shadow-sm:0 3px 14px rgba(0,0,0,.4);
  }
}
/* Manual light/dark toggle (header theme button) — takes priority over the
   OS-level prefers-color-scheme media query above in both directions. */
:root[data-theme="dark"]{
  --slo-ink:#eef1f7; --slo-body:#c4ccdb; --slo-muted:#93a0b8;
  --slo-line:#25324a; --slo-bg:#0b1424; --slo-bg2:#0e1a2e; --slo-card:#101f38;
  --slo-chip:#16294a; --slo-shadow:0 12px 34px rgba(0,0,0,.45); --slo-shadow-sm:0 3px 14px rgba(0,0,0,.4);
}
:root[data-theme="light"]{
  --slo-ink:#1a1f2b; --slo-body:#2c3444; --slo-muted:#5b657a;
  --slo-line:#e4e7ee; --slo-bg:#ffffff; --slo-bg2:#f6f8fc; --slo-card:#ffffff;
  --slo-chip:#eef2f9; --slo-shadow:0 10px 30px rgba(16,29,51,.10); --slo-shadow-sm:0 3px 12px rgba(16,29,51,.08);
}

/* ==========================================================================
   Base overrides — light touch, defers to GeneratePress for layout/grid.
   ========================================================================== */
body.stockton-limo{ color:var(--slo-body); background:var(--slo-bg); font-family:var(--slo-sans); line-height:1.65; }
.stockton-limo h1, .stockton-limo h2, .stockton-limo h3{ font-family:var(--slo-serif); color:var(--slo-ink); line-height:1.15; font-weight:700; }
.stockton-limo a{ color:inherit; }
.slo-wrap{ max-width:var(--slo-maxw); margin:0 auto; padding:0 22px; }
.slo-eyebrow{ font-family:var(--slo-sans); text-transform:uppercase; letter-spacing:.22em; font-size:.72rem; font-weight:700; color:var(--slo-gold-ink); }
@media (prefers-color-scheme:dark){ .slo-eyebrow{ color:var(--slo-gold2); } }
.slo-center{ text-align:center; }
.slo-section{ padding:70px 0; }
.slo-section.slo-tight{ padding:48px 0; }
.slo-lead{ font-size:1.06rem; color:var(--slo-muted); max-width:660px; }
.slo-center .slo-lead{ margin-inline:auto; }
.slo-band{ background:var(--slo-bg2); border-top:1px solid var(--slo-line); border-bottom:1px solid var(--slo-line); }

/* Buttons */
.slo-btn{ display:inline-flex; align-items:center; gap:.55em; font-family:var(--slo-sans); font-weight:700; font-size:.98rem;
  padding:.85em 1.4em; border-radius:999px; border:1.5px solid transparent; cursor:pointer; transition:.18s; white-space:nowrap; text-decoration:none; }
.slo-btn:focus-visible{ outline:3px solid var(--slo-gold); outline-offset:2px; }
.slo-btn-gold{ background:linear-gradient(135deg,var(--slo-gold2),var(--slo-gold)); color:#231a02; box-shadow:0 6px 18px rgba(201,162,39,.35); }
.slo-btn-gold:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(201,162,39,.45); color:#231a02; }
.slo-btn-ghost{ background:transparent; border-color:rgba(255,255,255,.5); color:#fff; }
.slo-btn-ghost:hover{ background:rgba(255,255,255,.12); color:#fff; }
.slo-btn-outline{ background:transparent; border-color:var(--slo-gold); color:var(--slo-gold-ink); }
.slo-btn-outline:hover{ background:var(--slo-gold); color:#231a02; }
@media (prefers-color-scheme:dark){ .slo-btn-outline{ color:var(--slo-gold2); } }

/* Hero (with optional background photo) */
.slo-hero{ position:relative; color:var(--slo-hero-ink); background:linear-gradient(160deg,#0c1729,#132546 55%,#0d1b33); overflow:hidden; }
.slo-hero .slo-photolayer{ position:absolute; inset:0; z-index:0; }
.slo-hero .slo-photolayer img{ width:100%; height:100%; object-fit:cover; opacity:.42; }
.slo-hero .slo-photolayer::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(9,17,32,.92) 0%,rgba(9,17,32,.72) 42%,rgba(9,17,32,.35) 100%); }
.slo-hero .slo-wrap{ position:relative; z-index:2; padding:56px 22px 66px; }
.slo-crumb{ font-family:var(--slo-sans); font-size:.82rem; color:#aeb9d0; margin-bottom:14px; }
.slo-crumb a{ color:#d8e0f0; text-decoration:none; }
.slo-crumb a:hover{ color:var(--slo-gold2); }
.slo-hero h1{ color:#fff; font-size:clamp(2rem,4.6vw,3.1rem); margin-bottom:.35em; max-width:16em; }
.slo-hero p.slo-sub{ color:#dbe2f1; font-size:1.1rem; max-width:34em; margin-bottom:1.5em; }
.slo-hero .slo-cta{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:1.5em; }
.slo-trust{ display:flex; gap:22px; flex-wrap:wrap; font-size:.9rem; color:#cdd6e8; }
.slo-trust div{ display:flex; align-items:center; gap:8px; }
.slo-trust svg{ width:18px; height:18px; color:var(--slo-gold2); flex:none; }

/* Grid + cards */
.slo-grid{ display:grid; gap:22px; }
.slo-g2{ grid-template-columns:repeat(2,1fr); }
.slo-g3{ grid-template-columns:repeat(3,1fr); }
.slo-g4{ grid-template-columns:repeat(4,1fr); }
.slo-split{ display:grid; grid-template-columns:1.05fr .95fr; gap:40px; align-items:center; }
.slo-card{ background:var(--slo-card); border:1px solid var(--slo-line); border-radius:var(--slo-radius); padding:24px; box-shadow:var(--slo-shadow-sm); transition:.18s; }
.slo-card:hover{ transform:translateY(-4px); box-shadow:var(--slo-shadow); border-color:color-mix(in srgb,var(--slo-gold) 40%,var(--slo-line)); }
.slo-svc .slo-ic{ width:50px; height:50px; border-radius:12px; background:linear-gradient(135deg,var(--slo-navy3),var(--slo-navy)); display:grid; place-items:center; margin-bottom:13px; border:1px solid rgba(201,162,39,.35); }
.slo-svc .slo-ic svg{ width:25px; height:25px; color:var(--slo-gold2); }
.slo-svc h3{ margin-bottom:.3em; font-size:1.18rem; }
.slo-svc p{ font-size:.93rem; margin:0; }

/* Feature strip */
.slo-feat{ display:flex; gap:13px; align-items:flex-start; }
.slo-feat .slo-fic{ width:42px; height:42px; flex:none; border-radius:10px; background:var(--slo-chip); display:grid; place-items:center; border:1px solid var(--slo-line); }
.slo-feat .slo-fic svg{ width:21px; height:21px; color:var(--slo-gold-ink); }
@media (prefers-color-scheme:dark){ .slo-feat .slo-fic svg{ color:var(--slo-gold2); } }
.slo-feat h3{ font-family:var(--slo-sans); font-size:.98rem; margin-bottom:.2em; }
.slo-feat p{ font-size:.89rem; margin:0; }

/* Featured vehicle photo block */
.slo-hummer-photo{ border-radius:var(--slo-radius); overflow:hidden; box-shadow:var(--slo-shadow); border:1px solid var(--slo-line); position:relative; background:linear-gradient(135deg,var(--slo-navy3),var(--slo-navy)); min-height:280px; }
.slo-hummer-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.slo-spec{ display:flex; flex-wrap:wrap; gap:10px; margin:14px 0 0; }
.slo-spec span{ background:var(--slo-chip); border:1px solid var(--slo-line); border-radius:999px; padding:.4em .9em; font-size:.84rem; font-weight:600; color:var(--slo-body); }

/* Vehicle / fleet cards */
.slo-vehicle{ overflow:hidden; padding:0; }
.slo-vehicle .slo-photo{ aspect-ratio:16/10; position:relative; display:grid; place-items:center; overflow:hidden; background:linear-gradient(135deg,var(--slo-navy3),var(--slo-navy)); color:#8ea0c2; }
.slo-vehicle .slo-photo svg{ width:66px; height:66px; color:rgba(201,162,39,.75); }
.slo-vehicle .slo-photo > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:1; }
.slo-vehicle .slo-photo .slo-tag{ position:absolute; top:12px; left:12px; z-index:2; background:rgba(0,0,0,.5); color:#fff; font-size:.68rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:4px 9px; border-radius:999px; }
/* Transparent-PNG vehicle shots (Stretch Limo, SUV, Party Bus): shown whole
   (not cropped) on a fixed light backdrop so the black vehicles stay visible
   in both light and dark mode. */
.slo-vehicle .slo-photo.slo-photo-contain{ background:linear-gradient(160deg,#f3f5f9,#e6eaf1); }
.slo-vehicle .slo-photo.slo-photo-contain > img{ object-fit:contain; padding:14px; }
.slo-vehicle .slo-body{ padding:16px 18px 20px; }
.slo-vehicle h3{ margin-bottom:.15em; font-size:1.05rem; }
.slo-vehicle .slo-cap{ font-size:.85rem; color:var(--slo-muted); display:flex; align-items:center; gap:7px; }
.slo-vehicle .slo-cap svg{ width:16px; height:16px; color:var(--slo-gold-ink); }

/* Service-area chips */
.slo-areas{ display:flex; flex-wrap:wrap; gap:10px; }
.slo-areas a{ background:var(--slo-chip); border:1px solid var(--slo-line); padding:.5em 1em; border-radius:999px; font-size:.9rem; font-weight:600; color:var(--slo-body); text-decoration:none; transition:.15s; }
.slo-areas a:hover{ border-color:var(--slo-gold); color:var(--slo-gold-ink); transform:translateY(-2px); }

/* FAQ accordion */
.slo-faq{ max-width:820px; margin:0 auto; }
.slo-faq details{ background:var(--slo-card); border:1px solid var(--slo-line); border-radius:12px; padding:2px 20px; margin-bottom:12px; box-shadow:var(--slo-shadow-sm); }
.slo-faq summary{ cursor:pointer; font-family:var(--slo-sans); font-weight:700; color:var(--slo-ink); padding:16px 0; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.slo-faq summary::-webkit-details-marker{ display:none; }
.slo-faq summary::after{ content:"+"; color:var(--slo-gold); font-size:1.4rem; font-weight:400; transition:.2s; }
.slo-faq details[open] summary::after{ transform:rotate(45deg); }
.slo-faq p{ padding:0 0 16px; margin:0; font-size:.95rem; }

/* CTA band */
.slo-ctaband{ position:relative; background:radial-gradient(900px 400px at 80% 120%,rgba(201,162,39,.25),transparent 60%),linear-gradient(135deg,#0c1729,#16294a); color:#fff; border-radius:24px; padding:50px 40px; overflow:hidden; text-align:center; }
.slo-ctaband h2{ color:#fff; }
.slo-ctaband p{ color:#d8e0f0; max-width:34em; margin:0 auto 1.4em; }
.slo-ctaband .slo-cta{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* Stats band */
.slo-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; text-align:center; }
.slo-stats .slo-s b{ display:block; font-family:var(--slo-serif); font-size:2rem; color:var(--slo-gold-ink); }
@media (prefers-color-scheme:dark){ .slo-stats .slo-s b{ color:var(--slo-gold2); } }
.slo-stats .slo-s span{ font-size:.86rem; color:var(--slo-muted); }

/* Top bar + badge */
.slo-topbar{ background:var(--slo-navy); color:#cfd8ea; font-size:.85rem; }
.slo-topbar .slo-wrap{ display:flex; gap:18px; align-items:center; justify-content:space-between; padding:8px 22px; flex-wrap:wrap; }
.slo-topbar a{ color:#e7ecf7; text-decoration:none; }
.slo-topbar .slo-tset{ display:flex; gap:20px; align-items:center; flex-wrap:wrap; }
.slo-badge{ display:inline-flex; align-items:center; gap:7px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12); padding:5px 11px; border-radius:999px; font-size:.78rem; color:#cdd6e8; }

/* Responsive */
@media (max-width:960px){
  .slo-split{ grid-template-columns:1fr; gap:26px; }
  .slo-g4, .slo-g3{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .slo-g4, .slo-g3, .slo-g2{ grid-template-columns:1fr; }
  .slo-section{ padding:52px 0; }
  .slo-ctaband{ padding:38px 22px; }
  .slo-topbar .slo-tset:last-child{ display:none; }
}

/* ==========================================================================
   GeneratePress integration fixes — confirmed live 2026-07-21.
   Without these, GeneratePress's own layout/nav CSS conflicts with this
   theme's full-width custom templates. Required, not optional.
   ========================================================================== */

/* GeneratePress's #content.site-content uses CSS Grid for its own
   main-content + sidebar layout. Since our custom templates don't include
   GeneratePress's #primary/#secondary wrapper structure, each of our
   top-level <section> elements was being placed into its own grid column
   instead of stacking vertically. Forcing block display fixes it. */
#content.site-content{
  display: block !important;
}

/* Hero visibility + mobile fallback for the two-column hero grid
   (headline column + booking card column), which is set via inline style
   in template-homepage.php and has no built-in mobile breakpoint. */
.slo-hero{
  min-height: 560px;
  isolation: isolate;
}
@media (max-width:960px){
  .slo-hero > .slo-wrap{ grid-template-columns: 1fr !important; }
}

/* GeneratePress's own link/paragraph color rules were winning over this
   theme's text color inside card components (e.g. the homepage booking
   card), rendering text too faint to read. */
.slo-card p,
.slo-card p a{
  color: var(--slo-ink) !important;
}

/* GeneratePress's primary nav (nav.main-navigation ul.sf-menu) wraps to a
   second line on laptop-width screens once the logo + site title area and
   5 menu items compete for space. Compacting the menu items buys enough
   room to keep it on one line. */
.main-navigation .sf-menu > li > a{
  font-size: 0.85rem !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
}

/* ==========================================================================
   Custom header (header.php) — replaces GeneratePress's default header,
   which was using the site's old, oversized logo image and plain nav with
   no CTA. Matches the design already used on the approved homepage/location
   page prototypes.
   ========================================================================== */
.slo-nav{ position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--slo-bg) 92%, transparent); backdrop-filter:blur(10px); border-bottom:1px solid var(--slo-line); }
.slo-nav .slo-wrap{ display:flex; align-items:center; justify-content:space-between; padding:14px 22px; gap:16px; }
.slo-brand{ display:flex; align-items:center; gap:12px; text-decoration:none; }
.slo-brand .slo-mark{ width:52px; height:52px; flex:none; border-radius:12px; background:linear-gradient(135deg,var(--slo-navy3),var(--slo-navy)); display:grid; place-items:center; border:1px solid rgba(201,162,39,.5); padding:5px; box-sizing:border-box; overflow:hidden; }
.slo-brand .slo-mark img{ max-width:100%; max-height:100%; width:auto; height:auto; display:block; }
.slo-brand .slo-name{ font-family:var(--slo-serif); font-weight:700; color:var(--slo-ink); font-size:1.16rem; line-height:1.05; }
.slo-brand .slo-name span{ display:block; font-family:var(--slo-sans); font-weight:600; font-size:.64rem; letter-spacing:.24em; text-transform:uppercase; color:var(--slo-gold-ink); }
@media (prefers-color-scheme:dark){ .slo-brand .slo-name span{ color:var(--slo-gold2); } }

.slo-menu{ display:flex; gap:26px; align-items:center; font-family:var(--slo-sans); font-weight:600; font-size:.94rem; list-style:none; margin:0; padding:0; }
.slo-menu li{ margin:0; }
.slo-menu a{ color:var(--slo-body); padding:6px 0; position:relative; text-decoration:none; display:inline-block; }
.slo-menu a:hover{ color:var(--slo-ink); }
.slo-menu a::after{ content:""; position:absolute; left:0; right:100%; bottom:-2px; height:2px; background:var(--slo-gold); transition:right .2s; }
.slo-menu a:hover::after{ right:0; }

.slo-nav-cta{ display:flex; align-items:center; gap:12px; }
.slo-themebtn{ background:var(--slo-chip); border:1px solid var(--slo-line); color:var(--slo-ink); width:40px; height:40px; border-radius:10px; cursor:pointer; display:grid; place-items:center; font-size:1.05rem; }
.slo-hamburger{ display:none; background:var(--slo-chip); border:1px solid var(--slo-line); color:var(--slo-ink); width:44px; height:44px; border-radius:10px; cursor:pointer; font-size:1.2rem; }

@media (max-width:800px){
  .slo-menu, .slo-nav-cta .slo-btn{ display:none; }
  .slo-hamburger{ display:grid; place-items:center; }
}
.slo-menu.slo-open{
  display:flex; position:absolute; top:100%; left:0; right:0; flex-direction:column;
  background:var(--slo-bg); border-bottom:1px solid var(--slo-line); padding:16px 22px; gap:14px; z-index:60;
}

/* ==========================================================================
   Booking / quote form (Reservation page) — styles the Contact Form 7 output
   to match the site design and be mobile-first + accessible.
   ========================================================================== */
.slo-bookform{ background:var(--slo-card); border:1px solid var(--slo-line); border-radius:var(--slo-radius); padding:26px; box-shadow:var(--slo-shadow-sm); }
.slo-bf-group{ margin-bottom:22px; }
.slo-bf-legend{ font-family:var(--slo-sans); font-weight:800; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color:var(--slo-gold-ink); margin:0 0 14px; padding-bottom:8px; border-bottom:1px solid var(--slo-line); }
@media (prefers-color-scheme:dark){ .slo-bf-legend{ color:var(--slo-gold2); } }
.slo-bf-field{ display:block; font-family:var(--slo-sans); font-weight:600; font-size:.82rem; color:var(--slo-muted); margin-bottom:14px; }
.slo-bf-field .req{ color:#c0392b; }
.slo-bf-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width:560px){ .slo-bf-row{ grid-template-columns:1fr; } }
.slo-bookform input,.slo-bookform select,.slo-bookform textarea{
  width:100%; margin-top:6px; padding:.75em .85em; border:1.5px solid var(--slo-line); border-radius:10px;
  background:var(--slo-bg2); color:var(--slo-ink); font:inherit; font-weight:400; min-height:48px; box-sizing:border-box; }
.slo-bookform textarea{ min-height:96px; }
.slo-bookform input:focus,.slo-bookform select:focus,.slo-bookform textarea:focus{ outline:none; border-color:var(--slo-gold); box-shadow:0 0 0 3px rgba(201,162,39,.18); }
.slo-bf-submit{ margin:6px 0 0; }
.slo-bookform .wpcf7-submit{
  width:100%; min-height:54px; background:linear-gradient(135deg,var(--slo-gold2),var(--slo-gold)); color:#231a02;
  border:none; border-radius:999px; font-family:var(--slo-sans); font-weight:800; font-size:1.05rem; cursor:pointer;
  box-shadow:0 6px 18px rgba(201,162,39,.35); transition:.18s; }
.slo-bookform .wpcf7-submit:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(201,162,39,.45); }
.slo-bookform .wpcf7-submit:focus-visible{ outline:3px solid var(--slo-gold); outline-offset:2px; }
.slo-bf-trust{ text-align:center; font-size:.84rem; color:var(--slo-muted); margin:12px 0 0; }
.slo-bookform .wpcf7-not-valid-tip{ color:#c0392b; font-size:.78rem; font-weight:600; margin-top:4px; }
.slo-bookform .wpcf7-not-valid{ border-color:#c0392b !important; }
.slo-bookform .wpcf7-response-output{ border-radius:10px; padding:12px 14px !important; margin:16px 0 0 !important; font-size:.9rem; }
.slo-bookform .wpcf7-form.invalid .wpcf7-response-output,.slo-bookform .wpcf7-form.failed .wpcf7-response-output{ border:1.5px solid #c0392b !important; color:#a5281b; background:#fdecea; }
.slo-bookform .wpcf7-form.sent .wpcf7-response-output{ border:1.5px solid #1e8449 !important; color:#1e6b3a; background:#eafaf0; }
.slo-bookform .wpcf7-spinner{ margin:10px auto 0; display:block; }
/* Secondary "book online instantly" option (keeps the MyLimoBiz system as a choice) */
.slo-book-alt{ text-align:center; margin-top:22px; padding:24px; border:1px dashed var(--slo-line); border-radius:var(--slo-radius); background:var(--slo-bg2); }
.slo-book-alt p{ margin:0 0 12px; color:var(--slo-body); font-size:.95rem; }

/* ==========================================================================
   Live-tested fixes now baked in permanently (previously added via Theme
   File Editor, which got overwritten on each theme re-upload).
   ========================================================================== */
/* Hide GeneratePress's default blog sidebar site-wide — the design is
   intentionally sidebar-free everywhere. */
#secondary, .widget-area, aside.sidebar { display: none; }
/* Contact page (post 5001): its two-card row top-aligns instead of the
   default center-align, which left an awkward gap above the shorter card. */
body.page-id-5001 .slo-split { align-items: start; }