/*
Theme Name: CineScroll
Theme URI: https://levelupvip.online
Author: Xtream Solutions
Author URI: https://xtreamsolution.net
Description: Full-screen cinematic WordPress theme. Per-page YouTube/video/image/slider backgrounds, floating sticky nav, multi-industry layouts. AI-video-ready.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: cinescroll
Tags: full-screen, video-background, business, real-estate, auto-dealer
*/

:root {
  --cs-primary: #0a0a0a;
  --cs-accent: #c9a84c;
  --cs-accent-dark: #9a7a2e;
  --cs-text: #ffffff;
  --cs-text-muted: rgba(255,255,255,0.65);
  --cs-overlay: rgba(0,0,0,0.45);
  --cs-font-display: 'Cormorant Garamond', Georgia, serif;
  --cs-font-body: 'DM Sans', system-ui, sans-serif;
  --cs-nav-height: 72px;
  --cs-section-pad: clamp(80px,10vw,140px);
  --cs-ease: cubic-bezier(0.25,0.46,0.45,0.94);
  --cs-ease-out: cubic-bezier(0.16,1,0.3,1);
}
body.industry-real-estate { --cs-accent:#c9a84c; --cs-accent-dark:#9a7a2e; }
body.industry-hvac         { --cs-accent:#2196F3; --cs-accent-dark:#1565C0; }
body.industry-auto         { --cs-accent:#E53935; --cs-accent-dark:#B71C1C; }
body.industry-service      { --cs-accent:#00BFA5; --cs-accent-dark:#00796B; }
body.industry-freight      { --cs-accent:#052a7b; --cs-accent-dark:#041f5c; }
*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { font-size:16px; scroll-behavior:smooth; -webkit-font-smoothing:antialiased; }
body { font-family:var(--cs-font-body); background:var(--cs-primary); color:var(--cs-text); overflow-x:hidden; }
img, video { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; transition:color .25s var(--cs-ease); }
#cs-nav {
  position:fixed; top:0; left:0; right:0; z-index:9999;
  height:var(--cs-nav-height);
  background:rgba(8,8,8,0);
  transition:background .4s var(--cs-ease), box-shadow .4s var(--cs-ease);
}
#cs-nav.scrolled {
  background:rgba(8,8,8,0.96);
  backdrop-filter:blur(18px);
  box-shadow:0 1px 0 rgba(255,255,255,0.06);
}
.cs-nav-inner {
  max-width:1440px; margin:0 auto;
  padding:0 clamp(20px,4vw,60px);
  height:100%; display:flex; align-items:center;
  justify-content:space-between; gap:32px;
}
.cs-nav-logo-text { font-family:var(--cs-font-display); font-size:1.5rem; font-weight:700; color:#fff; }
.cs-nav-logo-text span { color:var(--cs-accent); }
.cs-nav-menu { display:flex; align-items:center; gap:4px; list-style:none; }
.cs-nav-menu a { display:block; padding:8px 16px; font-size:.875rem; font-weight:500; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.8); position:relative; }
.cs-nav-menu a::after { content:''; position:absolute; bottom:2px; left:16px; right:16px; height:1px; background:var(--cs-accent); transform:scaleX(0); transform-origin:left; transition:transform .3s var(--cs-ease-out); }
.cs-nav-menu a:hover { color:#fff; }
.cs-nav-menu a:hover::after { transform:scaleX(1); }
.cs-nav-cta { display:inline-flex; align-items:center; gap:8px; padding:10px 24px; background:var(--cs-accent); color:#fff!important; font-size:.8rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; border-radius:2px; transition:background .2s,transform .2s; white-space:nowrap; }
.cs-nav-cta:hover { background:var(--cs-accent-dark); transform:translateY(-1px); }
.cs-nav-hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:8px; background:none; border:none; }
.cs-nav-hamburger span { display:block; width:26px; height:2px; background:#fff; transition:transform .3s,opacity .3s; }
.cs-nav-hamburger.open span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.cs-nav-hamburger.open span:nth-child(2) { opacity:0; }
.cs-nav-hamburger.open span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
#cs-mobile-nav { display:none; position:fixed; inset:0; background:rgba(0,0,0,.97); z-index:9998; flex-direction:column; align-items:center; justify-content:center; gap:8px; }
#cs-mobile-nav.open { display:flex; }
#cs-mobile-nav a { font-family:var(--cs-font-display); font-size:clamp(2rem,6vw,3.5rem); font-weight:300; letter-spacing:.05em; color:rgba(255,255,255,.85); padding:12px 40px; }
#cs-mobile-nav a:hover { color:var(--cs-accent); }
@media(max-width:900px){ .cs-nav-menu,.cs-nav-cta{display:none;} .cs-nav-hamburger{display:flex;} }
.cs-hero { position:relative; width:100%; height:100vh; min-height:600px; display:flex; align-items:center; overflow:hidden; }
.cs-bg-layer { position:absolute; inset:0; z-index:0; }
.cs-bg-youtube { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.cs-bg-youtube iframe { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:177.78vh; height:100vh; min-width:100%; min-height:56.25vw; pointer-events:none; }
.cs-bg-video video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.cs-bg-image { position:absolute; inset:0; background-size:cover; background-position:center; transform:scale(1.05); transition:transform 8s var(--cs-ease); }
.cs-hero:hover .cs-bg-image { transform:scale(1.0); }
.cs-bg-slider { position:absolute; inset:0; }
.cs-bg-slider .cs-slide { position:absolute; inset:0; opacity:0; transition:opacity 1.2s var(--cs-ease); }
.cs-bg-slider .cs-slide.active { opacity:1; }
.cs-bg-slider .cs-slide video,.cs-bg-slider .cs-slide img { width:100%; height:100%; object-fit:cover; }
.cs-overlay { position:absolute; inset:0; z-index:1; background:var(--cs-overlay); }
.cs-overlay.gradient-bottom { background:linear-gradient(to bottom,rgba(0,0,0,.1) 0%,rgba(0,0,0,.3) 50%,rgba(0,0,0,.85) 100%); }
.cs-hero-content { position:relative; z-index:2; width:100%; max-width:1440px; margin:0 auto; padding:var(--cs-nav-height) clamp(20px,5vw,80px) 0; }
.cs-hero-eyebrow { display:inline-flex; align-items:center; gap:10px; font-size:.75rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--cs-accent); margin-bottom:20px; opacity:0; animation:cs-fade-up .8s var(--cs-ease-out) .3s forwards; }
.cs-hero-eyebrow::before { content:''; display:block; width:32px; height:1px; background:var(--cs-accent); }
.cs-hero-title { font-family:var(--cs-font-display); font-size:clamp(3rem,8vw,7rem); font-weight:300; line-height:1; letter-spacing:-.02em; color:#fff; max-width:900px; opacity:0; animation:cs-fade-up .8s var(--cs-ease-out) .5s forwards; }
.cs-hero-title strong { font-weight:700; font-style:italic; }
.cs-hero-title .accent { color:var(--cs-accent); }
.cs-hero-subtitle { margin-top:24px; font-size:clamp(1rem,1.5vw,1.2rem); color:var(--cs-text-muted); max-width:520px; line-height:1.7; opacity:0; animation:cs-fade-up .8s var(--cs-ease-out) .7s forwards; }
.cs-hero-actions { margin-top:40px; display:flex; align-items:center; gap:16px; flex-wrap:wrap; opacity:0; animation:cs-fade-up .8s var(--cs-ease-out) .9s forwards; }
.cs-btn { display:inline-flex; align-items:center; gap:10px; padding:16px 36px; font-family:var(--cs-font-body); font-size:.85rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; border:none; cursor:pointer; transition:all .25s var(--cs-ease); border-radius:2px; }
.cs-btn-primary { background:var(--cs-accent); color:#fff; }
.cs-btn-primary:hover { background:var(--cs-accent-dark); transform:translateY(-2px); box-shadow:0 12px 40px rgba(0,0,0,.4); }
.cs-btn-outline { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.5); }
.cs-btn-outline:hover { border-color:#fff; background:rgba(255,255,255,.08); transform:translateY(-2px); }
.cs-scroll-indicator { position:absolute; bottom:40px; left:50%; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:10px; opacity:0; animation:cs-fade-in 1s var(--cs-ease-out) 1.5s forwards; }
.cs-scroll-indicator span { font-size:.65rem; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.5); }
.cs-scroll-line { width:1px; height:48px; background:linear-gradient(to bottom,var(--cs-accent),transparent); animation:cs-scroll-pulse 2s ease-in-out infinite; }
.cs-section { position:relative; padding:var(--cs-section-pad) clamp(20px,5vw,80px); max-width:1440px; margin:0 auto; }
.cs-section-dark { background:#060606; }
.cs-section-mid { background:#0e0e0e; }
.cs-label { display:inline-flex; align-items:center; gap:10px; font-size:.7rem; font-weight:700; letter-spacing:.25em; text-transform:uppercase; color:var(--cs-accent); margin-bottom:16px; }
.cs-label::before { content:''; display:block; width:24px; height:1px; background:var(--cs-accent); }
.cs-heading { font-family:var(--cs-font-display); font-size:clamp(2.2rem,4.5vw,4rem); font-weight:300; line-height:1.1; color:#fff; }
.cs-heading strong { font-weight:700; font-style:italic; }
.cs-subheading { margin-top:16px; font-size:1.05rem; color:var(--cs-text-muted); max-width:600px; line-height:1.7; }
.cs-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(24px,4vw,48px); }
.cs-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(24px,4vw,48px); }
.cs-grid-2 { display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(24px,4vw,48px); align-items:center; }
@media(max-width:1024px){ .cs-grid-4{grid-template-columns:repeat(2,1fr);} .cs-grid-3{grid-template-columns:repeat(2,1fr);} }
@media(max-width:640px){ .cs-grid-4,.cs-grid-3,.cs-grid-2{grid-template-columns:1fr;} }
.cs-card { padding:40px 36px; border:1px solid rgba(255,255,255,.07); background:rgba(255,255,255,.025); transition:border-color .3s,background .3s,transform .3s var(--cs-ease); position:relative; overflow:hidden; }
.cs-card::before { content:''; position:absolute; top:0; left:0; width:100%; height:2px; background:linear-gradient(90deg,var(--cs-accent),transparent); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--cs-ease-out); }
.cs-card:hover { border-color:rgba(255,255,255,.15); background:rgba(255,255,255,.05); transform:translateY(-4px); }
.cs-card:hover::before { transform:scaleX(1); }
.cs-stats-bar { display:flex; align-items:stretch; border-top:1px solid rgba(255,255,255,.07); border-bottom:1px solid rgba(255,255,255,.07); }
.cs-stat-item { flex:1; padding:40px 32px; text-align:center; border-right:1px solid rgba(255,255,255,.07); }
.cs-stat-item:last-child { border-right:none; }
.cs-stat-number { font-family:var(--cs-font-display); font-size:clamp(2.5rem,5vw,4rem); font-weight:700; color:var(--cs-accent); line-height:1; display:block; }
.cs-stat-label { display:block; margin-top:8px; font-size:.75rem; font-weight:600; letter-spacing:.15em; text-transform:uppercase; color:rgba(255,255,255,.4); }
.cs-split { display:grid; grid-template-columns:1fr 1fr; min-height:60vh; }
.cs-split-visual { position:relative; overflow:hidden; min-height:400px; }
.cs-split-visual video,.cs-split-visual img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.cs-split-body { padding:clamp(48px,8vw,100px) clamp(32px,5vw,80px); display:flex; flex-direction:column; justify-content:center; background:#080808; }
@media(max-width:768px){ .cs-split{grid-template-columns:1fr;} }
.cs-cta-section { position:relative; padding:clamp(80px,10vw,140px) clamp(20px,5vw,80px); text-align:center; overflow:hidden; }
.cs-cta-content { position:relative; z-index:2; max-width:700px; margin:0 auto; }
#cs-footer { background:#040404; border-top:1px solid rgba(255,255,255,.06); }
.cs-footer-main { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:48px; padding:80px clamp(20px,5vw,80px); max-width:1440px; margin:0 auto; }
.cs-footer-bottom { border-top:1px solid rgba(255,255,255,.05); padding:24px clamp(20px,5vw,80px); max-width:1440px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; }
.cs-footer-bottom p { font-size:.78rem; color:rgba(255,255,255,.3); }
@media(max-width:900px){ .cs-footer-main{grid-template-columns:1fr 1fr;} }
@media(max-width:640px){ .cs-footer-main{grid-template-columns:1fr;} .cs-stats-bar{flex-wrap:wrap;} .cs-stat-item{flex:0 0 50%;} }
.cs-reveal { opacity:0; transform:translateY(16px); transition:opacity .6s var(--cs-ease-out),transform .6s var(--cs-ease-out); } /* B2B tuning: 16px/0.6s for authority-first feel */
.cs-reveal.visible { opacity:1; transform:translateY(0); }
.cs-reveal-delay-1{transition-delay:.1s;} .cs-reveal-delay-2{transition-delay:.2s;} .cs-reveal-delay-3{transition-delay:.3s;} .cs-reveal-delay-4{transition-delay:.4s;}
@keyframes cs-fade-up { from{opacity:0;transform:translateY(28px);} to{opacity:1;transform:translateY(0);} }
@keyframes cs-fade-in { from{opacity:0;} to{opacity:1;} }
@keyframes cs-scroll-pulse { 0%,100%{opacity:.3;} 50%{opacity:1;} }
.admin-bar #cs-nav { top:32px; }

/* =====================================================
   LIGHT / DARK MODE — COLOR SCHEMES
   ===================================================== */

/* Default is DARK (existing vars stay) */
:root,
[data-theme="dark"] {
  --cs-primary:        #0a0a0a;
  --cs-primary-mid:    #0e0e0e;
  --cs-primary-light:  #141414;
  --cs-surface:        rgba(255,255,255,0.03);
  --cs-surface-hover:  rgba(255,255,255,0.06);
  --cs-border:         rgba(255,255,255,0.07);
  --cs-border-hover:   rgba(255,255,255,0.15);
  --cs-text:           #ffffff;
  --cs-text-muted:     rgba(255,255,255,0.55);
  --cs-text-faint:     rgba(255,255,255,0.3);
  --cs-nav-solid:      rgba(8,8,8,0.96);
  --cs-footer-bg:      #040404;
  --cs-card-bg:        rgba(255,255,255,0.025);
  --cs-shadow:         0 4px 24px rgba(0,0,0,0.4);
}

[data-theme="light"] {
  --cs-primary:        #f5f4f0;
  --cs-primary-mid:    #edecea;
  --cs-primary-light:  #ffffff;
  --cs-surface:        rgba(0,0,0,0.03);
  --cs-surface-hover:  rgba(0,0,0,0.06);
  --cs-border:         rgba(0,0,0,0.09);
  --cs-border-hover:   rgba(0,0,0,0.2);
  --cs-text:           #0f0f0f;
  --cs-text-muted:     rgba(0,0,0,0.55);
  --cs-text-faint:     rgba(0,0,0,0.35);
  --cs-nav-solid:      rgba(245,244,240,0.96);
  --cs-footer-bg:      #e8e7e3;
  --cs-card-bg:        rgba(0,0,0,0.025);
  --cs-shadow:         0 4px 24px rgba(0,0,0,0.1);
}

/* Warm sepia tone */
[data-theme="sepia"] {
  --cs-primary:        #f5efe6;
  --cs-primary-mid:    #ede5d8;
  --cs-primary-light:  #faf6f0;
  --cs-surface:        rgba(0,0,0,0.03);
  --cs-surface-hover:  rgba(0,0,0,0.06);
  --cs-border:         rgba(139,90,43,0.15);
  --cs-border-hover:   rgba(139,90,43,0.3);
  --cs-text:           #2c1a0e;
  --cs-text-muted:     rgba(44,26,14,0.6);
  --cs-text-faint:     rgba(44,26,14,0.35);
  --cs-accent:         #8b5a2b;
  --cs-accent-dark:    #6b4020;
  --cs-nav-solid:      rgba(245,239,230,0.97);
  --cs-footer-bg:      #e5dcd0;
  --cs-card-bg:        rgba(139,90,43,0.05);
  --cs-shadow:         0 4px 24px rgba(44,26,14,0.1);
}

/* Deep navy */
[data-theme="navy"] {
  --cs-primary:        #0d1b2e;
  --cs-primary-mid:    #112240;
  --cs-primary-light:  #1a3358;
  --cs-surface:        rgba(255,255,255,0.04);
  --cs-surface-hover:  rgba(255,255,255,0.08);
  --cs-border:         rgba(255,255,255,0.08);
  --cs-border-hover:   rgba(255,255,255,0.18);
  --cs-text:           #e8f0fe;
  --cs-text-muted:     rgba(232,240,254,0.6);
  --cs-text-faint:     rgba(232,240,254,0.3);
  --cs-accent:         #4da6ff;
  --cs-accent-dark:    #2080d0;
  --cs-nav-solid:      rgba(13,27,46,0.97);
  --cs-footer-bg:      #080f1a;
  --cs-card-bg:        rgba(255,255,255,0.03);
  --cs-shadow:         0 4px 24px rgba(0,0,0,0.5);
}

/* Apply theme vars to existing elements */
body { background: var(--cs-primary); color: var(--cs-text); }
#cs-nav.scrolled { background: var(--cs-nav-solid); }
#cs-footer { background: var(--cs-footer-bg); }
.cs-section-dark { background: var(--cs-primary); }
.cs-section-mid  { background: var(--cs-primary-mid); }
.cs-card {
  background: var(--cs-card-bg);
  border-color: var(--cs-border);
  box-shadow: var(--cs-shadow);
}
.cs-card:hover { border-color: var(--cs-border-hover); background: var(--cs-surface-hover); }
.cs-heading, .cs-hero-title { color: var(--cs-text); }
.cs-subheading, .cs-hero-subtitle { color: var(--cs-text-muted); }
.cs-nav-menu a { color: var(--cs-text-muted); }
.cs-nav-menu a:hover { color: var(--cs-text); }
.cs-stat-label { color: var(--cs-text-faint); }
.cs-footer-bottom p { color: var(--cs-text-faint); }

/* Light mode specific overrides */
[data-theme="light"] .cs-nav-hamburger span,
[data-theme="sepia"] .cs-nav-hamburger span { background: var(--cs-text); }

[data-theme="light"] #cs-mobile-nav,
[data-theme="sepia"] #cs-mobile-nav { background: var(--cs-primary); }

[data-theme="light"] #cs-mobile-nav a,
[data-theme="sepia"] #cs-mobile-nav a { color: var(--cs-text); }

[data-theme="light"] .cs-stats-bar,
[data-theme="sepia"] .cs-stats-bar,
[data-theme="navy"]  .cs-stats-bar {
  border-color: var(--cs-border);
}
[data-theme="light"] .cs-stat-item,
[data-theme="sepia"] .cs-stat-item,
[data-theme="navy"]  .cs-stat-item { border-right-color: var(--cs-border); }

/* =====================================================
   THEME SWITCHER WIDGET
   ===================================================== */
.cs-theme-switcher {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: 8px;
}

.cs-theme-btn {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
  position: relative;
  flex-shrink: 0;
  background: none;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  line-height: 1;
}

.cs-theme-btn:hover { transform: scale(1.15); }
.cs-theme-btn.active { border-color: var(--cs-accent); }

/* Swatch colors */
.cs-theme-btn[data-theme="dark"]  { background: #1a1a1a; }
.cs-theme-btn[data-theme="light"] { background: #f0ede8; }
.cs-theme-btn[data-theme="sepia"] { background: #c9956a; }
.cs-theme-btn[data-theme="navy"]  { background: #112240; }

/* Tooltip */
.cs-theme-btn::after {
  content: attr(data-label);
  position: absolute;
  bottom: -28px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.8);
  color: #fff;
  font-size: 10px;
  padding: 3px 7px;
  border-radius: 3px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
  z-index: 10;
}
.cs-theme-btn:hover::after { opacity: 1; }

/* Transition for smooth theme switches */
body, #cs-nav, #cs-footer, .cs-card, .cs-section-dark, .cs-section-mid {
  transition:
    background-color 0.35s ease,
    color 0.35s ease,
    border-color 0.25s ease;
}

/* =====================================================
   THEME SWITCHER — visibility fix
   Explicitly shown at desktop, hidden at mobile
   (mobile version lives inside #cs-mobile-nav)
   ===================================================== */
.cs-nav-inner .cs-theme-switcher {
  display: flex !important;
  align-items: center;
  gap: 6px;
  margin-left: 12px;
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .cs-nav-inner .cs-theme-switcher {
    display: none !important;
  }
}

/* Slightly larger hit targets */
.cs-theme-btn {
  width: 22px;
  height: 22px;
  min-width: 22px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  transition: border-color 0.2s, transform 0.2s;
  padding: 0;
  outline: none;
}

.cs-theme-btn.active  { border-color: var(--cs-accent); transform: scale(1.2); }
.cs-theme-btn:hover   { transform: scale(1.15); }
.cs-theme-btn[data-theme="dark"]  { background: #1a1a1a; border-color: rgba(255,255,255,0.2); }
.cs-theme-btn[data-theme="light"] { background: #f0ede8; border-color: rgba(0,0,0,0.15); }
.cs-theme-btn[data-theme="sepia"] { background: #c9956a; }
.cs-theme-btn[data-theme="navy"]  { background: #112240; border-color: rgba(255,255,255,0.2); }
.cs-theme-btn.active  { border-color: var(--cs-accent) !important; }

/* =====================================================
   NAV LAYOUT FIX — make room for theme switcher
   Total nav items were overflowing 1440px viewport.
   Solution: reduce gap, cap menu width, move switcher
   to display inline between CTA and hamburger.
   ===================================================== */
.cs-nav-inner {
  gap: 16px;
}

/* Tighten menu link padding so long menus don't overflow */
.cs-nav-menu a {
  padding: 8px 10px;
  font-size: 0.78rem;
}

/* Switcher must be flex, not block */
.cs-nav-inner .cs-theme-switcher {
  display: flex !important;
  flex-shrink: 0;
  gap: 5px;
  align-items: center;
  margin-left: 0;
  order: 4;
}

/* Make each swatch smaller so 4 fit cleanly */
.cs-theme-btn {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  border-radius: 50%;
  flex-shrink: 0;
}

/* Hamburger always last */
.cs-nav-hamburger {
  order: 5;
}

/* =====================================================
   MOBILE NAV — logo wrap fix + tight layout
   ===================================================== */
.cs-nav-logo-text {
  white-space: nowrap;
  font-size: clamp(1.1rem, 3.5vw, 1.5rem);
  line-height: 1;
}

/* At very small widths shrink CTA text */
@media (max-width: 480px) {
  .cs-nav-cta {
    font-size: 0.7rem;
    padding: 8px 14px;
    letter-spacing: 0.06em;
  }
}

/* Mobile theme switcher — show nicely inside mobile nav */
#cs-mobile-nav .cs-theme-switcher {
  display: flex !important;
  gap: 14px;
  margin-top: 32px;
  justify-content: center;
}

#cs-mobile-nav .cs-theme-btn {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 50%;
}

/* =====================================================
   YOUTUBE BG — MOBILE FALLBACK
   YouTube IFrame API autoplay is blocked on mobile.
   Show YT on desktop (>900px), fallback on mobile.
   ===================================================== */

/* Mobile fallback layer — same positioning as bg layers */
.cs-bg-mobile-fallback {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: none; /* hidden on desktop */
}

.cs-bg-mobile-fallback video {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
}

.cs-bg-mobile-fallback.cs-bg-mobile-gradient {
  background: linear-gradient(160deg, #1a0f00 0%, #0a0a0a 60%, #0f0a1a 100%);
}

/* Desktop: show YouTube, hide fallback */
@media (min-width: 901px) {
  .cs-bg-youtube    { display: block; }
  .cs-bg-mobile-fallback { display: none; }
}

/* Mobile: hide YouTube iframe (avoids "unavailable" flash), show fallback */
@media (max-width: 900px) {
  .cs-bg-youtube    { display: none; }
  .cs-bg-mobile-fallback { display: block; }
}

/* =====================================================
   NAV READABILITY
   Text shadow ensures menu items readable over any
   background colour (hero video, light, dark, sepia)
   ===================================================== */
.cs-nav-menu a,
.cs-nav-logo-text {
  text-shadow: 0 1px 8px rgba(0,0,0,0.6);
}

/* When scrolled (solid bg) remove shadow */
#cs-nav.scrolled .cs-nav-menu a,
#cs-nav.scrolled .cs-nav-logo-text {
  text-shadow: none;
}

/* Light/sepia themes — darken nav text on scrolled solid bg */
[data-theme="light"] #cs-nav.scrolled .cs-nav-menu > li > a,
[data-theme="sepia"] #cs-nav.scrolled .cs-nav-menu > li > a {
  color: rgba(0,0,0,0.7);
}
[data-theme="light"] #cs-nav.scrolled .cs-nav-menu > li > a:hover,
[data-theme="sepia"] #cs-nav.scrolled .cs-nav-menu > li > a:hover {
  color: var(--cs-accent);
}
[data-theme="light"] #cs-nav.scrolled .cs-nav-logo-text,
[data-theme="sepia"] #cs-nav.scrolled .cs-nav-logo-text {
  color: #1a1a1a;
}

/* =====================================================
   STILL IMAGE → VIDEO TRANSITION SYSTEM
   
   Load order:
   1. .cs-bg-poster    — CSS background-image, instant
   2. .cs-bg-fade-in   — opacity:0 initially
   3. JS fires on canplay/onReady → adds .cs-bg-ready
   4. .cs-bg-ready     — opacity:1, transition 1.2s
   
   If video never fires: poster stays forever (fallback)
   ===================================================== */

/* Poster layer — always visible, loads via CSS (instant) */
.cs-bg-poster {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.cs-bg-poster--dark {
  background: linear-gradient(160deg, #0a0a12 0%, #0a0a0a 100%);
}

/* Video/YouTube layers — start invisible */
.cs-bg-fade-in {
  opacity: 0;
  transition: opacity 1.2s ease-in-out;
}

/* JS adds this class when video/YT is ready to play */
.cs-bg-fade-in.cs-bg-ready {
  opacity: 1;
}

/* Ensure video layer sits above poster */
.cs-bg-fade-in {
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* Video element inside fade-in wrapper */
.cs-bg-fade-in video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* YouTube wrapper inside fade-in */
.cs-bg-youtube.cs-bg-fade-in {
  z-index: 1;
}

/* Overlay sits above everything */
.cs-bg-layer .cs-overlay {
  z-index: 2;
}

/* =====================================================
   NOTE: Offman Cleaning industry override removed 2026-06-06.
   Per-industry accent colors are defined in :root at the top
   of this file (body.industry-freight = #052a7b, etc).
   body.industry-service is defined there too — do not re-add
   a duplicate block here.
   ===================================================== */

/* =====================================================
   CINESCROLL — TRANSITION VARIATIONS v1.1.0
   8 creative still→video transition styles.
   Applied via data-cs-transition on .cs-bg-fade-in.
   JS reads _cs_transition post meta and sets the attr.
   ===================================================== */

/* DEFAULT: Smooth Fade — opacity transition */
.cs-bg-fade-in {
  opacity: 0;
  transition: opacity 1.2s ease-in-out;
}
.cs-bg-fade-in.cs-bg-ready {
  opacity: 1;
}

/* 1. FLASH CUT — near-instant snap */
.cs-bg-fade-in[data-transition="flash"] {
  transition: opacity 0.08s ease-out;
}

/* 2. KEN BURNS — still zooms while video loads, then cut */
.cs-bg-poster[data-kenburns="1"] {
  animation: cs-kenburns 8s ease-out forwards;
}
@keyframes cs-kenburns {
  from { transform: scale(1.0) translate(0, 0); }
  to   { transform: scale(1.12) translate(-2%, -1%); }
}
.cs-bg-fade-in[data-transition="kenburns"] {
  transition: opacity 0.4s ease-in;
}

/* 3. DISSOLVE BLUR — still blurs out, video fades in sharp */
.cs-bg-poster[data-blur-out="1"] {
  transition: filter 1s ease-in, opacity 0.8s ease-in 0.4s;
}
.cs-bg-poster[data-blur-out="1"].cs-blurring {
  filter: blur(12px) brightness(0.7);
  opacity: 0;
}
.cs-bg-fade-in[data-transition="blur"] {
  opacity: 0;
  filter: blur(0px);
  transition: opacity 1s ease-out 0.2s;
}
.cs-bg-fade-in[data-transition="blur"].cs-bg-ready {
  opacity: 1;
}

/* 4. WIPE RIGHT — clip-path reveal left→right */
.cs-bg-fade-in[data-transition="wipe-right"] {
  opacity: 1;
  clip-path: inset(0 100% 0 0);
  transition: clip-path 1s cubic-bezier(0.77, 0, 0.18, 1);
}
.cs-bg-fade-in[data-transition="wipe-right"].cs-bg-ready {
  clip-path: inset(0 0% 0 0);
}

/* 5. WIPE UP — clip-path reveal bottom→top */
.cs-bg-fade-in[data-transition="wipe-up"] {
  opacity: 1;
  clip-path: inset(100% 0 0 0);
  transition: clip-path 1s cubic-bezier(0.77, 0, 0.18, 1);
}
.cs-bg-fade-in[data-transition="wipe-up"].cs-bg-ready {
  clip-path: inset(0% 0 0 0);
}

/* 6. SCALE IN — video scales from center outward */
.cs-bg-fade-in[data-transition="scale-in"] {
  opacity: 0;
  transform: scale(0.92);
  transition: opacity 1s ease-out, transform 1.2s cubic-bezier(0.16, 1, 0.3, 1);
}
.cs-bg-fade-in[data-transition="scale-in"].cs-bg-ready {
  opacity: 1;
  transform: scale(1);
}

/* 7. CROSS DISSOLVE — both at 50% then video wins */
.cs-bg-poster[data-crossfade="1"] {
  transition: opacity 1s ease-in-out;
}
.cs-bg-poster[data-crossfade="1"].cs-fading {
  opacity: 0.5;
}
.cs-bg-fade-in[data-transition="crossfade"] {
  opacity: 0;
  transition: opacity 1s ease-in-out;
}
.cs-bg-fade-in[data-transition="crossfade"].cs-bg-ready {
  opacity: 1;
}

/* Duration variable — JS sets this on the element */
.cs-bg-fade-in[data-dur] {
  transition-duration: var(--cs-trans-dur, 1.2s) !important;
}

/* =====================================================
   CINEMATIC MODE — Playlist player
   still → clip1 → clip2 → ... → loop
   
   Two <video> elements swap via crossfade so there's
   never a black frame between clips.
   ===================================================== */

.cs-bg-cinematic {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
}

/* Two video slots — one plays, one preloads */
.cs-cine-slot {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity var(--cs-cine-trans-dur, 0.8s) var(--cs-cine-trans-ease, ease-in-out);
  will-change: opacity;
}

.cs-cine-slot video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Active slot — fully visible */
.cs-cine-slot.cine-active {
  opacity: 1;
}

/* Transition variations for clip-to-clip */
/* Flash — near instant */
.cs-bg-cinematic[data-clip-transition="flash"] .cs-cine-slot {
  transition: opacity 0.06s linear;
}

/* Dissolve Blur — dreamy */
.cs-bg-cinematic[data-clip-transition="blur"] .cs-cine-slot {
  transition: opacity 0.6s ease-in-out, filter 0.6s ease-in-out;
  filter: blur(0px);
}
.cs-bg-cinematic[data-clip-transition="blur"] .cs-cine-slot:not(.cine-active) {
  filter: blur(8px);
}

/* Wipe Right — directional */
.cs-bg-cinematic[data-clip-transition="wipe-right"] .cs-cine-slot {
  clip-path: inset(0 100% 0 0);
  opacity: 1;
  transition: clip-path 0.7s cubic-bezier(0.77, 0, 0.18, 1);
}
.cs-bg-cinematic[data-clip-transition="wipe-right"] .cs-cine-slot.cine-active {
  clip-path: inset(0 0% 0 0);
}

/* Scale In — zoom reveal */
.cs-bg-cinematic[data-clip-transition="scale-in"] .cs-cine-slot {
  opacity: 0;
  transform: scale(1.06);
  transition: opacity 0.8s ease-out, transform 1s cubic-bezier(0.16,1,0.3,1);
}
.cs-bg-cinematic[data-clip-transition="scale-in"] .cs-cine-slot.cine-active {
  opacity: 1;
  transform: scale(1);
}

/* Slow Burn — very gradual, cinematic */
.cs-bg-cinematic[data-clip-transition="slow-burn"] .cs-cine-slot {
  transition: opacity 2s ease-in-out;
}

/* =====================================================
   SERVICES SECTION — Background Slider + Photo Cards
   ===================================================== */

.cs-services-section {
  position: relative;
  overflow: hidden;
  padding: 0;
}

/* ── Background slider ───────────────────────────────────── */
.cs-svc-bg-slider {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.cs-svc-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  animation: cs-svc-cycle 18s ease-in-out infinite;
}

/* Stagger each slide by 6s (18s total / 3 slides) */
.cs-svc-slide-1 {
  animation-delay: 0s;
  /* Carpet: spotless plush cream carpet close-up */
  background-color: #0a0a0a; /* fallback until image set */
  background-image: var(--cs-svc-bg-1, none);
}
.cs-svc-slide-2 {
  animation-delay: 6s;
  background-color: #0a0a0a;
  background-image: var(--cs-svc-bg-2, none);
}
.cs-svc-slide-3 {
  animation-delay: 12s;
  background-color: #0a0a0a;
  background-image: var(--cs-svc-bg-3, none);
}

@keyframes cs-svc-cycle {
  0%         { opacity: 0; }
  8%         { opacity: 1; }
  /* Hold visible for 10s */
  55%        { opacity: 1; }
  65%        { opacity: 0; }
  100%       { opacity: 0; }
}

/* Dark overlay on top of slider, behind content */
.cs-svc-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to bottom,
    rgba(6,6,6,0.88) 0%,
    rgba(6,6,6,0.80) 50%,
    rgba(6,6,6,0.92) 100%
  );
}

/* ── Service cards ───────────────────────────────────────── */
.cs-service-cards {
  gap: 28px;
}

.cs-svc-card {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  overflow: hidden;
  transition: transform 0.35s cubic-bezier(0.16,1,0.3,1),
              border-color 0.3s ease,
              box-shadow 0.3s ease;
  display: flex;
  flex-direction: column;
}

.cs-svc-card:hover {
  transform: translateY(-8px);
  border-color: var(--cs-accent);
  box-shadow: 0 24px 60px rgba(14,165,233,0.15);
}

/* Photo top half */
.cs-svc-card-image {
  position: relative;
  height: 220px;
  background-size: cover;
  background-position: center;
  background-color: rgba(255,255,255,0.05);
  overflow: hidden;
  /* Ken Burns subtle on hover */
  transition: transform 6s ease;
}
.cs-svc-card:hover .cs-svc-card-image {
  transform: scale(1.04);
}

/* Placeholder gradient when no image set */
.cs-svc-card-image:not([style*="url"]),
.cs-svc-card-image[style*="url('')"] {
  background: linear-gradient(135deg, rgba(14,165,233,0.15) 0%, rgba(6,6,6,0.5) 100%);
}

/* Number badge top-right */
.cs-svc-card-badge {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--cs-accent);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Gradient at bottom of image fading into card body */
.cs-svc-card-image::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background: linear-gradient(to bottom, transparent, rgba(10,10,10,0.9));
}

/* Card body */
.cs-svc-card-body {
  padding: 24px 28px 28px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.cs-svc-card-icon {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: rgba(14,165,233,0.1);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  flex-shrink: 0;
}

.cs-svc-card-body h3 {
  font-size: 1.2rem;
  font-weight: 600;
  color: #fff;
  margin: 0 0 10px;
  font-family: var(--cs-font-serif, 'Cormorant Garamond', serif);
}

.cs-svc-card-body p {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.65);
  line-height: 1.65;
  margin: 0;
  flex: 1;
}

.cs-svc-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 20px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--cs-accent);
  text-decoration: none;
  transition: gap 0.2s ease, opacity 0.2s;
}
.cs-svc-link:hover {
  gap: 10px;
  opacity: 0.8;
}

/* =====================================================
   SERVICE CARD IMAGE FIX — force height and cover
   Must override any inherited height:0 from flex
   ===================================================== */
.cs-services-section .cs-svc-card {
  display: flex !important;
  flex-direction: column !important;
}

.cs-services-section .cs-svc-card-image {
  height: 220px !important;
  min-height: 220px !important;
  flex-shrink: 0 !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  overflow: hidden !important;
  display: block !important;
  width: 100% !important;
}

/* Ensure the grid uses proper columns */
.cs-services-section .cs-service-cards {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 28px !important;
  align-items: stretch !important;
}

@media (max-width: 900px) {
  .cs-services-section .cs-service-cards {
    grid-template-columns: 1fr !important;
  }
}

/* =====================================================
   WHY OFFMAN + CONSULTATION FORM SECTION
   ===================================================== */

.cs-why-section {
  background: #060606;
  padding: clamp(80px,10vw,120px) clamp(20px,5vw,80px);
}

.cs-why-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  max-width: 1200px;
  margin: 0 auto;
  align-items: start;
}

@media (max-width: 900px) {
  .cs-why-grid { grid-template-columns: 1fr; gap: 48px; }
}

/* ── Consultation Form ────────────────────────────────── */
.cs-consult-form-wrap {
  position: relative;
}

.cs-consult-form-inner {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 20px;
  padding: 40px;
}

.cs-consult-title {
  font-family: var(--cs-font-serif, 'Cormorant Garamond', serif);
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  font-weight: 400;
  color: #fff;
  line-height: 1.2;
  margin: 0 0 8px;
}

.cs-consult-title strong {
  color: var(--cs-accent);
  font-weight: 700;
}

.cs-consult-sub {
  font-size: 0.875rem;
  color: rgba(255,255,255,0.5);
  margin: 0 0 28px;
}

/* Form layout */
.cs-consult-form { display: flex; flex-direction: column; gap: 16px; }

.cs-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
@media (max-width: 500px) { .cs-form-row { grid-template-columns: 1fr; } }

.cs-form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.cs-form-field label {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
}

.cs-form-field .req { color: var(--cs-accent); }

.cs-form-field input,
.cs-form-field select,
.cs-form-field textarea {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 8px;
  padding: 12px 14px;
  font-size: 0.9rem;
  color: #fff;
  font-family: inherit;
  transition: border-color 0.2s, background 0.2s;
  width: 100%;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
}

.cs-form-field select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%230ea5e9' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}

.cs-form-field select option { background: #0a1628; color: #fff; }

.cs-form-field input:focus,
.cs-form-field select:focus,
.cs-form-field textarea:focus {
  outline: none;
  border-color: var(--cs-accent);
  background: rgba(14,165,233,0.06);
}

.cs-form-field input::placeholder,
.cs-form-field textarea::placeholder { color: rgba(255,255,255,0.25); }

.cs-form-field textarea { resize: vertical; min-height: 80px; }

/* Submit button */
.cs-form-submit {
  margin-top: 8px;
  width: 100%;
  justify-content: center;
  font-size: 0.9rem;
  padding: 16px;
  position: relative;
}

/* Success / error states */
.cs-form-success {
  text-align: center;
  padding: 32px 20px;
  animation: cs-fade-in 0.4s ease;
}
.cs-success-icon { font-size: 2.5rem; margin-bottom: 12px; }
.cs-form-success strong { display: block; font-size: 1.1rem; color: #fff; margin-bottom: 8px; }
.cs-form-success p { color: rgba(255,255,255,0.6); font-size: 0.875rem; margin: 0; }
.cs-form-error {
  background: rgba(220,38,38,0.1);
  border: 1px solid rgba(220,38,38,0.3);
  border-radius: 8px;
  padding: 12px 16px;
  font-size: 0.875rem;
  color: #fca5a5;
  text-align: center;
  animation: cs-fade-in 0.3s ease;
}
@keyframes cs-fade-in { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:translateY(0); } }

/* Field validation shake */
.cs-field-error input,
.cs-field-error select { border-color: #ef4444 !important; animation: cs-shake 0.3s ease; }
@keyframes cs-shake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-4px)} 75%{transform:translateX(4px)} }

/* ── Trust right column ───────────────────────────────── */
.cs-trust-body { padding-top: 16px; }

.cs-trust-list {
  list-style: none;
  margin: 28px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.cs-trust-item {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.cs-trust-icon {
  font-size: 1.1rem;
  flex-shrink: 0;
  margin-top: 2px;
}

.cs-trust-item strong {
  display: block;
  font-size: 0.9rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 2px;
}

.cs-trust-item span {
  font-size: 0.8rem;
  color: rgba(255,255,255,0.5);
}

/* Social proof quote */
.cs-trust-social-proof {
  margin-top: 36px;
  padding: 24px;
  background: rgba(14,165,233,0.06);
  border: 1px solid rgba(14,165,233,0.15);
  border-radius: 12px;
  border-left: 3px solid var(--cs-accent);
}

.cs-stars {
  color: #f59e0b;
  font-size: 1.1rem;
  margin-bottom: 10px;
  letter-spacing: 2px;
}

.cs-trust-social-proof p {
  font-size: 0.9rem;
  color: rgba(255,255,255,0.75);
  font-style: italic;
  line-height: 1.6;
  margin: 0 0 8px;
}

.cs-trust-social-proof cite {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.4);
  font-style: normal;
}

/* =====================================================
   THEME SWITCHER — FULL CONTRAST FIX v1.5.1
   All hardcoded rgba(255,255,255) replaced with vars.
   Covers footer, service section, why section, CTA.
   ===================================================== */

/* ── Footer — use CSS variables throughout ─────────────── */
.cs-footer-full {
  background: var(--cs-footer-bg) !important;
  border-top: 1px solid var(--cs-border);
}

.cs-footer-inner {
  border-color: var(--cs-border);
}

.cs-footer-tagline {
  color: var(--cs-text-muted) !important;
}

.cs-footer-contact-info a {
  color: var(--cs-text-muted) !important;
}

.cs-footer-contact-info a:hover {
  color: var(--cs-accent) !important;
}

.cs-footer-links a {
  color: var(--cs-text-muted) !important;
}

.cs-footer-links a:hover {
  color: var(--cs-text) !important;
}

.cs-badge {
  color: var(--cs-text-faint) !important;
}

.cs-footer-bottom {
  border-top: 1px solid var(--cs-border) !important;
  background: var(--cs-footer-bg) !important;
}

.cs-footer-bottom p,
.cs-footer-bottom-links a {
  color: var(--cs-text-faint) !important;
}

.cs-footer-bottom-links a:hover {
  color: var(--cs-text-muted) !important;
}

/* ── Light/Sepia theme footer override ─────────────────── */
/* Heading stays accent colour in all themes — already works */
/* Logo text in footer */
.cs-footer-logo {
  color: var(--cs-text) !important;
}

/* ── Service cards — light theme ───────────────────────── */
[data-theme="light"] .cs-svc-card,
[data-theme="sepia"] .cs-svc-card {
  background: var(--cs-card-bg) !important;
  border-color: var(--cs-border) !important;
}

[data-theme="light"] .cs-svc-card-body h3,
[data-theme="sepia"] .cs-svc-card-body h3 {
  color: var(--cs-text) !important;
}

[data-theme="light"] .cs-svc-card-body p,
[data-theme="sepia"] .cs-svc-card-body p {
  color: var(--cs-text-muted) !important;
}

/* ── Why / consultation section — light theme ──────────── */
[data-theme="light"] .cs-why-section,
[data-theme="sepia"] .cs-why-section {
  background: var(--cs-primary-mid) !important;
}

[data-theme="light"] .cs-consult-form-inner,
[data-theme="sepia"] .cs-consult-form-inner {
  background: var(--cs-surface) !important;
  border-color: var(--cs-border) !important;
}

[data-theme="light"] .cs-consult-title,
[data-theme="sepia"] .cs-consult-title {
  color: var(--cs-text) !important;
}

[data-theme="light"] .cs-form-field input,
[data-theme="light"] .cs-form-field select,
[data-theme="light"] .cs-form-field textarea,
[data-theme="sepia"] .cs-form-field input,
[data-theme="sepia"] .cs-form-field select,
[data-theme="sepia"] .cs-form-field textarea {
  background: var(--cs-surface) !important;
  border-color: var(--cs-border) !important;
  color: var(--cs-text) !important;
}

[data-theme="light"] .cs-form-field input::placeholder,
[data-theme="light"] .cs-form-field textarea::placeholder,
[data-theme="sepia"] .cs-form-field input::placeholder,
[data-theme="sepia"] .cs-form-field textarea::placeholder {
  color: var(--cs-text-faint) !important;
}

[data-theme="light"] .cs-trust-body .cs-heading,
[data-theme="sepia"] .cs-trust-body .cs-heading {
  color: var(--cs-text) !important;
}

[data-theme="light"] .cs-trust-item strong,
[data-theme="sepia"] .cs-trust-item strong {
  color: var(--cs-text) !important;
}

[data-theme="light"] .cs-trust-item span,
[data-theme="sepia"] .cs-trust-item span {
  color: var(--cs-text-muted) !important;
}

[data-theme="light"] .cs-trust-social-proof,
[data-theme="sepia"] .cs-trust-social-proof {
  background: var(--cs-surface) !important;
  border-color: var(--cs-border) !important;
}

[data-theme="light"] .cs-trust-social-proof p,
[data-theme="sepia"] .cs-trust-social-proof p {
  color: var(--cs-text-muted) !important;
}

[data-theme="light"] .cs-trust-social-proof cite,
[data-theme="sepia"] .cs-trust-social-proof cite {
  color: var(--cs-text-faint) !important;
}

/* ── Stats bar — light/sepia ───────────────────────────── */
[data-theme="light"] .cs-stats-bar,
[data-theme="sepia"] .cs-stats-bar {
  background: var(--cs-primary-mid) !important;
}

[data-theme="light"] .cs-stat-label,
[data-theme="sepia"] .cs-stat-label {
  color: var(--cs-text-muted) !important;
}

/* ── CTA section — light/sepia ─────────────────────────── */
[data-theme="light"] section[style*="050d1a"],
[data-theme="sepia"] section[style*="050d1a"] {
  background: var(--cs-primary-mid) !important;
}

/* ── General text contrast — all non-dark themes ───────── */
[data-theme="light"] .cs-subheading,
[data-theme="light"] .cs-heading,
[data-theme="sepia"] .cs-subheading,
[data-theme="sepia"] .cs-heading {
  color: var(--cs-text) !important;
}

[data-theme="light"] p,
[data-theme="sepia"] p {
  color: var(--cs-text-muted);
}

/* ── Service section background overlay ────────────────── */
[data-theme="light"] .cs-svc-overlay,
[data-theme="sepia"] .cs-svc-overlay {
  background: linear-gradient(
    to bottom,
    rgba(245,244,240,0.92) 0%,
    rgba(245,244,240,0.85) 50%,
    rgba(245,244,240,0.94) 100%
  ) !important;
}

/* ── Nav text — light/sepia scrolled state ─────────────── */
[data-theme="light"] #cs-nav.scrolled .cs-nav-menu > li > a,
[data-theme="sepia"] #cs-nav.scrolled .cs-nav-menu > li > a {
  color: var(--cs-text) !important;
}

[data-theme="light"] #cs-nav.scrolled .cs-nav-logo-text,
[data-theme="sepia"] #cs-nav.scrolled .cs-nav-logo-text {
  color: var(--cs-text) !important;
}

/* ── DLS: Custom logo icon + text layout in nav ────────── */
.custom-logo-link {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
}
.custom-logo-link img.custom-logo {
  height: 42px;
  width: auto;
  display: block;
  object-fit: contain;
  flex-shrink: 0;
}
.cs-nav-brand-text {
  font-family: var(--cs-font-display);
  font-size: 1.1rem;
  font-weight: 700;
  color: #fff;
  line-height: 1.15;
  white-space: nowrap;
}
.cs-nav-brand-text span { color: var(--cs-accent); }
#cs-nav.scrolled .cs-nav-brand-text { color: #fff; }
.cs-hero { min-height: 100vh; position: relative; }
.cs-hero.cs-hero--no-bg {
  background: linear-gradient(135deg, #030d2a 0%, #041f5c 60%, #052a7b 100%);
}

/* ── DLS: Logo overflow containment ─────────────────────── */
.custom-logo-link img.custom-logo {
  height: 42px !important;
  width: auto !important;
  max-height: 42px !important;
  min-height: unset !important;
}

/* ── DLS: Hero text always white on image/video backgrounds ─ */
.cs-hero:not(.cs-hero--no-bg) .cs-hero-title { color: #fff !important; }
.cs-hero:not(.cs-hero--no-bg) .cs-hero-title .accent { color: var(--cs-accent) !important; }
.cs-hero:not(.cs-hero--no-bg) .cs-hero-eyebrow { color: var(--cs-accent) !important; }
.cs-hero:not(.cs-hero--no-bg) .cs-hero-subtitle { color: rgba(255,255,255,0.88) !important; }
/* Nav brand text stays white on all themes */
#cs-nav .cs-nav-brand-text { color: #fff !important; }
#cs-nav .cs-nav-brand-text span { color: var(--cs-accent) !important; }

/* ══════════════════════════════════════════════════════════════
   DLS: FULL-WIDTH SERVICE BANNERS
══════════════════════════════════════════════════════════════ */
.cs-svc-banner {
  position: relative;
  width: 100%;
  min-height: 62vh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.cs-svc-banner-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform 8s ease;
}
.cs-svc-banner:hover .cs-svc-banner-bg { transform: scale(1.04); }
.cs-svc-banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    105deg,
    rgba(0,0,0,0.80) 0%,
    rgba(0,0,0,0.55) 55%,
    rgba(0,0,0,0.25) 100%
  );
  z-index: 1;
}
.cs-svc-banner-content {
  position: relative;
  z-index: 2;
  max-width: 1440px;
  margin: 0 auto;
  width: 100%;
  padding: clamp(60px,8vw,120px) clamp(24px,6vw,100px);
}
.cs-svc-banner-content .cs-label {
  color: var(--cs-accent);
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.cs-svc-banner-content h2 {
  font-family: var(--cs-font-display);
  font-size: clamp(2rem, 4.5vw, 4rem);
  font-weight: 300;
  color: #fff;
  line-height: 1.05;
  max-width: 600px;
  margin: 0 0 16px;
}
.cs-svc-banner-content h2 em { font-style: italic; color: var(--cs-accent); }
.cs-svc-banner-content p {
  font-size: clamp(0.95rem, 1.4vw, 1.15rem);
  color: rgba(255,255,255,0.82);
  max-width: 540px;
  margin: 0 0 32px;
  line-height: 1.65;
}
.cs-svc-banner-content .cs-svc-banner-actions {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}
.cs-svc-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 14px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 20px;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: 20px;
}
.cs-svc-badge.verified { background: rgba(5,42,123,0.5); border-color: var(--cs-accent); color: #fff; }
.cs-svc-badge.epa { background: rgba(16,80,40,0.6); border-color: #34d399; color: #34d399; }
@media(max-width:768px) {
  .cs-svc-banner { min-height: 55vh; }
  .cs-svc-banner-content h2 { font-size: clamp(1.6rem,6vw,2.4rem); }
}

/* ══════════════════════════════════════════════════════════════
   DLS: HOW IT WORKS SECTION
══════════════════════════════════════════════════════════════ */
.cs-how-section {
  background: #f7f8fa;
  padding: clamp(80px,10vw,130px) 0;
}
.cs-how-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 clamp(24px,5vw,80px);
}
.cs-how-section .cs-section-header { margin-bottom: clamp(48px,6vw,80px); }
.cs-how-grid {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 32px;
}
.cs-how-step {
  position: relative;
  padding: 32px 24px 28px;
  background: #fff;
  border-radius: 12px;
  border: 1.5px solid #e8ecf5;
  text-align: left;
  transition: border-color .25s, box-shadow .25s, transform .25s;
}
.cs-how-step::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, #052a7b, var(--cs-accent, #f5782b));
  border-radius: 12px 12px 0 0;
  opacity: 0;
  transition: opacity .25s;
}
.cs-how-step:hover { border-color: #052a7b; box-shadow: 0 8px 32px rgba(5,42,123,.1); transform: translateY(-4px); }
.cs-how-step:hover::before { opacity: 1; }
.cs-how-num {
  font-family: var(--cs-font-display);
  font-size: 3rem;
  font-weight: 300;
  color: rgba(5,42,123,.1);
  line-height: 1;
  margin-bottom: 12px;
}
.cs-how-icon {
  font-size: 2rem;
  margin-bottom: 16px;
}
.cs-how-step h3 {
  font-size: 1.1rem;
  font-weight: 700;
  color: #052a7b;
  margin: 0 0 10px;
}
.cs-how-step p {
  font-size: .9rem;
  color: #555;
  line-height: 1.65;
  margin: 0;
}
.cs-services-header-section .cs-section-header { text-align: center; }
@media(max-width:900px) {
  .cs-how-grid { grid-template-columns: repeat(2,1fr); }
}
@media(max-width:560px) {
  .cs-how-grid { grid-template-columns: 1fr; gap: 20px; }
}

/* ══════════════════════════════════════════════════════════════
   DLS: SERVICE PAGE LAYOUT
══════════════════════════════════════════════════════════════ */
.ebt-service-page { font-family: inherit; }
/* Fix: body brand-blue bleeds on service pages without cs-bg-layer */
.dls-service-page-wrap { background: #fff; }
.ebt-sp-hero {
  background: linear-gradient(135deg, #030d2a 0%, #052a7b 60%, #041f5c 100%);
  padding: clamp(80px,10vw,130px) clamp(24px,6vw,100px) clamp(60px,7vw,100px);
}
.ebt-sp-hero-inner { max-width: 900px; }
.ebt-sp-eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--cs-accent, #f5782b); margin-bottom: 16px; display: block;
}
.ebt-sp-title {
  font-family: var(--cs-font-display, 'Cormorant Garamond', serif);
  font-size: clamp(2.4rem, 5vw, 4.2rem);
  font-weight: 300; line-height: 1.05; color: #fff; margin: 0 0 20px;
}
.ebt-sp-sub {
  font-size: clamp(1rem, 1.5vw, 1.2rem); color: rgba(255,255,255,.82);
  max-width: 700px; line-height: 1.65; margin: 0 0 36px;
}
.ebt-sp-body {
  max-width: 1200px; margin: 0 auto;
  padding: clamp(60px,7vw,100px) clamp(24px,5vw,80px);
  display: grid; grid-template-columns: 1fr; gap: clamp(48px,6vw,80px);
}
.ebt-sp-description p {
  font-size: 1.1rem; line-height: 1.75; color: #333; max-width: 800px;
}
.ebt-sp-features h2 {
  font-family: var(--cs-font-display, serif); font-size: clamp(1.6rem,3vw,2.4rem);
  font-weight: 300; color: #052a7b; margin: 0 0 28px;
}
.ebt-sp-feature-list { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fit,minmax(300px,1fr)); gap: 18px; }
.ebt-sp-feature-list li {
  padding: 20px 24px; background: #f7f8fa; border-radius: 8px;
  border-left: 3px solid #052a7b; font-size: .95rem; line-height: 1.6; color: #444;
}
.ebt-sp-feature-list li strong { color: #052a7b; display: block; margin-bottom: 4px; font-size: 1rem; }
/* ── Carrier Verify section ── */
.ebt-sp-verify-section {
  background: #f0f4ff; border-radius: 16px;
  padding: clamp(28px,4vw,48px);
}
/* ── Request a Quote section — full-width card ── */
.ebt-sp-quote-section {
  background: #f0f4ff; border-radius: 16px;
  padding: clamp(28px,4vw,48px);
}
.ebt-sp-verify-section h2,
.ebt-sp-quote-section h2 {
  font-family: var(--cs-font-display, serif); font-size: 1.5rem;
  font-weight: 300; color: #052a7b; margin: 0 0 8px;
}
.ebt-sp-verify-section > p,
.ebt-sp-quote-section > p { font-size: .9rem; color: #555; margin: 0 0 20px; line-height: 1.6; }
@media(max-width:768px) {
  .ebt-sp-hero { padding: 80px 24px 60px; }
  .ebt-sp-body { padding-left: 0; padding-right: 0; }
  .ebt-sp-description p,
  .ebt-sp-features { padding: 0 20px; }
  .ebt-sp-verify-section,
  .ebt-sp-quote-section {
    border-radius: 0;
    padding: 32px 20px;
  }
}

/* ══════════════════════════════════════════════════════════════
   DLS: HAZMAT SERVICE PAGE — CLASSES & EXCLUSIONS
══════════════════════════════════════════════════════════════ */
.ebt-sp-approved-classes h2,
.ebt-hm-process h2 {
  font-family: var(--cs-font-display, serif);
  font-size: clamp(1.6rem,3vw,2.4rem);
  font-weight: 300; color: #052a7b; margin: 0 0 12px;
}
.ebt-hm-classes-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 24px;
}
.ebt-hm-class-card {
  background: #fff;
  border: 1.5px solid #e0e7ff;
  border-radius: 12px;
  padding: 28px 24px;
  position: relative;
  overflow: hidden;
}
.ebt-hm-class-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg,#052a7b,var(--cs-accent,#f5782b));
}
.ebt-hm-class-num {
  font-family: var(--cs-font-display,serif);
  font-size: 2.2rem;
  font-weight: 300;
  color: #052a7b;
  line-height: 1;
  margin-bottom: 4px;
}
.ebt-hm-class-name {
  font-size: 1rem;
  font-weight: 700;
  color: #1a1a2e;
  margin-bottom: 10px;
}
.ebt-hm-class-card > p {
  font-size: .88rem;
  color: #555;
  line-height: 1.6;
  margin: 0 0 16px;
}
.ebt-hm-examples strong {
  font-size: .8rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #888;
  display: block;
  margin-bottom: 8px;
}
.ebt-hm-examples ul {
  margin: 0; padding: 0 0 0 16px;
  font-size: .88rem; color: #444; line-height: 1.8;
}

/* Exclusions block */
.ebt-hm-exclusions {
  background: #fff8f8;
  border: 1.5px solid #fecaca;
  border-radius: 12px;
  padding: 32px 36px;
}
.ebt-hm-excl-inner h3 {
  font-family: var(--cs-font-display,serif);
  font-size: 1.5rem;
  font-weight: 300;
  color: #991b1b;
  margin: 0 0 10px;
}
.ebt-hm-excl-inner > p {
  font-size: .95rem; color: #555; margin: 0 0 20px;
}
.ebt-hm-excl-list {
  display: flex; flex-direction: column; gap: 12px; margin-bottom: 20px;
}
.ebt-hm-excl-item {
  padding: 12px 16px;
  background: #fff;
  border-left: 3px solid #dc2626;
  border-radius: 0 6px 6px 0;
  font-size: .9rem;
}
.ebt-hm-excl-item strong {
  display: block; color: #991b1b; margin-bottom: 2px;
}
.ebt-hm-excl-item span { color: #666; font-size: .85rem; }
.ebt-hm-excl-note {
  font-size: .88rem; color: #777; font-style: italic; margin: 0;
  border-top: 1px solid #fecaca; padding-top: 16px;
}
.ebt-hm-process { margin: 0; }

@media(max-width:900px) {
  .ebt-hm-classes-grid { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════════
   DLS NAV FIX: logo wrap, brand text color, phone link
══════════════════════════════════════════════════════════════ */

/* ── Logo group: icon + text tight together ─────────────── */
.cs-nav-logo-wrap {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.cs-nav-logo-wrap .custom-logo-link {
  display: flex;
  align-items: center;
  text-decoration: none;
  line-height: 0;
}
.cs-nav-brand-text-link {
  text-decoration: none;
  line-height: 1;
}

/* ── Brand text: white on dark/transparent nav, dark on scrolled light/sepia ── */
.cs-nav-brand-text-link .cs-nav-brand-text { color: #fff; }
.cs-nav-brand-text-link .cs-nav-brand-text span { color: var(--cs-accent); }

[data-theme=light] #cs-nav.scrolled .cs-nav-brand-text,
[data-theme=sepia] #cs-nav.scrolled .cs-nav-brand-text {
  color: var(--cs-text) !important;
}
[data-theme=light] #cs-nav.scrolled .cs-nav-brand-text span,
[data-theme=sepia] #cs-nav.scrolled .cs-nav-brand-text span {
  color: var(--cs-accent) !important;
}

/* ── Phone link ─────────────────────────────────────────── */
.cs-nav-phone {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #fff;
  font-size: .82rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  padding: 7px 13px;
  border: 1.5px solid rgba(255,255,255,.28);
  border-radius: 6px;
  letter-spacing: .02em;
  transition: background .2s, border-color .2s, color .2s;
  flex-shrink: 0;
}
.cs-nav-phone:hover {
  background: rgba(255,255,255,.12);
  border-color: rgba(255,255,255,.55);
}
.cs-nav-phone svg { flex-shrink: 0; opacity: .9; }

/* Phone adapts on scrolled light/sepia */
[data-theme=light] #cs-nav.scrolled .cs-nav-phone,
[data-theme=sepia] #cs-nav.scrolled .cs-nav-phone {
  color: var(--cs-text) !important;
  border-color: rgba(0,0,0,.18) !important;
}
[data-theme=light] #cs-nav.scrolled .cs-nav-phone:hover,
[data-theme=sepia] #cs-nav.scrolled .cs-nav-phone:hover {
  background: rgba(0,0,0,.06) !important;
}

/* Hide label on medium screens, keep icon only */
@media(max-width:1180px) {
  .cs-nav-phone-label { display: none; }
  .cs-nav-phone { padding: 8px 10px; border-radius: 50%; aspect-ratio: 1; justify-content: center; }
}
@media(max-width:768px) {
  .cs-nav-phone { display: none; }
}

/* Mobile nav phone */
.cs-mobile-phone-link {
  display: flex;
  align-items: center;
  gap: 10px;
  color: var(--cs-text-muted, rgba(255,255,255,.7));
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  padding: 14px 0;
  border-top: 1px solid rgba(255,255,255,.08);
  margin-top: 8px;
}
.cs-mobile-phone-link:hover { color: #fff; }

/* Kill old brand text selector that was on #cs-nav directly */
#cs-nav .cs-nav-brand-text { color: inherit; }
#cs-nav .cs-nav-brand-text span { color: inherit; }

/* ══════════════════════════════════════════════════════════════
   DLS MOBILE AUDIT FIXES v1.1.8
══════════════════════════════════════════════════════════════ */

/* ── 1. BANNER TEXT: ALL WHITE, text-shadow for depth ────── */
/* Force everything in banner content to white — no accent color
   on images since backgrounds vary wildly */
.cs-svc-banner-content,
.cs-svc-banner-content .cs-label,
.cs-svc-banner-content .cs-label::before,
.cs-svc-banner-content h2,
.cs-svc-banner-content h2 em,
.cs-svc-banner-content p {
  color: #fff !important;
}
/* Subtle text-shadow so white text pops against any image area */
.cs-svc-banner-content h2 {
  text-shadow: 0 1px 6px rgba(0,0,0,0.55), 0 2px 16px rgba(0,0,0,0.35);
}
.cs-svc-banner-content p {
  text-shadow: 0 1px 4px rgba(0,0,0,0.45);
}
.cs-svc-banner-content .cs-label {
  text-shadow: 0 1px 4px rgba(0,0,0,0.5);
  opacity: 0.92;
}
/* Eyebrow line-accent override */
.cs-svc-banner-content .cs-label::before {
  background: rgba(255,255,255,0.6) !important;
}

/* ── 2. BANNER BUTTONS: explicit white on all images ─────── */
.cs-svc-banner .cs-btn-outline {
  color: #fff !important;
  border-color: rgba(255,255,255,0.65) !important;
}
.cs-svc-banner .cs-btn-outline:hover {
  background: rgba(255,255,255,0.15) !important;
  border-color: rgba(255,255,255,0.9) !important;
}
.cs-svc-banner .cs-btn-primary {
  background: #052a7b !important;
  color: #fff !important;
}

/* ── 3. HERO ACCENT LINE: white on image backgrounds ─────── */
/* For
/* Your Business Needs hero second line - force white on image hero */
.cs-hero:not(.cs-hero--no-bg) .cs-hero-title .accent {
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.4);
}
/* Banner badge colors all-white */
.cs-svc-badge { color: #fff !important; }
.cs-svc-badge.epa { background: rgba(16,80,40,0.75) !important; border-color: rgba(52,211,153,0.8) !important; color: #fff !important; }
.cs-svc-badge.verified { background: rgba(5,42,123,0.6) !important; border-color: rgba(255,255,255,0.4) !important; }
/* Mobile: banner buttons full-width below 520px */
@media(max-width:520px) {
  .cs-svc-banner-actions { flex-direction:column; gap:12px; }
  .cs-svc-banner-actions .cs-btn { width:100%; justify-content:center; text-align:center; padding:14px 20px; font-size:.95rem; }
}
/* Mobile nav CTA */
.cs-mobile-cta-btn {
  display:block; margin-top:20px; padding:14px 24px;
  background:#052a7b; color:#fff !important; text-decoration:none;
  border-radius:8px; font-weight:700; font-size:.95rem; letter-spacing:.04em;
  text-align:center; text-transform:uppercase;
}
.cs-mobile-cta-btn:hover { background:#041f5c; }

/* Service page heroes with image backgrounds - force white text + depth */
.ebt-sp-hero[style*="url("] .ebt-sp-eyebrow {
  color: rgba(255,255,255,0.85) !important;
  text-shadow: 0 1px 4px rgba(0,0,0,0.5);
}
.ebt-sp-hero[style*="url("] .ebt-sp-title {
  text-shadow: 0 2px 12px rgba(0,0,0,0.5), 0 1px 4px rgba(0,0,0,0.4);
}
.ebt-sp-hero[style*="url("] .ebt-sp-sub {
  text-shadow: 0 1px 6px rgba(0,0,0,0.45);
}
.ebt-sp-hero[style*="url("] .ebt-btn-outline {
  color: #fff !important;
  border-color: rgba(255,255,255,0.6) !important;
}

/* ══════════════════════════════════════════════════════════════
   DLS: NAV DROPDOWN — Services sub-menu
══════════════════════════════════════════════════════════════ */
.cs-nav-menu li.menu-item-has-children { position: relative; }

/* Chevron indicator */
.cs-nav-menu li.menu-item-has-children > a::after {
  content: '';
  display: inline-block;
  width: 0; height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  margin-left: 6px;
  vertical-align: middle;
  opacity: 0.7;
  transition: transform .2s;
}
.cs-nav-menu li.menu-item-has-children.is-open > a::after,
.cs-nav-menu li.menu-item-has-children:hover > a::after {
  transform: rotate(180deg);
}

/* Dropdown panel */
.cs-nav-menu .sub-menu {
  display: block;
  position: absolute;
  top: calc(100% + 2px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .2s ease, visibility 0s ease .2s;
  left: -12px;
  background: rgba(6,8,18,0.97);
  backdrop-filter: blur(16px);
  border: 1px solid rgba(255,255,255,0.09);
  border-radius: 10px;
  min-width: 230px;
  padding: 8px 0;
  z-index: 99999;
  box-shadow: 0 12px 40px rgba(0,0,0,0.5);
  list-style: none;
  margin: 0;
}
/* Caret pointer */
.cs-nav-menu .sub-menu::before {
  content: '';
  position: absolute;
  top: -6px; left: 20px;
  width: 10px; height: 10px;
  background: rgba(6,8,18,0.97);
  border-left: 1px solid rgba(255,255,255,0.09);
  border-top: 1px solid rgba(255,255,255,0.09);
  transform: rotate(45deg);
}
.cs-nav-menu li.menu-item-has-children:hover > .sub-menu,
.cs-nav-menu li.menu-item-has-children.is-open > .sub-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .18s ease, visibility 0s ease 0s;
}
@keyframes cs-dropdown-in {
  from { opacity:0; transform:translateY(-6px); }
  to   { opacity:1; transform:translateY(0); }
}
.cs-nav-menu .sub-menu li { display: block; }
.cs-nav-menu .sub-menu a {
  display: block;
  padding: 9px 20px;
  color: rgba(255,255,255,0.82) !important;
  font-size: .84rem;
  font-weight: 500;
  white-space: nowrap;
  text-decoration: none;
  transition: color .15s, background .15s, padding-left .15s;
  letter-spacing: .01em;
}
.cs-nav-menu .sub-menu a:hover {
  color: #fff !important;
  background: rgba(255,255,255,0.06);
  padding-left: 26px;
}
/* Divider before compliance services */
.cs-nav-menu .sub-menu li.menu-item:nth-child(6) > a {
  border-top: 1px solid rgba(255,255,255,0.08);
  margin-top: 4px;
  padding-top: 12px;
}

/* Light/sepia scrolled: dropdown inverts */
[data-theme="light"] #cs-nav.scrolled .cs-nav-menu .sub-menu,
[data-theme="sepia"] #cs-nav.scrolled .cs-nav-menu .sub-menu {
  background: rgba(250,249,246,0.98) !important;
  border-color: rgba(0,0,0,0.09) !important;
}
[data-theme="light"] #cs-nav.scrolled .cs-nav-menu .sub-menu::before,
[data-theme="sepia"] #cs-nav.scrolled .cs-nav-menu .sub-menu::before {
  background: rgba(250,249,246,0.98) !important;
  border-color: rgba(0,0,0,0.09) !important;
}
[data-theme="light"] #cs-nav.scrolled .cs-nav-menu .sub-menu a,
[data-theme="sepia"] #cs-nav.scrolled .cs-nav-menu .sub-menu a {
  color: var(--cs-text) !important;
}
[data-theme="light"] #cs-nav.scrolled .cs-nav-menu .sub-menu a:hover,
[data-theme="sepia"] #cs-nav.scrolled .cs-nav-menu .sub-menu a:hover {
  background: rgba(0,0,0,0.05) !important;
}

/* Mobile sub-menu: indented under Services */
#cs-mobile-nav .sub-menu {
  list-style: none;
  padding: 0 0 8px 16px;
  margin: 0;
  border-left: 2px solid rgba(255,255,255,0.12);
  margin-left: 8px;
}
#cs-mobile-nav .sub-menu a {
  display: block;
  padding: 8px 0;
  font-size: .9rem;
  color: rgba(255,255,255,0.72);
  text-decoration: none;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
#cs-mobile-nav .sub-menu a:hover { color: #fff; }
#cs-mobile-nav .menu-item-has-children > a {
  display: flex; align-items: center; justify-content: space-between;
}
/* Nav must not clip dropdown — logo size is controlled by img height, not overflow */
#cs-nav { overflow: visible; }

/* ═══ DROPDOWN FIXES ═══════════════════════════════════════ */
/* Hover bridge: invisible area below li covers gap so mouse
   can travel from nav link to dropdown without losing hover   */
.cs-nav-menu li.menu-item-has-children::after {
  content: '';
  position: absolute;
  left: -20px;
  right: -20px;
  bottom: -10px;
  height: 12px;
  z-index: 99998;
}

/* Nav z-index: root-level boost so dropdown clears all content */
#cs-nav  { z-index: 99999 !important; }
.cs-nav-menu .sub-menu { z-index: 9999999 !important; }

/* ═══ NON-HERO PAGES: force solid nav ══════════════════════ */
/* .cs-no-hero is added by JS on pages that have no dark hero  */
#cs-nav.cs-no-hero {
  background: rgba(6,8,18,0.97) !important;
  backdrop-filter: blur(18px);
}
/* Light/sepia themes: use the existing scrolled palette */
[data-theme="light"] #cs-nav.cs-no-hero,
[data-theme="sepia"] #cs-nav.cs-no-hero {
  background: var(--cs-nav-solid, rgba(245,244,240,0.97)) !important;
}
/* Ensure text is readable on the solid nav */
[data-theme="light"] #cs-nav.cs-no-hero .cs-nav-menu > li > a,
[data-theme="sepia"] #cs-nav.cs-no-hero .cs-nav-menu > li > a {
  color: var(--cs-text) !important;
}
[data-theme="light"] #cs-nav.cs-no-hero .cs-nav-brand-text,
[data-theme="sepia"] #cs-nav.cs-no-hero .cs-nav-brand-text {
  color: var(--cs-text) !important;
}
[data-theme="light"] #cs-nav.cs-no-hero .cs-nav-brand-text span,
[data-theme="sepia"] #cs-nav.cs-no-hero .cs-nav-brand-text span,
[data-theme="light"] #cs-nav.cs-no-hero .cs-nav-phone,
[data-theme="sepia"] #cs-nav.cs-no-hero .cs-nav-phone {
  color: var(--cs-accent) !important;
}
/* Dark/navy themes: keep white text, use existing look */
[data-theme="dark"] #cs-nav.cs-no-hero .cs-nav-menu a,
[data-theme="navy"] #cs-nav.cs-no-hero .cs-nav-menu a {
  color: rgba(255,255,255,0.85) !important;
}

