/* ORAFON — Industrial premium styles */
:root{
  --bg:#F7F9FC;--surface:#FFFFFF;
  --primary:#2F3192;--primary-rgb:47,49,146;--primary-dark:#23256F;--secondary:#4A4DC4;--secondary-rgb:74,77,196;
  --accent:#2A9FD8;--accent-rgb:42,159,216;--accent-soft:#E5F3FB;
  --primary-soft:#EDEEF9;--text:#1B1D5C;--text-muted:#55588A;--success:#10B981;
  --panel:#F2F2FA;--grid-line:rgba(47,49,146,.06);
  --border:#DCE3EE;--border-soft:#EBF0F6;--radius:6px;--container:1600px;
  --r-sm:4px;--r:6px;--r-lg:10px;--r-pill:4px;
  --font:'IBM Plex Sans','IBM Plex Sans Thai',sans-serif;--mono:'IBM Plex Mono',ui-monospace,monospace;
  --shadow-soft:0 1px 2px rgba(11,18,32,.06);
  --shadow-lift:0 12px 28px -12px rgba(16,40,100,.25);
  --shadow-btn:none;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;position:relative;overflow-x:hidden}
a{color:var(--primary);text-decoration:none}
img{max-width:100%}
button{font-family:inherit;cursor:pointer}
.container{max-width:var(--container);margin:0 auto;padding:0 24px}
.grad-text{background:linear-gradient(120deg,var(--primary) 20%,var(--secondary) 55%,var(--accent));-webkit-background-clip:text;background-clip:text;color:transparent}
.grad-bg{background:linear-gradient(135deg,var(--primary),var(--secondary))}
.display{letter-spacing:-.02em;line-height:1.15}
.muted{color:var(--text-muted)}
[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}


