/* Хал’Маркет — витрина.
   Концепция: «изумрудная лавка». Ночной изумрудный зал и светлый песочный шёлк чередуются, как прилавок и витрина;
   их связывают узор витрины с четырёхлопастными медальонами, золотой свет и объёмный знак магазина.
   Шрифты: Playfair Display — выразительный контраст штрихов для названий (кириллица есть), Manrope — спокойный
   и читаемый гротеск для текста, цен и форм. Цвета: зелень вывески и зала, золото розеток фасада, тёплый светлый фон. */

@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/playfair-display-cyrillic-600-normal.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/playfair-display-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/playfair-display-cyrillic-700-normal.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Playfair Display'; font-style: normal; font-weight: 700; font-display: swap; src: url(../fonts/playfair-display-latin-700-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/manrope-cyrillic-400-normal.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/manrope-latin-400-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/manrope-latin-ext-400-normal.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/manrope-cyrillic-600-normal.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/manrope-latin-600-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 600; font-display: swap; src: url(../fonts/manrope-latin-ext-600-normal.woff2) format('woff2'); unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 800; font-display: swap; src: url(../fonts/manrope-cyrillic-800-normal.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Manrope'; font-style: normal; font-weight: 800; font-display: swap; src: url(../fonts/manrope-latin-800-normal.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+20AC, U+2122, U+2212, U+FEFF, U+FFFD; }

:root {
  --forest: #073F2D; --forest-2: #0A4A35; --night: #04291D; --emerald: #116444; --emerald-2: #0C5539;
  --leaf: #A8C64A; --gold: #C6A150; --gold-2: #E9D294; --gold-deep: #7A5A16; --ivory: #F6F0E4; --paper: #EFE6D3; --cream: #FFFBF3;
  --ink: #16382B; --ink-2: #3D5A4B; --on-dark: #F6F0E4; --on-dark-2: #C9D6CB;
  --shade: 7 41 29; --glow: 233 210 148;
  --f-display: 'Playfair Display', 'Times New Roman', serif; --f-text: 'Manrope', 'Segoe UI', Arial, sans-serif;
  --gut: clamp(16px, 4.2vw, 48px); --max: 1220px; --sec: clamp(64px, 9vw, 128px);
  --r-s: 12px; --r-m: 20px; --r-l: 30px;
  --sh-1: 0 1px 2px rgb(var(--shade) / .14), 0 2px 6px rgb(var(--shade) / .08);
  --sh-2: 0 2px 4px rgb(var(--shade) / .10), 0 10px 24px rgb(var(--shade) / .12), 0 30px 60px -20px rgb(var(--shade) / .22);
  --sh-3: 0 4px 10px rgb(var(--shade) / .16), 0 22px 46px rgb(var(--shade) / .22), 0 60px 110px -40px rgb(var(--shade) / .45);
  --ease: cubic-bezier(.2, .8, .2, 1); --ease-io: cubic-bezier(.45, 0, .25, 1);
  --top-h: 68px; --safe-b: env(safe-area-inset-bottom, 0px);
  color-scheme: light;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--top-h) + 16px); }
@media (prefers-reduced-motion: no-preference) { html[data-motion="on"] { scroll-behavior: smooth; } }
body { margin: 0; display: flex; flex-direction: column; background: var(--ivory); color: var(--ink); font: 400 1.0625rem/1.62 var(--f-text); overflow-x: clip; min-height: 100vh; font-variant-numeric: lining-nums; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--emerald); text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { color: var(--emerald-2); }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 6px; }
.is-deep :focus-visible, .top :focus-visible, .foot :focus-visible { outline-color: var(--gold-2); }
::selection { background: rgb(var(--glow) / .6); color: var(--forest); }
h1, h2, h3 { font-family: var(--f-display); font-weight: 700; line-height: 1.04; letter-spacing: -.012em; margin: 0 0 .5em; text-wrap: balance; overflow-wrap: break-word; hyphens: manual; }
h1 { font-size: clamp(2.35rem, 5.4vw, 4.6rem); }
h2 { font-size: clamp(1.95rem, 3.6vw, 3.2rem); }
h3 { font-size: clamp(1.25rem, 1.7vw, 1.5rem); font-weight: 600; line-height: 1.18; }
p { margin: 0 0 1em; }
.lead { font-size: clamp(1.07rem, 1.35vw, 1.25rem); color: var(--ink-2); max-width: 40em; }
.is-deep .lead { color: var(--on-dark-2); }
.kicker { display: inline-flex; align-items: center; gap: .7em; font: 800 .78rem/1.2 var(--f-text); letter-spacing: .16em; text-transform: uppercase; color: var(--gold-deep); margin: 0 0 1.1em; }
.kicker::before { content: ''; width: 34px; height: 1px; background: linear-gradient(90deg, transparent, currentColor); }
.kicker a { color: inherit; text-decoration: none; }
.is-deep .kicker { color: var(--gold-2); }
.center { text-align: center; margin-top: clamp(28px, 4vw, 48px); }
.wrap { position: relative; z-index: 2; width: 100%; max-width: calc(var(--max) + 2 * var(--gut)); margin: 0 auto; padding: 0 var(--gut); }
main { flex: 1 0 auto; display: flex; flex-direction: column; }
main > .sec:last-child { flex: 1 0 auto; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; background: var(--gold-2); color: var(--forest); border-radius: 999px; font-weight: 800; }
.skip:focus { top: 12px; }
.ico { width: 22px; height: 22px; flex: none; }
[hidden] { display: none !important; }

/* ——— шапка ——— */
.top { position: sticky; top: 0; z-index: 40; background: rgb(4 41 29 / .86); color: var(--on-dark); border-bottom: 1px solid rgb(var(--glow) / .22); box-shadow: 0 10px 30px -18px rgb(0 0 0 / .6); }
@supports (backdrop-filter: blur(8px)) { .top { background: rgb(4 41 29 / .72); backdrop-filter: blur(14px) saturate(140%); } }
.top::after { content: ''; position: absolute; inset: auto 0 -1px; height: 1px; background: linear-gradient(90deg, transparent, var(--gold-2), transparent); opacity: .55; }
.top__in { display: flex; align-items: center; gap: 18px; max-width: calc(var(--max) + 2 * var(--gut)); margin: 0 auto; padding: 8px var(--gut); min-height: var(--top-h); padding-left: max(var(--gut), env(safe-area-inset-left)); padding-right: max(var(--gut), env(safe-area-inset-right)); }
.brand { display: inline-flex; align-items: center; gap: 12px; color: var(--on-dark); text-decoration: none; margin-right: auto; min-width: 0; }
.brand:hover { color: var(--on-dark); }
.brand__mark { position: relative; width: 50px; height: 50px; flex: none; perspective: 400px; }
.brand__mark img { width: 100%; height: 100%; filter: drop-shadow(0 3px 5px rgb(0 0 0 / .45)); transition: transform .6s var(--ease); }
.brand:hover .brand__mark img { transform: rotateY(18deg) scale(1.06); }
html[data-motion="on"] .brand__mark img { animation: brandTurn 12s var(--ease-io) infinite 2s; }
html[data-motion="on"] .brand:hover .brand__mark img { animation-play-state: paused; }
@keyframes brandTurn { 0%, 78%, 100% { transform: rotateY(0) rotateZ(0); } 84% { transform: rotateY(22deg) rotateZ(-3deg); } 90% { transform: rotateY(-14deg) rotateZ(2deg); } 95% { transform: rotateY(5deg); } }
.brand__mark::after { content: ''; position: absolute; inset: -4px; border-radius: 50%; border: 1px solid rgb(var(--glow) / .5); }
.brand__text { display: flex; flex-direction: column; line-height: 1.05; min-width: 0; }
.brand__name { font: 700 1.35rem/1.05 var(--f-display); letter-spacing: .005em; background: linear-gradient(180deg, #FFF5D6, var(--gold-2) 55%, var(--gold)); -webkit-background-clip: text; background-clip: text; color: transparent; white-space: nowrap; }
.brand__tag { font: 600 .74rem/1.3 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--on-dark-2); white-space: nowrap; }
.nav ul { list-style: none; display: flex; gap: 4px; margin: 0; padding: 0; }
.nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 14px; border-radius: 999px; color: var(--on-dark); text-decoration: none; font-weight: 600; font-size: .96rem; transition: background .25s var(--ease), color .25s var(--ease); }
.nav a:hover { background: rgb(var(--glow) / .12); color: #fff; }
.nav a[aria-current] { background: rgb(var(--glow) / .16); color: var(--gold-2); box-shadow: inset 0 0 0 1px rgb(var(--glow) / .35); }
.top__tools { display: flex; gap: 8px; align-items: center; }
.motion-btn, .menu-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; border-radius: 999px; border: 1px solid rgb(var(--glow) / .35); background: rgb(255 255 255 / .04); color: var(--on-dark); font: 600 .86rem/1 var(--f-text); cursor: pointer; transition: background .25s var(--ease), transform .2s var(--ease); }
.motion-btn:hover, .menu-btn:hover { background: rgb(var(--glow) / .14); }
.motion-btn:active, .menu-btn:active { transform: scale(.96); }
.motion-btn b { color: var(--gold-2); font-weight: 800; }
html:not(.js) .motion-btn { display: none; } /* без site.js выключатель не работает — не показываем его */
.menu-btn { display: none; }
.call-btn { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px; border-radius: 999px; border: 1px solid rgb(var(--glow) / .45); background: linear-gradient(135deg, rgb(198 161 80 / .26), rgb(255 255 255 / .04)); color: var(--on-dark) !important; font: 800 .88rem/1 var(--f-text); text-decoration: none; white-space: nowrap; transition: background .25s var(--ease), transform .2s var(--ease); }
.call-btn .ico { color: var(--gold-2); }
.call-btn:hover { background: rgb(var(--glow) / .2); }
.call-btn:active { transform: scale(.96); }
.tel { white-space: nowrap; }