/* ══════════════════════════════════════════════════════════════
   DLS: SERVICES MASONRY GRID  /services/
══════════════════════════════════════════════════════════════ */
.dls-services-header {
  background: #f7f8fa;
  padding: clamp(80px,9vw,120px) clamp(24px,5vw,80px) clamp(48px,5vw,72px);
}
.dls-services-header-inner { max-width: 800px; }
.dls-sg-h1 {
  font-family: var(--cs-font-display, serif);
  font-size: clamp(2.8rem,5vw,5rem);
  font-weight: 300;
  color: #052a7b;
  margin: 8px 0 16px;
  line-height: 1.05;
}
.dls-sg-h1 strong { font-weight: 700; }
.dls-sg-intro {
  font-size: 1.05rem;
  color: #555;
  line-height: 1.65;
  max-width: 600px;
}

/* Grid container */
.dls-sg-section {
  background: #0a0a0f;
  padding: clamp(32px,4vw,56px);
}
.dls-sg-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 280px 280px 320px 280px;
  gap: 14px;
  max-width: 1440px;
  margin: 0 auto;
}

/* Card base */
.dls-sg-card {
  position: relative;
  display: block;
  border-radius: 12px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-color: #0d1428;
  text-decoration: none;
  cursor: pointer;
  transition: transform .3s cubic-bezier(.2,.8,.2,1), box-shadow .3s;
}
.dls-sg-card:hover {
  transform: scale(1.02);
  box-shadow: 0 20px 60px rgba(0,0,0,0.6);
  z-index: 2;
}
/* Dark overlay — always on, intensifies on hover */
.dls-sg-card-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.2) 0%, rgba(0,0,0,0.72) 60%, rgba(0,0,0,0.88) 100%);
  transition: background .3s;
}
.dls-sg-card:hover .dls-sg-card-overlay {
  background: linear-gradient(180deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.80) 55%, rgba(0,0,0,0.92) 100%);
}

