/* SKH Design Upgrade 2026-06-17
   Connect after /assets/css/style.css. This layer keeps existing HTML/JS intact. */

:root{
  --skh-page:#f6f8fb;
  --skh-surface:#ffffff;
  --skh-surface-soft:#eef5f8;
  --skh-ink:#172231;
  --skh-muted:#5d6c7d;
  --skh-line:#d9e3ec;
  --skh-blue:#145fbd;
  --skh-teal:#0d9488;
  --skh-green:#16855f;
  --skh-amber:#c98216;
  --skh-navy:#0b1b2b;
  --skh-radius:8px;
  --skh-shadow:0 16px 34px rgba(20,36,58,.10);
  --skh-shadow-soft:0 8px 22px rgba(20,36,58,.08);
}

*{letter-spacing:0 !important}

html{
  scroll-padding-top:126px;
}

body{
  color:var(--skh-ink) !important;
  background:var(--skh-page) !important;
  font-family:Arial,Helvetica,sans-serif !important;
  text-rendering:optimizeLegibility;
}

a{
  text-underline-offset:3px;
}

img{
  height:auto;
}

.hh-container{
  width:min(1200px,calc(100% - 40px)) !important;
}

.hh-header{
  background:rgba(255,255,255,.96) !important;
  border-bottom:1px solid var(--skh-line) !important;
  box-shadow:0 8px 22px rgba(19,38,62,.06) !important;
  backdrop-filter:blur(16px);
}

.hh-header__top{
  background:var(--skh-navy) !important;
  color:#dce9f4 !important;
}

.hh-header__top_inner{
  min-height:34px !important;
}

.hh-header__top_items a,
.hh-header__top_items span,
.hh-header__top_note{
  color:#dce9f4 !important;
}

.hh-top-phone{
  background:rgba(255,255,255,.08) !important;
  border-color:rgba(255,255,255,.16) !important;
}

.hh-header__inner{
  min-height:74px !important;
  gap:18px !important;
}

.hh-logo{
  min-width:230px !important;
  color:var(--skh-ink) !important;
}

.hh-logo__img{
  max-height:48px !important;
  width:auto !important;
}

.hh-logo b{
  font-size:17px !important;
  line-height:1.1 !important;
}

.hh-logo small{
  color:var(--skh-muted) !important;
  font-weight:700 !important;
}

.hh-nav{
  gap:6px !important;
  color:#24364b !important;
  font-weight:800 !important;
}

.hh-nav a{
  min-height:38px !important;
  display:inline-flex !important;
  align-items:center !important;
  padding:0 10px !important;
  border-radius:var(--skh-radius) !important;
}

.hh-nav a:hover{
  background:#edf4fb !important;
  color:var(--skh-blue) !important;
}

.hh-header__contacts{
  gap:10px !important;
}

.hh-header__phone{
  color:var(--skh-ink) !important;
  -webkit-text-fill-color:var(--skh-ink) !important;
}

.hh-msg{
  border-radius:var(--skh-radius) !important;
  box-shadow:none !important;
}

.hh-header__cta,
.hh-btn{
  border-radius:var(--skh-radius) !important;
  transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease !important;
}

.hh-header__cta,
.hh-btn--primary{
  background:var(--skh-blue) !important;
  color:#fff !important;
  box-shadow:0 10px 22px rgba(20,95,189,.20) !important;
}

.hh-header__cta:hover,
.hh-btn--primary:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(20,95,189,.25) !important;
}

.hh-btn--light,
.hh-btn--ghost,
.hh-product__ghost,
.hh-reset{
  background:#fff !important;
  color:var(--skh-blue) !important;
  border:1px solid var(--skh-line) !important;
  box-shadow:none !important;
}

.hh-btn--light:hover,
.hh-btn--ghost:hover,
.hh-product__ghost:hover,
.hh-reset:hover{
  border-color:#aac3da !important;
  background:#f3f8fc !important;
}

.hh-hero{
  position:relative;
  min-height:620px;
  display:flex;
  align-items:center;
  padding:72px 0 56px !important;
  background-image:
    linear-gradient(90deg,rgba(246,248,251,.97) 0%,rgba(246,248,251,.90) 45%,rgba(246,248,251,.58) 100%),
    url("/assets/images/bg/hero-main-desktop.webp") !important;
  background-position:center right !important;
  background-size:cover !important;
  border-bottom:1px solid var(--skh-line) !important;
}