/* ——— разделы и глубина ——— */
.sec { position: relative; padding: var(--sec) 0; background: radial-gradient(120% 90% at 18% 0%, var(--cream), var(--ivory) 58%, #EDE3CF); }
.sec.is-alt { background: radial-gradient(110% 80% at 85% 10%, #F8EFDD, var(--paper) 60%, #E6D9BE); }
.sec.is-deep { color: var(--on-dark); background: radial-gradient(120% 90% at 20% 0%, #0E5A3F, var(--forest) 52%, var(--night)); }
.is-deep h1, .is-deep h2, .is-deep h3 { color: var(--cream); }
.is-deep a:not(.btn):not(.chip) { color: var(--gold-2); }
.decor { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.d-tex { position: absolute; inset: 0; opacity: .5;
  background-image:none; background-size:auto; mask-image: radial-gradient(120% 90% at 50% 30%, #000 10%, transparent 75%); -webkit-mask-image: radial-gradient(120% 90% at 50% 30%, #000 10%, transparent 75%); }
.decor--light .d-tex, .decor--paper .d-tex { opacity: .16; }
.d-tex--emerald { opacity: .34; background-image: url(../img/emerald-gold-texture.webp); background-size: 640px auto; background-position: center; mix-blend-mode: luminosity; filter: saturate(1.2) brightness(.9); mask-image: radial-gradient(110% 100% at 60% 40%, #000 5%, transparent 80%); -webkit-mask-image: radial-gradient(110% 100% at 60% 40%, #000 5%, transparent 80%); }
.d-light { position: absolute; inset: -20%; background: radial-gradient(38% 34% at 22% 26%, rgb(var(--glow) / .22), transparent 70%), radial-gradient(34% 30% at 82% 74%, rgb(168 198 74 / .14), transparent 70%); }
.decor--light .d-light, .decor--paper .d-light { background: radial-gradient(40% 36% at 20% 20%, rgb(255 255 255 / .85), transparent 70%), radial-gradient(36% 32% at 85% 80%, rgb(var(--glow) / .32), transparent 70%); }
.d-grain { position: absolute; inset: 0; opacity: .07; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E"); }
.is-deep .d-grain { opacity: .1; }
.dl { position: absolute; color: var(--gold); will-change: auto; }
.dl .medal { width: 100%; height: 100%; display: block; }
.dl--a { width: clamp(180px, 24vw, 360px); aspect-ratio: 1; top: -6%; right: -5%; opacity: .32; }
.dl--b { width: clamp(120px, 14vw, 220px); aspect-ratio: 1; bottom: 6%; left: -4%; opacity: .26; filter: blur(1.5px); }
.dl--c { width: clamp(60px, 7vw, 110px); aspect-ratio: 1; top: 40%; left: 46%; opacity: .14; filter: blur(3px); }
.decor--light .dl, .decor--paper .dl { color: #B8913E; }
.decor--light .dl--a, .decor--paper .dl--a { opacity: .2; }
.is-deep .dl { color: var(--gold-2); }
.medal--a { animation: spin 140s linear infinite; }
.medal--b { animation: spin 110s linear infinite reverse; }
.medal--c { animation: spin 90s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes breathe { 0%, 100% { opacity: .75; transform: scale(1); } 50% { opacity: 1; transform: scale(1.06); } }
.d-light { animation: breathe 11s var(--ease-io) infinite; }
.seam { position: relative; z-index: 3; height: 0; display: flex; align-items: center; justify-content: center; gap: 14px; color: var(--gold); pointer-events: none; }
.seam span { flex: 0 1 min(34vw, 380px); height: 1px; background: linear-gradient(90deg, transparent, currentColor 70%); }
.seam span:last-child { background: linear-gradient(270deg, transparent, currentColor 70%); }
.seam .rosette { width: 42px; height: 42px; padding: 6px; border-radius: 50%; background: var(--ivory); box-shadow: 0 0 0 1px rgb(var(--glow) / .6), var(--sh-1); }
.seam--dark .rosette { background: var(--forest); color: var(--gold-2); }
.rosette { display: block; }
.sec-head { margin-bottom: clamp(28px, 4vw, 52px); max-width: 760px; }

/* ——— кнопки ——— */
.btn { --b1: var(--emerald); --b2: var(--emerald-2); position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 12px 24px; border-radius: 999px; border: 0; font: 800 1rem/1.15 var(--f-text); letter-spacing: .01em; text-decoration: none; cursor: pointer; overflow: hidden; transition: transform .25s var(--ease), box-shadow .3s var(--ease), background-color .25s var(--ease), color .25s var(--ease); text-align: center; }
.btn:active { transform: scale(.97); }
.btn-main { background: linear-gradient(160deg, #188058, var(--b1) 45%, var(--b2)); color: var(--cream); box-shadow: inset 0 1px 0 rgb(255 255 255 / .28), inset 0 -2px 0 rgb(0 0 0 / .18), 0 10px 24px -10px rgb(17 100 68 / .8); }
.btn-main:hover { color: #fff; transform: translateY(-2px); box-shadow: inset 0 1px 0 rgb(255 255 255 / .32), inset 0 -2px 0 rgb(0 0 0 / .18), 0 16px 34px -12px rgb(17 100 68 / .9), 0 0 0 4px rgb(var(--glow) / .25); }
.btn-main::after, .btn-gold::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, transparent 35%, rgb(255 255 255 / .38) 50%, transparent 65%); transform: translateX(-120%); transition: transform .9s var(--ease); }
.btn-main:hover::after, .btn-gold:hover::after { transform: translateX(120%); }
.btn-gold { background: linear-gradient(165deg, #F6E6B4, var(--gold-2) 30%, var(--gold) 75%, #A9853A); color: var(--forest); box-shadow: inset 0 1px 0 rgb(255 255 255 / .7), inset 0 -2px 0 rgb(122 90 22 / .35), 0 12px 30px -12px rgb(var(--glow) / .9); }
.btn-gold:hover { color: var(--night); transform: translateY(-2px); box-shadow: inset 0 1px 0 rgb(255 255 255 / .7), 0 18px 40px -12px rgb(var(--glow) / 1), 0 0 0 4px rgb(var(--glow) / .25); }
.btn-ghost { background: var(--cream); color: var(--emerald); box-shadow: inset 0 0 0 1.5px rgb(17 100 68 / .45), var(--sh-1); }
.btn-ghost:hover { color: var(--forest); background: #fff; box-shadow: inset 0 0 0 1.5px var(--emerald), var(--sh-2); transform: translateY(-1px); }
.btn-glass { background: rgb(255 255 255 / .07); color: var(--cream); box-shadow: inset 0 0 0 1px rgb(var(--glow) / .45), inset 0 1px 0 rgb(255 255 255 / .12); }
.btn-glass:hover { background: rgb(var(--glow) / .14); color: #fff; transform: translateY(-1px); }
.btn--small { min-height: 44px; padding: 9px 16px; font-size: .92rem; gap: 8px; }
.btn--wide { width: 100%; }
.btn .ico { width: 20px; height: 20px; }
.btn-ask .ico { transition: transform .35s var(--ease); }
.btn-ask:hover .ico { transform: rotate(-8deg) scale(1.1); }
@keyframes breatheGlow { 0%,100% { opacity:.12; } 50% { opacity:.6; } }
.btn-breathe::before { content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; pointer-events:none; box-shadow:inset 0 0 22px rgb(var(--glow) / .7); opacity:.12; }
html[data-motion="on"] .btn-breathe::before { animation:breatheGlow 5.5s var(--ease-io) infinite; }
.icon-btn { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgb(17 100 68 / .08); color: var(--forest); cursor: pointer; transition: background .2s, transform .2s; }
.icon-btn:hover { background: rgb(17 100 68 / .16); }
.icon-btn:active { transform: scale(.94); }

/* ——— стекло и карточки ——— */
.glass { position: relative; background: rgb(255 251 243 / .7); border-radius: var(--r-m); box-shadow: inset 0 1px 0 rgb(255 255 255 / .8), 0 0 0 1px rgb(198 161 80 / .3), var(--sh-2); }
@supports (backdrop-filter: blur(8px)) { .glass { backdrop-filter: blur(14px) saturate(140%); } }
.glass.is-solid { background: var(--cream); backdrop-filter: none; }
.is-deep .glass { background: rgb(10 74 53 / .62); box-shadow: inset 0 1px 0 rgb(255 255 255 / .1), 0 0 0 1px rgb(var(--glow) / .28), 0 24px 50px -24px rgb(0 0 0 / .6); color: var(--on-dark); }
.is-deep .glass.is-solid { background: var(--forest-2); }
.glowcard { transition: transform .45s var(--ease), box-shadow .45s var(--ease); }
@media (hover: hover) { .glowcard:hover { transform: translateY(-6px); box-shadow: inset 0 1px 0 rgb(255 255 255 / .8), 0 0 0 1px rgb(198 161 80 / .75), var(--sh-3), 0 0 36px -8px rgb(var(--glow) / .55); } }

/* ——— первый экран ——— */
.hero { padding: clamp(36px, 6vw, 84px) 0 clamp(72px, 9vw, 132px); min-height: min(860px, calc(100svh - var(--top-h))); display: flex; align-items: center; overflow: clip; }
.hero__grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.hero__text { position: relative; }
.wordmark { display: block; white-space: nowrap; font: 700 clamp(2.9rem, 6.3vw, 6.1rem)/.95 var(--f-display); letter-spacing: -.02em; margin: 0 0 .18em; background: linear-gradient(176deg, #FFF8E0 8%, var(--gold-2) 42%, var(--gold) 72%, #B98E3E); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 4px 18px rgb(0 0 0 / .35)); padding-bottom: .06em; }
.hero__title { margin: 0 0 .55em; }
.hero__line { display: block; }
.hero__sub { display: block; font: 600 clamp(1.45rem, 2.7vw, 2.25rem)/1.18 var(--f-display); color: var(--cream); letter-spacing: 0; max-width: 18em; }
.hero__lead { font-size: clamp(1.05rem, 1.35vw, 1.22rem); color: var(--on-dark-2); max-width: 34em; margin-bottom: 1.6em; }
.hero__acts { display: flex; flex-wrap: wrap; gap: 12px; }
.hero__facts { display: flex; flex-wrap: wrap; gap: 8px 22px; list-style: none; padding: 0; margin: 28px 0 0; color: var(--on-dark-2); font-size: .95rem; }
.hero__facts li { display: inline-flex; align-items: center; gap: 8px; }
.hero__facts .ico { color: var(--gold-2); width: 20px; height: 20px; }
.hero__stage { position: relative; display: grid; place-items: center; min-height: clamp(300px, 40vw, 600px); }

/* объёмный знак: золотой ореол-гирих, лучи, наклон за указателем, блик по рельефу */
.emblem { position: relative; width: clamp(210px, 26vw, 380px); aspect-ratio: 1; display: grid; place-items: center; }
.emblem__rays { position: absolute; inset: -34%; border-radius: 50%; background: repeating-conic-gradient(from 0deg, rgb(var(--glow) / .16) 0deg 4deg, transparent 4deg 22.5deg); mask-image: radial-gradient(closest-side, #000 30%, transparent 100%); -webkit-mask-image: radial-gradient(closest-side, #000 30%, transparent 100%); }
.emblem__glow { position: absolute; inset: -12%; border-radius: 50%; background: radial-gradient(closest-side, rgb(var(--glow) / .5), rgb(168 198 74 / .18) 55%, transparent 72%); filter: blur(8px); }
.emblem__halo { position: absolute; inset: -16%; width: 132%; height: 132%; color: var(--gold-2); }
.emblem__halo .ring-outer { transform-origin: 50% 50%; }
.emblem__halo .ring-inner { transform-origin: 50% 50%; }
.emblem__tilt { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .9s var(--ease); }
.emblem__float { position: absolute; inset: 0; }
.emblem__img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 18px 18px rgb(0 0 0 / .45)) drop-shadow(0 40px 46px rgb(0 0 0 / .32)); }
.emblem__shine { position: absolute; inset: 0; overflow: hidden; mask-image: url(../img/halmarket-logo-3d-640.webp); -webkit-mask-image: url(../img/halmarket-logo-3d-640.webp); mask-size: contain; -webkit-mask-size: contain; mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat; pointer-events: none; }
.emblem__shine::before { content: ''; position: absolute; inset: -10% -60%; background: linear-gradient(112deg, transparent 38%, rgb(255 252 230 / .0) 42%, rgb(255 252 230 / .62) 50%, rgb(255 252 230 / 0) 58%, transparent 62%); transform: translateX(-70%); mix-blend-mode: soft-light; }
.emblem__spark { position: absolute; width: 14px; height: 14px; color: var(--gold-2); opacity: 0; }
.emblem__spark--1 { top: 8%; right: 14%; } .emblem__spark--2 { bottom: 16%; left: 4%; } .emblem__spark--3 { top: 46%; right: -4%; }
html[data-motion="on"] .emblem__float { animation: emblemFloat 7.5s var(--ease-io) infinite; }
html[data-motion="on"] .emblem__shine::before { animation: emblemShine 6.5s var(--ease-io) infinite 1.2s; }
html[data-motion="on"] .emblem__halo .ring-outer { animation: spin 70s linear infinite; }
html[data-motion="on"] .emblem__halo .ring-inner { animation: spin 46s linear infinite reverse; }
html[data-motion="on"] .emblem__rays { animation: spin 120s linear infinite; }
html[data-motion="on"] .emblem__glow { animation: breathe 6s var(--ease-io) infinite; }
html[data-motion="on"] .emblem__spark { animation: twinkle 4.2s var(--ease-io) infinite; }
html[data-motion="on"] .emblem__spark--2 { animation-delay: 1.4s; } html[data-motion="on"] .emblem__spark--3 { animation-delay: 2.6s; }
@keyframes emblemFloat { 0%, 100% { transform: translate3d(0, 0, 0) rotate(-1.2deg); } 50% { transform: translate3d(0, -12px, 0) rotate(1.2deg); } }
@keyframes emblemShine { 0%, 18% { transform: translateX(-70%); } 62%, 100% { transform: translateX(70%); } }
@keyframes twinkle { 0%, 100% { opacity: 0; transform: scale(.4) rotate(0); } 40% { opacity: .95; transform: scale(1) rotate(45deg); } 70% { opacity: 0; transform: scale(.6) rotate(90deg); } }
html[data-motion="off"] .emblem__spark, html:not(.js) .emblem__spark { opacity: .7; }
.hero__fan { position: absolute; inset: 0; pointer-events: none; }
.fan-card { position: absolute; width: clamp(108px, 11vw, 150px); padding: 7px; border-radius: 18px; background: var(--cream); box-shadow: 0 0 0 1px rgb(var(--glow) / .6), 0 18px 40px -14px rgb(0 0 0 / .65); pointer-events: auto; text-decoration: none; color: var(--ink); transition: transform .5s var(--ease), box-shadow .5s var(--ease); }
.fan-card img { aspect-ratio: 1; object-fit: cover; border-radius: 12px; width: 100%; }
.fan-card span { display: block; font: 700 .76rem/1.25 var(--f-text); padding: 7px 3px 2px; color: var(--ink); }
.fan-card:hover, .fan-card:focus-visible { box-shadow: 0 0 0 2px var(--gold-2), 0 24px 50px -14px rgb(0 0 0 / .75); z-index: 3; }
.fan-card--1 { left: -4%; bottom: 0; transform: translate3d(0, var(--py, 0px), 0) rotate(-7deg); }
.fan-card--2 { right: -6%; bottom: -6%; transform: translate3d(0, var(--py, 0px), 0) rotate(6deg); }
.fan-card--3 { right: -4%; top: -6%; transform: translate3d(0, var(--py, 0px), 0) rotate(4deg); }
.fan-card:hover, .fan-card:focus-visible { transform: translate3d(0, calc(var(--py, 0px) - 6px), 0) rotate(0) scale(1.04); }
html[data-motion="on"] .fan-card--1 { animation: bob1 9s var(--ease-io) infinite; }
html[data-motion="on"] .fan-card--2 { animation: bob2 10s var(--ease-io) infinite .8s; }
html[data-motion="on"] .fan-card--3 { animation: bob3 11s var(--ease-io) infinite 1.6s; }
html[data-motion="on"] .fan-card:hover { animation-play-state: paused; }
@keyframes bob1 { 0%, 100% { translate: 0 0; } 50% { translate: 0 -10px; } }
@keyframes bob2 { 0%, 100% { translate: 0 0; } 50% { translate: 0 -14px; } }
@keyframes bob3 { 0%, 100% { translate: 0 0; } 50% { translate: 0 9px; } }

[data-depth]:not(.fan-card) { transform: translate3d(0, var(--py, 0px), 0); }

/* ——— плитки разделов ——— */
.ctiles { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-flow: row dense; gap: clamp(12px, 1.6vw, 20px); }
.ctile-li { grid-column: span 3; }
.ctile-li--big { grid-column: 1 / span 6; grid-row: span 2; }
.ctile-li--right { grid-column: 7 / span 6; }
.ctiles--extra { margin-top: clamp(12px, 1.6vw, 20px); }
.ctiles--extra .ctile-li { grid-column: span 4; grid-row: auto; }
.ctile { position: relative; display: block; height: 100%; min-height: 180px; border-radius: var(--r-m); overflow: hidden; color: var(--cream); text-decoration: none; background: var(--forest); box-shadow: 0 0 0 1px rgb(198 161 80 / .45), var(--sh-2); }
.ctile-li--big .ctile { min-height: 380px; }
.ctile__media { position: absolute; inset: 0; }
.ctile__media img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.ctile:hover .ctile__media img { transform: scale(1.07); }
.ctile__veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgb(4 41 29 / 0) 28%, rgb(4 41 29 / .55) 58%, rgb(4 41 29 / .92)); }
.ctile::before { content: ''; position: absolute; inset: 8px; z-index: 1; border-radius: calc(var(--r-m) - 6px); border: 1px solid rgb(var(--glow) / .45); pointer-events: none; transition: inset .45s var(--ease), border-color .45s; }
.ctile:hover::before { inset: 12px; border-color: rgb(var(--glow) / .85); }
.ctile__text { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 4px; }
.ctile__title { font: 700 clamp(1.18rem, 1.6vw, 1.45rem)/1.12 var(--f-display); text-shadow: 0 2px 12px rgb(0 0 0 / .5); overflow-wrap: break-word; }
.ctile-li--big .ctile__title { font-size: clamp(1.6rem, 2.6vw, 2.3rem); }
.ctile__count { font: 700 .78rem/1 var(--f-text); letter-spacing: .1em; text-transform: uppercase; color: var(--gold-2); }

/* ——— карточки товаров ——— */
.pgrid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 232px), 1fr)); gap: clamp(14px, 1.8vw, 24px); }
.pcard-li { display: flex; }
.pcard { display: flex; flex-direction: column; width: 100%; background: var(--cream); border-radius: var(--r-m); overflow: hidden; box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgb(198 161 80 / .32), var(--sh-2); }
.pcard__media { display: block; aspect-ratio: 1; background: var(--paper); overflow: hidden; position: relative; }
.pcard__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .9s var(--ease); }
.pcard:hover .pcard__media img { transform: scale(1.06); }
.pcard__media::after { content: ''; position: absolute; inset: auto 0 0; height: 30%; background: linear-gradient(180deg, transparent, rgb(var(--shade) / .1)); }
.pcard__body { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 16px; flex: 1; }
.pcard__brand { margin: 0; font: 800 .72rem/1.2 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-deep); }
.pcard__title { font: 700 1.12rem/1.22 var(--f-display); margin: 0; overflow-wrap: break-word; }
.pcard__title a { color: var(--ink); text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .4s var(--ease); }
.pcard__title a:hover { background-size: 100% 1px; color: var(--emerald); }
.pcard__pack { margin: 0; font-size: .9rem; color: var(--ink-2); }
.pcard__foot { margin-top: auto; padding-top: 10px; display: flex; flex-direction: column; gap: 10px; align-items: stretch; }
.pcard__foot .btn { width: 100%; white-space: nowrap; }
.price { margin: 0; font-size: .95rem; color: var(--ink-2); }
.price b { font: 800 1.25rem/1 var(--f-text); color: var(--forest); letter-spacing: -.01em; }

/* ——— как узнать наличие ——— */
.how__grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(28px, 5vw, 80px); align-items: start; }
.how__scene { margin: 28px 0 0; border-radius: var(--r-l); overflow: hidden; box-shadow: 0 0 0 1px rgb(var(--glow) / .4), 0 30px 70px -30px rgb(0 0 0 / .8); }
.how__scene img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; counter-reset: s; }
.steps li { position: relative; padding: 22px 22px 20px 92px; border-radius: var(--r-m); background: rgb(10 74 53 / .55); box-shadow: inset 0 1px 0 rgb(255 255 255 / .08), 0 0 0 1px rgb(var(--glow) / .22); }
.steps h3 { margin: 0 0 6px; color: var(--cream); }
.steps p { margin: 0; color: var(--on-dark-2); }
.num { position: absolute; left: 20px; top: 18px; width: 54px; height: 54px; display: grid; place-items: center; font: 700 1.6rem/1 var(--f-display); color: var(--forest); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #FFF4CE, var(--gold-2) 45%, var(--gold)); box-shadow: 0 0 0 4px rgb(var(--glow) / .16), 0 10px 20px -8px rgb(0 0 0 / .6); }
.how__right { display: grid; gap: 16px; align-content: start; }
.how__news { margin: 0; }
.how__cert { display: flex; gap: 12px; align-items: center; margin: 8px 0 0; padding: 16px 20px; border-radius: var(--r-m); background: rgb(var(--glow) / .08); box-shadow: inset 0 0 0 1px rgb(var(--glow) / .3); color: var(--on-dark-2); }
.how__cert .ico { color: var(--gold-2); }

/* ——— магазины ——— */
.stores__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 32px); }
.store { overflow: hidden; display: flex; flex-direction: column; }
.ph { position: relative; margin: 0; overflow: hidden; }
.store__ph img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.store__ph figcaption { position: absolute; left: 12px; bottom: 12px; padding: 6px 12px; border-radius: 999px; background: rgb(4 41 29 / .78); color: var(--cream); font-size: .82rem; font-weight: 600; }
.store__body { padding: 20px 22px 24px; display: flex; flex-direction: column; gap: 8px; }
.store__body h3 { margin: 0 0 4px; font-size: 1.6rem; }
.store__line { display: flex; gap: 10px; align-items: flex-start; margin: 0; color: var(--ink-2); }
.store__line .ico { color: var(--emerald); margin-top: 2px; }
.store__acts, .branch__acts { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }

/* ——— отзывы ——— */
.rgrid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: clamp(14px, 2vw, 24px); }
.rcard { margin: 0; height: 100%; padding: 26px 24px 22px; display: flex; flex-direction: column; gap: 14px; }
.rcard blockquote { margin: 0; flex: 1; }
.rcard blockquote p { margin: 0; font: 600 1.18rem/1.4 var(--f-display); }
.rcard blockquote p::before { content: '«'; color: var(--gold); } .rcard blockquote p::after { content: '»'; color: var(--gold); }
.rcard figcaption { display: flex; flex-direction: column; gap: 2px; font-size: .9rem; }
.rcard figcaption span { opacity: .85; }
.stars { display: inline-flex; gap: 2px; color: var(--gold-2); }
.rgrid--light .stars { color: var(--gold-deep); }
.stars .ico { width: 18px; height: 18px; }

/* ——— шапка внутренних страниц, крошки ——— */
.page-head { padding: clamp(28px, 4vw, 52px) 0 clamp(48px, 6vw, 80px); }
.page-head h1 { margin-top: .2em; }
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 6px; margin: 0 0 14px; padding: 0; font-size: .9rem; }
.crumbs li { display: inline-flex; align-items: center; gap: 6px; }
.crumbs li + li::before { content: ''; width: 6px; height: 6px; transform: rotate(45deg); border: 1px solid var(--gold); }
.crumbs a { display: inline-flex; min-height: 32px; align-items: center; }
.is-deep .crumbs a { color: var(--gold-2); }
.is-deep .crumbs [aria-current] { color: var(--on-dark-2); }
.crumbs [aria-current] { color: var(--ink-2); }
.cat-head__grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: clamp(24px, 4vw, 60px); align-items: center; }
.cat-head__count { font: 800 .82rem/1 var(--f-text); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-2); margin: 0 0 18px; }
.cat-head__ph { border-radius: 50% 50% var(--r-l) var(--r-l); overflow: hidden; box-shadow: 0 0 0 1px rgb(var(--glow) / .5), 0 0 0 9px rgb(var(--glow) / .08), 0 30px 60px -24px rgb(0 0 0 / .8); aspect-ratio: 4 / 5; max-width: 380px; justify-self: end; width: 100%; }
.cat-head__ph img { width: 100%; height: 100%; object-fit: cover; }

/* ——— поиск, фильтры, пустой результат ——— */
.search { padding: 18px clamp(16px, 2.4vw, 26px); margin-bottom: clamp(22px, 3vw, 36px); }
.search__label { display: block; font: 800 .8rem/1.2 var(--f-text); letter-spacing: .1em; text-transform: uppercase; color: var(--gold-deep); margin-bottom: 10px; }
.search__row { display: flex; align-items: center; gap: 10px; background: #fff; border-radius: 999px; padding: 5px 5px 5px 16px; box-shadow: inset 0 0 0 1.5px rgb(17 100 68 / .3); transition: box-shadow .25s; }
.search__row:focus-within { box-shadow: inset 0 0 0 2px var(--emerald), 0 0 0 4px rgb(var(--glow) / .3); }
.search__row .ico { color: var(--emerald); }
.search__row input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: 600 1.06rem/1.2 var(--f-text); color: var(--ink); min-height: 44px; }
.search__row input::placeholder { color: #6b7d72; font-weight: 400; }
.search__row input::-webkit-search-cancel-button { display: none; }
.search__meta { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 12px; }
.search__meta p { margin: 0; font-weight: 700; color: var(--ink-2); }
.link-reset { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; font-weight: 700; }
.link-reset .ico { width: 18px; height: 18px; }
.chips { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; padding: 0; }
.chips--scroll { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; padding: 2px 2px 10px; margin: 0 0 18px; scroll-snap-type: x proximity; }
.chips--scroll li { scroll-snap-align: start; flex: none; }
.chip { display: inline-flex; align-items: center; min-height: 40px; padding: 7px 15px; border-radius: 999px; font: 700 .9rem/1.15 var(--f-text); text-decoration: none; color: var(--forest); background: #fff; box-shadow: inset 0 0 0 1px rgb(17 100 68 / .25); white-space: nowrap; transition: background .2s, box-shadow .2s, color .2s; }
.chip:hover { box-shadow: inset 0 0 0 1.5px var(--emerald); color: var(--forest); }
.chip[aria-current] { background: var(--forest); color: var(--gold-2); box-shadow: inset 0 0 0 1px var(--forest), 0 6px 14px -8px rgb(var(--shade) / .8); }
.chip--dark { background: rgb(255 255 255 / .06); color: var(--cream); box-shadow: inset 0 0 0 1px rgb(var(--glow) / .4); }
.chip--dark:hover { color: #fff; background: rgb(var(--glow) / .14); }
.empty { text-align: center; padding: clamp(32px, 5vw, 56px) 24px; max-width: 640px; margin: 10px auto 0; }
.empty .rosette { width: 72px; height: 72px; margin: 0 auto 14px; color: var(--gold); }
.empty h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); }

/* ——— страница товара ——— */
.prod-sec { padding-top: clamp(22px, 3vw, 40px); }
.catalog, .docs { padding-top: clamp(28px, 4vw, 56px); }
.prod { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4.5vw, 72px); align-items: start; margin-top: 10px; }
.gallery { position: sticky; top: calc(var(--top-h) + 20px); }
.gallery__stage { padding: 10px; overflow: hidden; }
.gallery__main { display: block; width: 100%; padding: 0; border: 0; background: var(--paper); border-radius: calc(var(--r-m) - 6px); overflow: hidden; cursor: zoom-in; }
.gallery__main img { width: 100%; max-height: min(74vh, 680px); object-fit: contain; margin: 0 auto; }
.gallery__thumbs { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; padding: 12px 2px 4px; margin: 0; }
.gallery__thumb { width: 78px; height: 78px; padding: 0; border: 0; border-radius: 14px; overflow: hidden; cursor: pointer; box-shadow: 0 0 0 1px rgb(198 161 80 / .4); opacity: .72; transition: opacity .25s, box-shadow .25s, transform .25s; background: var(--paper); }
.gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.gallery__thumb:hover { opacity: 1; transform: translateY(-2px); }
.gallery__thumb[aria-current] { opacity: 1; box-shadow: 0 0 0 2.5px var(--emerald), 0 0 0 5px rgb(var(--glow) / .5); }
.prod__title { font-size: clamp(2.05rem, 4vw, 3.4rem); }
.facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 0 0 18px; }
.facts div { padding: 12px 14px; border-radius: var(--r-s); background: var(--cream); box-shadow: inset 0 0 0 1px rgb(198 161 80 / .35); }
.facts dt { font: 800 .72rem/1.2 var(--f-text); letter-spacing: .1em; text-transform: uppercase; color: var(--gold-deep); }
.facts dd { margin: 4px 0 0; font-weight: 700; }
.prod__info .price { margin: 0 0 14px; font-size: 1.05rem; }
.prod__info .price b { font-size: 1.9rem; }
.avail { list-style: none; padding: 0; margin: 0 0 16px; display: grid; gap: 8px; }
.av { display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; border-radius: var(--r-s); background: rgb(17 100 68 / .07); }
.av .ico { color: var(--emerald); }
.av--out_of_stock { background: rgb(122 90 22 / .08); } .av--out_of_stock .ico { color: var(--gold-deep); }
.prod__cta { display: grid; gap: 10px; margin: 6px 0 26px; max-width: 520px; }
.prod__info .facts { max-width: 520px; }
.prose { margin-top: 26px; max-width: 40em; }
.prose h2 { font-size: 1.5rem; margin-bottom: .4em; }
.prose--page { padding: clamp(24px, 4vw, 48px); max-width: 860px; margin: 0 auto; }
.where { padding: 18px 20px; max-width: 520px; margin-bottom: 8px; }
.where h2 { font-size: 1.3rem; margin-bottom: 10px; }
.where ul { list-style: none; margin: 0 0 10px; padding: 0; display: grid; gap: 10px; }
.where li { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: center; }
.where li .ico { color: var(--emerald); }
.where li span { display: flex; flex-direction: column; line-height: 1.25; }
.where small { color: var(--ink-2); }
.where__link { font-weight: 700; font-size: .92rem; min-height: 40px; display: inline-flex; align-items: center; }
.where p { margin: 0; font-size: .92rem; color: var(--ink-2); }
.prose ul.dots { list-style: none; margin: 0 0 1em; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: 6px 18px; }
.prose ul.dots li { position: relative; padding-left: 20px; }
.prose ul.dots li::before { content: ''; position: absolute; left: 2px; top: .62em; width: 7px; height: 7px; transform: rotate(45deg); background: var(--gold); }
.cert-links { list-style: none; padding: 0; display: grid; gap: 8px; }
.cert-links a { display: inline-flex; gap: 8px; align-items: center; font-weight: 700; }
.nojs { padding: 16px 18px; margin-bottom: 18px; }
.nojs__text { font-family: ui-monospace, monospace; font-size: .92rem; background: #fff; padding: 10px; border-radius: 10px; overflow-wrap: anywhere; }

/* ——— сертификаты: листы документа как бумага на столе, оригинал — для скачивания ——— */
.docs__note { display: flex; gap: 14px; align-items: flex-start; padding: 16px 20px; margin: 0 0 22px; max-width: 900px; }
.docs__note .ico { color: var(--gold-deep); flex: none; margin-top: 3px; }
.docs__note p { margin: 0; color: var(--ink-2); }
.certs { list-style: none; margin: 0; padding: 0; display: grid; gap: 26px; }
.cert { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: clamp(18px, 3vw, 34px); padding: clamp(16px, 2.4vw, 26px); scroll-margin-top: calc(var(--top-h) + 16px); }
.cert__docs { display: grid; gap: 16px; align-content: start; }
.cert__file { background: #fff; border-radius: var(--r-s); box-shadow: inset 0 0 0 1px rgb(198 161 80 / .45), 0 10px 26px -18px rgb(4 41 29 / .45); padding: 12px; display: grid; gap: 10px; }
.cert__flabel { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 0; line-height: 1.25; }
.cert__flabel .ico { color: var(--gold-deep); }
.cert__flabel small { color: var(--ink-2); font-weight: 600; }
.cert__pages { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cert__pages li:first-child { flex: 1 1 100%; }
.cert__page { position: relative; display: block; width: 100%; padding: 0; border: 0; border-radius: 8px; background: var(--paper); cursor: zoom-in; overflow: hidden; box-shadow: 0 0 0 1px rgb(22 56 43 / .12); transition: transform .25s var(--ease), box-shadow .25s var(--ease); }
.cert__page img { display: block; width: 100%; height: auto; }
.cert__pages li:not(:first-child) .cert__page { width: 74px; }
.cert__pages li:not(:first-child) .cert__page img { height: 96px; object-fit: cover; object-position: top; }
.cert__page:hover { transform: translateY(-2px); box-shadow: 0 0 0 2px var(--gold), 0 8px 18px -10px rgb(4 41 29 / .5); }
.cert__page:focus-visible { outline: 3px solid var(--emerald); outline-offset: 2px; }
.cert__pnum { position: absolute; right: 6px; bottom: 6px; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 999px; display: grid; place-items: center; font: 800 .74rem/1 var(--f-text); color: var(--cream); background: rgb(4 41 29 / .78); }
.cert__page--img img { max-height: 420px; object-fit: contain; }
.cert__nopv { display: flex; gap: 10px; align-items: center; margin: 0; padding: 18px; border-radius: 8px; background: var(--paper); color: var(--ink-2); }
.cert__nopv .ico { color: var(--emerald); width: 40px; height: 40px; flex: none; }
.cert__dl { justify-self: start; }
.cert__dl small { font-weight: 600; opacity: .75; margin-left: 4px; }
.cert .facts { grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); }
.cert__maker { margin: 0 0 6px; font: 700 .9rem/1.35 var(--f-text); color: var(--gold-deep); }
.cert__body h2 { font-size: clamp(1.35rem, 2.4vw, 1.7rem); margin-bottom: 12px; }
.cert__body h3 { font-size: 1.05rem; margin: 18px 0 6px; font-family: var(--f-text); font-weight: 800; }
.cert__scope p { margin: 0 0 .7em; }
.cert__prods ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cert__prods a { display: inline-flex; align-items: center; min-height: 40px; padding: 6px 14px; border-radius: 999px; background: rgb(17 100 68 / .07); box-shadow: inset 0 0 0 1px rgb(17 100 68 / .2); text-decoration: none; font-weight: 700; font-size: .92rem; }
.cert__prods a:hover { background: rgb(17 100 68 / .13); }
.tag { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 6px 14px; border-radius: 999px; font: 800 .85rem/1.2 var(--f-text); background: rgb(17 100 68 / .1); color: var(--forest); margin: 0 0 12px; }
.tag .ico { width: 18px; height: 18px; }
.tag--ok { background: rgb(168 198 74 / .25); }
.tag--bad { background: #F7E2D6; color: #7A2E12; }
.tag--soon { background: rgb(233 210 148 / .45); color: var(--gold-deep); }
.cert-box .cert-links li { display: grid; gap: 2px; }
.cert-box .cert-links small { color: var(--ink-2); padding-left: 32px; }
.cert-box__note { font-size: .9rem; color: var(--ink-2); margin: 8px 0 0; }
.empty--docs { max-width: 720px; }

/* ——— филиалы ——— */
.branch__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 60px); align-items: start; }
.branch__lines { list-style: none; padding: 0; margin: 0 0 18px; display: grid; gap: 10px; font-size: 1.08rem; }
.branch__lines li { display: flex; gap: 12px; align-items: flex-start; }
.branch__lines .ico { color: var(--emerald); margin-top: 3px; }
.branch__ex h3, .branch__stops h3 { font-size: 1.15rem; margin: 18px 0 6px; }
.branch__ex ul, .branch__stops ul { margin: 0; padding-left: 1.2em; }
.map-shield { min-height: 360px; display: grid; place-items: center; align-content: center; gap: 6px; text-align: center; padding: 28px; overflow: hidden; }
.map-shield .rosette { width: 64px; height: 64px; color: var(--gold); margin-bottom: 8px; }
.map-shield__note { color: var(--ink-2); max-width: 30em; font-size: .95rem; }
.map-shield.is-loaded { padding: 0; background: var(--paper); }
.map-shield.is-loaded { position: relative; display: block; }
.map-cover { position: absolute; inset: 0; border: 0; border-radius: var(--r-m); background: linear-gradient(180deg, transparent 60%, rgb(4 41 29 / .55)); color: var(--cream); font: 800 .95rem/1.2 var(--f-text); display: flex; align-items: flex-end; justify-content: center; padding: 0 16px 18px; cursor: pointer; text-shadow: 0 1px 8px rgb(0 0 0 / .6); }
.map-cover:hover { background: linear-gradient(180deg, rgb(4 41 29 / .1) 40%, rgb(4 41 29 / .65)); }
.map-frame { width: 100%; height: 420px; border: 0; display: block; border-radius: var(--r-m); }
.branch__photos { grid-column: 1 / -1; list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 16px; }
.store-ph { display: block; width: 100%; padding: 0; border: 0; border-radius: var(--r-m); overflow: hidden; cursor: zoom-in; box-shadow: 0 0 0 1px rgb(198 161 80 / .4), var(--sh-2); background: var(--paper); }
.store-ph img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .9s var(--ease); }
.store-ph:hover img { transform: scale(1.05); }
.store-ph__cap { margin: 8px 4px 0; font-size: .92rem; font-weight: 600; color: var(--ink-2); }

/* ——— подвал ——— */
.foot { padding: clamp(48px, 6vw, 80px) 0 calc(28px + var(--safe-b)); }
.foot__grid { display: grid; grid-template-columns: 1.1fr 1.4fr 1fr; gap: clamp(24px, 4vw, 56px); }
.foot__brand img { width: 72px; height: 72px; margin-bottom: 10px; }
.foot__name { font: 700 1.6rem/1 var(--f-display); color: var(--gold-2); margin-bottom: 6px; }
.foot__brand p:last-child { color: var(--on-dark-2); }
.foot__h { font: 800 .8rem/1.2 var(--f-text); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-2); margin-bottom: 14px; }
.foot__shops, .foot__links { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.foot__shops li { display: flex; flex-direction: column; color: var(--on-dark-2); font-size: .96rem; }
.foot__shops b { color: var(--cream); }
.foot__links a { display: inline-flex; align-items: center; gap: 10px; min-height: 40px; color: var(--cream) !important; text-decoration: none; }
.foot__links a:hover { color: var(--gold-2) !important; }
.foot__links .ico { color: var(--gold-2); }
.foot__copy { margin-top: 36px; padding-top: 18px; border-top: 1px solid rgb(var(--glow) / .2); color: var(--on-dark-2); font-size: .88rem; }

/* ——— диалог «Узнать наличие» и фото крупно ——— */
dialog { border: 0; padding: 0; color: var(--ink); }
.ask { width: min(560px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); border-radius: var(--r-l); background: var(--cream); box-shadow: 0 0 0 1px rgb(var(--glow) / .7), 0 40px 90px -20px rgb(0 0 0 / .65); overflow: auto; overscroll-behavior: contain; }
.ask::backdrop { background: rgb(4 41 29 / .62); backdrop-filter: blur(4px); }
.ask__in { padding: clamp(20px, 3vw, 30px); padding-bottom: calc(clamp(20px, 3vw, 30px) + var(--safe-b)); display: grid; gap: 14px; position: relative; }
.ask__in::before { content: ''; position: absolute; inset: 0 0 auto; height: 5px; background: linear-gradient(90deg, var(--emerald), var(--gold-2), var(--emerald)); }
.ask__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.ask__head h2 { margin: 0; font-size: 1.8rem; }
.ask__product { margin: 0; font: 700 1.1rem/1.3 var(--f-display); color: var(--forest); }
.ask__branches { border: 0; margin: 0; padding: 0; display: grid; gap: 8px; }
.ask__branches legend { font-weight: 800; margin-bottom: 8px; padding: 0; }
.radio { display: flex; gap: 12px; align-items: center; padding: 10px 14px; border-radius: var(--r-s); background: #fff; box-shadow: inset 0 0 0 1px rgb(17 100 68 / .22); cursor: pointer; min-height: 48px; }
.radio input { width: 20px; height: 20px; accent-color: var(--emerald); flex: none; margin: 0; }
.radio span { display: flex; flex-direction: column; line-height: 1.25; }
.radio small { color: var(--ink-2); }
.radio:has(input:checked) { box-shadow: inset 0 0 0 2px var(--emerald); background: #F2F8EF; }
.ask__label { font-weight: 800; }
.ask__text { width: 100%; resize: vertical; min-height: 120px; border-radius: var(--r-s); border: 0; padding: 12px 14px; font: 500 1rem/1.5 var(--f-text); color: var(--ink); background: #fff; box-shadow: inset 0 0 0 1.5px rgb(17 100 68 / .3); }
.ask__text:focus { outline: 0; box-shadow: inset 0 0 0 2px var(--emerald), 0 0 0 4px rgb(var(--glow) / .3); }
.ask__actions { display: grid; gap: 8px; }
.ask__status { margin: 0; min-height: 1.4em; font-weight: 700; color: var(--emerald); }
.ask__status.is-error { color: #8A2E12; }
.ask__msgs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.msg-btn { display: flex; gap: 10px; align-items: center; min-height: 52px; padding: 10px 14px; border-radius: var(--r-s); }
.msg-btn--off { background: rgb(22 56 43 / .05); color: var(--ink-2); box-shadow: inset 0 0 0 1px rgb(22 56 43 / .15); cursor: default; }
.msg-btn--off span { display: flex; flex-direction: column; line-height: 1.2; }
.msg-btn--off small { font-size: .82rem; }
.ask__note { margin: 0; font-size: .9rem; color: var(--ink-2); }
.ask__phone { display: grid; gap: 6px; }
.ask__call b { font-weight: 800; }
.ask__hint { margin: 0; font-size: .9rem; color: var(--ink-2); }
.where__phone { display: flex; gap: 10px; align-items: flex-start; margin: 0 !important; padding-top: 10px; border-top: 1px solid rgb(198 161 80 / .35); color: var(--ink) !important; font-size: .95rem !important; }
.where__phone .ico { color: var(--emerald); flex: none; margin-top: 1px; }
.where__phone a { font-weight: 800; }
.page-head__phone { display: flex; gap: 10px; align-items: flex-start; margin: 0 0 14px; color: var(--on-dark); }
.page-head__phone .ico { color: var(--gold-2); flex: none; margin-top: 2px; }
.page-head__phone a { color: var(--gold-2); font-weight: 800; }
.how__news { display: flex; flex-wrap: wrap; gap: 10px; }
.lightbox { background: transparent; max-width: 96vw; max-height: 94dvh; overflow: visible; }
.lightbox::backdrop { background: rgb(4 41 29 / .88); }
.lightbox figure { margin: 0; }
.lightbox img { max-width: 94vw; max-height: 84dvh; object-fit: contain; border-radius: 14px; box-shadow: 0 30px 80px rgb(0 0 0 / .6); background: var(--paper); }
.lightbox figcaption { color: var(--cream); text-align: center; margin-top: 10px; font-weight: 600; }
.lightbox__close { position: fixed; top: max(12px, env(safe-area-inset-top)); right: 12px; background: var(--cream); z-index: 2; }

/* ——— след курсора ——— */
.trail { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }

/* ——— появление при прокрутке (содержимое видно без JS и при отказе site.js: boot.js снимает .js или ставит .reveal-off) ——— */
html.js.js-ready:not(.reveal-off)[data-motion="on"] [data-reveal] { opacity: 0; translate: 0 26px; transition: opacity .9s var(--ease), translate .9s var(--ease); transition-delay: calc(var(--i, 0) * 70ms); }
html.js.js-ready:not(.reveal-off)[data-motion="on"] [data-reveal].is-in { opacity: 1; translate: 0 0; }
html.js[data-motion="on"] [data-intro] > * { animation: introIn 1.1s var(--ease) both; }
html.js[data-motion="on"] [data-intro] > *:nth-child(2) { animation-delay: .08s; } html.js[data-motion="on"] [data-intro] > *:nth-child(3) { animation-delay: .16s; } html.js[data-motion="on"] [data-intro] > *:nth-child(4) { animation-delay: .24s; } html.js[data-motion="on"] [data-intro] > *:nth-child(5) { animation-delay: .32s; }
@keyframes introIn { from { opacity: 0; translate: 0 22px; } to { opacity: 1; translate: 0 0; } }
.decor:not(.in-view) * { animation-play-state: paused !important; }
html[data-motion="off"] *, html[data-motion="off"] *::before, html[data-motion="off"] *::after { animation: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) { html:not([data-motion="on"]) *, html:not([data-motion="on"]) *::before, html:not([data-motion="on"]) *::after { animation: none !important; transition: none !important; } }

/* ——— адаптив ——— */
@media (max-width: 1279px) {
  .call-btn { padding: 8px 12px; }
  .call-btn__num { display: none; }
}
@media (max-width: 1100px) {
  .nav a { padding: 8px 10px; font-size: .9rem; }
  .motion-btn__label { font-size: 0; } .motion-btn__label b { font-size: .8rem; }
  .ctile-li { grid-column: span 4; } .ctile-li--big { grid-column: 1 / span 8; grid-row: span 1; } .ctile-li--right { grid-column: 5 / span 8; } .ctile-li--big .ctile { min-height: 240px; }
}
@media (max-width: 900px) {
  :root { --top-h: 62px; }
  .menu-btn { display: inline-flex; }
  .nav { position: fixed; inset: var(--top-h) 0 auto 0; background: rgb(4 41 29 / .97); border-bottom: 1px solid rgb(var(--glow) / .3); padding: 10px var(--gut) 18px; transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity .25s, transform .25s, visibility .25s; max-height: calc(100dvh - var(--top-h)); overflow-y: auto; }
  .nav.is-open { opacity: 1; visibility: visible; transform: none; }
  .nav ul { flex-direction: column; gap: 4px; }
  .nav a { width: 100%; min-height: 50px; font-size: 1.05rem; padding: 10px 16px; }
  html:not(.js) .nav { position: static; opacity: 1; visibility: visible; transform: none; background: none; padding: 0; border: 0; }
  html:not(.js) .nav ul { flex-direction: row; flex-wrap: wrap; }
  html:not(.js) .top__in { flex-wrap: wrap; }
  html:not(.js) .menu-btn { display: none; }
  html:not(.js) .top { position: relative; } /* раскрытое меню без JS не закрывает пол-экрана при прокрутке */
  .hero { min-height: 0; }
  .hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hero__stage { order: -1; min-height: 0; }
  .emblem { width: clamp(170px, 48vw, 260px); }
  .hero__fan { display: none; }
  .how__grid, .branch__grid, .cat-head__grid, .prod { grid-template-columns: minmax(0, 1fr); }
  .cat-head__ph { display: none; }
  .gallery { position: static; }
  .gallery__main img { max-height: min(46vh, 440px); }
  .stores__grid { grid-template-columns: minmax(0, 1fr); }
  .foot__grid { grid-template-columns: 1fr 1fr; }
  .foot__brand { grid-column: 1 / -1; }
  .cert { grid-template-columns: minmax(0, 1fr); }
  .cert__docs { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }
}
@media (max-width: 700px) {
  body { font-size: 1rem; }
  .brand__mark { width: 42px; height: 42px; }
  .brand__name { font-size: 1.18rem; }
  .brand__tag { font-size: .66rem; letter-spacing: .1em; }
  .motion-btn, .menu-btn, .call-btn { padding: 8px 11px; }
  .menu-btn span { display: none; }
  .hero { padding-top: 22px; text-align: center; }
  .hero__text { display: flex; flex-direction: column; align-items: center; }
  .hero__sub { margin: 0 auto; }
  .hero__lead { margin-left: auto; margin-right: auto; }
  .hero__acts { justify-content: center; width: 100%; }
  .hero__acts .btn { flex: 1 1 100%; }
  .hero__facts { justify-content: center; }
  .kicker::before { display: none; }
  .ctiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ctile-li, .ctiles--extra .ctile-li { grid-column: span 1; grid-row: auto; }
  .ctile-li--big, .ctile-li--right { grid-column: 1 / span 2; }
  .ctile { min-height: 168px; }
  .ctile-li--big .ctile { min-height: 210px; }
  .ctile__text { padding: 12px 13px 14px; }
  .ctile__title { font-size: 1.08rem; }
  .ctile-li--big .ctile__title { font-size: 1.45rem; }
  .ctiles--extra .ctile-li:last-child:nth-child(odd) { grid-column: 1 / span 2; }
  .ctile__count { font-size: .68rem; }
  .pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .pcard__body { padding: 10px 11px 12px; }
  .pcard__title { font-size: 1rem; }
  .pcard__brand { font-size: .64rem; }
  .pcard__foot .btn { min-height: 44px; padding: 8px 8px; font-size: .82rem; gap: 5px; letter-spacing: 0; }
  .pcard__foot .btn .ico { width: 18px; height: 18px; }
  .steps li { padding: 18px 16px 18px 80px; }
  .num { left: 14px; width: 50px; height: 50px; }
  .search__row .btn { padding: 8px 14px; }
  .ask__msgs { grid-template-columns: 1fr; }
  .foot__grid { grid-template-columns: 1fr; }
  .map-shield { min-height: 280px; }
  .map-frame { height: 340px; }
  .dl--a { opacity: .22; }
}
@media (max-width: 480px) {
  .top__in { gap: 10px; }
  .top__tools { gap: 6px; }
  .brand { gap: 9px; }
  .motion-btn, .menu-btn, .call-btn { padding: 8px 10px; }
  /* только значок: состояние — в aria-label и перечёркнутом знаке */
  .motion-btn { position: relative; }
  .motion-btn__label { display: none; }
  .motion-btn[aria-pressed="false"] .ico { opacity: .55; }
  .motion-btn[aria-pressed="false"]::after { content: ''; position: absolute; left: 50%; top: 50%; width: 28px; height: 2px; border-radius: 2px; background: var(--gold-2); transform: translate(-50%, -50%) rotate(-45deg); box-shadow: 0 0 0 1.5px rgb(4 41 29 / .9); }
  h1, .prod__title { font-size: clamp(1.5rem, 7.9vw, 2.6rem); }
  .gallery__thumb { width: 64px; height: 64px; }
}
@media (max-width: 380px) {
  .brand__tag { display: none; }
  .pgrid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .pcard { flex-direction: row; }
  .pcard__media { width: 118px; flex: none; aspect-ratio: auto; min-height: 150px; }
  .pcard__body { padding: 11px 12px 12px; }
  .ctile__title { font-size: .98rem; }
  .ctile__text { padding: 10px 11px 12px; }
  .ctile-li--big .ctile__title { font-size: 1.3rem; }
}
@media (max-width: 350px) {
  .top__in { gap: 8px; }
  .brand { gap: 6px; }
  .brand__mark { width: 32px; height: 32px; }
  .brand__name { font-size: 1.04rem; }
  .ctile__title { font-size: .9rem; }
  .ctile-li--big .ctile__title { font-size: 1.2rem; }
}
@media print { .top, .decor, .trail, .seam, .foot, .ask, .lightbox, .btn-ask { display: none !important; } body { background: #fff; } .sec { padding: 16px 0; background: none; color: #000; } }

/* Тёплый шёлк, растительная вязь и чайная сцена — октябрь 2026. */
.sec:not(.is-deep) { background: radial-gradient(ellipse at 18% 8%, #f2e8cf, #e9ddbd 70%, #ded0aa); }
.sec.is-alt { background: radial-gradient(ellipse at 75% 10%, #f3e7cc, #e5d8b6 75%); }
.decor--light .d-tex,.decor--paper .d-tex { opacity:.34; }
.decor--light .d-light,.decor--paper .d-light { opacity:.6; background:radial-gradient(ellipse at 20% 20%,#fff4d160,transparent 65%); }
.d-gold-wave { position:absolute; inset:-18%; pointer-events:none; opacity:.2; background:linear-gradient(118deg,transparent 25%,#f5db8e00 35%,#f5db8e36 45%,#fff2ba65 49%,#e8ba5a24 54%,transparent 66%); mix-blend-mode:soft-light; }
.decor--light .d-gold-wave,.decor--paper .d-gold-wave { mix-blend-mode:multiply; opacity:.24; }
html[data-motion="on"] .d-gold-wave { animation:goldWave 17s ease-in-out infinite alternate; }
html[data-motion="on"] .d-tex--emerald { animation:textileBreathe 20s ease-in-out infinite alternate; }
@keyframes goldWave { from { transform:translate3d(-19%, -2%,0) rotate(-3deg); opacity:.18; } to { transform:translate3d(19%,3%,0) rotate(3deg); opacity:.48; } }
@keyframes textileBreathe { from { transform:scale(1.025) translate3d(-.5%,0,0); opacity:.34; } to { transform:scale(1.045) translate3d(.5%,.4%,0); opacity:.43; } }
.dl--a { width:clamp(210px,26vw,400px); right:-3%; opacity:.35; }
.dl--b { width:clamp(160px,18vw,270px); left:-3%; opacity:.27; }
.dl--c { width:120px; opacity:.09; }
.decor--light .dl--a,.decor--paper .dl--a { opacity:.34; }
.medal--a,.medal--b,.medal--c { animation:none; transform-origin:50% 80%; }
html[data-motion="on"] .medal--a { animation:vineSway 14s ease-in-out infinite alternate; }
html[data-motion="on"] .medal--b { animation:vineSway 18s ease-in-out infinite alternate-reverse; }
@keyframes vineSway { from { transform:rotate(-4deg) translateY(0); } to { transform:rotate(4deg) translateY(-8px); } }
.seam { height:0; overflow:visible; color:#b99347; }
.seam__vine { position:absolute; width:min(1100px,96%); height:100px; overflow:visible; stroke-width:1.15; filter:drop-shadow(0 2px 3px #16473125); }
.seam--dark { color:#d4b86e; }
.seam__branch { transform-origin:50% 50%; }
html[data-motion="on"] .seam__vine { animation:seamFloat 12s ease-in-out infinite alternate; }
@keyframes seamFloat { from { transform:translateY(-3px) scaleX(.99); opacity:.65; } to { transform:translateY(3px) scaleX(1.01); opacity:.95; } }
.seam:not(.in-view) *,.tab-hidden *,.tab-hidden *::before,.tab-hidden *::after { animation-play-state:paused!important; }
.how { isolation:isolate; min-height:1000px; }
.how__grid { display:grid; grid-template-columns:minmax(0,1fr); gap:28px; }
.how__grid > * { width:min(48%,580px); }
.how__grid .lead { font-size:1.1rem; }
.how__right { gap:18px; }
.how .steps li { background:rgb(4 43 31 / .84); backdrop-filter:blur(7px); }
.how__cert { background:rgb(4 43 31 / .87); }
.how__news { display:flex; flex-wrap:wrap; gap:10px; }
.how__news .btn { font-size:.9rem; background-color:rgb(4 43 31 / .9); }
.tea-stage { position:absolute; inset:0; container-type:size; }
.tea-plane { position:absolute; width:max(100cqw,150cqh); height:max(66.6667cqw,100cqh); right:0; bottom:0; transform-origin:80% 58%; }
.tea-plane > img { width:100%; height:100%; object-fit:fill; }
.tea-veil { position:absolute; inset:0; background:linear-gradient(90deg,#052e22f2 0%,#052e22d9 26%,#052e2290 44%,#052e2200 68%),linear-gradient(0deg,#052e2266,transparent 18%,transparent 85%,#052e2233); }
.tea-steam { position:absolute; left:84.8%; top:36.8%; width:9%; height:20%; transform:translate(-50%,-100%); }
.tea-steam i { position:absolute; width:21%; height:80%; bottom:0; left:30%; border-left:2px solid #fff4d9; border-radius:50%; opacity:.19; filter:blur(3px); transform-origin:50% 100%; }
.tea-steam i:nth-child(2) { left:52%; height:65%; animation-delay:-3s!important; }
.tea-steam i:nth-child(3) { left:43%; height:95%; animation-delay:-6s!important; }
html[data-motion="on"] .tea-steam i { animation:teaSteam 9s ease-in-out infinite; }
@keyframes teaSteam { 0% { transform:translate(0,8px) scale(.8,.55) rotate(-6deg); opacity:0; } 22% { opacity:.34; } 65% { opacity:.2; } 100% { transform:translate(-12px,-46px) scale(1.2,1.14) rotate(11deg); opacity:0; } }
.tea-sun { position:absolute; inset:0; opacity:.4; mix-blend-mode:screen; }
.tea-sun i { position:absolute; inset:0; background:linear-gradient(129deg,transparent 3%,#fff0bd00 9%,#ffe7a868 19%,transparent 29%,#ffe8ac24 32%,transparent 45%); transform-origin:0 0; }
html[data-motion="on"] .tea-sun i { animation:teaLight 12s ease-in-out infinite alternate; }
@keyframes teaLight { from { transform:rotate(-2deg) scaleX(.96); opacity:.6; } to { transform:rotate(2deg) scaleX(1.05); opacity:1; } }
.tea-dust { position:absolute; inset:0; }
.tea-dust i { position:absolute; left:var(--x); top:var(--y); width:2px; height:2px; border-radius:50%; background:#fff1c2; opacity:.35; box-shadow:0 0 4px #ffe9ab; }
html[data-motion="on"] .tea-dust i { animation:teaDust var(--dur) linear var(--delay) infinite; }
@keyframes teaDust { 0% { transform:translate3d(0,0,0); opacity:0; } 20%,70% { opacity:.5; } 100% { transform:translate3d(34px,-72px,0); opacity:0; } }
@media (max-width:1000px) and (min-width:701px) { .how__grid > * { width:55%; } .tea-veil { background:linear-gradient(90deg,#052e22fa,#052e22c9 45%,transparent 85%); } }
@media (max-width:700px) {
 .how { min-height:0; }
 .how__grid > * { width:100%; }
 .how__grid { gap:340px; }
 .tea-stage { top:300px; bottom:auto; height:500px; }
 .tea-plane { right:-15px; }
 .tea-veil { background:linear-gradient(180deg,#052e22 0%,#052e22ed 20%,#052e2222 36%,transparent 47%,#052e22ee 59%,#052e22 75%); }
 .how__grid .lead { font-size:1rem; }
 .how .steps li { backdrop-filter:none; }
 .tea-steam i { border-left-width:2px; filter:blur(2px); }
 .tea-dust i:nth-child(n+9) { display:none; }
 .seam__vine { width:94%; height:70px; stroke-width:1.8; }
 .dl--c { display:none; }
}
html:not([data-motion="on"]) .tea-plane { transform:none!important; }

/* Финальный свет: пар читается над стеклом, края сцены растворяются в ткани. */
.tea-decor > .d-tex--emerald { opacity:.19; }
.tea-steam i { border-left-width:3.5px; filter:blur(2px); mask-image:linear-gradient(transparent,#000 35%,#000 85%,transparent); }
@keyframes teaSteam { 0% { transform:translate(0,5px) scale(.8,.6) rotate(-6deg); opacity:.12; } 30% { opacity:.65; } 70% { opacity:.4; } 100% { transform:translate(-12px,-42px) scale(1.2,1.1) rotate(11deg); opacity:.08; } }
@media(max-width:700px) { .tea-stage { mask-image:linear-gradient(transparent,#000 15%,#000 77%,transparent); } .tea-steam i { border-left-width:3px; filter:blur(1.2px); } }
@media(prefers-reduced-motion:reduce) { html:not(.js-ready) *,html:not(.js-ready) *::before,html:not(.js-ready) *::after { animation:none!important; transition:none!important; } }

/* Статические параметры частиц во внешнем CSS: строгая CSP без inline-style. */
.tea-dust i:nth-child(1) { --x:12%; --y:8%; --delay:-0.0s; --dur:13s; }
.tea-dust i:nth-child(2) { --x:41%; --y:25%; --delay:-1.7s; --dur:14s; }
.tea-dust i:nth-child(3) { --x:70%; --y:42%; --delay:-3.4s; --dur:15s; }
.tea-dust i:nth-child(4) { --x:23%; --y:59%; --delay:-5.1s; --dur:16s; }
.tea-dust i:nth-child(5) { --x:52%; --y:76%; --delay:-6.8s; --dur:17s; }
.tea-dust i:nth-child(6) { --x:81%; --y:24%; --delay:-8.5s; --dur:13s; }
.tea-dust i:nth-child(7) { --x:34%; --y:41%; --delay:-10.2s; --dur:14s; }
.tea-dust i:nth-child(8) { --x:63%; --y:58%; --delay:-11.9s; --dur:15s; }
.tea-dust i:nth-child(9) { --x:16%; --y:75%; --delay:-13.6s; --dur:16s; }
.tea-dust i:nth-child(10) { --x:45%; --y:23%; --delay:-15.3s; --dur:17s; }
.tea-dust i:nth-child(11) { --x:74%; --y:40%; --delay:-17.0s; --dur:13s; }
.tea-dust i:nth-child(12) { --x:27%; --y:57%; --delay:-18.7s; --dur:14s; }
.tea-dust i:nth-child(13) { --x:56%; --y:74%; --delay:-20.4s; --dur:15s; }
.tea-dust i:nth-child(14) { --x:85%; --y:22%; --delay:-22.1s; --dur:16s; }
.tea-dust i:nth-child(15) { --x:38%; --y:39%; --delay:-23.8s; --dur:17s; }
.tea-dust i:nth-child(16) { --x:67%; --y:56%; --delay:-25.5s; --dur:13s; }

/* Запрос: сначала выбор филиала и сообщение, звонок — дополнительное действие. */
.ask__msgs { grid-template-columns:1fr; }
.ask__send-hint { margin:0; color:var(--ink-2); line-height:1.5; }
.ask__msgs .msg-btn { min-height:56px; text-align:left; justify-content:flex-start; }
.ask__msgs .msg-btn span { max-width:27em; }
.ask__status:empty { display:none; }
.ask__continue[hidden] { display:none; }
.ask__call { width:100%; }

.msg-btn--soon { opacity:.7; cursor:default; } .msg-btn--soon span { display:flex; flex-direction:column; gap:4px; } .msg-btn--soon small { font-size:.82rem; font-weight:600; }

/* Store-window reference: emerald interlace and quatrefoil medallions; gold travels inside their contours. */
.sec:not(.is-deep){background:radial-gradient(ellipse at 30% 15%,#f4e7bf,#deca95 78%,#d1bd87)}
.sec.is-alt{background:radial-gradient(ellipse at 75% 18%,#efe0b7,#d8c48f 80%)}
.d-tex,.d-pattern-shine{--weave-size:560px 560px;position:absolute;inset:0;}
.d-tex,.decor--light .d-tex,.decor--paper .d-tex{background:linear-gradient(126deg,#765b20,#b78b37 26%,#5f6442 50%,#bc9140 74%,#806125);mask:url(../img/arabesque-foliage.svg?v=2a6333cbaa) 0 0/var(--weave-size) repeat;-webkit-mask:url(../img/arabesque-foliage.svg?v=2a6333cbaa) 0 0/var(--weave-size) repeat;opacity:.25;filter:none;mix-blend-mode:normal;animation:none!important;}
.d-tex--emerald{background-image:url(../img/facade-window.svg?v=89b432bdb5)!important;background-position:0 0;background-size:var(--weave-size);background-repeat:repeat;mask:none!important;-webkit-mask:none!important;opacity:.42!important;}
.d-pattern-shine{opacity:.40;mask:url(../img/arabesque-foliage.svg?v=2a6333cbaa) 0 0/var(--weave-size) repeat;-webkit-mask:url(../img/arabesque-foliage.svg?v=2a6333cbaa) 0 0/var(--weave-size) repeat;}
.d-pattern-shine i{display:block;position:absolute;inset:-35% -65%;background:repeating-linear-gradient(112deg,transparent 0 17%,#a3650a33 21%,#efba3a 24%,#fff6c2 25.5%,#d39523 27%,transparent 33% 49%);transform:translateX(-14%);}
.is-deep .d-pattern-shine{opacity:.30;mask-image:url(../img/facade-medallions.svg?v=86b90473de);-webkit-mask-image:url(../img/facade-medallions.svg?v=86b90473de);}
.is-deep .d-pattern-shine i{background:repeating-linear-gradient(112deg,transparent 0 17%,#ae7c2333 21%,#d5a448 24%,#ffe8a1 25.5%,#b78324 27%,transparent 33% 49%);}
html[data-motion="on"] .d-pattern-shine i{animation:foliageGold 8s ease-in-out infinite alternate;}
@keyframes foliageGold{from{transform:translate3d(-15%,0,0);opacity:.65}to{transform:translate3d(15%,0,0);opacity:1}}
.d-gold-wave{display:none;}
.d-silk{position:absolute;inset:-30%;background:repeating-linear-gradient(118deg,transparent 0 12%,#001e1660 17%,#70ac6740 22%,#b0c17a15 26%,transparent 32% 45%);opacity:.65;transform:translateX(-4%) rotate(-3deg);}
.decor--light .d-silk,.decor--paper .d-silk{background:repeating-linear-gradient(118deg,transparent 0 12%,#90733317 17%,#fff5cd70 22%,#dfb74b25 26%,transparent 32% 45%);opacity:.8;}
html[data-motion="on"] .d-silk{animation:silkWave 9s ease-in-out infinite alternate;}
@keyframes silkWave{from{transform:translate3d(-5%,-1%,0) rotate(-3deg);opacity:.48}to{transform:translate3d(5%,1%,0) rotate(2deg);opacity:.9}}
.d-light{animation-duration:7s;}
.decor--light .d-light,.decor--paper .d-light{background:radial-gradient(ellipse at 30% 30%,#fff6db50,transparent 63%);opacity:.5;}
/* A continuous 3-layer woven edge, with its own mobile repeat. */
.seam{z-index:3;display:block;}
.seam__weave{position:absolute;left:0;right:0;top:-48px;height:96px;overflow:hidden;}
.seam__layer{position:absolute;inset:0 -320px;mask:url(../img/arabesque-border.svg?v=4b79bd5986) center/320px 96px repeat-x;-webkit-mask:url(../img/arabesque-border.svg?v=4b79bd5986) center/320px 96px repeat-x;}
.seam__layer--back{background:#416a43;opacity:.58;transform:translate(43px,6px) scaleY(.92);}
.seam__layer--front{background:linear-gradient(180deg,#fff2ba 6%,#a77b2b 27%,#f5daa0 45%,#a1782e 69%,#e4c97e 90%);filter:drop-shadow(0 1px 1px #533e20);}
.seam__layer--light{opacity:.8;}
.seam__layer--light i{position:absolute;inset:0 -30%;background:repeating-linear-gradient(105deg,transparent 0 13%,#fff8d8 17%,#f8d16b 19%,transparent 23% 41%);}
html[data-motion="on"] .seam__layer--back{animation:weaveBack 7s ease-in-out infinite alternate;}
html[data-motion="on"] .seam__layer--front{animation:weaveFront 6s ease-in-out infinite alternate;}
html[data-motion="on"] .seam__layer--light{animation:weaveFront 6s ease-in-out infinite alternate;}
html[data-motion="on"] .seam__layer--light i{animation:edgeGold 7s ease-in-out infinite alternate;}
@keyframes weaveBack{from{transform:translate(35px,5px) scaleY(.92);opacity:.45}to{transform:translate(51px,-4px) scaleY(.98);opacity:.7}}
@keyframes weaveFront{from{transform:translate(-5px,-2px)}to{transform:translate(5px,2px)}}
@keyframes edgeGold{from{transform:translateX(-16%);opacity:.65}to{transform:translateX(16%);opacity:1}}
/* The sun enters from the un-veiled upper right, directly across the glass. */
.tea-plane{transform-origin:84.8% 36.8%;}
.tea-sun{transform-origin:95% -5%;opacity:.5;}
.tea-sun i{inset:-12%;transform-origin:90% 0;background:repeating-conic-gradient(from 194deg at 92% -5%,transparent 0deg 8deg,#fff1c05e 10deg,#ffe7a899 12deg,transparent 15deg 25deg);mask-image:radial-gradient(ellipse at 72% 10%,#000 8%,#0009 46%,transparent 72%);}
.tea-sun i:nth-child(2){background:conic-gradient(from 203deg at 98% -2%,transparent 0deg,#ffedb885 10deg,transparent 19deg,#fff4cd55 29deg,transparent 36deg);animation-delay:-3s!important;}
html[data-motion="on"] .tea-sun i{animation:teaLightVisible 6s ease-in-out infinite alternate;}
@keyframes teaLightVisible{from{transform:rotate(-4deg) scaleX(.94);opacity:.42}to{transform:rotate(4deg) scaleX(1.08);opacity:1}}
.tea-steam i{border-left-width:4px;opacity:.5;}
html[data-motion="on"] .tea-steam i{animation:teaSteamVisible 5.5s ease-in-out infinite alternate;}
@keyframes teaSteamVisible{from{transform:scale(.8,.65) skewX(-9deg);opacity:.2}to{transform:scale(1.22,1.2) skewX(10deg);opacity:.78}}
.tea-dust i{width:3px;height:3px;opacity:.65;}
html[data-motion="on"] .tea-dust i{animation-duration:9s;}
@media(max-width:700px){
 .d-tex,.d-pattern-shine{--weave-size:420px 420px;}
 .seam__weave{top:-36px;height:72px;}
 .seam__layer{mask-size:240px 72px;-webkit-mask-size:240px 72px;}
 .tea-steam i{border-left-width:3px;}
 .tea-sun i{mask-image:radial-gradient(ellipse at 78% 22%,#000 10%,#000a 55%,transparent 80%);}
}

/* Round 2: quiet reading islands, fine engraving and curved, anchored vapour. */
.sec:not(.is-deep) .sec-head{position:relative;isolation:isolate;}
.sec:not(.is-deep) .sec-head::before{content:'';position:absolute;z-index:-1;inset:-22px calc(8px - var(--gut));pointer-events:none;background:radial-gradient(ellipse at 35% 52%,#f0e1b9f0 12%,#f0e1b9b0 45%,#f0e1b900 73%);}
.tea-steam i{width:48%;height:100%;left:22%;border:0;border-radius:0;background:linear-gradient(0deg,#fff4d924,#fff4d9 38%,#fff4d9b0 73%,transparent);mask:url(../img/tea-steam.svg) center/100% 100% no-repeat;-webkit-mask:url(../img/tea-steam.svg) center/100% 100% no-repeat;filter:blur(1.7px);}
.tea-steam i:nth-child(2){left:36%;height:82%;}
.tea-steam i:nth-child(3){left:13%;height:115%;}
@media(max-width:700px){.sec:not(.is-deep) .sec-head::before{inset:-18px -12px;}.tea-steam i{filter:blur(1.1px);}}

/* Final optical polish: quiet text, diffuse vapour. */
.hero__text{isolation:isolate;}
.hero__text::before{content:'';position:absolute;z-index:-1;inset:-20px -16px;pointer-events:none;background:radial-gradient(ellipse closest-side at 50% 50%,#073b2bf7 15%,#073b2be0 58%,#073b2b99 76%,transparent 100%);}
.tea-steam{height:16%;width:8%;filter:blur(2.2px);}
@keyframes teaSteamVisible{from{transform:scale(.8,.65) skewX(-9deg);opacity:.16}to{transform:scale(1.22,1.2) skewX(10deg);opacity:.59}}
@media(max-width:700px){.tea-steam{filter:blur(1.2px);}}

html[data-motion="off"] .tea-sun{opacity:.5!important;transform:none!important;}

/* Facade engraving: reading light stays local; the full ornament remains visible around it. */
.hero__text::before{inset:-44px -58px;}
.is-deep .d-silk{opacity:.45;}
@media(max-width:700px){.hero__text::before{inset:-24px -34px;background:radial-gradient(ellipse closest-side at 50% 50%,#073b2bfa 20%,#073b2bea 62%,#073b2ba0 79%,transparent 100%);}}

/* A photo tile keeps its light title on hover and keyboard focus. */
.ctile:hover,.ctile:focus-visible{color:var(--cream);}
/* Contact details use the same engraving at a quieter depth. */
.foot .d-tex--emerald{opacity:.22!important;}
.foot .d-pattern-shine{opacity:.13;}
.foot .d-silk{opacity:.2;}

/* Compact horizontal cards keep long product words whole on narrow phones. */
@media (min-width:381px) and (max-width:430px){.pgrid{grid-template-columns:minmax(0,1fr);gap:12px}.pcard{flex-direction:row}.pcard__media{width:118px;flex:none;aspect-ratio:auto;min-height:150px}.pcard__body{padding:11px 12px 12px}}