/* Card content */
.dls-sg-card-body {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 24px 24px 28px;
  z-index: 1;
}
.dls-sg-card-title {
  font-family: var(--cs-font-display, serif);
  font-size: clamp(1.3rem, 2vw, 1.9rem);
  font-weight: 300;
  color: #fff;
  margin: 0 0 8px;
  text-shadow: 0 1px 6px rgba(0,0,0,0.5);
  line-height: 1.1;
}
.dls-sg-card-sub {
  font-size: .82rem;
  color: rgba(255,255,255,0.75);
  line-height: 1.55;
  margin: 0 0 16px;
  text-shadow: 0 1px 3px rgba(0,0,0,0.4);
  max-width: 340px;
  /* Hidden at rest, slides in on hover */
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .25s .05s, transform .25s .05s;
}
.dls-sg-card:hover .dls-sg-card-sub {
  opacity: 1;
  transform: translateY(0);
}
.dls-sg-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fff;
  padding: 7px 16px;
  border: 1.5px solid rgba(255,255,255,0.55);
  border-radius: 5px;
  transition: background .2s, border-color .2s;
}
.dls-sg-card:hover .dls-sg-cta {
  background: rgba(255,255,255,0.12);
  border-color: rgba(255,255,255,0.85);
}

/* Compliance badge */
.dls-sg-badge {
  position: absolute;
  top: 16px; left: 16px;
  background: rgba(5,42,123,0.75);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,0.2);
  color: #fff;
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 4px;
  z-index: 2;
}
.dls-sg-badge--epa {
  background: rgba(16,80,40,0.8);
  border-color: rgba(52,211,153,0.5);
}