.hh-hero::before,
.hh-seo-hero::before,
.hh-request::before{
  display:none !important;
}

.hh-hero__grid{
  grid-template-columns:minmax(0,1fr) 360px !important;
  gap:44px !important;
  align-items:center !important;
}

.hh-label{
  border-radius:var(--skh-radius) !important;
  background:#e7f3f1 !important;
  color:#0f766e !important;
  border:1px solid #c6e3df !important;
  padding:7px 10px !important;
  font-size:12px !important;
}

.hh-hero h1,
.hh-section-head h2,
.hh-process h2,
.hh-request h2,
.hh-quiz h2,
.hh-delivery h2,
.hh-trust h2{
  color:var(--skh-ink) !important;
  line-height:1.08 !important;
  letter-spacing:0 !important;
}

.hh-hero h1{
  max-width:760px !important;
  font-size:58px !important;
  font-weight:900 !important;
}

.hh-hero p{
  max-width:690px !important;
  color:var(--skh-muted) !important;
  font-size:18px !important;
  line-height:1.58 !important;
}

.hh-hero__actions{
  gap:10px !important;
}

.hh-hero__actions .hh-btn{
  min-height:50px !important;
  padding:0 18px !important;
}

.hh-hero__panel{
  border-radius:var(--skh-radius) !important;
  background:rgba(255,255,255,.92) !important;
  border:1px solid var(--skh-line) !important;
  box-shadow:var(--skh-shadow) !important;
  padding:14px !important;
  gap:10px !important;
}

.hh-hero__stat,
.hh-hero__note{
  border-radius:var(--skh-radius) !important;
  border:1px solid var(--skh-line) !important;
  box-shadow:none !important;
}

.hh-hero__stat{
  background:#fff !important;
  padding:16px !important;
}

.hh-hero__stat b{
  color:var(--skh-blue) !important;
  font-size:32px !important;
}

.hh-hero__stat span{
  color:var(--skh-muted) !important;
  font-size:13px !important;
}

.hh-hero__note{
  background:var(--skh-navy) !important;
  color:#fff !important;
}

.hh-hero__note span{
  color:#c5d5e4 !important;
}

.hh-cats,
.hh-brands,
.hh-process,
.hh-seo-home-intro,
.hh-delivery,
.hh-trust{
  padding:58px 0 !important;
}

.hh-catalog{
  padding:64px 0 !important;
  background:#fff !important;
  border-top:1px solid var(--skh-line) !important;
  border-bottom:1px solid var(--skh-line) !important;
}

.hh-section-head{
  margin-bottom:22px !important;
}

.hh-section-head h2,
.hh-process h2,
.hh-request h2,
.hh-quiz h2,
.hh-delivery h2{
  font-size:38px !important;
}

.hh-section-head p,
.hh-process p,
.hh-request p,
.hh-trust p,
.hh-delivery p,
.hh-delivery li{
  color:var(--skh-muted) !important;
  line-height:1.62 !important;
}

.hh-category-grid,
.hh-products{
  gap:14px !important;
}

.hh-cat-card,
.hh-page-link-card,
.hh-fast-card,
.hh-trust__list div,
.hh-steps div,
.hh-delivery__card,
.hh-delivery__note,
.hh-delivery__step,
.hh-seo-deep-card,
.hh-faq-list details{
  border-radius:var(--skh-radius) !important;
  background:var(--skh-surface) !important;
  border:1px solid var(--skh-line) !important;
  box-shadow:var(--skh-shadow-soft) !important;
}

.hh-cat-card:hover,
.hh-page-link-card:hover,
.hh-product:hover{
  transform:translateY(-2px);
  box-shadow:var(--skh-shadow) !important;
}

.hh-cat-card b,
.hh-page-link-card b,
.hh-fast-card b,
.hh-steps span,
.hh-delivery__step b{
  color:var(--skh-ink) !important;
}

.hh-cat-card span,
.hh-page-link-card span,
.hh-fast-card span{
  color:var(--skh-muted) !important;
}

.hh-fast,
.hh-price-explain,
.hh-seo-home-intro{
  background:var(--skh-surface-soft) !important;
  border-top:1px solid var(--skh-line) !important;
  border-bottom:1px solid var(--skh-line) !important;
}

.hh-price-explain__box{
  border-radius:var(--skh-radius) !important;
  border:1px solid var(--skh-line) !important;
  box-shadow:var(--skh-shadow-soft) !important;
}

.hh-trust{
  background:#fff !important;
}

