@import url("https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz,wght@6..96,400;6..96,500;6..96,600;6..96,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Libre+Caslon+Display&display=swap");
@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:wght@500;700&family=Inter:wght@400;500;600&display=swap");
:root{
  --bg:#ffffff;
  --fg:#0a0a0a;
  --muted:#666;
  --gold:#998e82;        /* твой фирменный */
  --border:#eaeaea;
  --maxw:1200px;
  --radius:16px;
  --ff-display: "Playfair Display", serif;
  --ff-ui: "Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);
  font:16px/1.6 Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.container{max-width:var(--maxw);margin:0 auto;padding:0 20px}
.muted{color:var(--muted)}
.visually-hidden{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}

/* ===== Header (Prestige v1) ===== */
.site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--border);
  backdrop-filter:saturate(1.1) blur(8px);z-index:20}
.hdr-wrap{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px 0 8px}
.brand-line{display:flex;align-items:center;justify-content:center;width:100%;padding:8px 0}
.brand{font:700 32px/1 "Playfair Display",serif;letter-spacing:.06em;text-transform:capitalize}
@media (max-width:900px){ .brand{font-size:28px} }
.nav-line{display:flex;gap:20px;flex-wrap:wrap;justify-content:center;align-items:center;padding:6px 0 10px}
.nav-line a{ font:500 13px/1 var(--ff-ui); letter-spacing:.06em; text-transform:uppercase;
  padding-bottom:8px;border-bottom:2px solid transparent}
.nav-line a[aria-current="page"]{opacity:1;border-color:var(--gold);font-weight:500}
.nav-line a:hover{opacity:1}





/* Лого как изображение */
.brand{display:inline-flex;align-items:center}
.brand-logo{height:80px;width:auto;display:block}
@media (max-width:900px){ .brand-logo{height:80px} }

/* Меню: только hover-подчёркивание */
.nav-line{display:flex;gap:20px;flex-wrap:wrap;justify-content:center;align-items:center;padding:6px 0 10px}
.nav-line a{
  position:relative;
  font:500 13px/1 Inter;
  letter-spacing:.06em;
  text-transform:uppercase;
  opacity:.85;
  padding-bottom:10px;              /* место под линию */
}
.nav-line a:hover{opacity:1}
.nav-line a::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:2px; background:var(--gold);
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .25s ease;
}
.nav-line a:hover::after{ transform:scaleX(1); }

/* отключаем прежнюю линию по aria-current, если была */
.nav-line a[aria-current="page"]{ border-bottom-color:transparent !important; }







/* ===== Footer ===== */
.site-footer{margin-top:56px;border-top:1px solid var(--border);background:#fff}
.footer-wrap{
  display:grid;gap:24px;align-items:start;
  grid-template-columns:2fr 1fr 1fr 1fr;
  padding:28px 20px;
}
@media (max-width:920px){ .footer-wrap{grid-template-columns:1fr 1fr} }
@media (max-width:600px){ .footer-wrap{grid-template-columns:1fr} }

.footer-logo{height:50px;width:auto;display:block;margin-bottom:10px;opacity:.9}
.footer-col h4{ font:600 14px/1 var(--ff-ui); }
.footer-col a{
  display:block;margin:6px 0;opacity:.85;position:relative;padding-bottom:6px
}
.footer-col a:hover{opacity:1}
.footer-col a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--gold);
  transform:scaleX(0);transform-origin:center;transition:transform .25s ease;
}
.footer-col a:hover::after{transform:scaleX(1)}
.site-footer{ font-family: var(--ff-ui); }







/* Footer: отключить underline при наведении */
.footer-col a{
  opacity: 1;              /* всегда 100% */
  padding-bottom: 0;       /* убираем место под линию */
}
.footer-col a:hover{
  opacity: 1;              /* без изменения при hover */
}
.footer-col a::after{
  content: none;           /* полностью убираем псевдо-линию */
}








/* ===== Hero ===== */
.hero{padding:48px 0;border-bottom:1px solid var(--border);background:#fff}
.hero-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;align-items:center}
@media (max-width:980px){ .hero-wrap{grid-template-columns:1fr} }
.hero-text h1{font:700 46px/1.1 "Playfair Display",serif;margin:0 0 10px}
@media (max-width:600px){ .hero-text h1{font-size:36px} }
.hero-text p{color:var(--muted);margin:0 0 16px}
.hero-actions{display:flex;gap:10px;flex-wrap:wrap}
.hero-media img{width:100%;height:auto;border-radius:16px;border:1px solid var(--border)}