/* Compliance card accent border */
.dls-sg-card--compliance::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 12px;
  border: 1.5px solid rgba(5,42,123,0.5);
  pointer-events: none;
  z-index: 3;
  transition: border-color .3s;
}
.dls-sg-card--compliance:hover::after { border-color: rgba(5,42,123,0.9); }
.dls-sg-card--epa::after { border-color: rgba(16,100,50,0.5) !important; }
.dls-sg-card--epa:hover::after { border-color: rgba(16,100,50,0.9) !important; }

/* ── Grid placement ─────────────────────────────────────── */
.dls-sg-card--ftl  { grid-column: 1;     grid-row: 1 / span 2; }
.dls-sg-card--ltl  { grid-column: 2;     grid-row: 1; }
.dls-sg-card--exp  { grid-column: 3;     grid-row: 1; }
.dls-sg-card--spc  { grid-column: 2;     grid-row: 2; }
.dls-sg-card--3pl  { grid-column: 3;     grid-row: 2; }
.dls-sg-card--hmt  { grid-column: 1 / span 2; grid-row: 3; }
.dls-sg-card--hwt  { grid-column: 3;     grid-row: 3 / span 2; }
.dls-sg-card--rfr  { grid-column: 1;     grid-row: 4; }
.dls-sg-card--cta  { grid-column: 2;     grid-row: 4;
  background: linear-gradient(135deg, #052a7b, #041f5c) !important;
  display: flex; align-items: center; justify-content: center; text-align: center;
}

/* Tall cards: title slightly larger */
.dls-sg-card--ftl .dls-sg-card-title,
.dls-sg-card--hwt .dls-sg-card-title { font-size: clamp(1.6rem,2.5vw,2.4rem); }
/* Wide card: description visible by default */
.dls-sg-card--hmt .dls-sg-card-sub { opacity: 1; transform: none; }

/* CTA card content */
.dls-sg-cta-inner { padding: 32px 24px; }
.dls-sg-cta-inner h2 {
  font-family: var(--cs-font-display, serif);
  font-size: clamp(1.8rem,2.5vw,2.6rem);
  font-weight: 300;
  color: #fff;
  margin: 0 0 12px;
  line-height: 1.15;
}
.dls-sg-cta-inner h2 strong { font-weight: 700; }
.dls-sg-cta-inner p {
  font-size: .88rem;
  color: rgba(255,255,255,0.72);
  line-height: 1.6;
  margin: 0 0 20px;
}

/* ── Responsive ─────────────────────────────────────────── */
@media(max-width:1024px) {
  .dls-sg-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 260px 260px 260px 260px 260px;
  }
  .dls-sg-card--ftl  { grid-column: 1; grid-row: 1 / span 2; }
  .dls-sg-card--ltl  { grid-column: 2; grid-row: 1; }
  .dls-sg-card--exp  { grid-column: 2; grid-row: 2; }
  .dls-sg-card--spc  { grid-column: 1; grid-row: 3; }
  .dls-sg-card--3pl  { grid-column: 2; grid-row: 3; }
  .dls-sg-card--hmt  { grid-column: 1; grid-row: 4; }
  .dls-sg-card--hwt  { grid-column: 2; grid-row: 4 / span 2; }
  .dls-sg-card--rfr  { grid-column: 1; grid-row: 5; }
  .dls-sg-card--cta  { display: none; }
  .dls-sg-card--hmt  { grid-column: 1; }
}
@media(max-width:640px) {
  .dls-sg-section { padding: 16px; }
  .dls-sg-grid {
    grid-template-columns: 1fr;
    grid-template-rows: unset;
    gap: 12px;
  }
  .dls-sg-card,
  .dls-sg-card--ftl,
  .dls-sg-card--ltl,
  .dls-sg-card--exp,
  .dls-sg-card--spc,
  .dls-sg-card--3pl,
  .dls-sg-card--hmt,
  .dls-sg-card--hwt,
  .dls-sg-card--rfr {
    grid-column: 1 !important;
    grid-row: auto !important;
    height: 260px;
  }
  .dls-sg-card--cta { display: none; }
  .dls-sg-card--hmt .dls-sg-card-sub { opacity: 0; }
  .dls-sg-card:hover .dls-sg-card-sub { opacity: 1; }
}

