/* Стиль Elmonte: «травертин и бордо».
   Палитра взята с фотографий кампании (камень, бордовая кожа, олива, латунь пряжек);
   значения лежат в tokens.css, здесь — только оформление компонентов. */

/* Типографика: заголовки плотнее и крупнее, подписи — курсивом, без капса и разрядки */
h1,h2{letter-spacing:-.018em;line-height:1.04}
h1{font-size:clamp(var(--text-3xl),6.4vw,72px)}
h2{font-size:clamp(var(--text-2xl),4.2vw,var(--text-4xl))}
h3{font-family:var(--font-editorial)}
.eyebrow{font-family:var(--font-editorial);font-style:italic;font-size:var(--text-md);letter-spacing:.01em;text-transform:none;color:var(--oxblood)}
.chip{text-transform:none;letter-spacing:.01em;font-size:var(--text-sm)}
.chip.active{text-decoration:none;background:var(--ink);color:var(--surface)}

/* Верхняя полоса и кнопки */
.announcement{background:var(--oxblood);letter-spacing:.01em}
.button{background:var(--oxblood);border-color:var(--oxblood);letter-spacing:.02em}
.button.secondary{background:transparent;color:var(--oxblood);border-color:var(--oxblood)}

/* Главная: подложка под текстом баннера и каталог */
.hero.hero-banner{background:var(--stone)}
.hero-copy p,.hero-content p{color:var(--ink)}
.catalog-toolbar{background:#fff}
.product-image{background:var(--stone)}
.card-name{font-family:var(--font-editorial);font-size:var(--text-lg);letter-spacing:-.005em}
.prices{font-family:var(--font-editorial);font-size:var(--text-md)}
.old-price{color:var(--muted)}
.swatch.active{outline:2px solid var(--oxblood);outline-offset:-4px}
.counter{background:var(--leather)}

/* Редакторский блок: широкая бордовая полоса — главный цветовой акцент страницы */
.section:has(.editorial){background:var(--oxblood);padding-block:0}
.editorial{background:transparent;color:#F5EDE2;width:100%;max-width:none;margin:0;grid-template-columns:1fr}
.editorial-art{min-height:320px;background:url("../images/hero/editorial.jpg") 50% 50%/cover no-repeat}
.editorial-art:after{display:none}
.editorial-copy .eyebrow{color:var(--leather-light)}
.editorial-copy p{color:#E8DACB;max-width:46ch}
.editorial-copy .button,.editorial-copy .button.secondary{background:var(--stone);border-color:var(--stone);color:var(--oxblood)}
@media(min-width:768px){.editorial{grid-template-columns:1.1fr .9fr}.editorial-art{min-height:520px}.editorial-copy{padding:var(--space-16) var(--gutter) var(--space-16) var(--space-12)}}

/* Подписка и подвал */
.newsletter{background:var(--stone)}
.newsletter .eyebrow{color:var(--oxblood)}
.site-footer{background:var(--ink)}
.footer-col h3{color:var(--leather-light);font-style:italic}

/* Корзина и оформление заказа */
.checkout-summary{background:var(--stone);border-color:transparent}
.checkout-total.grand{border-top-color:var(--brass)}
.progress span{background:var(--oxblood)}

/* Выбранный размер и переключатели */
.size-list button.active,.stock-toggle input{background:var(--oxblood);border-color:var(--oxblood)}
@media(max-width:767px){.editorial-art{min-height:300px}}

/* ===== Размеры и области нажатия =====
   Правила: интерактивные цели не меньше 44×44 px (визуально компактные — за счёт невидимой области),
   текст не мельче 12 px, на планшете фильтры переносятся, а не прокручиваются вбок. */
:root{--promo-height:40px}
.promo-strip,.announcement{font-size:var(--text-xs)}
.counter{min-width:20px;height:20px;font-size:var(--text-xs);line-height:1}

/* Логотип и основное меню */
.brand{min-height:44px;min-width:44px}
.main-nav a{display:inline-flex;align-items:center;min-height:44px}

/* Фильтры каталога: компактный вид, но область нажатия 44 px */
.chip{position:relative}
.chip::after{content:'';position:absolute;inset:-5px -6px}
@media(max-width:1099px){
 .filters{flex-wrap:wrap;overflow:visible}
 .filter-chips{display:flex;flex-wrap:wrap;gap:0 var(--space-6)}
 .filter-controls{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2) var(--space-6)}
}
@media(max-width:767px){
 .filter-controls .select{min-height:44px}
 .stock-toggle{min-height:44px}
}

/* Страница товара, карточки, подвал */
.breadcrumb a{display:inline-block;padding-block:12px}
.accordion summary{min-height:44px;display:flex;align-items:center;justify-content:space-between}
.card-name{display:inline-block;padding-block:var(--space-2)}
.footer-col a{display:inline-flex;align-items:center;min-height:44px}
.footer-col{gap:0}
.checkout-consent a{display:inline-block;padding-block:12px}
.select-wrap,.select{min-height:44px}
.chip{min-width:44px}
.stock-toggle{min-height:44px}
.site-footer a[href^="http"]{display:inline-flex;align-items:center;min-height:44px}
.section-heading a{display:inline-flex;align-items:center;min-height:44px}

/* ===== Ненавязчивые переходы (нативный View Transitions API) =====
   Страница плавно сменяется за 200 мс, шапка стоит на месте, фото товара «вырастает» из карточки,
   сетка каталога мягко перемешивается при смене фильтра. Без поддержки браузера или при
   настройке «уменьшить движение» (или выключенном переключателе «Анимации» в подвале) переходов нет. */
html.motion::view-transition-old(root),html.motion::view-transition-new(root){animation-duration:200ms;animation-timing-function:var(--ease)}
html.motion .site-header{view-transition-name:site-header}
html.motion .promo-strip{view-transition-name:promo-strip}
::view-transition-group(site-header),::view-transition-group(promo-strip){animation-duration:0s}
/* Панель фильтров закреплена и должна оставаться поверх анимируемых слоёв: отдельное имя, без собственной анимации */
@media(min-width:768px){html.motion .catalog-toolbar{view-transition-name:catalog-toolbar}}
@media(max-width:767px){html.motion .filter-chips{view-transition-name:catalog-toolbar}}
::view-transition-group(catalog-toolbar){animation-duration:0s}
::view-transition-old(catalog-toolbar){animation-duration:120ms}
::view-transition-new(catalog-toolbar){animation-duration:150ms}
::view-transition-group(catalog-grid){animation-duration:240ms;animation-timing-function:var(--ease)}
html.motion .gallery-main{view-transition-name:product-hero}
::view-transition-group(product-hero){animation-duration:340ms;animation-timing-function:var(--ease)}
::view-transition-old(product-hero),::view-transition-new(product-hero){height:100%;object-fit:cover}
.motion-toggle{border:0;background:none;color:inherit;text-decoration:underline;text-underline-offset:3px;padding:0 var(--space-2);min-height:44px;font-size:var(--text-xs);cursor:pointer}
.footer-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--space-2)}