.hh-trust__grid{
  align-items:start !important;
}

.hh-trust__list{
  gap:10px !important;
}

.hh-trust__list div{
  padding:16px 18px !important;
  color:var(--skh-ink) !important;
}

.hh-filters{
  border-radius:var(--skh-radius) !important;
  border:1px solid var(--skh-line) !important;
  background:#f9fbfd !important;
  box-shadow:var(--skh-shadow-soft) !important;
  padding:14px !important;
}

.hh-field{
  color:var(--skh-muted) !important;
}

.hh-field input,
.hh-field select,
.hh-form input,
.hh-form textarea,
.hh-quiz-field input,
.hh-quiz-field textarea,
.hh-quiz-field select,
.hh-quiz-fields input,
.hh-quiz-fields textarea{
  border-radius:var(--skh-radius) !important;
  border:1px solid var(--skh-line) !important;
  background:#fff !important;
  color:var(--skh-ink) !important;
}

.hh-field input:focus,
.hh-field select:focus,
.hh-form input:focus,
.hh-form textarea:focus,
.hh-quiz-field input:focus,
.hh-quiz-field textarea:focus,
.hh-quiz-field select:focus{
  border-color:#8db2d8 !important;
  box-shadow:0 0 0 3px rgba(20,95,189,.12) !important;
}

.hh-catalog__line{
  margin:16px 0 !important;
  color:var(--skh-muted) !important;
}

.hh-catalog__line b{
  color:var(--skh-ink) !important;
}

.hh-product{
  border-radius:var(--skh-radius) !important;
  border:1px solid var(--skh-line) !important;
  background:#fff !important;
  box-shadow:var(--skh-shadow-soft) !important;
  min-width:0 !important;
}

.hh-product__image{
  height:218px !important;
  padding:14px !important;
  background:#f4f8fb !important;
  border-bottom:1px solid var(--skh-line) !important;
}

.hh-product__image img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}

.hh-product__body{
  padding:15px !important;
}

.hh-product__category{
  color:var(--skh-teal) !important;
  font-size:12px !important;
  text-transform:none !important;
}

.hh-product h3{
  color:var(--skh-ink) !important;
  font-size:15px !important;
  line-height:1.35 !important;
  min-height:62px !important;
}

.hh-product__desc{
  color:var(--skh-muted) !important;
  font-size:13px !important;
  min-height:58px !important;
}

.hh-pill{
  border-radius:var(--skh-radius) !important;
  background:#edf4fb !important;
  color:#38536d !important;
  border:1px solid #dbe7f0 !important;
}

.hh-product__calc{
  color:var(--skh-green) !important;
}

.hh-brand{
  border-radius:var(--skh-radius) !important;
  box-shadow:none !important;
  background:#fff !important;
  border:1px solid var(--skh-line) !important;
}

.hh-delivery{
  background:var(--skh-surface-soft) !important;
}

.hh-delivery__steps{
  gap:10px !important;
}

.hh-steps b,
.hh-delivery li:before,
.hh-seo-deep-card li::before{
  background:var(--skh-green) !important;
}

.hh-quiz{
  background:var(--skh-navy) !important;
  color:#fff !important;
  border-top:1px solid rgba(255,255,255,.10) !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
}

.hh-quiz h2,
.hh-request h2{
  color:#fff !important;
}

.hh-quiz p,
.hh-request p{
  color:#cbd8e3 !important;
}

.hh-quiz .hh-label,
.hh-request .hh-label{
  background:rgba(255,255,255,.10) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.18) !important;
}

.hh-request{
  background:var(--skh-navy) !important;
  padding:64px 0 !important;
}

.hh-form{
  border-radius:var(--skh-radius) !important;
  background:#fff !important;
  border:1px solid var(--skh-line) !important;
  box-shadow:var(--skh-shadow) !important;
  padding:20px !important;
}

.hh-consent{
  color:var(--skh-muted) !important;
}

.hh-consent a{
  color:var(--skh-blue) !important;
  text-decoration:underline;
}

.hh-form__note{
  color:var(--skh-green) !important;
}

.hh-quiz-modal__dialog,
.hh-modal__dialog,
.hh-product-modal__dialog{
  border-radius:var(--skh-radius) !important;
  border:1px solid var(--skh-line) !important;
  box-shadow:0 24px 60px rgba(0,0,0,.24) !important;
}

.hh-quiz-options span,
.hh-quiz-selected,
.hh-quiz-summary{
  border-radius:var(--skh-radius) !important;
}