/* ── Sub-menu links: always white, always override nav-state rules ─── */
/* Sub-menu panel is always dark — text must always be readable white   */
.cs-nav-menu .sub-menu a {
  color: rgba(255,255,255,0.85) !important;
}
.cs-nav-menu .sub-menu a:hover {
  color: #fff !important;
  background: rgba(255,255,255,0.06);
}

/* ── LIGHT/SEPIA THEME: Mobile sub-menu text fix ────────────────────────
   Sub-menu links were white-on-white on light/sepia themes because
   the base rule (rgba(255,255,255,0.72)) had no theme overrides.
   Mirrors the existing top-level override at line ~253. Fix: 2026-06-05 */
[data-theme="light"] #cs-mobile-nav .sub-menu,
[data-theme="sepia"] #cs-mobile-nav .sub-menu {
  border-left-color: rgba(0,0,0,0.12);
}
[data-theme="light"] #cs-mobile-nav .sub-menu a,
[data-theme="sepia"] #cs-mobile-nav .sub-menu a {
  color: var(--cs-text-muted);
  border-bottom-color: rgba(0,0,0,0.06);
}
[data-theme="light"] #cs-mobile-nav .sub-menu a:hover,
[data-theme="sepia"] #cs-mobile-nav .sub-menu a:hover {
  color: var(--cs-text);
}

