/* HoldenTek website
   Direction: a security firm's own colours, not a tech demo. Light, clean pages in brand navy and white,
   solid navy bands for impact, teal as the action colour. The only glow on the site is CALL NOW. */
:root{
  --navy:#193948;        /* brand navy: text, dark bands */
  --navy-deep:#102A36;   /* hero and footer */
  --teal:#24A5A0;        /* brand teal: CALL NOW, accents on navy */
  --teal-ink:#13807B;    /* teal dark enough for text on light backgrounds */
  --steel:#9DADBC;       /* brand tagline grey */
  --paper:#F4F7F8;       /* page background, cool off-white */
  --white:#FFFFFF;
  --mist:#E6F1F1;        /* pale teal tint for alternate sections */
  --alert:#D9473C;       /* stolen state in the hero illustration */
  --bg:var(--paper);
  --fg:var(--navy);
  --fg2:#4A6472;
  --line:rgba(25,57,72,.14);
  --display:"Big Shoulders Display","Arial Narrow","Roboto Condensed",Impact,sans-serif;
  --body:"Barlow",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --wrap:1180px;
  --gutter:clamp(16px,4vw,40px);
  color-scheme:light;
}
.dark,.hero,.page-hero,.cta-band,.tv,.site-foot{--bg:var(--navy);--fg:#FFFFFF;--fg2:#C9D6DF;--line:rgba(255,255,255,.16);color-scheme:dark}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--navy);font-family:var(--body);font-size:17px;line-height:1.6;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--teal-ink)}
.dark a:not(.callnow):not(.ghost),.page-hero a:not(.callnow):not(.ghost){color:#fff}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px;border-radius:4px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}
.skip{position:absolute;left:-999px;top:8px;background:var(--navy);color:#fff;padding:8px 14px;z-index:100;font-weight:700}
.skip:focus{left:8px}

h1,h2,h3{font-family:var(--display);font-weight:800;line-height:.95;letter-spacing:.01em;margin:0 0 .4em;text-wrap:balance;color:var(--fg)}
h1{font-size:clamp(3rem,9vw,6.8rem);text-transform:uppercase}
h2{font-size:clamp(2.2rem,5.4vw,4rem);text-transform:uppercase}
h3{font-size:clamp(1.45rem,2.6vw,1.9rem);text-transform:uppercase;letter-spacing:.02em}
p{margin:0 0 1em;max-width:66ch}
.lead{font-size:clamp(1.1rem,2vw,1.3rem);color:var(--fg);max-width:58ch}
.muted{color:var(--fg2)}
strong{color:var(--fg)}
section{color:var(--fg)}

/* header: white, so the logo sits on white as the brand requires */
.site-head{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:#fff;border-bottom:1px solid rgba(25,57,72,.12);box-shadow:0 2px 14px rgba(16,42,54,.06)}
.head-row{display:flex;align-items:center;gap:20px;min-height:74px}
.brand{display:flex;align-items:center;flex:none}
.brand img{height:44px;width:auto}
.nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav a,.nav button{color:var(--navy);text-decoration:none;font-weight:600;font-size:.97rem;padding:10px 11px;border-radius:6px;background:none;border:0;font-family:inherit;cursor:pointer}
.nav a:hover,.nav button:hover,.nav a[aria-current=page]{color:var(--teal-ink)}
.nav a[aria-current=page]{box-shadow:inset 0 -3px 0 var(--teal)}
.drop{position:relative}
.drop>button::after{content:"";display:inline-block;margin-left:6px;border:5px solid transparent;border-top-color:currentColor;vertical-align:-2px}
.drop-menu{position:absolute;top:100%;left:0;min-width:260px;background:#fff;border:1px solid rgba(25,57,72,.12);border-radius:8px;padding:8px;display:none;box-shadow:0 18px 40px rgba(16,42,54,.16)}
.drop:hover .drop-menu,.drop:focus-within .drop-menu,.drop.open .drop-menu{display:grid}
.drop-menu a{padding:10px 12px}
.head-call{margin-left:10px}
.menu-btn{display:none;margin-left:auto;background:var(--navy);border:0;color:#fff;border-radius:8px;padding:10px 16px;font:inherit;font-weight:700}
@media (max-width:1360px){
  .nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;background:#fff;border-bottom:1px solid rgba(25,57,72,.12);padding:10px var(--gutter) calc(120px + env(safe-area-inset-bottom,0px));max-height:calc(100svh - 74px);overflow:auto}
  .nav.open{display:flex}
  .nav a,.nav button{padding:14px 6px;font-size:1.1rem;text-align:left;border-bottom:1px solid rgba(25,57,72,.1);border-radius:0}
  .nav a[aria-current=page]{box-shadow:inset 4px 0 0 var(--teal);padding-left:14px}
  .drop-menu{position:static;display:grid;box-shadow:none;border:0;padding:0 0 0 14px;min-width:0}
  .drop>button{display:none}
  .menu-btn{display:block}
  .head-call{display:none}
}

/* CALL NOW: the one glowing thing */
.callnow{position:relative;isolation:isolate;display:inline-flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;background:var(--teal);color:#fff;font-family:var(--display);font-weight:900;font-size:1.45rem;letter-spacing:.06em;line-height:1;padding:16px 30px 13px;border-radius:999px;border:0;animation:glow 2.4s ease-in-out infinite;transition:transform .15s ease,background .15s ease;text-shadow:0 1px 0 rgba(0,0,0,.18)}
.callnow::before{content:"";position:absolute;inset:-14px;z-index:-1;border-radius:999px;background:radial-gradient(closest-side,rgba(36,165,160,.55),rgba(36,165,160,.15) 65%,transparent);filter:blur(8px);animation:halo 2.4s ease-in-out infinite}
.callnow small{font-family:var(--body);font-weight:700;font-size:.8rem;letter-spacing:.03em;margin-top:5px}
.callnow:hover{color:#fff;background:#1E928D;transform:scale(1.04)}
.nav a.callnow,.nav a.callnow:hover{color:#fff;background:var(--teal);border-radius:999px;padding:10px 18px 9px;font-size:1.05rem;box-shadow:none}
.callnow.sm{font-size:1.05rem;padding:10px 18px 9px}
.callnow.lg{font-size:clamp(1.7rem,4vw,2.3rem);padding:20px 44px 16px}
@keyframes glow{0%,100%{box-shadow:0 0 14px 2px rgba(36,165,160,.45),0 0 0 0 rgba(36,165,160,.45)}50%{box-shadow:0 0 30px 8px rgba(36,165,160,.6),0 0 0 12px rgba(36,165,160,0)}}
@keyframes halo{0%,100%{opacity:.6;transform:scale(.95)}50%{opacity:1;transform:scale(1.07)}}
.ghost{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:var(--fg);background:transparent;border:2px solid var(--fg);border-radius:999px;padding:14px 24px;font-weight:700;font-size:1rem}
.ghost:hover{background:var(--fg);color:var(--bg)}
.actions{display:flex;flex-wrap:wrap;gap:22px;align-items:center;margin-top:26px}

.callbar{display:none}
@media (max-width:760px){
  .callbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));background:#fff;border-top:1px solid rgba(25,57,72,.14);box-shadow:0 -6px 20px rgba(16,42,54,.1)}
  .callbar .callnow{flex:1;font-size:1.25rem;padding:13px 10px 10px}
  .callbar .wa{flex:none;width:58px;border-radius:16px}
  body{padding-bottom:84px}
  .wa-float{display:none}
}
.wa,.wa-float{display:inline-flex;align-items:center;justify-content:center;background:#1FAF61;color:#fff;text-decoration:none}
.wa-float{position:fixed;right:18px;bottom:18px;z-index:55;width:60px;height:60px;border-radius:50%;box-shadow:0 10px 24px rgba(16,42,54,.3)}
.wa svg,.wa-float svg{width:30px;height:30px;fill:#fff}

/* hero (navy) */
.hero{position:relative;overflow:hidden;background:var(--navy-deep);min-height:min(88svh,860px);display:flex;align-items:center}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;transform-origin:60% 50%;opacity:.55}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--navy-deep) 0%,rgba(16,42,54,.85) 45%,rgba(16,42,54,.35) 100%);pointer-events:none}
.hero-inner{position:relative;z-index:2;padding-block:clamp(70px,12vh,120px);width:100%}
.hero h1{max-width:11ch;margin-bottom:.3em}
.hero h1 .line{display:block}
.hero h1 .line:nth-child(2){color:var(--teal)}
.hero .lead{margin-bottom:0;color:#E3ECF0}
.js .hero h1 .line{animation:slam .9s cubic-bezier(.2,.8,.2,1) both}
.js .hero h1 .line:nth-child(2){animation-delay:.18s}
.js .hero .lead,.js .hero .actions,.js .hero .proof{animation:rise .8s ease .45s both}
@keyframes slam{from{transform:scale(1.3);opacity:.1}to{transform:none;opacity:1}}
@keyframes rise{from{transform:translateY(16px);opacity:.2}to{transform:none;opacity:1}}
.proof{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:30px;color:#E3ECF0;font-weight:600;font-size:.98rem}
.proof span::before{content:"";display:inline-block;width:14px;height:3px;background:var(--teal);margin-right:10px;vertical-align:4px}
.hero-photo{position:absolute;z-index:2;right:max(var(--gutter),calc((100vw - var(--wrap))/2 + var(--gutter)));top:50%;transform:translateY(-50%);width:min(34vw,430px);margin:0;border-radius:14px;overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.45)}
.hero-photo img{width:100%;height:auto}
@media (min-width:1001px){.hero h1,.hero .lead,.hero .proof{max-width:min(60%,640px)}}
@media (max-width:1000px){.hero-photo{display:none}}

/* inner page hero (solid navy) */
.page-hero{background:var(--navy)}
.page-hero .wrap{padding-block:clamp(60px,10vh,104px) clamp(40px,6vh,64px)}
.page-hero h1{font-size:clamp(2.7rem,7.5vw,5.6rem);max-width:15ch}
.page-hero .lead{color:#E3ECF0}
.crumb{font-size:.95rem;color:#C9D6DF;margin-bottom:18px}

/* sections */
.sec{position:relative;overflow:hidden;padding-block:clamp(64px,10vw,120px);background:var(--paper)}
.sec.alt{background:var(--white)}
.sec.tint{background:var(--mist)}
.sec.dark{background:var(--navy)}
.stage{will-change:transform;transform-origin:50% 40%}
.js .zoom-in .stage{transform:scale(calc(.93 + .07*var(--p,1)))}
.js .zoom-out .stage{transform:scale(calc(1.07 - .07*var(--p,1)))}
.split{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,5vw,80px);align-items:center}
.split>*{min-width:0}
@media (max-width:860px){.split{grid-template-columns:1fr}}

.statement{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(3rem,10.5vw,8.6rem);line-height:.88;margin:0;color:var(--navy)}
.statement .dim{color:#8FA4B0}
.statement.teal{color:var(--teal-ink)}

.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--fg);border-bottom:1px solid var(--line)}
.stat{padding:28px 22px;border-left:1px solid var(--line);min-width:0}
.stat:first-child{border-left:0;padding-left:0}
.stat b{display:block;font-family:var(--display);font-weight:900;font-size:clamp(3rem,6.5vw,5.2rem);line-height:.9;color:var(--teal-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.dark .stat b{color:var(--teal)}
.stat b span{display:inline;margin:0;color:inherit;font-size:inherit;font-weight:inherit;line-height:inherit}
.stat b em{font-style:normal;font-size:.42em;margin-left:6px;letter-spacing:.04em}
.stat>span{display:block;margin-top:10px;color:var(--fg2);font-weight:600;font-size:1rem;line-height:1.35}
@media (max-width:860px){.stats{grid-template-columns:1fr 1fr}.stat:nth-child(3){border-left:0;padding-left:0}.stat{border-top:1px solid var(--line)}.stat:nth-child(-n+2){border-top:0}}
.fine{font-size:.92rem;color:var(--fg2);margin-top:14px}

.tv{background:var(--navy-deep);padding-block:clamp(56px,8vw,100px)}
.tv .lead{color:#E3ECF0}
.tv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px}
.show-card{position:relative;overflow:hidden;isolation:isolate;min-height:270px;border-radius:18px;padding:26px 24px;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;border:1px solid rgba(255,255,255,.14);box-shadow:0 24px 50px rgba(0,0,0,.35);transition:transform .35s ease,box-shadow .35s ease}
.show-card:hover{transform:translateY(-6px);box-shadow:0 34px 70px rgba(0,0,0,.45)}
.show-card::before,.show-card::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
.show-card b{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(2.4rem,4.4vw,3.6rem);line-height:.88;text-shadow:0 4px 24px rgba(0,0,0,.5)}
.show-card .ch{position:absolute;top:22px;left:24px;font-weight:800;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;padding:6px 10px;border-radius:6px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.22)}
.show-card .sub{margin-top:10px;font-weight:600;font-size:.98rem;color:rgba(255,255,255,.82)}
/* The Heist: vault black and gold */
.show-card.heist{background:#0E0D0B}
.show-card.heist::before{background:radial-gradient(120% 90% at 85% 0%,rgba(214,168,74,.55),transparent 55%),repeating-linear-gradient(135deg,rgba(214,168,74,.10) 0 2px,transparent 2px 22px)}
.show-card.heist::after{background:radial-gradient(circle at 78% 30%,transparent 0 46px,rgba(214,168,74,.35) 47px 49px,transparent 50px 70px,rgba(214,168,74,.22) 71px 72px,transparent 73px),linear-gradient(0deg,rgba(0,0,0,.75),transparent 60%)}
.show-card.heist b{color:#F3D58C}
/* Hunted: surveillance red */
.show-card.hunted{background:#1A0507}
.show-card.hunted::before{background:radial-gradient(90% 80% at 75% 25%,rgba(226,35,45,.6),transparent 60%),repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 4px)}
.show-card.hunted::after{background:radial-gradient(circle at 74% 34%,transparent 0 30px,rgba(255,90,90,.55) 31px 32px,transparent 33px 62px,rgba(255,90,90,.3) 63px 64px,transparent 65px),linear-gradient(90deg,transparent calc(74% - 1px),rgba(255,90,90,.35) calc(74% - 1px) calc(74% + 1px),transparent calc(74% + 1px)),linear-gradient(0deg,transparent calc(66% - 1px),rgba(255,90,90,.35) calc(66% - 1px) calc(66% + 1px),transparent calc(66% + 1px)),linear-gradient(0deg,rgba(0,0,0,.7),transparent 60%)}
.show-card .rec{position:absolute;top:24px;right:22px;font-weight:800;font-size:.82rem;letter-spacing:.12em;display:flex;align-items:center;gap:7px}
.show-card .rec::before{content:"";width:10px;height:10px;border-radius:50%;background:#FF3B3B;box-shadow:0 0 10px #FF3B3B;animation:blink 1.2s steps(2,start) infinite}
@keyframes blink{to{visibility:hidden}}
/* Celebrity Hunted: spotlight purple */
.show-card.celeb{background:#12081F}
.show-card.celeb::before{background:conic-gradient(from 200deg at 50% -10%,transparent 0deg,rgba(186,120,255,.45) 12deg,transparent 26deg,transparent 40deg,rgba(255,120,210,.35) 52deg,transparent 66deg),radial-gradient(80% 70% at 50% 0%,rgba(150,80,255,.45),transparent 65%)}
.show-card.celeb::after{background:radial-gradient(2px 2px at 20% 30%,#fff,transparent),radial-gradient(2px 2px at 80% 20%,#fff,transparent),radial-gradient(1.5px 1.5px at 62% 48%,#fff,transparent),radial-gradient(1.5px 1.5px at 35% 12%,#fff,transparent),linear-gradient(0deg,rgba(0,0,0,.75),transparent 60%)}
@media (max-width:900px){.tv-grid{grid-template-columns:1fr}.show-card{min-height:200px}}
@media (prefers-reduced-motion:reduce){.show-card .rec::before{animation:none}}

/* proof strip */
.proofband{background:var(--navy-deep);color:#fff;padding:26px 0;border-top:3px solid var(--teal)}
.pb-wrap{display:flex;align-items:center;justify-content:space-between;gap:20px 40px;flex-wrap:wrap}
.pb{display:flex;flex-wrap:wrap;gap:14px 38px}
.pb span{color:#C9D6DF;font-weight:600;font-size:.98rem}
.pb b{display:block;font-family:var(--display);font-weight:900;font-size:2rem;line-height:1;color:#fff}
.pb-link{color:#fff;font-weight:700;text-decoration:none;border-bottom:2px solid var(--teal);padding-bottom:2px}
.pb-link:hover{color:var(--teal)}

/* cars: two mornings */
.mornings{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:30px}
.morning{border-radius:18px;padding:28px 26px;background:#fff;border:1px solid rgba(25,57,72,.12)}
.morning h3{font-family:var(--display);text-transform:uppercase;font-size:1.9rem;margin-bottom:14px}
.morning ol{margin:0;padding:0;list-style:none;counter-reset:m}
.morning li{counter-increment:m;position:relative;padding:12px 0 12px 44px;border-top:1px solid rgba(25,57,72,.1)}
.morning li::before{content:counter(m);position:absolute;left:0;top:10px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.9rem}
.morning.bad{background:#fff}.morning.bad h3{color:#8FA4B0}.morning.bad li{color:var(--fg2)}.morning.bad li::before{background:#E9EEF1;color:#6B8190}
.morning.good{background:var(--navy);color:#fff;border-color:var(--navy);box-shadow:0 24px 50px rgba(16,42,54,.25)}
.morning.good h3{color:var(--teal)}.morning.good li{border-color:rgba(255,255,255,.14)}.morning.good li::before{background:var(--teal);color:#fff}
@media (max-width:820px){.mornings{grid-template-columns:1fr}}

/* vans: losses */
.losses{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin-top:30px;background:rgba(255,255,255,.12);border:2px solid rgba(255,255,255,.12);border-radius:16px;overflow:hidden}
.losses div{background:var(--navy);padding:26px 22px;font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(1.4rem,2.6vw,1.9rem);line-height:1.05;transition:background .3s}
.losses div:hover{background:#1F4757}
.losses b{display:block;font-family:var(--body);font-size:.9rem;color:var(--teal);letter-spacing:.1em;margin-bottom:10px}
.statement-sm{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(2rem,5vw,3.6rem);line-height:.95;margin:40px 0 0}
.statement-sm span{color:var(--teal)}
@media (max-width:760px){.losses{grid-template-columns:1fr 1fr}}
@media (max-width:440px){.losses{grid-template-columns:1fr}}

/* motorcycles: layers */
.layers{display:grid;gap:14px;margin-top:30px}
.layer{display:grid;grid-template-columns:80px 1fr;gap:20px;align-items:center;border-radius:16px;padding:22px 26px}
.layer b{font-family:var(--display);font-weight:900;font-size:3.6rem;line-height:.9}
.layer h3{font-family:var(--display);text-transform:uppercase;font-size:1.9rem;margin:0 0 4px}
.layer p{margin:0}
.layer.l1{background:var(--paper);margin-right:16%}.layer.l1 b{color:#A9BAC4}.layer.l1 p{color:var(--fg2)}
.layer.l2{background:var(--mist);margin-right:8%}.layer.l2 b{color:var(--teal-ink)}
.layer.l3{background:var(--navy);color:#fff;box-shadow:0 24px 50px rgba(16,42,54,.25)}.layer.l3 b,.layer.l3 h3{color:var(--teal)}
@media (max-width:700px){.layer{grid-template-columns:52px 1fr;padding:18px}.layer b{font-size:2.6rem}.layer.l1,.layer.l2{margin-right:0}}

/* commercial: assets */
.assets{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:30px}
.assets div{border-top:3px solid var(--teal);padding-top:18px}
.assets h3{font-family:var(--display);text-transform:uppercase;font-size:1.7rem;line-height:1;margin-bottom:8px}
.assets p{color:var(--fg2);margin:0}
.specline{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.specline span{border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:9px 16px;font-weight:700}
@media (max-width:900px){.assets{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.assets{grid-template-columns:1fr}}

/* roof tents: scenes */
.scenes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
.scenes div{background:#fff;border-radius:18px;padding:26px 24px;border:1px solid rgba(25,57,72,.1)}
.scenes span{font-family:var(--display);font-weight:900;font-size:3rem;color:var(--teal-ink);line-height:1}
.scenes h3{font-family:var(--display);text-transform:uppercase;font-size:1.7rem;margin:8px 0 6px}
.scenes p{margin:0;color:var(--fg2)}
@media (max-width:820px){.scenes{grid-template-columns:1fr}}

.steps{list-style:none;margin:30px 0 0;padding:0;counter-reset:s}
.steps li{display:grid;grid-template-columns:90px 1fr;gap:20px;padding:26px 0;border-top:1px solid var(--line);counter-increment:s}
.steps li::before{content:counter(s);font-family:var(--display);font-weight:900;font-size:3.4rem;line-height:.9;color:var(--teal-ink)}
.steps h3{margin-bottom:.3em}
.steps p{margin:0;color:var(--fg2)}
@media (max-width:600px){.steps li{grid-template-columns:54px 1fr}.steps li::before{font-size:2.6rem}}

.specs{display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid var(--fg)}
.spec{padding:24px 20px 24px 0;border-bottom:1px solid var(--line);min-width:0}
.spec b{display:block;font-family:var(--display);font-size:2.1rem;font-weight:800;text-transform:uppercase;line-height:1;color:var(--fg)}
.spec span{color:var(--fg2)}
@media (max-width:860px){.specs{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.specs{grid-template-columns:1fr}}

.vehicles{display:grid;grid-template-columns:repeat(2,1fr);border-top:2px solid var(--fg)}
.vehicles a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:24px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--fg);font-family:var(--display);font-weight:800;font-size:clamp(1.8rem,4vw,2.6rem);text-transform:uppercase;line-height:1}
.vehicles a:nth-child(odd){border-right:1px solid var(--line);padding-right:24px}
.vehicles a:nth-child(even){padding-left:24px}
.vehicles a span{font-family:var(--body);font-size:1rem;font-weight:600;color:var(--fg2);text-transform:none;text-align:right}
.vehicles a:hover{color:var(--teal-ink)}
@media (max-width:760px){.vehicles{grid-template-columns:1fr}.vehicles a:nth-child(odd){border-right:0;padding-right:4px}.vehicles a:nth-child(even){padding-left:4px}}

.photo{margin:0;border-radius:12px;overflow:hidden;box-shadow:0 24px 60px rgba(16,42,54,.22);max-width:100%}
.photo img{width:100%;height:auto;display:block}

.cta-band{background:var(--navy);padding-block:clamp(64px,9vw,110px);text-align:center;border-top:6px solid var(--teal)}
.cta-band h2{margin-inline:auto;max-width:18ch}
.cta-band p{margin-inline:auto;color:#E3ECF0}
.cta-band .actions{justify-content:center}

.quote{font-family:var(--display);font-weight:800;font-size:clamp(1.8rem,4vw,3rem);line-height:1.05;text-transform:uppercase;max-width:22ch;color:var(--fg)}

.faq{border-top:2px solid var(--fg)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 0;font-family:var(--display);font-weight:800;font-size:clamp(1.3rem,2.5vw,1.7rem);text-transform:uppercase;line-height:1.05;color:var(--fg)}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:2rem;color:var(--teal-ink);flex:none;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq .ans{padding:0 0 24px}
.faq .ans p{color:var(--fg2)}

.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,6vw,80px)}
.contact-grid>*{min-width:0}
@media (max-width:860px){.contact-grid{grid-template-columns:1fr}}
.lines{list-style:none;padding:0;margin:0;border-top:2px solid var(--fg)}
.lines li{padding:18px 0;border-bottom:1px solid var(--line)}
.lines b{display:block;font-size:.95rem;color:var(--fg2);font-weight:600}
.lines a,.lines span{font-size:1.2rem;font-weight:700;color:var(--fg);text-decoration:none;overflow-wrap:anywhere}
form .field{display:grid;gap:6px;margin-bottom:16px}
form label{font-weight:600;font-size:.95rem}
form input,form select,form textarea{font:inherit;color:var(--navy);background:#fff;border:1px solid rgba(25,57,72,.3);border-radius:8px;padding:13px 14px;width:100%}
form input:focus,form select:focus,form textarea:focus{outline:2px solid var(--teal);border-color:transparent}
form textarea{min-height:140px;resize:vertical}
.btn-send{font:inherit;font-weight:800;font-size:1.05rem;background:var(--navy);color:#fff;border:0;border-radius:999px;padding:14px 28px;cursor:pointer}
.btn-send:hover{background:var(--teal-ink)}
.form-msg{margin-top:12px;font-weight:600}

.prose{max-width:760px}
.prose h2{font-size:clamp(1.8rem,4vw,2.5rem);margin-top:1.4em}
.prose h3{margin-top:1.2em}
.prose ul{padding-left:1.2em}
.prose li{margin-bottom:.4em}
.notice{border:2px dashed var(--alert);border-radius:8px;padding:18px 20px;color:#7A2019;background:#FBEDEB}

.ticks{list-style:none;padding:0;margin:0 0 1em;border-top:2px solid var(--fg)}
.ticks li{position:relative;padding:12px 0 12px 34px;border-bottom:1px solid var(--line)}
.ticks li::before{content:"";position:absolute;left:4px;top:17px;width:16px;height:9px;border-left:3px solid var(--teal-ink);border-bottom:3px solid var(--teal-ink);transform:rotate(-45deg)}

.years{border-top:2px solid var(--fg)}
.year{display:grid;grid-template-columns:140px 1fr 1fr;gap:24px;padding:28px 0;border-bottom:1px solid var(--line);align-items:start}
.year>*{min-width:0}
.year h3{font-size:clamp(2.4rem,5vw,3.4rem);margin:0}
.year .col b{display:block;font-size:.95rem;color:var(--fg2);font-weight:700;margin-bottom:8px}
.year .col p{margin:0 0 4px}
.year .col.us p strong{color:var(--teal-ink);font-family:var(--display);font-size:1.8rem;font-weight:900;margin-right:6px}
.year .col.uk p strong{font-family:var(--display);font-size:1.5rem;font-weight:800;margin-right:6px}
@media (max-width:760px){.year{grid-template-columns:1fr;gap:12px}}

.site-foot{background:var(--navy-deep);padding-block:64px 36px;font-size:.95rem;color:#C9D6DF}
.foot-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:34px}
.foot-grid>*{min-width:0}
.foot-grid h4{font-family:var(--display);text-transform:uppercase;font-size:1.25rem;letter-spacing:.04em;margin:0 0 12px;color:#fff}
.foot-grid ul{list-style:none;padding:0;margin:0}
.foot-grid li{margin-bottom:8px}
.site-foot .foot-grid a,.site-foot .legal a{color:#C9D6DF;text-decoration:none}
.site-foot .foot-grid a:hover,.site-foot .legal a:hover{color:#fff;text-decoration:underline}
.site-foot .muted{color:#C9D6DF}
.foot-brand{display:inline-flex;background:#fff;border-radius:8px;padding:8px 12px;margin-bottom:16px}
.foot-brand img{height:52px;width:auto}
.legal{margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,255,255,.16);font-size:.88rem}
.legal p{max-width:none;margin-bottom:6px}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.foot-grid{grid-template-columns:1fr}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js .zoom-in .stage,.js .zoom-out .stage{transform:none}
}

/* page hero with a full-bleed photo behind the text */
.page-hero.has-img{position:relative;overflow:hidden;min-height:min(86svh,820px);display:flex;align-items:flex-end;background:var(--navy-deep)}
.ph-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transform-origin:50% 50%}
.js .ph-bg{animation:settle 1.6s cubic-bezier(.2,.7,.2,1) backwards}
@keyframes settle{from{transform:scale(1.14)}to{transform:scale(1)}}
.page-hero.has-img::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(16,42,54,.92) 0%,rgba(16,42,54,.72) 38%,rgba(16,42,54,.15) 72%,rgba(16,42,54,0) 100%),linear-gradient(0deg,rgba(16,42,54,.85) 0%,rgba(16,42,54,0) 45%)}
.ph-content{position:relative;z-index:2;width:100%;padding-block:clamp(120px,22vh,220px) clamp(44px,7vh,72px)}
.ph-content h1,.ph-content .lead{max-width:min(620px,100%)}
.ph-content .lead{color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.4)}
@media (max-width:760px){
  .page-hero.has-img{min-height:calc(100svh - 74px - 84px)}
  .page-hero.has-img::after{background:linear-gradient(0deg,rgba(16,42,54,.97) 0%,rgba(16,42,54,.8) 42%,rgba(16,42,54,.1) 75%,rgba(16,42,54,0) 100%)}
  .ph-content{padding-block:40vh 34px}
}
@media (max-width:760px){
  .js .zoom-out .stage{transform:scale(calc(1.025 - .025*var(--p,1)))}
  .js .zoom-in .stage{transform:scale(calc(.96 + .04*var(--p,1)))}
}

/* portrait photos: on wide screens sit on the right and fade into the navy behind the text */
@media (min-width:861px){
  .page-hero.has-img.portrait .ph-bg{left:auto;right:0;width:min(52%,760px);-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 22%,#000 58%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 22%,#000 58%)}
  .page-hero.has-img.portrait::after{background:linear-gradient(90deg,var(--navy-deep) 0%,var(--navy-deep) 47%,rgba(16,42,54,.75) 55%,rgba(16,42,54,.25) 66%,rgba(16,42,54,0) 76%),linear-gradient(0deg,rgba(16,42,54,.6) 0%,rgba(16,42,54,0) 28%)}
}

@media (min-width:861px){
  .page-hero.has-img.side .ph-bg{left:auto;right:0;width:64%;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%);mask-image:linear-gradient(90deg,transparent 0%,#000 30%)}
  .page-hero.has-img.side::after{background:linear-gradient(0deg,rgba(16,42,54,.6) 0%,rgba(16,42,54,0) 28%)}
}

/* reviews */
.kicker{font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:.85rem;color:var(--teal-ink);margin-bottom:16px}
.rv{margin:0;background:#fff;border:1px solid rgba(25,57,72,.12);border-radius:18px;padding:24px 24px 20px;break-inside:avoid;display:flex;flex-direction:column;gap:12px;box-shadow:0 10px 30px rgba(16,42,54,.06)}
.rv .stars{color:#F4B400;letter-spacing:2px;font-size:1.15rem}
.rv blockquote{margin:0;color:var(--navy)}
.rv blockquote p{margin:0 0 .6em;font-size:1.02rem;line-height:1.55}
.rv blockquote p:last-child{margin-bottom:0}
.rv figcaption{display:flex;flex-direction:column;border-top:1px solid rgba(25,57,72,.1);padding-top:12px;margin-top:auto}
.rv figcaption b{font-size:1.02rem;color:var(--navy)}
.rv figcaption span{font-size:.9rem;color:#4A6472}
.rv.big{background:var(--navy);border-color:var(--navy);padding:clamp(26px,4vw,44px);margin-bottom:24px;box-shadow:0 30px 60px rgba(16,42,54,.25)}
.rv.big blockquote p{color:#fff;font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(1.5rem,3.4vw,2.6rem);line-height:1.05}
.rv.big figcaption{border-color:rgba(255,255,255,.16)}.rv.big figcaption b{color:#fff}.rv.big figcaption span{color:var(--teal)}
.rv-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:28px 0 8px;align-items:start}
.rv-wall{columns:3 300px;column-gap:18px}
.rv-wall .rv{margin-bottom:18px}
.rv-feature{background:var(--mist)}
@media (max-width:900px){.rv-row{grid-template-columns:1fr}}
.rv.big.long blockquote p{font-family:var(--body);text-transform:none;font-weight:500;font-size:clamp(1.02rem,1.6vw,1.2rem);line-height:1.6;max-width:72ch}
.rv.big.long blockquote p:first-child{font-family:var(--display);font-weight:800;text-transform:uppercase;font-size:clamp(1.5rem,3vw,2.3rem);line-height:1.05}

/* video */
.video-sec{background:var(--navy-deep)}
.vid{margin:30px 0 0;max-width:1000px}
.vid video{display:block;width:100%;height:auto;aspect-ratio:720/440;border-radius:18px;background:#000;box-shadow:0 30px 70px rgba(0,0,0,.45);border:1px solid rgba(255,255,255,.12)}
.vid figcaption{margin-top:12px;color:#C9D6DF;font-size:.92rem}

/* rewards */
.teal-word{color:var(--teal-ink)}
.rw-calc{margin-top:30px;max-width:760px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:20px;padding:clamp(22px,4vw,36px)}
.rw-calc label{font-weight:700;color:#C9D6DF}
.rw-row{display:flex;align-items:center;gap:20px;margin-top:10px}
.rw-row input{flex:1;accent-color:var(--teal);height:28px}
.rw-row output{font-family:var(--display);font-weight:900;font-size:3rem;line-height:1;min-width:2ch;text-align:right}
.rw-result{margin:16px 0 18px;font-size:1.15rem;color:#E3ECF0}
.rw-result b{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(2.2rem,6vw,3.6rem);color:var(--teal);display:block;line-height:1}
.rw-bar{display:grid;grid-template-columns:repeat(12,1fr);gap:6px}
.rw-bar i{height:16px;border-radius:5px;background:rgba(255,255,255,.12);transition:background .25s}
.rw-bar i.on{background:var(--teal);box-shadow:0 0 12px rgba(36,165,160,.6)}
.nav a,.nav button{white-space:nowrap}
.statement.fit{font-size:clamp(2.4rem,8vw,6.6rem)}

/* home hero video */
.hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 50%;transform-origin:60% 50%;filter:saturate(.85) contrast(1.05)}
.hero.has-vid::after{background:linear-gradient(90deg,rgba(16,42,54,.94) 0%,rgba(16,42,54,.78) 42%,rgba(16,42,54,.30) 100%),linear-gradient(0deg,rgba(16,42,54,.55),transparent 40%)}
@media (max-width:760px){.hero.has-vid::after{background:linear-gradient(0deg,rgba(16,42,54,.95) 10%,rgba(16,42,54,.70) 60%,rgba(16,42,54,.45) 100%)}}

/* theft response flow */
.flow{list-style:none;margin:34px 0 0;padding:0;position:relative;max-width:820px}
.flow::before{content:"";position:absolute;left:19px;top:10px;bottom:10px;width:3px;background:linear-gradient(var(--line,rgba(25,57,72,.15)),var(--teal))}
.flow li{position:relative;padding:0 0 26px 62px}
.flow li::before{content:"";position:absolute;left:8px;top:4px;width:25px;height:25px;border-radius:50%;background:#fff;border:3px solid #A9BAC4}
.flow li.call::before{border-color:var(--teal);background:var(--teal);box-shadow:0 0 0 6px rgba(36,165,160,.18)}
.flow li.end::before{border-color:var(--navy);background:var(--navy)}
.flow .fl-tag{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#4A6472;margin-bottom:4px}
.flow li.call .fl-tag{color:var(--teal-ink)}
.flow h3{font-family:var(--display);text-transform:uppercase;font-size:clamp(1.5rem,3vw,2rem);line-height:1;margin:0 0 6px}
.flow p{margin:0;color:var(--fg2)}
.flow li.call{background:linear-gradient(90deg,rgba(36,165,160,.08),transparent 70%);border-radius:0 14px 14px 0;padding-top:10px;padding-bottom:16px;margin-bottom:10px}
.flow li.call::before{top:14px}
.police-points{display:grid;gap:14px}
.police-points div{border:1px solid rgba(255,255,255,.16);border-left:4px solid var(--teal);border-radius:12px;padding:18px 20px;background:rgba(255,255,255,.04)}
.police-points b{display:block;font-family:var(--display);text-transform:uppercase;font-size:1.6rem;line-height:1;margin-bottom:6px;color:#fff}
.police-points span{color:#C9D6DF}
.page-hero video.ph-bg{filter:brightness(.68) saturate(.9) contrast(1.05)}

/* Tony's Top Revs video review */
.ttr{display:grid;grid-template-columns:minmax(240px,340px) 1fr;gap:clamp(28px,5vw,70px);align-items:center}
.ttr-vid{margin:0}
.ttr-vid video{display:block;width:100%;height:auto;aspect-ratio:9/16;border-radius:22px;background:#000;box-shadow:0 30px 60px rgba(16,42,54,.3);border:4px solid var(--navy)}
.ttr .rv{margin-top:18px}
@media (max-width:760px){.ttr{grid-template-columns:1fr}.ttr-vid{max-width:320px;margin:0 auto}}

/* compact TV band for protection pages */
.tv-compact{padding-block:clamp(40px,6vw,64px)}
.tvc-head{display:grid;grid-template-columns:auto 1fr;gap:10px 30px;align-items:baseline}
.tvc-head .kicker{margin:0;color:var(--teal)}
.tvc-lead{margin:0;color:#E3ECF0;max-width:70ch}
.tv-compact .tv-grid{margin-top:22px;gap:14px}
.tv-compact .show-card{min-height:150px;padding:20px}
.tv-compact .show-card b{font-size:clamp(1.8rem,3vw,2.6rem)}
.tv-compact .show-card .ch{top:16px;left:20px}
.tv-compact .show-card .rec{top:18px}
@media (max-width:900px){.tvc-head{grid-template-columns:1fr}.tv-compact .tv-grid{grid-template-columns:1fr 1fr 1fr}.tv-compact .show-card{min-height:120px;padding:14px}.tv-compact .show-card b{font-size:1.25rem}.tv-compact .show-card .ch{font-size:.62rem;padding:4px 6px;top:10px;left:10px}.tv-compact .show-card .rec{display:none}}
@media (max-width:480px){.tv-compact .show-card b{font-size:clamp(.9rem,4.4vw,1.15rem)}.tv-compact .tv-grid{gap:8px}}

/* socials */
.socials{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,5vw,60px);align-items:center}
.soc-links{display:grid;gap:12px}
.soc{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 24px;border-radius:16px;text-decoration:none;color:#fff;font-weight:600;transition:transform .25s ease,box-shadow .25s ease;box-shadow:0 12px 30px rgba(16,42,54,.15)}
.soc:hover{transform:translateX(6px);box-shadow:0 18px 40px rgba(16,42,54,.25)}
.soc b{font-family:var(--display);font-weight:900;text-transform:uppercase;font-size:clamp(1.5rem,3vw,2rem);line-height:1}
.soc span{opacity:.9}
.soc::after{content:"→";font-size:1.4rem;margin-left:8px}
.soc.tt{background:#111;border-left:6px solid #25F4EE;box-shadow:inset -6px 0 0 #FE2C55,0 12px 30px rgba(16,42,54,.15)}
.soc.ig{background:linear-gradient(100deg,#833AB4,#E1306C 55%,#F77737)}
.soc.fb{background:#1877F2}
@media (max-width:820px){.socials{grid-template-columns:1fr}.soc{padding:16px 18px}}
.soc{justify-content:flex-start}.soc span{margin-left:auto}
