/* =========================================================
   SILENT KILLER PCB — FINAL VISUAL AUTHORITY v3.3.16
   Loaded LAST with a unique filename so old browser cache cannot win.
   Scope: public visual presentation only. No pricing / quotation logic.
   ========================================================= */

:root{
  --sk3316-ink:#17212b;
  --sk3316-copy:#3f4a55;
  --sk3316-muted:#69737d;
  --sk3316-green:#168a4a;
  --sk3316-green-dark:#0d6f3a;
  --sk3316-green-soft:#eaf7ef;
  --sk3316-line:#dfe5e2;
}

/* ---------- WHITE SURFACE READABILITY ---------- */
html,body{background:#fff !important; color:var(--sk3316-copy) !important;}

/* Public content is a white / green / gray system. Force old white-copy rules
   back to readable dark ink on light surfaces. */
body:not(.admin-page):not(.page-admin) main,
body:not(.admin-page):not(.page-admin) main > section,
body:not(.admin-page):not(.page-admin) main article,
body:not(.admin-page):not(.page-admin) main .hero,
body:not(.admin-page):not(.page-admin) main .hero-slide,
body:not(.admin-page):not(.page-admin) main .card,
body:not(.admin-page):not(.page-admin) main [class*="-card"]:not(.pcb-card),
body:not(.admin-page):not(.page-admin) main [class*="_card"]:not(.pcb-card),
body:not(.admin-page):not(.page-admin) main .panel,
body:not(.admin-page):not(.page-admin) main [class*="-panel"],
body:not(.admin-page):not(.page-admin) main .box,
body:not(.admin-page):not(.page-admin) main [class*="-box"]{
  color:var(--sk3316-copy) !important;
}

body:not(.admin-page):not(.page-admin) main :is(h1,h2,h3,h4,h5,h6),
body:not(.admin-page):not(.page-admin) footer :is(h1,h2,h3,h4,h5,h6){
  color:var(--sk3316-ink) !important;
  -webkit-text-fill-color:currentColor !important;
  text-shadow:none !important;
}

body:not(.admin-page):not(.page-admin) main :is(p,li,dd,dt,label,small,blockquote,.description,.section-description,.lead,.subtext,.helper-text),
body:not(.admin-page):not(.page-admin) footer :is(p,li,dd,dt,label,small,span){
  color:var(--sk3316-copy) !important;
  -webkit-text-fill-color:currentColor !important;
  text-shadow:none !important;
}

/* A lot of the old premium CSS paints nested spans white. On the new white
   theme those spans must inherit readable copy instead. */
body:not(.admin-page):not(.page-admin) main :is(.card,[class*="-card"]:not(.pcb-card),[class*="_card"]:not(.pcb-card),.panel,[class*="-panel"],.box,[class*="-box"])
  :is(span,strong,b,em,i,p,li,small,label){
  color:inherit !important;
  -webkit-text-fill-color:currentColor !important;
  text-shadow:none !important;
}

/* Green accents remain green. */
body:not(.admin-page):not(.page-admin) main :is(.eyebrow,.kicker,.overline,.section-label,.green,.green-text,.accent,.accent-text,.label-accent),
body:not(.admin-page):not(.page-admin) main :is(h1,h2,h3) > :is(span,.green,.accent){
  color:var(--sk3316-green) !important;
  -webkit-text-fill-color:currentColor !important;
}

/* Intentional green/dark controls keep white copy. */
body:not(.admin-page):not(.page-admin) :is(.primary-btn,.btn-primary,.nav-button,.cta-button,.quote-btn,.submit-btn,.quick-quote-submit,button.primary),
body:not(.admin-page):not(.page-admin) :is(.primary-btn,.btn-primary,.nav-button,.cta-button,.quote-btn,.submit-btn,.quick-quote-submit,button.primary) *,
body:not(.admin-page):not(.page-admin) main .pcb-card,
body:not(.admin-page):not(.page-admin) main .pcb-card *{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

/* Price and form surfaces: never white-on-white. */
body:not(.admin-page):not(.page-admin) :is(input,textarea,select){
  color:var(--sk3316-ink) !important;
  background:#fff !important;
  -webkit-text-fill-color:currentColor !important;
}
body:not(.admin-page):not(.page-admin) :is(input,textarea)::placeholder{color:#8a949d !important; opacity:1 !important;}

/* ---------- DESKTOP: RESTORE THE ORIGINAL PREMIUM MOTION ----------
   Mobile layout CSS is not allowed to control desktop. These are the original
   animation names/timing used by the pre-mobile premium build. */
@media (min-width:901px){
  /* Original hero artwork float from style.css. */
  .page-home .hero-slide-image > img.hero-image-main,
  .page-home .hero-slide-image > img.hero-image-photo:not(.hero-delivery-vehicle){
    animation:pcbFloat 4s ease-in-out infinite !important;
  }

  /* Delivery body moves through the scene; body/rim share suspension. */
  .page-home .hero-delivery-slide.active .hero-delivery-vehicle-wrap{
    animation:sk-delivery-drive-through 5s cubic-bezier(.18,.7,.18,1) both !important;
  }
  .page-home .hero-delivery-slide.active .hero-delivery-layer-lock{
    animation:sk-delivery-suspension .52s ease-in-out infinite !important;
  }
  .page-home .hero-delivery-vehicle-wrap .delivery-wheel > i{
    animation:sk-delivery-wheel-photo-spin .72s linear infinite !important;
  }
  .page-home .hero-delivery-slide.active .delivery-road{
    animation:
      sk-delivery-road-follow 5s cubic-bezier(.18,.7,.18,1) both,
      sk-road-asphalt-flow-real .62s linear infinite !important;
  }

  /* Do not let mobile-style geometry leak onto desktop. */
  .page-home .hero-slide-content{grid-template-columns:.9fr 1.1fr !important;}
  .page-home .hero-slide-text{min-width:0;}
}

/* ---------- PHONE/TABLET: KEEP THE GOOD ARRANGEMENT, FIX THE COLORS ---------- */
@media (max-width:900px){
  html,body,main,main>section,section{background-color:#fff !important;}

  body:not(.admin-page):not(.page-admin) main :is(h1,h2,h3,h4,h5,h6){
    color:var(--sk3316-ink) !important;
    -webkit-text-fill-color:currentColor !important;
    text-shadow:none !important;
  }
  body:not(.admin-page):not(.page-admin) main :is(p,li,dd,dt,label,small,span,.description,.section-description,.lead,.subtext){
    color:var(--sk3316-copy) !important;
    -webkit-text-fill-color:currentColor !important;
    text-shadow:none !important;
  }
  body:not(.admin-page):not(.page-admin) main :is(.eyebrow,.kicker,.overline,.section-label,.green,.green-text,.accent,.accent-text),
  body:not(.admin-page):not(.page-admin) main :is(h1,h2,h3) > :is(span,.green,.accent){
    color:var(--sk3316-green) !important;
    -webkit-text-fill-color:currentColor !important;
  }
  body:not(.admin-page):not(.page-admin) :is(.primary-btn,.btn-primary,.nav-button,.cta-button,.quote-btn,.submit-btn,.quick-quote-submit,button.primary),
  body:not(.admin-page):not(.page-admin) :is(.primary-btn,.btn-primary,.nav-button,.cta-button,.quote-btn,.submit-btn,.quick-quote-submit,button.primary) *,
  body:not(.admin-page):not(.page-admin) main .pcb-card,
  body:not(.admin-page):not(.page-admin) main .pcb-card *{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }

  /* Motion stays alive on phone too; geometry comes only from mobile-final.css. */
  .page-home .hero-slide-image > img.hero-image-main,
  .page-home .hero-slide-image > img.hero-image-photo:not(.hero-delivery-vehicle){
    animation:pcbFloat 4s ease-in-out infinite !important;
  }
  .page-home .hero-delivery-slide.active .hero-delivery-vehicle-wrap{
    animation:sk-delivery-drive-through 5s cubic-bezier(.18,.7,.18,1) both !important;
  }
  .page-home .hero-delivery-slide.active .hero-delivery-layer-lock{
    animation:sk-delivery-suspension .52s ease-in-out infinite !important;
  }
  .page-home .hero-delivery-vehicle-wrap .delivery-wheel > i{
    animation:sk-delivery-wheel-photo-spin .72s linear infinite !important;
  }
}

/* ---------- HARD LIGHT-SURFACE CONTRAST (wins old premium !important rules) ---------- */
html body:not(.admin-page):not(.page-admin) main > section:not(.hero-slider):not(.pcb-card)
:is(h1,h2,h3,h4,h5,h6,p,li,dd,dt,label,small,.description,.section-description,.lead,.subtext),
html body:not(.admin-page):not(.page-admin) main > :is(article,div):not(.hero-slider):not(.pcb-card)
:is(h1,h2,h3,h4,h5,h6,p,li,dd,dt,label,small,.description,.section-description,.lead,.subtext){
  color:var(--sk3316-copy) !important;
  -webkit-text-fill-color:currentColor !important;
  text-shadow:none !important;
}
html body:not(.admin-page):not(.page-admin) main > section:not(.hero-slider)
:is(h1,h2,h3,h4,h5,h6),
html body:not(.admin-page):not(.page-admin) main > :is(article,div):not(.hero-slider)
:is(h1,h2,h3,h4,h5,h6){
  color:var(--sk3316-ink) !important;
}
html body:not(.admin-page):not(.page-admin) main > section:not(.hero-slider)
:is(.eyebrow,.kicker,.overline,.section-label,.green,.green-text,.accent,.accent-text),
html body:not(.admin-page):not(.page-admin) main > section:not(.hero-slider)
:is(h1,h2,h3) > :is(span,.green,.accent){
  color:var(--sk3316-green) !important;
  -webkit-text-fill-color:currentColor !important;
}
/* Exceptions with intentionally colored backgrounds. */
html body:not(.admin-page):not(.page-admin) main .pcb-card *,
html body:not(.admin-page):not(.page-admin) main :is(.primary-btn,.btn-primary,.nav-button,.cta-button,.quote-btn,.submit-btn,.quick-quote-submit,button.primary) *{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

@media (max-width:900px){
  /* On phone every ordinary white card/surface gets guaranteed readable copy. */
  html body:not(.admin-page):not(.page-admin) main
  :is(.card,[class*="-card"]:not(.pcb-card),[class*="_card"]:not(.pcb-card),.panel,[class*="-panel"],.box,[class*="-box"],.faq-item,.accordion-item)
  :is(h1,h2,h3,h4,h5,h6,p,span,li,dd,dt,label,small,strong,b,em){
    color:var(--sk3316-copy) !important;
    -webkit-text-fill-color:currentColor !important;
    text-shadow:none !important;
  }
  html body:not(.admin-page):not(.page-admin) main
  :is(.card,[class*="-card"]:not(.pcb-card),[class*="_card"]:not(.pcb-card),.panel,[class*="-panel"],.box,[class*="-box"],.faq-item,.accordion-item)
  :is(h1,h2,h3,h4,h5,h6){color:var(--sk3316-ink) !important;}
  html body:not(.admin-page):not(.page-admin) main .pcb-card *,
  html body:not(.admin-page):not(.page-admin) main :is(.primary-btn,.btn-primary,.nav-button,.cta-button,.quote-btn,.submit-btn,.quick-quote-submit,button.primary) *{
    color:#fff !important;
    -webkit-text-fill-color:#fff !important;
  }
}