/* ===== Cards (4) ===== */
.section{padding:48px 0}
.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}
.section-head h2{font:700 28px/1.2 "Playfair Display",serif;margin:0}
.grid.cards-4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:920px){ .grid.cards-4{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){ .grid.cards-4{grid-template-columns:1fr} }

.card{background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;display:flex;flex-direction:column}
.card .ph{aspect-ratio:4/3;background:#f8f8f8}
.card .body{padding:14px 14px 16px}
.card h3{margin:0 0 6px;font:600 18px/1.3 Inter}
.card .meta{display:flex;justify-content:space-between;color:var(--muted);font-size:12px}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border-radius:999px;border:1px solid var(--fg);cursor:pointer;background:#fff}
.btn.primary{border-color:var(--gold);background:var(--gold);color:#fff}
.btn.ghost{border-color:var(--border)}

/* Cards: sharp corners */
.card{
  border-radius: 0 !important;
  overflow: visible;          /* чтобы не срезало тени/контент по скруглению */
}
.card .ph{
  border-radius: 0 !important;
}
.card img{
  border-radius: 0 !important;
}
.card{position:relative}
.card-link{position:absolute;inset:0;z-index:1} /* кликается вся карточка */
.card .body a{position:relative;z-index:2}      /* текстовые ссылки поверх */








/* ===== Hero full-bleed video ===== */
.hero--video{
  position: relative;
  padding: 0;                 /* убираем внутренние отступы секции */
  min-height: 58vh;           /* высота блока */
  border-bottom: 1px solid var(--border);
  overflow: hidden;           /* обрезаем видео по границам блока */
  background:#000;            /* на случай, если видео не загрузится */
}
@media (max-width:900px){ .hero--video{ min-height: 48vh } }

.hero--video .hero-wrap{
  position: relative;
  z-index: 2;                 /* текст поверх видео и оверлея */
  display: flex;
  align-items: center;
  min-height: inherit;
  padding: 48px 20px;         /* отступы внутри контейнера */
}

.hero-bg{
  position: absolute;
  inset: 0;                   /* top:0; right:0; bottom:0; left:0 */
  width: 100%;
  height: 100%;
  object-fit: cover;          /* видео полностью заполняет блок */
  pointer-events: none;       /* клики не перехватывает */
}

.hero-overlay{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.50);     /* степень затемнения */
  z-index: 1;
}

/* Текст на видео */
.hero-text h1{
  color:#fff;
  font:700 56px/1.1 "Playfair Display",serif;
  margin: 0 0 10px;
  text-shadow: 0 1px 2px rgba(0,0,0,.25);
}
.hero-text p{
  color: rgba(255,255,255,.9);
  margin: 0 0 16px;
}
@media (max-width:600px){
  .hero-text h1{ font-size: 36px }
}

/* Кнопки на тёмном фоне */
.hero-actions .btn.ghost{ background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.35); color:#fff }
.hero-actions .btn.primary{ border-color: var(--gold); background: var(--gold); color:#fff }






/* Gucci-like: центр + View all справа */
.section-head.gucci{
  display:grid;
  grid-template-columns: 1fr auto 1fr; /* правая колонка для кнопки */
  row-gap:8px;
  align-items:center;
  margin:24px 0 18px;
}
.section-head.gucci .kicker{
  grid-column: 1 / -1;                /* на всю ширину, по центру */
  justify-self:center;
  font:600 11px/1 Inter;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
}
.section-head.gucci h2{
  grid-column: 1 / -1;                /* на всю ширину, по центру */
  justify-self:center;
  margin:0;
  font:700 28px/1.25 "Playfair Display",serif;
}
.section-head.gucci .viewall{
  grid-column: 3;                      /* в правой колонке */
  justify-self:end;
  font:500 12px/1 Inter;
  opacity:.8;
}
.section-head.gucci .viewall:hover{ opacity:1 }





/* Product layout */
.product{display:grid;grid-template-columns:1.1fr .9fr;gap:28px}
@media (max-width:980px){ .product{grid-template-columns:1fr} }
.crumbs{font:12px/1.4 Inter;color:var(--muted);margin-bottom:6px}
.crumbs a{opacity:.8}
.p-info h1{font:700 32px/1.2 "Playfair Display",serif;margin:0 0 10px}
.p-desc{color:var(--muted);margin:0 0 14px}

/* Gallery */
.gallery{display:grid;gap:12px}
.gallery .view{border:1px solid var(--border);background:#f3f3f3}
.gallery .view img{width:100%;display:block}
.gallery .thumbs{display:flex;gap:8px;flex-wrap:wrap}
.gallery .thumbs img{width:92px;height:92px;object-fit:cover;border:1px solid var(--border);cursor:pointer}

/* Purchase box */
.p-box{margin-top:8px}
.p-options{border:1px solid var(--border);padding:12px;display:grid;gap:8px}
.p-options label{display:flex;align-items:center;gap:10px}
.p-options small{color:var(--muted)}
.agree{display:flex;align-items:flex-start;gap:10px;margin:12px 0}

/* subsection title */
.subhed{font:700 22px/1.2 "Playfair Display",serif;margin:0 0 14px}





/* Gucci-like header: back ниже заголовка */
.section-head.gucci{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  grid-auto-rows: min-content;
  row-gap:8px;
  align-items:center;
  margin:24px 0 18px;
}

.section-head.gucci .kicker{
  grid-column:1 / -1; justify-self:center;
  font:600 11px/1 Inter; letter-spacing:.18em; text-transform:uppercase; color:var(--muted);
}

.section-head.gucci h2{
  grid-column:1 / -1; justify-self:center;
  margin:0; font:700 28px/1.25 "Playfair Display",serif;
}

/* ↓ перемещаем Back и count на строку под заголовком */
.section-head.gucci .back{
  grid-column:1; grid-row:3;             /* была строка 1, станет 3 */
  justify-self:start;
  margin-top:6px;                         /* чуть ниже визуально */
  font:500 12px/1 Inter; opacity:.8;
}
.section-head.gucci .back:hover{ opacity:1 }

.section-head.gucci .count{
  grid-column:3; grid-row:3;              /* справа на той же строке */
  justify-self:end; align-self:start;
  margin-top:6px;
  font:500 12px/1 Inter; color:var(--muted);
}






/* сетка коллекций */
.grid.collections-3{
  display:grid; gap:20px;
  grid-template-columns:repeat(3,1fr);
}
@media (max-width:980px){ .grid.collections-3{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .grid.collections-3{grid-template-columns:1fr} }

/* карточка коллекции – чуть выше изображение */
.collection-card .ph{ aspect-ratio: 4/3; background:#f3f3f3 }
.collection-card h3{ margin:0 0 6px; font:600 18px/1.3 Inter }




/* выключенные коллекции */
.collection-card.is-disabled {
  opacity: .6;
  pointer-events: none;               /* клики не проходят */
  user-select: none;
}
.collection-card.is-disabled .ph { position: relative; }
.collection-card.is-disabled .soon{
  position:absolute; left:10px; top:10px;
  padding:4px 8px; border:1px solid var(--border);
  background:#fff; border-radius:999px; font:600 11px/1 Inter;
  letter-spacing:.12em; text-transform:uppercase;
}

/* чтобы вид «View all» не выглядел как ссылка в выключенных */
.collection-card.is-disabled .meta .muted { opacity:.6; }





.gallery{display:grid;gap:12px}
.gallery .view{position:relative;border:1px solid var(--border);background:#f3f3f3;aspect-ratio:16/9;overflow:hidden}
.gallery .view > img,
.gallery .view > video,
.gallery .view > iframe{width:100%;height:100%;object-fit:cover;display:block}

.thumbs-wrap{position:relative}
.gallery .thumbs{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:2px}
.gallery .thumb{flex:0 0 auto;width:92px;height:92px;scroll-snap-align:center;border:1px solid var(--border);background:#fff;cursor:pointer;position:relative}
.gallery .thumb img{width:100%;height:100%;object-fit:cover;display:block}
.gallery .thumb.is-active{outline:2px solid var(--gold)}
.gallery .thumb .play{position:absolute;inset:auto 50% 50% auto;transform:translate(50%,50%);width:20px;height:20px;border-radius:50%;background:#0008;display:grid;place-items:center}
.gallery .thumb .play::before{content:"";border-left:7px solid #fff;border-top:5px solid transparent;border-bottom:5px solid transparent}

.thumbs-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:2;width:28px;height:28px;display:grid;place-items:center;border:1px solid var(--border);background:#fff;cursor:pointer}
.thumbs-prev{left:-8px}.thumbs-next{right:-8px}
.thumbs-nav::before{content:"";width:6px;height:6px;border-top:2px solid #333;border-right:2px solid #333}
.thumbs-prev::before{transform:rotate(-135deg)}
.thumbs-next::before{transform:rotate(45deg)}
@media (max-width:700px){.thumbs-prev,.thumbs-next{display:none}}



/* ===== Product layout: фикс двух колонок и выравнивание ===== */
.product{
  display: grid !important;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  gap: 28px;
  align-items: start;         /* правая колонка не «сползает» вниз */
}

/* прижимаем блоки к верху явно */
.gallery{ align-self: start; }
.p-info{ align-self: start; }

/* чтобы галерея не была слишком высокой — можно сделать 4:3 */
.gallery .view{ aspect-ratio: 4 / 3; }   /* хочешь 16:9 — оставь 16/9 */

/* на мобильных — одна колонка */
@media (max-width: 900px){
  .product{ grid-template-columns: 1fr; }
}


/* ===== FIX: product page two-column layout ===== */
.container.product{
  display: grid !important;                          /* перебиваем всё */
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr) !important;
  gap: 28px !important;
  align-items: start !important;                     /* правая колонка наверху */
}

/* дети не расталкивают грид и не ломают перенос */
.container.product > *{ min-width: 0; }

/* что где стоит */
.container.product .gallery{ align-self: start; order: 1; }
.container.product .p-info { align-self: start; order: 2; }

/* высота «просмотра» в галерее, чтобы она не была слишком большой */
.container.product .gallery .view{ aspect-ratio: 4 / 3; }  /* хочешь 16/9 — поменяй */

/* мобильная версия — одна колонка */
@media (max-width: 900px){
  .container.product{
    grid-template-columns: 1fr !important;
  }
}

/* (опционально) липкая галерея при прокрутке на десктопе */
@media (min-width: 900px){
  .container.product .gallery{ position: sticky; top: 96px; }
}




/* неактивные варианты лицензий */
.p-options label.is-disabled{
  opacity: .45;
  pointer-events: none; /* чтобы не кликалось */
}
.p-options label.is-disabled input{ cursor: not-allowed; }



.btn[disabled] {
  opacity: .5;
  pointer-events: none;
  cursor: not-allowed;
}






/* ----- License page enhancements ----- */
.section .btns { display:flex; gap:12px; flex-wrap:wrap; }
.mt-20{ margin-top:20px } .mt-32{ margin-top:32px }
.grid-2{ display:grid; grid-template-columns: 1.2fr 1fr; gap:32px }
@media (max-width: 960px){ .grid-2{ grid-template-columns: 1fr; } }

.card{ background:#fff; border:1px solid var(--border,#eee); border-radius:12px; padding:24px }
.table-wrap{ overflow:auto; }
.license-table{ width:100%; border-collapse:separate; border-spacing:0; font-size:14px }
.license-table th, .license-table td{ padding:14px 16px; border-bottom:1px solid var(--border,#eee); vertical-align:top }
.license-table thead th{ text-align:left; font-weight:600; background:var(--bg-soft,#fafafa); position:sticky; top:0; }
.license-table tbody tr:hover td{ background:rgba(0,0,0,.015) }

.checklist{ list-style:none; padding:0; margin:0 }
.checklist li{ padding-left:26px; position:relative; margin:8px 0 }
.checklist li::before{ content:""; width:14px; height:14px; border-radius:3px; border:1px solid var(--border,#e3e3e3);
  position:absolute; left:0; top:6px; background:linear-gradient(#fff,#f7f7f7); box-shadow:inset 0 0 0 2px #fff }
.checklist li::after{ content:""; position:absolute; left:3px; top:9px; width:8px; height:4px; border-left:2px solid #000; border-bottom:2px solid #000; transform:rotate(-45deg) }

.donot{ list-style:disc; padding-left:18px; margin:0 }
.donot li{ margin:8px 0 }

.faq details{ border-top:1px solid var(--border,#eee); padding:14px 0 }
.faq details:first-child{ border-top:0 }
.faq summary{ cursor:pointer; font-weight:500; outline:none; list-style:none }
.faq summary::-webkit-details-marker{ display:none }
.faq summary::after{ content:"+"; float:right; transition:.2s transform }
.faq details[open] summary::after{ transform:rotate(45deg) }
.faq details > div{ margin-top:8px; color:var(--muted,#666) }

.pill{ display:inline-block; padding:6px 10px; border:1px solid var(--border,#eee); border-radius:999px; font-size:12px }
.muted{ color:var(--muted,#666) }
.overline{ letter-spacing:.08em; text-transform:uppercase; color:var(--muted,#666); font-size:12px; margin:0 0 6px }



/* контейнер формы покупки */
.p-box{
  display: grid;
  gap: 12px;
  align-content: start;
}

/* блок с радиокнопками */
.p-options{
  display: grid;
  gap: 8px;
}
.p-options label{
  display: flex;
  align-items: center;
  gap: 8px;
}
.p-options small{ color: var(--muted,#666); }

/* согласие — единая строка */
.p-box .agree{
  display: flex;
  align-items: center;
  gap: 8px;
  line-height: 1.4;
}
.p-box .agree a{ text-decoration: underline; }

/* кнопки */
.p-box .actions{ margin-top: 4px; }

/* мобильная подстройка */
@media (max-width: 640px){
  .p-box .agree{ align-items: flex-start; flex-wrap: wrap; }
  .p-box .agree input{ margin-top: 3px; }
}



.p-box .agree { user-select: none; }
.p-box .agree a{
  text-decoration: underline;
}
.p-box .agree a:hover{
  text-decoration: none;
  opacity: .85;
}
.p-box{ gap: 12px; }
.p-box .actions{ margin-top: 2px; }
@media (max-width:640px){
  .p-box .agree{ align-items:flex-start; flex-wrap:wrap; }
  .p-box .agree input{ margin-top:3px; }
}
.p-options input:focus-visible,
.p-box .agree input:focus-visible,
#buyBtn:focus-visible{
  outline: 2px solid var(--accent, #222);
  outline-offset: 2px;
}






/* Contact layout в общем стиле сайта */
.contact-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 28px;
}
@media (max-width: 980px) {
  .contact-grid { grid-template-columns: 1fr; }
}

/* Карточки ты уже используешь — просто на всякий случай */
.card {
  border: 1px solid var(--border, #e5e5e5);
  background: var(--card, #fff);
  border-radius: 12px;
  padding: 18px 16px;
}

/* Форма в фирменном стиле */
.contact-form {
  display: grid;
  gap: 12px;
}
.field span {
  display: block;
  font-size: 12px;
  color: var(--muted, #666);
  margin-bottom: 6px;
}
.field input,
.field textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--border, #e5e5e5);
  border-radius: 10px;
  background: var(--card, #fff);
  font: inherit;
}
.field input:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--ink, #111);
}

/* Списки справа */
.list { margin: 0; padding-left: 18px; }
.small { font-size: 12px; }
/* Contact layout в общем стиле сайта */
.contact-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 28px;
}
@media (max-width: 980px) {
  .contact-grid { grid-template-columns: 1fr; }
}

/* Карточки ты уже используешь — просто на всякий случай */
.card {
  border: 1px solid var(--border, #e5e5e5);
  background: var(--card, #fff);
  border-radius: 12px;
  padding: 18px 16px;
}

/* Форма в фирменном стиле */
.contact-form {
  display: grid;
  gap: 12px;
}
.field span {
  display: block;
  font-size: 12px;
  color: var(--muted, #666);
  margin-bottom: 6px;
}
.field input,
.field textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--border, #e5e5e5);
  border-radius: 10px;
  background: var(--card, #fff);
  font: inherit;
}
.field input:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--ink, #111);
}

/* Списки справа */
.list { margin: 0; padding-left: 18px; }
.small { font-size: 12px; }







/* ===== Steam-like gallery ===== */
.sg{--sg-br:#e9e9e9;--sg-bg:#f7f7f7;--sg-r:16px;--sg-h:56vh;--sg-min:320px;}
.sg-main{background:var(--sg-bg);border:1px solid var(--sg-br);border-radius:var(--sg-r);
  display:grid;place-items:center;overflow:hidden;aspect-ratio:var(--sg-ar, 1/1);max-height:var(--sg-h);min-height:var(--sg-min);}
.sg-main img,.sg-main video,.sg-main iframe{width:100%;height:100%;object-fit:contain;display:block;background:#000;}
.sg-strip{margin-top:12px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px}
.sg-nav{inline-size:36px;block-size:36px;border:1px solid var(--sg-br);border-radius:10px;background:#fff;cursor:pointer}
.sg-track{display:flex;gap:8px;overflow:hidden;scroll-behavior:smooth}
.sg-thumb{position:relative;flex:0 0 90px;aspect-ratio:1/1;border:1px solid var(--sg-br);border-radius:10px;background:#fff;cursor:pointer;padding:0}
.sg-thumb img{width:100%;height:100%;object-fit:cover;display:block;border-radius:9px}
.sg-thumb.is-active{outline:2px solid #111;outline-offset:0}
.sg-play{position:absolute;inset:auto 6px 6px auto;width:0;height:0;border-left:10px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
@media (max-width: 720px){ .sg-thumb{flex-basis:72px} }



/* визуал отключённой лицензии */
.lic-disabled { opacity: .45; cursor: not-allowed; }
.lic-disabled input { pointer-events: none; }


/* === Overrides: smaller cards on Collections & Catalog to match index === */
#collections-grid.grid,
#catalog-grid.grid{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 24px;
}

#collections-grid .card,
#catalog-grid .card{
  max-width: 360px;           /* keeps a tidy visual scale */
  margin: 0 auto;             /* center card in its grid cell */
}

#collections-grid .card .ph,
#catalog-grid .card .ph{
  aspect-ratio: 1 / 1;        /* square like index cards */
  height: auto;
  overflow: hidden;
  border-radius: 14px;
}

#collections-grid .card .ph img,
#catalog-grid .card .ph img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

@media (max-width: 700px){
  #collections-grid.grid,
  #catalog-grid.grid{ grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }
}

/* === Centered section head on catalog + side Back link === */
.section-head.is-center{ text-align:center; position:relative; margin-top:10px; }
.section-head.is-center .kicker{ margin-bottom:6px; }
.section-head.is-center h2{ margin:0 0 4px; }
.section-head.is-center #collection-count{ font-size:14px; opacity:.7; margin-bottom:10px; }

.section-head.is-center .back-link{
  position:absolute;
  left:0;
  top:34px;            /* a bit lower than the title line */
  font:500 14px/1 Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  text-decoration:none;
  opacity:.8;
  padding:6px 8px;
  border-radius:10px;
  transition:opacity .15s ease;
}
.section-head.is-center .back-link:hover{ opacity:1; text-decoration:underline; }

@media (max-width: 700px){
  .section-head.is-center .back-link{ position:static; display:inline-block; margin-top:6px; }
}

/* === Catalog head: right-aligned counter + left Back aligned to same row === */
.section-head.is-center{
  position:relative;
  display:block;
  text-align:center;
  padding-top:6px;
}
.section-head.is-center .kicker{ margin-bottom:6px; }
.section-head.is-center h2{ margin:0 0 22px; }

.section-head.is-center .back-link,
.section-head.is-center #collection-count{
  position:absolute;
  top: 54px;
}

.section-head.is-center .back-link{
  left:0;
  font:500 14px/1 Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  text-decoration:none;
  opacity:.85;
  padding:8px 10px;
  border-radius:10px;
  transition:opacity .15s ease;
}
.section-head.is-center .back-link:hover{ opacity:1; text-decoration:underline; }

.section-head.is-center #collection-count{ right:0; }

.count-badge{
  display:inline-block;
  font:500 12px/1 Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial; /* like .viewall */
  opacity:.8;
  color:inherit;
  background:none;
  border:0;
  border-radius:0;
  padding:0;
  box-shadow:none;
}

@media (max-width: 780px){
  .section-head.is-center .back-link,
  .section-head.is-center #collection-count{ position:static; display:inline-block; margin:4px 6px 0; }
  .section-head.is-center{ text-align:center; }
}


/* === Fashion Font Themes === */
html.theme-didone   { --ff-display: "Bodoni Moda", serif; }
html.theme-garamond { --ff-display: "Cormorant Garamond", serif; }
html.theme-caslon   { --ff-display: "Libre Caslon Display", serif; }
html.theme-modern   { --ff-display: "DM Serif Display", serif; } /* contemporary serif */

h1, h2, .hero-text h1, .section-head h2, .p-info h1{
  font-family: var(--ff-display);
}
/* subtle luxury: slightly tighter headlines */
.section-head h2{ letter-spacing: .01em; }
.kicker{ letter-spacing: .18em; }

/* === Catalog head rail: align Back and Count on one baseline === */
.section-head.is-center{ text-align:center; padding-top:6px; }
.section-head.is-center h2{ margin:0 0 10px; }

.section-head.is-center .head-rail{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-height:28px;
  margin: 0 0 4px;
}

.section-head.is-center .head-rail .back-link,
.section-head.is-center .head-rail #collection-count{
  position: static;   /* cancel previous absolute positioning */
  top: auto; left: auto; right: auto;
  padding: 0;
}

.section-head.is-center .head-rail .back-link{
  font:500 14px/1 var(--ff-ui);
  opacity:.85;
  text-decoration:none;
}
.section-head.is-center .head-rail .back-link:hover{ opacity:1; text-decoration:underline; }

@media (max-width: 780px){
  .section-head.is-center .head-rail{ flex-wrap:wrap; justify-content:center; gap:8px; }
}

/* tighter spacing below catalog header to match index cards */
.section-head.is-center{ margin-bottom: 8px; }

/* buy disabled */
#buyBtn.is-disabled{opacity:.5;pointer-events:none;}

/* ===== Verify page: screen card look (не меняет общую тему) ===== */
#certificate {
  display: none;                /* показывается только после успешной проверки */
  position: relative;
  max-width: 920px;
  margin: 32px auto 72px;
  padding: 28px 28px 22px;
  border: 1px solid var(--border, #e6e6e6);
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(0,0,0,.06);
}

/* полупрозрачный водяной знак */
#certificate::after{
  content:"";
  position:absolute; inset:0;
  background: url("/assets/watermark.svg") center/90% no-repeat;
  opacity:.08;
  pointer-events:none;
}

/* верхняя полоса/«кант» */
#certificate .rail {
  position: absolute; left:0; right:0; top:0;
  height: 6px; border-radius: 16px 16px 0 0;
  background: linear-gradient(90deg, #bba89b, #e1d5cd);
}

/* заголовок + логотип */
#certificate .brand {
  display:flex; align-items:center; gap:12px;
  font-weight:600; font-size:24px; line-height:1.2;
  margin: 0 0 4px;
}
#certificate .brand .logo { width:28px; height:28px; }

/* сетка полей */
#certificate .grid{
  display:grid; grid-template-columns: 1fr 160px;
  gap: 18px 32px; align-items:start; margin-top: 18px;
}
#certificate .field { font-size:14px; line-height:1.35; }
#certificate .label { color:#777; display:block; margin-bottom:6px; font-size:12px; letter-spacing:.02em; }

/* QR — и на экране, и в печати */
#certificate .qr img{
  width:120px; height:120px; object-fit:contain; aspect-ratio:1/1;
  image-rendering: pixelated;
}

/* подпись */
#certificate .sig { margin-top: 18px; }
#certificate .sig .line{
  width: 220px; height: 1px; background:#000; opacity:.22; margin: 10px 0 4px;
}
#certificate .sig .name{ font-size:12px; color:#666; }

/* ===== PRINT: показываем только карточку в масштабе, без шапки/футера ===== */
@media print {
  @page { size: A4; margin: 12mm; }

  /* убрать всё лишнее сайта */
  header, .site-header, footer, .site-footer,
  #vForm, #result, nav, .breadcrumbs { display:none !important; }

  body { background:#fff !important; }

  /* печатаем только карточку; без теней, с тонкой рамкой */
  #certificate {
    display:block !important;
    margin: 0 !important;
    box-shadow: none !important;
    border: 1px solid #ddd !important;
    max-width: none;
    width: auto;
    page-break-inside: avoid;
  }

  /* водяной знак можно сделать чуть тусклее для печати */
  #certificate::after { opacity:.10; }

  /* в печати QR фиксирован в миллиметрах для чёткости */
  #certificate .qr img {
    width: 35mm; height: 35mm;
  }
}

/* Спрятать заголовок/интро на печать (покажите им id в вашей верстке) */
@media print {
  #verifyTitle, #verifyIntro { display: none !important; }
}

/* Юридический блок печатаем, на сайте скрыт */
.print-only { display: none; }
@media print {
  .print-only { display: block !important; }
  #certificate .cert-legal { margin-top: 16px; color: #444; }
  #certificate .cert-legal .meta {
    display: grid; grid-template-columns: 1fr 1fr; gap: 6px 24px; margin-bottom: 6px;
  }
  #certificate .cert-legal .label { display: block; font-size: 11px; color: #777; margin-bottom: 3px; }
  #certificate .cert-legal .small { font-size: 11px; line-height: 1.35; margin: 6px 0; }
  #certificate .cert-legal .nowrap { white-space: nowrap; }
}

/* На сайте Verification URL и серийник не нужны — пусть будут мелкими и серыми */
#certificate .cert-legal .label { font-size: 12px; color:#777; }
#certificate .cert-legal .meta span { font-size: 12px; }

/* === Full-bleed Stories under collections === */
.story-list {
  margin-top: 6rem;
}

.story {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw); /* full-bleed */
  height: clamp(360px, 65vh, 840px);
  overflow: hidden;
  background: #f6f6f6;
  border-radius: 0; /* на всякий случай */
}

.story + .story {
  margin-top: 6rem;
}

.story__media {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  /* небольшой антиалиасинг для видео на некоторых GPU */
  transform: translateZ(0);
}

.story__shade {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to top, rgba(0,0,0,.38), rgba(0,0,0,0) 65%);
}

.story--light .story__shade {
  background: linear-gradient(to top, rgba(255,255,255,.25), rgba(255,255,255,0) 65%);
}

.story__content {
  position: absolute;
  left: clamp(16px, 6vw, 120px);
  bottom: clamp(16px, 8vh, 140px);
  color: #fff;
  max-width: min(60ch, 60%);
  text-shadow: 0 2px 10px rgba(0,0,0,.25);
}

.story--light .story__content {
  color: #111;
  text-shadow: none;
}

.story__eyebrow {
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: .75rem;
  opacity: .85;
}

.story__title {
  margin: .3em 0 .2em;
  font-size: clamp(28px, 4vw, 56px);
  line-height: 1.05;
  font-weight: 600;
}

.story__text {
  font-size: clamp(14px, 1.15vw, 18px);
  opacity: .95;
}

.story__cta {
  margin-top: 1rem;
  display: inline-block;
  padding: .75rem 1.25rem;
  border-radius: 999px;
  text-decoration: none;
  background: #111;
  color: #fff;
  box-shadow: 0 8px 30px rgba(0,0,0,.22);
  transition: transform .15s ease, box-shadow .15s ease;
}

.story__cta:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 36px rgba(0,0,0,.28);
}

.story--light .story__cta {
  background: #fff;
  color: #111;
  box-shadow: 0 8px 30px rgba(0,0,0,.12);
}

@media (max-width: 860px) {
  .story__content { max-width: 88%; bottom: 12vw; }
}

@media print {
  .story { display: none !important; }
}
/* Дополнения для главной */
.story-list--home { margin-top: 6rem; }

/* Выравнивание текстового блока */
.story--align-right .story__content {
  left: auto;
  right: clamp(16px, 6vw, 120px);
  text-align: right;
}
.story--align-right .story__cta { margin-left: .5rem; }





/* === Product page: compact desktop spacing === */
@media (min-width: 1200px) {
  /* 1) Две колонки компактнее + меньше gap */
  .page-product .container.product{
    display:grid !important;
    grid-template-columns: 540px 1fr !important; /* было шире */
    gap: 20px !important;                        /* было ~28–40 */
    align-items:start !important;
  }

  /* 2) Галерея и превью чуточку меньше */
  .page-product .sg-main{ max-height: 600px; }   /* было выше */
  .page-product .sg-track{ gap: 8px; }
  .page-product .sg-thumb{ flex-basis: 68px; height: 68px; }

  /* 3) Крошки/заголовок/подзаголовок — компактнее */
  .page-product .crumbs{ margin-bottom: 6px; font-size: 12px; }
  .page-product .p-info h1{ font-size: 28px; line-height: 1.2; margin: 8px 0 10px; }
  .page-product .p-desc{ font-size: 14px; line-height: 1.35; margin: 0 0 10px; }

  /* 4) Блок выбора лицензии — плотнее */
  .page-product .p-options{ padding: 12px; gap: 6px; }
  .page-product .p-options label{ gap: 8px; padding: 4px 0; }
  .page-product .p-options small{ font-size: 12px; opacity: .8; }

  /* 5) Чекбокс «I’ve read…» и действия */
  .page-product .agree{ margin: 8px 0 10px; gap: 8px; font-size: 13px; line-height: 1.35; }
  .page-product .actions{ margin-top: 8px; }

  /* 6) Кнопка — ниже и компактнее */
  .page-product .btn{ height: 38px; padding: 0 14px; font-size: 14px; border-radius: 10px; }
}