/* ===== Полировка: типографика, ритм, детали ===== */
::selection{background:var(--oxblood);color:#fff}
h1,h2,h3{text-wrap:balance}
p,.card-name{text-wrap:pretty}
a,button{transition:color var(--fast) var(--ease),background-color var(--fast) var(--ease),border-color var(--fast) var(--ease)}

/* Шапка: спокойные состояния наведения */

/* Шапка каталога: описание не прижато к краю, выровнено по низу заголовка */
.section-heading{align-items:flex-end}
.section-heading p{max-width:36ch;font-size:var(--text-sm);line-height:1.6}

/* Карточки */
.card-name{transition:color var(--fast) var(--ease)}
.card-meta{font-size:var(--text-xs);letter-spacing:.01em}
.prices .old-price{font-size:var(--text-sm)}

/* Преимущества: серифные заголовки, латунная линия */
.benefit{border-top-color:var(--leather-light)}
.benefit strong{font-family:var(--font-editorial);font-size:var(--text-lg);letter-spacing:-.005em}

/* Страница товара */
.breadcrumb{font-family:var(--font-ui);font-style:normal;font-size:var(--text-sm);color:var(--muted);letter-spacing:0}
.detail-info h1{font-size:clamp(32px,3.2vw,46px);letter-spacing:-.02em;margin-block:var(--space-2) var(--space-3)}
.detail-price{font-family:var(--font-editorial);font-size:var(--text-xl);margin-bottom:var(--space-6)}
.detail-price .old-price{font-size:var(--text-md);margin-left:var(--space-2)}
.option-label{font-size:var(--text-sm);color:var(--muted);margin-block:var(--space-6) var(--space-3)}
.thumb.active{border-color:var(--oxblood);outline:1px solid var(--oxblood)}
.accordion summary{font-family:var(--font-editorial);font-size:var(--text-lg)}
.accordion p{color:var(--muted);line-height:1.65;max-width:56ch}

/* Instagram и подвал */
.insta-tile{transition:opacity var(--standard) var(--ease)}
.footer-col a{min-height:40px}
@media(min-width:768px){
 .footer-col.is-collection{grid-template-columns:1fr 1fr;column-gap:var(--space-6)}
 .footer-col.is-collection h3{grid-column:1/-1}
}

/* Корзина */
.drawer-head h2{font-size:var(--text-2xl);letter-spacing:-.015em}
.drawer-close{border:0;background:transparent;width:44px;height:44px;font-size:28px;line-height:1;color:var(--ink)}
.cart-item a{font-family:var(--font-editorial);font-size:var(--text-md)}
.cart-item .muted{font-size:var(--text-sm)}
.drawer-foot{display:grid;gap:var(--space-2)}
.drawer-foot .button,.drawer-foot .cart-subtotal{margin-top:0}
.drawer-body>p:first-child{font-size:var(--text-sm);color:var(--muted)}

/* Оформление: колонка читаемой ширины, поля не растягиваются на весь экран */
.checkout{max-width:1120px}
.checkout-form{max-width:640px}
.checkout-field label{font-size:var(--text-sm)}
@media(min-width:1100px){.checkout-grid{grid-template-columns:minmax(0,1fr) 380px;column-gap:var(--space-16)}}

/* Квадратные снимки в рамке 4:5: боковые поля — размытое продолжение самого фото, без полос другого оттенка */
.product-gallery .product-media.is-square{position:relative;overflow:hidden;background:var(--stone)}
.product-gallery .product-media.is-square::before{content:'';position:absolute;inset:-10%;background:var(--bg) center/cover no-repeat;filter:blur(26px) saturate(.9);opacity:.95}
.product-gallery .product-media.is-square img{position:relative;z-index:1;background:transparent}

/* Телефон: заголовок раздела и описание друг под другом, а не в две узкие колонки */
@media(max-width:767px){
 .section-heading{flex-direction:column;align-items:flex-start;gap:var(--space-3)}
 .section-heading p{max-width:none}
}

/* Уведомление: в одну строку и над нижней панелью «Добавить» (на телефоне раньше переносилось и перекрывало её) */
.toast{width:max-content;max-width:calc(100vw - var(--gutter)*2);text-align:center;font-size:var(--text-sm)}
body:has(.mobile-sticky.visible) .toast{bottom:calc(var(--space-6) + 64px)}

/* Наведение только для устройств с мышью: на телефоне после касания оно «залипало» (цвет оставался) */
@media(hover:hover){
 .chip:hover{color:var(--oxblood)}
 .button:hover{background:var(--ink);border-color:var(--ink)}
 .button.secondary:hover{background:var(--oxblood);color:var(--surface)}
 .editorial-copy .button:hover{background:var(--surface);border-color:var(--surface)}
 .site-footer a:hover{color:var(--leather-light)}
 .size-list button:hover:not(:disabled){border-color:var(--oxblood)}
 .main-nav a:hover{color:var(--oxblood)}
 .icon-button:hover{color:var(--oxblood)}
 .product-card:hover .card-name{color:var(--oxblood)}
 .breadcrumb a:hover{color:var(--oxblood)}
 .accordion summary:hover{color:var(--oxblood)}
 .insta-grid:hover .insta-tile:not(:hover){opacity:.82}
 .drawer-close:hover{color:var(--oxblood)}
}

/* Сенсорные экраны: состояние :hover после касания не должно «залипать» */
@media(hover:none){
 .button:hover{background:var(--oxblood);border-color:var(--oxblood);color:var(--surface)}
 .button.secondary:hover{background:transparent;color:var(--oxblood)}
 .editorial-copy .button:hover,.editorial-copy .button.secondary:hover{background:var(--stone);border-color:var(--stone);color:var(--oxblood)}
 .chip:hover:not(.active){color:var(--ink)}
 .icon-button:hover,.main-nav a:hover{color:inherit}
}

/* Телефон: закреплены только категории (две строки, ~76 px); строка «Размер / В наличии / сортировка» уходит при прокрутке */
@media(max-width:767px){
 .catalog-toolbar,.catalog-toolbar .filters{display:contents}
 .filter-chips,.filter-controls{width:min(100% - var(--gutter)*2,var(--container));margin-inline:auto}
 .filter-chips{position:sticky;top:64px;z-index:10;background:var(--paper);width:100vw;margin-inline:calc(50% - 50vw);padding:var(--space-1) var(--gutter)}
 .filter-controls{margin-top:0;padding-block:var(--space-2)}
}
/* Узкие телефоны (320 px): категории остаются в две строки за счёт меньшего шага */
@media(max-width:374px){.filter-chips{gap:0 var(--space-4)}}

/* ===== Доводка: пустые экраны, подвал, мелочи ===== */
/* Подвал прижат к низу и на коротких страницах (404, пустое оформление) */
#app{display:flex;flex-direction:column;min-height:100svh}
#app>main{flex:1 0 auto}

/* Пустые состояния и 404: заголовок, пояснение и действие не слипаются */
.empty-state>*+*,.not-found>*+*,.checkout-done>*+*{margin-top:var(--space-3)}
.empty-state>.button,.not-found>.button,.checkout-done>.button{margin-top:var(--space-6)}
.empty-state h3{font-size:var(--text-xl);color:var(--ink)}
.empty-state p,.not-found p{margin-inline:auto;max-width:44ch}
.not-found h1{font-size:clamp(var(--text-3xl),5vw,56px)}
.cart-empty{padding-block:var(--space-12)}

/* Подвал: логотип и переключатель анимаций по левому краю колонки */
.footer-col .brand{justify-self:start}
.motion-toggle{padding-inline:0}

/* Корзина: название товара нажимается пальцем, а не только мышью */
.cart-item a{display:inline-block;padding-block:13px;margin-block:-13px}

/* Мобильное меню отделено от страницы под ним */
.mobile-nav{box-shadow:0 24px 32px -24px rgb(31 21 18 / .35)} /* taste-skill-ignore: открытое меню поверх страницы */

/* ===== Направление «каталог образцов» =====
   Идея: в съёмке Elmonte каждая вещь стоит на своём травертиновом камне. На сайте этот камень становится полем-постаментом:
   каждая модель стоит отдельно на ровном поле одного из четырёх оттенков камня. Линии и тени заменены сменой тона.
   Живая деталь — выбор размера: каталог сразу показывает, что есть в наличии в этом размере. */
.site-header{background:var(--paper);border:0}
.catalog-toolbar{border:0;background:var(--paper)}
.chip{border:0;border-radius:0;background:transparent}
.chip.active{background:var(--ink);color:var(--surface)}
.product-count{font-family:var(--font-editorial);font-style:italic;font-size:var(--text-md);color:var(--muted)}

/* Первый экран: название и действие, без подписи над заголовком */
.hero.hero-banner .hero-copy{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}
.hero-copy h1{font-size:clamp(40px,6vw,88px);letter-spacing:-.03em;line-height:.98}
.hero-side{display:grid;gap:var(--space-6);justify-items:start}
.hero-side p{font-size:var(--text-lg);line-height:1.5;color:var(--ink);max-width:40ch}

/* Каталог: заголовок называет раздел, выбор размера — кнопками */
.catalog-section .section-heading h2{font-size:clamp(40px,4.4vw,64px);letter-spacing:-.025em}
.catalog-section .section-heading p{font-size:var(--text-md);color:var(--ink);max-width:44ch}
.size-picker{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3) var(--space-6);margin-bottom:var(--space-6)}
.size-picker-label{font-family:var(--font-editorial);font-size:var(--text-xl)}
.size-row{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.size-pick{min-width:48px;height:48px;padding:0 var(--space-3);border:0;border-radius:0;background:var(--stone);color:var(--ink);font-size:var(--text-md);font-variant-numeric:tabular-nums;cursor:pointer;transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease),transform var(--fast) var(--ease)}
.size-pick.active{background:var(--ink);color:var(--surface)}
.size-pick:disabled{background:var(--paper);color:var(--muted);text-decoration:line-through;cursor:not-allowed}
@media(hover:hover){.size-pick:hover:not(:disabled):not(.active){background:var(--field-2)}}