/* ── MOBILE NAV Z-INDEX FIX ─────────────────────────────────────────────
   #cs-nav was boosted to z-index:99999 !important for dropdown clearance,
   which caused it to sit ON TOP of the mobile nav overlay (z-index:9998).
   Fix: push mobile nav above the sticky header when open. 2026-06-05 */
#cs-mobile-nav { z-index: 100000 !important; }

/* ── LIGHT THEME: Mobile nav → brand navy background + white text ────────
   Default light theme set an off-white (#f5f4f0) bg with dark text,
   making the mobile menu feel disconnected from the brand.
   Match the desktop scrolled-nav navy gradient + restore white text.
   Overrides the sub-menu dark-text fix (correct for cream, not for navy). */
[data-theme="light"] #cs-mobile-nav {
  background: linear-gradient(160deg, #030d2a 0%, #041f5c 55%, #052a7b 100%) !important;
}
[data-theme="light"] #cs-mobile-nav a {
  color: rgba(255,255,255,0.88) !important;
}
[data-theme="light"] #cs-mobile-nav a:hover {
  color: #ffffff !important;
}
[data-theme="light"] #cs-mobile-nav .sub-menu {
  border-left-color: rgba(255,255,255,0.15) !important;
}
[data-theme="light"] #cs-mobile-nav .sub-menu a {
  color: rgba(255,255,255,0.70) !important;
  border-bottom-color: rgba(255,255,255,0.08) !important;
}
[data-theme="light"] #cs-mobile-nav .sub-menu a:hover {
  color: #ffffff !important;
}

