/* ============================================================
   COOPER & HUNTER — Proximus Engineering Bulgaria
   Brand-accurate premium stylesheet · "Comfort Innovations"
   Colors (derived from the official C&H color logo):
     BRAND BLUE  #1068B0   — PRIMARY (the "Cooper" blue)
     ACCENT RED  #E83038   — secondary accent (the "Hunter" red)
     GRAPHITE    #333333   — dark text / dark surfaces
     WHITE       #FFFFFF
   The duotone blue+red IS the C&H signature — blue carries the
   site, red is used sparingly for punch (CTAs, highlights, "&").
   Font: Inter (modern, technical, full Cyrillic).
   ============================================================ */

:root{
  --brand:      #1068B0;   /* C&H blue — primary */
  --brand-deep: #0C5290;   /* darker blue for hovers */
  --accent:     #E83038;   /* C&H red — accent */
  --accent-deep:#C8202A;
  --graphite:   #333333;
  --graphite-d: #262626;
  --ink:        #1c1c1c;
  --white:      #FFFFFF;
  --craft:      #EEF4FA;   /* pale blue tint for editorial sections */
  --blue:       #DCEBEC;
  --sand:       #F0D9C5;
  --paper:      #FBFCFD;
  --muted:      #6E6E72;
  --line:       rgba(51,51,51,.12);

  /* Brand gradient system (blue #1068B0 + red #E83038) — used as section punctuation.
     Each pairs a base gradient with an opposite-colour radial glow for depth. */
  --grad-blue: radial-gradient(90% 85% at 100% 0%, rgba(232,48,56,.34), transparent 58%), linear-gradient(135deg,#0b4f86 0%,#1068B0 52%,#0a3f6b 100%);
  --grad-red:  radial-gradient(85% 90% at 0% 0%, rgba(16,104,176,.42), transparent 55%), linear-gradient(135deg,#a81824 0%,#E83038 54%,#8f141f 100%);
  --grad-navy: radial-gradient(90% 90% at 100% 100%, rgba(16,104,176,.35), transparent 60%), linear-gradient(150deg,#243247 0%,#18222f 55%,#0f1620 100%);

  --maxw: 1280px;
  --pad: clamp(20px, 5vw, 72px);
  --r: 14px;
  --ease: cubic-bezier(.16,1,.3,1);
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:var(--font); color:var(--ink); background:var(--white);
  line-height:1.6; -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }

.eyebrow{
  font-size:.8rem; letter-spacing:.24em; text-transform:uppercase;
  font-weight:600; color:var(--graphite); margin-bottom:1.1rem; display:block;
}
.eyebrow--red{ color:var(--brand); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:.95rem 1.7rem; border-radius:999px; font-weight:600; font-size:.95rem;
  letter-spacing:.01em; transition:all .4s var(--ease); border:1.5px solid transparent; cursor:pointer;
}
.btn--red{ background:var(--brand); color:#fff; }
.btn--red:hover{ background:var(--brand-deep); transform:translateY(-2px); box-shadow:0 16px 34px rgba(16,104,176,.30); }
.btn--accent{ background:var(--accent); color:#fff; }
.btn--accent:hover{ background:var(--accent-deep); transform:translateY(-2px); box-shadow:0 16px 34px rgba(232,48,56,.32); }
.btn--lineLight{ border-color:rgba(255,255,255,.45); color:#fff; }
.btn--lineLight:hover{ background:rgba(255,255,255,.12); transform:translateY(-2px); }
.btn--line{ border-color:rgba(51,51,51,.3); color:var(--graphite); }
.btn--line:hover{ border-color:var(--brand); color:var(--brand); transform:translateY(-2px); }
.btn--lg{ padding:1.15rem 2.5rem; font-size:1.05rem; }

/* ============================================================
   NAV
   ============================================================ */
.nav{ position:fixed; inset:0 0 auto 0; z-index:50; transition:all .5s var(--ease); }
.nav__inner{
  max-width:var(--maxw); margin:0 auto; padding:1.5rem var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap:2rem;
}
.nav.is-scrolled{
  background:rgba(24,24,27,.82);
  backdrop-filter:saturate(160%) blur(16px); -webkit-backdrop-filter:saturate(160%) blur(16px);
  border-bottom:1px solid rgba(255,255,255,.10);
}
.nav.is-scrolled .nav__inner{ padding-block:.85rem; }

.brand{ display:block; line-height:0; flex-shrink:0; }
.brand__logo{ height:42px; width:auto; transition:height .4s var(--ease); }
.nav.is-scrolled .brand__logo{ height:32px; }
@media(max-width:520px){
  .brand__logo{ height:30px; }
  .nav.is-scrolled .brand__logo{ height:26px; }
}

.nav__links{ display:flex; gap:2.3rem; }
.nav__links a{ font-size:.92rem; font-weight:500; color:rgba(255,255,255,.88); position:relative; transition:color .3s; }
.nav__links a::after{ content:""; position:absolute; left:0; bottom:-6px; height:2px; width:0; background:var(--brand); transition:width .35s var(--ease); }
.nav__links a:hover{ color:#fff; } .nav__links a:hover::after{ width:100%; }

.nav__actions{ display:flex; align-items:center; gap:1.1rem; }
.lang{ background:none; border:1.5px solid rgba(255,255,255,.4); color:#fff; border-radius:999px; padding:.42rem .8rem; font-size:.8rem; font-weight:600; letter-spacing:.05em; cursor:pointer; display:flex; gap:.4rem; transition:all .3s; }
.lang__opt{ opacity:.55; transition:opacity .3s; } .lang__opt.is-active{ opacity:1; color:var(--brand); } .lang__sep{ opacity:.4; }

.burger{ display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; }
.burger span{ width:24px; height:2px; background:#fff; transition:.3s; }

/* ============================================================
   HERO  (graphite-dominant; red only as small accent)
   ============================================================ */
.hero{
  position:relative; min-height:100vh; display:flex; align-items:center;
  color:#fff; padding:120px var(--pad) 56px; overflow:hidden;
  background:radial-gradient(120% 120% at 75% 10%, #3c3c40 0%, #2b2b2e 45%, #1c1c1f 100%);
}
.hero__kv{ position:absolute; right:-6%; bottom:-12%; width:min(70vw,920px); opacity:.05; pointer-events:none; }
.hero__kv img{ width:100%; }
.hero__product{
  position:absolute; right:-4%; top:50%; transform:translateY(-50%);
  width:min(58vw,760px); pointer-events:none;
  filter:drop-shadow(0 40px 80px rgba(0,0,0,.5));
  animation:floaty 9s ease-in-out infinite alternate;
}
@keyframes floaty{ to{ transform:translateY(calc(-50% - 18px)); } }
.hero__product--unit{ top:50%; width:min(70vw,900px); right:-30%; animation:none; }
.hero__content{ position:relative; max-width:680px; z-index:2; }
.hero__prox{ height:34px; width:auto; margin-bottom:1.4rem; opacity:.95; }
.hero__title{
  font-weight:300; line-height:1.02; letter-spacing:-.02em;
  font-size:clamp(2.5rem,6vw,5rem); margin:.4rem 0 1.6rem;
}
.hero__title .strong{ font-weight:700; }
.hero__lead{ font-size:clamp(1.05rem,1.5vw,1.3rem); color:rgba(255,255,255,.82); max-width:540px; margin-bottom:2.4rem; font-weight:300; }
.hero__cta{ display:flex; gap:1rem; flex-wrap:wrap; }
.hero__scroll{ position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:.6rem; font-size:.68rem; letter-spacing:.25em; text-transform:uppercase; color:rgba(255,255,255,.55); z-index:2; }
.hero__scroll i{ width:1px; height:46px; background:linear-gradient(rgba(255,255,255,.7),transparent); animation:scrollPulse 2s ease-in-out infinite; }
@keyframes scrollPulse{ 0%,100%{ opacity:.3; transform:scaleY(.6);} 50%{ opacity:1; transform:scaleY(1);} }

/* ============================================================
   STRIP
   ============================================================ */
.strip{ max-width:var(--maxw); margin:0 auto; padding:3.6rem var(--pad); display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; border-bottom:1px solid var(--line); }
.strip__item{ text-align:center; }
.strip__item b{ font-size:clamp(2.1rem,4vw,3.1rem); font-weight:300; display:block; color:var(--graphite); letter-spacing:-.02em; }
.strip__item b::first-letter{ color:inherit; }
.strip__item span{ font-size:.85rem; color:var(--muted); letter-spacing:.04em; }

/* ============================================================
   SECTION
   ============================================================ */
.section{ max-width:var(--maxw); margin:0 auto; padding:clamp(4.5rem,9vw,8.5rem) var(--pad); }
/* Full-bleed backgrounds that KEEP the exact same content box/left-edge as
   a regular .section (bg painted full-width via box-shadow + clip-path). */
.section--craft{ background:var(--craft); box-shadow:0 0 0 100vmax var(--craft); clip-path:inset(0 -100vmax); }
.section--graphite{ position:relative; background:transparent; color:#fff; }
.section--graphite > *{ position:relative; z-index:1; }
.section--graphite::before{ content:""; position:absolute; inset:0 calc(50% - 50vw); background:var(--grad-navy); z-index:0; }
.section__head{ max-width:680px; margin-bottom:3.4rem; }
.section__title{ font-weight:300; letter-spacing:-.02em; font-size:clamp(2rem,4.4vw,3.4rem); line-height:1.06; margin-bottom:1rem; }
.section__lead{ font-size:1.12rem; color:var(--muted); font-weight:300; }
.section__lead--light{ color:rgba(255,255,255,.7); }

/* ---------- Product cards ---------- */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
.card{ background:var(--white); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; transition:all .5s var(--ease); cursor:pointer; display:flex; flex-direction:column; }
.card:hover{ transform:translateY(-7px); box-shadow:0 30px 60px rgba(51,51,51,.13); }
.card__img{ aspect-ratio:4/3; background:#fff; display:flex; align-items:center; justify-content:center; padding:1.2rem; }
.card__img img{ width:100%; height:100%; object-fit:contain; transition:transform .6s var(--ease); }
.card:hover .card__img img{ transform:scale(1.06); }
.card__body{ padding:1.7rem; display:flex; flex-direction:column; flex:1; }
.card__tag{ font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--brand); margin-bottom:.5rem; }
.card__body h3{ font-size:1.25rem; font-weight:600; margin-bottom:.5rem; }
.card__body p{ font-size:.95rem; color:var(--muted); margin-bottom:1.1rem; flex:1; }
.card__link{ font-size:.88rem; font-weight:600; color:var(--brand); }
.card--feature{ background:var(--grad-navy); color:#fff; justify-content:center; overflow:hidden; }
.card--feature .card__body h3{ color:#fff; } .card--feature .card__body p{ color:rgba(255,255,255,.7); }

/* ============================================================
   STATEMENT BAND  (red-dominant; white only)
   ============================================================ */
.band{ position:relative; background:var(--craft); color:var(--ink); overflow:hidden; padding:clamp(3.5rem,7vw,6rem) var(--pad); text-align:center; }
.band__kv{ display:none; }
.band__inner{ position:relative; max-width:760px; margin:0 auto; }
.band__tag{ font-style:italic; font-weight:300; letter-spacing:.02em; opacity:.85; margin-bottom:.8rem; font-size:1.05rem; }
.band__title{ font-weight:300; font-size:clamp(2rem,4.5vw,3.2rem); letter-spacing:-.02em; line-height:1.1; margin:.4rem 0 .9rem; color:var(--ink); }
.band__lead{ font-weight:400; font-size:1.1rem; max-width:600px; margin:0 auto; color:var(--muted); line-height:1.6; }

/* ---------- Solutions ---------- */
.sol{ display:grid; gap:1.5rem; }
.sol__item{ display:grid; grid-template-columns:1.05fr 1fr; grid-template-areas:"img txt" "panel panel"; align-items:center; column-gap:3rem; row-gap:0; background:var(--white); border-radius:var(--r); overflow:hidden; border:1px solid var(--line); }
.sol__item:nth-child(even){ grid-template-columns:1fr 1.05fr; grid-template-areas:"txt img" "panel panel"; }
.sol__img{ grid-area:img; aspect-ratio:16/11; background:#fff; display:flex; align-items:center; justify-content:center; padding:2rem; }
.sol__img img{ max-height:100%; width:auto; object-fit:contain; }
.sol__txt{ grid-area:txt; padding:2.4rem 2.8rem; }
.sol__txt .num{ font-size:.85rem; font-weight:700; color:var(--brand); letter-spacing:.1em; }
.sol__txt h3{ font-weight:400; font-size:1.9rem; margin:.4rem 0 .7rem; letter-spacing:-.01em; }
.sol__txt p{ color:var(--muted); }

/* ============================================================
   MAP
   ============================================================ */
.map-wrap{ display:grid; grid-template-columns:1fr 330px; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; box-shadow:0 30px 70px rgba(51,51,51,.10); background:var(--white); }
.map{ height:560px; width:100%; }
.map-list{ height:560px; overflow-y:auto; border-left:1px solid var(--line); }
.dealer{ padding:1.1rem 1.3rem; cursor:pointer; transition:background .25s; border-bottom:1px solid var(--line); }
.dealer:hover{ background:var(--paper); }
.dealer .city{ color:var(--brand); font-weight:700; font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; display:block; margin-bottom:.3rem; }
.dealer h4{ font-size:1rem; font-weight:600; margin-bottom:.2rem; }
.dealer span.addr{ display:block; font-size:.85rem; color:var(--muted); }
.map-note{ text-align:center; font-size:.85rem; color:var(--muted); margin-top:1.2rem; }
.dealer-tools{ display:flex; align-items:center; gap:1rem; margin-bottom:1.1rem; }
.dealer-search{ flex:1; max-width:420px; padding:.85rem 1.1rem; border:1px solid var(--line); border-radius:40px;
  font-family:inherit; font-size:.95rem; color:var(--graphite); background:var(--white); transition:border-color .3s var(--ease), box-shadow .3s var(--ease); }
.dealer-search:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 4px rgba(16,104,176,.1); }
.dealer-count{ font-family:var(--mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); white-space:nowrap; }
.pin{ background:var(--brand); width:18px; height:18px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); border:3px solid #fff; box-shadow:0 3px 8px rgba(0,0,0,.3); }
.pin--dist{ background:var(--graphite); }
.pin--dealer{ background:var(--brand); }
.pin--elite{ background:var(--accent); }

/* ---------- Dealer map filter bar (tiers + region + search) ---------- */
.dealer-filter{ margin-bottom:1.5rem; }
.df-row{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-bottom:1rem; }
.dealer-select{ padding:.85rem 1.1rem; border:1px solid var(--line); border-radius:40px; font:inherit; font-size:.9rem;
  color:var(--ink); background:#fff; cursor:pointer; min-width:210px; }
.dealer-select:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 4px rgba(16,104,176,.1); }
.df-tiers{ display:flex; flex-wrap:wrap; gap:.55rem; }
.dchip{ display:inline-flex; align-items:center; gap:.5rem; padding:.5rem .95rem; border:1px solid var(--line); border-radius:40px;
  background:#fff; font:inherit; font-size:.85rem; font-weight:600; color:var(--graphite); cursor:pointer; transition:all .25s var(--ease); }
.dchip:hover{ border-color:var(--brand); color:var(--brand); }
.dchip.is-active{ background:var(--graphite); color:#fff; border-color:var(--graphite); }
.dchip .dot{ width:10px; height:10px; border-radius:50%; flex:none; }
.dchip.is-active .dot{ box-shadow:0 0 0 2px rgba(255,255,255,.55); }
.dot--dist{ background:var(--graphite); } .dot--dealer{ background:var(--brand); } .dot--elite{ background:var(--accent); }
.dtag{ display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:.45rem; vertical-align:middle; }
.dtag--distributor{ background:var(--graphite); } .dtag--dealer{ background:var(--brand); } .dtag--elite{ background:var(--accent); }
.dealer-empty{ text-align:center; color:var(--muted); padding:1.4rem; font-size:.95rem; }

/* ---------- New products / news ---------- */
.news{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.ncard{ background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; display:flex; flex-direction:column;
  transition:transform .4s var(--ease), box-shadow .4s var(--ease); }
.ncard:hover{ transform:translateY(-6px); box-shadow:0 30px 60px rgba(51,51,51,.13); }
.ncard__img{ position:relative; aspect-ratio:4/3; display:grid; place-items:center; padding:1.6rem; background:#fff; border-bottom:1px solid var(--line); }
.ncard__img img{ max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain; }
.ncard__badge{ position:absolute; top:14px; left:14px; background:var(--accent); color:#fff; font-family:var(--mono);
  font-size:.64rem; letter-spacing:.16em; text-transform:uppercase; padding:.35rem .7rem; border-radius:3px; }
.ncard__body{ padding:1.5rem 1.6rem 1.9rem; }
.ncard__tag{ font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--brand); }
.ncard__body h3{ font-size:1.55rem; font-weight:700; margin:.35rem 0 .55rem; letter-spacing:-.01em; }
.ncard__body p{ color:var(--muted); font-size:.95rem; line-height:1.55; margin-bottom:1.1rem; }
@media(max-width:900px){ .news{ grid-template-columns:1fr; max-width:460px; margin-inline:auto; } }

/* ---------- C&H brand heritage ---------- */
.chbrand{ text-align:center; }
.chstats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; max-width:920px; margin:3rem auto 0; }
.chstat b{ display:block; font-size:clamp(2.1rem,4.5vw,3.2rem); font-weight:300; color:var(--graphite); letter-spacing:-.02em; line-height:1; }
.chstat span{ font-size:.86rem; color:var(--muted); }
.chbrand__partner{ margin-top:2.6rem; font-family:var(--mono); font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--brand); }
@media(max-width:620px){ .chstats{ grid-template-columns:repeat(2,1fr); gap:2rem 1rem; } }

/* ============================================================
   REFINEMENTS (2026-07-02)
   ============================================================ */
/* Smoother, modern category tags — was IBM Plex Mono */
.card__tag, .ncard__tag, .phero__eyebrow{ font-family:var(--font); letter-spacing:.08em; font-weight:700; }

/* Refined reveal — fade + gentle rise + soft blur, longer & calmer */
.reveal{ opacity:0; transform:translateY(22px); filter:blur(6px);
  transition:opacity 1s var(--ease), transform 1.1s var(--ease), filter 1s var(--ease);
  transition-delay:calc(var(--i,0) * 80ms); will-change:opacity, transform; }
.reveal.is-in{ opacity:1; transform:none; filter:blur(0); }
@media (prefers-reduced-motion:reduce){ .reveal{ transition:opacity .35s ease; transform:none; filter:none; } }

/* Calmer premium card hover (tilt disabled in JS) */
.card{ transition:transform .5s var(--ease), box-shadow .5s var(--ease); }
.card:hover{ transform:translateY(-6px); box-shadow:0 30px 60px rgba(51,51,51,.13); }

/* Heritage: two-column with Yankees video + USA flag */
.chbrand{ text-align:left; }
.chbrand__grid{ display:grid; grid-template-columns:.88fr 1.12fr; gap:clamp(28px,4vw,64px); align-items:center; }
.chbrand__flag{ display:inline-flex; align-items:center; gap:.6rem; font-size:.8rem; font-weight:700; color:var(--muted); margin-bottom:1.2rem; }
.chbrand__flag svg{ width:30px; height:20px; border-radius:2px; box-shadow:0 1px 3px rgba(0,0,0,.2); display:block; flex:none; }
.chstats{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.9rem 1.5rem; max-width:none; margin:2.4rem 0 0; }
.chstat{ text-align:left; }
.chstat b{ display:block; font-size:clamp(2rem,3.4vw,2.8rem); font-weight:300; color:var(--graphite); letter-spacing:-.02em; line-height:1; }
.chstat span{ font-size:.85rem; color:var(--muted); }
.chbrand__partner{ margin-top:2rem; font-size:.8rem; letter-spacing:.05em; text-transform:uppercase; color:var(--brand); font-weight:700; }
.chvideo{ position:relative; border-radius:var(--r); overflow:hidden; box-shadow:0 30px 70px rgba(51,51,51,.18); background:#111; aspect-ratio:16/10; }
.chvideo video{ width:100%; height:100%; object-fit:cover; display:block; }
.chvideo__tag{ position:absolute; left:16px; bottom:16px; z-index:2; color:#fff; font-weight:700; font-size:.82rem; letter-spacing:.03em; text-shadow:0 1px 10px rgba(0,0,0,.55); display:flex; align-items:center; gap:.5rem; }
.chvideo__tag::before{ content:""; width:8px; height:8px; border-radius:50%; background:var(--accent); box-shadow:0 0 0 4px rgba(232,48,56,.3); }
@media(max-width:860px){ .chbrand__grid{ grid-template-columns:1fr; } .chvideo{ order:-1; } .chstats{ gap:1.6rem 1.2rem; } }

/* ============================================================
   DOWNLOADS
   ============================================================ */
.dl-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.3rem; }
.dl{ display:block; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14); border-radius:var(--r); padding:1.7rem; transition:all .4s var(--ease); }
.dl:hover{ background:rgba(255,255,255,.1); transform:translateY(-5px); border-color:var(--brand); }
.dl__ext{ display:inline-block; font-size:.7rem; font-weight:700; letter-spacing:.1em; color:#fff; background:var(--brand); padding:.25rem .6rem; border-radius:6px; margin-bottom:1.4rem; }
.dl h4{ font-size:1.08rem; font-weight:600; margin-bottom:.4rem; }
.dl__meta{ font-size:.82rem; color:rgba(255,255,255,.55); }
.dl-more{ text-align:center; margin-top:2.6rem; }
.dl-more .btn--lineLight{ border-color:rgba(255,255,255,.45); color:#fff; }

/* Downloads page (light) */
.page{ background:var(--white); }
.page__hero{ padding:9rem var(--pad) 3rem; max-width:var(--maxw); margin:0 auto; }
.page__hero h1{ font-weight:300; font-size:clamp(2.2rem,5vw,3.6rem); letter-spacing:-.02em; margin-bottom:.8rem; }
.page__lead{ color:var(--muted); font-size:1.1rem; max-width:560px; }
.dl-cat{ font-weight:600; font-size:1.3rem; margin:2.5rem 0 1.3rem; padding-bottom:.7rem; border-bottom:1px solid var(--line); }
.dl-cat:first-child{ margin-top:0; }
.dl-grid--light{ grid-template-columns:repeat(4,1fr); }
.dl--light{ background:var(--paper); border:1px solid var(--line); }
.dl--light:hover{ background:#fff; border-color:var(--brand); }
.dl--light h4{ color:var(--ink); }
.dl--light .dl__meta{ color:var(--muted); }
.dl-note{ margin-top:2.5rem; color:var(--muted); font-size:.95rem; }
.dl-note a{ color:var(--brand); }
@media (max-width:980px){ .dl-grid--light{ grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .dl-grid--light{ grid-template-columns:1fr; } }

/* ============================================================
   ABOUT / ENDORSEMENT
   ============================================================ */
.about{ display:grid; grid-template-columns:1.1fr 1fr; gap:4.5rem; align-items:center; }
.about__txt p{ color:var(--muted); margin-top:1rem; }
.about__art{ border-radius:var(--r); overflow:hidden; aspect-ratio:4/3; background:linear-gradient(160deg,#f4f3f1,#fff); display:flex; align-items:center; justify-content:center; padding:2rem; }
.about__art img{ max-height:100%; width:auto; object-fit:contain; }
.endorse{ display:flex; align-items:center; gap:1.1rem; margin-top:2rem; padding-top:1.6rem; border-top:1px solid var(--line); }
.endorse__logo{ height:38px; width:auto; }
.endorse__txt{ display:flex; flex-direction:column; font-size:.85rem; line-height:1.4; }
.endorse__txt b{ font-weight:700; }
.endorse__txt span{ color:var(--muted); }

/* ============================================================
   WHY COOPER & HUNTER — features
   ============================================================ */
.feats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.6rem; }
.feat{ padding:2rem 1.6rem; border:1px solid var(--line); border-radius:var(--r); background:var(--white); transition:all .5s var(--ease); }
.feat:hover{ transform:translateY(-6px); box-shadow:0 26px 50px rgba(51,51,51,.10); border-color:transparent; }
.feat__ic{ width:38px; height:38px; color:var(--brand); margin-bottom:1.3rem; stroke-linecap:round; stroke-linejoin:round; }
.feat h3{ font-size:1.15rem; font-weight:600; margin-bottom:.5rem; }
.feat p{ font-size:.93rem; color:var(--muted); }

/* ============================================================
   TECHNOLOGIES / HEALTHY AIR
   ============================================================ */
.tech__head{ display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; align-items:end; margin-bottom:3.4rem; }
.tech__lead{ font-size:1.08rem; }
.tech__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.6rem; }
.tech__item{ padding:2rem 1.5rem; border:1px solid rgba(255,255,255,.14); border-radius:var(--r); background:rgba(255,255,255,.04); transition:all .5s var(--ease); }
.tech__item:hover{ transform:translateY(-6px); background:rgba(255,255,255,.08); border-color:var(--brand); }
.tech__ic{ width:46px; height:46px; object-fit:contain; margin-bottom:1.2rem; }
.tech__item h3{ font-size:1.15rem; font-weight:600; margin-bottom:.5rem; color:#fff; }
.tech__item p{ font-size:.9rem; color:rgba(255,255,255,.66); }

/* ============================================================
   CONTACT  (graphite; form)
   ============================================================ */
.contact{ background:var(--grad-navy); color:#fff; padding:clamp(4.5rem,9vw,7.5rem) var(--pad); }
.contact__inner{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:4.5rem; align-items:start; }
.contact__info h2{ font-weight:300; font-size:clamp(2rem,4vw,3rem); letter-spacing:-.02em; margin-bottom:1rem; }
.contact__lead{ color:rgba(255,255,255,.72); font-size:1.08rem; margin-bottom:2rem; max-width:440px; }
.offices{ display:grid; grid-template-columns:1fr 1fr; gap:1.8rem; margin-bottom:2.2rem; }
.office{ display:flex; flex-direction:column; gap:.25rem; }
.office__city{ font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--brand); font-weight:700; margin-bottom:.35rem; }
.office a{ font-size:1rem; color:#fff; }
.office a:hover{ color:var(--brand); }
.office__addr{ font-size:.88rem; color:rgba(255,255,255,.6); margin-top:.25rem; }
.contact__iso{ height:80px; width:auto; border-radius:8px; }

.contact__form{ display:flex; flex-direction:column; gap:1.2rem; }
.field{ position:relative; }
.field input, .field textarea{
  width:100%; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16);
  border-radius:12px; padding:1.3rem 1rem .6rem; color:#fff; font-family:var(--font); font-size:1rem; transition:border .3s, background .3s;
}
.field textarea{ resize:vertical; }
.field input:focus, .field textarea:focus{ outline:none; border-color:var(--brand); background:rgba(255,255,255,.09); }
.field label{ position:absolute; left:1rem; top:1rem; color:rgba(255,255,255,.5); font-size:1rem; pointer-events:none; transition:all .25s var(--ease); }
.field input:focus + label, .field input:not(:placeholder-shown) + label,
.field textarea:focus + label, .field textarea:not(:placeholder-shown) + label{
  top:.45rem; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--brand);
}
.contact__form .btn{ align-self:flex-start; margin-top:.4rem; }
.contact__note{ font-size:.82rem; color:rgba(255,255,255,.45); }
.contact__note.is-ok{ color:#7ddf9a; }
.contact__note.is-err{ color:#ff8a8a; }
/* honeypot — hidden from humans, bait for bots */
.hp{ position:absolute !important; left:-9999px !important; width:1px; height:1px; opacity:0; pointer-events:none; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer{ background:#1c1c1f; color:rgba(255,255,255,.65); padding:4.5rem var(--pad) 2rem; }
.footer__inner{ max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1fr 2fr; gap:3rem; }
.footer__logo{ height:24px; width:auto; }
.footer__tag{ font-style:italic; font-weight:300; color:rgba(255,255,255,.5); margin:.8rem 0 1.6rem; }
.footer__prox{ height:30px; width:auto; opacity:.85; }
.footer__iso{ height:64px; width:auto; border-radius:6px; margin-top:1.2rem; }
.footer__cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
.footer__cols h4{ color:#fff; font-size:.95rem; font-weight:600; margin-bottom:1rem; }
.footer__cols a{ display:block; font-size:.9rem; padding:.25rem 0; color:rgba(255,255,255,.58); transition:color .3s; }
.footer__cols a:hover{ color:var(--brand); }
.footer__legal{ max-width:var(--maxw); margin:3rem auto 0; padding-top:1.5rem; border-top:1px solid rgba(255,255,255,.1); display:flex; justify-content:space-between; gap:1rem; font-size:.78rem; color:rgba(255,255,255,.4); }

/* ============================================================
   REVEAL
   ============================================================ */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .9s var(--ease), transform .9s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:980px){
  .nav__links{ display:none; }
  .burger{ display:flex; }
  .hero__product{ opacity:.35; right:-20%; }
  .strip{ grid-template-columns:repeat(2,1fr); gap:2rem; }
  .cards{ grid-template-columns:1fr 1fr; }
  .feats{ grid-template-columns:1fr 1fr; }
  .tech__head{ grid-template-columns:1fr; gap:1.2rem; }
  .tech__grid{ grid-template-columns:1fr 1fr; }
  .contact__inner{ grid-template-columns:1fr; gap:2.8rem; }
  .dl-grid{ grid-template-columns:1fr 1fr; }
  .about{ grid-template-columns:1fr; gap:2.5rem; }
  .map-wrap{ grid-template-columns:1fr; }
  .map-list{ height:auto; max-height:280px; border-left:0; border-top:1px solid var(--line); }
  .footer__inner{ grid-template-columns:1fr; }
}
@media (max-width:600px){
  .cards{ grid-template-columns:1fr; }
  .feats{ grid-template-columns:1fr; }
  .tech__grid{ grid-template-columns:1fr; }
  .offices{ grid-template-columns:1fr; }
  .dl-grid{ grid-template-columns:1fr; }
  .sol__item, .sol__item:nth-child(even){ grid-template-columns:1fr; grid-template-areas:"img" "txt" "panel"; }
  .sol__txt{ padding:1.8rem; }
  .footer__cols{ grid-template-columns:1fr 1fr; }
  .footer__legal{ flex-direction:column; }
  .hero__product{ display:none; }
}

/* ============================================================
   PRODUCT & CATEGORY PAGES
   ============================================================ */
.crumb{ font-size:.85rem; color:rgba(255,255,255,.6); margin-bottom:1.4rem; letter-spacing:.02em; }
.crumb a{ color:rgba(255,255,255,.6); }
.crumb a:hover{ color:#fff; }
.crumb span{ color:rgba(255,255,255,.4); margin:0 .5rem; }

.phero{ position:relative; color:#fff; overflow:hidden;
  background:radial-gradient(120% 120% at 78% 12%, #3c3c40 0%, #2b2b2e 45%, #1c1c1f 100%);
  padding:9.5rem var(--pad) 4.5rem; }
.phero__kv{ position:absolute; right:-6%; bottom:-18%; width:min(60vw,760px); opacity:.05; pointer-events:none; }
.phero__inner{ position:relative; max-width:var(--maxw); margin:0 auto; display:grid; grid-template-columns:1.05fr .95fr; gap:3.5rem; align-items:center; }
.phero__eyebrow{ color:var(--brand); font-weight:700; letter-spacing:.2em; text-transform:uppercase; font-size:.8rem; margin-bottom:1rem; }
.phero h1{ font-weight:300; font-size:clamp(2.4rem,5.5vw,4.4rem); letter-spacing:-.02em; line-height:1.02; margin-bottom:1.1rem; }
.phero h1 b{ font-weight:700; }
.phero__lead{ color:rgba(255,255,255,.8); font-size:1.12rem; font-weight:300; max-width:480px; }
.badges{ display:flex; gap:.6rem; flex-wrap:wrap; margin:1.8rem 0; }
.badge{ border:1px solid rgba(255,255,255,.28); border-radius:999px; padding:.45rem 1rem; font-size:.82rem; color:rgba(255,255,255,.92); }
.phero__cta{ display:flex; gap:1rem; flex-wrap:wrap; margin-top:.4rem; }
.phero__media{ display:flex; align-items:center; justify-content:center; }
.phero__media img{ max-height:440px; width:auto; filter:drop-shadow(0 30px 60px rgba(0,0,0,.45)); }

.pspecs{ display:grid; grid-template-columns:repeat(auto-fit,minmax(155px,1fr)); gap:1.1rem; }
.pspec{ text-align:center; padding:1.8rem 1rem; border:1px solid var(--line); border-radius:var(--r); background:var(--paper); }
.pspec b{ display:block; font-weight:300; font-size:clamp(1.8rem,3.2vw,2.6rem); color:var(--graphite); letter-spacing:-.02em; }
.pspec span{ font-size:.85rem; color:var(--muted); }

.gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.gallery figure{ border-radius:var(--r); overflow:hidden; background:linear-gradient(160deg,#f4f3f1,#fff); aspect-ratio:4/3; display:flex; align-items:center; justify-content:center; padding:1rem; }
.gallery img{ width:100%; height:100%; object-fit:contain; display:block; transition:transform .5s var(--ease); }
.gallery figure:hover img{ transform:scale(1.05); }
.gallery figure:first-child{ background:#0e0e10; padding:0; }
.gallery figure:first-child img{ object-fit:cover; }

.spectable{ width:100%; border-collapse:collapse; }
.spectable caption{ text-align:left; font-size:.78rem; color:var(--muted); margin-bottom:1rem; }
.spectable th, .spectable td{ text-align:left; padding:.95rem 1.1rem; border-bottom:1px solid var(--line); font-size:.95rem; }
.spectable thead th{ color:#fff; background:var(--graphite); font-weight:600; }
.spectable tbody th{ color:var(--muted); font-weight:600; width:34%; }
.spectable tbody tr:hover{ background:var(--paper); }

.pdl-band{ background:var(--graphite); color:#fff; border-radius:var(--r); padding:2.6rem; display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.pdl-band h3{ font-weight:400; font-size:1.5rem; margin-bottom:.3rem; }
.pdl-band p{ color:rgba(255,255,255,.7); font-size:.95rem; }

@media (max-width:900px){
  .phero__inner{ grid-template-columns:1fr; gap:2rem; text-align:left; }
  .phero__media{ order:-1; } .phero__media img{ max-height:280px; }
  .pspecs{ grid-template-columns:1fr 1fr; }
  .gallery{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .pspecs{ grid-template-columns:1fr 1fr; }
  .gallery{ grid-template-columns:1fr 1fr; }
  .pdl-band{ flex-direction:column; align-items:flex-start; }
}

/* technologies grid (dense, dark cards) */
.feats--tech{ grid-template-columns:repeat(auto-fit,minmax(208px,1fr)); gap:1.2rem; }
.feats--tech .feat{ background:var(--graphite); border-color:transparent; }
.feats--tech .feat:hover{ background:var(--graphite-d); transform:translateY(-6px); }
.feats--tech .feat h3{ color:#fff; font-size:1.08rem; }
.feats--tech .feat p{ color:rgba(255,255,255,.65); font-size:.9rem; }
.feats--tech img.ticon{ width:40px; height:40px; object-fit:contain; margin-bottom:1.1rem; }
.feats--tech svg.ticon{ width:40px; height:40px; margin-bottom:1.1rem; stroke:#fff; fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }

/* Spec table — highlighted retail price row */
.spectable tr.price td{ font-weight:700; color:var(--brand); font-size:1.08rem; }
.spectable tr.price th{ color:var(--ink); font-weight:700; }
.spectable tr.price th small{ display:block; font-weight:400; color:var(--muted); font-size:.78rem; margin-top:.2rem; }
.spectable tr.price{ background:var(--paper); }

/* Multisplit ODU table — price column highlight */
.spectable td.pcell{ color:var(--brand); font-weight:700; white-space:nowrap; }
.spectable th.modelcell{ color:var(--ink); font-weight:700; }

/* ============================================================
   SPEC TABLE — horizontal slider + sticky first column
   ============================================================ */
.spec-nav{ display:flex; align-items:center; gap:.6rem; margin-bottom:1.1rem; }
.spec-nav__hint{ font-size:.82rem; color:var(--muted); margin-right:auto; letter-spacing:.02em; }
.spec-nav__btn{ width:42px; height:42px; border-radius:50%; border:1px solid var(--line); background:#fff; color:var(--graphite); font-size:1.4rem; line-height:0; cursor:pointer; transition:all .3s var(--ease); display:flex; align-items:center; justify-content:center; }
.spec-nav__btn:hover:not(:disabled){ background:var(--brand); color:#fff; border-color:var(--brand); transform:translateY(-1px); }
.spec-nav__btn:disabled{ opacity:.3; cursor:default; }
.spec-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; scroll-behavior:smooth; }
.spec-scroll .spectable{ min-width:max-content; }
.spec-scroll .spectable tbody th{ width:240px; min-width:240px; }
.spec-scroll .spectable td{ min-width:130px; white-space:nowrap; }
.spec-scroll .spectable thead th:first-child,
.spec-scroll .spectable tbody th{ position:sticky; left:0; z-index:2; box-shadow:1px 0 0 var(--line); }
.spec-scroll .spectable thead th:first-child{ background:var(--graphite); }
.spec-scroll .spectable tbody th{ background:#fff; }
.spec-scroll .spectable tbody tr:hover th{ background:var(--paper); }
.spec-scroll .spectable tr.price th{ background:var(--paper); }

/* ============================================================
   PREMIUM FX — hero animation, hover eye-candy, grain
   ============================================================ */

/* --- Film grain (global, very subtle) --- */
body::after{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:9000; opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* --- Hero layering --- */
.hero{ isolation:isolate; }
.hero__aurora{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.hero__aurora span{ position:absolute; border-radius:50%; filter:blur(80px); mix-blend-mode:screen; will-change:transform; }
.hero__aurora .a1{ width:48vw; height:48vw; background:radial-gradient(circle, rgba(16,104,176,.50), transparent 62%); top:-12%; right:2%; opacity:.7; animation:aurora1 17s ease-in-out infinite alternate; }
.hero__aurora .a2{ width:42vw; height:42vw; background:radial-gradient(circle, rgba(120,130,150,.30), transparent 62%); bottom:-18%; left:-4%; opacity:.6; animation:aurora2 22s ease-in-out infinite alternate; }
.hero__aurora .a3{ width:30vw; height:30vw; background:radial-gradient(circle, rgba(160,40,60,.34), transparent 62%); top:34%; left:42%; opacity:.55; animation:aurora3 26s ease-in-out infinite alternate; }
@keyframes aurora1{ to{ transform:translate(-9%,13%) scale(1.16);} }
@keyframes aurora2{ to{ transform:translate(13%,-11%) scale(1.22);} }
@keyframes aurora3{ to{ transform:translate(-16%,-9%) scale(1.12);} }

.hero__kv{ z-index:1; }
.hero__product--unit{ z-index:2; }
.hero__content{ z-index:3; }
.hero__scroll{ z-index:3; }

/* technological engineering grid (faint, radial-masked, slow drift) */
.hero__grid{ position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:56px 56px;
  -webkit-mask:radial-gradient(125% 95% at 72% 28%, #000 28%, transparent 78%);
          mask:radial-gradient(125% 95% at 72% 28%, #000 28%, transparent 78%);
  animation:heroGrid 46s linear infinite; }
@keyframes heroGrid{ to{ background-position:56px 56px; } }

/* slow diagonal light sweep */
.hero__sweep{ position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; }
.hero__sweep::before{ content:""; position:absolute; top:-25%; bottom:-25%; left:-30%; width:22%;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.05), transparent);
  transform:skewX(-14deg); animation:heroSweep 12s ease-in-out infinite; }
@keyframes heroSweep{ 0%{ left:-30%; } 58%,100%{ left:132%; } }

/* --- Hero entrance (staggered) --- */
@media (prefers-reduced-motion: no-preference){
  .hero__content > *{ opacity:0; animation:heroIn 1s var(--ease) forwards; }
  .hero__content > *:nth-child(1){ animation-delay:.15s; }
  .hero__content > *:nth-child(2){ animation-delay:.28s; }
  .hero__content > *:nth-child(3){ animation-delay:.41s; }
  .hero__content > *:nth-child(4){ animation-delay:.54s; }
  .hero__content > *:nth-child(5){ animation-delay:.67s; }
}
@keyframes heroIn{ from{ opacity:0; transform:translateY(26px);} to{ opacity:1; transform:none;} }

/* --- Button shine sweep --- */
.btn{ position:relative; overflow:hidden; }
.btn::after{ content:""; position:absolute; top:0; bottom:0; left:-130%; width:55%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent);
  transform:skewX(-20deg); pointer-events:none; }
.btn:hover::after{ animation:btnShine .85s var(--ease); }
@keyframes btnShine{ to{ left:135%; } }

/* --- Premium card hover: subtle 3D tilt + delicate edge-light --- */
.card, .feat, .tech__item, .dl{ transform-style:preserve-3d; will-change:transform; }
.card > *, .feat > *, .tech__item > *, .dl > *{ position:relative; z-index:1; }
/* delicate 1px cursor-following edge glow (masked border, not a blob) */
.card::after, .feat::after, .tech__item::after, .dl::after{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; pointer-events:none; z-index:3;
  background:radial-gradient(150px circle at var(--mx,50%) var(--my,50%), rgba(16,104,176,.55), transparent 62%);
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
          mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:0; transition:opacity .5s var(--ease);
}
.is-tilt::after{ opacity:1; }
.is-tilt{ transition:transform .12s ease-out, box-shadow .4s var(--ease) !important; }
.card.is-tilt{ box-shadow:0 28px 56px rgba(11,11,13,.15); }
/* icon life on hover */
.feat__ic, .ticon{ transition:transform .45s var(--ease); }
.feat:hover .feat__ic, .tech__item:hover .ticon{ transform:scale(1.12); }

/* --- Staggered reveal cascade --- */
.reveal{ transform:translateY(28px) scale(.99); transition-delay:calc(var(--i,0) * 65ms); }
.reveal.is-in{ transform:none; }

/* --- Solutions: image zoom + number accent --- */
.sol__img img{ transition:transform .9s var(--ease); }
.sol__item:hover .sol__img img{ transform:scale(1.07); }
.sol__txt .num{ transition:letter-spacing .4s var(--ease), color .4s; display:inline-block; }
.sol__item:hover .num{ letter-spacing:.18em; }

/* --- About: image zoom --- */
.about__art img{ transition:transform 1.1s var(--ease); }
.about:hover .about__art img{ transform:scale(1.05); }

/* --- Inspire band: shimmer tagline + light sweep + watermark drift --- */
.band__tag{ background:linear-gradient(90deg, rgba(255,255,255,.55), #fff 50%, rgba(255,255,255,.55)); background-size:200% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; animation:shimmer 6s linear infinite; }
@keyframes shimmer{ to{ background-position:-200% 0; } }
.band__kv{ animation:bandKv 20s ease-in-out infinite alternate; }
@keyframes bandKv{ from{ transform:translate3d(0,0,0) scale(1);} to{ transform:translate3d(-4%,-5%,0) scale(1.1);} }
.band::after{ content:""; position:absolute; top:0; bottom:0; width:35%; pointer-events:none; z-index:0;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.08), transparent); transform:skewX(-14deg);
  animation:bandSweep 9s ease-in-out infinite; }
@keyframes bandSweep{ 0%{ left:-45%; } 60%,100%{ left:135%; } }
.band__inner{ position:relative; z-index:1; }

/* --- Technologies: drifting dot-grid (technological texture) --- */
#tech{ position:relative; overflow:hidden; }
#tech::before{ content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background-image:radial-gradient(rgba(255,255,255,.05) 1px, transparent 1.4px); background-size:32px 32px;
  opacity:.6; animation:gridDrift 28s linear infinite; }
@keyframes gridDrift{ to{ background-position:32px 32px; } }
#tech > *{ position:relative; z-index:1; }

@media (prefers-reduced-motion: reduce){
  .hero__aurora span, .hero__grid, .hero__sweep::before, .band__kv, .band::after, .band__tag, #tech::before{ animation:none; }
  .btn::after{ display:none; }
  .band__tag{ -webkit-text-fill-color:#fff; }
}

/* ============================================================
   JAPANESE / PRECISE REFRESH
   ============================================================ */
/* Accent/label styling now uses Inter too (the uppercase + letter-spacing gives the
   tech-label feel). The old IBM Plex Mono wasn't loading → Cyrillic fell back to a
   system mono, so BG labels looked "legacy" and differed from EN. --mono → Inter fixes
   both and keeps EN/BG identical. Tabular figures keep spec numbers aligned. */
:root{ --mono:var(--font); --ease-precise:cubic-bezier(.7,0,.18,1); }

/* --- Red-dash motif: surgical red, the Cooper & Hunter tick before every label --- */
.eyebrow{ display:inline-flex; align-items:center; color:var(--graphite); }
.eyebrow::before{ content:""; width:24px; height:2px; background:var(--brand); margin-right:.85rem; flex:none;
  transform-origin:left center; }
.eyebrow--red{ color:rgba(255,255,255,.6); }       /* on dark: text muted, red lives in the dash */
.section--craft .eyebrow{ color:var(--graphite); }

/* --- Sharper, mechanical reveal (shorter, faster, precise) --- */
.reveal{ transform:translateY(16px); opacity:0; transition:opacity .55s var(--ease-precise), transform .55s var(--ease-precise); transition-delay:calc(var(--i,0) * 55ms); }
.reveal.is-in{ transform:none; opacity:1; }

/* --- Hairline section divider accent --- */
.section__head{ position:relative; }

/* --- Hero precision details --- */
.hero__title .thin, .hero__title .strong{ display:inline-block; }
@media (prefers-reduced-motion: no-preference){
  .hero__content > *{ animation:heroIn .6s var(--ease-precise) forwards; }
  .hero__title{ animation:none; opacity:1; }
  .hero__title .thin, .hero__title .strong{ clip-path:inset(0 102% 0 0); animation:wipeIn .75s var(--ease-precise) forwards; }
  .hero__title .thin{ animation-delay:.34s; }
  .hero__title .strong{ animation-delay:.5s; }
  .hero__content > *:nth-child(6){ animation-delay:.8s; }
  .eyebrow::before{ transform:scaleX(0); animation:dashDraw .5s var(--ease-precise) forwards; }
}
@keyframes heroIn{ from{ opacity:0; transform:translateY(18px);} to{ opacity:1; transform:none;} }
@keyframes wipeIn{ to{ clip-path:inset(0 0 0 0); } }
@keyframes dashDraw{ to{ transform:scaleX(1); } }

/* mono spec readout under hero CTAs */
.hero__spec{ margin-top:2.2rem; font-family:var(--mono); font-size:.78rem; letter-spacing:.12em;
  color:rgba(255,255,255,.45); text-transform:uppercase; }
.hero__spec b{ color:rgba(255,255,255,.8); font-weight:500; }

/* hero vertical hairline + rotated label (precision) */
.hero__vlabel{ position:absolute; left:var(--pad); top:0; bottom:0; width:1px; background:linear-gradient(rgba(255,255,255,.18), rgba(255,255,255,.02)); z-index:3; }
.hero__vlabel span{ position:absolute; bottom:8rem; left:14px; transform:rotate(90deg); transform-origin:left center; white-space:nowrap;
  font-family:var(--mono); font-size:.7rem; letter-spacing:.34em; text-transform:uppercase; color:rgba(255,255,255,.4); }
.hero__vlabel::after{ content:""; position:absolute; bottom:6.6rem; left:-3px; width:7px; height:7px; border:1px solid rgba(255,255,255,.4); border-radius:50%; }

/* hero corner index mark */
.hero__index{ position:absolute; top:7.5rem; right:var(--pad); font-family:var(--mono); font-size:.72rem; letter-spacing:.18em; color:rgba(255,255,255,.32); z-index:3; text-align:right; }
.hero__index b{ color:var(--brand); }

/* --- Card tags: mono technical labels --- */
.card__tag, .phero__eyebrow{ font-family:var(--mono); }

@media (max-width:900px){ .hero__vlabel, .hero__index{ display:none; } }
@media (prefers-reduced-motion: reduce){
  .hero__title .thin, .hero__title .strong{ clip-path:none; }
  .eyebrow::before{ transform:none; }
}

/* ============================================================
   SPEC CARDS ACCENT + GALLERY CAROUSEL + LIGHTBOX
   ============================================================ */
/* Key-spec cards — accented, technical */
.pspec{ position:relative; text-align:left; padding:1.7rem 1.4rem 1.5rem; border:1px solid var(--line); border-radius:var(--r);
  background:linear-gradient(165deg,#fff, var(--paper)); transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s; overflow:hidden; }
.pspec::before{ content:""; position:absolute; top:0; left:0; width:26px; height:3px; background:var(--brand); transition:width .4s var(--ease); }
.pspec:hover{ transform:translateY(-5px); border-color:transparent; box-shadow:0 20px 44px rgba(11,11,13,.11); }
.pspec:hover::before{ width:54px; }
.pspec b{ display:block; font-weight:300; font-size:clamp(1.9rem,3.4vw,2.7rem); color:var(--graphite); letter-spacing:-.02em; margin:.5rem 0 .3rem; }
.pspec span{ font-size:.74rem; color:var(--muted); font-family:var(--mono); letter-spacing:.04em; line-height:1.4; display:block; }

/* Gallery → horizontal carousel */
.gallery{ display:flex; grid-template-columns:none; gap:1.2rem; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; -webkit-overflow-scrolling:touch; padding-bottom:.5rem; }
.gallery::-webkit-scrollbar{ height:6px; }
.gallery::-webkit-scrollbar-thumb{ background:rgba(0,0,0,.14); border-radius:6px; }
.gallery figure{ flex:0 0 calc((100% - 2.4rem)/3); scroll-snap-align:start; cursor:zoom-in; position:relative; }
.gallery figure::after{ content:"⤢"; position:absolute; top:.7rem; right:.7rem; width:32px; height:32px; display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.9); border-radius:9px; font-size:1rem; color:var(--graphite); opacity:0; transform:translateY(-4px); transition:all .3s var(--ease); pointer-events:none; box-shadow:0 4px 12px rgba(0,0,0,.12); }
.gallery figure:hover::after{ opacity:1; transform:translateY(0); }
.gallery-nav{ display:flex; justify-content:flex-end; gap:.6rem; margin-bottom:1.1rem; }
@media (max-width:900px){ .gallery figure{ flex-basis:calc((100% - 1.2rem)/2); } }
@media (max-width:560px){ .gallery figure{ flex-basis:86%; } }

/* Lightbox */
.lightbox{ position:fixed; inset:0; z-index:9500; background:rgba(12,12,14,.93); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  display:flex; align-items:center; justify-content:center; opacity:0; visibility:hidden; transition:opacity .35s var(--ease), visibility .35s; }
.lightbox.is-open{ opacity:1; visibility:visible; }
.lightbox__img{ max-width:88vw; max-height:86vh; width:auto; object-fit:contain; border-radius:8px; box-shadow:0 40px 90px rgba(0,0,0,.55);
  transform:scale(.96); transition:transform .35s var(--ease); }
.lightbox.is-open .lightbox__img{ transform:scale(1); }
.lightbox__close, .lightbox__nav{ position:absolute; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.07); color:#fff; cursor:pointer;
  display:flex; align-items:center; justify-content:center; transition:all .3s var(--ease); line-height:0; }
.lightbox__close{ top:1.4rem; right:1.6rem; width:46px; height:46px; border-radius:50%; font-size:1.7rem; }
.lightbox__nav{ top:50%; transform:translateY(-50%); width:54px; height:54px; border-radius:50%; font-size:1.9rem; }
.lightbox__prev{ left:2.5%; } .lightbox__next{ right:2.5%; }
.lightbox__close:hover, .lightbox__nav:hover{ background:var(--brand); border-color:var(--brand); }
@media (max-width:560px){ .lightbox__nav{ width:44px; height:44px; } .lightbox__prev{ left:1%; } .lightbox__next{ right:1%; } }

/* ============================================================
   PRODUCTS MEGA MENU
   ============================================================ */
.nav__item--mega{ position:static; }
.mega{ position:absolute; top:100%; left:0; right:0; z-index:49;
  background:rgba(20,20,22,.97); -webkit-backdrop-filter:saturate(150%) blur(18px); backdrop-filter:saturate(150%) blur(18px);
  border-top:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(255,255,255,.08);
  box-shadow:0 30px 60px rgba(0,0,0,.4);
  opacity:0; visibility:hidden; transform:translateY(-10px); transition:opacity .32s var(--ease), transform .32s var(--ease), visibility .32s; }
.nav__item--mega:hover > .mega, .mega:hover{ opacity:1; visibility:visible; transform:none; }
.mega::before{ content:""; position:absolute; left:0; right:0; top:-28px; height:28px; }
.mega__inner{ max-width:var(--maxw); margin:0 auto; padding:2.6rem var(--pad) 2.8rem; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)) minmax(230px,1.4fr); gap:1.9rem; }
.mega__col h4{ font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:#fff; font-weight:600; margin-bottom:1.1rem; display:flex; align-items:center; }
.mega__col h4::before{ content:""; width:18px; height:2px; background:var(--brand); margin-right:.6rem; flex:none; }
.mega__col h4 a{ color:#fff; }
.mega__col a{ display:block; color:rgba(255,255,255,.62); padding:.34rem 0; font-size:.9rem; transition:color .25s var(--ease), padding-left .25s var(--ease); }
.mega__col > a:hover{ color:#fff; padding-left:.45rem; }
.mega__promo{ border-left:1px solid rgba(255,255,255,.1); padding-left:1.8rem; display:flex; flex-direction:column; justify-content:flex-start; align-items:flex-start; }
.mega__promo-link{ display:block; color:inherit; width:100%; }
.mega__promo-link:hover .mega__promo-img{ transform:translateY(-2px); }
.mega__promo-img{ border-radius:12px; overflow:hidden; background:linear-gradient(160deg,#2a2a2e,#161618); aspect-ratio:16/10; display:flex; align-items:center; justify-content:center; padding:1rem; margin-bottom:1rem; transition:transform .3s var(--ease); }
.mega__promo-img img{ max-height:100%; max-width:100%; width:auto; object-fit:contain; }
.mega__promo h5{ color:#fff; font-size:1rem; font-weight:600; margin-bottom:.35rem; }
.mega__promo p{ color:rgba(255,255,255,.55); font-size:.82rem; line-height:1.5; margin-bottom:1.1rem; }
.mega__promo .btn{ align-self:flex-start; padding:.6rem 1.25rem; font-size:.82rem; white-space:nowrap; }
@media (max-width:980px){ .mega{ display:none !important; } }

/* ============================================================
   CONTACT / DEALERS / ABOUT PAGES
   ============================================================ */
.offices-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin-bottom:2.5rem; }
.office-card{ border:1px solid var(--line); border-radius:var(--r); padding:2rem 1.8rem; background:linear-gradient(165deg,#fff,var(--paper)); position:relative; transition:transform .4s var(--ease), box-shadow .4s; }
.office-card::before{ content:""; position:absolute; top:0; left:0; width:26px; height:3px; background:var(--brand); }
.office-card:hover{ transform:translateY(-5px); box-shadow:0 20px 44px rgba(11,11,13,.10); }
.office-card__city{ display:block; font-family:var(--mono); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase; color:var(--brand); font-weight:500; margin-bottom:1.3rem; }
.office-card ul{ list-style:none; display:flex; flex-direction:column; gap:1rem; }
.office-card li{ display:flex; flex-direction:column; gap:.2rem; }
.office-card li > span{ font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.office-card li a, .office-card li b{ font-size:1rem; color:var(--ink); font-weight:500; }
.office-card li a:hover{ color:var(--brand); }
.office-map{ height:420px; border-radius:var(--r); overflow:hidden; border:1px solid var(--line); box-shadow:0 26px 60px rgba(11,11,13,.08); }
@media (max-width:900px){ .offices-grid{ grid-template-columns:1fr; } }

/* Become a dealer */
.dealer-cta{ background:transparent; color:#fff; }
.benefits{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; margin-top:1rem; }
.benefit{ padding:1.8rem 1.5rem; border:1px solid rgba(255,255,255,.14); border-radius:var(--r); background:rgba(255,255,255,.04); }
.benefit svg{ width:34px; height:34px; stroke:var(--brand); fill:none; stroke-width:1.6; margin-bottom:1rem; }
.benefit h3{ font-size:1.05rem; font-weight:600; margin-bottom:.4rem; }
.benefit p{ font-size:.9rem; color:rgba(255,255,255,.6); }
@media (max-width:900px){ .benefits{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .benefits{ grid-template-columns:1fr; } }

/* About */
.about-story{ display:grid; grid-template-columns:1.1fr .9fr; gap:4rem; align-items:center; }
.about-story__img{ border-radius:var(--r); overflow:hidden; aspect-ratio:4/5; background:linear-gradient(160deg,#f4f3f1,#fff); display:flex; align-items:center; justify-content:center; padding:2rem; }
.about-story__img img{ max-height:100%; width:auto; object-fit:contain; }
.about-story p{ color:var(--muted); margin-top:1rem; }
.timeline{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.4rem; }
.tl{ padding:1.8rem 1.4rem; border-top:2px solid var(--brand); background:var(--paper); border-radius:0 0 var(--r) var(--r); }
.tl b{ display:block; font-family:var(--mono); font-size:1.5rem; color:var(--graphite); font-weight:500; margin-bottom:.4rem; }
.tl span{ font-size:.9rem; color:var(--muted); }
.values{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
@media (max-width:900px){ .about-story{ grid-template-columns:1fr; gap:2rem; } .timeline{ grid-template-columns:1fr 1fr; } .values{ grid-template-columns:1fr; } }

/* ===================== SOLUTIONS — EXPANDABLE SERIES ===================== */
.sol__toggle{ margin-top:1.4rem; display:inline-flex; align-items:center; gap:.55rem; background:none; border:none; padding:0; cursor:pointer;
  font-family:var(--mono); font-size:.72rem; letter-spacing:.18em; text-transform:uppercase; color:var(--brand); transition:gap .35s var(--ease); }
.sol__toggle:hover{ gap:.85rem; }
.sol__chev{ transition:transform .45s var(--ease-precise); }
.sol__item.is-open .sol__chev{ transform:rotate(180deg); }
/* panel spans the full width of the 2-col row and animates open */
.sol__panel{ grid-area:panel; display:grid; grid-template-rows:0fr; opacity:0;
  transition:grid-template-rows .55s var(--ease-precise), opacity .4s var(--ease); }
.sol__panel-in{ overflow:hidden; min-height:0; }
.sol__item.is-open .sol__panel{ grid-template-rows:1fr; opacity:1; }
.sol__chips{ display:grid; grid-template-columns:repeat(6,1fr); gap:.9rem; padding:1.6rem 0 0; border-top:1px solid var(--line); margin:0 2.8rem; }
.schip{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.6rem; padding:1.1rem .7rem;
  background:var(--white); border:1px solid var(--line); border-radius:12px; text-decoration:none; color:var(--graphite);
  transition:transform .4s var(--ease), border-color .4s var(--ease), box-shadow .4s var(--ease); }
.schip:hover{ transform:translateY(-4px); border-color:rgba(16,104,176,.4); box-shadow:0 14px 30px -18px rgba(51,51,51,.4); }
.schip__ic{ height:54px; display:flex; align-items:center; justify-content:center; }
.schip__ic img{ max-height:54px; width:auto; object-fit:contain; }
.schip__t{ font-family:var(--mono); font-size:.72rem; letter-spacing:.03em; line-height:1.3; color:var(--graphite); }
.sol__more{ display:inline-flex; align-items:center; gap:.4rem; margin:1.4rem 2.8rem 1.8rem; font-weight:600; font-size:.95rem;
  color:var(--brand); text-decoration:none; transition:gap .35s var(--ease); }
.sol__more:hover{ gap:.8rem; }
@media (max-width:900px){
  .sol__chips{ grid-template-columns:repeat(3,1fr); margin:0 1.8rem; }
  .sol__more{ margin:1.2rem 1.8rem 1.6rem; }
}
@media (max-width:540px){ .sol__chips{ grid-template-columns:repeat(2,1fr); } }

/* ===================== COMING-SOON / IN-PREPARATION ===================== */
.card--soon{ cursor:default; }
.card--soon .card__img{ opacity:.9; }
.card--soon:hover{ transform:none; }
.card__status{ display:inline-block; margin-top:.7rem; font-family:var(--mono); font-size:.66rem; letter-spacing:.16em;
  text-transform:uppercase; color:var(--muted); border:1px solid var(--line); border-radius:30px; padding:.32rem .8rem; }
.card__status--soon{ color:var(--brand); border-color:rgba(16,104,176,.32); }
.notice{ max-width:760px; margin:0 auto; text-align:center; }
.notice__badge{ display:inline-flex; align-items:center; gap:.5rem; font-family:var(--mono); font-size:.72rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--brand); margin-bottom:1.1rem; }
.notice__badge::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 4px rgba(16,104,176,.14); }

/* ============================================================
   FULL-BLEED VIDEO HERO + dual-audience gateway
   (Daikin-benchmarked: full-screen media, left headline,
    clean overlay, two audience paths — Homeowner / Pro)
   ============================================================ */
.vhero{ position:relative; min-height:100vh; display:flex; align-items:center; overflow:hidden; color:#fff; }
.vhero__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; }
.vhero__scrim{ position:absolute; inset:0; z-index:1; pointer-events:none; background:
  linear-gradient(100deg, rgba(8,13,22,.88) 0%, rgba(8,13,22,.60) 33%, rgba(8,13,22,.12) 62%, rgba(8,13,22,.34) 100%),
  linear-gradient(180deg, rgba(8,13,22,.50) 0%, rgba(8,13,22,0) 20%, rgba(8,13,22,0) 78%, rgba(8,13,22,.40) 100%); }
.vhero__inner{ position:relative; z-index:2; max-width:var(--maxw); margin:0 auto; width:100%; padding:128px var(--pad) 92px; }
.vhero__prox{ height:38px; width:auto; margin-bottom:1.6rem; opacity:.95; filter:drop-shadow(0 2px 8px rgba(0,0,0,.35)); }
.vhero__kicker{ font-size:.78rem; letter-spacing:.2em; text-transform:uppercase; font-weight:600;
  color:#fff; opacity:.92; margin-bottom:1.5rem; display:flex; align-items:center; gap:.75rem; }
.vhero__kicker::before{ content:""; width:42px; height:2px; background:var(--accent); flex:none; }
.vhero__title{ font-weight:300; font-size:clamp(2.7rem,6vw,5.4rem); line-height:1.03; letter-spacing:-.02em;
  max-width:15ch; margin-bottom:1.4rem; text-shadow:0 2px 30px rgba(0,0,0,.30); }
.vhero__lead{ font-size:clamp(1.05rem,1.35vw,1.28rem); font-weight:300; color:rgba(255,255,255,.88);
  max-width:540px; margin-bottom:2.6rem; line-height:1.6; }

.vhero__paths{ display:flex; gap:1rem; flex-wrap:wrap; }
.vpath{ display:flex; align-items:center; gap:1rem; flex:1 1 320px; max-width:400px;
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.26);
  backdrop-filter:saturate(140%) blur(10px); -webkit-backdrop-filter:saturate(140%) blur(10px);
  padding:1.05rem 1.25rem; transition:transform .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease); }
.vpath:hover{ background:rgba(255,255,255,.18); transform:translateY(-3px); border-color:rgba(255,255,255,.9); }
.vpath__ic{ width:44px; height:44px; flex:none; display:grid; place-items:center; border-radius:5px; }
.vpath__ic--home{ background:var(--brand); }
.vpath__ic--biz{ background:var(--graphite); }
.vpath__ic--pro{ background:var(--accent); }
/* three-across gateway: tighter cards so all three fit one row on desktop */
.vhero__paths--3 .vpath{ flex:1 1 240px; max-width:none; gap:.85rem; padding:1rem 1.1rem; }
.vhero__paths--3 .vpath__txt i{ font-size:.8rem; }
.vpath__ic svg{ width:23px; height:23px; }
.vpath__txt{ display:flex; flex-direction:column; gap:.18rem; }
.vpath__txt b{ font-size:1.05rem; font-weight:700; letter-spacing:.01em; }
.vpath__txt i{ font-style:normal; font-size:.82rem; color:rgba(255,255,255,.80); line-height:1.4; }
.vpath__arrow{ margin-left:auto; font-size:1.25rem; opacity:.65; transition:transform .3s, opacity .3s; align-self:center; }
.vpath:hover .vpath__arrow{ transform:translateX(4px); opacity:1; }

.vhero__scroll{ position:absolute; bottom:1.6rem; left:50%; transform:translateX(-50%); z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:.55rem; font-size:.66rem;
  letter-spacing:.25em; text-transform:uppercase; color:rgba(255,255,255,.6); }
.vhero__scroll i{ width:1px; height:42px; background:linear-gradient(rgba(255,255,255,.7),transparent); animation:scrollPulse 2s ease-in-out infinite; }

@media(max-width:760px){
  .vhero__inner{ padding:120px var(--pad) 84px; }
  .vpath{ flex:1 1 100%; max-width:none; }
}

/* ============================================================
   FINAL OVERRIDES — must stay at end of file to win the cascade
   ============================================================ */
/* Modern, smooth category tags (override the earlier IBM Plex Mono rule) */
.card__tag, .ncard__tag, .phero__eyebrow{ font-family:var(--font) !important; letter-spacing:.07em; font-weight:700; }

/* Refined reveal — fade + gentle rise + soft blur (override earlier reveals) */
.reveal{ opacity:0; transform:translateY(22px); filter:blur(6px);
  transition:opacity 1s var(--ease), transform 1.1s var(--ease), filter 1s var(--ease);
  transition-delay:calc(var(--i,0) * 80ms); }
.reveal.is-in{ opacity:1; transform:none; filter:blur(0); }
@media (prefers-reduced-motion:reduce){ .reveal{ transition:opacity .35s ease !important; transform:none; filter:none; } }

/* Calm premium card hover (tilt removed in JS) */
.card:hover{ transform:translateY(-6px); box-shadow:0 30px 60px rgba(51,51,51,.13); }

/* Heritage sponsorship tabbed player (Yankees / Panthers / NASCAR) */
.chsponsor__stage{ aspect-ratio:16/9; }
.chsponsor__media{ position:absolute; inset:0; width:100%; height:100%; opacity:0; visibility:hidden; transition:opacity .45s var(--ease); }
.chsponsor__media.is-active{ opacity:1; visibility:visible; }
video.chsponsor__media{ object-fit:cover; }
.chsponsor__yt iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; }
.chvideo__tag{ pointer-events:none; }
.chsponsor__tabs{ display:flex; gap:.6rem; margin-top:1rem; flex-wrap:wrap; }
.stab{ display:inline-flex; align-items:center; gap:.55rem; padding:.5rem .95rem; border:1px solid var(--line); border-radius:40px;
  background:#fff; font:inherit; font-size:.85rem; font-weight:600; color:var(--graphite); cursor:pointer; transition:all .25s var(--ease); }
.stab:hover{ border-color:var(--brand); color:var(--brand); }
.stab.is-active{ background:var(--graphite); color:#fff; border-color:var(--graphite); }
.stab__logo{ background:#fff; border:1px solid var(--line); border-radius:5px; padding:3px 6px; display:inline-flex; align-items:center; flex:none; }
.stab__logo img{ height:16px; width:auto; max-width:92px; object-fit:contain; display:block; }
@media(max-width:520px){ .stab{ font-size:.8rem; padding:.45rem .8rem; } }

/* ============================================================
   RAC PRODUCT PAGES (category + per-series) — v2
   ============================================================ */
.nav--solid{ background:rgba(255,255,255,.95); backdrop-filter:saturate(140%) blur(12px); -webkit-backdrop-filter:saturate(140%) blur(12px); border-bottom:1px solid var(--line); }
.nav--solid.is-scrolled{ background:rgba(255,255,255,.97); box-shadow:0 6px 24px rgba(0,0,0,.06); }
.nav--solid .nav__links a{ color:var(--ink); }
.nav--solid .nav__links a:hover{ color:var(--brand); }
.nav--solid .lang{ border-color:rgba(22,26,30,.22); color:var(--ink); }
.nav--solid .burger span{ background:var(--ink); }
.rc-crumb{ font-size:.8rem; color:var(--muted); margin-bottom:1.1rem; font-family:var(--mono); letter-spacing:.03em; }
.rc-crumb a{ color:var(--muted); } .rc-crumb a:hover{ color:var(--brand); } .rc-crumb span{ opacity:.5; margin:0 .3rem; }

/* category hero (two columns) */
.rc-cathero{ max-width:var(--maxw); margin:0 auto; padding:132px var(--pad) 1.5rem; }
.rc-cathero__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(24px,4vw,56px); align-items:center; }
.rc-cathero__title{ font-weight:300; font-size:clamp(2.4rem,5vw,4rem); letter-spacing:-.02em; margin:.2rem 0 1rem; line-height:1.02; }
.rc-cathero__lead{ font-size:1.12rem; color:var(--muted); font-weight:300; max-width:560px; }
.rc-catstats{ display:flex; gap:clamp(1.4rem,3vw,2.6rem); margin-top:2rem; flex-wrap:wrap; }
.rc-catstats b{ display:block; font-size:clamp(1.6rem,2.4vw,2.2rem); font-weight:300; color:var(--ink); letter-spacing:-.02em; line-height:1; }
.rc-catstats span{ font-size:.8rem; color:var(--muted); }
.rc-cathero__art{ background:#fff; border:1px solid var(--line); border-radius:var(--r); display:grid; place-items:center; aspect-ratio:1.4/1; padding:1.5rem; }
.rc-cathero__art img{ max-height:100%; width:auto; object-fit:contain; filter:drop-shadow(0 24px 40px rgba(0,0,0,.12)); }

/* cards grid */
.rc-catgrid{ max-width:var(--maxw); margin:0 auto; padding:2.5rem var(--pad) 5rem; }
.rc-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.rc-card{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; transition:transform .4s var(--ease), box-shadow .4s var(--ease); }
.rc-card:hover{ transform:translateY(-6px); box-shadow:0 30px 60px rgba(51,51,51,.12); }

/* image box — uniform, WHITE, carousel */
.rc-card__media{ position:relative; aspect-ratio:4/3; background:#fff; border-bottom:1px solid var(--line); }
.rc-carousel{ position:absolute; inset:0; }
.rc-carousel__track{ position:absolute; inset:0; }
.rc-slide{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:1.4rem; opacity:0; transition:opacity .5s var(--ease); }
.rc-slide.is-active{ opacity:1; }
.rc-car__nav{ position:absolute; top:50%; transform:translateY(-50%); width:34px; height:34px; border-radius:50%; border:1px solid var(--line); background:rgba(255,255,255,.92); color:var(--graphite); font-size:1.2rem; line-height:1; cursor:pointer; display:grid; place-items:center; opacity:.62; box-shadow:0 2px 8px rgba(0,0,0,.08); transition:opacity .3s, background .3s, color .3s; z-index:2; }
.rc-card:hover .rc-car__nav, .rc-hero__art:hover .rc-car__nav{ opacity:1; }
.rc-car__nav:hover{ background:#fff; color:var(--brand); }
.rc-car__prev{ left:10px; } .rc-car__next{ right:10px; }
/* subtle "there's more" hint — a gentle nudge of the next arrow, paused on hover */
.rc-car__next{ animation:rcHint 2.6s ease-in-out infinite; }
.rc-card:hover .rc-car__next, .rc-hero__art:hover .rc-car__next{ animation:none; }
@keyframes rcHint{ 0%,86%,100%{ transform:translateY(-50%) translateX(0); } 93%{ transform:translateY(-50%) translateX(4px); } }
@media (prefers-reduced-motion:reduce){ .rc-car__next{ animation:none; } }
.rc-car__dots{ position:absolute; bottom:12px; left:50%; transform:translateX(-50%); display:flex; gap:7px; z-index:3; }
.rc-dot{ width:7px; height:7px; border-radius:50%; border:0; padding:0; background:rgba(20,26,30,.25); cursor:pointer; transition:.3s; }
.rc-dot.is-active{ background:var(--brand); transform:scale(1.3); }
/* colour-variant dots: each dot shows the actual panel colour */
.rc-dot--color{ width:13px; height:13px; border:1.5px solid rgba(0,0,0,.22); box-shadow:0 1px 3px rgba(0,0,0,.15); }
.rc-dot--color.is-active{ transform:scale(1.12); box-shadow:0 0 0 2px #fff, 0 0 0 3.5px var(--brand); }
/* clickable media → opens the series page (sits below the carousel nav/dots) */
.rc-media-link{ position:absolute; inset:0; z-index:1; }
.rc-car__nav{ z-index:3; }
.rc-sunset{ font-size:.5em; font-weight:600; color:var(--accent); letter-spacing:.02em; vertical-align:middle; white-space:nowrap; }
.rc-hero__title .rc-sunset{ font-size:.32em; }

.rc-card__body{ padding:1.3rem 1.5rem 1.5rem; display:flex; flex-direction:column; flex:1; }
.rc-card__form{ font-family:var(--mono); font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:var(--brand); }
.rc-card__body h3{ font-size:1.5rem; font-weight:700; margin:.25rem 0 .5rem; letter-spacing:-.01em; }
.rc-card__body h3 a{ color:inherit; } .rc-card__body h3 a:hover{ color:var(--brand); }
.rc-card__tag{ color:var(--muted); font-size:.92rem; line-height:1.5; margin-bottom:1rem; }
.rc-specsum{ margin:0 0 1.2rem; display:grid; gap:0; }
.rc-specsum > div{ display:flex; justify-content:space-between; gap:1rem; padding:.42rem 0; border-bottom:1px dashed var(--line); font-size:.85rem; }
.rc-specsum > div:last-child{ border-bottom:0; }
.rc-specsum dt{ color:var(--muted); } .rc-specsum dd{ font-weight:600; color:var(--ink); text-align:right; }
.rc-card__foot{ display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:auto; padding-top:.4rem; }
.rc-card__price{ font-weight:700; font-size:1.05rem; color:var(--ink); }
.rc-card__link{ font-size:.9rem; font-weight:700; color:var(--brand); white-space:nowrap; }

/* series hero */
.rc-hero{ max-width:var(--maxw); margin:0 auto; padding:130px var(--pad) 3rem; }
.rc-hero__in{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(24px,4vw,56px); align-items:center; }
.rc-hero__title{ font-weight:300; font-size:clamp(2.6rem,6vw,4.6rem); letter-spacing:-.02em; line-height:1; margin:.2rem 0 1rem; }
.rc-hero__lead{ font-size:1.2rem; color:var(--muted); font-weight:300; max-width:460px; margin-bottom:1.4rem; }
.rc-badges{ display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.8rem; }
.rc-badge{ font-size:.78rem; font-weight:600; color:var(--graphite); background:var(--craft); border:1px solid var(--line); border-radius:40px; padding:.4rem .8rem; }
.rc-hero__cta{ display:flex; gap:1rem; flex-wrap:wrap; }
.rc-hero__price{ margin-top:1.4rem; font-size:1.4rem; font-weight:700; color:var(--ink); }
.rc-hero__price span{ font-size:.85rem; font-weight:400; color:var(--muted); }
.rc-hero__art{ position:relative; aspect-ratio:1.4/1; background:#fff; border-radius:var(--r); border:1px solid var(--line); overflow:hidden; }

.rc-about{ max-width:820px; margin:0 auto; padding:2.5rem var(--pad); }
.rc-about__txt{ font-size:1.18rem; line-height:1.7; color:#3a4046; font-weight:300; }
.rc-feats{ max-width:var(--maxw); margin:0 auto; padding:2rem var(--pad) 3rem; }
.rc-featlist{ list-style:none; display:grid; grid-template-columns:repeat(2,1fr); gap:.8rem 2rem; margin-top:1.5rem; }
.rc-featlist li{ position:relative; padding-left:1.6rem; color:#3a4046; font-size:1rem; line-height:1.5; }
.rc-featlist li::before{ content:""; position:absolute; left:0; top:.55em; width:8px; height:8px; border-radius:50%; background:var(--brand); }

.rc-specs{ padding-block:clamp(3.5rem,7vw,6rem); }
.rc-specs .section__head{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
.rc-tablewrap{ max-width:var(--maxw); margin:1.5rem auto 0; padding-inline:var(--pad); overflow-x:auto; }
.rc-table{ width:100%; border-collapse:collapse; font-size:.9rem; background:#fff; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; min-width:820px; }
.rc-table th{ text-align:left; font-weight:700; font-size:.7rem; letter-spacing:.03em; text-transform:uppercase; color:#fff; background:var(--graphite); padding:.85rem .8rem; white-space:nowrap; }
.rc-table td{ padding:.8rem .8rem; border-top:1px solid var(--line); color:#3a4046; white-space:nowrap; }
.rc-table tbody tr:hover{ background:var(--craft); }
.rc-t__model{ font-weight:700; color:var(--ink); font-family:var(--mono); font-size:.82rem; }
.rc-t__price{ font-weight:700; color:var(--brand); }
.rc-note{ max-width:var(--maxw); margin:1.2rem auto 0; padding-inline:var(--pad); font-size:.9rem; color:var(--muted); }
.rc-note a{ color:var(--brand); font-weight:600; }
.rc-cta{ text-align:center; background:var(--grad-navy); color:#fff; padding:clamp(3.5rem,7vw,6rem) var(--pad); }
.rc-cta h2{ font-weight:300; font-size:clamp(1.8rem,3.5vw,2.8rem); letter-spacing:-.02em; margin-bottom:.8rem; }
.rc-cta p{ color:rgba(255,255,255,.7); margin-bottom:2rem; }
.rc-cta__btns{ display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }

@media(max-width:900px){ .rc-cards{ grid-template-columns:1fr 1fr; } .rc-cathero__grid,.rc-hero__in{ grid-template-columns:1fr; } .rc-cathero__art,.rc-hero__art{ order:-1; } .rc-featlist{ grid-template-columns:1fr; } }
@media(max-width:560px){ .rc-cards{ grid-template-columns:1fr; } }

/* ============================================================
   VITAL PLUS product page (bespoke draft) — USP / 3D-AR / dims / downloads
   ============================================================ */
.rc-new{ color:var(--accent); font-weight:700; }
.vp-desc{ max-width:var(--maxw); margin:0 auto; padding:3rem var(--pad); }
.vp-desc__p{ max-width:74ch; }
.vp-desc__h{ font-weight:300; font-size:clamp(1.8rem,3.4vw,2.6rem); letter-spacing:-.02em; margin:.4rem 0 1.2rem; }
.vp-desc__p{ font-size:1.15rem; line-height:1.75; color:#3a4046; font-weight:300; margin-bottom:1.1rem; }
[data-theme="dark"] .vp-desc__p{ color:rgba(233,237,241,.80); }
.vp-usp{ padding-block:clamp(3.5rem,7vw,6rem); }
.vp-usp .section__head{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
.vp-usp__grid{ max-width:var(--maxw); margin:1.5rem auto 0; padding-inline:var(--pad); display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
.usp{ background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:1.5rem 1.6rem; transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
.usp:hover{ transform:translateY(-4px); box-shadow:0 20px 40px rgba(51,51,51,.10); }
.usp__ic{ width:34px; height:34px; color:var(--brand); margin-bottom:.9rem; }
.usp h3{ font-size:1.1rem; font-weight:700; margin-bottom:.4rem; }
.usp p{ color:var(--muted); font-size:.92rem; line-height:1.5; }
.vp-ar{ max-width:var(--maxw); margin:0 auto; padding:clamp(3rem,6vw,5rem) var(--pad); }
.vp3d{ display:grid; grid-template-columns:1.6fr 1fr; gap:clamp(20px,3vw,40px); align-items:stretch; margin-top:1.5rem; }
.vp3d__viewer{ position:relative; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:#fff; aspect-ratio:4/3; display:block; }
.vp3d__launch img{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:2rem; transition:transform .5s var(--ease); }
.vp3d__launch:hover img{ transform:scale(1.03); }
.vp3d__badge{ position:absolute; top:14px; left:14px; background:var(--brand); color:#fff; font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; padding:.35rem .7rem; border-radius:4px; z-index:2; }
.vp3d__play{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:64px; height:64px; border-radius:50%; background:var(--accent); display:grid; place-items:center; box-shadow:0 10px 30px rgba(232,48,56,.4); transition:transform .3s var(--ease); z-index:2; }
.vp3d__launch:hover .vp3d__play{ transform:translate(-50%,-50%) scale(1.08); }
.vp3d__play svg{ width:28px; height:28px; }
.vp3d__hint{ position:absolute; bottom:14px; left:50%; transform:translateX(-50%); background:rgba(22,26,30,.82); color:#fff; font-size:.8rem; font-weight:600; padding:.4rem .9rem; border-radius:40px; z-index:2; white-space:nowrap; }
.vp3d__side{ display:flex; flex-direction:column; justify-content:center; gap:1rem; }
.vp3d__side h3{ font-size:1.4rem; font-weight:700; }
.vp3d__side p{ color:var(--muted); line-height:1.6; }
.vp3d__side .btn{ align-self:flex-start; }
.vp3d__qr{ display:flex; align-items:center; gap:.9rem; margin-top:.5rem; }
.vp3d__qr img{ width:96px; height:96px; border:1px solid var(--line); border-radius:8px; padding:6px; background:#fff; }
.vp3d__qr span{ font-size:.85rem; color:var(--muted); max-width:150px; }
.vp-dims{ padding-block:clamp(3.5rem,7vw,6rem); }
.vp-dims .section__head{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--pad); }
.vp-dl{ max-width:var(--maxw); margin:0 auto; padding:clamp(3rem,6vw,5rem) var(--pad); }
.vp-dl__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:1.2rem; }
.vp-dl__item{ display:flex; align-items:center; gap:.9rem; padding:1.1rem 1.3rem; border:1px solid var(--line); border-radius:var(--r); background:#fff; transition:all .3s var(--ease); }
.vp-dl__item:hover{ border-color:var(--brand); transform:translateY(-2px); }
.vp-dl__ext{ font-family:var(--mono); font-size:.7rem; font-weight:700; color:var(--brand); border:1px solid var(--line); border-radius:4px; padding:.2rem .4rem; }
.vp-dl__t{ font-weight:600; font-size:.95rem; }
.vp-dl__item.is-soon{ opacity:.5; pointer-events:none; }
.vp-dl__item small, .vp-dl__label small{ margin-left:auto; font-size:.68rem; color:var(--muted); text-transform:uppercase; letter-spacing:.08em; }
.vp-dl__sub{ font-size:1.05rem; font-weight:700; margin:2rem 0 1rem; }
.vp-dl__labels{ display:flex; flex-wrap:wrap; gap:.7rem; }
.vp-dl__label{ display:inline-flex; align-items:center; gap:.5rem; padding:.6rem 1rem; border:1px solid var(--line); border-radius:40px; font-size:.85rem; font-weight:600; font-family:var(--mono); background:#fff; }
.vp-dl__label.is-soon{ opacity:.55; pointer-events:none; }
@media(max-width:860px){ .vp-usp__grid{ grid-template-columns:1fr 1fr; } .vp3d{ grid-template-columns:1fr; } .vp-dl__grid{ grid-template-columns:1fr; } }
@media(max-width:560px){ .vp-usp__grid{ grid-template-columns:1fr; } }

/* ============================================================
   VITAL PLUS v2 — premium hero, gallery, lightbox, full specs, diagram
   ============================================================ */
.vp-hero{ position:relative; overflow:hidden; background:linear-gradient(180deg,#fbfcfd 0%,#eaf1f9 100%); }
.vp-hero__grid{ position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(rgba(16,104,176,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(16,104,176,.055) 1px,transparent 1px);
  background-size:60px 60px; -webkit-mask-image:radial-gradient(120% 80% at 82% 0,#000,transparent 70%); mask-image:radial-gradient(120% 80% at 82% 0,#000,transparent 70%); }
.vp-hero__in{ position:relative; z-index:1; max-width:var(--maxw); margin:0 auto; padding:132px var(--pad) 4rem; display:grid; grid-template-columns:1.02fr .98fr; gap:clamp(24px,4vw,56px); align-items:center; }
.vp-hero__kicker{ display:flex; align-items:center; gap:.6rem; font-family:var(--mono); font-size:.74rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-bottom:1.2rem; }
.vp-hero__new{ background:var(--accent); color:#fff; padding:.25rem .6rem; border-radius:4px; letter-spacing:.1em; }
.vp-hero__title{ font-family:var(--font); font-weight:300; font-size:clamp(3rem,7vw,5.6rem); letter-spacing:-.03em; line-height:.95; margin:0 0 1.1rem; }
.vp-hero__lead{ font-size:clamp(1.1rem,1.4vw,1.35rem); color:#454b51; font-weight:300; max-width:480px; margin-bottom:1.8rem; line-height:1.55; }
.vp-hero__chips{ display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; max-width:540px; margin-bottom:2rem; }
.vpchip{ background:rgba(255,255,255,.72); border:1px solid var(--line); border-radius:10px; padding:.8rem .6rem; text-align:center; backdrop-filter:blur(6px); }
.vpchip svg{ width:22px; height:22px; color:var(--brand); margin:0 auto .35rem; display:block; }
.vpchip b{ display:block; font-size:.98rem; font-weight:700; color:var(--ink); }
.vpchip span{ font-size:.66rem; color:var(--muted); }
.vp-hero__cta{ display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:1.6rem; }
.vp-hero__price{ font-size:1.5rem; font-weight:700; color:var(--ink); }
.vp-hero__from{ font-size:1rem; font-weight:400; color:var(--muted); }
.vp-hero__vat{ font-size:.85rem; font-weight:400; color:var(--muted); }
.vp-hero__art{ position:relative; display:grid; place-items:center; min-height:340px; }
.vp-hero__glow{ position:absolute; width:82%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgba(16,104,176,.24),rgba(16,104,176,0) 66%); }
.vp-hero__art img{ position:relative; z-index:1; max-width:110%; width:110%; filter:drop-shadow(0 34px 52px rgba(20,40,70,.24)); }
@media(max-width:900px){ .vp-hero__in{ grid-template-columns:1fr; } .vp-hero__art{ order:-1; min-height:auto; } .vp-hero__art img{ width:86%; max-width:86%; } }
@media(max-width:520px){ .vp-hero__chips{ grid-template-columns:1fr 1fr; } }

.vp-gallery{ max-width:var(--maxw); margin:0 auto; padding:clamp(3rem,6vw,5rem) var(--pad); }
.vpg{ position:relative; display:flex; align-items:center; gap:1rem; margin-top:1.5rem; }
.vpg__stage{ flex:1; position:relative; aspect-ratio:16/9; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:#fff; cursor:zoom-in; padding:0; }
.vpg__main{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s var(--ease); }
.vpg__stage:hover .vpg__main{ transform:scale(1.02); }
.vpg__zoom{ position:absolute; top:14px; right:14px; width:38px; height:38px; border-radius:50%; background:rgba(22,26,30,.6); display:grid; place-items:center; }
.vpg__zoom svg{ width:18px; height:18px; }
.vpg__nav{ width:44px; height:44px; flex:none; border-radius:50%; border:1px solid var(--line); background:#fff; color:var(--graphite); font-size:1.4rem; cursor:pointer; transition:all .25s var(--ease); }
.vpg__nav:hover{ border-color:var(--brand); color:var(--brand); }
.vpg__thumbs{ display:grid; grid-template-columns:repeat(4,1fr); gap:.7rem; margin-top:.9rem; }
.vpg__thumb{ aspect-ratio:16/10; border:1px solid var(--line); border-radius:8px; overflow:hidden; background:#fff; cursor:pointer; padding:0; transition:all .25s var(--ease); }
.vpg__thumb img{ width:100%; height:100%; object-fit:cover; }
.vpg__thumb.is-active{ border-color:var(--brand); box-shadow:0 0 0 2px rgba(16,104,176,.25); }
@media(max-width:640px){ .vpg__thumbs{ grid-template-columns:repeat(3,1fr); } .vpg__nav{ display:none; } .vpg__stage{ aspect-ratio:4/3; } }

.vlb{ position:fixed; inset:0; z-index:200; background:rgba(10,14,20,.92); display:none; align-items:center; justify-content:center; }
.vlb.is-open{ display:flex; }
.vlb__img{ max-width:90vw; max-height:86vh; object-fit:contain; border-radius:6px; }
.vlb__close{ position:absolute; top:20px; right:24px; background:none; border:0; color:#fff; font-size:1.8rem; cursor:pointer; opacity:.85; }
.vlb__nav{ position:absolute; top:50%; transform:translateY(-50%); width:52px; height:52px; border-radius:50%; border:1px solid rgba(255,255,255,.3); background:rgba(255,255,255,.08); color:#fff; font-size:1.8rem; cursor:pointer; }
.vlb__prev{ left:24px; } .vlb__next{ right:24px; }
.vlb__nav:hover{ background:rgba(255,255,255,.18); }

.rc-vtable th{ text-transform:none; font-size:.85rem; letter-spacing:0; background:#fff; color:var(--ink); font-weight:600; white-space:normal; }
.rc-vtable thead th{ background:var(--graphite); color:#fff; font-family:var(--mono); font-size:.74rem; white-space:nowrap; }
.rc-vtable thead th:first-child{ text-align:left; }
.rc-vtable td{ text-align:center; }
.rc-vtable tbody th{ text-align:left; border-top:1px solid var(--line); }
.rc-vgroup td{ background:var(--craft); font-weight:700; text-transform:uppercase; letter-spacing:.06em; font-size:.72rem; color:var(--brand); font-family:var(--mono); text-align:left; }
.vp-diagram{ max-width:var(--maxw); margin:1.5rem auto; padding-inline:var(--pad); display:grid; grid-template-columns:1fr 1fr; gap:1.4rem; }
.vp-diagram__fig{ background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:1.5rem; text-align:center; margin:0; }
.vp-diagram__fig svg{ width:100%; max-width:360px; height:auto; }
.vp-diagram__fig figcaption{ margin-top:.6rem; font-size:.82rem; color:var(--muted); font-family:var(--mono); letter-spacing:.02em; }
@media(max-width:640px){ .vp-diagram{ grid-template-columns:1fr; } }

/* Vital Plus "new" USP badge */
.usp{ position:relative; }
.usp--new{ border-color:rgba(16,104,176,.35); box-shadow:0 8px 30px rgba(16,104,176,.08); }
.usp__tag{ position:absolute; top:12px; right:12px; background:var(--accent); color:#fff; font-family:var(--mono); font-size:.6rem; letter-spacing:.12em; text-transform:uppercase; padding:.2rem .5rem; border-radius:4px; }

/* Colour-code legend + flexible gallery thumbs */
.rc-legend{ max-width:var(--maxw); margin:1rem auto 0; padding-inline:var(--pad); font-size:.86rem; color:var(--muted); }
.rc-legend b{ font-family:var(--mono); color:var(--ink); background:var(--craft); padding:.05rem .4rem; border-radius:3px; margin-left:.35rem; }
.vpg__thumbs{ display:flex !important; flex-wrap:wrap; gap:.7rem; }
.vpg__thumb{ flex:1 1 100px; max-width:150px; }

/* ============================================================
   FROZEN FIRST COLUMN — wide transposed spec tables
   ============================================================ */
.rc-tablewrap{ position:relative; }
/* overflow:hidden (from .rc-table) turns the table into its own scroll container and
   breaks sticky cells — make the vtable overflow-visible & border-separate so left:0 sticks to the wrap */
.rc-vtable{ position:relative; overflow:visible; border-collapse:separate; border-spacing:0; }
.rc-vtable thead th:first-child,
.rc-vtable tbody th{ position:sticky; left:0; z-index:2; min-width:148px; max-width:220px; }
.rc-vtable thead th:first-child{ z-index:5; background:var(--graphite);
  box-shadow:8px 0 12px -8px rgba(0,0,0,.28), inset -1px 0 0 rgba(255,255,255,.12); }
.rc-vtable tbody th{ background:#fff; box-shadow:8px 0 12px -8px rgba(0,0,0,.14); }
.rc-vtable tbody tr:hover th{ background:var(--craft); }
.rc-vtable .rc-vgroup td{ position:sticky; left:0; z-index:1; }
/* right-edge scroll hint over the wide table */
.rc-tablewrap:has(.rc-vtable)::after{ content:""; position:absolute; top:0; right:0; bottom:0; width:38px;
  background:linear-gradient(to right,rgba(255,255,255,0),rgba(255,255,255,.9)); pointer-events:none; border-radius:0 var(--r) var(--r) 0; }
.rc-swipe{ max-width:var(--maxw); margin:.6rem auto 0; padding-inline:var(--pad); font-size:.78rem; color:var(--muted);
  font-family:var(--mono); letter-spacing:.03em; display:flex; align-items:center; gap:.4rem; }
.rc-swipe svg{ width:15px; height:15px; }
@media(min-width:1100px){ .rc-swipe{ display:none; } }

/* ============================================================
   MEGA MENU FIX — keep links light on solid (inner-page) nav
   ============================================================ */
.nav--solid .mega a{ color:rgba(255,255,255,.64); }
.nav--solid .mega .mega__col h4 a,
.nav--solid .mega .mega__col a:hover,
.nav--solid .mega .mega__promo h5{ color:#fff; }
.nav--solid .mega .btn--red{ color:#fff; }
.mega a::after{ display:none !important; } /* kill the nav underline bar inside the mega */

/* ============================================================
   3D/AR COLOUR SWATCHES (multi-colour models)
   ============================================================ */
.vp3d__colors{ display:flex; align-items:center; flex-wrap:wrap; gap:.6rem .9rem; margin:.2rem 0 .4rem; }
.vp3d__colors-lbl{ font-size:.8rem; color:var(--muted); font-weight:600; }
.vp3d__sws{ display:flex; flex-wrap:wrap; gap:.5rem; }
.vp3d__sw{ display:inline-flex; align-items:center; gap:.45rem; padding:.34rem .7rem .34rem .5rem; border:1.5px solid var(--line);
  background:#fff; border-radius:40px; cursor:pointer; transition:border-color .25s var(--ease), box-shadow .25s var(--ease); }
.vp3d__sw i{ width:16px; height:16px; border-radius:50%; background:var(--sw); box-shadow:inset 0 0 0 1px rgba(0,0,0,.14); flex:none; }
.vp3d__sw em{ font-style:normal; font-size:.82rem; font-weight:600; color:var(--ink); }
.vp3d__sw:hover{ border-color:var(--brand); }
.vp3d__sw.is-active{ border-color:var(--brand); box-shadow:0 0 0 3px rgba(16,104,176,.14); }
#ar-preview{ transition:opacity .25s var(--ease); }

/* ============================================================
   FRESH AIR KIT — Nature-only accessory section
   ============================================================ */
.vp-fresh{ max-width:var(--maxw); margin:0 auto; padding:clamp(3rem,6vw,5rem) var(--pad); }
.vp-fresh__in{ display:grid; grid-template-columns:0.92fr 1.08fr; gap:clamp(24px,4vw,56px); align-items:center;
  background:linear-gradient(150deg,#0f1216,#191d22); border-radius:calc(var(--r) + 4px); overflow:hidden;
  box-shadow:0 40px 90px rgba(15,18,22,.22); }
.vp-fresh__media{ position:relative; align-self:stretch; display:flex; align-items:center; justify-content:center;
  background:radial-gradient(120% 90% at 30% 20%,rgba(16,104,176,.30),rgba(15,18,22,0) 60%); padding:clamp(1.5rem,3vw,2.6rem); }
.vp-fresh__media img{ width:100%; max-width:420px; height:auto; object-fit:contain; filter:drop-shadow(0 24px 40px rgba(0,0,0,.45)); }
.vp-fresh__tag{ position:absolute; top:18px; left:18px; z-index:2; background:var(--accent); color:#fff; font-family:var(--mono);
  font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; padding:.32rem .7rem; border-radius:5px; }
.vp-fresh__txt{ padding:clamp(1.6rem,3vw,3rem) clamp(1.4rem,3vw,3rem) clamp(1.6rem,3vw,3rem) 0; color:#fff; }
.vp-fresh__txt .eyebrow{ color:var(--accent); }
.vp-fresh__h{ font-size:clamp(1.5rem,2.6vw,2.1rem); font-weight:700; line-height:1.15; margin:.5rem 0 .5rem; color:#fff; }
.vp-fresh__model{ font-family:var(--mono); font-size:.82rem; letter-spacing:.04em; color:rgba(255,255,255,.55); margin-bottom:1rem; }
.vp-fresh__p{ color:rgba(255,255,255,.74); line-height:1.65; font-size:.96rem; margin-bottom:1.4rem; }
.vp-fresh__feats{ display:grid; grid-template-columns:1fr 1fr; gap:.7rem 1.2rem; margin-bottom:1.4rem; }
.vp-fresh__feat{ display:flex; align-items:center; gap:.6rem; }
.vp-fresh__feat svg{ width:24px; height:24px; color:var(--brand-l,#5aa6e0); flex:none; }
.vp-fresh__feat b{ font-size:.9rem; font-weight:600; color:#fff; }
.vp-fresh__spec{ list-style:none; margin:0 0 1.5rem; padding:1rem 0 0; border-top:1px solid rgba(255,255,255,.12); display:grid; gap:.55rem; }
.vp-fresh__spec li{ display:flex; justify-content:space-between; gap:1rem; font-size:.88rem; }
.vp-fresh__spec li span{ color:rgba(255,255,255,.55); }
.vp-fresh__spec li b{ color:#fff; font-weight:600; text-align:right; }
.vp-fresh__buy{ display:flex; align-items:center; gap:1.3rem; flex-wrap:wrap; }
.vp-fresh__price{ font-size:1.5rem; font-weight:700; color:#fff; }
.vp-fresh__from{ font-size:.9rem; font-weight:500; color:rgba(255,255,255,.6); }
.vp-fresh__vat{ font-size:.8rem; font-weight:500; color:rgba(255,255,255,.55); }
@media(max-width:820px){ .vp-fresh__in{ grid-template-columns:1fr; } .vp-fresh__txt{ padding:0 clamp(1.4rem,5vw,2.4rem) clamp(2rem,6vw,2.6rem); }
  .vp-fresh__media{ min-height:280px; } .vp-fresh__feats{ grid-template-columns:1fr; } }

/* ============================================================
   MULTI / LCAC — combinations grid + indoor-unit families
   ============================================================ */
.mx-combos__grid{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--pad); display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.2rem; }
.mx-combo{ background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:1.3rem 1.4rem; }
.mx-combo h3{ font-family:var(--mono); font-size:.9rem; color:var(--brand); margin-bottom:.8rem; letter-spacing:.02em; }
.mx-combo__row{ display:flex; justify-content:space-between; gap:1rem; padding:.5rem 0; border-top:1px solid var(--line); font-size:.86rem; }
.mx-combo__row:first-of-type{ border-top:0; }
.mx-combo__row span{ color:var(--muted); white-space:nowrap; }
.mx-combo__row b{ text-align:right; color:var(--ink); font-weight:600; }

.mx-idu{ max-width:var(--maxw); margin:0 auto; padding:clamp(3rem,6vw,5rem) var(--pad); }
.mx-idu__list{ display:flex; flex-direction:column; gap:2.4rem; }
.mx-fam{ }
.mx-fam__head{ display:flex; align-items:center; flex-wrap:wrap; gap:.7rem 1rem; margin-bottom:1rem; }
.mx-fam__head h3{ font-size:1.35rem; font-weight:700; color:var(--ink); }
.mx-fam__kind{ font-family:var(--mono); font-size:.64rem; letter-spacing:.12em; text-transform:uppercase; color:#fff; background:var(--graphite); padding:.3rem .6rem; border-radius:5px; }
.mx-fam__note{ font-size:.76rem; font-weight:600; color:var(--accent); background:rgba(232,48,56,.08); padding:.24rem .6rem; border-radius:40px; }
.mx-fam__link{ margin-left:auto; color:var(--brand); font-weight:600; font-size:.88rem; }
.mx-fam__link:hover{ text-decoration:underline; }
.mx-fam .rc-table td small{ color:var(--muted); font-size:.82em; }
.mx-idu__cta{ display:flex; gap:1rem; flex-wrap:wrap; justify-content:center; margin-top:2.6rem; }
@media(max-width:600px){ .mx-fam__link{ margin-left:0; } }

/* ============================================================
   5-YEAR WARRANTY band (series pages)
   ============================================================ */
.vp-warranty{ max-width:var(--maxw); margin:0 auto; padding:0 var(--pad) clamp(1rem,3vw,2rem); }
.vp-warranty__in{ display:flex; align-items:center; gap:clamp(1.3rem,3vw,2.8rem); flex-wrap:wrap;
  background:linear-gradient(120deg,#0f1216,#1c2230); border-radius:calc(var(--r) + 4px);
  padding:clamp(1.6rem,3vw,2.4rem) clamp(1.6rem,3.5vw,3rem); color:#fff; box-shadow:0 30px 70px rgba(15,18,22,.18); }
.vp-warranty__badge{ flex:none; width:104px; height:104px; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; text-align:center;
  background:radial-gradient(circle at 50% 35%,rgba(16,104,176,.35),rgba(16,104,176,0) 70%); border:1.5px solid rgba(90,166,224,.45); }
.vp-warranty__badge svg{ width:22px; height:22px; color:#5aa6e0; margin-bottom:2px; }
.vp-warranty__badge b{ font-size:1.75rem; font-weight:800; line-height:1; color:#fff; }
.vp-warranty__badge span{ font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.6); font-family:var(--mono); }
.vp-warranty__txt{ flex:1 1 320px; }
.vp-warranty__txt h2{ font-size:clamp(1.4rem,2.4vw,1.9rem); font-weight:700; margin-bottom:.5rem; color:#fff; }
.vp-warranty__txt p{ color:rgba(255,255,255,.72); line-height:1.6; font-size:.96rem; margin-bottom:1rem; max-width:64ch; }
.vp-warranty__pts{ display:flex; flex-wrap:wrap; gap:.6rem .7rem; }
.vp-warranty__pts span{ font-size:.8rem; font-weight:600; color:#dfe6ee; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.12); padding:.35rem .8rem; border-radius:40px; position:relative; padding-left:1.7rem; }
.vp-warranty__pts span::before{ content:""; position:absolute; left:.7rem; top:50%; transform:translateY(-50%); width:8px; height:8px; border-radius:50%; background:#5aa6e0; }
@media(max-width:560px){ .vp-warranty__in{ flex-direction:column; align-items:flex-start; text-align:left; } }

/* Installation drawing photos (LCAC/Multi dims from cooperhunter.pl) */
.vp-diagram--photo{ grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.vp-diagram--photo .vp-diagram__fig img{ width:100%; max-width:440px; height:auto; margin:0 auto; display:block; mix-blend-mode:multiply; }
.rc-legend--wide{ margin-top:1.1rem; line-height:1.7; }
.rc-legend--wide b{ margin-left:0; margin-right:.35rem; }

/* ============================================================
   SOLUTION pages — "other solutions" cross-links
   ============================================================ */
.soln-x{ max-width:var(--maxw); margin:0 auto; padding:clamp(2.5rem,5vw,4rem) var(--pad) clamp(1rem,3vw,2rem); }
.soln-x__row{ display:grid; grid-template-columns:1fr 1fr; gap:1.2rem; }
.soln-x__card{ display:flex; align-items:center; gap:1rem; padding:1.5rem 1.7rem; border:1px solid var(--line); border-radius:var(--r);
  background:#fff; transition:border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease); }
.soln-x__card:hover{ border-color:var(--brand); box-shadow:0 18px 40px rgba(16,104,176,.1); transform:translateY(-3px); }
.soln-x__k{ font-family:var(--mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--brand); font-weight:600; }
.soln-x__t{ flex:1; font-size:1.05rem; font-weight:600; color:var(--ink); }
.soln-x__card .soln-x__k{ flex:none; min-width:96px; }
.soln-x__go{ font-size:1.4rem; color:var(--brand); transition:transform .25s var(--ease); }
.soln-x__card:hover .soln-x__go{ transform:translateX(5px); }
@media(max-width:640px){ .soln-x__row{ grid-template-columns:1fr; } .soln-x__card{ flex-wrap:wrap; } }

/* ============================================================
   VRF — project CTA band, key-spec table, "on request" price
   ============================================================ */
.vrf-cta{ max-width:var(--maxw); margin:clamp(2rem,4vw,3.5rem) auto; padding-inline:var(--pad); }
.vrf-cta__in{ display:flex; align-items:center; justify-content:space-between; gap:clamp(1.5rem,3vw,3rem); flex-wrap:wrap;
  background:linear-gradient(120deg,var(--brand),#0a4f8a); color:#fff; border-radius:calc(var(--r) + 4px);
  padding:clamp(1.8rem,3.5vw,2.8rem) clamp(1.8rem,4vw,3.2rem); box-shadow:0 30px 70px rgba(16,104,176,.28); }
.vrf-cta__txt{ flex:1 1 380px; }
.vrf-cta__txt .eyebrow{ color:#bfe0ff; }
.vrf-cta__txt h2{ font-size:clamp(1.4rem,2.6vw,2rem); font-weight:700; margin:.4rem 0 .6rem; color:#fff; }
.vrf-cta__txt p{ color:rgba(255,255,255,.82); line-height:1.6; max-width:60ch; }
.vrf-cta__act{ display:flex; flex-direction:column; gap:.8rem; flex:none; }
.vrf-cta__act .btn--accent{ background:#fff; color:var(--brand); }
.vrf-cta__act .btn--accent:hover{ background:#eaf3fb; }
.vrf-cta__act .btn--lineLight{ border-color:rgba(255,255,255,.5); color:#fff; }
@media(max-width:720px){ .vrf-cta__act{ width:100%; } .vrf-cta__act .btn{ width:100%; text-align:center; } }

.rc-keyspec{ min-width:auto !important; }
.rc-keyspec th{ text-align:left; background:#fff; color:var(--ink); font-weight:600; text-transform:none; letter-spacing:0; font-size:.9rem; white-space:normal; width:52%; }
.rc-keyspec td{ text-align:right; font-weight:600; color:var(--brand); white-space:nowrap; }
.rc-card__price--req{ font-size:1rem !important; color:var(--muted) !important; font-weight:600; }
.vrf-price{ font-weight:700; color:var(--brand); }

/* ============================================================
   VRF interactive — quote button, modal, combinations accordion, IDU band
   ============================================================ */
.qbtn{ display:inline-flex; align-items:center; gap:.4rem; padding:.38rem .75rem; border:1.5px solid var(--brand); background:#fff; color:var(--brand); border-radius:40px; font-size:.78rem; font-weight:600; cursor:pointer; white-space:nowrap; transition:background .2s var(--ease),color .2s var(--ease); font-family:inherit; }
.qbtn svg{ width:15px; height:15px; }
.qbtn:hover{ background:var(--brand); color:#fff; }
.rc-vqrow td{ text-align:center; }
.rc-vqrow th{ background:#fff; }

.qmodal{ position:fixed; inset:0; z-index:200; display:none; align-items:center; justify-content:center; padding:1.2rem;
  background:rgba(15,18,22,.55); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.qmodal.is-open{ display:flex; }
.qmodal__box{ background:#fff; border-radius:calc(var(--r) + 4px); max-width:640px; width:100%; padding:clamp(1.6rem,3vw,2.4rem);
  position:relative; box-shadow:0 40px 90px rgba(0,0,0,.4); max-height:90vh; overflow:auto; }
.qmodal__close{ position:absolute; top:14px; right:14px; width:34px; height:34px; border-radius:50%; border:1px solid var(--line); background:#fff; cursor:pointer; font-size:.95rem; color:var(--muted); line-height:1; }
.qmodal__close:hover{ background:var(--craft); color:var(--ink); }
.qmodal__title{ font-size:1.3rem; font-weight:700; font-family:var(--mono); color:var(--ink); margin:.3rem 0 .3rem; }
.qmodal__hint{ font-size:.85rem; color:var(--muted); margin-bottom:.7rem; }
.qmodal__text{ background:var(--craft); border:1px solid var(--line); border-radius:var(--r); padding:1rem 1.1rem; font-size:.92rem; line-height:1.65; color:var(--ink); white-space:pre-wrap; }
.qmodal__act{ display:flex; align-items:center; gap:1rem; margin-top:1.1rem; }
.qmodal__toast{ font-size:.85rem; font-weight:600; color:#1a8f4a; opacity:0; transform:translateY(4px); transition:all .25s var(--ease); }
.qmodal__toast.is-show{ opacity:1; transform:none; }

.vac{ max-width:var(--maxw); margin:1.2rem auto 0; padding-inline:var(--pad); display:flex; flex-direction:column; gap:.8rem; }
.vac__item{ border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:#fff; }
.vac__head{ width:100%; display:flex; align-items:center; gap:1rem; padding:1.1rem 1.4rem; background:#fff; border:0; cursor:pointer; text-align:left; font-family:inherit; }
.vac__head:hover{ background:var(--craft); }
.vac__t{ font-size:1.05rem; font-weight:700; color:var(--ink); }
.vac__meta{ margin-left:auto; font-family:var(--mono); font-size:.8rem; color:var(--muted); white-space:nowrap; }
.vac__chev{ color:var(--brand); transition:transform .3s var(--ease); flex:none; font-size:.9rem; }
.vac__head[aria-expanded="true"] .vac__chev{ transform:rotate(180deg); }
.vac__head[aria-expanded="true"]{ background:var(--craft); }
.vac__panel{ max-height:0; overflow:hidden; transition:max-height .35s var(--ease); }
.vac__panel-in{ padding:.2rem 1rem 1.1rem; }
.vac__panel-in .rc-tablewrap{ padding-inline:0; }
@media(max-width:600px){ .vac__meta{ font-size:.7rem; } }

.idu-band{ max-width:var(--maxw); margin:clamp(2rem,4vw,3.5rem) auto; padding-inline:var(--pad); }
.idu-band__in{ display:flex; align-items:center; justify-content:space-between; gap:2rem; flex-wrap:wrap;
  background:var(--craft); border:1px solid var(--line); border-radius:calc(var(--r) + 4px); padding:clamp(1.6rem,3vw,2.4rem) clamp(1.6rem,4vw,3rem); }
.idu-band__txt h2{ font-size:clamp(1.3rem,2.4vw,1.8rem); font-weight:700; margin:.3rem 0 .5rem; color:var(--ink); }
.idu-band__txt p{ color:var(--muted); max-width:60ch; line-height:1.6; }
@media(max-width:700px){ .idu-band__in .btn{ width:100%; text-align:center; } .idu-band__in{ flex-direction:column; align-items:flex-start; } }

/* VRF IDU feature tags + browse-band photo */
.idu-tags{ display:flex; flex-wrap:wrap; gap:.4rem; margin:.1rem 0 1rem; }
.idu-tags span{ font-size:.7rem; font-weight:600; color:var(--brand); background:rgba(16,104,176,.08); padding:.24rem .6rem; border-radius:40px; }
.idu-band__media{ flex:none; width:220px; border-radius:var(--r); overflow:hidden; align-self:stretch; min-height:150px; }
.idu-band__media img{ width:100%; height:100%; object-fit:cover; display:block; }
.idu-band__txt{ flex:1 1 320px; }
.idu-band__txt .btn{ margin-top:1.1rem; }
.idu-band__btns{ display:flex; flex-wrap:wrap; gap:.7rem; margin-top:1.1rem; }
.idu-band__btns .btn{ margin-top:0; }
@media(max-width:700px){ .idu-band__media{ width:100%; height:180px; } }

/* VRF IDU type pages — compact USPs, lifestyle band, unit-render cards, ODU chips */
.vp-usp__grid--sm{ grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
.usp--sm{ padding:1.1rem 1.2rem; display:flex; align-items:center; gap:.8rem; }
.usp--sm .usp__ic{ width:26px; height:26px; margin:0; flex:none; }
.usp--sm h3{ font-size:.95rem; margin:0; }
.vp-lifestyle{ max-width:var(--maxw); margin:clamp(1.5rem,3vw,2.5rem) auto; padding-inline:var(--pad); }
.vp-lifestyle img{ width:100%; border-radius:calc(var(--r) + 4px); display:block; box-shadow:0 30px 70px rgba(15,18,22,.15); max-height:440px; object-fit:cover; object-position:center 35%; }
.rc-card__media--unit{ background:#fff; }
.rc-card__media--unit img{ object-fit:contain !important; padding:1.6rem; }
.vp-hero__art--idu img{ max-height:360px; }
.odu-chips{ display:flex; flex-wrap:wrap; gap:.5rem; margin:.3rem 0 1.2rem; }
.odu-chip{ font-family:var(--mono); font-size:.78rem; font-weight:600; color:var(--brand); border:1.5px solid var(--line); border-radius:40px; padding:.35rem .8rem; transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease); }
.odu-chip:hover{ border-color:var(--brand); background:var(--brand); color:#fff; }

/* ============================================================
   DAY / NIGHT — dark theme  (html[data-theme="dark"])
   Toggle lives next to the language switch (injected by script.js).
   Product image tiles, SVG diagrams and logo chips are deliberately
   kept light so white product cut-outs / dark-stroke drawings stay visible.
   ============================================================ */
[data-theme="dark"]{
  --white:#14171b;      /* main surface + body bg */
  --paper:#1b2026;      /* raised cards / hovers */
  --ink:#e9edf1;        /* primary text */
  --muted:#9aa4ae;      /* secondary text */
  --line:rgba(255,255,255,.13);
  --craft:#111823;      /* pale-blue editorial sections → deep blue */
  --blue:#16222b;
  --sand:#2a2018;
}
[data-theme="dark"] body{ background:var(--white); }

/* graphite-as-text → lift to readable on dark */
[data-theme="dark"] .eyebrow,
[data-theme="dark"] .section--craft .eyebrow{ color:#9aa4ae; }

/* hard-coded #fff CONTENT surfaces → dark card surface */
[data-theme="dark"] .ncard,
[data-theme="dark"] .rc-card,
[data-theme="dark"] .rc-table,
[data-theme="dark"] .usp,
[data-theme="dark"] .vp-dl__item,
[data-theme="dark"] .mx-combo,
[data-theme="dark"] .qmodal__box,
[data-theme="dark"] .qmodal__text,
[data-theme="dark"] .vac__item,
[data-theme="dark"] .vac__head,
[data-theme="dark"] .rc-keyspec th,
[data-theme="dark"] .rc-vtable th,
[data-theme="dark"] .rc-vtable tbody th,
[data-theme="dark"] .rc-vqrow th,
[data-theme="dark"] .qbtn,
[data-theme="dark"] .spec-nav__btn,
[data-theme="dark"] .dchip,
[data-theme="dark"] .dealer-search input,
[data-theme="dark"] .dealer-search select{
  background:var(--paper); color:var(--ink);
}
[data-theme="dark"] .qbtn{ border-color:var(--line); }
[data-theme="dark"] .rc-table td{ color:var(--ink); }        /* was #3a4046 */
[data-theme="dark"] .rc-table tbody tr:hover{ background:var(--blue); }

/* series-page product hero: light gradient → dark spotlight */
[data-theme="dark"] .vp-hero{ background:linear-gradient(180deg,#161c23 0%,#0e141d 100%); }

/* inner-page solid nav → dark glass */
[data-theme="dark"] .nav--solid{ background:rgba(16,19,23,.92); border-bottom-color:var(--line); }
[data-theme="dark"] .nav--solid.is-scrolled{ background:rgba(16,19,23,.97); box-shadow:0 6px 24px rgba(0,0,0,.4); }

/* ---- theme toggle button (mirrors the .lang pill) ---- */
.themeToggle{ background:none; border:1.5px solid rgba(255,255,255,.4); color:#fff; border-radius:999px;
  width:38px; height:34px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; padding:0; transition:all .3s; }
.themeToggle svg{ width:17px; height:17px; }
.themeToggle:hover{ border-color:#fff; }
.nav--solid .themeToggle{ border-color:rgba(22,26,30,.22); color:var(--ink); }

/* ============================================================
   PREMIUM MOTION — product hero + section reveals
   Series pages (.vp-hero) + category pages (.rc-cathero).
   Hero elements animate on load; sections reveal on scroll via
   CSS scroll timelines (progressive — no JS). Reduced-motion honoured.
   ============================================================ */
@keyframes chHeroRise{ from{ opacity:0; transform:translateY(26px); } to{ opacity:1; transform:none; } }
@keyframes chHeroArt{ from{ opacity:0; transform:translateY(34px) scale(.93); } to{ opacity:1; transform:none; } }
@keyframes chFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-11px); } }
@keyframes chGlow{ 0%,100%{ opacity:.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.07); } }
@keyframes chSectionRise{ from{ opacity:0; transform:translateY(38px); } to{ opacity:1; transform:none; } }

/* --- series hero: staggered content + floating product + pulsing glow --- */
.vp-hero__txt > *{ animation:chHeroRise .85s var(--ease) both; }
.vp-hero__txt > .rc-crumb{ animation-delay:.04s; }
.vp-hero__kicker{ animation-delay:.10s; }
.vp-hero__title{ animation-delay:.17s; }
.vp-hero__lead{ animation-delay:.25s; }
.vp-hero__chips{ animation-delay:.33s; }
.vp-hero__cta{ animation-delay:.42s; }
.vp-hero__price{ animation-delay:.50s; }
.vp-hero__art{ animation:chHeroArt 1.05s var(--ease) both .18s; }
.vp-hero__art img{ animation:chFloat 6.5s ease-in-out 1.4s infinite; }
.vp-hero__glow{ animation:chGlow 5.5s ease-in-out infinite; }

/* --- category hero (rc-cathero) --- */
.rc-cathero__txt > *{ animation:chHeroRise .85s var(--ease) both; }
.rc-cathero__txt > *:nth-child(1){ animation-delay:.05s; }
.rc-cathero__txt > *:nth-child(2){ animation-delay:.12s; }
.rc-cathero__txt > *:nth-child(3){ animation-delay:.20s; }
.rc-cathero__txt > *:nth-child(4){ animation-delay:.28s; }
.rc-cathero__txt > *:nth-child(5){ animation-delay:.36s; }
.rc-cathero__art{ animation:chHeroArt 1.1s var(--ease) both .20s; }

/* --- scroll-reveal for product-page sections (CSS scroll timeline) --- */
@supports (animation-timeline: view()){
  .vp-desc, .vp-gallery, .vp-usp, .rc-specs, .vp-dims, .vp-dl, .vp-warranty,
  .vp-fresh, .idu-band, .vac, .mx-combos, .mx-idu, .rc-cta, .vrf-cta{
    animation:chSectionRise linear both;
    animation-timeline:view();
    animation-range:entry 0% entry 60%;
  }
}

/* --- respect reduced-motion --- */
@media (prefers-reduced-motion: reduce){
  .vp-hero__txt > *, .vp-hero__art, .vp-hero__art img, .vp-hero__glow,
  .rc-cathero__txt > *, .rc-cathero__art,
  .vp-desc, .vp-gallery, .vp-usp, .rc-specs, .vp-dims, .vp-dl, .vp-warranty,
  .vp-fresh, .idu-band, .vac, .mx-combos, .mx-idu, .rc-cta, .vrf-cta{
    animation:none !important; opacity:1 !important; transform:none !important;
  }
}

/* ============================================================
   INTER display tuning — crisp modern-tech headings
   ============================================================ */
body{ -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; text-rendering:optimizeLegibility; }
.vhero__title, .vp-hero__title, .rc-cathero__title, .ehero__title{ letter-spacing:-.022em; }
.section__title, .vp-desc__h, .about-story__txt h2, .chbrand h2{ letter-spacing:-.015em; }

/* keep spec-table numbers aligned without monospace */
.rc-table, .rc-vtable, .rc-keyspec, .mx-combo, .tl b, .rc-t__price, .vp-hero__price, .rc-catstats b{ font-variant-numeric:tabular-nums; }

/* ---------- Inline 3D product model (model-viewer) ---------- */
.vp-hero__3d{ width:100%; height:100%; min-height:460px; background:transparent; --poster-color:transparent;
  --progress-bar-color:var(--brand); --progress-mask:transparent; outline:none; }
.vp-hero__art{ min-height:460px; }

/* ============================================================
   LIQUID-GLASS NAVIGATION (Apple-style frosted glass)
   ============================================================ */
.nav--solid{
  background:rgba(255,255,255,.55);
  backdrop-filter:blur(22px) saturate(185%); -webkit-backdrop-filter:blur(22px) saturate(185%);
  border-bottom:1px solid rgba(255,255,255,.55);
  box-shadow:0 6px 30px rgba(17,24,39,.07), inset 0 1px 0 rgba(255,255,255,.7);
}
.nav--solid.is-scrolled{ background:rgba(255,255,255,.62); box-shadow:0 10px 36px rgba(17,24,39,.10), inset 0 1px 0 rgba(255,255,255,.7); }
[data-theme="dark"] .nav--solid{
  background:rgba(18,21,26,.5);
  border-bottom-color:rgba(255,255,255,.09);
  box-shadow:0 10px 36px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.07);
}
[data-theme="dark"] .nav--solid.is-scrolled{ background:rgba(18,21,26,.62); }
/* homepage transparent nav → frosted glass once scrolled */
.nav.is-scrolled{
  background:rgba(20,22,28,.42);
  backdrop-filter:blur(22px) saturate(175%); -webkit-backdrop-filter:blur(22px) saturate(175%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10), 0 10px 36px rgba(0,0,0,.22);
}

/* ============================================================
   PREMIUM ENTRANCES — section titles reveal on scroll-in;
   form fields cascade in on load. Fast, smooth, reduced-motion aware.
   ============================================================ */
@keyframes chLeadIn { from{ opacity:0; transform:translateY(14px); } to{ opacity:1; transform:none; } }
@keyframes chFieldIn{ from{ opacity:0; transform:translateY(13px); } to{ opacity:1; transform:none; } }

@supports (animation-timeline: view()){
  .section__title, .dl-cat{
    animation:chLeadIn linear both; animation-timeline:view(); animation-range:entry 0% entry 40%;
  }
  .reveal .section__title{ animation:none; }   /* homepage handles these via JS .reveal */
}

.contact__form .field, .contact__form > .btn{
  animation:chFieldIn .5s var(--ease) both; animation-delay:calc(var(--fi,0) * 65ms);
}

@media (prefers-reduced-motion: reduce){
  .section__title, .dl-cat, .contact__form .field, .contact__form > .btn{
    animation:none !important; opacity:1 !important; transform:none !important;
  }
}

/* ============================================================
   FLOATING GLASS NAV — detached rounded "menu island" (Apple-style)
   Glass moves onto the inner pill; the bar is transparent.
   ============================================================ */
.nav--solid, .nav.is-scrolled{ background:transparent !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; border-bottom:0 !important; box-shadow:none !important; }
.nav{ padding-top:.6rem; }
.nav__inner{
  max-width:min(1180px, calc(100% - 1.8rem));
  padding:.5rem .8rem .5rem 1.15rem;
  border-radius:22px; border:1px solid transparent;
  transition:padding .4s var(--ease), background .45s var(--ease), box-shadow .45s var(--ease), border-color .45s var(--ease);
}
.nav.is-scrolled .nav__inner{ padding-top:.42rem; padding-bottom:.42rem; }
/* homepage island (over hero / video) — dark frosted */
.nav:not(.nav--solid) .nav__inner{
  background:rgba(18,20,26,.4);
  backdrop-filter:blur(20px) saturate(175%); -webkit-backdrop-filter:blur(20px) saturate(175%);
  border-color:rgba(255,255,255,.14);
  box-shadow:0 16px 46px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.14);
}
.nav:not(.nav--solid).is-scrolled .nav__inner{ background:rgba(18,20,26,.26); }   /* more transparent while sliding */
/* inner-page island — light frosted */
.nav--solid .nav__inner{
  background:rgba(255,255,255,.62);
  backdrop-filter:blur(22px) saturate(190%); -webkit-backdrop-filter:blur(22px) saturate(190%);
  border-color:rgba(255,255,255,.6);
  box-shadow:0 16px 46px rgba(17,24,39,.10), inset 0 1px 0 rgba(255,255,255,.72);
}
.nav--solid.is-scrolled .nav__inner{ background:rgba(255,255,255,.48); }          /* more transparent while sliding */
[data-theme="dark"] .nav--solid .nav__inner{
  background:rgba(20,23,28,.52); border-color:rgba(255,255,255,.08);
  box-shadow:0 16px 46px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.06);
}
[data-theme="dark"] .nav--solid.is-scrolled .nav__inner{ background:rgba(20,23,28,.4); }

/* ============================================================
   APPLE-STYLE POLISH — springy motion, soft depth, tactile micro-interactions
   ============================================================ */
:root{ --spring:cubic-bezier(.34,1.4,.5,1); }

/* brand-tinted text selection */
::selection{ background:rgba(16,104,176,.20); }
[data-theme="dark"] ::selection{ background:rgba(64,150,230,.34); }

/* smooth anchor scrolling */
@media (prefers-reduced-motion: no-preference){ html{ scroll-behavior:smooth; } }

/* Buttons — gentle lift + press, glow on primary */
.btn{ transition:transform .35s var(--spring), box-shadow .35s var(--ease), background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease); }
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0) scale(.98); }
.btn--accent{ box-shadow:0 8px 22px rgba(232,48,56,.26); }
.btn--accent:hover{ box-shadow:0 14px 32px rgba(232,48,56,.36); }

/* Cards — softer radius, smoother spring lift, refined depth */
.card, .ncard, .rc-card{ border-radius:18px; transition:transform .5s var(--spring), box-shadow .5s var(--ease), border-color .4s var(--ease); }
.card:hover, .ncard:hover, .rc-card:hover{ transform:translateY(-6px); box-shadow:0 28px 54px rgba(17,24,39,.13); border-color:rgba(16,104,176,.18); }
[data-theme="dark"] .card:hover, [data-theme="dark"] .ncard:hover, [data-theme="dark"] .rc-card:hover{ box-shadow:0 28px 54px rgba(0,0,0,.5); }

/* Accessible, crisp focus ring */
a:focus-visible, button:focus-visible, .btn:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:2px solid var(--brand); outline-offset:3px; border-radius:8px;
}

/* Spec chips read as frosted "material" tiles */
.vpchip{ background:rgba(255,255,255,.66); backdrop-filter:blur(10px) saturate(160%); -webkit-backdrop-filter:blur(10px) saturate(160%); transition:transform .4s var(--spring), box-shadow .4s var(--ease); }
.vpchip:hover{ transform:translateY(-3px); box-shadow:0 12px 26px rgba(17,24,39,.09); }
[data-theme="dark"] .vpchip{ background:rgba(255,255,255,.06); }

/* ============================================================
   MEGA MENU → floating glass island (matches the nav pill)
   ============================================================ */
.mega{
  top:calc(100% + 12px); left:50%; right:auto;
  width:min(1240px, calc(100vw - 2rem));
  transform:translateX(-50%) translateY(-8px);
  border-radius:24px; border:1px solid rgba(255,255,255,.12);
  background:rgba(17,19,25,.74);
  -webkit-backdrop-filter:blur(30px) saturate(185%); backdrop-filter:blur(30px) saturate(185%);
  box-shadow:0 34px 80px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.10);
}
.nav__item--mega:hover > .mega, .mega:hover{ transform:translateX(-50%) translateY(0); }
.mega::before{ top:-16px; height:18px; left:0; right:0; }      /* hover bridge over the gap */
.mega__inner{ padding:1.9rem 2.1rem 2.1rem; }
.mega__inner--sol{ grid-template-columns:repeat(3,minmax(0,1fr)) minmax(230px,1.4fr); }
.mega__promo-img{ border-radius:14px; }

/* ============================================================
   HERO gateway buttons — rounded + refined (were square)
   ============================================================ */
.vpath{ border-radius:18px; }
.vpath__ic{ border-radius:13px; }
.vhero__paths{ gap:.9rem; }
.vpath:hover{ transform:translateY(-4px); box-shadow:0 18px 44px rgba(0,0,0,.30); }

/* ============================================================
   USP cards — bigger, warmer, coloured icon tiles (Apple feature style)
   ============================================================ */
.vp-usp__grid{ grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:1.6rem; }
.usp{ border-radius:20px; padding:2rem 1.9rem 1.9rem; background:linear-gradient(180deg,#ffffff,#f7fafd); }
.usp:hover{ transform:translateY(-5px); box-shadow:0 26px 52px rgba(17,24,39,.12); }
.usp__ic{ width:54px; height:54px; padding:13px; box-sizing:border-box; border-radius:15px; background:rgba(16,104,176,.10); color:var(--brand); margin-bottom:1.2rem; }
.usp h3{ font-size:1.18rem; margin-bottom:.5rem; }
[data-theme="dark"] .usp{ background:linear-gradient(180deg,var(--paper),#171b21); }
[data-theme="dark"] .usp__ic{ background:rgba(64,150,230,.16); }
.usp--sm .usp__ic{ padding:0; background:none; border-radius:0; }   /* leave the compact VRF-IDU variant as-is */

/* ============================================================
   TYPOGRAPHY — balanced wrapping (no more awkward mid-line breaks)
   ============================================================ */
h1, h2, h3, .section__title, .section__lead, .vhero__title, .vhero__lead,
.hero__title, .hero__lead, .rc-cathero__title, .rc-cathero__lead,
.vp-hero__title, .vp-hero__lead, .vp-desc__h, .band__lead, .phero__lead,
.rc-hero__title, .mega__promo h5{ text-wrap:balance; }
p, .vp-desc__p, .card__body p, .ncard__body p, .usp p, .rc-card__tag, .rc-cathero__lead{ text-wrap:pretty; }
/* give cramped leads a little more room so they aren't stuck at ~half width */
.section__head{ max-width:840px; }
.band__lead{ max-width:720px; }
.phero__lead{ max-width:600px; }
.rc-cathero__lead{ max-width:700px; }
.hero__lead{ max-width:600px; }
.vp-desc__p{ max-width:82ch; }

/* ============================================================
   USP CARDS — big, immersive, C&H blue/red gradient (Apple feature-card style)
   ============================================================ */
.vp-usp__grid{ grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:1.5rem; }
.usp{ color:#fff; border:0; border-radius:22px; padding:2.1rem 1.9rem 2rem; min-height:238px;
  display:flex; flex-direction:column; box-shadow:0 20px 44px rgba(12,40,80,.16); overflow:hidden;
  transition:transform .5s var(--spring), box-shadow .5s var(--ease); }
.usp:hover{ transform:translateY(-6px); box-shadow:0 30px 60px rgba(12,40,80,.24); }
.usp__ic{ width:56px; height:56px; padding:14px; box-sizing:border-box; border-radius:16px;
  background:rgba(255,255,255,.18); color:#fff; margin:0 0 auto; }
.usp h3{ color:#fff; font-size:1.28rem; margin:1.5rem 0 .55rem; }
.usp p{ color:rgba(255,255,255,.86); font-size:.98rem; line-height:1.55; }
.usp__tag{ background:rgba(255,255,255,.24) !important; color:#fff !important; }
/* brand-rhythm palette — mostly blue shades, red accents */
.usp:nth-child(6n+1){ background:linear-gradient(158deg,#2a86cf 0%,#0c5290 100%); }
.usp:nth-child(6n+2){ background:linear-gradient(158deg,#3f7ec1 0%,#14406e 100%); }
.usp:nth-child(6n+3){ background:linear-gradient(158deg,#ef4b52 0%,#c11f28 100%); }
.usp:nth-child(6n+4){ background:linear-gradient(158deg,#1f6fb2 0%,#0a3d6e 100%); }
.usp:nth-child(6n+5){ background:linear-gradient(158deg,#5a93cc 0%,#235a92 100%); }
.usp:nth-child(6n){   background:linear-gradient(158deg,#e8484f 0%,#a81b24 100%); }

/* ============================================================
   APPLE-STYLE CAROUSEL — large product-card rows (.rc-cards with >4 items)
   ============================================================ */
.rc-carousel-wrap{ position:relative; }
.rc-cards--carousel{
  display:flex; gap:1.6rem; overflow-x:auto; scroll-snap-type:x mandatory;
  padding:.5rem 2px 1.4rem; scroll-padding-inline:2px;
  scrollbar-width:none; -webkit-overflow-scrolling:touch; grid-template-columns:none !important;
}
.rc-cards--carousel::-webkit-scrollbar{ display:none; }
.rc-cards--carousel > .rc-card{ flex:0 0 min(360px, 80vw); scroll-snap-align:start; }
.rc-car-arrow{ position:absolute; top:33%; transform:translateY(-50%); z-index:6;
  width:46px; height:46px; border-radius:50%; border:1px solid var(--line);
  background:rgba(255,255,255,.9); -webkit-backdrop-filter:blur(10px) saturate(160%); backdrop-filter:blur(10px) saturate(160%);
  color:var(--ink); font-size:1.5rem; line-height:1; cursor:pointer; display:grid; place-items:center;
  box-shadow:0 10px 26px rgba(17,24,39,.14); transition:opacity .3s var(--ease), background .3s, color .3s, transform .3s var(--spring); }
.rc-car-arrow:hover{ transform:translateY(-50%) scale(1.09); background:#fff; color:var(--brand); }
.rc-car-arrow--prev{ left:-10px; } .rc-car-arrow--next{ right:-10px; }
.rc-car-arrow[disabled]{ opacity:0; pointer-events:none; }
[data-theme="dark"] .rc-car-arrow{ background:rgba(28,32,38,.82); color:#fff; border-color:rgba(255,255,255,.12); }
.rc-car-dots{ display:flex; justify-content:center; gap:8px; margin-top:1.1rem; }
.rc-car-dots button{ width:8px; height:8px; border-radius:50%; border:0; padding:0; cursor:pointer; background:rgba(20,26,30,.24); transition:.3s var(--ease); }
.rc-car-dots button.is-active{ background:var(--brand); width:22px; border-radius:5px; }
[data-theme="dark"] .rc-car-dots button{ background:rgba(255,255,255,.26); }
@media(max-width:560px){
  .rc-cards--carousel > .rc-card{ flex-basis:78vw; }        /* narrower -> the next card clearly peeks */
  .feats.rc-cards--carousel > .feat{ flex-basis:78vw; }
  .rc-car-arrow{ display:none; }
  /* right-edge peek cue: subtle shadow signalling "more →" */
  .rc-carousel-wrap::after{ content:""; position:absolute; top:0; bottom:2.6rem; right:0; width:38px; pointer-events:none; z-index:3;
    background:linear-gradient(to right, transparent, rgba(10,20,35,.06)); }
  .rc-car-hint{ font-size:.84rem; font-weight:600; color:var(--brand); }
}

/* ============================================================
   FEATURE CARDS v2 — vibrant on-brand palette + glossy sheen
   (shared by .usp and homepage .feat; not the dark .feats--tech)
   ============================================================ */
.usp, .feats:not(.feats--tech) .feat{
  color:#fff; border:0; border-radius:22px; padding:2.1rem 1.9rem 2rem; min-height:240px;
  display:flex; flex-direction:column; position:relative; overflow:hidden; isolation:isolate;
  box-shadow:0 20px 44px rgba(12,40,80,.16); transition:transform .55s var(--spring), box-shadow .55s var(--ease);
}
.usp > *, .feats:not(.feats--tech) .feat > *{ position:relative; z-index:1; }
.usp::after, .feats:not(.feats--tech) .feat::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none; border-radius:inherit;
  background:radial-gradient(135% 95% at 14% -12%, rgba(255,255,255,.30), transparent 52%);
}
.usp:hover, .feats:not(.feats--tech) .feat:hover{ transform:translateY(-6px); box-shadow:0 30px 64px rgba(12,40,80,.28); }
.usp__ic, .feats:not(.feats--tech) .feat__ic{
  width:56px; height:56px; padding:14px; box-sizing:border-box; border-radius:16px;
  background:rgba(255,255,255,.2); color:#fff; margin:0 0 auto;
}
.usp h3, .feats:not(.feats--tech) .feat h3{ color:#fff; font-size:1.26rem; margin:1.5rem 0 .55rem; }
.usp p, .feats:not(.feats--tech) .feat p{ color:rgba(255,255,255,.88); font-size:.98rem; line-height:1.55; }
.usp__tag{ background:rgba(255,255,255,.26) !important; color:#fff !important; }
/* 6-step palette — vivid azure / indigo / coral / teal / cobalt / rose */
.usp:nth-child(6n+1), .feats:not(.feats--tech) .feat:nth-child(6n+1){ background:linear-gradient(150deg,#3a9be0,#0d5ba0); }
.usp:nth-child(6n+2), .feats:not(.feats--tech) .feat:nth-child(6n+2){ background:linear-gradient(150deg,#4f6ad6,#1e357f); }
.usp:nth-child(6n+3), .feats:not(.feats--tech) .feat:nth-child(6n+3){ background:linear-gradient(150deg,#ff5b62,#c51f2b); }
.usp:nth-child(6n+4), .feats:not(.feats--tech) .feat:nth-child(6n+4){ background:linear-gradient(150deg,#17a2c9,#0c5290); }
.usp:nth-child(6n+5), .feats:not(.feats--tech) .feat:nth-child(6n+5){ background:linear-gradient(150deg,#5a86e0,#244f9e); }
.usp:nth-child(6n),   .feats:not(.feats--tech) .feat:nth-child(6n){   background:linear-gradient(150deg,#f2506a,#a81338); }
.feats{ grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); }

/* ============================================================
   PRODUCT GALLERY — Apple-style centered carousel (peek + dimmed neighbours)
   ============================================================ */
.gcar{ position:relative; margin-top:1.5rem; }
.gcar__track{ display:flex; gap:1.2rem; overflow-x:auto; scroll-snap-type:x mandatory;
  padding:.5rem 0 1rem; padding-inline:max(0px, calc((100% - min(880px, 88vw)) / 2));
  scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.gcar__track::-webkit-scrollbar{ display:none; }
.gc-slide{ flex:0 0 min(880px, 88vw); aspect-ratio:16/9; scroll-snap-align:center;
  border:1px solid var(--line); border-radius:20px; overflow:hidden; background:#fff; cursor:zoom-in; padding:0;
  transition:opacity .45s var(--ease), transform .45s var(--ease); box-shadow:0 16px 40px rgba(17,24,39,.10); }
.gc-slide img{ width:100%; height:100%; object-fit:contain; padding:1.4rem; box-sizing:border-box; display:block; transition:transform .6s var(--ease); }
.gc-slide:hover img{ transform:scale(1.03); }
.gc-slide:not(.is-center){ opacity:.45; }
.gc-arrow{ position:absolute; top:50%; transform:translateY(-50%); z-index:5; width:48px; height:48px; border-radius:50%;
  border:1px solid var(--line); background:rgba(255,255,255,.92); -webkit-backdrop-filter:blur(10px) saturate(160%); backdrop-filter:blur(10px) saturate(160%);
  color:var(--ink); font-size:1.5rem; cursor:pointer; display:grid; place-items:center; box-shadow:0 10px 26px rgba(17,24,39,.14);
  transition:opacity .3s, background .3s, color .3s, transform .3s var(--spring); }
.gc-arrow:hover{ transform:translateY(-50%) scale(1.09); background:#fff; color:var(--brand); }
.gc-arrow--prev{ left:14px; } .gc-arrow--next{ right:14px; }
.gc-arrow[disabled]{ opacity:0; pointer-events:none; }
[data-theme="dark"] .gc-arrow{ background:rgba(28,32,38,.84); color:#fff; border-color:rgba(255,255,255,.12); }
.gc-dots{ display:flex; justify-content:center; gap:8px; margin-top:.5rem; }
.gc-dots button{ width:8px; height:8px; border-radius:50%; border:0; padding:0; cursor:pointer; background:rgba(20,26,30,.24); transition:.3s var(--ease); }
.gc-dots button.is-active{ background:var(--brand); width:22px; border-radius:5px; }
[data-theme="dark"] .gc-dots button{ background:rgba(255,255,255,.26); }
@media(max-width:560px){ .gc-arrow{ display:none; } }

/* Unify feature/USP card heights — all rows equal, so cards never look mismatched */
.feats, .vp-usp__grid{ grid-auto-rows:1fr; align-items:stretch; }
.feats{ grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); }
.usp, .feats:not(.feats--tech) .feat{ height:100%; }

/* ============================================================
   SITE SEARCH — Apple-style drop-down frosted panel
   ============================================================ */
.searchBtn{ background:none; border:1.5px solid rgba(255,255,255,.4); color:#fff; border-radius:999px;
  width:38px; height:34px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; padding:0; transition:all .3s; }
.searchBtn svg{ width:17px; height:17px; }
.searchBtn:hover{ border-color:#fff; }
.nav--solid .searchBtn{ border-color:rgba(22,26,30,.22); color:var(--ink); }

.search-ov{ position:fixed; inset:0; z-index:60; opacity:0; visibility:hidden; transition:opacity .4s var(--ease), visibility .4s; }
.search-ov.is-open{ opacity:1; visibility:visible; }
.search-ov__backdrop{ position:absolute; inset:0; background:rgba(8,10,14,.42); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.search-panel{ position:relative; max-width:760px; margin:74px auto 0;
  background:rgba(255,255,255,.9); -webkit-backdrop-filter:blur(28px) saturate(185%); backdrop-filter:blur(28px) saturate(185%);
  border:1px solid rgba(255,255,255,.6); border-radius:26px; box-shadow:0 44px 100px rgba(0,0,0,.34);
  padding:1.1rem 1.4rem 1.5rem; transform:translateY(-20px) scale(.985); transition:transform .5s var(--spring); }
.search-ov.is-open .search-panel{ transform:none; }
[data-theme="dark"] .search-panel{ background:rgba(22,25,30,.93); border-color:rgba(255,255,255,.1); }
.search-field{ display:flex; align-items:center; gap:.8rem; padding:.5rem .2rem 1rem; border-bottom:1px solid var(--line); }
.search-field > svg{ width:24px; height:24px; color:var(--muted); flex:none; }
.search-input{ flex:1; border:0; background:none; outline:none; font-family:inherit; font-size:1.45rem; font-weight:400; color:var(--ink); min-width:0; }
.search-input::placeholder{ color:var(--muted); }
.search-close{ border:1px solid var(--line); background:var(--paper); color:var(--muted); border-radius:8px; padding:.3rem .55rem; font-size:.74rem; font-weight:600; cursor:pointer; flex:none; }
.search-hd{ font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:1.1rem .3rem .3rem; font-weight:700; }
.search-res{ max-height:min(58vh,470px); overflow-y:auto; margin-top:.2rem; }
.search-item{ display:flex; align-items:center; gap:.8rem; padding:.72rem .6rem; border-radius:13px; color:var(--ink); transition:background .18s; }
.search-item:hover, .search-item.is-cur{ background:rgba(16,104,176,.10); }
.search-item__t{ font-weight:500; }
.search-item__cat{ font-size:.66rem; color:var(--brand); font-weight:700; margin-left:auto; text-transform:uppercase; letter-spacing:.07em; }
.search-empty{ color:var(--muted); padding:1.1rem .6rem; }
@media(max-width:640px){ .search-panel{ margin:66px 12px 0; } .search-input{ font-size:1.2rem; } }

/* Homepage lineup strip — lean series cards */
.lineup-card .rc-card__body{ min-height:0; }
.lineup-card .rc-card__tag{ min-height:2.4em; }

/* ============================================================
   LEGAL PAGES (terms / privacy) + footer legal links
   ============================================================ */
.legal{ padding-block:clamp(2.5rem,5vw,4rem); }
.legal__wrap{ max-width:820px; margin:0 auto; padding:0 var(--pad); }
.legal__upd{ color:var(--muted); font-size:.9rem; margin-bottom:2rem; }
.legal__block{ margin-bottom:1.8rem; }
.legal__block h2{ font-size:1.25rem; margin-bottom:.5rem; letter-spacing:-.01em; text-wrap:balance; }
.legal__block p{ color:var(--muted); line-height:1.75; }
.legal__note{ margin-top:2rem; padding-top:1.4rem; border-top:1px solid var(--line); color:var(--muted); }
.legal__note a, .legal__block a{ color:var(--brand); }
.footer__legal-links{ display:inline-flex; gap:1.3rem; flex-wrap:wrap; }
.footer__legal-links a{ color:rgba(255,255,255,.6); transition:color .3s var(--ease); }
.footer__legal-links a:hover{ color:#fff; }

/* ============================================================
   ABOUT CTA band ("Да започнем заедно") — polished gradient
   ============================================================ */
.cta{ max-width:var(--maxw); margin:clamp(2rem,5vw,4.5rem) auto; padding-inline:var(--pad); }
.cta__inner{ position:relative; overflow:hidden; isolation:isolate; text-align:center;
  background:linear-gradient(135deg,#1a7bc4 0%,#0c5290 58%,#0a3f72 100%); color:#fff;
  border-radius:28px; padding:clamp(2.6rem,6vw,4.6rem) clamp(1.5rem,5vw,3.5rem);
  box-shadow:0 34px 80px rgba(12,40,80,.30); }
.cta__inner::after{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(62% 90% at 86% 8%, rgba(232,48,56,.42), transparent 55%); }
.cta__inner h2{ color:#fff; font-size:clamp(1.9rem,4vw,2.9rem); margin-bottom:.7rem; text-wrap:balance; }
.cta__inner p{ color:rgba(255,255,255,.88); font-size:1.12rem; max-width:560px; margin:0 auto 1.9rem; }

/* ============================================================
   .phero HEROES — animated aurora + staggered entrance (about/dealers/contact)
   ============================================================ */
.phero{ background:radial-gradient(120% 120% at 78% 12%, #313640 0%, #23262c 46%, #14161a 100%); }
.phero__inner{ z-index:2; }
.phero__kv{ opacity:.08; z-index:1; }
.phero::before{ content:""; position:absolute; z-index:0; pointer-events:none; width:560px; height:560px; border-radius:50%;
  top:-170px; left:-130px; background:radial-gradient(circle, rgba(16,104,176,.55), transparent 62%); filter:blur(26px); animation:pheroA 17s ease-in-out infinite; }
.phero::after{ content:""; position:absolute; z-index:0; pointer-events:none; width:520px; height:520px; border-radius:50%;
  bottom:-210px; right:6%; background:radial-gradient(circle, rgba(232,48,56,.36), transparent 62%); filter:blur(28px); animation:pheroB 22s ease-in-out infinite; }
@keyframes pheroA{ 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(70px,44px) scale(1.08); } }
@keyframes pheroB{ 0%,100%{ transform:translate(0,0) scale(1); } 50%{ transform:translate(-56px,-34px) scale(1.06); } }
.phero .crumb, .phero__eyebrow, .phero h1, .phero__lead, .phero .badges, .phero__cta, .phero__media{ animation:chHeroRise .8s var(--ease) both; }
.phero .crumb{ animation-delay:.04s; } .phero__eyebrow{ animation-delay:.12s; }
.phero h1{ animation-delay:.2s; } .phero__lead{ animation-delay:.3s; }
.phero .badges, .phero__cta{ animation-delay:.4s; }
.phero__media{ animation:chHeroArt 1s var(--ease) both .16s; }
@media (prefers-reduced-motion: reduce){ .phero::before,.phero::after,.phero .crumb,.phero__eyebrow,.phero h1,.phero__lead,.phero .badges,.phero__cta,.phero__media{ animation:none; } }

/* ---------- A2W category page ---------- */
.a2w-series{ padding:clamp(3.2rem,7vw,5.6rem) clamp(1.2rem,6vw,4rem); }
.a2w-series__head{ display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(2rem,5vw,4rem); align-items:center; max-width:1180px; margin:0 auto clamp(1.6rem,3vw,2.4rem); }
.a2w-series__head--flip .a2w-series__media{ order:2; }
.a2w-series__media{ background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:clamp(1.4rem,3vw,2.4rem); display:flex; align-items:center; justify-content:center; min-height:300px; }
.a2w-series__media img{ max-width:100%; max-height:380px; object-fit:contain; transition:transform .6s var(--ease); }
.a2w-series__media:hover img{ transform:scale(1.04); }
[data-theme="dark"] .a2w-series__media{ background:#fff; border-color:rgba(255,255,255,.14); }
.a2w-series__txt .section__title{ margin:.4rem 0 .8rem; text-align:left; }
.a2w-series__lead{ color:var(--muted); font-size:.98rem; line-height:1.65; margin:0 0 1.4rem; max-width:56ch; }
.a2w-series .rc-tablewrap{ max-width:1180px; margin:0 auto; }
.a2w-vat{ max-width:1180px; margin:.8rem auto 0; font-size:.78rem; color:var(--muted); }
.a2w-picks .cards{ max-width:1180px; margin:0 auto; }
.a2w-pick{ text-decoration:none; }
.a2w-pick .card__body{ padding:1.6rem; }
.a2w-pick__ic{ width:30px; height:30px; color:var(--brand); margin-bottom:.9rem; stroke-width:1.6; }
.a2w-pick h3{ margin:.2rem 0 .3rem; font-size:1.15rem; color:var(--ink); }
.a2w-pick__kw{ font-size:.8rem; font-weight:600; color:var(--brand); margin:0 0 .55rem; font-variant-numeric:tabular-nums; }
.a2w-pick p:last-child{ font-size:.88rem; color:var(--muted); line-height:1.55; margin:0; }
@media(max-width:860px){ .a2w-series__head{ grid-template-columns:1fr; } .a2w-series__head--flip .a2w-series__media{ order:0; } .a2w-series__media{ min-height:0; } .a2w-series__media img{ max-height:280px; } }
/* A2W price tables: sticky Model column (same trick as .rc-vtable) */
.a2w-series .rc-table{ overflow:visible; border-collapse:separate; border-spacing:0; }
.a2w-series .rc-table thead th:first-child{ position:sticky; left:0; z-index:5; background:var(--graphite);
  box-shadow:8px 0 12px -8px rgba(0,0,0,.28), inset -1px 0 0 rgba(255,255,255,.12); }
.a2w-series .rc-table td.rc-t__model{ position:sticky; left:0; z-index:2; background:#fff;
  box-shadow:8px 0 12px -8px rgba(0,0,0,.14); }
.a2w-series .rc-table tbody tr:hover td.rc-t__model{ background:var(--craft); }
[data-theme="dark"] .a2w-series .rc-table td.rc-t__model{ background:var(--paper); }
[data-theme="dark"] .a2w-series .rc-table tbody tr:hover td.rc-t__model{ background:var(--blue); }

/* ============================================================
   MEDIA PASS (mp-*) — appended block, used by dealers.html and
   contact.html only. All selectors are prefixed with .mp- to
   avoid collisions with the rules above. Do not merge upward.
   ============================================================ */

/* ---------- World-stage sponsorship band (dealers.html) ---------- */
.mp-reels{ display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; }
.mp-reel{ margin:0; }
.mp-reel__media{ position:relative; border-radius:var(--r); overflow:hidden; background:#0d0f12;
  box-shadow:0 26px 60px rgba(11,11,13,.22); }
.mp-reel__media::after{ content:""; position:absolute; inset:0; border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.09); pointer-events:none; }
.mp-reel__media video{ display:block; width:100%; aspect-ratio:16/9; object-fit:cover; }
.mp-reel__cap{ display:flex; align-items:center; gap:.7rem; margin-top:1rem; }
.mp-reel__tag{ flex:none; font-size:.66rem; font-weight:700; letter-spacing:.16em;
  padding:.3rem .65rem; border-radius:999px; color:#fff; }
.mp-reel__tag--red{ background:var(--accent); }
.mp-reel__tag--blue{ background:var(--brand); }
.mp-reel__txt{ font-size:.9rem; color:var(--muted); letter-spacing:.01em; }
.mp-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem;
  margin-top:3.4rem; padding-top:2.6rem; border-top:1px solid var(--line); }
.mp-stat b{ display:block; font-size:clamp(2rem,3.6vw,2.9rem); font-weight:300;
  letter-spacing:-.02em; color:var(--ink); }
.mp-stat span{ font-size:.85rem; color:var(--muted); letter-spacing:.04em; }
@media (max-width:860px){
  .mp-reels{ grid-template-columns:1fr; }
  .mp-stats{ grid-template-columns:1fr 1fr; gap:1.2rem 1rem; }
}

/* ---------- Full-bleed lifestyle film band (contact.html) ---------- */
.mp-calm{ position:relative; overflow:hidden; min-height:clamp(430px,62vh,650px);
  display:flex; align-items:flex-end; background:#0d0f12; }
.mp-calm__video{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.mp-calm__shade{ position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to top, rgba(10,16,24,.78) 0%, rgba(10,16,24,.30) 46%, rgba(10,16,24,.04) 100%); }
.mp-calm__inner{ position:relative; z-index:1; width:100%; max-width:var(--maxw);
  margin:0 auto; padding:clamp(2.6rem,6vw,4.6rem) var(--pad); color:#fff; }
.mp-calm__eyebrow{ font-size:.8rem; letter-spacing:.24em; text-transform:uppercase;
  font-weight:600; color:rgba(255,255,255,.85); margin-bottom:1rem; }
.mp-calm__title{ font-weight:300; letter-spacing:-.02em; font-size:clamp(1.9rem,4vw,3rem);
  line-height:1.08; margin:0 0 .8rem; max-width:20ch; text-shadow:0 2px 26px rgba(0,0,0,.4); }
.mp-calm__lead{ font-weight:300; font-size:1.05rem; color:rgba(255,255,255,.86);
  max-width:54ch; margin:0 0 1.7rem; text-shadow:0 1px 14px rgba(0,0,0,.3); }
.mp-calm__chips{ display:flex; flex-wrap:wrap; gap:.8rem; }
.mp-chip{ display:inline-flex; align-items:center; gap:.55rem; padding:.72rem 1.3rem;
  border-radius:999px; font-size:.92rem; font-weight:600; color:#fff;
  background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.30);
  backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  transition:all .35s var(--ease); }
.mp-chip:hover{ background:rgba(255,255,255,.24); transform:translateY(-2px); }
.mp-chip svg{ width:16px; height:16px; flex:none; fill:none; stroke:currentColor;
  stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.mp-chip--solid{ background:var(--accent); border-color:var(--accent); }
.mp-chip--solid:hover{ background:var(--accent-deep); border-color:var(--accent-deep); }
@media (max-width:560px){
  .mp-calm__chips{ flex-direction:column; align-items:flex-start; }
}

/* dark theme: video cards already dark; keep stat numbers readable */
[data-theme="dark"] .mp-reel__media{ box-shadow:0 26px 60px rgba(0,0,0,.5); }

/* ---------- Mobile nav drawer + accordion mega (≤980px) ---------- */
@media (max-width:980px){
  .nav--open .nav__links{ display:flex; flex-direction:column; align-items:stretch; position:absolute; top:100%; left:0; right:0;
    background:#14161a; -webkit-backdrop-filter:blur(16px) saturate(140%); backdrop-filter:blur(16px) saturate(140%);
    padding:.4rem var(--pad) 1.4rem; gap:0; border-bottom:1px solid rgba(255,255,255,.1);
    max-height:calc(100dvh - 70px); overflow-y:auto; }
  .nav--open .nav__links > a,
  .nav--open .nav__links .nav__item--mega > a{
    display:block; color:#fff; padding:.95rem 0; font-size:1.02rem; border-bottom:1px solid rgba(255,255,255,.08); }
  .nav--open .nav__links .nav__item--mega > a{ position:relative; padding-right:1.8rem; }
  .nav--open .nav__item--mega > a::after{ content:"›"; position:absolute; right:.2rem; top:50%;
    color:rgba(255,255,255,.5); font-size:1.35rem; line-height:1; transform:translateY(-50%) rotate(90deg);
    transition:transform .3s var(--ease); }
  .nav--open .nav__item--mega.is-open > a::after{ transform:translateY(-50%) rotate(-90deg); }
  .nav--open .nav__item--mega.is-open .mega{ display:block !important; position:static; opacity:1; visibility:visible; transform:none;
    background:transparent; border:0; box-shadow:none; -webkit-backdrop-filter:none; backdrop-filter:none; }
  .nav--open .mega::before{ display:none; }
  .nav--open .mega__inner{ display:grid; grid-template-columns:1fr 1fr; padding:1rem 0 1.2rem .2rem; gap:1.2rem 1.4rem; max-width:none; }
  .nav--open .mega__col h4{ margin-bottom:.5rem; }
  .nav--open .mega__col a{ padding:.42rem 0; font-size:.92rem; }
  .nav--open .mega__promo{ display:none; }
  @media (max-width:460px){ .nav--open .mega__inner{ grid-template-columns:1fr; gap:1rem; } }
}

/* ============================================================
   RAC WIZARD — "Кой климатик е за вас?"
   ============================================================ */
.wiz{ padding:clamp(2.5rem,6vw,4.5rem) var(--pad) clamp(1rem,3vw,2rem); }
.wiz__in{ max-width:960px; margin:0 auto; }
.wiz__head{ text-align:center; margin-bottom:2rem; }
.wiz__title{ font-size:clamp(1.7rem,4vw,2.5rem); font-weight:300; letter-spacing:-.02em; margin:.4rem 0 .6rem; color:var(--ink); }
.wiz__lead{ color:var(--muted); font-size:1rem; max-width:52ch; margin:0 auto; }
.wiz__stage{ position:relative; background:var(--craft); border:1px solid var(--line); border-radius:22px;
  padding:clamp(1.6rem,4vw,2.8rem); overflow:hidden; }
.wiz__progress{ height:4px; border-radius:4px; background:rgba(16,104,176,.14); overflow:hidden; margin-bottom:1.8rem; }
.wiz__bar{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--brand),#3f9ae0);
  border-radius:4px; transition:width .5s var(--spring); }
.wiz__step{ display:none; animation:wizIn .5s var(--ease); }
.wiz__step.is-active{ display:block; }
@keyframes wizIn{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
.wiz__q{ font-size:clamp(1.15rem,2.4vw,1.5rem); font-weight:500; color:var(--ink); margin:0 0 1.4rem; display:flex; align-items:center; gap:.7rem; }
.wiz__qn{ display:inline-grid; place-items:center; width:1.9rem; height:1.9rem; border-radius:50%; background:var(--brand); color:#fff;
  font-size:.9rem; font-weight:700; flex:none; }
.wiz__opts{ display:grid; gap:.9rem; }
.wiz__opts--4{ grid-template-columns:repeat(4,1fr); }
.wiz__opts--3{ grid-template-columns:repeat(3,1fr); }
.wiz__opt{ text-align:left; background:var(--white); border:1.5px solid var(--line); border-radius:14px; padding:1.1rem 1.15rem;
  cursor:pointer; transition:border-color .25s var(--ease), transform .25s var(--spring), box-shadow .25s var(--ease); display:flex; flex-direction:column; gap:.25rem; }
.wiz__opt b{ font-size:1.02rem; font-weight:600; color:var(--ink); }
.wiz__opt span{ font-size:.82rem; color:var(--muted); line-height:1.35; }
.wiz__opt:hover{ border-color:var(--brand); transform:translateY(-3px); box-shadow:0 16px 34px rgba(16,104,176,.13); }
.wiz__opt.is-sel{ border-color:var(--brand); background:rgba(16,104,176,.06); }
.wiz__back{ background:none; border:0; color:var(--muted); font-size:.9rem; cursor:pointer; margin-top:1.6rem; padding:.3rem 0; transition:color .2s; }
.wiz__back:hover{ color:var(--brand); }
/* result */
.wiz__result .wiz__q{ justify-content:center; }
.wiz__cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; margin-bottom:1.8rem; }
.wiz-card{ display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line); border-radius:16px; overflow:hidden;
  text-decoration:none; transition:transform .35s var(--spring), box-shadow .35s var(--ease), border-color .35s var(--ease); }
.wiz-card:hover{ transform:translateY(-6px); box-shadow:0 26px 52px rgba(51,51,51,.14); }
.wiz-card--top{ border-color:var(--brand); box-shadow:0 0 0 1px var(--brand); }
.wiz-card__media{ aspect-ratio:4/3; background:#fff; display:flex; align-items:center; justify-content:center; padding:1rem; }
.wiz-card__media img{ max-width:100%; max-height:100%; object-fit:contain; }
.wiz-card__body{ padding:1.1rem 1.2rem 1.3rem; display:flex; flex-direction:column; flex:1; }
.wiz-card__rank{ font-size:.66rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--brand); margin-bottom:.4rem; }
.wiz-card--top .wiz-card__rank{ color:var(--accent); }
.wiz-card__body h3{ font-size:1.2rem; font-weight:600; color:var(--ink); margin:0 0 .4rem; }
.wiz-card__why{ font-size:.9rem; font-weight:600; color:var(--ink); margin:0 0 .35rem; line-height:1.4; }
.wiz-card__sig{ font-size:.84rem; color:var(--muted); line-height:1.5; margin:0 0 1rem; flex:1; }
.wiz-card__foot{ display:flex; align-items:baseline; justify-content:space-between; gap:.6rem; margin-bottom:.7rem; flex-wrap:wrap; }
.wiz-card__cap{ font-size:.74rem; color:var(--muted); font-variant-numeric:tabular-nums; }
.wiz-card__price{ font-size:1.02rem; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.wiz-card__from{ font-size:.72rem; font-weight:400; color:var(--muted); }
.wiz-card__link{ font-size:.86rem; font-weight:600; color:var(--brand); }
.wiz__actions{ display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap; }
[data-theme="dark"] .wiz__opt,
[data-theme="dark"] .wiz-card{ background:var(--paper); }
[data-theme="dark"] .wiz-card__media{ background:#fff; }
@media(max-width:820px){
  .wiz__opts--4{ grid-template-columns:1fr 1fr; }
  .wiz__cards{ grid-template-columns:1fr; max-width:420px; margin-inline:auto; }
}
@media(max-width:520px){
  .wiz__opts--4, .wiz__opts--3{ grid-template-columns:1fr; }
}

/* ---------- RAC finder card (opens wizard modal) ---------- */
.rc-card--finder{ position:relative; overflow:hidden; cursor:pointer; border:0; color:#fff;
  background:linear-gradient(150deg,#1068B0 0%,#0c5288 55%,#0a4676 100%); display:flex; align-items:center;
  transition:transform .5s var(--spring), box-shadow .5s var(--ease); }
.rc-card--finder:hover{ transform:translateY(-7px); box-shadow:0 30px 60px rgba(16,104,176,.32); }
.rc-finder__glow{ position:absolute; inset:0; background:radial-gradient(120% 90% at 100% 0%, rgba(232,48,56,.42), transparent 60%); opacity:.9; }
.rc-finder__in{ position:relative; padding:1.9rem 1.7rem; }
.rc-finder__ic{ width:36px; height:36px; margin-bottom:1rem; color:#fff; opacity:.95; }
.rc-finder__kicker{ font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.75); margin-bottom:.5rem; }
.rc-card--finder h3{ font-size:1.4rem; font-weight:600; line-height:1.15; margin-bottom:.6rem; color:#fff; }
.rc-finder__lead{ font-size:.92rem; line-height:1.5; color:rgba(255,255,255,.85); margin-bottom:1.3rem; }
.rc-finder__cta{ display:inline-flex; font-size:.95rem; font-weight:600; color:#fff;
  border-bottom:2px solid rgba(255,255,255,.55); padding-bottom:2px; transition:border-color .3s var(--ease); }
.rc-card--finder:hover .rc-finder__cta{ border-color:#fff; }

/* ---------- Wizard modal ---------- */
.wizmodal{ position:fixed; inset:0; z-index:120; display:none; align-items:flex-start; justify-content:center;
  padding:clamp(1rem,5vh,4rem) 1rem; background:rgba(10,14,20,.55); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  overflow-y:auto; opacity:0; transition:opacity .3s var(--ease); }
.wizmodal.is-open{ display:flex; opacity:1; }
.wizmodal__box{ position:relative; width:min(960px,100%); background:var(--white); border-radius:24px;
  box-shadow:0 40px 100px rgba(0,0,0,.4); padding:clamp(1.5rem,4vw,3rem); animation:wizPop .4s var(--spring); }
@keyframes wizPop{ from{ opacity:0; transform:translateY(24px) scale(.98); } to{ opacity:1; transform:none; } }
.wizmodal__close{ position:absolute; top:1rem; right:1rem; width:38px; height:38px; border-radius:50%; border:1px solid var(--line);
  background:var(--white); color:var(--ink); font-size:1rem; cursor:pointer; z-index:2; transition:background .2s, transform .2s; }
.wizmodal__close:hover{ background:var(--craft); transform:rotate(90deg); }
.wizmodal .wiz__head{ margin-bottom:1.6rem; }
.wizmodal .wiz__title{ font-size:clamp(1.5rem,3.6vw,2.2rem); }
[data-theme="dark"] .wizmodal__box{ background:var(--white); }
[data-theme="dark"] .wizmodal__close{ background:var(--paper); }

/* ---------- Product-page sticky buy-bar ---------- */
/* floating glass island — mirrors the .nav__inner pill, docked to the bottom */
.buybar{ position:fixed; left:0; right:0; bottom:0; z-index:90; padding:0 .9rem .8rem;
  transform:translateY(160%); transition:transform .5s var(--spring); pointer-events:none; }
.buybar.is-shown{ transform:none; }
.buybar__in{ max-width:min(1180px, calc(100% - 1.8rem)); margin:0 auto; pointer-events:auto;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.6rem .7rem .6rem 1.3rem; border-radius:22px; border:1px solid rgba(255,255,255,.6);
  background:rgba(255,255,255,.66); -webkit-backdrop-filter:blur(22px) saturate(190%); backdrop-filter:blur(22px) saturate(190%);
  box-shadow:0 16px 46px rgba(17,24,39,.14), inset 0 1px 0 rgba(255,255,255,.72); }
.buybar__info{ display:flex; flex-direction:column; line-height:1.15; min-width:0; }
.buybar__name{ font-weight:600; color:var(--ink); font-size:1rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.buybar__price{ font-size:.86rem; color:var(--muted); font-variant-numeric:tabular-nums; }
.buybar__from{ font-size:.76rem; }
.buybar__act{ display:flex; gap:.6rem; flex:none; }
.buybar__act .btn{ padding:.6rem 1.15rem; font-size:.88rem; }
[data-theme="dark"] .buybar__in{ background:rgba(20,23,28,.62); border-color:rgba(255,255,255,.08);
  box-shadow:0 16px 46px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.08); }
@media(max-width:600px){
  .buybar{ padding:0 .6rem .6rem; }
  .buybar__in{ padding:.55rem .6rem .55rem 1.1rem; gap:.6rem; border-radius:18px; }
  .buybar__info{ flex:1; }
  .buybar__name{ font-size:.9rem; }
  .buybar__act{ flex:none; }
  .buybar__act .btn--line{ display:none; }               /* keep one strong CTA on small screens */
  .buybar__act .btn{ padding:.65rem 1rem; font-size:.85rem; }
}

/* ---------- "Как да купите" 3-step strip ---------- */
.howbuy{ padding:clamp(3rem,6vw,5rem) var(--pad); background:var(--craft); }
.howbuy__in{ max-width:var(--maxw); margin:0 auto; }
.howbuy__steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; margin-top:2rem; }
.howbuy__step{ position:relative; background:var(--white); border:1px solid var(--line); border-radius:16px; padding:1.7rem 1.5rem; }
.howbuy__n{ position:absolute; top:1.3rem; right:1.4rem; font-size:2.2rem; font-weight:800; color:rgba(16,104,176,.12); line-height:1; }
.howbuy__ic{ width:30px; height:30px; color:var(--brand); margin-bottom:1rem; }
.howbuy__step h3{ font-size:1.12rem; font-weight:600; color:var(--ink); margin-bottom:.5rem; }
.howbuy__step p{ font-size:.9rem; color:var(--muted); line-height:1.55; }
[data-theme="dark"] .howbuy__step{ background:var(--paper); }
@media(max-width:760px){ .howbuy__steps{ grid-template-columns:1fr; max-width:460px; margin-inline:auto; } }

/* ---------- Shiny blue enquiry button ---------- */
.btn--enquiry{ position:relative; overflow:hidden; color:#fff; border:0;
  background:linear-gradient(135deg,#2b8fd4 0%,#1068B0 48%,#0b4f86 100%);
  box-shadow:0 6px 18px rgba(16,104,176,.38), inset 0 1px 0 rgba(255,255,255,.35); }
.btn--enquiry::after{ content:""; position:absolute; top:-30%; left:-70%; width:45%; height:170%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.65), transparent);
  transform:skewX(-18deg); pointer-events:none;
  animation:btnShine 5s ease-in-out 1.4s infinite; }
.btn--enquiry:hover{ transform:translateY(-2px);
  background:linear-gradient(135deg,#3197da 0%,#1470bd 48%,#0d5893 100%);
  box-shadow:0 16px 40px rgba(16,104,176,.5), inset 0 1px 0 rgba(255,255,255,.45); }
.btn--enquiry:hover::after{ animation:btnShine .85s ease; }
@keyframes btnShine{ 0%{ left:-70%; } 18%,100%{ left:130%; } }
@media (prefers-reduced-motion:reduce){ .btn--enquiry::after{ animation:none; } }

/* ---------- Enquiry modal ---------- */
.enqmodal{ position:fixed; inset:0; z-index:130; display:none; align-items:flex-start; justify-content:center;
  padding:clamp(1rem,5vh,4rem) 1rem; background:rgba(10,14,20,.55); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  overflow-y:auto; opacity:0; transition:opacity .3s var(--ease); }
.enqmodal.is-open{ display:flex; opacity:1; }
.enqmodal__box{ position:relative; width:min(520px,100%); background:var(--white); border-radius:22px;
  box-shadow:0 40px 100px rgba(0,0,0,.4); padding:clamp(1.6rem,4vw,2.6rem); animation:wizPop .4s var(--spring); }
.enqmodal__close{ position:absolute; top:1rem; right:1rem; width:36px; height:36px; border-radius:50%; border:1px solid var(--line);
  background:var(--white); color:var(--ink); font-size:1rem; cursor:pointer; z-index:2; transition:background .2s, transform .2s; }
.enqmodal__close:hover{ background:var(--craft); transform:rotate(90deg); }
.enqmodal__title{ font-size:clamp(1.35rem,3vw,1.7rem); font-weight:300; letter-spacing:-.01em; color:var(--ink); margin:.4rem 0 .5rem; }
.enqmodal__model{ font-weight:700; color:var(--brand); }
.enqmodal__hint{ font-size:.9rem; color:var(--muted); line-height:1.55; margin:0 0 1.3rem; }
.enqmodal__form{ display:flex; flex-direction:column; gap:.7rem; }
.enq-row{ display:grid; grid-template-columns:1fr 1fr; gap:.7rem; }
.enq-in{ width:100%; font:inherit; font-size:.95rem; color:var(--ink); background:var(--white);
  border:1.5px solid var(--line); border-radius:12px; padding:.8rem .9rem; transition:border-color .2s var(--ease), box-shadow .2s var(--ease); }
.enq-in::placeholder{ color:var(--muted); }
.enq-in:focus{ outline:none; border-color:var(--brand); box-shadow:0 0 0 3px rgba(16,104,176,.14); }
.enq-msg{ resize:vertical; min-height:96px; line-height:1.5; }
.enq-hp{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.enq-submit{ margin-top:.4rem; }
.enq-note{ font-size:.85rem; margin:.2rem 0 0; min-height:1.1em; color:var(--muted); }
.enq-note.is-err{ color:var(--accent); }
[data-theme="dark"] .enqmodal__box{ background:var(--white); }
[data-theme="dark"] .enqmodal__close{ background:var(--paper); }
[data-theme="dark"] .enq-in{ background:var(--paper); }
@media(max-width:460px){ .enq-row{ grid-template-columns:1fr; } }

/* ---------- Success toast ---------- */
.enq-toast{ position:fixed; left:50%; bottom:1.6rem; transform:translate(-50%, 200%); z-index:140;
  display:flex; align-items:center; gap:.6rem; padding:.85rem 1.4rem; border-radius:999px;
  background:linear-gradient(135deg,#149a5a,#0e7f49); color:#fff; font-weight:600; font-size:.95rem;
  box-shadow:0 18px 44px rgba(14,127,73,.42), inset 0 1px 0 rgba(255,255,255,.3);
  transition:transform .55s var(--spring); max-width:calc(100% - 2rem); }
.enq-toast.is-show{ transform:translate(-50%, 0); }
.enq-toast svg{ width:20px; height:20px; flex:none; }

/* ---------- Dealer call / email / web action buttons (map popup + list) ---------- */
.dacts{ display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.6rem; }
.dact{ display:inline-flex; align-items:center; gap:.4rem; max-width:100%;
  font-size:.82rem; font-weight:600; line-height:1; text-decoration:none;
  padding:.55rem .8rem; min-height:38px; border-radius:999px; border:1px solid var(--line); color:var(--brand);
  transition:background .2s var(--ease), border-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease); }
.dact svg{ width:15px; height:15px; flex:none; }
.dact span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dact--call{ background:var(--brand); border-color:var(--brand); color:#fff; }
.dact--call:hover{ background:var(--brand-deep); border-color:var(--brand-deep); transform:translateY(-1px); }
.dact--mail:hover{ background:rgba(16,104,176,.08); border-color:var(--brand); transform:translateY(-1px); }
.dact--web{ color:var(--muted); }
.dact--web:hover{ color:var(--brand); border-color:var(--brand); transform:translateY(-1px); }
[data-theme="dark"] .dact{ border-color:rgba(255,255,255,.16); }
[data-theme="dark"] .dact--mail{ color:#5cb0ea; }
/* give email/web chips a sensible cap so long addresses don't blow out the popup */
.dact--mail span, .dact--web span{ max-width:200px; }
/* Leaflet popup: room for the action buttons */
.leaflet-popup-content{ margin:.9rem 1rem; font-family:var(--font); font-size:.9rem; line-height:1.5; min-width:190px; }
.leaflet-popup-content strong{ color:var(--ink); font-size:.98rem; }

/* ---------- Homepage wizard section (gradient + 3D spin) ---------- */
.homewiz{ position:relative; overflow:hidden; color:#fff;
  background:var(--grad-blue);
  padding:clamp(3rem,7vw,5.5rem) var(--pad); }
.homewiz__glow{ position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(70% 90% at 0% 100%, rgba(255,255,255,.10), transparent 60%); }
.homewiz__in{ position:relative; max-width:var(--maxw); margin:0 auto;
  display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(1.5rem,4vw,3.5rem); align-items:center; }
.homewiz__eyebrow{ color:#fff; }
.homewiz__eyebrow::before{ background:#fff !important; }
.homewiz__title{ font-size:clamp(2rem,4.6vw,3.1rem); font-weight:300; letter-spacing:-.02em; line-height:1.08; margin:.5rem 0 .9rem; color:#fff; }
.homewiz__lead{ font-size:clamp(1rem,1.4vw,1.12rem); line-height:1.6; color:rgba(255,255,255,.86); max-width:46ch; margin:0 0 1.6rem; }
.homewiz__cta{ box-shadow:0 12px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.4); }
.homewiz__hint{ margin-top:.9rem; font-size:.85rem; color:rgba(255,255,255,.7); font-variant-numeric:tabular-nums; }
.homewiz__art{ position:relative; min-height:340px; display:flex; align-items:center; justify-content:center; }
.homewiz__3d{ width:100%; height:min(46vh,420px); background:transparent; --poster-color:transparent;
  filter:drop-shadow(0 30px 50px rgba(0,0,0,.35)); }
@media(max-width:820px){
  .homewiz__in{ grid-template-columns:1fr; text-align:center; }
  .homewiz__art{ order:-1; min-height:260px; }
  .homewiz__3d{ height:min(38vh,320px); }
  .homewiz__lead{ margin-inline:auto; }
  .homewiz__eyebrow{ justify-content:center; display:flex; }
}

/* band eyebrow centers (band is centered statement) */
.band .eyebrow{ justify-content:center; }

/* ---------- Per-product trust strip ---------- */
.trustbar{ background:#fff; border-block:1px solid var(--line); padding:1.3rem var(--pad); }
.trustbar__in{ max-width:var(--maxw); margin:0 auto; display:flex; justify-content:center; align-items:center;
  gap:clamp(1.4rem,5vw,4.5rem); flex-wrap:wrap; }
.trustbar__item{ text-align:center; }
.trustbar__item b{ display:block; font-size:clamp(1.3rem,2.4vw,1.9rem); font-weight:300; color:var(--brand); letter-spacing:-.01em; line-height:1; font-variant-numeric:tabular-nums; }
.trustbar__item span{ font-size:.76rem; color:var(--muted); }
[data-theme="dark"] .trustbar{ background:var(--paper); border-color:rgba(255,255,255,.1); }

/* ---------- Dark-mode text legibility (elements hardcoded to graphite / #3a4046) ---------- */
[data-theme="dark"] .rc-about__txt,
[data-theme="dark"] .rc-featlist li{ color:rgba(233,237,241,.80); }
[data-theme="dark"] .eyebrow,
[data-theme="dark"] .strip__item b,
[data-theme="dark"] .chstat b,
[data-theme="dark"] .pspec b{ color:var(--ink); }

/* dims (white) vs downloads (craft) — differentiate the two adjacent series-page sections */
.vp-dl{ position:relative; }
.vp-dl > *{ position:relative; z-index:1; }
.vp-dl::before{ content:""; position:absolute; inset:0 calc(50% - 50vw); background:var(--craft); }

/* ---------- Why cards as a carousel (larger cards) ---------- */
.feats.rc-cards--carousel{ display:flex; grid-template-columns:none; gap:1.4rem;
  overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; padding-bottom:.4rem; }
.feats.rc-cards--carousel::-webkit-scrollbar{ display:none; }
.feats.rc-cards--carousel > .feat{ flex:0 0 min(340px,80vw); scroll-snap-align:start;
  padding:2.6rem 2.1rem; }
.feats.rc-cards--carousel{ align-items:stretch; }   /* equal-height cards */
.feats.rc-cards--carousel > .feat{ display:flex; flex-direction:column; }
.feats.rc-cards--carousel > .feat p{ font-size:1rem; line-height:1.6; }

/* band eyebrow ("Нашето обещание") — override the dark-bg white .eyebrow--red on the light craft band */
.band .eyebrow{ color:var(--graphite); }
/* arrows sit vertically centred for the (media-less) feature cards */
.rc-carousel-wrap--feats .rc-car-arrow{ top:44%; }

/* ---------- Carousel swipe affordance ---------- */
.rc-car-hint{ display:flex; align-items:center; justify-content:center; gap:.4rem;
  margin-top:.7rem; font-size:.8rem; letter-spacing:.02em; color:var(--muted);
  transition:opacity .5s var(--ease); }
.rc-car-hint svg{ width:16px; height:16px; opacity:.7; animation:swipeNudge 1.9s var(--ease) infinite; }
.rc-car-hint.is-gone{ opacity:0; pointer-events:none; }
@keyframes swipeNudge{ 0%,100%{ transform:translateX(0); } 50%{ transform:translateX(4px); } }
@media(prefers-reduced-motion:reduce){ .rc-car-hint svg{ animation:none; } }
@media(min-width:900px){ .rc-car-hint{ display:none; } }   /* desktop has arrows+dots; hint is a mobile cue */

/* dealers hero: CH logo instead of a product photo (phero bg is dark) */
.phero__media--logo{ align-items:center; }
.phero__media--logo img{ max-width:min(440px,84%); max-height:none; height:auto; width:auto;
  filter:drop-shadow(0 20px 46px rgba(0,0,0,.5)); }
@media(max-width:900px){ .phero__media--logo img{ max-width:min(320px,70%); } }

/* ============================================================
   FAQ PAGE
   ============================================================ */
.faq{ max-width:840px; }
.faq__list{ border-top:1px solid var(--line); }
.faq__item{ border-bottom:1px solid var(--line); }
.faq__item > summary{ cursor:pointer; list-style:none; padding:1.35rem 2.4rem 1.35rem 0; position:relative;
  font-size:clamp(1.02rem,2.2vw,1.18rem); font-weight:600; color:var(--ink); transition:color .2s var(--ease); }
.faq__item > summary::-webkit-details-marker{ display:none; }
.faq__item > summary::after{ content:"+"; position:absolute; right:.1rem; top:50%; transform:translateY(-50%);
  font-size:1.6rem; font-weight:300; line-height:1; color:var(--brand); transition:transform .3s var(--ease); }
.faq__item[open] > summary::after{ content:"−"; }
.faq__item > summary:hover{ color:var(--brand); }
.faq__a{ padding:0 2.4rem 1.5rem 0; margin:0; color:var(--muted); line-height:1.75; font-size:1.02rem; max-width:70ch;
  animation:faqReveal .35s var(--ease); }
@keyframes faqReveal{ from{ opacity:0; transform:translateY(-4px); } to{ opacity:1; transform:none; } }
.faq__cta{ text-align:center; margin-top:clamp(2.5rem,6vw,4rem); }
.faq__cta > p{ font-size:1.2rem; font-weight:500; color:var(--ink); margin-bottom:1.2rem; }
.faq__cta-btns{ display:flex; gap:.8rem; justify-content:center; flex-wrap:wrap; }
[data-theme="dark"] .faq__a{ color:rgba(233,237,241,.75); }

/* ---------- Product-series USP grid -> carousel (mobile: boxy, peeking, dots) ---------- */
.vp-usp__grid.rc-cards--carousel{ display:flex; grid-template-columns:none; align-items:stretch;
  overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; gap:1.2rem; padding-bottom:.4rem; }
.vp-usp__grid.rc-cards--carousel::-webkit-scrollbar{ display:none; }
.vp-usp__grid.rc-cards--carousel > .usp{ flex:0 0 min(340px,80vw); scroll-snap-align:start; }

/* ---------- Mobile: shorter, more square carousel product cards (dots visible on screen) ---------- */
@media(max-width:560px){
  .rc-cards--carousel .rc-card__media{ aspect-ratio:16/10; }   /* was 4/3 — shorter image */
  .rc-cards--carousel .rc-card__body{ padding:1rem 1.15rem 1.15rem; }
  .rc-cards--carousel .rc-specsum{ margin-bottom:.75rem; }
  .rc-cards--carousel .rc-specsum > div{ padding:.28rem 0; font-size:.8rem; }
  /* Boxier cards on phones: keep the 4 decision-critical specs (class, heating, capacity, warranty),
     hide WiFi / refrigerant / colours / noise so the whole card + dots fit one screen. */
  .rc-cards--carousel .rc-specsum > div:nth-child(3),
  .rc-cards--carousel .rc-specsum > div:nth-child(4),
  .rc-cards--carousel .rc-specsum > div:nth-child(5),
  .rc-cards--carousel .rc-specsum > div:nth-child(6){ display:none; }
  .rc-cards--carousel .rc-card__tag{ font-size:.86rem; margin-bottom:.5rem;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .vp-usp__grid.rc-cards--carousel > .usp{ flex-basis:80vw; }
}

/* ---------- Cookie consent banner ---------- */
.cookiebar{ position:fixed; left:1rem; right:1rem; bottom:1rem; z-index:200;
  max-width:660px; margin:0 auto; display:flex; flex-wrap:wrap; align-items:center; gap:.85rem 1.2rem;
  padding:1rem 1.25rem; border-radius:16px;
  background:rgba(17,19,25,.94); color:#fff;
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  box-shadow:0 20px 50px rgba(0,0,0,.38); border:1px solid rgba(255,255,255,.12);
  transform:translateY(150%); opacity:0; transition:transform .38s var(--ease), opacity .38s var(--ease); }
.cookiebar.is-in{ transform:none; opacity:1; }
.cookiebar__txt{ flex:1 1 280px; font-size:.85rem; line-height:1.5; color:rgba(255,255,255,.84); margin:0; }
.cookiebar__txt a{ color:#fff; text-decoration:underline; }
.cookiebar__btns{ display:flex; gap:.6rem; flex:0 0 auto; margin-left:auto; }
.cookiebar .btn{ padding:.5rem 1.15rem; font-size:.82rem; }
.cookiebar__decline{ background:transparent; border:1px solid rgba(255,255,255,.32); color:#fff; }
.cookiebar__decline:hover{ background:rgba(255,255,255,.12); }
@media(max-width:520px){ .cookiebar{ left:.6rem; right:.6rem; bottom:.6rem; padding:.9rem 1rem; }
  .cookiebar__btns{ width:100%; margin-left:0; } .cookiebar .btn{ flex:1; } }