/* Карточка-образец: фото стоит на поле, как вещь на камне; под полем название и одно уточнение */
.product-card{display:flex;flex-direction:column}
#product-grid .product-image,.related-grid .product-image{background:var(--field-1)}
#product-grid .product-card:nth-child(4n+2) .product-image,.related-grid .product-card:nth-child(4n+2) .product-image{background:var(--field-2)}
#product-grid .product-card:nth-child(4n+3) .product-image,.related-grid .product-card:nth-child(4n+3) .product-image{background:var(--field-3)}
#product-grid .product-card:nth-child(4n) .product-image,.related-grid .product-card:nth-child(4n) .product-image{background:var(--field-4)}
#product-grid .product-image .effect-stage,.related-grid .product-image .effect-stage{inset:7% 9% 15%}
.card-meta{font-size:var(--text-xs);color:var(--muted)}
/* Каждая седьмая модель — образец двойного размера (когда в сетке больше четырёх моделей) */
#product-grid{grid-auto-flow:row dense}
#product-grid:has(>.product-card:nth-child(5))>.product-card:nth-child(7n+1){grid-column:span 2;grid-row:span 2}
#product-grid:has(>.product-card:nth-child(5))>.product-card:nth-child(7n+1) .product-image{aspect-ratio:auto;flex:1 1 auto;min-height:320px}
#product-grid:has(>.product-card:nth-child(5))>.product-card:nth-child(7n+1) .effect-stage{inset:8% 18% 14%}
#product-grid:has(>.product-card:nth-child(5))>.product-card:nth-child(7n+1) .card-name{font-size:var(--text-xl)}