/* ── MOBILE NAV: start below sticky header so X button stays visible ─────
   inset:0 was covering the full viewport including the navbar, hiding the
   hamburger/close button. Override top so nav opens below the header bar. */
#cs-mobile-nav {
  top: var(--cs-nav-height) !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   NAV + HERO TEXT — LIGHT THEME OVER HERO BACKGROUND FIX  (2026-06-05)
   ─────────────────────────────────────────────────────────────────────────
   PROBLEM: Global rule line ~241 sets .cs-nav-menu a { color: var(--cs-text-muted) }
   In light theme --cs-text-muted = rgba(0,0,0,0.55) — dark text over dark hero = invisible.
   Similarly .cs-hero-title gets --cs-text (dark) via line ~239.
   FIX: When nav is NOT scrolled (transparent / over hero), force white + deep shadow
   regardless of theme. Only the .scrolled (solid bg) state uses theme-aware dark text.
═══════════════════════════════════════════════════════════════════════════ */

/* ── Transparent nav → always white text + legible shadow ─── */
#cs-nav:not(.scrolled) .cs-nav-menu > li > a,
#cs-nav:not(.scrolled) .cs-nav-logo-text,
#cs-nav:not(.scrolled) .cs-nav-phone {
  color: rgba(255,255,255,0.93) !important;
  text-shadow:
    0 1px 3px rgba(0,0,0,1),
    0 2px 18px rgba(0,0,0,0.8);
}
#cs-nav:not(.scrolled) .cs-nav-menu > li > a:hover {
  color: #ffffff !important;
}