.hh-quiz-options input:checked + span{
  background:#eaf5f3 !important;
  border-color:#8ecdc5 !important;
  color:#0f766e !important;
  box-shadow:0 0 0 3px rgba(13,148,136,.12) !important;
}

.hh-modal__close,
.hh-product-modal__close,
.hh-quiz-modal .hh-modal__close{
  border-radius:var(--skh-radius) !important;
}

.hh-footer{
  background:#081624 !important;
  color:#c9d5df !important;
}

.hh-footer b,
.hh-footer a{
  color:#fff !important;
}

.hh-footer__seo-links a,
.hh-footer__links a,
.hh-footer__contacts span,
.hh-footer__legal a{
  border-radius:var(--skh-radius) !important;
}

@media (max-width:1120px){
  .hh-hero__grid{
    grid-template-columns:1fr !important;
  }

  .hh-hero__panel{
    grid-template-columns:repeat(3,1fr) !important;
  }

  .hh-hero__note{
    grid-column:1 / -1;
  }

  .hh-products,
  .hh-category-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

@media (max-width:860px){
  html{
    scroll-padding-top:112px;
  }

  .hh-container{
    width:min(100% - 28px,1200px) !important;
  }

  .hh-header__inner{
    padding:10px 0 !important;
    grid-template-columns:1fr 42px !important;
  }

  .hh-logo__img{
    max-height:42px !important;
  }

  .hh-nav{
    border-radius:var(--skh-radius) !important;
    box-shadow:var(--skh-shadow) !important;
  }

  .hh-header__phone{
    background:#edf4fb !important;
    color:var(--skh-ink) !important;
    -webkit-text-fill-color:var(--skh-ink) !important;
    border-color:var(--skh-line) !important;
  }

  .hh-hero{
    min-height:auto;
    padding:46px 0 34px !important;
    background-image:
      linear-gradient(180deg,rgba(246,248,251,.97),rgba(246,248,251,.91)),
      url("/assets/images/bg/hero-main-mobile.webp") !important;
  }

  .hh-hero h1{
    font-size:38px !important;
  }

  .hh-hero p{
    font-size:16px !important;
  }

  .hh-hero__panel{
    grid-template-columns:1fr !important;
  }

  .hh-section-head--row{
    display:grid !important;
    gap:10px !important;
  }

  .hh-section-head h2,
  .hh-process h2,
  .hh-request h2,
  .hh-quiz h2,
  .hh-delivery h2{
    font-size:30px !important;
  }

  .hh-filters{
    grid-template-columns:1fr !important;
  }

  .hh-products,
  .hh-category-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .hh-process__grid,
  .hh-request__grid,
  .hh-delivery__grid,
  .hh-trust__grid{
    grid-template-columns:1fr !important;
  }
}

@media (max-width:580px){
  html{
    scroll-padding-top:102px;
  }

  .hh-container{
    width:min(100% - 22px,1200px) !important;
  }

  .hh-hero h1{
    font-size:32px !important;
  }

  .hh-hero__actions{
    display:grid !important;
  }

  .hh-products,
  .hh-category-grid,
  .hh-page-link-grid,
  .hh-seo-deep__grid{
    grid-template-columns:1fr !important;
  }

  .hh-product__image{
    height:220px !important;
  }

  .hh-cats,
  .hh-brands,
  .hh-process,
  .hh-seo-home-intro,
  .hh-delivery,
  .hh-trust,
  .hh-catalog,
  .hh-request{
    padding:42px 0 !important;
  }

  .hh-header__contacts{
    overflow-x:auto;
    padding-bottom:2px !important;
  }
}


/* SKH CONTRAST HOTFIX 2026-06-17
   Fixes washed-out header/hero: dark business header, readable logo/menu, stronger first screen. */
.hh-header{
  background:linear-gradient(180deg,rgba(8,24,39,.98),rgba(10,34,55,.96)) !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  box-shadow:0 18px 42px rgba(4,18,31,.24) !important;
  backdrop-filter:blur(16px) !important;
  -webkit-backdrop-filter:blur(16px) !important;
}

.hh-header__top{
  background:#061827 !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
}

.hh-header__inner{
  min-height:76px !important;
}

.hh-logo,
.hh-logo:visited,
.hh-logo:hover{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  text-shadow:none !important;
}

.hh-logo__fallback b,
.hh-logo b{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  text-shadow:none !important;
}

.hh-logo__fallback small,
.hh-logo small{
  color:rgba(221,236,247,.82) !important;
  -webkit-text-fill-color:rgba(221,236,247,.82) !important;
  text-shadow:none !important;
}

.hh-nav{
  background:rgba(255,255,255,.08) !important;
  border:1px solid rgba(255,255,255,.13) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.09) !important;
}

