/* ============================================================================
   holod.css — ХОЛОДНАЯ тема раздела «Холод» (кондиционеры).
   Подключается ПОВЕРХ styles.css: переопределяет фирменные переменные в
   сине-голубую палитру (шапка/кнопки/акценты перекрашиваются автоматически),
   и добавляет компоненты витрины кондиционеров (герой, вкладки, карточки).
   ========================================================================== */

:root{
  /* холодная палитра поверх тёплой */
  --bg:#e9f1f9;
  --bg-alt:#dce9f5;
  --ink:#132132;
  --ink-soft:#3d5878;
  --muted:#6a819c;
  --line:#c9dcef;
  --brand:#1f7fd4;
  --brand-dark:#155ea8;
  --brand-soft:#e4f0fb;
  --card:#ffffff;
  --card-border:#d5e5f4;
  --warm:#7fb9ec;
  --gold:#2b9fd6;
  --cool-ice:#eaf4fd;
  --shadow:0 10px 30px rgba(20,60,110,.10);
  --shadow-lg:0 24px 60px rgba(20,60,110,.16);
}

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

/* Лого «ТеплоЛайф» на этой странице — холодная (синяя) перекраска.
   Базовые styles.css задают эти цвета хардкодом (не через переменные),
   поэтому здесь переопределяем явно, ТОЛЬКО для /holod/. Сам логотип-бренд
   (файлы вне /holod/) не трогаем. */
/* theme-liquid.css красит .logo__txt/.logo__txt span флэт-цветом через !important
   (защита от бага «выцветания» на градиент-клипе) — здесь перебиваем той же схемой. */