/* ── Scrolled nav (solid bg) — light/sepia keep the dark text already set ─ */
/* (no change needed — existing rules at lines ~495-503 handle this correctly) */

/* ── Hero banner text — white + shadow over ALL background types ─────────── */
/* Standard cs-hero hero titles */
.cs-hero-title,
.cs-hero-subtitle,
.cs-hero .cs-heading,
.cs-hero .cs-subheading {
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(0,0,0,0.65) !important;
}
.cs-hero-subtitle,
.cs-hero .cs-subheading {
  color: rgba(255,255,255,0.88) !important;
}

/* ebt-sp service page hero titles — strengthen existing shadow */
.ebt-sp-hero .ebt-sp-title {
  color: #fff !important;
  text-shadow:
    0 2px 6px rgba(0,0,0,0.95),
    0 4px 24px rgba(0,0,0,0.75) !important;
}
.ebt-sp-hero .ebt-sp-sub {
  color: rgba(255,255,255,0.90) !important;
  text-shadow: 0 1px 8px rgba(0,0,0,0.85) !important;
}
.ebt-sp-hero .ebt-sp-eyebrow {
  text-shadow: 0 1px 6px rgba(0,0,0,0.8) !important;
}

/* ─── Hero eyebrow: sky-blue glow (readable on dark hero backgrounds) ─── */
/* Overrides the var(--cs-accent)=#052a7b that is invisible on dark images */
.cs-hero:not(.cs-hero--no-bg) .cs-hero-eyebrow {
  color: #60a5fa !important;
  text-shadow: 0 0 18px rgba(96,165,250,0.55), 0 1px 4px rgba(0,0,0,0.65);
}
.cs-hero:not(.cs-hero--no-bg) .cs-hero-eyebrow::before {
  background: #60a5fa !important;
  box-shadow: 0 0 8px rgba(96,165,250,0.6);
}


/* ══════════════════════════════════════════════════════════════
   DLS: CONTENT PAGE TEMPLATE (template-content-page.php)
   Flat header layout — no background image or video.
   Hero elements: .dls-cp-hero / .dls-cp-*
   Body wrapper:  .dls-cp-body / .dls-cp-container / .dls-cp-content
══════════════════════════════════════════════════════════════ */

/* ── Hero ── */
.dls-cp-hero {
  background: linear-gradient(135deg, #052a7b 0%, #0a3d9e 50%, #031f5c 100%);
  padding: 80px clamp(24px,5vw,80px) clamp(52px,6vw,80px);
  text-align: center;
  position: relative;
  overflow: hidden;
}

.dls-cp-grid-overlay {
  position: absolute; inset: 0;
  background: url('/wp-content/themes/cinescroll/img/grid-dot.svg') center/40px repeat;
  opacity: .06;
  pointer-events: none;
}

.dls-cp-hero-inner {
  position: relative;
  max-width: 700px;
  margin: 0 auto;
}

.dls-cp-badge {
  display: inline-block;
  background: rgba(255,255,255,.12); color: #93c5fd;
  font-size: .7rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  padding: 6px 16px; border-radius: 20px; margin-bottom: 20px;
}

.dls-cp-title {
  font-size: clamp(1.8rem,4vw,2.8rem);
  font-weight: 800; color: #fff; line-height: 1.15; margin: 0 0 14px;
}

.dls-cp-sub {
  color: rgba(255,255,255,.75); font-size: .95rem;
  max-width: 520px; margin: 0 auto; line-height: 1.6;
}

/* ── Body ── */
.dls-cp-body {
  background: #f8f9fb;
  padding: clamp(40px,6vw,80px) clamp(20px,5vw,80px);
}

.dls-cp-container {
  max-width: 1000px;
  margin: 0 auto;
}

/* Content card — white surface matching contact page card aesthetic */
.dls-cp-content {
  background: #fff;
  border-radius: 18px;
  padding: clamp(28px,4vw,52px);
  box-shadow: 0 2px 16px rgba(0,0,0,.06);
  border: 1px solid #e8eaf0;
}

/* ── Mobile adjustments ── */
@media(max-width:640px) {
  .dls-cp-content {
    border-radius: 12px;
    padding: 24px 18px;
  }
}