.hh-nav > a,
.hh-nav a{
  color:#f3f9ff !important;
  -webkit-text-fill-color:#f3f9ff !important;
  text-shadow:none !important;
  opacity:1 !important;
}

.hh-nav > a:hover,
.hh-nav a:hover{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  background:linear-gradient(135deg,#0c72d9,#22b9ff) !important;
}

.hh-header__phones{
  background:rgba(255,255,255,.08) !important;
  border:1px solid rgba(255,255,255,.13) !important;
  box-shadow:none !important;
}

.hh-header__phone,
.hh-header__phone:visited{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

.hh-header__phone:hover{
  color:#8fe2ff !important;
  -webkit-text-fill-color:#8fe2ff !important;
}

.hh-hero{
  min-height:620px !important;
  padding:82px 0 66px !important;
  background-image:
    linear-gradient(90deg,rgba(6,24,39,.93) 0%,rgba(9,39,64,.82) 45%,rgba(9,39,64,.28) 100%),
    url("/assets/images/bg/hero-main-desktop.webp") !important;
  background-position:center right !important;
  background-size:cover !important;
  border-bottom:1px solid rgba(10,46,76,.14) !important;
}

.hh-hero h1{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  text-shadow:0 2px 18px rgba(0,0,0,.20) !important;
}

.hh-hero p{
  color:#d8e8f5 !important;
  -webkit-text-fill-color:#d8e8f5 !important;
  text-shadow:0 1px 12px rgba(0,0,0,.16) !important;
}

.hh-hero .hh-label{
  background:rgba(255,255,255,.10) !important;
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  border-color:rgba(255,255,255,.22) !important;
  box-shadow:none !important;
}

.hh-hero__panel{
  background:rgba(255,255,255,.94) !important;
  border:1px solid rgba(255,255,255,.62) !important;
  box-shadow:0 22px 56px rgba(2,18,31,.28) !important;
}

.hh-hero__stat{
  background:#ffffff !important;
  border-color:#d8e5ef !important;
}

.hh-hero__stat b{
  color:#0c5fb4 !important;
  -webkit-text-fill-color:#0c5fb4 !important;
}

.hh-hero__stat span{
  color:#546679 !important;
  -webkit-text-fill-color:#546679 !important;
}

.hh-hero__note{
  background:linear-gradient(135deg,#0b5ea9,#28a9de) !important;
  border:0 !important;
  color:#ffffff !important;
}

.hh-hero__note b,
.hh-hero__note span{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
}

.hh-btn--light{
  background:#ffffff !important;
  color:#0c5fb4 !important;
  -webkit-text-fill-color:#0c5fb4 !important;
  border-color:rgba(255,255,255,.72) !important;
}

.hh-btn--light:hover{
  background:#f1f8ff !important;
  border-color:#ffffff !important;
}

@media (max-width:1080px){
  .hh-nav{
    background:rgba(255,255,255,.08) !important;
  }
}

@media (max-width:860px){
  .hh-header__inner{
    padding:9px 0 !important;
  }

  .hh-header__phone{
    background:transparent !important;
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    border-color:transparent !important;
  }

  .hh-hero{
    padding:48px 0 36px !important;
    background-image:
      linear-gradient(180deg,rgba(6,24,39,.90),rgba(9,39,64,.82)),
      url("/assets/images/bg/hero-main-mobile.webp") !important;
  }
}

@media (max-width:760px){
  .hh-nav{
    background:#ffffff !important;
    border:1px solid rgba(15,79,143,.18) !important;
  }

  .hh-nav > a,
  .hh-nav a{
    color:#061827 !important;
    -webkit-text-fill-color:#061827 !important;
    background:#eef6ff !important;
  }

  .hh-nav > a:hover,
  .hh-nav a:hover{
    color:#ffffff !important;
    -webkit-text-fill-color:#ffffff !important;
    background:linear-gradient(135deg,#0c72d9,#22b9ff) !important;
  }

  .hh-nav__close{
    color:#061827 !important;
    -webkit-text-fill-color:#061827 !important;
  }
}

@media (max-width:580px){
  .hh-hero h1{
    font-size:31px !important;
  }
}