/* ============================================================
   CRUSADERS — CLEAN LIGHT REDESIGN (override layer)
   Loaded LAST on every page. Flips the dark navy theme to a
   clean white look with restrained blue accents. Layout from
   the original CSS is untouched; only colours, backgrounds,
   borders, shadows and the logo filter change.
   ============================================================ */

:root{
  --bg:#ffffff;
  --panel:#ffffff;
  --panel2:#f4f7fb;
  --line:#e4e9f0;
  --text:#132a44;
  --muted:#51657c;
  --blue:#1664b4;
  --gold:#b07d3c;
}

body{background:var(--bg);color:var(--text)}

/* ---------- Header / nav ---------- */
.utility{border-bottom-color:#e8edf3;color:#6c7e92}
.nav-shell{background:rgba(255,255,255,.95);border-bottom-color:var(--line)}
.brand img{filter:none;mix-blend-mode:normal}
.nav-links a:hover,.nav-links a[aria-current=page]{color:var(--blue)}
.menu{color:var(--text);border-color:#c3cedb;background:none}

/* ---------- Buttons ---------- */
.button{background:var(--blue);color:#fff;border-color:var(--blue)}
.button:hover{background:#0f4e8f;color:#fff}
.button.secondary{background:transparent;border-color:#c3cedb;color:var(--text)}
.button.secondary:hover{background:#eef4fb;color:var(--text)}

/* ---------- Generic ---------- */
.eyebrow{color:var(--blue)}
.gold{color:var(--gold)}
.hero{background:radial-gradient(ellipse at 95% 25%,#eaf2fb,transparent 55%)}
.hero h1 span{color:var(--blue)}
.since b{color:var(--gold)}
.since span{border-left-color:#dce2ea;color:#6c7e92}
.division{background:#fff;border-color:var(--line)}
.division:hover{border-color:var(--blue)}
.division .link{color:var(--blue)}
.scope{border-bottom-color:var(--line);color:#6c7e92}
.scope span:first-child{color:var(--gold)}
.value{border-top-color:var(--line)}
.value b{color:var(--gold)}
.sector-strip{background:var(--panel2);border-top-color:var(--line);border-bottom-color:var(--line)}
.sectors{color:var(--muted)}
.milestones{border-left-color:var(--line)}
.milestones strong{color:var(--gold)}
.link-arrow{color:var(--blue);border-bottom-color:#bcd2e8}
.cta{border-color:var(--line);background:linear-gradient(110deg,#f2f7fc,#eaf1f9)}

/* ---------- Footer ---------- */
.footer{background:#f4f7fb;border-top-color:var(--line)}
.footer p{color:var(--muted)}
.footer h3{color:var(--text)}
.footer a{color:var(--muted)}
.footer a:hover{color:var(--blue)}
.footer-bottom{border-top-color:var(--line);color:#6c7e92}

/* ---------- Floating WhatsApp ---------- */
.whatsapp{background:#25d366;border-color:#25d366;color:#fff;box-shadow:0 6px 20px rgba(0,0,0,.18)}

/* ---------- Inner page shells ---------- */
.breadcrumbs{color:#6c7e92}
.breadcrumbs a{color:var(--blue)}
.page-hero{background:radial-gradient(ellipse at 90% 30%,#eaf2fb,transparent 60%);border-bottom-color:var(--line)}
.page-hero .visual{border-color:var(--line)}
.product-card{border-color:var(--line);background:#fff;box-shadow:0 10px 26px rgba(11,35,65,.05)}
.label{color:var(--blue)}
.subtle{color:#6c7e92}
th{background:var(--panel2);color:var(--text)}
td{color:var(--muted)}
th,td{border-bottom-color:var(--line)}
.panel{border-color:var(--line);background:#fff}
.service-card{border-color:var(--line);background:#fafbfd}
.service-card ul{color:var(--muted)}
.process article{border-top-color:var(--line)}
.process article:before{color:var(--gold)}
.stage{background:#fff;border-color:var(--line)}
.stage span{color:var(--gold)}
.faq details{border-bottom-color:var(--line)}
.faq summary{color:var(--text)}
.specs div{border-bottom-color:var(--line)}
.specs dt{color:#6c7e92}
.contact-info a.phone{color:var(--blue)}

/* ---------- Forms ---------- */
.form{border-color:var(--line);background:#fff}
.form label{color:var(--text)}
input,select,textarea{background:#fff;border-color:#cbd5e1;color:var(--text)}
input::placeholder,textarea::placeholder{color:#9aa7b5}
input:focus,textarea:focus,select:focus{outline-color:var(--blue)}

/* ---------- Credentials ---------- */
.credential-card{border-color:var(--line);background:#fff}
.credential-card img{background:#fff}
.proof-row{color:var(--muted)}
.proof-row span{border-bottom-color:var(--line)}
.feature-list{color:var(--muted)}

/* ============================================================
   HOMEPAGE HERO (photo split) — keep a soft dark overlay over
   the photos for text legibility, neutralised away from blue.
   ============================================================ */
.split-home{background:#17232f}
.split-title{background:linear-gradient(180deg,rgba(20,34,48,.92),rgba(20,34,48,.35) 70%,transparent)}
.split-title>span{color:#e6cfa6}
.split-title h1{color:#ffffff}
.split-title h1 span{color:#e6cfa6}
.split-title p{color:#eef2f8;text-shadow:0 1px 10px rgba(0,16,38,.6)}
.home-shade{background:linear-gradient(0deg,#141f2b 0%,rgba(20,31,43,.93) 12%,rgba(20,31,43,.68) 30%,rgba(20,31,43,.09) 66%,rgba(20,31,43,.25) 100%)}
.home-air .home-shade{background:linear-gradient(0deg,#1a2430 0%,rgba(26,36,48,.93) 12%,rgba(26,36,48,.65) 30%,rgba(26,36,48,.02) 65%,rgba(20,31,43,.15) 100%)}
.home-av .home-shade{background:linear-gradient(0deg,#141f2b 0%,rgba(20,31,43,.93) 10%,rgba(20,31,43,.65) 29%,rgba(20,31,43,.03) 58%,rgba(20,31,43,.08) 100%)}
.home-kicker{color:#e9eff7;border-left-color:var(--gold)}
.home-topics span+span:before{color:var(--gold)}
.home-explore{background:#ffffff;color:#13314e;border-color:#ffffff}
.home-av .home-explore{background:#ffffff;border-color:#ffffff;color:#13314e}
.home-half:hover .home-explore{background:#eef4fb;color:#13314e}
.split-seam{background:rgba(201,168,109,.55)}
.home-bridge{background:var(--panel2);border-top-color:var(--line);border-bottom-color:var(--line)}
.home-bridge span{color:var(--gold)}
.home-bridge p{color:var(--muted)}

/* ============================================================
   HOMEPAGE CONTENT SECTIONS
   ============================================================ */
.home-client-strip{background:var(--panel2);color:var(--text);border-bottom-color:var(--line)}
.home-client-strip .eyebrow{color:var(--blue)}
.home-client-strip .link-arrow{color:var(--blue);border-color:#bcd2e8}
.home-client-names a{border-left-color:var(--line)}
.home-client-names span{color:#6c7e92}
.home-technology h2 span,.home-displays h2 span{color:var(--blue)}

.home-tech-photo{border-color:var(--line)}
.home-tech-photo:after{background:linear-gradient(0deg,rgba(20,31,43,.9),rgba(20,31,43,0) 75%)}
.home-tech-photo span{color:#e6cfa6}
.home-tech-photo a{color:#d6e6f7;border-bottom-color:#9fb6cf}

.home-stage{background:#fff;border-color:var(--line)}
.home-stage:nth-last-child(-n+2){border-color:var(--line);background:#f4f7fb}
.stage-icon{color:var(--blue)}
.stage-number{color:var(--gold)}
.home-stage p{color:var(--muted)}
.home-benefit-row{border-top-color:var(--line)}
.home-benefit-row strong{color:var(--text)}

.home-displays{background:var(--panel2);border-top-color:var(--line);border-bottom-color:var(--line)}
.home-solution{border-color:var(--line);background:#fff}
.home-solution ul{color:var(--muted)}
.home-content-note{color:#6c7e92}

.home-project{border-top-color:var(--line);background:#fff;box-shadow:0 10px 26px rgba(11,35,65,.05)}
.project-number{color:var(--gold);border-bottom-color:var(--line)}
.project-number span{color:var(--blue)}
.home-sectors{border-top-color:var(--line);color:var(--muted)}

.home-testimonials{background:var(--panel2);color:var(--text)}
.home-testimonials .eyebrow{color:var(--blue)}
.home-testimonials .section-head p{color:var(--muted)}
.home-quote{background:#fff;border-color:var(--line)}
.quote-symbol{color:var(--gold)}
.home-quote blockquote{color:var(--text)}
.home-quote figcaption{border-top-color:var(--line)}
.home-quote figcaption span{color:var(--muted)}
.home-quote figcaption small{color:#6c7e92}
.home-quote>a{color:var(--blue)}
.home-testimonials .home-content-note{color:#6c7e92}

.home-legacy-milestones{border-left-color:var(--line)}
.home-legacy-milestones strong{color:var(--gold)}
.home-legacy-milestones span{color:var(--muted)}

.home-commitments{background:var(--panel2);border-top-color:var(--line);border-bottom-color:var(--line)}
.home-commitment-grid article{border-top-color:var(--line)}
.home-commitment-grid article>span{color:var(--gold)}

.home-enquiry{background:var(--panel2);border-top-color:var(--line)}
.home-enquiry h2{color:var(--text)}
.home-enquiry-options a{border-color:var(--line);background:#fff}
.home-enquiry-options a:hover{background:#eef4fb}
.home-enquiry-options span{color:#6c7e92}
.home-enquiry-options strong{color:var(--text)}

/* ============================================================
   CATALOGUE / PRODUCTS
   ============================================================ */
.catalogue-intro{background:radial-gradient(ellipse at 90% 0%,#eaf2fb,transparent 65%)}
.catalogue-heading h1 span{color:var(--blue)}
.catalogue-promises{border-top-color:var(--line);border-bottom-color:var(--line);color:var(--muted)}
.catalogue-promises span:before{color:var(--blue)}
.catalogue-collection{background:var(--panel2)}
.filter-tabs button{background:#fff;border-color:#cbd5e1;color:var(--muted)}
.filter-tabs button.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.catalogue-result-row p{color:#6c7e92}
.range-card{background:#fff;border-color:var(--line);box-shadow:0 14px 30px rgba(11,35,65,.07)}
.coverage-badge{background:rgba(20,34,48,.9);border-color:rgba(255,255,255,.35);color:#fff}
.range-overline{color:var(--blue)}
.range-specs{border-top-color:var(--line);border-bottom-color:var(--line)}
.range-specs div+div{border-left-color:var(--line)}
.range-specs span{color:#6c7e92}
.range-specs strong{color:var(--text)}
.range-specs small{color:var(--muted)}
.range-details{color:var(--blue)}
.compare-check{color:var(--muted)}
.range-quote{color:var(--muted);border-top-color:var(--line)}
.choose-panel{border-color:var(--line);background:#fff}
.choose-panel li{color:var(--muted)}
.choose-panel strong{color:var(--text)}
.choose-panel span{color:var(--muted)}
.compare-tray{background:#13314e;border-color:#3c5f88}
.compare-dialog{background:#fff;color:var(--text);border-color:var(--line)}
.compare-close{color:var(--text)}

/* ============================================================
   MOBILE overrides (match the original dark mobile rules)
   ============================================================ */
@media(max-width:1050px){
  .nav-links{background:#fff;border-bottom-color:var(--line)}
}
@media(max-width:900px){
  .split-home{background:#17232f}
  .split-title{background:#17232f}
  .home-shade,.home-air .home-shade{background:linear-gradient(0deg,#141f2b 0%,rgba(20,31,43,.84) 15%,rgba(20,31,43,.44) 40%,rgba(20,31,43,0) 72%)}
}
@media(max-width:760px){
  .nav-links{background:#fff;border-bottom-color:var(--line)}
}

/* ========================================================
   RICHER LOOK — more blue, 3D depth, motion
   ======================================================== */
.division,.value,.product-card,.panel,.service-card,.stage,.credential-card,.home-stage,
.home-solution,.home-project,.home-quote,.range-card,.app,.pcard,.why,.pc,.cl,.step,.letter{
  transition:transform .28s cubic-bezier(.2,.7,.2,1),box-shadow .28s ease,border-color .28s ease}
.product-card,.panel,.service-card,.stage,.credential-card,.home-stage,.home-solution,
.home-project,.home-quote,.range-card,.app,.pcard,.why,.pc,.letter{
  box-shadow:0 10px 30px rgba(0,22,70,.07),0 2px 6px rgba(0,22,70,.04)}
.product-card:hover,.panel:hover,.service-card:hover,.stage:hover,.credential-card:hover,
.home-stage:hover,.home-solution:hover,.home-project:hover,.home-quote:hover,.range-card:hover,
.app:hover,.pcard:hover,.why:hover,.pc:hover,.letter:hover{
  transform:translateY(-6px);box-shadow:0 24px 50px rgba(0,22,70,.16),0 6px 14px rgba(0,22,70,.08);border-color:#9bb8e6}
.division{box-shadow:0 14px 38px rgba(0,22,70,.1)}
.division:hover{transform:translateY(-5px);box-shadow:0 28px 60px rgba(0,22,70,.2)}

.division .division-visual img,.home-solution>a img,.product-card img,.pcard .ph img,
.range-photo img,.home-tech-photo>img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.division:hover .division-visual img,.home-solution:hover img,.product-card:hover img,
.pcard:hover .ph img,.range-card:hover .range-photo img{transform:scale(1.06)}

.button,.btn,.home-explore{box-shadow:0 8px 20px rgba(0,48,144,.2);transition:transform .16s ease,box-shadow .16s ease,background .16s ease,filter .16s ease}
.button:hover,.btn-primary:hover,.home-explore:hover{transform:translateY(-2px);box-shadow:0 14px 28px rgba(0,48,144,.3)}
.button:active,.btn:active{transform:translateY(0)}

.why .ic,.pc .ic,.app .ic,.stage-icon,.cl .ic{
  background:linear-gradient(135deg,#eaf1fc,#d7e4f9);box-shadow:inset 0 1px 0 #fff,0 6px 14px rgba(0,48,144,.12)}

.product-card,.range-card,.credential-card,.home-stage,.home-project{border-top:3px solid #003090}

.hero,.page-hero,.catalogue-intro{background:radial-gradient(900px 420px at 92% -12%,#d8e6fb,transparent 60%),linear-gradient(180deg,#f2f7fe,#ffffff)}
.sector-strip,.home-client-strip{background:linear-gradient(135deg,#eef3fc,#e2ecfb)}

.cta,.home-enquiry{background:radial-gradient(700px 300px at 85% -30%,#1b46b0,transparent 60%),linear-gradient(135deg,#003090,#071a5c);border:none}
.cta{border-radius:6px}
.cta h2,.home-enquiry h2{color:#ffffff}
.cta p,.home-enquiry p{color:#cfdcf4}
.home-enquiry .eyebrow{color:#9fc0ff}
.cta .button{background:#ffffff;color:#003090;box-shadow:0 10px 24px rgba(0,0,0,.2)}
.cta .button:hover{background:#eaf0ff}
.home-enquiry-options a{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22)}
.home-enquiry-options a:hover{background:rgba(255,255,255,.16)}
.home-enquiry-options span{color:#bcd2f5}
.home-enquiry-options strong{color:#ffffff}

.footer{background:linear-gradient(135deg,#00257a,#00123f);border-top:none}
.footer p{color:#b9c9e8}
.footer h3{color:#ffffff}
.footer-brand{color:#ffffff}
.footer a{color:#b9c9e8}
.footer a:hover{color:#ffffff}
.footer-bottom{border-top-color:rgba(255,255,255,.12);color:#92a6cc}

html.js-reveal .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
html.js-reveal .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){html.js-reveal .reveal{opacity:1;transform:none;transition:none}}

/* ===== BOLDER v2 — stronger blue, clear 3D, visible motion ===== */
.product-card,.range-card,.credential-card,.home-stage,.home-project,.home-solution,.home-quote,
.value,.service-card,.stage,.panel,.app,.pcard,.why,.pc,.letter,.home-enquiry-options a{border-radius:16px}
.product-card,.range-card,.credential-card,.home-stage,.home-project,.home-solution,.home-quote,
.service-card,.stage,.panel,.app,.pcard,.why,.pc,.letter{
  box-shadow:0 14px 38px rgba(0,30,95,.1),0 3px 10px rgba(0,30,95,.06)}
.product-card,.range-card,.credential-card,.home-stage,.home-project{border-top:4px solid #003090}
.product-card:hover,.range-card:hover,.credential-card:hover,.home-stage:hover,.home-project:hover,
.home-solution:hover,.home-quote:hover,.service-card:hover,.stage:hover,.panel:hover,.app:hover,
.pcard:hover,.why:hover,.pc:hover,.letter:hover{
  transform:translateY(-8px);box-shadow:0 28px 58px rgba(0,48,144,.2),0 8px 18px rgba(0,30,95,.1);border-color:#7aa0e0}

/* bold blue icon tiles */
.why .ic,.pc .ic,.app .ic,.cl .ic{
  background:linear-gradient(135deg,#1c57d8,#002a86);color:#fff;box-shadow:0 10px 22px rgba(0,48,144,.32);border-radius:14px}
.why .ic svg,.pc .ic svg,.app .ic svg,.cl .ic svg{color:#fff}
.home-stage .stage-icon{width:56px;height:56px;flex:0 0 56px;border-radius:14px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#1c57d8,#002a86);color:#fff;box-shadow:0 10px 22px rgba(0,48,144,.3)}
.home-stage .stage-icon svg{width:30px;height:30px;color:#fff}

/* MORE BLUE across sections */
.home-technology,.home-commitments,.home-faq-section,.catalogue-explain{background:linear-gradient(180deg,#e7eefb,#f3f8ff)}
.home-displays{background:linear-gradient(180deg,#dde8fa,#eaf2fd)}
.sector-strip,.home-client-strip{background:linear-gradient(135deg,#e6eefb,#dbe6fa)}

/* buttons: blue gradient + lift */
.button,.btn-primary{background:linear-gradient(135deg,#0a49c8,#002f8e);border-color:transparent;box-shadow:0 10px 24px rgba(0,48,144,.3)}
.button:hover,.btn-primary:hover{background:linear-gradient(135deg,#1256dd,#00277a);transform:translateY(-3px);box-shadow:0 16px 32px rgba(0,48,144,.4)}

/* scroll reveal — stronger */
html.js-reveal .reveal{opacity:0;transform:translateY(30px) scale(.985);transition:opacity .7s ease,transform .75s cubic-bezier(.2,.7,.2,1)}
html.js-reveal .reveal.in{opacity:1;transform:none}