/* Съёмка: бордовое поле, слева заголовок и заметки, справа лента кадров одной высоты, первый кадр поднят */
.showcase{background:var(--oxblood);color:#F5EDE2;overflow:hidden}
.showcase-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--space-6);align-items:stretch}
.showcase-side{grid-column:1/4;display:flex;flex-direction:column;align-items:flex-start;gap:var(--space-4)}
.showcase-side h2{font-size:clamp(28px,2.4vw,36px);letter-spacing:-.015em;color:#F5EDE2}
.showcase-note{font-size:var(--text-md);line-height:1.55;color:#E8DACB;max-width:26ch}
.showcase-side .showcase-note:first-of-type{margin-top:auto}
.text-link{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px;background:none;border:0;padding:0;font:inherit;cursor:pointer}
.showcase .text-link{color:var(--leather-light)}
.frame-run{grid-column:4/-1;display:flex;align-items:flex-end;gap:6px;margin-right:calc(var(--gutter) * -1);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding-bottom:var(--space-2)}
.frame-run::-webkit-scrollbar{display:none}
.frame{margin:0;flex:0 0 auto;scroll-snap-align:start}
.frame img{display:block;height:max(220px,30vh);width:auto;max-width:none}
.frame figcaption{display:flex;justify-content:space-between;gap:var(--space-4);margin-top:var(--space-2);font-size:var(--text-xs);color:#E8DACB}
.frame a{display:block}
.frame.is-lifted .frame-fade{position:relative}
.frame.is-lifted img{height:min(66vh,640px)}
.frame-fade img+img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
html.motion .frame-fade.is-cycling img+img{animation:frame-cycle 14s var(--ease) infinite}
@keyframes frame-cycle{0%,40%{opacity:0}50%,90%{opacity:1}100%{opacity:0}}

/* Условия: лист прейскуранта с зубчатыми краями на поле камня, рядом образец со скидкой */
.terms{background:var(--stone)}
.terms-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--space-6);align-items:center}
.terms-sheet{grid-column:2/8;background:var(--surface);padding:var(--space-16) var(--space-12);clip-path:polygon(0.000% 10px,2.778% 0px,5.556% 10px,8.333% 0px,11.111% 10px,13.889% 0px,16.667% 10px,19.444% 0px,22.222% 10px,25.000% 0px,27.778% 10px,30.556% 0px,33.333% 10px,36.111% 0px,38.889% 10px,41.667% 0px,44.444% 10px,47.222% 0px,50.000% 10px,52.778% 0px,55.556% 10px,58.333% 0px,61.111% 10px,63.889% 0px,66.667% 10px,69.444% 0px,72.222% 10px,75.000% 0px,77.778% 10px,80.556% 0px,83.333% 10px,86.111% 0px,88.889% 10px,91.667% 0px,94.444% 10px,97.222% 0px,100.000% 10px,100.000% calc(100% - 10px),97.222% calc(100% - 0px),94.444% calc(100% - 10px),91.667% calc(100% - 0px),88.889% calc(100% - 10px),86.111% calc(100% - 0px),83.333% calc(100% - 10px),80.556% calc(100% - 0px),77.778% calc(100% - 10px),75.000% calc(100% - 0px),72.222% calc(100% - 10px),69.444% calc(100% - 0px),66.667% calc(100% - 10px),63.889% calc(100% - 0px),61.111% calc(100% - 10px),58.333% calc(100% - 0px),55.556% calc(100% - 10px),52.778% calc(100% - 0px),50.000% calc(100% - 10px),47.222% calc(100% - 0px),44.444% calc(100% - 10px),41.667% calc(100% - 0px),38.889% calc(100% - 10px),36.111% calc(100% - 0px),33.333% calc(100% - 10px),30.556% calc(100% - 0px),27.778% calc(100% - 10px),25.000% calc(100% - 0px),22.222% calc(100% - 10px),19.444% calc(100% - 0px),16.667% calc(100% - 10px),13.889% calc(100% - 0px),11.111% calc(100% - 10px),8.333% calc(100% - 0px),5.556% calc(100% - 10px),2.778% calc(100% - 0px),0.000% calc(100% - 10px))}
.terms-sheet h2{text-align:center;font-size:clamp(32px,3.2vw,44px);margin-bottom:var(--space-8)}
.terms-table{width:100%;border-collapse:collapse}
.terms-table th,.terms-table td{padding:0;text-align:left;font-weight:400;vertical-align:top}
.term-group th{font-family:var(--font-ui);font-weight:700;font-size:var(--text-lg);padding-top:var(--space-12);padding-bottom:var(--space-3)}
.term-group:first-child th{padding-top:0}
.terms-table tr:not(.term-group) th,.terms-table tr:not(.term-group) td{padding-bottom:var(--space-4)}
.term-name{display:block;font-family:var(--font-editorial);font-size:var(--text-xl);line-height:1.3;white-space:nowrap}
.term-note{display:block;margin-top:var(--space-1);font-size:var(--text-md);line-height:1.45;color:var(--muted);max-width:34ch;white-space:normal}
.term-dots{width:100%}
.term-dots::after{content:'';display:block;height:1.05em;margin-inline:var(--space-2);border-bottom:4px dotted var(--leather-light);font-size:var(--text-xl)}
.term-value{font-family:var(--font-editorial);font-size:var(--text-xl);line-height:1.3;white-space:nowrap;text-align:right!important}
.terms-sheet .text-link{margin-top:var(--space-6);color:var(--oxblood)}
.terms-art{grid-column:9/-1;display:block;color:var(--ink)}
.terms-plinth{position:relative;display:block;aspect-ratio:4/5;background:var(--field-2)}
.terms-plinth .product-media{position:absolute;inset:9% 11% 16%;width:auto;height:auto}
.terms-plinth .product-media img{width:100%;height:100%;object-fit:cover}
.terms-caption{display:flex;justify-content:space-between;margin-top:var(--space-3);font-family:var(--font-editorial);font-size:var(--text-lg)}

/* Instagram: снимки собраны вокруг заголовка, единственная пауза на странице */
.insta-band{padding-block:var(--space-16)}
.insta-stage{position:relative;min-height:min(100svh,820px);display:grid;place-items:center}
.insta-copy{position:relative;z-index:1;text-align:center;max-width:24ch;display:grid;justify-items:center;gap:var(--space-3)}
.insta-copy h2{font-size:clamp(32px,2.8vw,42px)}
.insta-copy p{font-size:var(--text-md);color:var(--ink)}
.insta-copy .text-link{color:var(--oxblood)}
.insta-print{position:absolute;width:clamp(150px,13vw,190px);aspect-ratio:9/10;overflow:hidden;background:var(--stone);will-change:transform}
.insta-print .insta-photo,.insta-print img{width:100%;height:100%;object-fit:cover;display:block}
.print-1{left:20%;top:6%}.print-2{left:43%;top:0}.print-3{right:19%;top:12%}
.print-4{left:15%;top:56%}.print-5{left:47%;bottom:2%}.print-6{right:15%;top:60%}

/* Подвал: марка Elmonte сложена из камней разной высоты */
.site-footer{padding-top:var(--space-16)}
.footer-mark{display:flex;align-items:flex-end;gap:4px;height:clamp(180px,34svh,340px);margin-bottom:var(--space-16)}
.mark-block{flex:1 1 0;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;color:var(--ink);font-family:var(--font-editorial);font-size:clamp(44px,10.5vw,160px);line-height:.78;padding-bottom:.1em}
.mb-1{height:100%;background:var(--oxblood)}.mb-2{height:70%;background:var(--olive)}.mb-3{height:86%;background:var(--leather)}
.mb-4{height:62%;background:var(--stone)}.mb-5{height:92%;background:var(--brass)}.mb-6{height:74%;background:var(--field-4)}.mb-7{height:82%;background:var(--oxblood)}
.footer-about{color:#E8DACB;font-size:var(--text-md);max-width:26ch}
.footer-bottom{margin-top:var(--space-12);color:#C9C1B7}

/* Движение: части каждой секции появляются по очереди, первый экран один раз при загрузке, отклик на нажатие */
.section.reveal{opacity:1;transform:none}
html.motion .rise{transition:opacity 640ms var(--ease),transform 640ms var(--ease);transition-delay:calc(var(--i,0) * 80ms)}
html.motion .reveal:not(.visible) .rise{opacity:0;transform:translateY(24px)}
html.motion:not(.booted) .hero .rise{animation:rise-in 720ms var(--ease) both;animation-delay:calc(var(--i,0) * 90ms + 120ms)}
html.motion:not(.booted) .hero-banner-art img{animation:settle 2600ms var(--ease) both}
@keyframes rise-in{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes settle{from{transform:scale(1.06)}to{transform:none}}
.button:active,.size-pick:active:not(:disabled),.chip:active{transform:scale(.97)}
.button{transition:background-color var(--fast) var(--ease),border-color var(--fast) var(--ease),color var(--fast) var(--ease),transform var(--fast) var(--ease)}

@media(max-width:1099px){
 .terms-sheet{grid-column:1/8}
 .terms-art{grid-column:8/-1}
}
@media(max-width:767px){
 .hero.hero-banner .hero-copy{grid-template-columns:1fr;row-gap:var(--space-4)}
 .size-picker{gap:var(--space-3)}
 .size-pick{min-width:44px;height:44px}
 .showcase-grid{display:block}
 .showcase-side{margin-bottom:var(--space-8)}
 .showcase-side .showcase-note:first-of-type{margin-top:var(--space-4)}
 .frame-run{flex-wrap:nowrap;margin-right:calc(var(--gutter) * -1)}
 .frame.is-lifted{flex-basis:calc(100vw - var(--gutter) * 2)}
 .frame.is-lifted img{width:100%;height:auto}
 .frame img{height:max(150px,40vw)}
 .terms-grid{display:block}
 .terms-sheet{padding:var(--space-12) var(--space-6);margin-inline:calc(var(--gutter) * -1 + 12px)}
 .term-name,.term-value{font-size:var(--text-lg)}
 .terms-art{display:block;margin-top:var(--space-12)}
 .insta-stage{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--space-3);min-height:0;place-items:stretch}
 .insta-print{position:static;width:auto}
 .print-1{grid-column:1/3;grid-row:1}.print-2{grid-column:4/6;grid-row:1;margin-top:var(--space-8)}
 .insta-copy{grid-column:1/-1;grid-row:2;justify-self:center;padding-block:var(--space-8)}
 .print-3{grid-column:1/3;grid-row:3;margin-top:var(--space-6)}.print-4{grid-column:3/5;grid-row:3}.print-5{grid-column:5/7;grid-row:3;margin-top:var(--space-8)}
 .print-6{display:none}
 .footer-mark{height:clamp(120px,22svh,200px);margin-bottom:var(--space-12)}
}

/* ===== Круг 2: правки по снимкам ===== */
/* Название магазина на первом экране: баннер ниже, текст ближе */
@media(min-width:768px){.hero-banner-art{aspect-ratio:auto;height:min(54svh,600px);max-height:none}.hero-banner-art img{object-position:50% 45%}}
.hero.hero-banner .hero-content{padding-block:var(--space-8) var(--space-12)}
/* Заголовки разделов одного размера */
.catalog-section .section-heading h2,.showcase-side h2,.terms-sheet h2,.insta-copy h2{font-size:clamp(32px,3.2vw,44px);letter-spacing:-.02em}
/* Выбор размера: подпись — обычный текст интерфейса */
.size-picker-label{font-family:var(--font-ui);font-size:var(--text-md)}
/* Двойной образец: на две колонки, вещь в своих пропорциях стоит посреди широкого камня */
#product-grid:has(>.product-card:nth-child(5))>.product-card:nth-child(7n+1){grid-row:auto}
#product-grid:has(>.product-card:nth-child(5))>.product-card:nth-child(7n+1) .product-image{aspect-ratio:8/5;flex:none;min-height:0}
#product-grid:has(>.product-card:nth-child(5))>.product-card:nth-child(7n+1) .effect-stage{inset:7% 31% 15%}
/* Нарисованные заглушки стоят прямо на камне, без светлой подложки */
.product-image .effect-stage svg>rect,.terms-plinth svg>rect{fill:transparent}
/* Съёмка: слева четыре колонки, кадры помещаются в сетку, подписи не слипаются */
.showcase-side{grid-column:1/5}
.frame-run{grid-column:5/-1;gap:var(--space-4);margin-right:0}
.frame img{height:max(200px,24vh)}
.frame.is-lifted img{height:min(52vh,520px)}
@media(max-width:1099px){
 .showcase-grid{display:block}
 .showcase-side{margin-bottom:var(--space-8)}
 .showcase-side .showcase-note:first-of-type{margin-top:var(--space-4)}
}
/* Условия: пояснение под строкой во всю ширину листа */
.terms-table tr.term-row th,.terms-table tr.term-row td{padding-bottom:var(--space-4)}
.terms-table tr.term-row.has-note th,.terms-table tr.term-row.has-note td{padding-bottom:var(--space-1)}
.term-note-row td{padding-bottom:var(--space-4)!important;font-size:var(--text-md);line-height:1.45;color:var(--muted)}
/* Подвал: камни светлых и средних тонов, буквы читаются */
.mb-1{background:var(--stone)}.mb-2{background:var(--field-3)}.mb-3{background:var(--leather-light)}
.mb-4{background:var(--field-4)}.mb-5{background:var(--brass)}.mb-6{background:var(--field-2)}.mb-7{background:var(--stone)}
/* Скрытое уведомление не лежит невидимым тёмным прямоугольником поверх страницы */
.toast{visibility:hidden;transition:opacity var(--standard) var(--ease),transform var(--standard) var(--ease),visibility 0s linear var(--standard)}
.toast.show{visibility:visible;transition-delay:0s}
/* Круг 3: первый экран выровнен по низу, заголовок в полную силу; лента съёмки помещается в сетку */
.hero.hero-banner .hero-copy{align-items:end}
.hero.hero-banner .hero-copy h1{font-size:clamp(40px,6vw,88px);letter-spacing:-.03em;line-height:.98}
.hero-side{align-content:end}
.frame-run{gap:var(--space-3)}
/* Категории: заливка выбранной с ровными отступами со всех сторон; промежуток между кнопками меньше, ряд той же ширины */
.chip{display:inline-flex;align-items:center;justify-content:center;min-height:0;padding:10px;line-height:1.2}
.filter-chips{gap:var(--space-1)}
@media(max-width:1099px){.filter-chips{gap:var(--space-1)}}
@media(max-width:374px){.filter-chips{gap:2px}.chip{padding-inline:var(--space-2)}}

/* ===== Внутренние страницы на языке «каталога образцов» =====
   Фото стоит на камне, как в карточках; кнопки залиты тоном камня вместо рамок; панели корзины отделены тоном, а не линией. */
/* Страница товара: большое фото и миниатюры на поле камня, без размытых полос у квадратных снимков */
.gallery-main{background:var(--field-1)}
.gallery-main .effect-stage{inset:6% 9% 9%}
.product-gallery .product-media.is-square{background:transparent}
.product-gallery .product-media.is-square::before{display:none}
.thumb{background:var(--field-1);border:0;padding:5px}
.thumb.active{border:0;outline:2px solid var(--oxblood);outline-offset:-2px}
/* Размеры: та же заливка, что у «Ваш размер» в каталоге */
.size-list button{border:0;background:var(--stone);color:var(--ink);font-variant-numeric:tabular-nums;transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease)}
.size-list button.active{background:var(--ink);color:var(--surface)}
.size-list button:disabled{background:var(--paper);color:var(--muted)}
@media(hover:hover){.size-list button:hover:not(:disabled):not(.active){background:var(--field-2);border:0}}
/* Быстрый просмотр: снимок на камне */
.quick-view-art{position:relative;background:var(--field-1)}
.quick-view-art>.product-media,.quick-view-art>svg{position:absolute;inset:7% 10% 12%;width:auto;height:auto;min-height:0}
/* Корзина: шапка и итог на тоне бумаги, миниатюры на камне, количество — залитыми кнопками */
.drawer-head{border-bottom:0;background:var(--paper)}
.drawer-foot{border-top:0;background:var(--paper)}
.cart-item{border-bottom-color:var(--stone)}
.cart-item>.product-media,.cart-item>svg{background:var(--field-1);padding:6px}
.qty button{border:0;background:var(--stone)}
@media(hover:hover){.qty button:hover:not(:disabled){background:var(--field-2)}}
.cart-item .text-button{font-size:var(--text-lg);color:var(--muted)}
@media(hover:hover){.cart-item .text-button:hover{color:var(--oxblood)}}
/* Оформление: миниатюра на камне, переключатели в цвете бренда */
.checkout-thumb{background:var(--field-1);padding:4px}
input[type=radio],input[type=checkbox]{accent-color:var(--oxblood)}
/* Копия витрины без сервера: вместо формы заказа — способы связаться */
.checkout-static-list{padding-left:1.2em}
.checkout-static-list li+li{margin-top:var(--space-1)}
.checkout-done>.checkout-static-ways{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4);margin-top:var(--space-6)}