/* header */
header.site{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}
.nav{display:flex;align-items:center;gap:24px;height:64px}
.logo{display:flex;align-items:center;flex-shrink:0}
.logo img{height:32px;width:auto;display:block}
.search{flex:1;position:relative;max-width:520px}
.search input{width:100%;height:42px;border:1px solid var(--border);border-radius:var(--r-pill);padding:0 44px 0 18px;font-family:inherit;font-size:14px;background:#fff;transition:.2s}
.search input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.15)}
.search button{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:none;background:none;color:var(--text-muted);border-radius:50%;display:flex;align-items:center;justify-content:center}
.search button:hover{color:var(--primary)}
.nav-actions{display:flex;align-items:center;gap:14px;margin-left:auto}
.lang-switch{display:flex;align-items:center;gap:2px;border:1px solid var(--border);border-radius:var(--r-pill);padding:3px;background:#fff}
.lang-switch a,.lang-switch span{font-size:12.5px;font-weight:700;padding:4px 10px;border-radius:var(--r-pill);color:var(--text-muted)}
.lang-switch span{background:var(--primary-soft);color:var(--primary)}
.lang-switch a:hover{color:var(--primary)}
.nav-cta{color:#fff!important;font-weight:600;font-size:14px;padding:9px 20px;border-radius:var(--r-pill);box-shadow:var(--shadow-btn);transition:transform .2s;white-space:nowrap}
.nav-cta:hover{transform:translateY(-2px)}
/* ---------- main nav + mega menu (desktop ≥1024px) ---------- */
.mainnav{border-top:1px solid var(--border-soft);background:rgba(255,255,255,.6)}
.mn-row{display:flex;align-items:stretch;gap:4px;height:48px}
.mn-item{display:flex}
.mn-link{display:inline-flex;align-items:center;gap:6px;padding:0 14px;border:none;background:none;font-family:inherit;font-size:14.5px;font-weight:600;color:var(--text);white-space:nowrap;position:relative;transition:color .15s}
.mn-link svg{width:15px;height:15px;transition:transform .2s;color:var(--text-muted)}
.mn-link:hover,.mn-item.open>.mn-link{color:var(--primary)}
.mn-item.open>.mn-link svg{transform:rotate(180deg);color:var(--primary)}
.mn-link::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;border-radius:2px;background:var(--primary);transform:scaleX(0);transition:transform .2s}
.mn-link.active::after,.mn-item.open>.mn-link::after{transform:scaleX(1)}
.mn-link.active{color:var(--primary)}
.mn-link:focus-visible{outline:2px solid var(--primary);outline-offset:-4px;border-radius:var(--r-sm)}
.mega{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--border-soft);border-bottom:1px solid var(--border);box-shadow:0 24px 48px -12px rgba(15,23,42,.18);opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s,transform .18s,visibility .18s;z-index:60}
.mn-item.open>.mega{opacity:1;visibility:visible;transform:none}
.mega-grid{display:grid;gap:32px;padding:28px 24px 26px}
.mg-products{grid-template-columns:1fr 1fr 1fr 280px}
.mg-tech{grid-template-columns:1.6fr 1fr}
.mg-col{display:flex;flex-direction:column}
.mg-title{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:800;color:var(--text)}
a.mg-title:hover{color:var(--primary)}
.mg-sub{font-size:12.5px;color:var(--text-muted);margin:2px 0 12px}
.mg-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;padding:0 6px;border-radius:var(--r-pill);background:var(--primary-soft);color:var(--primary);font-size:11.5px;font-weight:700}
.mg-list{list-style:none;display:flex;flex-direction:column;gap:2px}
.mg-list a{display:flex;align-items:center;gap:9px;padding:6px 8px;margin:0 -8px;border-radius:var(--r-sm);font-size:14px;color:var(--text);transition:.12s}
.mg-list a:hover{background:var(--bg);color:var(--primary)}
.mg-classes a{justify-content:space-between}
.mg-classes b{font-weight:600}
.mg-more{margin-top:10px;font-size:13.5px;font-weight:700}
.mg-feature{display:flex;flex-direction:column;justify-content:flex-end;gap:4px;padding:18px;border-radius:var(--r);background:linear-gradient(135deg,#EDEEF9,#EEF3FA);border:1px solid #DFE0F4;color:var(--text);transition:.2s}
.mg-feature:hover{box-shadow:var(--shadow-lift);transform:translateY(-2px)}
.mgf-art{position:relative;flex:1 1 auto;min-height:160px;display:flex;align-items:flex-end;justify-content:center;margin-bottom:14px}
.mgf-art svg,.mgf-art img{position:absolute;z-index:1;left:50%;top:0;bottom:0;height:100%;width:auto;max-width:100%;transform:translateX(-50%)}
.mgf-art img{left:0;width:100%;transform:none;object-fit:contain;object-position:center bottom}
.mgf-kicker{font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--primary)}
.mg-feature b{font-size:16px}
.mgf-tag{font-size:13px;color:var(--text-muted)}
.mgf-chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.mgf-chips:empty{display:none}
.mgf-chips i{font-style:normal;font-size:11px;font-weight:700;padding:2px 8px;border-radius:var(--r-pill);background:#fff;color:var(--primary);border:1px solid #CDCEEC}
.mgf-art,.mg-feature b,.mgf-tag,.mgf-kicker{transition:opacity .15s}
.mg-feature.swap .mgf-art,.mg-feature.swap b,.mg-feature.swap .mgf-tag{opacity:.35}
.mg-list a.previewing{background:var(--primary-soft);color:var(--primary)}
.mg-feature em{font-style:normal;font-size:13px;font-weight:700;color:var(--primary);margin-top:6px}
.mg-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mg-card{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:var(--r);border:1px solid var(--border-soft);color:var(--text);transition:.15s}
.mg-card:hover{border-color:#CDCEEC;background:#F7FAFE;box-shadow:var(--shadow-soft)}
.mgc-ic{width:42px;height:42px;flex:0 0 auto;border-radius:var(--r-sm);background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center}
.mgc-ic svg{width:20px;height:20px}
.mg-card b{display:block;font-size:14.5px;margin-bottom:2px}
.mg-card span span{display:block;font-size:12.5px;color:var(--text-muted);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mg-articles ul{list-style:none;display:flex;flex-direction:column;gap:4px;margin-top:12px}
.mg-articles li a{display:flex;flex-direction:column;padding:10px 12px;margin:0 -12px;border-radius:var(--r-sm);color:var(--text)}
.mg-articles li a:hover{background:var(--bg)}
.mg-articles time{font-size:12px;color:var(--text-muted)}
.mg-articles b{font-size:14px;font-weight:600;line-height:1.45}
.mg-articles li a:hover b{color:var(--primary)}

/* ---------- mobile / tablet drawer (<1024px) ---------- */
.m-only{display:none}
.nav-icon-btn{width:42px;height:42px;border:1px solid var(--border);border-radius:var(--r-sm);background:#fff;color:var(--text);align-items:center;justify-content:center}
.nav-icon-btn svg{width:19px;height:19px}
.burger{width:42px;height:42px;border:none;border-radius:var(--r-sm);background:var(--primary-soft);flex-direction:column;align-items:center;justify-content:center;gap:4px}
.burger span{display:block;width:18px;height:2px;border-radius:2px;background:var(--primary)}
.drawer-backdrop{position:fixed;inset:0;z-index:90;background:rgba(15,23,42,.45);backdrop-filter:blur(2px);opacity:0;transition:opacity .25s}
.drawer-open .drawer-backdrop{opacity:1}
.drawer{position:fixed;top:0;right:0;bottom:0;z-index:95;width:min(88vw,380px);background:#fff;display:flex;flex-direction:column;box-shadow:-20px 0 50px rgba(15,23,42,.2);transform:translateX(105%);transition:transform .28s cubic-bezier(.2,.8,.2,1);overflow-y:auto;overscroll-behavior:contain}
.drawer-open .drawer{transform:none}
.drawer-open{overflow:hidden}
.dr-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--border-soft)}
.dr-close{width:40px;height:40px;border:none;border-radius:var(--r-sm);background:var(--bg);font-size:18px;color:var(--text-muted)}
.dr-search{position:relative;margin:16px 18px 6px;display:flex;align-items:center}
.dr-search svg{position:absolute;left:14px;width:18px;height:18px;color:var(--text-muted)}
.dr-search input{width:100%;height:46px;border:1px solid var(--border);border-radius:var(--r);padding:0 14px 0 42px;font-family:inherit;font-size:15px;background:var(--bg)}
.dr-search input:focus{outline:none;border-color:var(--primary);background:#fff;box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}
.dr-nav{padding:8px 10px;flex:1}
.dr-link,.dr-group summary{display:flex;align-items:center;gap:12px;padding:14px 12px;border-radius:var(--r-sm);font-size:16px;font-weight:700;color:var(--text);cursor:pointer;list-style:none}
.dr-group summary::-webkit-details-marker{display:none}
.dr-link svg,.dr-group summary>svg{width:20px;height:20px;color:var(--primary)}
.dr-link.active{background:var(--primary-soft);color:var(--primary)}
.dr-link:active,.dr-group summary:active{background:var(--bg)}
.dr-group .chev{margin-left:auto;display:flex;color:var(--text-muted);transition:transform .2s}
.dr-group .chev svg{width:18px;height:18px}
.dr-group[open] .chev{transform:rotate(180deg)}
.dr-group[open] summary{color:var(--primary)}
.dr-sub{display:flex;flex-direction:column;padding:2px 12px 12px 44px}
.dr-sub>a{display:flex;align-items:center;justify-content:space-between;padding:10px 0;font-size:15px;color:var(--text);border-bottom:1px solid var(--border-soft)}
.dr-sub>a:last-child{border-bottom:none}
.dr-label{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--text-muted);margin:14px 0 8px}
.dr-chips{display:flex;flex-wrap:wrap;gap:6px}
.dr-chips a{font-size:13px;font-weight:600;padding:6px 12px;border-radius:var(--r-pill);border:1px solid var(--border);color:var(--text)}
.dr-foot{display:flex;flex-direction:column;gap:10px;padding:16px 18px 22px;border-top:1px solid var(--border-soft);background:var(--bg)}
.dr-lang{display:flex;gap:6px;padding:4px;border-radius:var(--r-sm);background:#fff;border:1px solid var(--border)}
.dr-lang a,.dr-lang span{flex:1;text-align:center;padding:8px;border-radius:var(--r-sm);font-size:14px;font-weight:700;color:var(--text-muted)}
.dr-lang span{background:var(--primary-soft);color:var(--primary)}
.dr-foot .btn{width:100%;height:48px}
.dr-quick{display:flex;gap:10px}
.dr-quick .btn{flex:1}
.dr-quick .btn svg{width:18px;height:18px}

@media (max-width:1023px){
  .mainnav,.search,.lang-switch,.nav-cta{display:none!important}
  .m-only{display:flex}
  .nav{gap:10px;height:60px}
  .nav-actions{gap:8px}
}
@media (prefers-reduced-motion:reduce){.drawer,.mega{transition:none}}

/* breadcrumb */
.breadcrumb{padding:20px 0 4px;font-size:13px;color:var(--text-muted)}
.breadcrumb a:hover{color:var(--primary)}
.breadcrumb span{margin:0 8px;color:#cbd5e1}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 26px;border-radius:var(--r-pill);font-size:15px;font-weight:600;border:none;transition:.2s ease;cursor:pointer;text-align:center}
.btn-primary{color:#fff;box-shadow:var(--shadow-btn)}
.btn-primary:hover{transform:translateY(-2px)}
.btn-ghost{background:#fff;color:var(--primary);border:1px solid var(--border)}
.btn-ghost:hover{background:var(--primary-soft);border-color:var(--primary)}
.btn-line{background:#06C755;color:#fff}
.btn-line:hover{transform:translateY(-2px)}
.btn:focus-visible,.lang-switch a:focus-visible{outline:2px solid var(--primary);outline-offset:2px}

/* sections */
.section{padding:64px 0}
.section h2{font-size:32px;font-weight:800;letter-spacing:-.02em;line-height:1.2;margin-bottom:14px}
.section .lead{font-size:18px;color:var(--text-muted);max-width:640px;line-height:1.7;margin-bottom:40px}
.page-head{padding:28px 0 8px}
.page-head h1{font-size:38px;font-weight:800}
.page-head p{color:var(--text-muted);margin-top:8px;max-width:70ch;line-height:1.7}
.card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-soft)}
.empty{padding:40px;text-align:center;color:var(--text-muted)}

/* rich text */
.prose{font-size:15.5px;line-height:1.85;max-width:75ch}
.prose h2{font-size:24px;margin:28px 0 12px}
.prose h3{font-size:19px;margin:24px 0 10px}
.prose p,.prose ul,.prose ol{margin:0 0 14px}
.prose ul,.prose ol{padding-left:22px}
.prose img{border-radius:var(--r-sm);margin:12px 0}

/* footer */
footer.site{margin-top:56px;background:#fff;border-top:1px solid var(--border-soft)}
.ft-wrap{max-width:1240px;margin:0 auto;padding:0 32px}
/* promo band */
.ft-band{position:relative;overflow:hidden;background:linear-gradient(100deg,var(--primary-dark),var(--primary) 45%,var(--secondary));color:#fff}
.ft-band-in{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px 32px;flex-wrap:wrap;padding-top:34px;padding-bottom:34px}
.ft-promo{font-size:40px;font-weight:800;letter-spacing:.04em;line-height:1.05}
.ft-band-sub{margin-top:8px;font-size:15px;opacity:.88}
.ft-peng{position:absolute;left:46%;bottom:-18px;width:110px;height:150px;background:rgba(255,255,255,.18);
  -webkit-mask:url(/assets/img/penguin-white.png) center bottom/contain no-repeat;mask:url(/assets/img/penguin-white.png) center bottom/contain no-repeat;pointer-events:none}
.ft-btns{display:flex;gap:10px;flex-wrap:wrap}
.ft-btn{display:inline-flex;align-items:center;gap:8px;height:48px;padding:0 20px;border-radius:var(--r-sm);font-weight:700;font-size:15px;white-space:nowrap;transition:transform .15s,box-shadow .15s,background .15s}
.ft-btn svg{width:18px;height:18px}
.ft-btn:hover{transform:translateY(-2px)}
.ft-btn-w{background:#fff;color:var(--primary)}
.ft-btn-w:hover{box-shadow:0 10px 22px -10px rgba(15,23,42,.5)}
.ft-btn-line{background:#06c755;color:#fff}
.ft-btn-line:hover{box-shadow:0 10px 22px -8px rgba(6,199,85,.7)}
.ft-btn-o{border:1.5px solid rgba(255,255,255,.65);color:#fff}
.ft-btn-o:hover{background:rgba(255,255,255,.12)}
/* columns */
.ft-main{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.3fr;gap:36px;padding-top:48px;padding-bottom:40px}
.ft-brand img{height:40px;width:auto}
.ft-brand p{margin-top:16px;font-size:14.5px;line-height:1.7;color:var(--text-muted)}
.ft-col h4{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--primary);margin-bottom:16px}
.ft-col ul{list-style:none}
.ft-col li{margin-bottom:10px;font-size:14.5px;color:var(--text)}
.ft-col a{color:var(--text);transition:color .15s}
.ft-col a:hover{color:var(--primary)}
.ft-contact li{display:flex;gap:10px;align-items:flex-start;line-height:1.55}
.ft-contact svg{width:18px;height:18px;flex:0 0 auto;margin-top:2px;color:var(--accent)}
/* bottom bar */
.ft-bot{border-top:1px solid var(--border-soft)}
.ft-bot .ft-wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 24px;padding-top:18px;padding-bottom:20px;font-size:13.5px;color:var(--text-muted)}
.ft-bot nav{display:flex;gap:20px}
.ft-bot a{color:var(--text-muted)}
.ft-bot a:hover{color:var(--primary)}
@media (max-width:1100px){
  .ft-main{grid-template-columns:repeat(4,1fr)}
  .ft-brand{grid-column:1/-1;max-width:640px}
  .ft-peng{display:none}
}
@media (max-width:768px){
  .ft-wrap{padding:0 16px}
  .ft-promo{font-size:30px}
  .ft-band-in{padding-top:28px;padding-bottom:28px}
  .ft-btns{width:100%}
  .ft-btn{flex:1 1 auto;justify-content:center}
  .ft-main{grid-template-columns:1fr 1fr;gap:28px 20px;padding-top:36px;padding-bottom:28px}
  .ft-contact{grid-column:1/-1}
  .ft-bot .ft-wrap{flex-direction:column;align-items:flex-start}
}


/* chips */
.chip{display:inline-block;font-size:11.5px;font-weight:600;padding:4px 10px;border-radius:var(--r-pill)}
.chip.g{background:#ecfdf5;color:#059669}.chip.i{background:var(--primary-soft);color:var(--primary)}.chip.v{background:#EEF3FA;color:var(--secondary)}.chip.o{background:#fff7ed;color:#c2410c}

/* product card */
.prod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:24px}
.prod-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-soft);overflow:hidden;transition:.2s ease}
.prod-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.prod-media{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--c,#2F3192) 42%,#fff) 0%,color-mix(in srgb,var(--c,#2F3192) 16%,#fff) 72%)}
/* snow scene: mountains + snowy ground + falling snow, tinted by --c (tank colour) */
.snow{position:absolute;inset:0;z-index:0;pointer-events:none}
.snow-mtn{position:absolute;left:0;bottom:14%;width:100%;height:44%;color:color-mix(in srgb,var(--c,#2F3192) 70%,#1e293b)}
.snow-ground{position:absolute;left:-12%;right:-12%;bottom:-14%;height:32%;border-radius:50% 50% 0 0;background:linear-gradient(#fff,color-mix(in srgb,var(--c,#2F3192) 8%,#fff));box-shadow:0 -6px 18px rgba(255,255,255,.75)}
.snow-fall{position:absolute;left:0;right:0;top:-120px;bottom:0;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'120'%20height%3D'120'%3E%3Cg%20fill%3D'white'%20opacity%3D'0.9'%3E%3Ccircle%20cx%3D'12'%20cy%3D'18'%20r%3D'2'%2F%3E%3Ccircle%20cx%3D'58'%20cy%3D'9'%20r%3D'1.4'%2F%3E%3Ccircle%20cx%3D'96'%20cy%3D'30'%20r%3D'2.4'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'60'%20r%3D'1.2'%2F%3E%3Ccircle%20cx%3D'78'%20cy%3D'70'%20r%3D'1.8'%2F%3E%3Ccircle%20cx%3D'110'%20cy%3D'96'%20r%3D'1.3'%2F%3E%3Ccircle%20cx%3D'50'%20cy%3D'100'%20r%3D'2.2'%2F%3E%3Ccircle%20cx%3D'8'%20cy%3D'92'%20r%3D'1.5'%2F%3E%3C%2Fg%3E%3Cg%20stroke%3D'white'%20stroke-width%3D'1.2'%20stroke-linecap%3D'round'%20opacity%3D'0.9'%20fill%3D'none'%3E%3Cpath%20d%3D'M70%2040v10M65%2045h10M66.5%2041.5l7%207M73.5%2041.5l-7%207'%2F%3E%3Cpath%20d%3D'M22%20108v8M18%20112h8M19%20109l6%206M25%20109l-6%206'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") 0 0/120px 120px;animation:snowfall 9s linear infinite}
.snow-fall2{background:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'120'%20height%3D'120'%3E%3Cg%20fill%3D'white'%20opacity%3D'0.6'%3E%3Ccircle%20cx%3D'12'%20cy%3D'18'%20r%3D'2'%2F%3E%3Ccircle%20cx%3D'58'%20cy%3D'9'%20r%3D'1.4'%2F%3E%3Ccircle%20cx%3D'96'%20cy%3D'30'%20r%3D'2.4'%2F%3E%3Ccircle%20cx%3D'30'%20cy%3D'60'%20r%3D'1.2'%2F%3E%3Ccircle%20cx%3D'78'%20cy%3D'70'%20r%3D'1.8'%2F%3E%3Ccircle%20cx%3D'110'%20cy%3D'96'%20r%3D'1.3'%2F%3E%3Ccircle%20cx%3D'50'%20cy%3D'100'%20r%3D'2.2'%2F%3E%3Ccircle%20cx%3D'8'%20cy%3D'92'%20r%3D'1.5'%2F%3E%3C%2Fg%3E%3Cg%20stroke%3D'white'%20stroke-width%3D'1.2'%20stroke-linecap%3D'round'%20opacity%3D'0.6'%20fill%3D'none'%3E%3Cpath%20d%3D'M70%2040v10M65%2045h10M66.5%2041.5l7%207M73.5%2041.5l-7%207'%2F%3E%3Cpath%20d%3D'M22%20108v8M18%20112h8M19%20109l6%206M25%20109l-6%206'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") 40px 20px/70px 70px;animation-duration:14s;opacity:.8}
@keyframes snowfall{to{transform:translateY(120px)}}
@media (prefers-reduced-motion:reduce){.snow-fall{animation:none}}
.prod-media > svg{position:relative;z-index:1;width:60%;height:60%;margin-top:22px}
.prod-media img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:contain;object-position:center bottom;padding:44px 18px 8px;transition:transform .35s}
.prod-card:hover .prod-media img,.prod-card:hover .prod-media > svg{transform:translateY(-6px)}
/* product image shadow (cylinder SVG / transparent photos) */
.prod-media > svg,.prod-media img,.mgf-art svg,.mgf-art img,.gallery .main-img img,.gallery .main-img svg{filter:drop-shadow(0 12px 14px rgba(15,23,42,.16)) drop-shadow(0 3px 4px rgba(15,23,42,.10))}
.mgf-art::after{content:"";position:absolute;left:50%;bottom:calc(15% - 7px);width:130px;height:14px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(closest-side,rgba(15,23,42,.22),transparent);z-index:0}
.mgf-art:has(img)::after{bottom:-6px}
.prod-tags{position:absolute;z-index:2;top:12px;left:12px;right:12px;display:flex;flex-wrap:wrap;gap:6px}
/* labels: soft tints with coloured text */
.prod-tag{font-size:11px;font-weight:700;padding:3px 10px;border-radius:var(--r-pill);line-height:1.35;border:1px solid transparent;background:#fff}
.lb-recommended{background:#EDEEF9;color:#2F3192;border-color:#CDCEEC}
.lb-popular{background:#fff7ed;color:#c2410c;border-color:#fed7aa}
.lb-bestseller{background:#fef2f2;color:#b91c1c;border-color:#fecaca}
.lb-new{background:#ecfdf5;color:#047857;border-color:#a7f3d0}
.lb-custom{background:#fff;color:var(--text-muted);border-color:var(--border)}

/* products: view toggle + table view */
.view-toggle{display:flex;gap:2px;padding:3px;border:1px solid var(--border);border-radius:var(--r-sm);background:var(--bg);margin-left:auto}
.view-toggle button{width:38px;height:34px;border:none;border-radius:var(--r-sm);background:none;color:var(--text-muted);display:flex;align-items:center;justify-content:center;transition:.15s}
.view-toggle button svg{width:18px;height:18px}
.view-toggle button:hover{color:var(--primary)}
.view-toggle button.active{background:#fff;color:var(--primary);box-shadow:var(--shadow-soft)}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.prod-table{min-width:880px}
.prod-table td{vertical-align:middle}
.pt-name{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--text)}
.pt-name:hover{color:var(--primary)}
.pt-tags{display:flex;gap:4px;flex-wrap:wrap;margin:6px 0 0 18px}
.pt-tags .prod-tag{font-size:10.5px;padding:1px 8px}
.pt-go{font-size:13px;white-space:nowrap}.prod-body{padding:20px;display:flex;flex-direction:column;gap:6px;flex:1}
.prod-brand{font-size:12px;font-weight:600;color:var(--text-muted)}
.prod-name{font-size:17px;font-weight:700;color:var(--text);line-height:1.35}
.prod-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.prod-foot{margin-top:auto;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.prod-foot .sku{font-size:12px;color:var(--text-muted)}
.prod-foot a{font-size:13px;font-weight:600;white-space:nowrap}

/* filters (products page) */
.filter-bar{display:flex;flex-direction:column;gap:14px;margin:24px 0 28px}
.filter-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.filter-row .lbl{font-size:13px;font-weight:600;color:var(--text-muted);min-width:80px}
.filter{border:1px solid var(--border);background:#fff;color:var(--text-muted);font-size:14px;font-weight:600;padding:8px 16px;border-radius:var(--r-pill);transition:.2s}
.filter:hover{border-color:var(--primary);color:var(--primary)}
.filter.active{background:var(--primary-soft);border-color:var(--primary);color:var(--primary)}
.count{font-size:14px;color:var(--text-muted);margin-bottom:16px}

/* compact filter toolbar (products page) */
.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:22px 0 20px;padding:8px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);box-shadow:var(--shadow-soft)}
.tb-search{flex:1 1 260px;position:relative;display:flex;align-items:center}
.tb-search svg{position:absolute;left:14px;width:18px;height:18px;color:var(--text-muted);pointer-events:none}
.tb-search input{width:100%;height:42px;border:1px solid transparent;border-radius:var(--r-sm);padding:0 14px 0 40px;font-family:inherit;font-size:14px;background:var(--bg);color:var(--text);transition:.2s}
.tb-search input:focus{outline:none;border-color:var(--primary);background:#fff;box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}
.tb-select{flex:0 1 auto;height:42px;min-width:130px;border:1px solid var(--border);border-radius:var(--r-sm);padding:0 34px 0 14px;font-family:inherit;font-size:14px;font-weight:600;color:var(--text-muted);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748B' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;-webkit-appearance:none;appearance:none;cursor:pointer;transition:.2s}
.tb-select:hover{border-color:var(--primary)}
.tb-select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}
.tb-select.on{background-color:var(--primary-soft);border-color:var(--primary);color:var(--primary)}
.tb-reset{height:42px;padding:0 14px;border:none;border-radius:var(--r-sm);background:none;color:var(--text-muted);font-size:13.5px;font-weight:600;white-space:nowrap}
.tb-reset:hover{color:#dc2626;background:#fef2f2}
@media (max-width:768px){
  .toolbar{display:grid;grid-template-columns:1fr 1fr}
  .tb-search{grid-column:1/-1}
  .tb-select{min-width:0;width:100%}
  .tb-reset{grid-column:1/-1}
  .view-toggle{grid-column:1/-1;justify-self:end}
}
.q-input{height:42px;border:1px solid var(--border);border-radius:var(--r-pill);padding:0 18px;font-family:inherit;font-size:14px;background:#fff;min-width:260px}
.q-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.15)}

/* data table */
.table-wrap{overflow-x:auto;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);box-shadow:var(--shadow-soft)}
.data-table{width:100%;border-collapse:collapse;font-size:14.5px;min-width:640px}
.data-table th{text-align:left;font-size:12.5px;font-weight:700;color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;padding:14px 16px;background:var(--bg);border-bottom:1px solid var(--border)}
.data-table td{padding:14px 16px;border-bottom:1px solid var(--border-soft);vertical-align:top}
.data-table tr:last-child td{border-bottom:none}
.data-table a{font-weight:700}

/* home */
.hero{padding:56px 0 40px}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.hero h1{font-size:52px;font-weight:800}
.hero .lead{font-size:19px;color:var(--text-muted);margin:22px 0 30px;max-width:38ch;line-height:1.7}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap}
.hero-visual{perspective:2000px}
.hero-card{transform:rotateX(4deg) rotateY(-10deg);transition:transform .5s;border-radius:var(--r-lg);padding:36px;box-shadow:var(--shadow-lift);position:relative}
.hero-visual:hover .hero-card{transform:rotateX(2deg) rotateY(-6deg)}
.hero-card .inner{background:#fff;border-radius:var(--r-lg);padding:34px;text-align:center;display:block;color:var(--text)}
.hero-card .inner svg,.hero-card .inner img{width:240px;height:240px;max-width:100%;object-fit:contain}
.hero-card .hn{font-weight:800;font-size:18px;margin-top:8px}
.hero-card .hs{color:var(--text-muted);font-size:13px}
.hero-float{position:absolute;background:#fff;border-radius:var(--r);box-shadow:var(--shadow-lift);padding:12px 16px}
.hero-float .k{font-size:11px;color:var(--text-muted);font-weight:600}
.hero-float .v{font-size:18px;font-weight:800;color:var(--text)}
.hf1{top:-16px;left:-16px}.hf2{bottom:-18px;right:-16px}
.cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px}
.cat-card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);padding:24px;text-align:center;box-shadow:var(--shadow-soft);transition:.2s}
.cat-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.cat-card .e{width:56px;height:56px;margin:0 auto 12px;border-radius:var(--r);background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px}
.cat-card .t{font-weight:700;font-size:15px;color:var(--text)}
.cat-card .d{font-size:12.5px;color:var(--text-muted);margin-top:4px}
.brand-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.brand-card{display:flex;gap:18px;align-items:center;padding:24px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-soft);transition:.2s;color:var(--text)}
.brand-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.brand-card .bl{width:72px;height:72px;flex:0 0 auto;border-radius:var(--r);background:var(--primary-soft);display:flex;align-items:center;justify-content:center;overflow:hidden;font-weight:800;color:var(--primary)}
.brand-card .bl img{width:100%;height:100%;object-fit:contain;padding:8px}
.brand-card h3{font-size:18px;font-weight:800}
.brand-card p{font-size:13.5px;color:var(--text-muted);line-height:1.6}
.trust{background:linear-gradient(135deg,#EDEEF9,#EEF3FA);border:1px solid #DFE0F4;border-radius:var(--r-lg);padding:44px}
.trust-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px}
.trust-item .n{font-size:38px;font-weight:800}
.trust-item .l{font-size:14px;color:var(--text-muted);margin-top:4px}

.btn-white{background:#fff;color:var(--primary);box-shadow:0 8px 20px rgba(0,0,0,.2)}
.btn-white:hover{transform:translateY(-2px)}

/* about */
.ab-hero{padding:48px 0 16px}
.ab-hero h1{font-size:44px;font-weight:800;max-width:18ch}
.ab-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px}
.ab-card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);padding:26px;box-shadow:var(--shadow-soft)}
.ab-card h3{font-size:17px;font-weight:700;margin-bottom:8px}
.ab-card p{font-size:14px;color:var(--text-muted);line-height:1.7}

/* contact / form */
.ct-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;padding:24px 0 64px}
.ct-info h1{font-size:38px;font-weight:800}
.ct-info>p{color:var(--text-muted);margin-top:14px;max-width:44ch;line-height:1.8}
.ct-list{margin-top:28px;display:flex;flex-direction:column;gap:16px}
.ct-item{display:flex;gap:14px;align-items:center;color:var(--text)}
.ct-item .e{width:48px;height:48px;flex:0 0 auto;border-radius:var(--r);background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center}
.ct-item .e svg{width:22px;height:22px}
.ct-item .k{font-size:12.5px;color:var(--text-muted)}
.ct-item .v{font-weight:700;color:var(--text)}
.quick-btns{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.ct-form{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);padding:32px;box-shadow:var(--shadow-lift)}
.ct-form h2{font-size:22px;font-weight:800;margin-bottom:6px}
.ct-form .sub{color:var(--text-muted);font-size:14px;margin-bottom:22px}
.field{margin-bottom:16px}
.field label{display:block;font-size:13.5px;font-weight:600;color:var(--text);margin-bottom:7px}
.field label .req{color:#dc2626}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--border);border-radius:var(--r-sm);padding:12px 14px;font-family:inherit;font-size:14.5px;background:#fff;transition:.2s;color:var(--text)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.15)}
.field textarea{resize:vertical;min-height:110px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:var(--text-muted);margin:6px 0 20px}
.consent input{margin-top:4px;width:16px;height:16px;flex:0 0 auto}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form-msg{margin-top:14px;font-size:14px;padding:12px 14px;border-radius:var(--r-sm);display:none}
.form-msg.err{display:block;background:#fef2f2;color:#b91c1c}
.form-msg.ok{display:block;background:#ecfdf5;color:#047857}
.ct-form .btn{width:100%}

/* refrigerant page */
.ref-hero{display:grid;grid-template-columns:260px 1fr;gap:40px;align-items:center;padding:16px 0 32px}
.ref-hero .cyl{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-lift);aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.ref-hero .cyl svg{width:70%;height:70%}
.ref-hero h1{font-size:44px;font-weight:800}
.ref-hero .sum{color:var(--text-muted);font-size:16.5px;line-height:1.8;margin-top:10px;max-width:65ch}
.kv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-top:22px}
.kv{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);padding:14px 16px}
.kv .k{font-size:12px;color:var(--text-muted);font-weight:600}
.kv .v{font-size:18px;font-weight:800;margin-top:2px}
.note{font-size:12.5px;color:var(--text-muted);margin-top:14px}
.link-list{display:flex;gap:8px;flex-wrap:wrap}

/* article */
.art-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}
.art-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-soft);transition:.2s;color:var(--text)}
.art-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.art-card .cover{aspect-ratio:16/9;background:linear-gradient(135deg,#EDEEF9,#EEF3FA)}
.art-card .cover img{width:100%;height:100%;object-fit:cover}
.art-card .b{padding:20px}
.art-card h3{font-size:17px;font-weight:700;line-height:1.4}
.art-card p{font-size:14px;color:var(--text-muted);margin-top:6px}
.art-card time{font-size:12.5px;color:var(--text-muted)}
.art-card .b{display:flex;flex-direction:column;gap:4px;flex:1}
.art-card .cover{position:relative;overflow:hidden}
.cover-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#A9AADD}
.cover-ph svg{width:42px;height:42px}
.art-more{margin-top:auto;padding-top:10px;font-size:13.5px;font-weight:700;color:var(--primary)}
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.sec-head h2{margin-bottom:0!important}

/* article reading layout */
.article .container{max-width:820px}
.art-head{padding:8px 0 24px;border-bottom:1px solid var(--border);margin-bottom:28px}
.art-kicker{color:var(--primary);background:var(--primary-soft);border-color:#CDCEEC}
.art-head h1{font-size:38px;font-weight:800;margin:14px 0 12px}
.art-lead{font-size:18px;color:var(--text-muted);line-height:1.75;margin-bottom:12px}
.art-cover{width:100%;border-radius:var(--r-lg);margin-bottom:28px}
.art-body{max-width:none;font-size:16.5px}
.art-body h2{font-size:24px;font-weight:800;margin:36px 0 12px;padding-top:4px}
.art-body strong{color:var(--text)}
.art-body a{font-weight:600;text-decoration:underline;text-underline-offset:3px}
.prose table{width:100%;border-collapse:collapse;margin:8px 0 22px;font-size:15px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);overflow:hidden;display:table}
.prose th{text-align:left;background:var(--bg);font-weight:700;padding:11px 14px;border-bottom:1px solid var(--border)}
.prose td{padding:11px 14px;border-bottom:1px solid var(--border-soft)}
.prose tr:last-child td{border-bottom:none}

/* documents */
.doc-row{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--border-soft);border-radius:var(--r);margin-bottom:12px;transition:.2s;background:#fff}
.doc-row:hover{border-color:var(--primary);box-shadow:var(--shadow-soft)}
.doc-ic{width:44px;height:44px;flex:0 0 auto;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;background:#fef2f2;color:#dc2626;font-weight:800;font-size:12px}
.doc-meta{flex:1;min-width:0}
.doc-meta .dt{font-weight:600;font-size:14.5px}
.doc-meta .dd{font-size:12.5px;color:var(--text-muted)}
.doc-dl{border:1px solid var(--border);background:#fff;color:var(--primary);font-weight:600;font-size:13px;padding:8px 16px;border-radius:var(--r-pill);transition:.2s;white-space:nowrap}
.doc-dl:hover{background:var(--primary-soft)}

/* ---------- Home: banner slider / promo tiles / wide banner ---------- */
.hero-slider-wrap{padding:20px 0 0}
.hero-slider{position:relative;aspect-ratio:1920/720;border-radius:var(--r-lg);overflow:hidden;background:#0E1D4F;box-shadow:var(--shadow-lift)}
.hs-slide{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .7s ease,visibility .7s}
.hs-slide.active{opacity:1;visibility:visible}
.hs-slide picture,.hs-slide img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hs-slide:not(.is-ph) .hs-content{background:linear-gradient(90deg,rgba(15,23,42,.62),rgba(15,23,42,0))}
.hs-content{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:12px;padding:0 7% ;max-width:100%;color:#fff}
.hs-content h2{font-size:clamp(26px,3.6vw,48px);font-weight:800;letter-spacing:-.02em;line-height:1.15;max-width:15em}
.hs-content p{font-size:clamp(14px,1.4vw,18px);color:#DFE0F4;max-width:34em;line-height:1.6}
.hs-content .btn{margin-top:6px}
.hs-link{position:absolute;inset:0}
.hs-ph{position:absolute;inset:0;background:linear-gradient(135deg,#0E1D4F,#173077 50%,#2F3192)}
.hs-ph::before{content:"";position:absolute;top:-30%;right:-8%;width:55%;aspect-ratio:1;border-radius:50%;background:var(--secondary);filter:blur(90px);opacity:.35}
.hs-ph-art{position:absolute;right:8%;top:50%;transform:translateY(-50%);width:30%;aspect-ratio:1;background:#fff;border-radius:var(--r-lg);display:flex;align-items:center;justify-content:center;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.hs-ph-art svg{width:70%;height:70%}
.hs-ph-art.is-icon svg{width:40%;height:40%;color:var(--primary)}
.ph-hint{position:absolute;top:14px;right:14px;z-index:3;display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:6px 12px;border-radius:var(--r-pill);border:1.5px dashed rgba(255,255,255,.7);background:rgba(15,23,42,.35);color:#fff;backdrop-filter:blur(4px);pointer-events:none}
.ph-hint svg{width:15px;height:15px}
.ph-hint i{font-style:normal}
.ph-hint .m{display:none}
@media (max-width:768px){.ph-hint .d{display:none}.ph-hint .m{display:inline}}
.hs-nav{position:absolute;top:50%;z-index:4;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:none;background:rgba(255,255,255,.9);color:var(--text);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-soft);transition:.2s}
.hs-nav:hover{background:#fff;color:var(--primary)}
.hs-nav svg{width:20px;height:20px}
.hs-nav.prev{left:16px}.hs-nav.prev svg{transform:rotate(90deg)}
.hs-nav.next{right:16px}.hs-nav.next svg{transform:rotate(-90deg)}
.hs-dots{position:absolute;left:0;right:0;bottom:16px;z-index:4;display:flex;justify-content:center;gap:8px}
.hs-dots button{width:9px;height:9px;padding:0;border:none;border-radius:var(--r-pill);background:rgba(255,255,255,.5);transition:.25s}
.hs-dots button.active{width:28px;background:#fff}

.promo-wrap{padding:20px 0 0}
.promo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.promo-tile{position:relative;aspect-ratio:4/3;border-radius:var(--r-lg);overflow:hidden;display:block;box-shadow:var(--shadow-soft);background:#fff;transition:.25s}
.promo-tile:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.promo-tile img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.promo-tile:hover img{transform:scale(1.04)}
.promo-tile.is-ph{background:linear-gradient(135deg,#EDEEF9,#EEF3FA);border:1px solid #DFE0F4}
.pt-ph{position:absolute;inset:0 0 34% 0;display:flex;align-items:center;justify-content:center}
.pt-ph svg{height:80%;width:auto}
.promo-tile .ph-hint{border-color:rgba(31,63,159,.45);background:rgba(255,255,255,.75);color:var(--primary)}
.pt-text{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:2px;padding:16px 18px;background:linear-gradient(0deg,rgba(15,23,42,.72),rgba(15,23,42,0));color:#fff}
.promo-tile.is-ph .pt-text{background:#fff;color:var(--text);border-top:1px solid var(--border-soft)}
.pt-text b{font-size:17px}
.pt-text span{font-size:13px;opacity:.85}

.wide-banner{position:relative;display:block;aspect-ratio:1920/480;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-soft);color:#fff}
.wide-banner picture,.wide-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wide-banner.is-ph{background:linear-gradient(120deg,#1C7FB0,#177A8C 45%,#2F3192)}
.wb-content{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:0 6%;background:linear-gradient(90deg,rgba(15,23,42,.55),rgba(15,23,42,0))}
.wide-banner.is-ph .wb-content{background:none}
.wb-content b{font-size:clamp(20px,2.4vw,32px);font-weight:800}
.wb-content span{font-size:15px;color:#e0f2fe;max-width:40em}
.wb-content em{font-style:normal;font-weight:700;font-size:14px;margin-top:6px}

@media (max-width:900px){.promo-grid{grid-template-columns:1fr 1fr}.promo-grid .promo-tile:last-child:nth-child(odd){grid-column:1/-1;aspect-ratio:2/1}}
@media (max-width:768px){
  .hero-slider{aspect-ratio:4/5;border-radius:var(--r-lg)}
  .hs-content{justify-content:flex-end;padding:0 22px 56px}
  .hs-slide:not(.is-ph) .hs-content{background:linear-gradient(0deg,rgba(15,23,42,.75),rgba(15,23,42,0) 70%)}
  .hs-ph-art{top:30%;right:50%;transform:translate(50%,-50%);width:52%}
  .hs-nav{display:none}
  .promo-grid{grid-template-columns:1fr}
  .promo-grid .promo-tile:last-child:nth-child(odd){aspect-ratio:4/3}
  .wide-banner{aspect-ratio:16/9}
}

/* ---------- Technical Center ---------- */
.tech-hero{padding:12px 0 0}
.tech-band{position:relative;overflow:hidden;border-radius:var(--r-lg);background:linear-gradient(135deg,#0E1D4F,#173077 55%,#2F3192);color:#fff;padding:48px 44px 64px}
.tb-glow{position:absolute;border-radius:50%;filter:blur(70px);pointer-events:none}
.tb1{top:-90px;right:-60px;width:340px;height:340px;background:var(--secondary);opacity:.35}
.tb2{bottom:-120px;left:20%;width:380px;height:300px;background:#0EA5E9;opacity:.18}
.tb-inner{position:relative;max-width:760px}
.tb-kicker{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#CDCEEC;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);padding:6px 12px;border-radius:var(--r-pill)}
.tb-kicker svg{width:15px;height:15px}
.tech-band h1{font-size:42px;font-weight:800;margin:16px 0 10px;color:#fff}
.tech-band p{font-size:17px;line-height:1.75;color:#CDCEEC}
.tech-tabs{position:relative;z-index:2;display:flex;gap:6px;margin:-30px 24px 0;padding:6px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);box-shadow:var(--shadow-lift);overflow-x:auto}
.tech-tabs a{flex:1 0 auto;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:var(--r-sm);font-size:14.5px;font-weight:600;color:var(--text-muted);white-space:nowrap;transition:.2s}
.tech-tabs a svg{width:18px;height:18px}
.tech-tabs a:hover{color:var(--primary);background:var(--bg)}
.tech-tabs a.active{background:var(--primary-soft);color:var(--primary)}

.tech-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.tech-card{position:relative;display:flex;flex-direction:column;gap:6px;padding:28px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-soft);color:var(--text);transition:.2s;overflow:hidden}
.tech-card::after{content:"";position:absolute;inset:0 0 auto 0;height:4px;background:linear-gradient(90deg,var(--primary),var(--accent));opacity:0;transition:.2s}
.tech-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift)}
.tech-card:hover::after{opacity:1}
.tc-ic{width:52px;height:52px;border-radius:var(--r);background:var(--primary-soft);color:var(--primary);display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.tc-num{font-size:30px;font-weight:800;line-height:1.1}
.tc-num small{font-size:14px;font-weight:600;color:var(--text-muted)}
.tech-card h3{font-size:18px;font-weight:800;margin-top:4px}
.tech-card p{font-size:14px;color:var(--text-muted);line-height:1.65;flex:1}
.tc-go{font-size:14px;font-weight:700;color:var(--primary);margin-top:8px}

.class-groups{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:20px}
.class-group{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);padding:22px;box-shadow:var(--shadow-soft)}
.cg-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.cg-head .chip{font-size:13px;padding:5px 12px}
.cg-head .muted{font-size:12.5px}
.cg-desc{font-size:13.5px;color:var(--text-muted);line-height:1.6;margin:10px 0 14px}
.cg-grades{display:flex;flex-wrap:wrap;gap:8px}
.grade-chip{display:flex;flex-direction:column;padding:9px 14px 9px 12px;border:1px solid var(--border);border-left:4px solid var(--c);border-radius:var(--r-sm);background:#fff;color:var(--text);transition:.15s;min-width:118px}
.grade-chip b{font-size:14.5px}
.grade-chip span{font-size:11.5px;color:var(--text-muted)}
.grade-chip:hover{border-color:var(--c);transform:translateY(-2px);box-shadow:var(--shadow-soft)}

.safety-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.safety-card{--sc:#059669;background:#fff;border:1px solid var(--border-soft);border-top:4px solid var(--sc);border-radius:var(--r);padding:20px;box-shadow:var(--shadow-soft);display:flex;flex-direction:column}
.sf-code{font-size:30px;font-weight:800;color:var(--sc);line-height:1}
.sf-name{font-weight:700;font-size:14.5px;margin:8px 0 6px}
.safety-card p{font-size:13px;color:var(--text-muted);line-height:1.6;flex:1}
.sf-count{margin-top:12px;font-size:13px;font-weight:700;color:var(--sc)}
.sf-A1{--sc:#059669}.sf-A2L{--sc:#D97706}.sf-A2{--sc:#EA580C}.sf-A3{--sc:#DC2626}.sf-B1{--sc:#7C3AED}.sf-B2L{--sc:#9333EA}
.chip.sfc{background:color-mix(in srgb,var(--sc) 12%,#fff);color:var(--sc)}

.ref-table .ref-num{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.ref-table .dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.gwp-bar{display:block;height:5px;width:var(--w);max-width:120px;min-width:4px;border-radius:var(--r-pill);background:linear-gradient(90deg,#10B981,#F59E0B 55%,#DC2626);margin-bottom:5px;background-size:120px 100%}

.retro-list{display:flex;flex-direction:column;gap:14px}
.retro-row{display:grid;grid-template-columns:200px 36px 1fr;align-items:center;gap:16px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);padding:18px 20px;box-shadow:var(--shadow-soft)}
.retro-old{display:flex;flex-direction:column}
.ro-label{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}
.ro-num{font-size:24px;font-weight:800;color:var(--text)}
a.ro-num:hover{color:var(--primary)}
.ro-meta{font-size:12.5px;color:var(--text-muted)}
.retro-arrow{font-size:22px;color:var(--primary);text-align:center;font-weight:700}
.retro-alts{display:flex;flex-wrap:wrap;gap:10px}
.alt-card{display:flex;flex-direction:column;gap:2px;min-width:170px;padding:12px 14px;border:1px solid var(--border);border-left:4px solid var(--c);border-radius:var(--r);background:#fff;color:var(--text);transition:.15s}
.alt-card:hover{border-color:var(--c);transform:translateY(-2px);box-shadow:var(--shadow-soft)}
.ac-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.ac-top b{font-size:15.5px}
.ac-meta{font-size:12px;color:var(--text-muted)}
.ac-save{font-size:12px;font-weight:700;color:#059669}
.ac-prod{font-size:12px;font-weight:700;color:var(--primary);margin-top:4px}
.alt-card.no-prod{border-style:dashed;border-left-style:solid;opacity:.85}
.ro-prod{font-size:12.5px;font-weight:700;margin-top:4px}

.doc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px}
.doc-card{background:#fff;border:1px solid var(--border-soft);border-radius:var(--r);padding:18px;box-shadow:var(--shadow-soft);display:flex;flex-direction:column;gap:14px;transition:.2s}
.doc-card:hover{box-shadow:var(--shadow-lift)}
.dc-head{display:flex;gap:12px;align-items:center}
.dc-ic{width:46px;height:46px;flex:0 0 auto;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;color:var(--c);background:color-mix(in srgb,var(--c) 12%,#fff)}
.dc-name{font-weight:700;color:var(--text);font-size:15px;line-height:1.35}
.dc-name:hover{color:var(--primary)}
.dc-meta{font-size:12.5px;color:var(--text-muted)}
.dc-docs{display:flex;gap:8px;flex-wrap:wrap}
.dc-doc{flex:1 1 30%;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:10px 12px;border:1px solid var(--border);border-radius:var(--r-sm);color:var(--text);font-size:13px;font-weight:700;transition:.15s;min-width:92px}
.dc-doc svg{width:17px;height:17px;color:#dc2626;flex:0 0 auto}
.dc-doc em{font-style:normal;font-size:11.5px;font-weight:600;color:var(--primary)}
.dc-doc:hover{border-color:var(--primary);background:var(--primary-soft)}
.dc-doc.ready em{color:#059669}

/* ---------- About: brand panels ---------- */
.brand-panels{display:flex;flex-direction:column;gap:20px;margin-top:24px}
.brand-panel{display:grid;grid-template-columns:240px 1fr;gap:32px;background:#fff;border:1px solid var(--border-soft);border-radius:var(--r-lg);padding:28px;box-shadow:var(--shadow-soft)}
.bp-side{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding-right:28px;border-right:1px solid var(--border-soft)}
.bp-logo{width:100%;aspect-ratio:16/9;border-radius:var(--r);display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:800;background:linear-gradient(135deg,#EDEEF9,#EEF3FA);color:var(--primary);overflow:hidden}
.brand-panel.dist .bp-logo{background:linear-gradient(135deg,#EEF3FA,#ecfeff);color:var(--secondary)}
.bp-logo img{max-width:80%;max-height:70%;object-fit:contain}
.bp-count{font-size:14px;color:var(--text-muted)}
.bp-count b{font-size:26px;color:var(--text);margin-right:4px}
.bp-body h3{font-size:24px;font-weight:800}
.bp-tag{color:var(--primary);font-weight:600;margin:2px 0 12px}
.bp-grades{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 18px}
.grade-mini{font-size:12.5px;font-weight:700;padding:5px 10px;border-radius:var(--r-pill);border:1px solid var(--border);color:var(--text);border-left:3px solid var(--c)}
.grade-mini:hover{border-color:var(--c);color:var(--primary)}

@media (max-width:1100px){.safety-grid{grid-template-columns:repeat(3,1fr)}.tech-cards{grid-template-columns:1fr 1fr}}
@media (max-width:768px){.art-head h1{font-size:28px}.art-body{font-size:15.5px}}
@media (max-width:900px){
  .tech-cards{grid-template-columns:1fr}
  .retro-row{grid-template-columns:1fr;gap:10px}
  .retro-arrow{display:none}
  .brand-panel{grid-template-columns:1fr;gap:18px}
  .bp-side{padding-right:0;border-right:none;border-bottom:1px solid var(--border-soft);padding-bottom:18px}
  .bp-logo{max-width:260px}
}
@media (max-width:768px){
  .tech-band{padding:32px 22px 56px;border-radius:var(--r-lg)}
  .tech-band h1{font-size:30px}
  .tech-tabs{margin:-28px 8px 0}
  .tech-tabs a{flex:0 0 auto;padding:10px 14px}
  .safety-grid{grid-template-columns:1fr 1fr}
  .class-groups{grid-template-columns:1fr}
}

/* 404 / thanks */
.center-msg{padding:96px 0;text-align:center}
.center-msg h1{font-size:64px;font-weight:800}
.center-msg p{color:var(--text-muted);margin:12px auto 28px;max-width:48ch}

/* responsive */
@media (max-width:900px){.hero-grid{grid-template-columns:1fr;gap:32px}.hero h1{font-size:38px}.hero-card{transform:none}.ct-grid{grid-template-columns:1fr;gap:28px}.ref-hero{grid-template-columns:1fr}.ref-hero .cyl{max-width:220px}}
@media (max-width:768px){
  .container{padding:0 16px}
  .section{padding:44px 0}
  .section h2{font-size:26px}
  .page-head h1,.ct-info h1,.ab-hero h1,.ref-hero h1{font-size:30px}
  .row2{grid-template-columns:1fr}
  .trust{padding:36px 20px}
  .q-input{min-width:0;width:100%}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.hero-card{transform:none!important}}

/* =====================================================================
   INDUSTRIAL PREMIUM LAYER (bright) — white surfaces, 1px rules,
   brand-blue accents, mono spec numerals, uppercase kickers.
   Overrides the base rules above.
   ===================================================================== */
body{background:var(--bg);font-feature-settings:"tnum" 1}
h1,h2,h3,h4,.display{letter-spacing:-.015em}
.grad-text{background:none;-webkit-background-clip:initial;background-clip:initial;color:var(--primary)}
.grad-bg{background:var(--primary)}
.grad-bg:hover{background:var(--primary-dark)}
::selection{background:var(--primary);color:#fff}
:focus-visible{outline:2px solid var(--secondary);outline-offset:2px}
.blueprint{background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);background-size:32px 32px}

/* skip link */
.skip-link{position:absolute;left:16px;top:-60px;z-index:300;background:var(--primary);color:#fff;font-weight:600;padding:10px 16px;border-radius:var(--r-sm);transition:top .15s}
.skip-link:focus{top:12px}

/* kicker label: small mono caps with a leading rule */
.kicker{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--primary);margin-bottom:10px}
.kicker::before{content:"";width:24px;height:2px;background:var(--accent)}

/* top contact bar (desktop) */
.topbar{background:var(--primary);color:#E3EBFF;font-size:13px}
.topbar .container{display:flex;align-items:center;gap:24px;height:36px}
.topbar a,.topbar span{display:inline-flex;align-items:center;gap:7px;color:#E3EBFF;white-space:nowrap}
.topbar a:hover{color:#fff}
.topbar svg{width:14px;height:14px;opacity:.85}
.topbar .tb-right{margin-left:auto;display:flex;gap:20px}
@media (max-width:1023px){.topbar{display:none}}

/* header: white bar + light nav row */
header.site{background:#fff;backdrop-filter:none;border-bottom:none;box-shadow:0 1px 0 var(--border)}
.nav{height:68px}
.search input{border-radius:var(--r-sm);background:var(--bg);border-color:var(--border)}
.search input:focus{background:#fff;box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}
.lang-switch{border-radius:var(--r-sm);padding:2px}
.lang-switch a,.lang-switch span{border-radius:3px;font-family:var(--mono);font-weight:600;letter-spacing:.04em}
.lang-switch span{background:var(--primary);color:#fff}
.nav-cta{border-radius:var(--r-sm);padding:11px 20px;letter-spacing:.01em}
.nav-cta:hover{transform:none}
.mainnav{background:#fff;border-top:1px solid var(--border-soft)}
.mn-row{height:48px;gap:2px}
.mn-link{color:var(--text);font-size:14.5px;font-weight:500;padding:0 16px}
.mn-link svg{color:var(--text-muted)}
.mn-link:hover,.mn-item.open>.mn-link,.mn-link.active{color:var(--primary);background:var(--primary-soft)}
.mn-item.open>.mn-link svg,.mn-link:hover svg{color:var(--primary)}
.mn-link::after{left:0;right:0;bottom:0;height:3px;border-radius:0;background:var(--primary)}
.mega{border-top:1px solid var(--border);box-shadow:0 30px 60px -24px rgba(16,40,100,.28)}
.mg-title{font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.mg-count{font-family:var(--mono);border-radius:3px}
.mg-list a:hover,.mg-list a.previewing{background:var(--primary-soft);color:var(--primary)}
.mg-feature{background:var(--panel);border-color:var(--border)}
.mg-feature:hover{transform:none;border-color:var(--primary);box-shadow:none}
.mgf-kicker{font-family:var(--mono)}
.mgf-chips i{border-radius:3px;font-family:var(--mono);font-weight:600;border-color:var(--border);color:var(--text)}
.mg-card:hover{background:var(--panel);border-color:var(--primary);box-shadow:none}
.nav-icon-btn{border-radius:var(--r-sm)}

/* breadcrumb */
.breadcrumb{font-size:12.5px;padding-top:22px}
.breadcrumb span{color:#B9C3D1}

/* buttons: rectangular, solid */
.btn{border-radius:var(--r-sm);height:48px;font-weight:600;letter-spacing:.01em}
.btn-primary{background:var(--primary)}
.btn-primary:hover{transform:none;background:var(--primary-dark)}
.btn-ghost{background:#fff;color:var(--primary);border:1px solid #C8C9EA}
.btn-ghost:hover{background:var(--primary-soft);border-color:var(--primary)}
.btn-white{box-shadow:none}
.btn-white:hover{transform:none;background:var(--accent);color:#fff}
.btn-line:hover{transform:none;filter:brightness(.95)}

/* section rhythm */
.section{padding:72px 0}
.section h2{font-size:34px;font-weight:700;letter-spacing:-.02em}
.section .lead{font-size:17px}
.page-head{padding:36px 0 18px;border-bottom:1px solid var(--border);margin-bottom:8px}
.page-head h1{font-size:40px;font-weight:700;letter-spacing:-.02em}
.card{border-color:var(--border);border-radius:var(--r);box-shadow:none}

/* chips / tags: squared, mono */
.chip,.prod-tag{border-radius:3px;font-family:var(--mono);font-weight:600;letter-spacing:.02em}
.chip.v{background:var(--accent-soft);color:#1C7FB0}

/* product card: flat panel, spec footer */
.prod-grid{gap:20px}
.prod-card{border:1px solid var(--border);border-radius:var(--r);box-shadow:none;transition:border-color .2s,box-shadow .2s}
.prod-card:hover{transform:none;border-color:var(--primary);box-shadow:var(--shadow-lift)}
.prod-body{padding:18px 18px 16px;border-top:1px solid var(--border-soft)}
.prod-brand{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase}
.prod-name{font-size:17px;font-weight:600}
.prod-foot{border-top:1px dashed var(--border);margin-top:auto;padding-top:12px}
.prod-foot .sku{font-family:var(--mono);font-size:11.5px}
.prod-foot a{font-weight:600}

/* toolbar / filters / tables */
.toolbar{border-radius:var(--r);border-color:var(--border);box-shadow:none}
.tb-select.on{background-color:var(--primary-soft);border-color:var(--primary);color:var(--primary)}
.view-toggle button{border-radius:3px}
.view-toggle button.active{background:var(--primary);color:#fff;box-shadow:none}
.filter.active{background:var(--primary);border-color:var(--primary);color:#fff}
.table-wrap{border-color:var(--border);border-radius:var(--r);box-shadow:none}
.data-table th{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.08em;background:var(--panel);color:var(--primary);border-bottom:1px solid var(--border)}
.data-table tbody tr:hover td{background:#F7F7FC}

/* home: slider, promos, banner */
.hero-slider-wrap{padding:24px 0 0}
.hero-slider{border-radius:var(--r);box-shadow:none;background:var(--primary)}
.hs-ph{background:linear-gradient(120deg,#23256F,#3E41B8 60%,#5C60D6)}
.hs-ph::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:40px 40px}
.hs-ph::before{background:#7DD3FC;opacity:.3}
.hs-ph-art{border-radius:var(--r);z-index:1}
.hs-content h2{font-weight:700}
.hs-nav{border-radius:var(--r-sm);background:rgba(255,255,255,.18);color:#fff;border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(4px)}
.hs-nav:hover{background:#fff;color:var(--primary)}
.hs-dots button{border-radius:0;height:3px;width:22px;background:rgba(255,255,255,.45)}
.hs-dots button.active{width:40px;background:#fff}
.promo-grid{gap:16px}
.promo-tile{border-radius:var(--r);box-shadow:none;border:1px solid var(--border)}
.promo-tile:hover{transform:none;border-color:var(--primary)}
.promo-tile.is-ph{background:var(--panel);border-color:var(--border)}
.pt-text b{font-weight:600}
.wide-banner{border-radius:var(--r);box-shadow:none}
.wide-banner.is-ph{background:linear-gradient(110deg,#23256F,#3E41B8 55%,#2A9FD8)}
.ph-hint{border-radius:3px;font-family:var(--mono);font-weight:500}

/* home: browse by refrigerant class */
.class-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-top:28px}
.class-tile{display:flex;flex-direction:column;gap:6px;padding:20px;background:#fff;border:1px solid var(--border);border-radius:var(--r);color:var(--text);transition:border-color .2s,box-shadow .2s}
.class-tile:hover{border-color:var(--primary);box-shadow:var(--shadow-lift)}
.ct-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.ct-top b{font-family:var(--mono);font-size:19px;font-weight:600;color:var(--primary)}
.ct-top span{font-family:var(--mono);font-size:12px;color:var(--text-muted)}
.class-tile p{font-size:13px;color:var(--text-muted);line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.class-tile em{font-style:normal;font-size:13px;font-weight:600;color:var(--primary);margin-top:auto;padding-top:6px}

/* brands + stats */
.brand-card{border-color:var(--border);border-radius:var(--r);box-shadow:none}
.brand-card:hover{transform:none;border-color:var(--primary);box-shadow:var(--shadow-lift)}
.brand-card .bl{border-radius:var(--r-sm);background:var(--panel);border:1px solid var(--border-soft)}
.brand-card h3{font-weight:700;margin-top:6px}
.trust{background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:0;overflow:hidden}
.trust-grid{gap:0}
.trust-item{padding:34px 30px;border-right:1px solid var(--border)}
.trust-item:last-child{border-right:none}
.trust-item .n,.trust-item .n.grad-text{font-family:var(--mono);font-weight:600;font-size:38px;color:var(--primary)}
.trust-item .l{font-size:13.5px}
.trust-item::before{content:"";display:block;width:24px;height:3px;background:var(--accent);margin-bottom:16px}

/* about / contact / forms */
.ab-hero h1{font-weight:700}
.ab-card{border-color:var(--border);border-radius:var(--r);box-shadow:none;border-top:3px solid var(--primary)}
.ab-card h3{font-weight:600}
.ct-info h1{font-weight:700}
.ct-form{border-color:var(--border);border-radius:var(--r);box-shadow:none;border-top:4px solid var(--primary)}
.ct-form h2{font-weight:700}
.field label{font-size:12.5px;letter-spacing:.02em}
.field input,.field select,.field textarea{border-color:#C6CFDB;background:#fff}

/* refrigerant / kv */
.ref-hero .cyl{box-shadow:none;border-color:var(--border)}
.ref-hero h1{font-weight:700}
.kv{border-color:var(--border);border-left:3px solid var(--primary)}
.kv .k{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.kv .v{font-family:var(--mono);font-weight:600}

/* articles */
.art-card{border-color:var(--border);box-shadow:none}
.art-card:hover{transform:none;border-color:var(--primary);box-shadow:var(--shadow-lift)}
.art-card .cover{background:var(--panel);background-image:linear-gradient(var(--grid-line) 1px,transparent 1px),linear-gradient(90deg,var(--grid-line) 1px,transparent 1px);background-size:24px 24px}
.cover-ph{color:#A9AADD}
.art-card time{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em}
.art-card h3{font-weight:600}
.art-head h1{font-weight:700}
.art-kicker{border-radius:3px}
.prose table{border-color:var(--border)}

/* documents */
.doc-row,.doc-card{border-color:var(--border);box-shadow:none}
.doc-card:hover,.doc-row:hover{border-color:var(--primary);box-shadow:none}
.doc-ic,.dc-ic{font-family:var(--mono)}
.dc-doc:hover{background:var(--primary-soft);border-color:var(--primary)}

/* technical center: light blueprint band */
.tech-band{background:linear-gradient(135deg,#EDEEF9,#F8F8FD 60%,#EEF3FA);border:1px solid var(--border);color:var(--text)}
.tech-band::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(47,49,146,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(47,49,146,.07) 1px,transparent 1px);background-size:32px 32px}
.tb-glow{display:none}
.tb-kicker{border-radius:3px;font-family:var(--mono);font-weight:600;letter-spacing:.12em;color:var(--primary);background:#fff;border-color:var(--border)}
.tech-band h1{font-weight:700;color:var(--text)}
.tech-band p{color:var(--text-muted)}
.tech-tabs{padding:4px;gap:4px}
.tech-tabs a.active{background:var(--primary);color:#fff}
.tech-card{border-color:var(--border);box-shadow:none}
.tech-card:hover{transform:none;border-color:var(--primary);box-shadow:var(--shadow-lift)}
.tech-card::after{height:3px;background:var(--primary)}
.tc-num{font-family:var(--mono);font-weight:600}
.tech-card h3{font-weight:700}
.class-group{border-color:var(--border);box-shadow:none}
.grade-chip b,.ac-top b,.ro-num,.sf-code{font-family:var(--mono);font-weight:600}
.safety-card{border-color:var(--border);border-top:4px solid var(--sc);box-shadow:none}
.retro-row{border-color:var(--border);box-shadow:none}
.ro-label{font-family:var(--mono)}
.gwp-bar{border-radius:0}

/* about: brand panels */
.brand-panel{border-color:var(--border);box-shadow:none}
.bp-logo,.brand-panel.dist .bp-logo{background:var(--panel);border:1px solid var(--border-soft)}
.bp-count b{font-family:var(--mono);font-weight:600}
.bp-body h3{font-weight:700}
.grade-mini{border-radius:3px;font-family:var(--mono);font-weight:600}

/* footer: light panel + blue band */
footer.site{background:var(--panel);border-top:1px solid var(--border);margin-top:72px}
.ft-band{background:linear-gradient(100deg,#23256F,#3E41B8 60%,#5C60D6)}
.ft-promo{font-family:var(--mono);font-weight:600;font-size:34px;letter-spacing:.06em}
.ft-btn:hover{transform:none}
.ft-btn-w:hover{background:var(--primary-dark);color:#fff;box-shadow:none}
.ft-col h4{font-family:var(--mono);font-size:11.5px;font-weight:600;letter-spacing:.14em;padding-bottom:12px;border-bottom:1px solid var(--border)}
.ft-bot{border-top:1px solid var(--border)}

/* floating contact + back to top */
.fab{position:fixed;right:20px;bottom:20px;z-index:70;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.fab a,.fab button{width:52px;height:52px;border-radius:50%;border:none;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px -8px rgba(16,40,100,.45);transition:transform .15s,opacity .2s}
.fab a:hover,.fab button:hover{transform:translateY(-2px)}
.fab svg{width:24px;height:24px}
.fab-line{background:#06C755;color:#fff}
.fab-phone{background:var(--primary);color:#fff}
.fab-top{background:#fff;color:var(--primary)!important;border:1px solid var(--border)!important;width:44px!important;height:44px!important}
.fab-top svg{transform:rotate(180deg);width:20px;height:20px}
.fab-top[hidden]{display:none}
body.has-sticky .fab{bottom:90px}
@media (max-width:768px){.fab{right:14px;bottom:14px}.fab a,.fab button{width:48px;height:48px}}

/* 404 / thanks */
.center-msg h1{font-family:var(--mono);font-weight:600;font-size:72px;color:var(--primary)}

@media (max-width:768px){
  .section{padding:52px 0}
  .section h2{font-size:27px}
  .page-head h1{font-size:30px}
  .trust-item{padding:24px 20px;border-right:none;border-bottom:1px solid var(--border)}
  .trust-item .n,.trust-item .n.grad-text{font-size:30px}
  .ft-promo{font-size:24px}
  .class-tiles{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){body.has-sticky .fab-phone,body.has-sticky .fab-line{display:none}}
.brand-card .bl{width:128px;background:#fff}

/* ---------- Product card v2: spec card ---------- */
.prod-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.prod-card{position:relative;background:#fff;border:1px solid var(--border);border-radius:var(--r-lg);overflow:hidden;box-shadow:0 1px 2px rgba(16,40,100,.05);transition:border-color .2s,box-shadow .25s,transform .25s}
.prod-card::before{content:"";position:absolute;z-index:3;left:0;right:0;top:0;height:3px;background:var(--c,var(--primary))}
.prod-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--c,var(--primary)) 45%,var(--border));box-shadow:0 18px 36px -18px color-mix(in srgb,var(--c,var(--primary)) 55%,rgba(16,40,100,.4))}
/* media: tank-colour tint, fine grid, grade watermark */
.prod-media{aspect-ratio:1/1;background:radial-gradient(120% 90% at 50% 100%,color-mix(in srgb,var(--c,#2F3192) 30%,#fff),color-mix(in srgb,var(--c,#2F3192) 8%,#fff) 70%)}
.pc-grid{position:absolute;inset:0;z-index:0;background-image:linear-gradient(color-mix(in srgb,var(--c,#2F3192) 10%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--c,#2F3192) 10%,transparent) 1px,transparent 1px);background-size:24px 24px;-webkit-mask:linear-gradient(#000,transparent 85%);mask:linear-gradient(#000,transparent 85%)}
.pc-num{position:absolute;z-index:0;left:0;right:0;top:50%;transform:translateY(-58%);text-align:center;font-family:var(--mono);font-weight:600;font-size:clamp(56px,7vw,92px);letter-spacing:-.04em;line-height:1;color:color-mix(in srgb,var(--c,#2F3192) 13%,transparent);pointer-events:none;white-space:nowrap}
.prod-media .snow-fall{opacity:.55}
.prod-media img{padding:40px 22px 14px}
.prod-media > svg{margin-top:12px}
.prod-card:hover .prod-media img,.prod-card:hover .prod-media > svg{transform:translateY(-6px) scale(1.02)}
.prod-tags{top:14px;left:14px;right:70px}
.prod-tag{background:rgba(255,255,255,.92);backdrop-filter:blur(4px)}
.pc-safety{position:absolute;z-index:2;top:14px;right:14px;min-width:42px;height:26px;padding:0 8px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-sm);background:#fff;border:1.5px solid var(--sc,#059669);color:var(--sc,#059669);font-family:var(--mono);font-size:12px;font-weight:600}
/* body */
.prod-body{padding:16px 18px 18px;gap:8px;border-top:1px solid var(--border-soft)}
.prod-brand{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.prod-brand .dot{width:8px;height:8px}
.prod-name{font-size:17.5px;font-weight:700;line-height:1.3;margin:0}
.prod-name a{color:var(--text)}
.prod-name a::after{content:"";position:absolute;inset:0;z-index:1}
.prod-card:hover .prod-name a{color:var(--primary)}
.pc-tag{font-size:13px;color:var(--text-muted);line-height:1.5;margin-top:-4px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.pc-specs{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--border);border-radius:var(--r-sm);background:var(--panel);margin-top:2px}
.pc-specs div{padding:8px 10px;border-right:1px solid var(--border);min-width:0}
.pc-specs div:last-child{border-right:none}
.pc-specs dt{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.1em;color:var(--text-muted)}
.pc-specs dd{font-family:var(--mono);font-size:15px;font-weight:600;color:var(--text);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pc-pack{display:flex;flex-wrap:wrap;gap:6px}
.pc-pack span{font-family:var(--mono);font-size:11.5px;font-weight:500;padding:3px 8px;border-radius:3px;border:1px solid var(--border);color:var(--text);background:#fff}
.prod-foot{display:flex;gap:8px;align-items:center;border-top:none;margin-top:auto;padding-top:6px}
.prod-foot a{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:6px;height:38px;border-radius:var(--r-sm);font-size:13.5px;font-weight:600;white-space:nowrap;transition:background .15s,color .15s,border-color .15s}
.pc-go{flex:1;background:var(--primary);color:#fff!important}
.pc-go:hover{background:var(--primary-dark)}
.pc-go span{transition:transform .2s}
.prod-card:hover .pc-go span{transform:translateX(3px)}
.pc-quote{padding:0 14px;border:1px solid #C8C9EA;color:var(--primary)!important;background:#fff}
.pc-quote:hover{background:var(--primary-soft);border-color:var(--primary)}
@media (max-width:560px){
  .prod-grid{grid-template-columns:1fr 1fr;gap:12px}
  .prod-body{padding:12px 12px 14px;gap:7px}
  .prod-name{font-size:15px}
  .pc-tag,.pc-pack{display:none}
  .pc-specs{grid-template-columns:1fr 1.25fr 1fr}
  .pc-specs div{padding:6px 6px}
  .pc-specs dt{font-size:9px;letter-spacing:.06em}
  .pc-specs dd{font-size:12.5px}
  .pc-go{flex:none}
  .prod-brand{font-size:10px;letter-spacing:.05em}
  .prod-foot{flex-direction:column;align-items:stretch;gap:6px}
  .prod-foot a{height:36px;font-size:13px}
  .prod-tags{left:10px;top:10px;right:56px}
  .pc-safety{top:10px;right:10px;min-width:36px;height:22px;font-size:11px}
  .prod-media img{padding:34px 12px 10px}
}
@media (prefers-reduced-motion:reduce){.prod-card,.prod-card:hover{transform:none}}
.pc-ref{color:color-mix(in srgb,var(--c,var(--primary)) 82%,#0F1A2E)}

/* ---------- Main menu v2 ---------- */
.mn-row{gap:4px}
.mg-products{grid-template-columns:1.15fr 1fr .85fr 1.1fr 250px;gap:28px}
.mg-sub{min-height:1.4em}
.mg-brands{gap:8px}
.mg-brands .mg-title{margin-bottom:6px}
.mg-brand{display:flex;align-items:center;gap:12px;padding:10px;border:1px solid var(--border);border-radius:var(--r);color:var(--text);transition:border-color .15s,background .15s}
.mg-brand:hover{border-color:var(--primary);background:var(--panel)}
.mgb-logo{width:76px;height:40px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;border-radius:var(--r-sm);background:#fff;border:1px solid var(--border-soft);font-weight:700;color:var(--primary)}
.mgb-logo img{max-width:64px;max-height:28px;object-fit:contain}
.mgb-txt{display:flex;flex-direction:column;min-width:0}
.mgb-txt b{font-size:14.5px}
.mgb-txt span{font-size:12px;color:var(--text-muted)}
.mg-all{display:flex;align-items:center;gap:8px;margin-top:4px;padding:10px 12px;border-radius:var(--r);background:var(--primary);color:#fff!important;font-weight:600;font-size:14px}
.mg-all .mg-count{background:rgba(255,255,255,.18);border-color:transparent;color:#fff}
.mg-all .mg-arrow{margin-left:auto;transition:transform .15s}
.mg-all:hover{background:var(--primary-dark)}
.mg-all:hover .mg-arrow{transform:translateX(3px)}
.mg-apps a{gap:10px}
.mg-apps img{width:26px;height:26px;flex:0 0 auto}
.mg-apps a span:not(.mg-count){flex:1}
@media (max-width:1200px){
  .mg-products{grid-template-columns:1.1fr 1fr .9fr 1.1fr;gap:22px}
  .mg-products .mg-feature{display:none}
}
/* drawer: application shortcuts */
.dr-apps{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:4px}
.dr-apps a{display:flex;align-items:center;gap:8px;padding:8px;border:1px solid var(--border-soft);border-radius:var(--r-sm);font-size:13.5px;color:var(--text)}
.dr-apps img{width:24px;height:24px;flex:0 0 auto}
.dr-link.dr-hl{color:var(--primary)}
/* logo: ORAFON REFRIGERANT + penguin (2.42:1) */
.logo img{height:46px}
.ft-brand img{height:60px}
@media (max-width:1023px){.logo img{height:40px}}

/* ---------- Home hero v2: product-driven slides ---------- */
.hero-slider{border-radius:var(--r-lg);aspect-ratio:auto;height:clamp(420px,36vw,500px)}
.hs-slide.is-prod{color:#fff}
.hx-bg{position:absolute;inset:0;overflow:hidden;background:
  radial-gradient(70% 120% at 78% 50%,color-mix(in srgb,var(--c) 55%,#fff) 0%,transparent 60%),
  linear-gradient(115deg,color-mix(in srgb,var(--c) 55%,#0B1630) 0%,color-mix(in srgb,var(--c) 80%,#2F3192) 55%,color-mix(in srgb,var(--c) 70%,#fff) 100%)}
.hx-bg::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:40px 40px;-webkit-mask:linear-gradient(90deg,transparent,#000 40%);mask:linear-gradient(90deg,transparent,#000 40%)}
.hx-num{position:absolute;right:-1%;bottom:-6%;font-family:var(--mono);font-weight:700;font-size:clamp(140px,19vw,260px);line-height:1;letter-spacing:-.05em;color:rgba(255,255,255,.12);white-space:nowrap}
.hx-grid{position:relative;z-index:1;height:100%;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:24px;padding:0 6% 0 7%}
.hx-text{display:flex;flex-direction:column;align-items:flex-start;gap:12px;max-width:600px}
.hx-kicker{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;padding:5px 10px;border-radius:var(--r-sm);background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25)}
.hx-text h2{font-size:clamp(28px,3.4vw,46px);font-weight:700;letter-spacing:-.02em;line-height:1.12;text-shadow:0 2px 18px rgba(0,0,0,.18)}
.hx-text p{font-size:clamp(14.5px,1.25vw,17px);line-height:1.6;color:rgba(255,255,255,.88);max-width:34em}
.hx-specs{display:flex;flex-wrap:wrap;margin-top:4px;border:1px solid rgba(255,255,255,.28);border-radius:var(--r-sm);background:rgba(255,255,255,.1);backdrop-filter:blur(6px)}
.hx-specs div{padding:8px 16px;border-right:1px solid rgba(255,255,255,.22)}
.hx-specs div:last-child{border-right:none}
.hx-specs dt{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.hx-specs dd{font-family:var(--mono);font-size:17px;font-weight:600}
.hx-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.hx-btn{background:#fff;color:color-mix(in srgb,var(--c) 70%,#0F1A2E)!important;height:46px}
.hx-btn:hover{background:#0F1A2E;color:#fff!important}
.hx-btn-o{height:46px;border:1.5px solid rgba(255,255,255,.7);color:#fff!important}
.hx-btn-o:hover{background:rgba(255,255,255,.14)}
.hx-art{position:relative;height:100%;display:flex;align-items:center;justify-content:center}
.hx-disc{position:absolute;width:min(82%,380px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.55),rgba(255,255,255,.08) 62%,transparent 70%)}
.hx-art img,.hx-art>svg{position:relative;max-height:86%;max-width:100%;object-fit:contain;filter:drop-shadow(0 24px 30px rgba(0,0,0,.28));transition:transform .5s}
.hx-art>svg{height:70%;width:auto}
.hs-slide.active .hx-art img,.hs-slide.active .hx-art>svg{animation:hxIn .8s cubic-bezier(.2,.8,.2,1) both}
@keyframes hxIn{from{opacity:0;transform:translateY(24px) scale(.96)}to{opacity:1;transform:none}}
/* bottom bar: progress dots + arrows */
.hs-bar{position:absolute;z-index:4;left:7%;right:6%;bottom:22px;display:flex;align-items:center;gap:10px}
.hs-bar .hs-dots{position:static;flex:1;justify-content:flex-start;gap:8px}
.hs-bar .hs-dots button{width:44px;height:4px;border-radius:2px;background:rgba(255,255,255,.3);overflow:hidden;padding:0}
.hs-bar .hs-dots button span{display:block;height:100%;width:0;background:#fff}
.hs-bar .hs-dots button.active{width:44px;background:rgba(255,255,255,.3)}
.hs-bar .hs-dots button.active span{animation:hsProg 6s linear forwards}
.hero-slider:hover .hs-dots button.active span,.hero-slider:focus-within .hs-dots button.active span{animation-play-state:paused}
@keyframes hsProg{to{width:100%}}
.hs-bar .hs-nav{position:static;transform:none;width:40px;height:40px}
.hs-bar .hs-nav.prev svg{transform:rotate(90deg)}.hs-bar .hs-nav.next svg{transform:rotate(-90deg)}

/* promo tiles v2 */
.promo-tile.is-prod{display:grid;grid-template-columns:44% 1fr;aspect-ratio:auto;min-height:200px;background:#fff;border:1px solid var(--border);color:var(--text)}
.promo-tile.is-prod:hover{border-color:color-mix(in srgb,var(--c) 50%,var(--border));box-shadow:0 18px 36px -20px color-mix(in srgb,var(--c) 60%,rgba(16,40,100,.4))}
.pp-art{position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;background:radial-gradient(110% 80% at 50% 100%,color-mix(in srgb,var(--c) 32%,#fff),color-mix(in srgb,var(--c) 8%,#fff) 75%)}
.pp-num{position:absolute;left:10px;top:8px;font-family:var(--mono);font-weight:700;font-size:30px;letter-spacing:-.03em;color:color-mix(in srgb,var(--c) 75%,#0F1A2E);opacity:.85}
.pp-art img,.pp-art>svg{position:relative;height:84%;width:auto;max-width:90%;object-fit:contain;margin-bottom:8px;filter:drop-shadow(0 12px 14px rgba(15,23,42,.2));transition:transform .35s}
.promo-tile.is-prod:hover .pp-art img,.promo-tile.is-prod:hover .pp-art>svg{transform:translateY(-5px)}
.pp-body{display:flex;flex-direction:column;gap:6px;padding:18px 18px 16px}
.pp-kicker{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted)}
.pp-body b{font-size:17px;line-height:1.3}
.pp-text{font-size:13.5px;color:var(--text-muted);line-height:1.5}
.pp-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:2px}
.pp-chips i{font-style:normal;font-family:var(--mono);font-size:11px;font-weight:600;padding:2px 7px;border-radius:3px;border:1px solid var(--border);background:var(--panel);color:var(--text)}
.pp-chips i[class^="sf-"]{color:var(--sc);border-color:var(--sc);background:#fff}
.pp-body em{font-style:normal;font-size:13.5px;font-weight:600;color:var(--primary);margin-top:auto;padding-top:6px}
.pp-body em span{display:inline-block;transition:transform .2s}
.promo-tile.is-prod:hover .pp-body em span{transform:translateX(3px)}

@media (max-width:1100px){.promo-grid{grid-template-columns:1fr 1fr}.promo-tile.is-prod:last-child:nth-child(odd){grid-column:1/-1}}
@media (max-width:768px){
  .hero-slider{height:auto;aspect-ratio:auto}
  .hs-slide{position:relative;display:none}
  .hs-slide.active{display:block}
  .hs-slide:not(.is-prod){aspect-ratio:4/5}
  .hx-grid{grid-template-columns:1fr;padding:22px 20px 70px;gap:8px}
  .hx-art{order:-1;height:220px}
  .hx-disc{width:220px}
  .hx-text{gap:10px}
  .hx-specs div{padding:6px 10px}
  .hx-specs dd{font-size:14px}
  .hx-cta .btn{flex:1}
  .hx-num{font-size:120px;top:6px;bottom:auto;right:-4%}
  .hs-bar{left:20px;right:20px;bottom:18px}
  .hs-bar .hs-nav{display:flex;width:36px;height:36px}
  .promo-grid{grid-template-columns:1fr}
  .promo-tile.is-prod{grid-template-columns:40% 1fr;min-height:170px}
  .promo-tile.is-prod:last-child:nth-child(odd){grid-column:auto}
}
@media (prefers-reduced-motion:reduce){.hs-bar .hs-dots button.active span{animation:none;width:100%}.hs-slide.active .hx-art img{animation:none}}
@media (max-width:768px){
  .hx-cta{flex-direction:column;align-items:stretch;width:100%}
  .hx-cta .btn{flex:none;height:44px;font-size:14.5px}
  .hx-specs{display:grid;grid-template-columns:repeat(3,1fr);width:100%}
  .hx-specs div:nth-child(3){border-right:none}
  .hx-specs div:nth-child(4){grid-column:1/-1;border-top:1px solid rgba(255,255,255,.22);border-right:none}
}

/* ---------- Wide layout (container 1600px) ---------- */
.container{padding-left:clamp(16px,3vw,48px);padding-right:clamp(16px,3vw,48px)}
.ft-wrap{max-width:var(--container);padding-left:clamp(16px,3vw,48px);padding-right:clamp(16px,3vw,48px)}
.search{max-width:640px}
.prod-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
@media (min-width:1500px){.mg-products{grid-template-columns:1.15fr 1fr .85fr 1.1fr 300px}.hero-slider{height:clamp(460px,32vw,560px)}}
@media (max-width:560px){.prod-grid{grid-template-columns:1fr 1fr}}

/* ---------- Product backgrounds: plain light blue + brand logo (replaces tank tint, snow, grid, grade number) ---------- */
:root{--prod-bg:#E8F2FB;--prod-bg-2:#DCEBF8}
.prod-media,.pp-art{background:var(--prod-bg)}
.prod-media .snow-fall,.pc-grid,.pc-num,.pp-num{display:none}
.pc-logo,.pp-logo,.pd-logo,.hx-logo{position:absolute;z-index:2;background:no-repeat left center/contain;pointer-events:none}
.pc-logo{left:14px;bottom:12px;width:76px;height:24px}
.pp-logo{left:12px;top:12px;width:72px;height:22px}

/* home slides on light blue */
.hs-slide.is-prod{color:var(--text)}
.hx-bg{background:linear-gradient(115deg,var(--prod-bg) 0%,#F4F9FE 55%,var(--prod-bg-2) 100%)}
.hx-bg::before{display:none}
.hx-logo{right:4%;bottom:7%;width:min(34%,420px);height:30%;background-position:right bottom;opacity:.09;z-index:0}
.hx-kicker{background:#fff;border-color:var(--border);color:var(--primary)}
.hx-text h2{color:var(--text);text-shadow:none}
.hx-text p{color:var(--text-muted)}
.hx-specs{background:#fff;border-color:var(--border);backdrop-filter:none}
.hx-specs div{border-right-color:var(--border)}
.hx-specs dt{color:var(--text-muted)}
.hx-specs dd{color:var(--text)}
.hx-btn{background:var(--primary);color:#fff!important}
.hx-btn:hover{background:var(--primary-dark)}
.hx-btn-o{border-color:var(--primary);color:var(--primary)!important;background:#fff}
.hx-btn-o:hover{background:var(--primary-soft)}
.hx-disc{background:radial-gradient(circle,#fff,rgba(255,255,255,.4) 60%,transparent 70%)}
.hx-art img,.hx-art>svg{filter:drop-shadow(0 22px 26px rgba(15,23,42,.2))}
.hs-bar .hs-dots button,.hs-bar .hs-dots button.active{background:rgba(47,49,146,.18)}
.hs-bar .hs-dots button span{background:var(--primary)}
.hs-slide.is-prod~.hs-bar .hs-nav,.hs-bar .hs-nav{background:#fff;color:var(--primary);border-color:var(--border)}
.hs-bar .hs-nav:hover{background:var(--primary);color:#fff}
@media (max-width:768px){
  .hx-logo{right:16px;top:16px;bottom:auto;width:110px;height:34px;background-position:right top;opacity:.85}
  .hx-specs div:nth-child(4){border-top-color:var(--border)}
}
.brand-h1{margin-top:14px;line-height:1}
.brand-h1 img{display:block;height:60px;width:auto;max-width:100%}
@media (max-width:768px){.brand-h1 img{height:44px}}

/* real product photos (file name contains "-photo-"): fill the frame instead of floating on the background */
.prod-media img[src*="-photo-"]{padding:0;object-fit:cover;object-position:center;filter:none}
.prod-card:hover .prod-media img[src*="-photo-"]{transform:scale(1.03)}
.pp-art img[src*="-photo-"]{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;object-fit:cover;filter:none}
.hx-art img[src*="-photo-"]{max-height:80%;aspect-ratio:1;object-fit:cover;border-radius:var(--r-lg);border:6px solid #fff;box-shadow:0 24px 40px -18px rgba(15,23,42,.45);filter:none}
.mgf-art img[src*="-photo-"]{object-fit:cover;border-radius:var(--r);filter:none}
.prod-media:has(img[src*="-photo-"]) .pc-logo,.main-img:has(img[src*="-photo-"]) .pd-logo{background-color:rgba(255,255,255,.92);background-origin:content-box;border-radius:4px;padding:5px 8px;box-shadow:0 2px 8px rgba(15,23,42,.15)}
.prod-media:has(img[src*="-photo-"]) .pc-logo{width:92px;height:32px}

/* ===== products mega v3: categories | products by brand | preview (widths agreed from the mockup) ===== */
.mg3{grid-template-columns:255px minmax(0,1fr) 310px;gap:0;padding:0;min-height:320px}
.mg3-cats{display:flex;flex-direction:column;gap:6px;padding:22px 18px;background:#F5F8FC;border-right:1px solid var(--border-soft)}
.mg3-cats .mg-title{margin-bottom:6px}
.mg3-cat{display:flex;align-items:center;gap:12px;padding:9px 12px;border:1px solid transparent;border-radius:12px;color:var(--text);transition:.15s}
.mg3-cat img{width:46px;height:46px;object-fit:contain;flex:none}
.mg3-cat b{display:block;font-size:15px}
.mg3-cat small{color:var(--muted);font-size:12.5px}
.mg3-cat .mg-arrow{margin-left:auto;color:var(--primary,#2F3192);opacity:0;transition:.15s}
.mg3-cat:hover{background:#fff;border-color:var(--border-soft)}
.mg3-cat.is-on{background:#fff;border-color:var(--primary,#2F3192);box-shadow:0 4px 14px rgba(47,49,146,.12)}
.mg3-cat.is-on b{color:var(--primary,#2F3192)}
.mg3-cat.is-on .mg-arrow{opacity:1}
.mg3-cats .mg-all{margin-top:auto}
.mg3-mid{padding:22px 26px;min-width:0}
.mg3-brand + .mg3-brand{margin-top:18px}
.mg3-bh{display:flex;align-items:center;gap:10px;padding-bottom:8px;margin-bottom:8px;border-bottom:1px solid var(--border-soft)}
.mg3-bh .mgb-logo{width:auto;height:auto;padding:0;background:none;border:0}
.mg3-bh .mgb-logo img{height:26px;width:auto;max-width:120px;max-height:none;object-fit:contain}
.mg3-sub{color:var(--muted);font-size:12.5px}
.mg3-more{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--primary,#2F3192)}
.mg3-links{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px 16px}
.mg3-links a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mg3 .mg-feature{margin:18px;border-left:0}
@media (max-width:1279px){.mg3{grid-template-columns:230px minmax(0,1fr) 270px}.mg3-cat{gap:9px;padding:8px 9px}.mg3-cat img{width:36px;height:36px}.mg3-cat b{font-size:14px;white-space:nowrap}.mg3-links{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dr-cats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:4px 0 6px}
.dr-cats a{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border:1px solid var(--border-soft);border-radius:var(--r-sm);background:var(--prod-bg,#E8F2FB);font-size:13px;font-weight:600;text-align:center;color:var(--text)}
.dr-cats img{width:40px;height:40px;object-fit:contain}
/* oil-type sub-headings inside the products mega menu */
.mg3-type{display:flex;align-items:baseline;gap:8px;margin:10px 0 2px;padding:0 10px;font-size:12.5px;color:var(--muted)}
.mg3-type b{font-size:13px;letter-spacing:.04em;color:var(--primary,#2F3192)}
.mg3-type .mg-count{margin-left:2px}
.mg3-type:hover b{text-decoration:underline}
.mg3-bh + .mg3-type{margin-top:4px}
/* ORAFON's logo is taller than wide-format Solstice's: give it more height so both read the same width (~100px) */
.mg3-bh[data-brand="orafon"] .mgb-logo img{height:40px;max-height:none}
/* products mega v3: bigger product preview — taller art area, cut-out images zoomed past their transparent padding */
.mg3 .mg-feature{margin:14px;padding:14px 16px 16px}
.mg3 .mgf-art{min-height:250px;margin-bottom:10px}
.mg3 .mgf-art img:not([src*="-photo-"]){transform:scale(1.22);transform-origin:50% 92%}
.mg3 .mgf-art::after{width:170px}
/* products mega v3, oils: one column per base oil (PAG / POE / PVE), grades listed with their pack sizes */
.mg3-oils{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,30px);margin-top:4px}
.mg3-oil{--oc:#2F3192;--ob:#E8F2FB;min-width:0}
.mg3-oil[data-oil="PAG"]{--oc:#2A9FD8}
.mg3-oil[data-oil="PVE"]{--oc:#0F766E}
.mg3-oil-head{display:flex;align-items:center;gap:12px;padding:4px 0 12px;margin-bottom:6px;border-bottom:2px solid var(--border-soft);color:var(--text)}
.mg3-oil-head b{display:grid;place-items:center;min-width:46px;height:32px;padding:0 8px;border-radius:8px;background:var(--oc);color:#fff;font-size:13.5px;letter-spacing:.04em}
.mg3-oil-head span{display:flex;flex-direction:column;line-height:1.35;min-width:0}
.mg3-oil-head em{font-style:normal;font-size:13.5px;font-weight:700}
.mg3-oil-head small{font-size:12.5px;color:var(--muted)}
.mg3-oil-head:hover em{color:var(--oc)}
.mg3-oil-rows{list-style:none;margin:0;padding:0}
.mg3-oil-rows a{display:grid;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 8px;border-radius:9px;font-size:14.5px;color:var(--text)}
.mg3-oil-rows .dot{width:8px;height:8px;border-radius:50%;background:var(--oc)}
.mg3-oil-rows .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mg3-oil-rows small{font-family:var(--mono);font-size:11.5px;color:var(--muted);white-space:nowrap}
.mg3-oil-rows a:hover,.mg3-oil-rows a.previewing{background:var(--ob);color:var(--oc)}

/* ===== quote list ("cart" for quotations): header button, toast, /quote/ page ===== */
.nav-quote{position:relative;display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 14px;border:1px solid var(--border);border-radius:var(--r-pill);background:#fff;color:var(--primary);font-size:14px;font-weight:600;white-space:nowrap}
.nav-quote svg{width:19px;height:19px}
.nav-quote:hover{border-color:var(--primary)}
.nq-count{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#E5484D;color:#fff;font-size:11.5px;font-weight:700;line-height:1}
.nq-count[hidden]{display:none}
.nav-quote .nq-count{position:absolute;top:-6px;right:-6px;border:2px solid #fff;min-width:22px;height:22px}
@media (max-width:1023px){.nav-quote{width:40px;padding:0;justify-content:center}.nav-quote .nq-txt{display:none}}
.quote-toast{position:fixed;left:50%;bottom:24px;z-index:200;display:flex;align-items:center;gap:16px;max-width:calc(100% - 32px);padding:12px 14px 12px 18px;border-radius:12px;background:#1B2440;color:#fff;font-size:14px;box-shadow:0 12px 30px rgba(15,23,42,.3);transform:translate(-50%,140%);opacity:0;transition:.25s}
.quote-toast.show{transform:translate(-50%,0);opacity:1}
.quote-toast a{flex:none;padding:7px 12px;border-radius:8px;background:#fff;color:var(--primary);font-weight:700}
.qt{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:36px;align-items:start;padding-top:20px;padding-bottom:64px}
.qt-head{display:flex;align-items:center;justify-content:space-between;gap:16px}
.qt-head h1{font-size:30px;font-weight:700}
.qt-n{color:var(--muted);font-weight:600}
.qt-clear{border:none;background:none;color:var(--muted);font-size:13.5px;text-decoration:underline;cursor:pointer}
.qt-lead{color:var(--muted);margin:6px 0 20px}
.qt-items{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.qt-item{display:grid;grid-template-columns:72px minmax(0,1fr) auto auto;align-items:center;gap:16px;padding:12px 14px;background:#fff;border:1px solid var(--border);border-radius:var(--r)}
.qt-img{display:grid;place-items:center;width:72px;height:72px;border-radius:10px;background:var(--prod-bg,#E8F2FB);overflow:hidden}
.qt-img img{width:100%;height:100%;object-fit:contain;padding:6px}
.qt-img img[src*="-photo-"]{object-fit:cover;padding:0}
.qt-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.qt-txt b{font-size:15.5px;color:var(--text)}
.qt-txt a:hover b{color:var(--primary)}
.qt-txt span{font-size:13.5px;color:var(--muted)}
.qt-del{width:34px;height:34px;border:none;border-radius:50%;background:none;color:var(--muted);font-size:15px;cursor:pointer}
.qt-del:hover{background:#FEE4E2;color:#B42318}
.qt-more{display:inline-block;margin-top:14px;font-weight:600;color:var(--primary)}
.qt-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:48px 24px;text-align:center;background:#fff;border:1px dashed var(--border);border-radius:var(--r)}
.qt-empty-ic svg{width:44px;height:44px;color:var(--primary)}
.qt-empty b{font-size:18px}
.qt-empty p{color:var(--muted);margin:0 0 8px}
.qt-form{position:sticky;top:96px}
.qt-form h2{font-size:20px;margin-bottom:14px}
.qt .pd-qty{display:inline-flex;align-items:center;height:40px;border:1px solid #C8C9EA;border-radius:999px;overflow:hidden;background:#fff}
.qt .pd-qty button{width:36px;height:100%;border:none;background:none;font-size:18px;color:var(--text);cursor:pointer}
.qt .pd-qty button:hover{background:var(--panel)}
.qt .pd-qty input{width:52px;height:100%;border:none;border-left:1px solid var(--border);border-right:1px solid var(--border);text-align:center;font-family:var(--mono);font-size:15px;font-weight:600;-moz-appearance:textfield}
.qt .pd-qty input::-webkit-outer-spin-button,.qt .pd-qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
@media (max-width:900px){.qt{grid-template-columns:1fr;gap:24px}.qt-form{position:static}}
@media (max-width:560px){.qt-head h1{font-size:23px}.qt-item{grid-template-columns:56px minmax(0,1fr) auto;gap:10px}.qt-img{width:56px;height:56px}.qt-item .pd-qty{grid-column:2;justify-self:start}.qt-del{grid-row:1;grid-column:3}}
/* eco badge: leaf + green, for products with GWP < 150 and no ozone depletion */
.prod-tag.lb-eco{display:inline-flex;align-items:center;gap:4px;background:#ECFDF3;color:#067647;border-color:#ABEFC6}
.prod-tag.lb-eco svg{width:13px;height:13px;flex:none;stroke-width:2.2}
.prod-media .prod-tag.lb-eco{background:rgba(236,253,243,.95)}
/* products mega v3, other products: two columns of rows with type / pack sizes on the right */
.mg3-rows2{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px clamp(16px,2vw,30px)}
.mg3-rows2 a{display:grid;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 10px;border-radius:9px;font-size:14.5px;color:var(--text)}
.mg3-rows2 .dot{width:8px;height:8px;border-radius:50%}
.mg3-rows2 .nm{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mg3-rows2 small{font-family:var(--mono);font-size:11.5px;color:var(--muted);white-space:nowrap}
.mg3-rows2 a:hover,.mg3-rows2 a.previewing{background:var(--prod-bg,#E8F2FB);color:var(--primary)}
/* products table view: compressor-oil comparison (PAG / POE / PVE colours match the menu) */
.oil-table .num{font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
.oil-table .dot{background:#2F3192}
.ot-badge{display:inline-grid;place-items:center;min-width:42px;height:24px;padding:0 8px;border-radius:6px;background:#2F3192;color:#fff;font-size:12px;font-weight:700;letter-spacing:.04em}
.ot-PAG.ot-badge,.oil-table .dot.ot-PAG{background:#2A9FD8}
.ot-PVE.ot-badge,.oil-table .dot.ot-PVE{background:#0F766E}

/* about: brand products grouped by category */
.bp-groups{display:flex;flex-direction:column;gap:14px;margin:18px 0 22px;padding:18px 20px;background:var(--panel);border:1px solid var(--border-soft);border-radius:var(--r)}
.bp-group{display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:start}
.bp-group+.bp-group{padding-top:14px;border-top:1px dashed var(--border)}
.bp-group-h{font-size:13px;font-weight:700;color:var(--primary);padding-top:6px;letter-spacing:.02em}
.bp-group-h i{font-style:normal;font-weight:600;font-size:11.5px;color:var(--text-muted);background:#fff;border:1px solid var(--border-soft);border-radius:10px;padding:1px 7px;margin-left:4px}
.bp-groups .bp-grades{margin:0;gap:8px}
.bp-groups .grade-mini{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--border);border-radius:var(--r-sm);padding:6px 11px;font-family:var(--font);font-size:13px;font-weight:600;color:var(--text);transition:border-color .15s,transform .15s,box-shadow .15s}
.bp-groups .grade-mini::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c);flex:none}
.bp-groups .grade-mini:hover{border-color:var(--c);transform:translateY(-1px);box-shadow:0 4px 10px -6px rgba(var(--primary-rgb),.5);color:var(--primary)}
@media (max-width:640px){.bp-group{grid-template-columns:1fr;gap:8px}.bp-group-h{padding-top:0}.bp-groups{padding:14px}}