.logo__txt, .logo__txt{color:#155ea8!important;-webkit-text-fill-color:#155ea8!important}
.logo__txt span{background:none!important;color:#1f7fd4!important;-webkit-text-fill-color:#1f7fd4!important}
.logo__txt .g1{color:rgba(80,170,235,.9)!important}
.logo__txt .g2{color:rgba(31,127,212,.8)!important}
.logo__txt .g3{color:rgba(21,94,168,.65)!important}
/* Сама монета теперь универсально двусторонняя (тепло/холод) на ВСЕХ страницах —
   см. script-refined.js buildLogo(); здесь её больше НЕ перекрашиваем. */

/* На /holod/ монета «отдыхает» на синей (холодной) грани, а не на оранжевой —
   тот же цикл 22с (7с оборот + 15с пауза), сдвинутый на пол-оборота (rotateY 180°). */
@keyframes logoSpinPauseCold{
  0%{transform:rotateY(180deg)}
  31.8%{transform:rotateY(540deg)}
  100%{transform:rotateY(540deg)}
}
.logo3d .coin{animation:logoSpinPauseCold 22s linear infinite}

/* Модалка «Купить оптом» — theme-liquid.css красит бейдж/кнопки оранжевым через
   !important (единый стиль для тёплых страниц) — здесь перебиваем в холодные тона. */
.ws-modal__overlay{background:rgba(20,45,80,.30)!important}
.ws-modal__box{box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 28px 64px rgba(15,45,90,.25)!important}
.ws-modal__badge{background:rgba(90,170,235,.16)!important;color:#155ea8!important;border:1px solid rgba(90,170,235,.40)!important}
.ws-modal__act--call, .ws-modal__act--mail{
  background:linear-gradient(180deg,#4aa3e8 0%,#1f7fd4 52%,#155ea8 100%)!important;
  border:1px solid rgba(21,94,168,.30)!important;
  box-shadow:
    inset 0 1px 0 rgba(220,240,255,.5),
    inset 0 -13px 16px -11px rgba(10,40,80,.42),
    0 5px 12px rgba(31,127,212,.30)!important;
}

/* основная кнопка сайта (.btn--primary) в шапке — перекрас в холодный.
   Селектор с :link/:visited перебивает оранжевый градиент theme-liquid.css
   (у него .btn--primary:link !important — нужна не меньшая специфичность). */
.hdr .btn--primary, .hdr .btn--primary:link, .hdr .btn--primary:visited{
  background:linear-gradient(160deg,#4aa3e8 0%,#1f7fd4 55%,#155ea8 100%)!important;
  box-shadow:inset 0 1.5px 0 rgba(220,240,255,.6),0 8px 20px rgba(31,127,212,.30)!important;
  border:1px solid rgba(21,94,168,.30)!important;color:#fff!important;
}

/* ---------- Герой ---------- */
.cool-hero{
  position:relative;overflow:hidden;
  background:radial-gradient(130% 100% at 50% -20%, #d3e8fb 0%, var(--bg) 60%);
  padding:56px 0 40px;
}
.cool-hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}
.cool-hero__text{display:flex;flex-direction:column;gap:16px;align-items:flex-start;max-width:560px}
.cool-hero__badge{
  display:inline-flex;align-items:center;gap:8px;background:var(--brand);color:#fff;
  font-family:'Unbounded',sans-serif;font-weight:700;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;padding:6px 15px;border-radius:999px;
}
.cool-hero__h{
  font-family:'Unbounded',sans-serif;font-weight:800;letter-spacing:-.03em;line-height:1.08;
  font-size:clamp(28px,5vw,46px);margin:0;color:var(--ink);
}
.cool-hero__p{font-size:clamp(15px,2.2vw,18px);line-height:1.55;color:var(--ink-soft);margin:0;max-width:60ch}
.cool-hero__meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
.cool-hero__chip{
  background:#fff;border:1px solid var(--card-border);border-radius:999px;
  padding:7px 14px;font-size:13.5px;font-weight:600;color:var(--ink-soft);box-shadow:var(--shadow)
}
.cool-hero__chip b{color:var(--brand)}

/* ---------- Hero-карточки (2 модели: дешёвая Dantex + Marsa) ---------- */
.cool-hero__cards{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cool-hero-card{
  display:flex;flex-direction:column;text-align:left;cursor:pointer;text-decoration:none;
  background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg,18px);
  overflow:hidden;box-shadow:var(--shadow-lg);transition:transform .18s,box-shadow .18s;
}
@media (hover:hover) and (pointer:fine){
  .cool-hero-card:hover{transform:translateY(-4px) scale(1.01);box-shadow:0 30px 70px rgba(20,60,110,.22)}
}
.cool-hero-card__pic{aspect-ratio:16/11;background:linear-gradient(160deg,#eef6fd,#dcecfa);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
.cool-hero-card__pic img{width:100%;height:100%;object-fit:contain;padding:14px}
.cool-hero-card__tag{
  position:absolute;top:10px;left:10px;background:var(--brand);color:#fff;
  font-family:'Unbounded',sans-serif;font-weight:700;font-size:10.5px;letter-spacing:.05em;text-transform:uppercase;
  padding:4px 10px;border-radius:999px;
}
.cool-hero-card__body{padding:14px 16px 17px;display:flex;flex-direction:column;gap:5px}
.cool-hero-card__brand{font-family:'Unbounded',sans-serif;font-weight:700;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.cool-hero-card__name{font-weight:700;font-size:14.5px;color:var(--ink);line-height:1.25}
.cool-hero-card__desc{font-size:12.5px;color:var(--muted);line-height:1.4}
.cool-hero-card__price{display:flex;align-items:baseline;gap:7px;margin-top:4px}
.cool-hero-card__now{font-family:'Unbounded',sans-serif;font-weight:800;font-size:19px;color:var(--ink)}
.cool-hero-card__old{font-size:12.5px;color:var(--muted);text-decoration:line-through}

@media (max-width:860px){
  .cool-hero__grid{grid-template-columns:1fr;gap:26px}
  .cool-hero__text{max-width:none}
}
@media (max-width:520px){
  .cool-hero__cards{grid-template-columns:1fr;gap:12px}
  .cool-hero-card{flex-direction:row}
  .cool-hero-card__pic{width:38%;aspect-ratio:auto;flex-shrink:0}
  .cool-hero-card__body{padding:12px 14px}
  .cool-hero-card__name{font-size:14px}
  .cool-hero-card__now{font-size:18px}
}

/* ---------- Панель фильтров (быстрый подбор, минуя воронку бренд→серия) ---------- */
.cool-filters{
  background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius-lg,18px);
  padding:22px 24px 24px;margin:24px 0 30px;box-shadow:var(--shadow);
}
.cool-filters__title{margin:0 0 16px;font-size:15px;font-weight:700;color:var(--ink)}
.cool-filters__row{display:flex;flex-wrap:wrap;gap:22px 28px}
.cool-filters__group{display:flex;flex-direction:column;gap:8px;min-width:180px}
.cool-filters__label{font-size:12.5px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--muted)}
.cool-filters__chips{display:flex;flex-wrap:wrap;gap:7px}
.cool-fchip{
  appearance:none;cursor:pointer;border:1.5px solid var(--card-border);background:#fff;color:var(--ink-soft);
  font-family:'Onest',sans-serif;font-weight:600;font-size:13.5px;padding:8px 14px;border-radius:10px;
  transition:background .15s,color .15s,border-color .15s;
}
.cool-fchip[aria-pressed="true"]{background:var(--brand);color:#fff;border-color:var(--brand)}
@media (hover:hover) and (pointer:fine){
  .cool-fchip:not([aria-pressed="true"]):hover{border-color:var(--brand);color:var(--brand)}
}
.cool-filters__select{
  appearance:none;border:1.5px solid var(--card-border);background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="%233d5878" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M6 9l6 6 6-6"/></svg>') no-repeat right 12px center/16px;
  color:var(--ink);font-family:'Onest',sans-serif;font-weight:600;font-size:13.5px;
  padding:9px 36px 9px 14px;border-radius:10px;min-width:180px;cursor:pointer;
}
.cool-filters__foot{margin-top:20px;display:flex}
.cool-filters__go{
  appearance:none;cursor:pointer;border:0;
  background:linear-gradient(160deg,#4aa3e8 0%,#1f7fd4 55%,#155ea8 100%);color:#fff;
  font-family:'Onest',sans-serif;font-weight:700;font-size:15px;padding:13px 26px;border-radius:12px;
  box-shadow:inset 0 1.5px 0 rgba(220,240,255,.6),0 8px 20px rgba(31,127,212,.30);
  transition:transform .15s,box-shadow .15s,opacity .15s;
}
.cool-filters__go:disabled{background:var(--card-border);color:var(--muted);box-shadow:none;cursor:not-allowed}
@media (hover:hover) and (pointer:fine){
  .cool-filters__go:not(:disabled):hover{transform:translateY(-2px);box-shadow:inset 0 1.5px 0 rgba(230,245,255,.8),0 12px 26px rgba(31,127,212,.42)}
}
@media (max-width:600px){
  .cool-filters{padding:18px 16px 20px}
  .cool-filters__row{gap:16px 20px}
  .cool-filters__group{min-width:140px;flex:1 1 140px}
  .cool-filters__select{min-width:0;width:100%}
  .cool-filters__go{width:100%;text-align:center}
}

/* ---------- Хлебные крошки ---------- */
.cool-crumb{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:20px 0 18px;font-size:14px}
.cool-crumb__b{appearance:none;border:0;background:none;cursor:pointer;color:var(--brand);font-weight:600;font-family:inherit;font-size:14px;padding:2px 2px}
.cool-crumb__b:hover{text-decoration:underline}
.cool-crumb__sep{color:var(--muted)}
.cool-crumb__cur{color:var(--ink-soft);font-weight:700}
.cool-lead{font-size:16px;color:var(--ink-soft);margin:6px 0 16px;font-weight:600}

/* ---------- Развилка по брендам (кнопки) ---------- */
.cool-brands{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin:26px 0 8px}
.cool-brand-btn{
  display:flex;flex-direction:column;align-items:flex-start;gap:10px;text-align:left;cursor:pointer;
  background:var(--card);border:1.5px solid var(--card-border);border-radius:var(--radius-lg,18px);
  padding:26px 24px;box-shadow:var(--shadow);transition:transform .15s,box-shadow .15s,border-color .15s;
}
.cool-brand-btn__name{font-family:'Unbounded',sans-serif;font-weight:800;font-size:24px;color:var(--ink);letter-spacing:-.02em}
.cool-brand-btn__desc{font-size:14px;line-height:1.5;color:var(--ink-soft);flex:1}
.cool-brand-btn__foot{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.cool-brand-btn__n{font-weight:600;color:var(--muted);font-size:13.5px}
.cool-brand-btn__from{font-weight:700;color:var(--brand);font-size:15px}
@media (hover:hover) and (pointer:fine){
  .cool-brand-btn:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--brand)}
}

/* ---------- Развилка по подвидам (кнопки) ---------- */
.cool-types{display:flex;flex-wrap:wrap;gap:11px;margin:6px 0 8px}
.cool-type-btn{
  appearance:none;cursor:pointer;border:1.5px solid var(--card-border);background:#fff;color:var(--ink);
  font-family:'Onest',sans-serif;font-weight:700;font-size:15.5px;padding:14px 22px;border-radius:14px;
  box-shadow:var(--shadow);transition:background .15s,color .15s,border-color .15s,transform .12s;
}
.cool-type-btn small{opacity:.55;font-weight:700;margin-left:6px}
@media (hover:hover) and (pointer:fine){
  .cool-type-btn:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-2px)}
}

/* ---------- Развилка по сериям (карточки с фото) ---------- */
.cool-series-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:15px}
.cool-series-card{
  display:flex;flex-direction:column;text-align:left;cursor:pointer;overflow:hidden;
  background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius,16px);
  box-shadow:var(--shadow);transition:transform .15s,box-shadow .15s,border-color .15s;padding:0;
}
.cool-series-card__pic{aspect-ratio:16/10;background:linear-gradient(160deg,#f3f9ff,#e3eefb);display:flex;align-items:center;justify-content:center;overflow:hidden}
.cool-series-card__img{width:100%;height:100%;object-fit:contain;padding:8px}
.cool-series-card__body{padding:13px 15px 16px;display:flex;flex-direction:column;gap:4px}
.cool-series-card__name{font-family:'Unbounded',sans-serif;font-weight:700;font-size:15px;color:var(--ink)}
.cool-series-card__meta{font-size:13px;color:var(--ink-soft);font-weight:600}
@media (hover:hover) and (pointer:fine){
  .cool-series-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--brand)}
}

/* плейсхолдер фото (Marsa/нет фото) */
.cool-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#9dc2e6}
.cool-ph svg{width:44%;max-width:90px;opacity:.7}

/* ---------- Сетка карточек ---------- */
.cool-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:16px}
.cool-card{
  display:flex;flex-direction:column;background:var(--card);border:1px solid var(--card-border);
  border-radius:var(--radius,16px);padding:18px;box-shadow:var(--shadow);
  transition:transform .15s,box-shadow .15s,border-color .15s;
}
@media (hover:hover) and (pointer:fine){
  .cool-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--warm)}
}
.cool-card__pic{margin:-18px -18px 14px;aspect-ratio:16/10;background:linear-gradient(160deg,#f3f9ff,#e3eefb);border-radius:15px 15px 0 0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.cool-card__pic img{width:100%;height:100%;object-fit:contain;padding:8px}
.cool-card__top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;margin-bottom:10px}
.cool-card__brand{
  font-family:'Unbounded',sans-serif;font-weight:700;font-size:11px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--brand);background:var(--brand-soft);padding:4px 10px;border-radius:999px;
}
.cool-card__brand[data-b="Marsa"]{color:#0a4a86;background:#e3edf7}
.cool-card__badge{
  font-size:12.5px;font-weight:700;color:var(--ink-soft);background:var(--cool-ice);
  border:1px solid var(--card-border);padding:4px 10px;border-radius:999px;white-space:nowrap
}
.cool-card__series{font-family:'Unbounded',sans-serif;font-weight:700;font-size:13px;color:var(--muted);margin:0 0 2px}
.cool-card__name{font-weight:700;font-size:16px;line-height:1.25;color:var(--ink);margin:0 0 10px}
.cool-card__desc{font-size:13px;line-height:1.5;color:var(--ink-soft);margin:0 0 10px;flex:1}
.cool-card__feat{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}
.cool-feat-chip{
  display:inline-flex;align-items:center;gap:5px;background:var(--cool-ice);color:var(--brand-dark);
  border:1px solid var(--card-border);border-radius:8px;padding:4px 8px;font-size:11px;font-weight:700;
  line-height:1.2;white-space:nowrap;
}
.cool-feat-chip svg{width:12px;height:12px;flex:none}
.cool-card__price{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-bottom:12px}
.cool-card__now{font-family:'Unbounded',sans-serif;font-weight:800;font-size:22px;color:var(--ink);letter-spacing:-.02em}
.cool-card__old{font-size:14px;color:var(--muted);text-decoration:line-through}
.cool-card__save{font-size:12px;font-weight:700;color:#fff;background:var(--brand);padding:2px 8px;border-radius:6px}
.cool-card__btn{
  display:block;text-align:center;background:linear-gradient(160deg,#4aa3e8 0%,#1f7fd4 55%,#155ea8 100%);
  color:#fff;font-weight:700;font-size:15px;padding:12px;border-radius:12px;text-decoration:none;border:0;cursor:pointer;
  box-shadow:inset 0 1.5px 0 rgba(220,240,255,.6),0 8px 20px rgba(31,127,212,.30);
  transition:transform .15s,box-shadow .15s;
}
@media (hover:hover) and (pointer:fine){
  .cool-card__btn:hover{transform:translateY(-2px);box-shadow:inset 0 1.5px 0 rgba(230,245,255,.8),0 12px 26px rgba(31,127,212,.42)}
}

.cool-note{margin:22px 0 0;font-size:13px;color:var(--muted);line-height:1.55}

/* ---------- Мобильное ---------- */
@media (max-width:600px){
  .cool-hero{padding:38px 0 28px}
  .cool-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:11px}
  .cool-card{padding:14px;border-radius:14px}
  .cool-card__now{font-size:19px}
  .cool-card__name{font-size:14.5px}
  .cool-tab{font-size:13px;padding:9px 13px}
}