/*
Theme Name: Naddo
Theme URI: https://naddo.infoliqq.beget.tech/
Author: LiMa Digital
Description: Кастомная тема Naddo — pixel-perfect Главная из Figma через Locofy + редактируемые контентные страницы.
Version: 2.2.0
License: Proprietary
Text Domain: naddo
*/

:root {
  --naddo-text: #704c3c;
  --naddo-text-soft: #6d5045;
  --naddo-bg: #ffffff;
  --naddo-bg-hero: #f7e1d5;
  --naddo-pink: #cca398;
  --naddo-pink-deep: #b48d85;
  --naddo-line: rgba(112, 76, 60, 0.2);

  --naddo-pill-light: linear-gradient(90deg, #efd6ca 0%, #fff2ed 100%);
  --naddo-pill-dark: linear-gradient(90deg, #6d5045 0%, #b48d85 50%, #6d5045 100%);

  --naddo-font: 'Montserrat', sans-serif;
  --naddo-fs-h1: 26px;
  --naddo-fs-h2: 24px;
  --naddo-fs-h3: 22px;
  --naddo-fs-lg: 22px;
  --naddo-fs-md: 18px;
  --naddo-fs-base: 16px;
  --naddo-lh-base: 1.5;

  --naddo-radius-sm: 8px;
  --naddo-radius-md: 16px;
  --naddo-radius-lg: 24px;
  --naddo-radius-pill: 45px;

  --bp-sm: 480px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;
}

*, *::before, *::after { box-sizing: border-box; }

html, body { margin: 0; padding: 0; overflow-x: hidden; max-width: 100%; }

body {
  background: #ffffff;
  color: #704c3c;
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.naddo-home,
.naddo-brand,
.naddo-contacts,
.naddo-vitrina,
.naddo-litso,
.naddo-telo,
.naddo-volosy,
.naddo-polost-rta,
.naddo-bady,
.naddo-aksessuary,
.naddo-podarki,
.naddo-limitirovannaya {
  background: #ffffff !important;
}

body.page-template-page-naddo-home,
body.page-template-page-naddo-o-brende,
body.page-template-page-naddo-contacts,
body.page-template-page-naddo-vitrina,
body.page-template-page-naddo-litso,
body.page-template-page-naddo-telo,
body.page-template-page-naddo-volosy,
body.page-template-page-naddo-polost-rta,
body.page-template-page-naddo-bady,
body.page-template-page-naddo-aksessuary,
body.page-template-page-naddo-podarki,
body.page-template-page-naddo-limitirovannaya {
  background: #ffffff;
}

.naddo-decor img,
.section-decor__img {
  opacity: 0.85 !important;
}

/* Защита от горизонтального overflow на мобайле */
@media (max-width: 1023px) {
  body, main, section, .naddo-home, .naddo-brand, .naddo-vitrina, .naddo-contacts,
  .naddo-litso, .naddo-telo, .naddo-volosy, .naddo-polost-rta, .naddo-bady,
  .naddo-aksessuary, .naddo-podarki, .naddo-limitirovannaya {
    overflow-x: hidden;
    max-width: 100vw;
  }
  img, iframe, video { max-width: 100%; height: auto; }
}

/* Планшетный диапазон 1024-1279: десктоп-layout с уменьшенными отступами */
@media (min-width: 1024px) and (max-width: 1279px) {
  .naddo-container { padding: 0 28px; }
  section { padding-left: clamp(20px, 3vw, 32px); padding-right: clamp(20px, 3vw, 32px); }
}

/* Шапка на главной: полупрозрачно-белый pill с blur (под ним hero-фото).
   На внутренних страницах остаётся плотный градиент (как в Figma 1139:1636). */
body.home .site-header__nav-1 {
  background: rgba(255, 255, 255, 0.85) !important;
  backdrop-filter: blur(10.35px) !important;
  -webkit-backdrop-filter: blur(10.35px) !important;
}

img { max-width: 100%; height: auto; display: block; }

a {
  color: #704c3c;
  text-decoration: none;
  cursor: pointer;
  transition: opacity .2s ease, transform .2s ease;
}

a:hover { opacity: .75; }

a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible {
  outline: 2px solid #b48d85;
  outline-offset: 3px;
}

button, [role="button"] { cursor: pointer; }

.vit-card,
.vitrina-grid__card,
.litso-grid__card,
.telo-grid__card,
.volosy-grid__card,
.polost-rta-grid__card,
.bady-grid__card,
.aksessuary-grid__card,
.podarki-grid__card,
.limitirovannaya-grid__card,
.card,
.blog__card,
.symptoms__card {
  cursor: pointer;
}

a.vit-card,
a.vitrina-grid__card,
a.litso-grid__card,
a.telo-grid__card,
a.volosy-grid__card,
a.polost-rta-grid__card,
a.bady-grid__card,
a.aksessuary-grid__card,
a.podarki-grid__card,
a.limitirovannaya-grid__card,
a.card,
a.blog__card {
  text-decoration: none;
  color: inherit;
}

.naddo-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 40px;
}

@media (max-width: 1023px) {
  .naddo-container { padding: 0 20px; }
}

@media (max-width: 480px) {
  .naddo-container { padding: 0 16px; }
}

/* I1/S-27: max-width: 1279px (не 1280!) - не перекрывать pixel-pinned правила на 1280px reference */

/* B6/S-18: prefers-reduced-motion — глобальный фолбэк */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Цвет футера #cca398 (макетный, Figma 1200 px) — возврат с тёмного #8a655a (B7-fix). Контраст
   с #fff для footer__link придётся проверить на боевом и подкрутить непрозрачность текста. */
.naddo-footer { background: #cca398 !important; }

/* B8/S-08/mobile 13.1: социалки футера 44x44 на mobile, gap 12-16px */
@media (max-width: 1023px) {
  .naddo-footer__social { width: 44px !important; height: 44px !important; }
  .naddo-footer__socials { gap: 14px !important; }
}

/* B9/mobile 13.4: ссылки футера — line-height + min-height 44px */
@media (max-width: 1023px) {
  .naddo-footer__link {
    line-height: 1.5;
    padding-top: 6px;
    padding-bottom: 6px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
  }
}

/* H1/S-28: @supports backdrop-filter — фолбэк для glass-cards */
@supports not (backdrop-filter: blur(10px)) {
  .card__overlay,
  .hw-card,
  .choose__card,
  .care-finder__panel {
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

/* H3/S-24: aspect-ratio фолбэк min-height для шапки и hero */
.site-header__inner { min-height: 80px; }
.hero__inner { min-height: 300px; }
@media (min-width: 1024px) {
  .site-header__inner { min-height: 177px; }
  .hero__inner { min-height: 400px; }
}

/* Figma 1200 px: стыковка hero и анонсов без белого зазора (макет не имеет отступа).
   Hero обнуляет padding-bottom, анонсы поджимают padding-top, чтобы вышло почти впритык. */
@media (min-width: 1024px) {
  .hero { padding-bottom: 0 !important; }
  .anonsy { padding-top: 32px !important; }
}

/* Figma эталон 1280 px: контент и фоны ограничены шириной макета.
   На экранах шире 1280px по бокам белые поля (body background: #fff). */
@media (min-width: 1200px) {
  html, body { background: #ffffff; }
  .naddo-home,
  .naddo-brand,
  .naddo-contacts,
  .naddo-vitrina,
  .naddo-litso,
  .naddo-telo,
  .naddo-volosy,
  .naddo-polost-rta,
  .naddo-bady,
  .naddo-aksessuary,
  .naddo-podarki,
  .naddo-limitirovannaya {
    max-width: 1280px;
    margin: 0 auto;
  }
  .naddo-footer__inner { max-width: 1280px; margin: 0 auto; }
}
