:root{
  --ink:#07111d;
  --ink-2:#0b1a29;
  --ink-3:#12263a;
  --ice:#20b8ff;
  --ice-2:#8ce9ff;
  --ice-soft:#e9f8ff;
  --paper:#f7fafc;
  --white:#ffffff;
  --text:#172533;
  --muted:#617282;
  --line:#d8e4ec;
  --line-dark:rgba(255,255,255,.11);
  --success:#0a8f62;
  --warn:#b5791d;
  --max:1200px;
  --shadow:0 22px 60px rgba(3,18,30,.12);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif;line-height:1.58;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit}
.container{width:min(var(--max),calc(100% - 40px));margin:auto}
.eyebrow{font-size:.78rem;letter-spacing:.17em;text-transform:uppercase;color:#0d8dd0;font-weight:850}
.ice{color:var(--ice)}
.muted{color:var(--muted)}
.small{font-size:.9rem}
.kicker{font-size:1.05rem;color:#415465;max-width:760px}
.topbar{background:#02070c;color:#c7d6e1;border-bottom:1px solid rgba(255,255,255,.06);font-size:.8rem}
.topbar .container{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.topbar strong{color:var(--ice-2)}
.header{position:sticky;top:0;z-index:40;background:rgba(7,17,29,.95);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.brand img{width:248px;height:auto}
.navlinks{display:flex;align-items:center;gap:24px;color:#c7d5de;font-size:.88rem;font-weight:760}
.navlinks a{padding:30px 0 27px;border-bottom:2px solid transparent}
.navlinks a:hover,.navlinks a.active{color:#fff;border-bottom-color:var(--ice)}
.navlinks .nav-cta{padding:11px 16px;border:1px solid rgba(32,184,255,.8);color:#fff;background:rgba(32,184,255,.08)}
.navlinks .nav-cta:hover{background:var(--ice);color:#00111c}
.hamburger{display:none;border:0;background:none;color:#fff;font-size:1.7rem;cursor:pointer}
.hero{background:linear-gradient(135deg,#06111d 0%,#0b1a28 62%,#07131f 100%);color:#fff;position:relative;overflow:hidden;border-bottom:1px solid rgba(32,184,255,.28)}
.hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 32%,rgba(32,184,255,.12),transparent 28%),linear-gradient(110deg,transparent 52%,rgba(255,255,255,.025) 52% 53%,transparent 53%);pointer-events:none}
.hero-grid{position:relative;display:grid;grid-template-columns:1.08fr .92fr;gap:55px;align-items:center;min-height:660px;padding:78px 0}
.hero-copy{position:relative;z-index:2}
.hero h1,.page-hero h1{font-size:clamp(3rem,5.4vw,5.45rem);line-height:.95;letter-spacing:-.048em;margin:12px 0 24px;font-weight:900}
.hero h1 span,.page-hero h1 span{display:block;color:var(--ice)}
.hero p{font-size:1.12rem;color:#c6d4de;max-width:720px;margin:0 0 30px}
.hero-art{position:relative;min-height:500px;display:flex;align-items:center;justify-content:center}
.hero-art img{width:min(100%,720px);filter:drop-shadow(0 30px 55px rgba(0,0,0,.28))}
.hero-fact{position:absolute;right:10px;bottom:36px;background:rgba(5,14,23,.88);border:1px solid rgba(124,223,255,.28);padding:16px 18px;width:285px;color:#d7e3ea}
.hero-fact strong{display:block;color:#fff;margin-bottom:3px}
.btns{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 21px;border:1px solid var(--ice);background:var(--ice);color:#00121e;font-weight:850;letter-spacing:.02em;transition:.2s ease;cursor:pointer}
.btn:hover{transform:translateY(-2px);filter:brightness(1.04)}
.btn.secondary{background:transparent;color:#fff;border-color:rgba(255,255,255,.3)}
.btn.dark{background:var(--ink);border-color:var(--ink);color:#fff}
.btn.ghost{background:transparent;color:var(--ink);border-color:#93a8b8}
.quickbar{background:#fff;border-bottom:1px solid var(--line)}
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.quick{padding:22px 24px;border-right:1px solid var(--line)}
.quick:last-child{border-right:0}
.quick strong{display:block;color:var(--ink);font-size:.93rem;margin-bottom:2px}
.quick span{display:block;color:var(--muted);font-size:.84rem}
.section{padding:88px 0}
.section.dark{background:var(--ink);color:#fff}
.section.soft{background:#eef5f9}
.section.white{background:#fff}
.section-title{max-width:820px;margin-bottom:38px}
.section-title.center{text-align:center;margin-left:auto;margin-right:auto}
.section-title h2{font-size:clamp(2rem,3.9vw,3.6rem);line-height:1.03;letter-spacing:-.036em;margin:8px 0 14px;color:var(--ink)}
.dark .section-title h2{color:#fff}
.section-title p{font-size:1.05rem;color:var(--muted);margin:0}
.dark .section-title p{color:#aec1cf}
.pathways{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.pathway{position:relative;min-height:600px;display:flex;align-items:flex-end;border:1px solid var(--line);overflow:hidden;background:#102132;color:#fff;box-shadow:var(--shadow)}
.pathway .photo{position:absolute;inset:0;background-size:cover;background-position:center;filter:saturate(.72) contrast(1.04)}
.pathway .shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,11,18,.98) 7%,rgba(4,11,18,.77) 52%,rgba(4,11,18,.25))}
.pathway .content{position:relative;width:100%;margin-top:auto;padding:32px;z-index:2}
.automotive-pathway .photo{background-position:center 42%}
.pathway h3{font-size:2.15rem;line-height:1.02;margin:6px 0 10px}
.pathway p{color:#c6d4de;max-width:620px}
.clean-list{list-style:none;padding:0;margin:18px 0 24px;display:grid;gap:8px}
.clean-list.two{grid-template-columns:1fr 1fr;gap:8px 24px}
.clean-list li{position:relative;padding-left:22px;color:inherit}
.clean-list li:before{content:"";position:absolute;left:0;top:.55em;width:9px;height:9px;border:2px solid var(--ice);transform:rotate(45deg)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line);padding:28px;box-shadow:0 12px 38px rgba(4,18,29,.06)}
.dark .card{background:#0b1a28;border-color:var(--line-dark);box-shadow:none}
.card h3{font-size:1.28rem;line-height:1.2;margin:9px 0 9px;color:var(--ink)}
.dark .card h3{color:#fff}
.card p{margin:0;color:var(--muted)}
.dark .card p{color:#adbfcb}
.card .num{display:inline-flex;min-width:42px;height:42px;align-items:center;justify-content:center;border:1px solid #9bdfff;color:#078dcf;font-weight:900}
.problem-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:start}
.problem-menu{display:grid;gap:10px}
.problem-item{background:#fff;border:1px solid var(--line);padding:17px 19px;display:grid;grid-template-columns:34px 1fr;gap:14px}
.problem-item strong{display:block;color:var(--ink)}
.problem-item span{color:var(--muted);font-size:.92rem}
.problem-item b{color:var(--ice);font-size:1.15rem}
.signal{background:var(--ink);color:#fff;border:1px solid rgba(32,184,255,.24);padding:30px}
.signal h3{font-size:1.8rem;margin:0 0 9px}
.signal p{color:#b6c8d3}
.signal-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:20px}
.signal-grid div{border-top:1px solid rgba(255,255,255,.11);padding-top:10px;font-size:.92rem;color:#d2dde4}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;counter-reset:step}
.step{background:#fff;border:1px solid var(--line);padding:24px;min-height:230px}
.dark .step{background:#0b1a28;border-color:var(--line-dark)}
.step:before{counter-increment:step;content:"0" counter(step);display:block;color:var(--ice);font-size:1.7rem;font-weight:900;margin-bottom:22px}
.step h3{font-size:1.12rem;color:var(--ink);margin:0 0 8px}
.dark .step h3{color:#fff}
.step p{color:var(--muted);margin:0;font-size:.94rem}
.dark .step p{color:#adbfcb}
.case-study{display:grid;grid-template-columns:.76fr 1.24fr;gap:32px;align-items:stretch}
.case-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.case-stat{background:var(--ink);color:#fff;border:1px solid rgba(32,184,255,.2);padding:26px}
.case-stat strong{display:block;font-size:2.65rem;line-height:1;color:var(--ice-2);margin-bottom:9px}
.case-stat span{color:#b5c7d2;font-size:.92rem}
.case-copy{background:#fff;border:1px solid var(--line);padding:32px}
.case-copy h3{font-size:2rem;line-height:1.05;margin:6px 0 14px;color:var(--ink)}
.case-copy p{color:var(--muted)}
.case-tag{display:inline-block;background:var(--ice-soft);color:#087fb7;font-weight:800;font-size:.75rem;letter-spacing:.11em;text-transform:uppercase;padding:8px 10px}
.source-link{display:inline-flex;margin-top:8px;color:#087fb7;font-weight:800;border-bottom:1px solid rgba(8,127,183,.35)}
.compare{overflow:auto;background:#fff;border:1px solid var(--line)}
.compare table{width:100%;border-collapse:collapse;min-width:760px}
.compare th,.compare td{padding:17px 19px;border-bottom:1px solid #e3ebf0;text-align:left;vertical-align:top}
.compare th{background:#eaf3f8;color:var(--ink);font-size:.9rem}
.compare td{color:#566a79}
.compare td:first-child{font-weight:800;color:var(--ink)}
.yes{color:var(--success)!important;font-weight:800}
.maybe{color:var(--warn)!important;font-weight:800}
.page-hero{background:linear-gradient(135deg,#07131f,#0d1d2b);color:#fff;padding:92px 0 72px;border-bottom:1px solid rgba(32,184,255,.24)}
.page-hero p{max-width:800px;color:#c0d0da;font-size:1.08rem;margin:0 0 25px}
.page-hero .crumb{color:#84dfff;font-size:.78rem;text-transform:uppercase;letter-spacing:.16em;font-weight:800}
.hero-side{display:grid;grid-template-columns:1.12fr .88fr;gap:45px;align-items:center}
.hero-panel{border:1px solid rgba(32,184,255,.25);background:rgba(255,255,255,.035);padding:26px}
.hero-panel h3{margin:0 0 12px;font-size:1.25rem}
.hero-panel p{font-size:.94rem;margin:0;color:#aec1cc}
.hero-panel .clean-list{margin-bottom:0}
.app-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.app{background:#fff;border:1px solid var(--line);padding:25px}
.app h3{margin:6px 0 8px;color:var(--ink)}
.app p{margin:0;color:var(--muted);font-size:.94rem}
.app .label{font-size:.72rem;color:#0d8dd0;text-transform:uppercase;letter-spacing:.13em;font-weight:850}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}
.quote-prep{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.quote-prep div{background:#fff;border:1px solid var(--line);padding:20px}
.quote-prep strong{display:block;color:var(--ink);margin-bottom:4px}
.quote-prep span{font-size:.88rem;color:var(--muted)}
.notice{border-left:4px solid var(--ice);background:#eaf6fb;padding:16px 18px;color:#3b5666}
.notice strong{color:var(--ink)}
.form-wrap{display:grid;grid-template-columns:.78fr 1.22fr;gap:32px}
.contact-card{background:var(--ink);color:#fff;padding:30px;border:1px solid rgba(32,184,255,.24)}
.contact-card h3{font-size:1.75rem;margin:0 0 10px}
.contact-card p{color:#adc0cc}
.contact-lines{display:grid;gap:18px;margin-top:25px}
.contact-line small{display:block;color:#7f97a7;margin-bottom:2px}
.contact-line a,.contact-line span{font-weight:800}
.form{display:grid;grid-template-columns:1fr 1fr;gap:14px;background:#fff;border:1px solid var(--line);padding:28px}
.field label{display:block;font-weight:770;color:#304657;font-size:.84rem;margin-bottom:7px}
.field input,.field textarea,.field select{width:100%;border:1px solid #cbd8e1;background:#fff;color:var(--text);padding:13px 14px;outline:none}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--ice);box-shadow:0 0 0 3px rgba(32,184,255,.08)}
.field textarea{min-height:150px;resize:vertical}
.form .full{grid-column:1/-1}
.hp{position:absolute!important;left:-9999px!important}
.faq{display:grid;gap:10px}
.faq-item{background:#fff;border:1px solid var(--line)}
.faq-q{width:100%;border:0;background:none;text-align:left;padding:18px 20px;font-weight:850;color:var(--ink);display:flex;justify-content:space-between;gap:18px;cursor:pointer}
.faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease}
.faq-a>div{padding:0 20px 20px;color:var(--muted)}
.faq-item.open .faq-a{max-height:500px}
.faq-item.open .faq-q span:last-child{transform:rotate(45deg)}
.callout{display:flex;justify-content:space-between;gap:28px;align-items:center;background:linear-gradient(105deg,#07131f,#0b2b40);color:#fff;border:1px solid rgba(32,184,255,.28);padding:34px}
.callout h3{font-size:1.85rem;line-height:1.1;margin:4px 0 7px}
.callout p{margin:0;color:#b5c7d2;max-width:740px}
.footer{background:#02070c;color:#c1d0da;border-top:1px solid rgba(255,255,255,.08);padding:54px 0 25px}
.footer-grid{display:grid;grid-template-columns:1.35fr .72fr .72fr 1fr;gap:32px}
.footer .brand img{width:230px}
.footer h4{margin:0 0 11px;color:#fff}
.footer p,.footer a,.footer span{color:#97aab8;font-size:.9rem}
.footer-links{display:grid;gap:7px}
.footer-links a:hover{color:#fff}
.legal{margin-top:34px;padding-top:18px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:18px;color:#728795;font-size:.76rem}
.legal a{font-size:inherit}
@media(max-width:1000px){
  .navlinks{display:none;position:absolute;top:82px;left:0;right:0;background:#07131f;padding:20px;flex-direction:column;align-items:flex-start;border-bottom:1px solid rgba(255,255,255,.08)}
  .navlinks.open{display:flex}.navlinks a{padding:8px 0;border:0}.hamburger{display:block}
  .hero-grid,.hero-side,.problem-grid,.case-study,.two-col,.form-wrap{grid-template-columns:1fr}
  .hero-grid{min-height:auto;padding:68px 0}.hero-art{min-height:390px}.hero-fact{right:0}
  .quick-grid{grid-template-columns:1fr 1fr}.quick:nth-child(2){border-right:0}
  .pathways{grid-template-columns:1fr}.cards,.app-grid{grid-template-columns:1fr 1fr}.process{grid-template-columns:1fr 1fr}.quote-prep{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
  .container{width:min(var(--max),calc(100% - 28px))}.topbar .container{justify-content:center}.topbar .container>span:last-child{display:none}.nav{height:72px}.navlinks{top:72px}.brand img{width:205px}
  .hero h1,.page-hero h1{font-size:3.05rem}.hero-art{min-height:300px}.hero-fact{position:relative;right:auto;bottom:auto;margin-top:-20px;width:100%}.hero-grid{gap:20px}
  .quick-grid,.cards,.app-grid,.process,.quote-prep,.footer-grid,.signal-grid,.case-stats{grid-template-columns:1fr}.quick{border-right:0;border-bottom:1px solid var(--line)}
  .section{padding:68px 0}.clean-list.two{grid-template-columns:1fr}.pathway{min-height:750px}.pathway .content{padding:24px}.pathway h3{font-size:1.8rem}
  .form{grid-template-columns:1fr}.form .full{grid-column:auto}.callout{align-items:flex-start;flex-direction:column}.legal{flex-direction:column}.footer{padding-top:46px}
}


/* --- ICEOLATED interactive experience --- */
.scroll-progress{position:fixed;top:0;left:0;width:100%;height:3px;background:linear-gradient(90deg,var(--ice),var(--ice-2));transform:scaleX(0);transform-origin:left center;z-index:1000;pointer-events:none;will-change:transform}
.header,.nav{transition:height .28s ease,background-color .28s ease,box-shadow .28s ease,border-color .28s ease}
.header.scrolled{background:rgba(5,14,23,.985);box-shadow:0 14px 35px rgba(0,0,0,.18);border-bottom-color:rgba(32,184,255,.18)}
.header.scrolled .nav{height:70px}
.header.scrolled .navlinks a{padding-top:24px;padding-bottom:22px}

.canada-strip{background:#06111d;color:#fff;border-bottom:1px solid rgba(32,184,255,.22)}
.canada-strip-inner{min-height:86px;display:flex;align-items:center;gap:18px}
.canada-mark{width:46px;height:46px;flex:0 0 46px;border:1px solid rgba(140,233,255,.55);display:grid;place-items:center;color:var(--ice-2);font-weight:900;letter-spacing:.08em;background:linear-gradient(135deg,rgba(32,184,255,.12),rgba(255,255,255,.02));box-shadow:inset 0 0 24px rgba(32,184,255,.08)}
.canada-strip strong{display:block;font-size:1rem;letter-spacing:.01em}
.canada-strip span{display:block;color:#9fb4c1;font-size:.88rem;margin-top:2px;max-width:850px}
.canadian-footer{display:inline-flex!important;align-items:center;gap:8px;color:#d3e3ec!important;font-weight:800;letter-spacing:.03em}
.canadian-footer:before{content:"CA";display:inline-grid;place-items:center;width:28px;height:28px;border:1px solid rgba(140,233,255,.45);color:var(--ice-2);font-size:.66rem;font-weight:900}

/* Scroll-reveal system: deliberately restrained for a corporate feel */
.reveal-ready{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.22,.61,.36,1),transform .7s cubic-bezier(.22,.61,.36,1);transition-delay:var(--reveal-delay,0ms);will-change:opacity,transform}
.reveal-ready.reveal-visible{opacity:1;transform:none}
.reveal-left{transform:translateX(-28px)}
.reveal-right{transform:translateX(28px)}
.reveal-left.reveal-visible,.reveal-right.reveal-visible{transform:none}
.section-title:after{content:"";display:block;width:0;height:2px;background:linear-gradient(90deg,var(--ice),transparent);margin-top:18px;transition:width .9s cubic-bezier(.22,.61,.36,1) .12s}
.section-title.reveal-visible:after{width:94px}

/* Refined movement on interactive blocks */
.pathway .photo{transition:transform 1.05s cubic-bezier(.2,.7,.2,1),filter .55s ease}
.pathway:hover .photo{transform:scale(1.045);filter:saturate(.86) contrast(1.07)}
.card,.app,.problem-item,.step,.quote-prep>div,.hero-panel,.case-stat,.case-copy{transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease}
.card:hover,.app:hover,.problem-item:hover,.step:hover,.quote-prep>div:hover{transform:translateY(-5px);box-shadow:0 18px 44px rgba(3,18,30,.10);border-color:#b7dce9}
.dark .step:hover{border-color:rgba(32,184,255,.42);box-shadow:0 18px 44px rgba(0,0,0,.18)}
.hero-panel:hover,.case-stat:hover,.case-copy:hover{transform:translateY(-3px)}

.btn{position:relative;overflow:hidden}
.btn:after{content:"";position:absolute;top:-30%;bottom:-30%;left:-55%;width:38%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.34),transparent);transform:skewX(-18deg);transition:left .55s ease;pointer-events:none}
.btn:hover:after{left:125%}

.hero-art img{will-change:transform;transition:transform .16s linear}
.page-hero{position:relative;overflow:hidden}
.page-hero:after{content:"";position:absolute;width:340px;height:340px;border:1px solid rgba(32,184,255,.12);border-radius:50%;right:-130px;top:-175px;box-shadow:0 0 100px rgba(32,184,255,.06);pointer-events:none}

/* Counter pulse only after the published statistic enters view */
.counter-live{animation:counterGlow .9s ease both}
@keyframes counterGlow{0%{text-shadow:0 0 0 rgba(140,233,255,0)}45%{text-shadow:0 0 28px rgba(140,233,255,.42)}100%{text-shadow:0 0 0 rgba(140,233,255,0)}}

@media(max-width:650px){
  .canada-strip-inner{padding:16px 0;align-items:flex-start}.canada-strip span{font-size:.82rem}
  .header.scrolled .nav{height:64px}.header.scrolled .navlinks{top:64px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}.reveal-ready,.reveal-left,.reveal-right{opacity:1!important;transform:none!important;transition:none!important}.section-title:after{width:94px!important;transition:none!important}.pathway .photo,.card,.app,.problem-item,.step,.quote-prep>div,.hero-panel,.case-stat,.case-copy,.btn,.hero-art img,.header,.nav{transition:none!important}.counter-live{animation:none!important}
}

/* --- V9 real-truck frozen identity --- */
.frostbite-experience::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:900;
  pointer-events:none;
  background:url('../images/frostbite-texture.webp') center top/cover fixed;
  opacity:.042;
  mix-blend-mode:screen;
}
.header::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:3px;
  pointer-events:none;
  opacity:.62;
  background:linear-gradient(90deg,transparent,rgba(207,248,255,.88) 15%,rgba(32,184,255,.72) 50%,rgba(207,248,255,.8) 85%,transparent);
  box-shadow:0 2px 13px rgba(93,214,247,.16);
}
.brand img{transition:filter .26s ease,transform .26s ease}
.brand:hover img{transform:translateY(-1px);filter:drop-shadow(0 8px 16px rgba(68,206,244,.24))}

.hero{
  isolation:isolate;
  min-height:690px;
  background:#040c14;
  border-bottom:1px solid rgba(106,221,251,.52);
}
.hero-vehicle{
  position:absolute;
  z-index:0;
  inset:0;
  background:url('../images/iceolated-real-truck-hero-v22.webp') 58% center/cover no-repeat;
  transform:scale(1.006);
}
.hero::before{
  z-index:1;
  background:
    radial-gradient(360px circle at var(--frost-x,78%) var(--frost-y,34%),rgba(164,234,252,.16),transparent 72%),
    linear-gradient(90deg,rgba(2,8,14,.98) 0%,rgba(3,11,18,.93) 31%,rgba(3,11,18,.74) 46%,rgba(3,11,18,.24) 65%,rgba(2,8,14,.08) 82%,rgba(2,8,14,.17) 100%);
}
.hero::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  opacity:.2;
  background:
    linear-gradient(180deg,rgba(255,255,255,.035),transparent 16%,transparent 86%,rgba(175,234,250,.12)),
    url('../images/frostbite-texture.webp') center/cover;
  mix-blend-mode:screen;
}
.hero-grid{z-index:2;min-height:690px;grid-template-columns:1.03fr .97fr;gap:34px;padding:74px 0 82px}
.hero-copy{max-width:675px;text-shadow:0 3px 24px rgba(0,0,0,.76)}
.hero .eyebrow{color:#84e3fb}
.hero h1{font-size:clamp(3.1rem,5.15vw,5.2rem)}
.hero h1 span{color:#8ce9ff;text-shadow:0 0 26px rgba(44,187,228,.22)}
.hero p{max-width:680px;color:#d1dce3;font-size:1.06rem}
.hero-art{min-height:510px;pointer-events:none}
.hero-fact{
  right:0;
  bottom:25px;
  width:315px;
  padding:16px 18px 17px;
  background:rgba(2,9,15,.82);
  border:1px solid rgba(142,230,253,.42);
  border-left:3px solid var(--ice);
  box-shadow:0 20px 45px rgba(0,0,0,.34);
  backdrop-filter:blur(9px);
}
.hero-fact::before{
  content:"";
  display:inline-block;
  width:7px;
  height:7px;
  margin:0 8px 2px 0;
  border-radius:50%;
  background:#8ce9ff;
  box-shadow:0 0 14px #20b8ff;
}
.hero-fact strong{display:inline;color:#fff}

.enhanced-experience main>section:not(.hero){position:relative;isolation:isolate}
.enhanced-experience main>section:not(.hero)::before{
  content:"";
  position:absolute;
  z-index:5;
  left:0;
  right:0;
  top:0;
  height:7px;
  pointer-events:none;
  opacity:.22;
  background:linear-gradient(180deg,rgba(222,250,255,.82),transparent 78%),repeating-linear-gradient(104deg,transparent 0 27px,rgba(103,213,242,.62) 28px 29px,transparent 30px 55px);
  mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
}
.page-hero{
  background:
    linear-gradient(112deg,rgba(5,15,25,.98),rgba(7,32,47,.92)),
    url('../images/frostbite-texture.webp') center/cover;
  background-blend-mode:normal,screen;
}

.finder-section{
  padding:62px 0;
  overflow:hidden;
  color:#fff;
  background:linear-gradient(110deg,rgba(4,15,25,.985),rgba(7,38,55,.965)),url('../images/frostbite-texture.webp') center/cover;
  background-blend-mode:normal,screen;
  border-bottom:1px solid rgba(130,225,250,.22);
}
.finder-shell{display:grid;grid-template-columns:.86fr .72fr 1fr;gap:32px;align-items:center}
.finder-copy h2{margin:8px 0 12px;font-size:clamp(2.15rem,3.35vw,3.55rem);line-height:.98;letter-spacing:-.035em}
.finder-copy p{margin:0;color:#aebfca;font-size:.92rem}
.finder-controls{display:grid;gap:9px}
.finder-controls button{
  position:relative;
  overflow:hidden;
  min-height:48px;
  padding:0 16px;
  color:#d6e3e9;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(255,255,255,.16);
  text-align:left;
  font-weight:800;
  cursor:pointer;
  transition:border-color .2s ease,background-color .2s ease,color .2s ease,transform .2s ease;
}
.finder-controls button:hover{transform:translateX(4px);border-color:rgba(104,217,247,.66)}
.finder-controls button[aria-pressed="true"]{color:#04131c;background:#83e3fa;border-color:#c6f5ff}
.finder-result{min-height:260px;padding:27px;border:1px solid rgba(118,220,247,.3);border-top:4px solid #49c7ec;background:rgba(2,10,17,.76);box-shadow:0 22px 46px rgba(0,0,0,.24)}
.finder-result>span{color:#82def6;font-size:.72rem;font-weight:850;letter-spacing:.15em;text-transform:uppercase}
.finder-result h3{margin:12px 0 9px;font-size:1.55rem;line-height:1.08}
.finder-result p{min-height:70px;margin:0 0 20px;color:#aec0c9;font-size:.9rem}
.finder-result .btn{width:100%}
.finder-pulse{animation:finderPulse .46s ease}
@keyframes finderPulse{0%{box-shadow:0 0 0 0 rgba(117,221,247,.65)}100%{box-shadow:0 0 0 12px rgba(117,221,247,0)}}

@media(max-width:1000px){
  .hero{min-height:940px}
  .hero-vehicle{background-size:auto 58%;background-position:65% bottom}
  .hero::before{background:linear-gradient(180deg,rgba(2,8,14,.98) 0%,rgba(3,11,18,.95) 40%,rgba(3,11,18,.56) 61%,rgba(3,11,18,.08) 80%,rgba(3,11,18,.15) 100%)}
  .hero-grid{position:relative;min-height:940px;padding:64px 0 370px}
  .hero-copy{max-width:780px}
  .hero-art{position:absolute;left:0;right:0;bottom:0;min-height:355px}
  .hero-fact{bottom:24px}
  .finder-shell{grid-template-columns:1fr 1fr}
  .finder-result{grid-column:1/-1;min-height:0}
  .finder-result p{min-height:0}
}
@media(max-width:650px){
  .frostbite-experience::before{opacity:.032;background-attachment:scroll}
  .brand img{width:212px}
  .hero{min-height:890px}
  .hero-vehicle{background-size:auto 44%;background-position:61% bottom}
  .hero-grid{min-height:890px;padding:52px 0 285px}
  .hero h1{font-size:clamp(2.75rem,13.2vw,3.6rem)}
  .hero p{font-size:.96rem}
  .hero-art{min-height:275px}
  .hero-fact{right:0;bottom:14px;width:100%;margin:0;font-size:.88rem}
  .finder-section{padding:54px 0}
  .finder-shell{grid-template-columns:1fr;gap:22px}
  .finder-result{grid-column:auto;padding:23px}
  .finder-controls button{text-align:center}
  .finder-controls button:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .finder-pulse{animation:none}
}

/* --- V10 unified frozen environment --- */
body.frostbite-experience{
  color:#d9e7ee;
  background-color:#04101a;
  background-image:
    linear-gradient(135deg,rgba(2,10,17,.88),rgba(4,23,36,.83) 52%,rgba(2,12,20,.9)),
    url('../images/frostbite-texture.webp');
  background-position:center,center;
  background-size:cover,cover;
  background-repeat:no-repeat,no-repeat;
  background-attachment:fixed,fixed;
}
.frostbite-experience::before{opacity:.075}

.topbar{background:rgba(1,7,12,.94);backdrop-filter:blur(12px)}
.topbar .container{min-height:44px}
.topbar-brandline{display:inline-flex;align-items:center;gap:10px;white-space:nowrap}
.topbar-leaf{width:34px;height:34px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(96,216,248,.24))}
.topbar-separator{color:rgba(255,255,255,.4);font-weight:400}
.topbar-service{color:#c3d4de;font-size:.76rem;font-weight:760;letter-spacing:.08em;text-transform:uppercase}
.topbar .container>span:last-child{white-space:nowrap}

.nav{height:92px}
.brand{display:inline-flex;align-items:center;flex:0 0 auto}
.brand img{width:294px;height:76px;object-fit:contain;object-position:left center}
.footer .brand img{width:286px;height:auto}
.navlinks a{padding-top:35px;padding-bottom:32px}
.header.scrolled .nav{height:76px}
.header.scrolled .brand img{width:254px;height:64px}
.header.scrolled .navlinks a{padding-top:27px;padding-bottom:24px}

.hero-grid{grid-template-columns:1.08fr .92fr;min-height:735px;padding:62px 0 68px}
.hero-copy{max-width:680px}
.hero-copy .hero-fact{
  position:relative;
  right:auto;
  bottom:auto;
  width:100%;
  max-width:625px;
  margin:23px 0 0;
  padding:12px 15px;
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:start;
  gap:12px;
  color:#bfd0d9;
  background:linear-gradient(90deg,rgba(5,23,35,.66),rgba(5,23,35,.2));
  border:1px solid rgba(132,224,249,.2);
  border-left:2px solid rgba(94,211,242,.82);
  box-shadow:inset 0 1px rgba(255,255,255,.035);
  backdrop-filter:blur(5px);
  text-shadow:none;
  font-size:.8rem;
  line-height:1.45;
}
.hero-copy .hero-fact::before{display:none}
.hero-copy .hero-fact strong{display:block;margin:0;color:#e9f9fd;white-space:nowrap;font-size:.82rem}
.hero-copy .hero-fact span{display:block;color:#aebfca}

.quickbar,
.section.white,
.section.soft,
.section.dark,
.canada-strip,
.finder-section{
  color:#d9e7ee;
  border-color:rgba(142,225,248,.16);
  backdrop-filter:blur(9px) saturate(1.08);
}
.quickbar{background:rgba(5,20,31,.82)}
.section.white{background:rgba(3,14,23,.78)}
.section.soft{background:rgba(7,29,43,.7)}
.section.dark{background:rgba(2,9,15,.85)}
.canada-strip{background:rgba(3,17,27,.88)}
.finder-section{background:linear-gradient(110deg,rgba(3,15,24,.88),rgba(7,38,55,.75))}

.quick{border-color:rgba(152,224,243,.17)}
.quick strong{color:#f3fbfd}
.quick span{color:#a8bdc9}
.section h2,.section-title h2,.problem-grid h2{color:#f2f9fc!important;text-shadow:0 2px 18px rgba(0,0,0,.2)}
.section-title p,.kicker,.section.white>p,.section.soft>p{color:#aec1cc}
.source-link{color:#72d8f4;border-color:rgba(114,216,244,.42)}
.source-link:hover{color:#d6f7ff}

.card,
.app,
.problem-item,
.step,
.case-copy,
.quote-prep>div,
.form,
.faq-item,
.compare,
.notice{
  color:#d6e5ec;
  background:linear-gradient(145deg,rgba(10,31,45,.88),rgba(4,17,27,.8));
  border-color:rgba(137,219,243,.2);
  box-shadow:0 18px 45px rgba(0,0,0,.13),inset 0 1px rgba(255,255,255,.035);
  backdrop-filter:blur(8px);
}
.dark .card,.dark .step{background:linear-gradient(145deg,rgba(10,31,45,.88),rgba(4,17,27,.8));border-color:rgba(137,219,243,.2)}
.card h3,.app h3,.problem-item strong,.step h3,.case-copy h3,.quote-prep strong,.notice strong{color:#f2f9fc}
.card p,.app p,.problem-item span,.step p,.case-copy p,.quote-prep span,.faq-a>div{color:#acbfca}
.card:hover,.app:hover,.problem-item:hover,.step:hover,.quote-prep>div:hover{border-color:rgba(116,218,246,.48);box-shadow:0 20px 48px rgba(0,0,0,.24),inset 0 1px rgba(228,250,255,.08)}
.case-tag{color:#9ee9fb;background:rgba(20,157,203,.13);border:1px solid rgba(94,211,242,.24)}
.compare th{color:#f2f9fc;background:rgba(20,53,70,.92)}
.compare td{color:#b4c7d1;border-color:rgba(143,215,236,.15)}
.compare td:first-child{color:#edf8fb}
.faq-q{color:#eff8fb}
.notice{color:#bbccd5}

.field label{color:#d5e3e9}
.field input,.field textarea,.field select{
  color:#f2f8fb;
  background:rgba(1,9,15,.84);
  border-color:rgba(151,218,237,.28);
  color-scheme:dark;
}
.field input::placeholder,.field textarea::placeholder{color:#7f96a3}
.field input:focus,.field textarea:focus,.field select:focus{border-color:#67d4f2;box-shadow:0 0 0 3px rgba(32,184,255,.12)}

.canada-strip-inner{min-height:96px}
.canada-mark{width:58px;height:58px;flex:0 0 58px;border:0;background:none;box-shadow:none}
.canada-mark img{width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(91,211,243,.2))}
.canada-strip strong{color:#f4fbfd;font-size:1.05rem}
.canada-strip span{color:#aec2cc}
.canadian-footer{gap:10px;color:#dcebf1!important}
.canadian-footer::before{content:none;display:none}
.canadian-footer img{width:38px;height:38px;object-fit:contain;flex:0 0 38px;filter:drop-shadow(0 0 10px rgba(91,211,243,.18))}
.footer{background:rgba(1,7,12,.94);backdrop-filter:blur(12px)}

@media(max-width:1000px){
  .nav{height:84px}
  .navlinks{top:84px}
  .brand img{width:268px;height:70px}
  .hero-grid{min-height:1010px;padding:58px 0 390px}
  .hero-copy .hero-fact{max-width:720px}
}
@media(max-width:650px){
  body.frostbite-experience{background-attachment:scroll,scroll;background-position:center top,center top}
  .topbar .container{min-height:42px}
  .topbar-brandline{gap:7px;font-size:.68rem;letter-spacing:0}
  .topbar-leaf{width:30px;height:30px}
  .topbar-separator,.topbar .container>span:last-child{display:none}
  .nav{height:76px}
  .navlinks{top:76px}
  .brand img{width:222px;height:60px}
  .header.scrolled .nav{height:70px}
  .header.scrolled .brand img{width:210px;height:56px}
  .hero-grid{min-height:970px;padding:48px 0 315px}
  .hero-copy .hero-fact{grid-template-columns:1fr;gap:3px;margin-top:18px;padding:11px 13px}
  .canada-strip-inner{align-items:center}
  .canada-mark{width:48px;height:48px;flex-basis:48px}
  .canada-mark img{width:48px;height:48px}
}

/* --- V11 content and form refinements; approved visual theme remains unchanged --- */
.topbar-contact{display:inline-flex;align-items:center;gap:8px}
.topbar-instagram{display:inline-flex;align-items:center;justify-content:center;line-height:0}
.topbar-instagram svg{display:block}
.contact-brand{margin-bottom:12px}
.contact-brand img{width:min(100%,240px);height:auto}
.field-help{display:block;margin-top:8px;font-size:.8rem;line-height:1.5;opacity:.82}

/* --- V13 responsive hardening: phone + tablet optimization --- */
html,body{max-width:100%;overflow-x:hidden}
body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
a,button,.btn,.hamburger,.faq-q,.finder-controls button{touch-action:manipulation}
.footer a,.footer span,.contact-line a,.contact-line span,.source-link{overflow-wrap:anywhere}

/* Keep below-the-fold rendering lighter on mobile/tablet without changing layout. */
@supports(content-visibility:auto){
  main>section:not(:first-child){content-visibility:auto;contain-intrinsic-size:auto 760px}
}

@media(max-width:1000px){
  /* Mobile/tablet navigation becomes a usable touch panel rather than a compressed desktop nav. */
  .hamburger{
    display:inline-grid;
    place-items:center;
    flex:0 0 48px;
    width:48px;
    height:48px;
    min-width:48px;
    padding:0;
    border:1px solid rgba(140,233,255,.22);
    border-radius:4px;
    background:rgba(255,255,255,.025);
    line-height:1;
  }
  .hamburger:focus-visible,.navlinks a:focus-visible,.btn:focus-visible,.faq-q:focus-visible,.finder-controls button:focus-visible{
    outline:3px solid rgba(140,233,255,.72);
    outline-offset:3px;
  }
  .navlinks{
    z-index:50;
    gap:0;
    padding:10px max(20px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));
    max-height:calc(100dvh - 84px);
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    background:rgba(3,13,22,.985);
    box-shadow:0 24px 45px rgba(0,0,0,.36);
    backdrop-filter:blur(18px);
  }
  .navlinks a{
    width:100%;
    min-height:48px;
    display:flex;
    align-items:center;
    padding:0 8px;
    border-bottom:1px solid rgba(255,255,255,.075);
  }
  .navlinks a.active{color:#fff;border-bottom-color:rgba(140,233,255,.38)}
  .navlinks .nav-cta{
    justify-content:center;
    min-height:50px;
    margin-top:10px;
    padding:0 16px;
    border:1px solid rgba(32,184,255,.8);
  }
  body.menu-open{overflow:hidden}

  /* Tablet hierarchy and spacing. */
  .container{width:min(var(--max),calc(100% - 48px))}
  .section{padding:76px 0}
  .page-hero{padding:72px 0 62px}
  .page-hero h1{font-size:clamp(2.8rem,7.4vw,4.45rem);max-width:900px}
  .hero-side{gap:28px}
  .hero-panel{padding:24px}
  .cards,.app-grid{gap:16px}
  .pathway{min-height:620px}
  .pathway .content{padding:28px}
  .form-wrap{gap:24px}
  .contact-card,.form{padding:26px}
  .compare{-webkit-overflow-scrolling:touch;overscroll-behavior-inline:contain}
  .compare table{min-width:700px}

  /* Homepage hero: reserve less dead vertical space while keeping the approved truck scene prominent. */
  .hero{min-height:900px}
  .hero-grid{min-height:900px;padding:54px 0 345px}
  .hero-vehicle{background-size:auto 55%;background-position:66% bottom}
  .hero-art{min-height:325px}
}

@media(min-width:651px) and (max-width:1000px){
  .topbar .container{gap:16px}
  .topbar-service{font-size:.72rem;letter-spacing:.06em}
  .hero-copy{max-width:760px}
  .quick{padding:20px}
  .footer-grid{gap:28px 36px}
  .callout{padding:30px}
  .quote-prep{gap:12px}
}

@media(max-width:650px){
  /* Preserve the approved service line plus phone/Instagram on phones. */
  .topbar .container{
    min-height:40px;
    justify-content:space-between;
    gap:8px;
    width:calc(100% - 24px);
  }
  .topbar-brandline{min-width:0;gap:0}
  .topbar-service{
    display:block;
    max-width:185px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:.62rem;
    letter-spacing:.045em;
  }
  .topbar .container>span:last-child,.topbar-contact{display:inline-flex!important}
  .topbar-contact{flex:0 0 auto;gap:6px;font-size:.72rem}
  .topbar-contact>span[aria-hidden="true"]{display:none}
  .topbar-instagram{width:30px;height:30px}
  .topbar-instagram svg{width:19px;height:19px}

  .container{width:calc(100% - 28px)}
  .nav{height:72px;gap:12px}
  .navlinks{top:72px;max-height:calc(100dvh - 72px)}
  .brand img{width:min(205px,58vw);height:56px}
  .header.scrolled .nav{height:66px}
  .header.scrolled .brand img{width:min(196px,56vw);height:52px}
  .header.scrolled .navlinks{top:66px;max-height:calc(100dvh - 66px)}
  .hamburger{width:46px;height:46px;min-width:46px;flex-basis:46px;font-size:1.55rem}

  .section{padding:58px 0}
  .section-title{margin-bottom:30px}
  .section-title h2{font-size:clamp(1.95rem,9.2vw,2.75rem);line-height:1.04}
  .section-title p,.kicker{font-size:.98rem}
  .page-hero{padding:56px 0 48px}
  .page-hero h1{font-size:clamp(2.35rem,11.2vw,3rem);line-height:.98;margin:10px 0 19px}
  .page-hero p{font-size:.98rem;line-height:1.55}
  .page-hero .crumb,.eyebrow{letter-spacing:.12em}
  .hero-side{gap:24px}
  .hero-panel{padding:20px}
  .hero-panel .clean-list{gap:9px}

  /* Homepage hero uses the full phone width efficiently while protecting truck/copy separation. */
  .hero{min-height:840px}
  .hero-grid{min-height:840px;gap:0;padding:40px 0 285px}
  .hero-copy{max-width:none}
  .hero h1{font-size:clamp(2.55rem,12.4vw,3.35rem);line-height:.96;margin:10px 0 20px}
  .hero p{font-size:.94rem;line-height:1.54;margin-bottom:22px}
  .hero-copy .hero-fact{margin-top:16px;padding:11px 12px;font-size:.77rem;line-height:1.42}
  .hero-copy .hero-fact strong{white-space:normal;font-size:.79rem}
  .hero-vehicle{background-size:auto 42%;background-position:68% bottom}
  .hero-art{min-height:250px}

  .btns{gap:10px}
  .btn{min-height:50px;padding:0 17px}
  .hero .btns .btn,.page-hero .btns .btn{flex:1 1 100%;width:100%}
  .callout .btn,.callout .btns,.callout .btns .btn{width:100%}

  .quick{padding:18px 4px}
  .quick:last-child{border-bottom:0}
  .pathway{min-height:720px}
  .pathway .content{padding:22px 20px}
  .pathway h3{font-size:1.72rem}
  .pathway p{font-size:.94rem}
  .clean-list{gap:7px}
  .clean-list li{padding-left:20px;font-size:.94rem}

  .card,.app,.step,.problem-item,.case-copy,.case-stat,.quote-prep>div{padding:21px}
  .problem-item{grid-template-columns:30px 1fr;gap:11px}
  .signal{padding:23px}
  .signal h3{font-size:1.55rem}
  .case-stat strong{font-size:2.25rem}
  .case-copy h3{font-size:1.7rem}

  .form-wrap{gap:18px}
  .contact-card,.form{padding:21px}
  .contact-card h3{font-size:1.55rem}
  .contact-lines{gap:15px;margin-top:20px}
  .field input,.field textarea,.field select{min-height:48px;padding:12px;font-size:16px}
  .field textarea{min-height:145px}
  .field input[type="file"]{height:auto;min-height:52px;padding:10px 8px}
  .form .btn{width:100%}
  .field-help{font-size:.78rem}

  .compare{margin-left:-2px;margin-right:-2px;border-radius:0}
  .compare table{min-width:620px}
  .compare th,.compare td{padding:13px 14px;font-size:.88rem}

  .quote-prep{gap:10px}
  .callout{padding:24px 21px;gap:20px}
  .callout h3{font-size:1.55rem}
  .footer{padding:42px 0 22px}
  .footer-grid{gap:27px}
  .footer .brand img{width:min(250px,78vw)}
  .legal{margin-top:28px;gap:10px}
  .canadian-footer{align-items:flex-start}
  .canadian-footer img{width:34px;height:34px;flex-basis:34px}

  /* Hover-only movement should not fire on touch screens. */
  .pathway:hover .photo{transform:none}
  .card:hover,.app:hover,.problem-item:hover,.step:hover,.quote-prep>div:hover,.hero-panel:hover,.case-stat:hover,.case-copy:hover,.btn:hover{transform:none}
}

@media(max-width:380px){
  .topbar-service{max-width:145px;font-size:.59rem}
  .topbar-contact{font-size:.68rem}
  .container{width:calc(100% - 24px)}
  .brand img{width:min(185px,57vw)}
  .hero{min-height:850px}
  .hero-grid{min-height:850px;padding-top:36px}
  .hero h1{font-size:clamp(2.35rem,12.2vw,2.95rem)}
  .hero-vehicle{background-position:70% bottom}
  .pathway{min-height:745px}
  .contact-card,.form{padding:18px}
}

@media(orientation:landscape) and (max-height:520px) and (max-width:1000px){
  .navlinks{max-height:calc(100dvh - 66px)}
  .hero{min-height:720px}
  .hero-grid{min-height:720px;padding-bottom:245px}
  .hero-vehicle{background-size:auto 48%}
}


/* --- V14 hero composition refinement: keep the full truck + trailer composition readable on tablet and phone --- */
@media(max-width:1000px){
  .hero{min-height:920px}
  .hero-grid{min-height:920px;padding:56px 0 360px}
  .hero-vehicle{
    background-size:108% auto;
    background-position:64% 100%;
    transform:none;
  }
}

@media(max-width:650px){
  .hero{min-height:860px}
  .hero-grid{min-height:860px;padding:40px 0 300px}
  .hero-vehicle{
    background-size:116% auto;
    background-position:60% 100%;
  }
}

@media(max-width:480px){
  .hero{min-height:870px}
  .hero-grid{min-height:870px;padding:38px 0 318px}
  .hero-vehicle{
    background-size:112% auto;
    background-position:58% 100%;
  }
}

@media(max-width:380px){
  .hero-grid{min-height:870px;padding-bottom:326px}
  .hero-vehicle{
    background-size:118% auto;
    background-position:57% 100%;
  }
}

/* --- V16 background refinement: V12 frost treatment restored exactly; V14 hero framing preserved. --- */


/* --- V17 frost visibility + composition polish: lighter frozen backdrop, maple-leaf texture emphasis, remove distracting shard prominence, and nudge truck left. --- */
body.frostbite-experience{
  background-image:
    linear-gradient(135deg,rgba(2,10,17,.72),rgba(4,23,36,.66) 52%,rgba(2,12,20,.76)),
    url('../images/frostbite-texture.webp');
  background-position:64% top,64% top;
}

.frostbite-experience::before{
  background-position:64% top;
  opacity:.088;
}

.quickbar,
.section.white,
.section.soft,
.section.dark,
.canada-strip,
.finder-section{
  backdrop-filter:blur(9px) saturate(1.06);
}
.quickbar{background:rgba(5,20,31,.66)}
.section.white{background:rgba(3,14,23,.58)}
.section.soft{background:rgba(7,29,43,.50)}
.section.dark{background:rgba(2,9,15,.66)}
.canada-strip{background:rgba(3,17,27,.70)}
.finder-section{background:linear-gradient(110deg,rgba(4,15,25,.78),rgba(7,38,55,.62)),url('../images/frostbite-texture.webp') 64% top/cover}
.page-hero{background:linear-gradient(112deg,rgba(5,15,25,.86),rgba(7,32,47,.76)),url('../images/frostbite-texture.webp') 64% top/cover}

/* Keep desktop/laptop hero optimized, but shift the truck scene slightly left in-frame. */
.hero-vehicle{background-position:60% center}

@media(max-width:1000px){
  body.frostbite-experience{background-position:66% top,66% top}
  .frostbite-experience::before{background-position:66% top;opacity:.082}
  .quickbar{background:rgba(5,20,31,.68)}
  .section.white{background:rgba(3,14,23,.60)}
  .section.soft{background:rgba(7,29,43,.52)}
  .section.dark{background:rgba(2,9,15,.68)}
  .canada-strip{background:rgba(3,17,27,.72)}
  .finder-section{background:linear-gradient(110deg,rgba(4,15,25,.80),rgba(7,38,55,.64)),url('../images/frostbite-texture.webp') 66% top/cover}
  .page-hero{background:linear-gradient(112deg,rgba(5,15,25,.88),rgba(7,32,47,.78)),url('../images/frostbite-texture.webp') 66% top/cover}
  .hero-vehicle{background-position:65% 100%}
}

@media(max-width:650px){
  body.frostbite-experience{
    background-attachment:scroll,scroll;
    background-position:70% top,70% top;
  }
  .frostbite-experience::before{
    background-attachment:scroll;
    background-position:70% top;
    opacity:.072;
  }
  .quickbar{background:rgba(5,20,31,.70)}
  .section.white{background:rgba(3,14,23,.62)}
  .section.soft{background:rgba(7,29,43,.54)}
  .section.dark{background:rgba(2,9,15,.70)}
  .canada-strip{background:rgba(3,17,27,.74)}
  .finder-section{background:linear-gradient(110deg,rgba(4,15,25,.82),rgba(7,38,55,.66)),url('../images/frostbite-texture.webp') 70% top/cover}
  .page-hero{background:linear-gradient(112deg,rgba(5,15,25,.90),rgba(7,32,47,.80)),url('../images/frostbite-texture.webp') 70% top/cover}
  .hero-vehicle{background-position:62% 100%}
}

@media(max-width:480px){
  .hero-vehicle{background-position:60% 100%}
}

@media(max-width:380px){
  .hero-vehicle{background-position:59% 100%}
}

/* --- V18 final content, visibility and responsive refinements --- */
.hero-vehicle{
  background-image:url('../images/iceolated-real-truck-hero-v22.webp');
  background-position:center center;
  transform:none;
}
.hero::before{
  background:
    radial-gradient(360px circle at var(--frost-x,78%) var(--frost-y,34%),rgba(164,234,252,.16),transparent 72%),
    linear-gradient(90deg,rgba(2,8,14,.94) 0%,rgba(3,11,18,.88) 28%,rgba(3,11,18,.62) 43%,rgba(3,11,18,.18) 62%,rgba(2,8,14,.03) 82%,rgba(2,8,14,.1) 100%);
}
.hero::after{opacity:.12}
.hero-copy{max-width:650px}
.hero p{max-width:650px}
.quick-grid{grid-template-columns:repeat(3,1fr)}
.quick{border-bottom:1px solid rgba(152,224,243,.17)}
.quick:nth-child(3n){border-right:0}
.quick:nth-last-child(-n+3){border-bottom:0}

body.frostbite-experience{
  background-image:
    linear-gradient(135deg,rgba(2,10,17,.49),rgba(4,23,36,.39) 52%,rgba(2,12,20,.52)),
    url('../images/frostbite-texture.webp');
}
.frostbite-experience::before{opacity:.12}
.quickbar{background:rgba(5,20,31,.54)}
.section.white{background:rgba(3,14,23,.44)}
.section.soft{background:rgba(7,29,43,.38)}
.section.dark{background:rgba(2,9,15,.53)}
.page-hero{
  background:linear-gradient(112deg,rgba(5,15,25,.69),rgba(7,32,47,.55)),url('../images/frostbite-texture.webp') 64% top/cover;
}
.table-note{margin:18px 0 0;color:#a9bdc8;font-size:.86rem;line-height:1.55}

.evidence-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.evidence-card{
  display:flex;
  flex-direction:column;
  min-height:100%;
  padding:27px;
  color:#d7e6ed;
  background:linear-gradient(145deg,rgba(10,31,45,.9),rgba(4,17,27,.83));
  border:1px solid rgba(137,219,243,.22);
  box-shadow:0 18px 45px rgba(0,0,0,.14),inset 0 1px rgba(255,255,255,.04);
  backdrop-filter:blur(8px);
}
.evidence-card>strong{display:block;margin:18px 0 10px;color:var(--ice-2);font-size:1.75rem;line-height:1.08}
.evidence-card .evidence-kicker{display:block;margin-bottom:13px;color:var(--ice-2);font-size:.72rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.evidence-card h3{margin:0 0 11px;color:#f4fbfd;font-size:1.22rem;line-height:1.18}
.evidence-card p{margin:0 0 16px;color:#afc2cc}
.evidence-card .source-link{margin-top:auto;align-self:flex-start}

.temperature-card,.founder-panel{
  padding:32px;
  color:#dbeaf0;
  background:linear-gradient(145deg,rgba(8,28,42,.94),rgba(3,15,25,.87));
  border:1px solid rgba(111,215,244,.3);
  box-shadow:0 20px 50px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.045);
  backdrop-filter:blur(9px);
}
.temperature-card span{display:block;color:#9db4c0;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-weight:850}
.temperature-card strong{display:block;margin:10px 0 2px;color:var(--ice-2);font-size:clamp(3rem,6vw,5.5rem);line-height:.94}
.temperature-card b{display:block;color:#fff;font-size:1.4rem}
.temperature-card p,.founder-panel p{color:#b4c6d0}
.founder-panel h3{margin:8px 0 12px;color:#fff;font-size:2rem;line-height:1.06}

.equipment-flow{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.flow-arrow{display:none}
.flow-node{
  position:relative;
  min-height:175px;
  padding:24px;
  color:#dceaf0;
  background:linear-gradient(145deg,rgba(10,31,45,.9),rgba(4,17,27,.83));
  border:1px solid rgba(137,219,243,.22);
}
.flow-node small{display:grid;place-items:center;width:34px;height:34px;margin-bottom:18px;border:1px solid rgba(140,233,255,.5);color:var(--ice-2);font-weight:900}
.flow-node strong{display:block;color:#fff;font-size:1.08rem;margin-bottom:7px}
.flow-node span{display:block;color:#afc2cc;font-size:.9rem;line-height:1.48}

.control-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.control-grid>div{
  padding:22px;
  background:linear-gradient(145deg,rgba(10,31,45,.86),rgba(4,17,27,.78));
  border:1px solid rgba(137,219,243,.2);
}
.control-grid strong{display:block;color:#f2fbfd;margin-bottom:4px}
.control-grid span{display:block;color:#aec2cc;font-size:.9rem}

.project-sequence,.safety-grid,.principles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.project-sequence>article,.safety-grid>article,.principles-grid>article{
  padding:25px;
  background:linear-gradient(145deg,rgba(10,31,45,.88),rgba(4,17,27,.8));
  border:1px solid rgba(137,219,243,.21);
  box-shadow:0 16px 38px rgba(0,0,0,.12),inset 0 1px rgba(255,255,255,.035);
}
.project-sequence b,.principles-grid span{display:block;color:var(--ice-2);font-size:1.35rem;margin-bottom:15px}
.project-sequence h3,.safety-grid h3,.principles-grid h3{margin:0 0 9px;color:#f3fbfd;font-size:1.22rem;line-height:1.18}
.project-sequence p,.safety-grid p,.principles-grid p{margin:0;color:#afc2cc;font-size:.92rem}

.contact-instagram{display:inline-grid!important;place-items:center;width:42px;height:42px;color:var(--ice-2);border:1px solid rgba(140,233,255,.42)}
.contact-instagram:hover{color:#fff;border-color:var(--ice)}
#quote-form{scroll-margin-top:100px}
.upload-summary{margin-top:9px;padding:10px 12px;background:rgba(3,15,24,.64);border:1px solid rgba(139,218,239,.18);color:#9fb4bf;font-size:.78rem;line-height:1.45;overflow-wrap:anywhere}
.upload-summary.invalid{color:#ffd4d4;border-color:rgba(255,112,112,.65);background:rgba(104,12,12,.22)}
.field input.invalid,.field textarea.invalid,.field select.invalid{border-color:#ff7777;box-shadow:0 0 0 3px rgba(255,75,75,.12)}
.form-privacy p{margin:2px 0 0;color:#9fb4bf;font-size:.8rem;line-height:1.5}
.form-privacy a{color:#8ce9ff;text-decoration:underline;text-underline-offset:3px}

@media(max-width:1000px){
  .quick-grid{grid-template-columns:repeat(2,1fr)}
  .quick:nth-child(3n){border-right:1px solid rgba(152,224,243,.17)}
  .quick:nth-child(2n){border-right:0}
  .quick:nth-last-child(-n+3){border-bottom:1px solid rgba(152,224,243,.17)}
  .quick:nth-last-child(-n+2){border-bottom:0}
  .evidence-grid,.equipment-flow,.control-grid,.project-sequence,.safety-grid,.principles-grid{grid-template-columns:repeat(2,1fr)}
  .hero-vehicle{background-size:118% auto;background-position:100% 100%}
  .quickbar{background:rgba(5,20,31,.56)}
  .section.white{background:rgba(3,14,23,.46)}
  .section.soft{background:rgba(7,29,43,.4)}
  .section.dark{background:rgba(2,9,15,.56)}
  .page-hero{background:linear-gradient(112deg,rgba(5,15,25,.72),rgba(7,32,47,.58)),url('../images/frostbite-texture.webp') 66% top/cover}
}

@media(max-width:650px){
  body.frostbite-experience{
    background-image:linear-gradient(135deg,rgba(2,10,17,.52),rgba(4,23,36,.43) 52%,rgba(2,12,20,.55)),url('../images/frostbite-texture.webp');
  }
  .quick-grid,.evidence-grid,.equipment-flow,.control-grid,.project-sequence,.safety-grid,.principles-grid{grid-template-columns:1fr}
  .quick,.quick:nth-child(2n),.quick:nth-child(3n),.quick:nth-last-child(-n+2),.quick:nth-last-child(-n+3){border-right:0;border-bottom:1px solid rgba(152,224,243,.17)}
  .quick:last-child{border-bottom:0}
  .hero-grid{padding-bottom:330px}
  .hero-vehicle{background-size:138% auto;background-position:100% 100%}
  .hero-copy{max-width:none}
  .hero p{max-width:none}
  .quickbar{background:rgba(5,20,31,.58)}
  .section.white{background:rgba(3,14,23,.48)}
  .section.soft{background:rgba(7,29,43,.42)}
  .section.dark{background:rgba(2,9,15,.58)}
  .page-hero{background:linear-gradient(112deg,rgba(5,15,25,.75),rgba(7,32,47,.61)),url('../images/frostbite-texture.webp') 70% top/cover}
  .temperature-card,.founder-panel{padding:24px}
  .evidence-card,.flow-node,.control-grid>div,.project-sequence>article,.safety-grid>article,.principles-grid>article{padding:21px}
  .flow-node{min-height:0}
}

@media(max-width:380px){
  .hero-grid{padding-bottom:318px}
  .hero-vehicle{background-size:145% auto;background-position:100% 100%}
}

/* --- V20 plain-language decision tables and quote feedback (hero superseded by V22) --- */
.hero-vehicle{
  background-image:url('../images/iceolated-real-truck-hero-v22.webp');
  background-position:center 60%;
  background-size:cover;
  background-repeat:no-repeat;
}

.problem-tag{
  display:block;
  margin:0 0 3px;
  color:#79ddf7;
  font-size:.66rem;
  font-weight:850;
  letter-spacing:.1em;
  line-height:1.3;
  text-transform:uppercase;
}

.table-guide{
  margin:0 0 15px;
  padding:14px 16px;
  color:#b9ccd5;
  background:linear-gradient(110deg,rgba(7,29,43,.9),rgba(4,18,28,.78));
  border:1px solid rgba(137,219,243,.24);
  border-left:3px solid var(--ice);
  font-size:.9rem;
  line-height:1.55;
}
.table-guide strong{color:#f2f9fc}

.quote-confirmation{
  margin:0 0 22px;
  padding:18px 19px;
  color:#c4d6de;
  background:linear-gradient(120deg,rgba(7,33,47,.95),rgba(3,17,27,.9));
  border:1px solid rgba(133,225,249,.38);
  border-left:4px solid var(--ice);
  box-shadow:0 16px 38px rgba(0,0,0,.17);
  outline:none;
}
.quote-confirmation strong,.quote-confirmation span{display:block}
.quote-confirmation strong{margin-bottom:5px;color:#f4fbfd;font-size:1.08rem}
.quote-confirmation span{line-height:1.55}
.quote-confirmation.success{border-left-color:#74ddf6}
.quote-confirmation.error{border-color:rgba(255,132,132,.38);border-left-color:#ff8484;background:linear-gradient(120deg,rgba(66,20,25,.75),rgba(20,14,21,.88))}
.quote-confirmation:focus-visible{box-shadow:0 0 0 3px rgba(76,208,242,.2),0 16px 38px rgba(0,0,0,.17)}

.photo-pickers input[type="file"]{width:100%}
.upload-actions{display:flex;justify-content:flex-end;margin-top:9px}
.upload-clear{
  padding:7px 10px;
  color:#aeeeff;
  background:rgba(4,20,31,.72);
  border:1px solid rgba(137,219,243,.3);
  font:inherit;
  font-size:.76rem;
  font-weight:750;
  cursor:pointer;
}
.upload-clear:hover,.upload-clear:focus-visible{color:#fff;border-color:var(--ice);outline:none}

@media(max-width:1000px){
  .hero-vehicle{
    background-image:url('../images/iceolated-real-truck-hero-v22.webp'),url('../images/frostbite-texture.webp');
    background-size:auto 70%,cover;
    background-position:60% 100%,center;
    background-repeat:no-repeat;
  }
}

@media(max-width:650px){
  .hero-vehicle{
    background-image:url('../images/iceolated-real-truck-hero-v22.webp'),url('../images/frostbite-texture.webp');
    background-size:100% auto,cover;
    background-position:center bottom,center;
    background-repeat:no-repeat;
  }
  .table-guide{font-size:.84rem}
  .decision-compare{overflow:visible;border:0;background:transparent}
  .decision-table,.decision-table tbody,.decision-table tr,.decision-table td{display:block;width:100%}
  .decision-table{min-width:0!important;border-collapse:separate}
  .decision-table thead{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
  .decision-table tbody{display:grid;gap:14px}
  .decision-table tr{
    overflow:hidden;
    background:linear-gradient(145deg,rgba(9,31,45,.92),rgba(4,17,27,.86));
    border:1px solid rgba(137,219,243,.24);
    box-shadow:0 12px 28px rgba(0,0,0,.12);
  }
  .decision-table td{
    padding:13px 15px!important;
    border-bottom:1px solid rgba(143,215,236,.15)!important;
    font-size:.88rem!important;
  }
  .decision-table td:last-child{border-bottom:0!important}
  .decision-table td::before{
    content:attr(data-label);
    display:block;
    margin-bottom:4px;
    color:#7bddf5;
    font-size:.64rem;
    font-weight:850;
    letter-spacing:.09em;
    line-height:1.25;
    text-transform:uppercase;
  }
  .decision-table td:first-child{color:#f5fbfd;font-size:.98rem!important}
  .quote-confirmation{padding:16px}
  .hero-vehicle{background-position:center bottom,center}
}

/* --- V20 clarity, confirmation and responsive hero refinements --- */
.signal-grid strong{display:block;margin-bottom:4px;color:#f5fbfd;font-size:.94rem}
.limitation-grid div{color:#aebfca;line-height:1.48}

.submission-reference{
  display:block;
  margin-top:9px;
  color:#8fa9b6;
  font-size:.7rem;
  font-weight:750;
  letter-spacing:.055em;
  line-height:1.35;
  text-transform:uppercase;
}

.btn.quote-submit{
  background:linear-gradient(100deg,#22baff,#8ce9ff);
  border-color:#bff4ff;
  color:#02131d;
  box-shadow:0 0 0 1px rgba(140,233,255,.18),0 13px 34px rgba(22,181,233,.28);
}
.btn.quote-submit:hover{filter:brightness(1.08);box-shadow:0 0 0 1px rgba(198,246,255,.42),0 16px 38px rgba(22,181,233,.36)}

.decision-table th:first-child{width:31%}
.decision-table th:nth-child(2){width:23%}
.decision-table td:nth-child(2){color:#edf8fb;font-weight:800}

@media(max-width:650px){
  .submission-reference{font-size:.66rem}
  .limitation-grid{gap:12px}
  .btn.quote-submit{min-height:54px;font-size:1rem}
}

/* --- V22 one-scene responsive hero, automotive surface-rust guidance and balanced About foundations --- */
.hero-vehicle{
  background-image:url('../images/iceolated-real-truck-hero-v22.webp');
  background-size:cover;
  background-position:center 58%;
  background-repeat:no-repeat;
}

.automotive-foundation strong{color:#f3fbfd}
.rust-guide{margin-top:24px}
.rust-guide .eyebrow{margin-bottom:8px;color:#77ddf7}
.rust-guide-grid{grid-template-columns:repeat(4,1fr)}
.rust-guide-grid div{line-height:1.5}
.rust-guide .rust-note{margin:18px 0 12px;color:#aebfca;font-size:.86rem}
.rust-guide .source-link{display:inline-flex;margin-top:1px}

@media(max-width:1000px){
  .hero-vehicle{
    background-image:url('../images/iceolated-real-truck-hero-v22.webp'),url('../images/frostbite-texture.webp');
    background-size:115% auto,cover;
    background-position:center bottom,center;
    background-repeat:no-repeat;
  }
  .rust-guide-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:650px){
  .hero-vehicle{
    background-image:url('../images/iceolated-real-truck-hero-v22.webp'),url('../images/frostbite-texture.webp');
    background-size:112% auto,cover;
    background-position:center bottom,center;
    background-repeat:no-repeat;
  }
  .rust-guide{margin-top:18px}
  .rust-guide-grid{grid-template-columns:1fr}
}

@media(max-width:380px){
  .hero-vehicle{background-size:116% auto,cover}
}
