/* LuxeWall – design refresh + shop */

:root {
  --color-bg: #0c0b0a;
  --color-bg-alt: #13110f;
  --color-bg-card: #181614;
  --color-surface: #1e1b18;
  --color-border: rgba(255, 240, 220, 0.08);
  --color-border-hover: rgba(212, 175, 115, 0.45);
  --color-gold: #d4af73;
  --color-gold-light: #e8cc97;
  --color-gold-dark: #a8844a;
  --color-text: #f4efe8;
  --color-text-secondary: #b3aca2;
  --color-text-muted: #7d766d;
  --color-success: #6fd59a;
  --color-danger: #ff7b7b;
  --nav-height: 76px;
  --radius-lg: 16px;
}

::selection { background: var(--color-gold); color: #000; }
body { font-size: 16px; }
.section--tight { padding: 56px 0 96px; }
.hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.mono { font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace; letter-spacing: 0.02em; }
[hidden] { display: none !important; }

@media (prefers-reduced-motion: reduce) {
  [data-animate] { opacity: 1 !important; transform: none !important; transition: none !important; }
  .particle { display: none; }
}

/* ---------- Navigation ---------- */
.nav { height: var(--nav-height); }
.nav--scrolled { background: rgba(12, 11, 10, 0.86); }
.nav__container { gap: 24px; }
.nav__logo { flex-shrink: 0; gap: 10px; }
.nav__logo-img { width: 50px; height: 50px; }
.nav__brand { font-size: 1.45rem; letter-spacing: -0.01em; }
.nav__tagline { font-size: 0.6rem; letter-spacing: 2.5px; }
.nav__menu { order: 2; margin-left: auto; gap: 2px; }
.nav__right { order: 3; display: flex; align-items: center; gap: 10px; }
.nav__link { white-space: nowrap; padding: 9px 14px; font-size: 0.88rem; }
.nav__link--active { color: var(--color-text); }
.nav__link--active:not(.nav__link--cta)::after {
  content: ''; position: absolute; left: 14px; right: 14px; bottom: 3px; height: 2px;
  background: var(--color-gold); border-radius: 2px;
}
.nav__link--cta { margin-left: 8px; padding: 9px 22px; }

.nav__cart {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid var(--color-border); color: var(--color-text);
  transition: border-color var(--transition), color var(--transition), background var(--transition);
}
.nav__cart:hover { border-color: var(--color-gold); color: var(--color-gold); background: rgba(212, 175, 115, 0.08); }
.nav__cart-count {
  position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px; padding: 0 5px;
  border-radius: 10px; background: var(--color-gold); color: #000;
  font-size: 0.7rem; font-weight: 700; line-height: 20px; text-align: center;
  box-shadow: 0 0 0 3px var(--color-bg);
}

@media (max-width: 1280px) {
  .nav__tagline { display: none; }
  .nav__social { display: none; }
}
@media (max-width: 1080px) and (min-width: 769px) {
  .nav__lang { display: none; }
}
@media (max-width: 768px) {
  .nav__menu { order: 2; margin-left: 0; }
  .nav__link--active:not(.nav__link--cta)::after { display: none; }
  .nav__link--cta { margin-left: 0; }
  .nav__social { display: flex; }
  .nav__right { margin-left: auto; }
}

/* ---------- Buttons ---------- */
.btn { letter-spacing: 0.01em; }
.btn--sm { padding: 10px 18px; font-size: 0.85rem; gap: 8px; }
.btn:disabled { opacity: 0.6; cursor: wait; transform: none !important; }
.btn:focus-visible, .qty__btn:focus-visible, .nav__cart:focus-visible { outline: 2px solid var(--color-gold-light); outline-offset: 3px; }

/* ---------- Hero ---------- */
.hero { min-height: 92vh; padding: calc(var(--nav-height) + 40px) 0 80px; }
.hero__photo {
  position: absolute; inset: 0;
  background: url('/assets/images/hero.jpg') center 40% / cover no-repeat;
  transform: scale(1.04);
  animation: heroZoom 18s ease-out forwards;
}
@keyframes heroZoom { to { transform: scale(1); } }
.hero__overlay {
  background:
    radial-gradient(ellipse at 50% 45%, rgba(12, 11, 10, 0.55) 0%, rgba(12, 11, 10, 0.85) 70%),
    linear-gradient(180deg, rgba(12, 11, 10, 0.6) 0%, rgba(12, 11, 10, 0.4) 40%, var(--color-bg) 100%);
}
.hero__title { text-shadow: 0 2px 30px rgba(0, 0, 0, 0.5); }
.hero__subtitle { color: #d6cfc5; }
.hero__actions { margin-bottom: 36px; }
.hero__trust {
  list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 48px;
}
.hero__trust li {
  padding: 7px 16px; border-radius: 999px; font-size: 0.82rem; color: #e9e1d5;
  background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.12);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.hero__trust li::before { content: '✓'; color: var(--color-gold); margin-right: 8px; font-weight: 700; }

/* ---------- Page hero ---------- */
.page-hero { padding: calc(var(--nav-height) + 72px) 0 56px; }
.page-hero .container { position: relative; z-index: 1; }
.page-hero--compact { padding: calc(var(--nav-height) + 48px) 0 32px; }
.page-hero--compact .page-hero__title { font-size: clamp(2rem, 4vw, 3rem); }
.page-hero__bg::after {
  content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: min(600px, 80%); height: 1px; background: linear-gradient(90deg, transparent, rgba(212, 175, 115, 0.4), transparent);
}

/* ---------- Product cards ---------- */
.catalog__grid, .catalog-preview__grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 24px; }
.product-card {
  display: flex; flex-direction: column;
  background: linear-gradient(180deg, var(--color-bg-card), #141210);
  border-radius: var(--radius-lg);
}
.product-card:hover { transform: translateY(-4px); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45), 0 0 0 1px var(--color-border-hover); }
.product-card__image-wrap { display: block; aspect-ratio: 397 / 500; background: #e9e5df; }
.product-card__image { object-position: center top; }
.product-card:hover .product-card__image { transform: scale(1.04); }
.product-card__badge {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  padding: 4px 10px; border-radius: 999px; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.04em;
  background: rgba(12, 11, 10, 0.75); color: var(--color-gold-light);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.product-card__info { padding: 18px 18px 18px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.product-card__name { font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; line-height: 1.3; margin: 0; color: var(--color-text); }
.product-card__name:hover { color: var(--color-gold-light); }
.product-card__meta { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.product-card__price { font-size: 1.15rem; font-weight: 700; color: var(--color-gold); }
.product-card__unit { font-size: 0.75rem; color: var(--color-text-muted); }
.product-card__buy { display: flex; gap: 8px; margin-top: auto; }
.product-card__add { flex: 1; justify-content: center; padding-left: 12px; padding-right: 12px; }
.is-added { background: linear-gradient(135deg, #7fdca5, #4fb27a) !important; }

/* ---------- Quantity stepper ---------- */
.qty {
  display: inline-flex; align-items: stretch; flex-shrink: 0;
  border: 1px solid var(--color-border); border-radius: 999px; overflow: hidden; background: rgba(255, 255, 255, 0.03);
}
.qty__btn {
  width: 34px; border: 0; background: transparent; color: var(--color-text); font-size: 1.1rem; cursor: pointer;
  transition: background var(--transition), color var(--transition);
}
.qty__btn:hover { background: rgba(212, 175, 115, 0.12); color: var(--color-gold); }
.qty__input {
  width: 42px; border: 0; background: transparent; color: var(--color-text); text-align: center;
  font: 600 0.95rem var(--font-body); -moz-appearance: textfield; appearance: textfield;
}
.qty__input::-webkit-outer-spin-button, .qty__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.qty__input:focus { outline: none; background: rgba(255, 255, 255, 0.05); }
.qty--lg .qty__btn { width: 46px; font-size: 1.3rem; }
.qty--lg .qty__input { width: 56px; font-size: 1.05rem; }

/* ---------- Shop bar (catalog) ---------- */
.shop-bar {
  position: sticky; top: calc(var(--nav-height) + 8px); z-index: 50;
  display: flex; align-items: center; gap: 8px 28px; flex-wrap: wrap;
  padding: 14px 20px; margin-bottom: 32px; border-radius: 14px;
  background: rgba(24, 22, 20, 0.88); border: 1px solid var(--color-border);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  font-size: 0.88rem; color: var(--color-text-secondary);
}
.shop-bar__item strong { color: var(--color-text); }
.shop-bar__cart {
  margin-left: auto; padding: 8px 16px; border-radius: 999px;
  background: rgba(212, 175, 115, 0.12); border: 1px solid rgba(212, 175, 115, 0.35); color: var(--color-gold-light);
}
.shop-bar__cart:hover { background: rgba(212, 175, 115, 0.2); }
.shop-bar__cart strong { color: var(--color-text); }

/* ---------- Product detail ---------- */
.product-detail { padding-top: calc(var(--nav-height) + 40px); }
.product-detail__image-wrap { background: #e9e5df; border-radius: var(--radius-lg); overflow: hidden; position: sticky; top: calc(var(--nav-height) + 24px); align-self: start; }
.buy-box {
  margin: 28px 0; padding: 24px; border-radius: var(--radius-lg);
  background: linear-gradient(160deg, rgba(212, 175, 115, 0.09), rgba(212, 175, 115, 0.02));
  border: 1px solid rgba(212, 175, 115, 0.28);
}
.buy-box__price { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; }
.buy-box__amount { font-family: var(--font-display); font-size: 2.2rem; font-weight: 700; color: var(--color-gold-light); line-height: 1; }
.buy-box__note { font-size: 0.85rem; color: var(--color-text-secondary); }
.buy-box__calc { margin-bottom: 18px; }
.buy-box__calc label { display: block; font-size: 0.82rem; font-weight: 600; color: var(--color-text-secondary); margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.06em; }
.buy-box__calc-row { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.buy-box__calc-row .form__input { width: 130px; }
.buy-box__calc-result { font-size: 0.88rem; color: var(--color-text-secondary); flex: 1; min-width: 200px; }
.buy-box__calc-result strong { color: var(--color-gold-light); }
.buy-box__row { display: flex; gap: 12px; flex-wrap: wrap; }
.buy-box__add { flex: 1; justify-content: center; min-width: 220px; }
.buy-box__total { margin-top: 14px; font-size: 0.95rem; }
.buy-box__total strong { font-size: 1.15rem; color: var(--color-text); }
.buy-box__total span { color: var(--color-text-muted); font-size: 0.82rem; }
.buy-box__perks { list-style: none; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--color-border); display: grid; gap: 6px; }
.buy-box__perks li { font-size: 0.85rem; color: var(--color-text-secondary); padding-left: 22px; position: relative; }
.buy-box__perks li::before { content: '✓'; position: absolute; left: 0; color: var(--color-gold); font-weight: 700; }

/* ---------- Forms ---------- */
.form__input { border-radius: 10px; }
.form__input.is-invalid { border-color: var(--color-danger); box-shadow: 0 0 0 3px rgba(255, 123, 123, 0.12); }
.form__row--postcode { grid-template-columns: 160px 1fr; }

/* ---------- Checkout ---------- */
.steps { list-style: none; display: inline-flex; gap: 6px; margin-top: 18px; padding: 5px; border-radius: 999px; background: var(--color-bg-card); border: 1px solid var(--color-border); flex-wrap: wrap; justify-content: center; }
.steps__item { padding: 7px 16px; border-radius: 999px; font-size: 0.82rem; color: var(--color-text-muted); }
.steps__item--active { background: var(--color-gold); color: #000; font-weight: 600; }

.checkout__grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 28px; align-items: start; }
.checkout__main { display: flex; flex-direction: column; gap: 24px; }
.checkout__aside { position: sticky; top: calc(var(--nav-height) + 20px); }
.card { background: var(--color-bg-card); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: 28px; }
.card__title { font-family: var(--font-display); font-size: 1.35rem; font-weight: 600; margin-bottom: 20px; }
.card__title--spaced { margin-top: 32px; }
.checkout__continue { display: inline-block; margin-top: 18px; font-size: 0.9rem; color: var(--color-gold); }
.checkout__continue:hover { color: var(--color-gold-light); }

.cart-line {
  display: grid; grid-template-columns: 64px minmax(0, 1fr) auto 110px 32px; gap: 16px; align-items: center;
  padding: 14px 0; border-bottom: 1px solid var(--color-border);
}
.cart-line:first-child { padding-top: 0; }
.cart-line__img { width: 64px; height: 80px; border-radius: 8px; overflow: hidden; background: #e9e5df; }
.cart-line__img img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.cart-line__info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cart-line__name { font-weight: 600; }
.cart-line__name:hover { color: var(--color-gold-light); }
.cart-line__unit { font-size: 0.8rem; color: var(--color-text-muted); }
.cart-line__total { text-align: right; }
.cart-line__remove {
  width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--color-border); background: transparent;
  color: var(--color-text-muted); font-size: 1.2rem; cursor: pointer; line-height: 1;
}
.cart-line__remove:hover { color: var(--color-danger); border-color: var(--color-danger); }

.segmented { display: inline-flex; padding: 4px; border-radius: 999px; background: var(--color-bg); border: 1px solid var(--color-border); margin-bottom: 22px; }
.segmented input { position: absolute; opacity: 0; pointer-events: none; }
.segmented span { display: block; padding: 8px 18px; border-radius: 999px; font-size: 0.88rem; color: var(--color-text-secondary); cursor: pointer; }
.segmented input:checked + span { background: var(--color-surface); color: var(--color-text); box-shadow: 0 0 0 1px var(--color-border-hover); }
.segmented input:focus-visible + span { outline: 2px solid var(--color-gold); }

.pay-options { display: grid; gap: 10px; margin-bottom: 24px; }
.pay-option { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; border-radius: 12px; border: 1px solid var(--color-border); cursor: pointer; transition: border-color var(--transition), background var(--transition); }
.pay-option:hover { border-color: rgba(212, 175, 115, 0.3); }
.pay-option:has(input:checked) { border-color: var(--color-gold); background: rgba(212, 175, 115, 0.06); }
.pay-option input { accent-color: var(--color-gold); margin-top: 3px; width: 18px; height: 18px; }
.pay-option__body { display: flex; flex-direction: column; gap: 2px; }
.pay-option__body small { color: var(--color-text-muted); font-size: 0.82rem; }

.check { display: flex; gap: 12px; align-items: flex-start; font-size: 0.88rem; color: var(--color-text-secondary); line-height: 1.55; cursor: pointer; }
.check input { accent-color: var(--color-gold); width: 18px; height: 18px; margin-top: 2px; flex-shrink: 0; }
.check a, .summary__note a { color: var(--color-gold); text-decoration: underline; text-underline-offset: 2px; }

.form-errors { margin-top: 18px; padding: 14px 18px; border-radius: 12px; background: rgba(255, 123, 123, 0.08); border: 1px solid rgba(255, 123, 123, 0.35); color: #ffb3b3; font-size: 0.9rem; }
.form-errors p + p { margin-top: 4px; }

.summary__row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; font-size: 0.92rem; color: var(--color-text-secondary); }
.summary__row span:last-child { color: var(--color-text); text-align: right; }
.summary__row--muted span:last-child { color: var(--color-text-muted); font-size: 0.85rem; }
.summary__total { display: flex; justify-content: space-between; align-items: baseline; padding: 16px 0 20px; margin-top: 8px; border-top: 1px solid var(--color-border); }
.summary__total strong { font-family: var(--font-display); font-size: 1.7rem; color: var(--color-gold-light); }
.summary__note { margin-top: 16px; font-size: 0.78rem; line-height: 1.55; color: var(--color-text-muted); }

.checkout__empty { text-align: center; padding: 64px 24px; color: var(--color-text-secondary); }
.checkout__empty svg { color: var(--color-gold); margin: 0 auto 18px; }
.checkout__empty h2 { font-family: var(--font-display); font-size: 1.8rem; color: var(--color-text); margin-bottom: 8px; }
.checkout__empty p { margin-bottom: 28px; }

.done { max-width: 720px; margin: 0 auto; text-align: center; padding: 48px 36px; }
.done__icon { width: 76px; height: 76px; margin: 0 auto 20px; border-radius: 50%; display: grid; place-items: center; background: rgba(111, 213, 154, 0.12); color: var(--color-success); }
.done h2 { font-family: var(--font-display); font-size: 2rem; margin-bottom: 10px; }
.done p { color: var(--color-text-secondary); line-height: 1.7; }
.done__number { font-size: 1.05rem; margin-bottom: 14px; }
.done__number strong { color: var(--color-gold-light); font-family: ui-monospace, Menlo, Consolas, monospace; }
.done__bank { text-align: left; margin: 28px 0 8px; padding: 22px 24px; border-radius: 12px; background: var(--color-bg); border: 1px solid rgba(212, 175, 115, 0.3); }
.done__bank h3 { font-size: 1rem; color: var(--color-gold); margin-bottom: 6px; }
.done__bank dl { display: grid; grid-template-columns: 90px 1fr; gap: 6px 14px; margin-top: 12px; font-size: 0.92rem; }
.done__bank dt { color: var(--color-text-muted); }
.done__warn { margin-top: 16px; color: #ffcf8a !important; }
.done__actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 28px; }

/* ---------- Legal pages ---------- */
.legal__layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 56px; align-items: start; }
.legal__toc { position: sticky; top: calc(var(--nav-height) + 24px); }
.legal__toc nav { display: flex; flex-direction: column; border-left: 1px solid var(--color-border); }
.legal__toc-title { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.12em; color: var(--color-gold); padding: 0 0 10px 16px; font-weight: 600; }
.legal__toc a { padding: 6px 0 6px 16px; margin-left: -1px; border-left: 2px solid transparent; font-size: 0.86rem; color: var(--color-text-secondary); }
.legal__toc a:hover, .legal__toc a.is-active { color: var(--color-text); border-left-color: var(--color-gold); }
.legal__print { margin-top: 24px; }
.legal__content { max-width: 780px; font-size: 1rem; line-height: 1.8; color: #d9d2c8; }
.legal__content h2 {
  font-family: var(--font-display); font-size: 1.55rem; color: var(--color-text);
  margin: 52px 0 16px; padding-top: 8px; scroll-margin-top: calc(var(--nav-height) + 24px);
}
.legal__content h2:first-child { margin-top: 0; }
.legal__content h3 { font-size: 1.05rem; color: var(--color-gold-light); margin: 26px 0 10px; }
.legal__content p { margin-bottom: 14px; }
.legal__content ol, .legal__content ul { padding-left: 22px; margin-bottom: 16px; }
.legal__content li { margin-bottom: 10px; padding-left: 4px; }
.legal__content li::marker { color: var(--color-gold); font-weight: 600; }
.legal__content ul ul { margin-top: 10px; }
.legal__content a { color: var(--color-gold); text-decoration: underline; text-underline-offset: 2px; }
.legal__content strong { color: var(--color-text); }
.legal__lead { font-size: 1.08rem; color: var(--color-text-secondary); padding-bottom: 8px; }
.legal__callout { margin: 18px 0; padding: 18px 20px; border-radius: 12px; background: rgba(212, 175, 115, 0.07); border-left: 3px solid var(--color-gold); }
.legal__muted { color: var(--color-text-muted); font-size: 0.88rem; font-style: italic; }
.legal__form { margin: 32px 0; padding: 28px; border-radius: var(--radius-lg); border: 1px dashed rgba(212, 175, 115, 0.4); background: var(--color-bg-card); scroll-margin-top: calc(var(--nav-height) + 24px); }
.legal__form h3 { margin-top: 0; font-family: var(--font-display); font-size: 1.25rem; }
.legal__fill { list-style: none; padding-left: 0 !important; }
.legal__fill li { padding-left: 0; }
.legal__fill span { display: block; border-bottom: 1px dotted var(--color-text-muted); height: 26px; }
.legal__table { display: grid; gap: 12px; margin: 18px 0 8px; }
.legal__row { padding: 18px 20px; border-radius: 12px; background: var(--color-bg-card); border: 1px solid var(--color-border); }
.legal__row h4 { color: var(--color-text); font-size: 1rem; margin-bottom: 6px; }
.legal__row p { margin: 0; font-size: 0.93rem; }

/* ---------- Footer ---------- */
.footer__grid { grid-template-columns: 1.8fr 1fr 1fr 1.4fr; gap: 48px; }
.footer__bottom { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.footer__legal { font-size: 0.8rem; color: var(--color-text-muted); }
.footer__payments { display: flex; gap: 8px; flex-wrap: wrap; justify-content: center; }
.footer__payments span { padding: 4px 10px; border-radius: 6px; border: 1px solid var(--color-border); font-size: 0.72rem; color: var(--color-text-secondary); letter-spacing: 0.04em; }

/* ---------- Toast & cookies ---------- */
.toast {
  position: fixed; left: 50%; bottom: 24px; z-index: 2000; transform: translate(-50%, 140%);
  display: flex; align-items: center; gap: 12px; max-width: calc(100% - 32px);
  padding: 14px 18px; border-radius: 14px; background: #1f1c19; border: 1px solid rgba(212, 175, 115, 0.4);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5); font-size: 0.9rem;
  transition: transform 0.35s cubic-bezier(0.2, 0.9, 0.3, 1.2);
}
.toast svg { color: var(--color-success); flex-shrink: 0; }
.toast--show { transform: translate(-50%, 0); }
.toast__link { color: var(--color-gold); font-weight: 600; white-space: nowrap; }
.cookie-bar {
  position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 1900; margin: 0 auto; max-width: 760px;
  display: flex; align-items: center; gap: 18px; padding: 16px 20px; border-radius: 14px;
  background: rgba(24, 22, 20, 0.96); border: 1px solid var(--color-border); box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5);
  font-size: 0.85rem; color: var(--color-text-secondary);
}
.cookie-bar a { color: var(--color-gold); text-decoration: underline; }
.cookie-bar .btn { flex-shrink: 0; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .checkout__grid { grid-template-columns: 1fr; }
  .checkout__aside { position: static; }
  .legal__layout { grid-template-columns: 1fr; gap: 24px; }
  .legal__toc { position: static; }
  .legal__toc nav { flex-direction: row; flex-wrap: wrap; border-left: 0; gap: 6px; }
  .legal__toc-title { width: 100%; padding-left: 0; }
  .legal__toc a { border: 1px solid var(--color-border); border-radius: 999px; padding: 5px 12px; margin: 0; font-size: 0.8rem; }
  .legal__print { display: none; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
  .product-detail__image-wrap { position: relative; top: 0; }
}
@media (max-width: 768px) {
  .hero { min-height: auto; padding-top: calc(var(--nav-height) + 48px); }
  .shop-bar { position: static; }
  .shop-bar__item:nth-child(3) { display: none; }
  .shop-bar__cart { margin-left: 0; width: 100%; text-align: center; }
  .card { padding: 20px; }
  .cart-line { grid-template-columns: 56px minmax(0, 1fr) 32px; grid-template-areas: 'img info rm' 'img qty total'; row-gap: 10px; }
  .cart-line__img { grid-area: img; width: 56px; height: 72px; }
  .cart-line__info { grid-area: info; }
  .cart-line .qty { grid-area: qty; justify-self: start; }
  .cart-line__total { grid-area: total; }
  .cart-line__remove { grid-area: rm; }
  .form__row--postcode { grid-template-columns: 1fr; }
  .cookie-bar { flex-direction: column; align-items: stretch; text-align: center; }
  .footer__grid { grid-template-columns: 1fr; }
  .buy-box { padding: 18px; }
  .buy-box__amount { font-size: 1.8rem; }
}
@media (max-width: 480px) {
  .catalog__grid, .catalog-preview__grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .product-card__info { padding: 12px; gap: 8px; }
  .product-card__name { font-size: 0.9rem; }
  .product-card__unit { display: none; }
  .product-card__buy { flex-direction: column; }
  .product-card .qty { justify-content: space-between; }
  .product-card .qty__input { flex: 1; }
  .product-card__add svg { display: none; }
  .nav__brand { font-size: 1.15rem; }
}

/* ---------- Print (legal) ---------- */
@media print {
  .nav, .footer, .legal__toc, .toast, .cookie-bar, .page-hero__bg { display: none !important; }
  body { background: #fff; color: #000; }
  .page-hero { padding: 0 0 16px; }
  .page-hero__title, .page-hero__title .gold, .legal__content, .legal__content h2, .legal__content strong { color: #000 !important; }
  .legal__layout { display: block; }
  .legal__row, .legal__form, .legal__callout { background: #fff; border-color: #999; }
  [data-animate] { opacity: 1 !important; transform: none !important; }
}

/* ================= v3: availability, filters, PDP, tones ================= */
.avail { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.02em; white-space: nowrap; }
.avail i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 3px color-mix(in srgb, currentColor 25%, transparent); }
.avail--ok { color: #7fe0a6; background: rgba(30, 120, 70, 0.28); }
.avail--wait { color: #f2c477; background: rgba(160, 110, 20, 0.28); }
.avail--off { color: #b9b1a7; background: rgba(120, 112, 104, 0.28); }
.avail--inline { margin-top: 4px; align-self: flex-start; }

/* product card v3 */
.product-card__image-wrap { aspect-ratio: 420 / 620; background: #d9d4cc; }
.product-card__image { object-position: center; }
.product-card__avail { position: absolute; left: 12px; bottom: 12px; z-index: 2; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); background: rgba(12, 11, 10, 0.72); }
.product-card__badge { font-family: ui-monospace, Menlo, Consolas, monospace; }
.product-card__color { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.14em; color: var(--color-text-muted); }
.product-card__info { gap: 6px; }
.product-card__buy { margin-top: 8px; }
.product-card__notify { margin-top: 8px; justify-content: center; }
.product-card--off .product-card__image { filter: grayscale(0.6) brightness(0.8); }
.product-card::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04); }
.product-card { position: relative; }

/* filters */
.filters { position: sticky; top: calc(var(--nav-height) + 8px); z-index: 50; margin-bottom: 28px; padding: 14px; border-radius: 16px; background: rgba(20, 18, 16, 0.9); border: 1px solid var(--color-border); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35); }
.filters__row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.filters__row + .filters__row { margin-top: 12px; }
.filters__chips { display: flex; gap: 6px; flex-wrap: wrap; }
.chip { display: inline-flex; align-items: center; gap: 7px; padding: 7px 13px; border-radius: 999px; border: 1px solid var(--color-border); background: transparent; color: var(--color-text-secondary); font: 500 0.83rem var(--font-body); cursor: pointer; transition: all var(--transition); }
.chip span { font-size: 0.72rem; color: var(--color-text-muted); }
.chip:hover { border-color: rgba(212, 175, 115, 0.45); color: var(--color-text); }
.chip--active { background: var(--color-gold); border-color: var(--color-gold); color: #000; }
.chip--active span { color: rgba(0, 0, 0, 0.6); }
.swatch { width: 12px; height: 12px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.25); }
.swatch--jasne { background: linear-gradient(135deg, #fff, #e6dfd3); }
.swatch--bezowe { background: linear-gradient(135deg, #e9d6b5, #a98552); }
.swatch--szare { background: linear-gradient(135deg, #b8b8b8, #5d5d5d); }
.swatch--ciemne { background: linear-gradient(135deg, #3a3a3a, #050505); }
.swatch--niebieskie { background: linear-gradient(135deg, #6aa3e6, #183d78); }
.swatch--zielone { background: linear-gradient(135deg, #6fbf9a, #1d4f3c); }
.search { flex: 1; min-width: 220px; display: flex; align-items: center; gap: 8px; padding: 0 14px; border-radius: 999px; border: 1px solid var(--color-border); background: rgba(255, 255, 255, 0.03); color: var(--color-text-muted); }
.search:focus-within { border-color: var(--color-gold); }
.search input { flex: 1; background: transparent; border: 0; padding: 10px 0; color: var(--color-text); font: 0.9rem var(--font-body); }
.search input:focus { outline: none; }
.select { padding: 9px 34px 9px 14px; border-radius: 999px; border: 1px solid var(--color-border); background: rgba(255, 255, 255, 0.03) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23b3aca2' stroke-width='2'%3E%3Cpath d='m2 4 4 4 4-4'/%3E%3C/svg%3E") right 14px center no-repeat; color: var(--color-text); font: 0.85rem var(--font-body); -webkit-appearance: none; appearance: none; cursor: pointer; }
.select option { background: #1a1816; }
.segmented--sm { margin: 0; }
.segmented--sm span { padding: 6px 13px; font-size: 0.82rem; }
.filters .shop-bar__cart { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font-size: 0.85rem; }
.filters__summary { margin-top: 10px; font-size: 0.82rem; color: var(--color-gold-light); }
.filters__summary:empty { display: none; }
.catalog__empty { text-align: center; padding: 60px 0; color: var(--color-text-secondary); }
.catalog__empty p { margin-bottom: 16px; }

/* tones */
.tones__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.tone { position: relative; display: block; aspect-ratio: 3 / 4.4; border-radius: 16px; overflow: hidden; border: 1px solid var(--color-border); }
.tone img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.8s cubic-bezier(0.2, 0.7, 0.2, 1); }
.tone::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(8, 7, 6, 0.85)); }
.tone__body { position: absolute; left: 14px; right: 14px; bottom: 14px; z-index: 1; display: flex; flex-direction: column; gap: 2px; }
.tone__body strong { font-family: var(--font-display); font-size: 1.05rem; color: #fff; line-height: 1.2; }
.tone__body small { font-size: 0.78rem; color: var(--color-gold-light); }
.tone:hover img { transform: scale(1.07); }
.tone:hover { border-color: var(--color-border-hover); }

/* PDP */
.pdp { padding: calc(var(--nav-height) + 28px) 0 96px; }
.crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: 0.82rem; color: var(--color-text-muted); margin-bottom: 24px; }
.crumbs a:hover { color: var(--color-gold); }
.crumbs b { color: var(--color-text-secondary); font-weight: 500; }
.pdp__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 56px; align-items: start; }
.pdp__gallery { position: sticky; top: calc(var(--nav-height) + 20px); display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 14px; }
.pdp__stage { grid-column: 2; grid-row: 1; position: relative; border: 0; padding: 0; border-radius: 18px; overflow: hidden; background: #d9d4cc; cursor: zoom-in; max-height: calc(100vh - var(--nav-height) - 60px); }
.pdp__stage img { width: 100%; height: 100%; max-height: calc(100vh - var(--nav-height) - 60px); object-fit: cover; display: block; }
.pdp__zoom-hint { position: absolute; right: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; background: rgba(12, 11, 10, 0.72); color: #fff; font-size: 0.78rem; backdrop-filter: blur(6px); }
.pdp__thumbs { grid-column: 1; grid-row: 1; display: flex; flex-direction: column; gap: 10px; }
.pdp__thumb { border: 1px solid var(--color-border); border-radius: 10px; overflow: hidden; padding: 0; background: #d9d4cc; cursor: pointer; position: relative; aspect-ratio: 3 / 4; }
.pdp__thumb img { width: 100%; height: 100%; object-fit: cover; }
.pdp__thumb span { position: absolute; left: 0; right: 0; bottom: 0; padding: 3px; font-size: 0.6rem; background: rgba(0, 0, 0, 0.6); color: #fff; }
.pdp__thumb.is-active { border-color: var(--color-gold); box-shadow: 0 0 0 1px var(--color-gold); }
.pdp__top { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.pdp__model { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 0.8rem; letter-spacing: 0.08em; color: var(--color-gold); padding: 3px 9px; border: 1px solid rgba(212, 175, 115, 0.35); border-radius: 6px; }
.pdp__title { font-family: var(--font-display); font-size: clamp(2rem, 3.6vw, 3rem); line-height: 1.1; margin-bottom: 14px; }
.pdp__desc { font-size: 1.05rem; line-height: 1.75; color: var(--color-text-secondary); max-width: 560px; }
.buy-box__status { margin-bottom: 18px; padding: 10px 14px; border-radius: 10px; font-size: 0.88rem; color: var(--color-text-secondary); border-left: 3px solid; }
.buy-box__status strong { color: var(--color-text); }
.buy-box__status em { color: #f2c477; font-style: normal; font-weight: 600; }
.buy-box__status--ok { border-color: #4fbf80; background: rgba(30, 120, 70, 0.14); }
.buy-box__status--wait { border-color: #e0a947; background: rgba(160, 110, 20, 0.14); }
.buy-box__status--off { border-color: #8a837b; background: rgba(120, 112, 104, 0.14); }
.buy-box--off .buy-box__amount { color: var(--color-text-secondary); }
.pdp__specs { margin-top: 8px; padding: 22px 24px; border-radius: 16px; border: 1px solid var(--color-border); background: var(--color-bg-card); }
.pdp__specs h2 { font-family: var(--font-display); font-size: 1.2rem; margin-bottom: 12px; }
.pdp__specs dl { display: grid; grid-template-columns: 160px 1fr; }
.pdp__specs dt, .pdp__specs dd { padding: 9px 0; border-bottom: 1px solid var(--color-border); font-size: 0.9rem; }
.pdp__specs dt { color: var(--color-text-muted); }
.pdp__specs dd:last-of-type, .pdp__specs dt:last-of-type { border-bottom: 0; }
.pdp__download { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; font-size: 0.85rem; color: var(--color-gold); }
.pdp__download:hover { color: var(--color-gold-light); }
.pdp__nav { display: flex; justify-content: space-between; gap: 12px; margin-top: 24px; font-size: 0.85rem; }
.pdp__nav a { color: var(--color-text-secondary); }
.pdp__nav a:hover { color: var(--color-gold); }
.pdp__related { margin-top: 96px; }
.section__header--left { text-align: left; margin-bottom: 32px; }
.zoombox { position: fixed; inset: 0; z-index: 3000; background: rgba(5, 5, 5, 0.94); display: flex; align-items: center; justify-content: center; padding: 24px; cursor: zoom-out; overflow: auto; }
.zoombox img { max-width: 100%; max-height: 100%; border-radius: 8px; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6); cursor: default; }
.zoombox__close { position: fixed; top: 16px; right: 20px; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.2); background: rgba(255, 255, 255, 0.06); color: #fff; font-size: 1.8rem; line-height: 1; cursor: pointer; }

/* cart extras */
.cart-line--off { opacity: 0.7; }
.summary__lead { margin: 4px 0 6px; padding: 10px 12px; border-radius: 10px; background: rgba(160, 110, 20, 0.14); color: #f2c477; font-size: 0.82rem; line-height: 1.5; }

/* contact */
.contact__social { margin-top: 28px; padding: 20px 22px; border-radius: 16px; border: 1px solid var(--color-border); background: var(--color-bg-card); }
.contact__social p { color: var(--color-text-secondary); margin-bottom: 12px; font-size: 0.92rem; }
.contact__social-links { display: flex; gap: 8px; flex-wrap: wrap; }
.contact__social-links a { padding: 8px 16px; border-radius: 999px; border: 1px solid var(--color-border); font-size: 0.88rem; }
.contact__social-links a:hover { border-color: var(--color-gold); color: var(--color-gold); }

/* polish */
.section__title { letter-spacing: -0.015em; }
.feature-card { border-radius: 18px; }
.catalog-preview .catalog__grid, .catalog-preview__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1200px) {
  .tones__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .catalog-preview__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1024px) {
  .pdp__grid { grid-template-columns: 1fr; gap: 32px; }
  .pdp__gallery { position: static; grid-template-columns: 1fr; }
  .pdp__stage { grid-column: 1; max-height: 70vh; }
  .pdp__stage img { max-height: 70vh; }
  .pdp__thumbs { grid-column: 1; grid-row: 2; flex-direction: row; }
  .pdp__thumb { width: 74px; }
  .filters { position: static; }
  .catalog-preview__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 768px) {
  .filters__row--tools > * { flex: 1 1 100%; }
  .filters .shop-bar__cart { margin-left: 0; justify-content: center; }
  .filters__chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; scrollbar-width: none; }
  .chip { flex-shrink: 0; }
  .tones__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pdp__specs dl { grid-template-columns: 130px 1fr; }
  .pdp { padding-top: calc(var(--nav-height) + 44px); }
}
@media (max-width: 480px) {
  .catalog-preview__grid { grid-template-columns: 1fr 1fr; }
  .product-card__avail { left: 8px; bottom: 8px; font-size: 0.62rem; padding: 3px 7px; }
  .product-card__badge { display: none; }
  .product-card__color { display: none; }
}

/* ================= Chat widget ================= */
.chat { position: fixed; right: 20px; bottom: 20px; z-index: 1950; font-family: var(--font-body); }
body:has(.cookie-bar:not([hidden])) .chat { bottom: 120px; }
.chat__fab { position: relative; width: 60px; height: 60px; border-radius: 50%; border: 0; cursor: pointer; display: grid; place-items: center; color: #1a1408;
  background: linear-gradient(135deg, var(--color-gold-light), var(--color-gold) 55%, var(--color-gold-dark)); box-shadow: 0 12px 34px rgba(0, 0, 0, 0.45), 0 0 0 4px rgba(212, 175, 115, 0.15); transition: transform 0.25s ease, box-shadow 0.25s ease; }
.chat__fab:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5), 0 0 0 6px rgba(212, 175, 115, 0.2); }
.chat__fab:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.chat__ico-close { display: none; }
.chat--open .chat__ico-open { display: none; }
.chat--open .chat__ico-close { display: block; }
.chat__badge { position: absolute; top: -2px; right: -2px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: #e5484d; color: #fff; font: 700 12px/22px var(--font-body); box-shadow: 0 0 0 3px var(--color-bg); }
.chat:not(.chat--open) .chat__fab::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--color-gold); animation: chatPulse 2.6s ease-out infinite; }
@keyframes chatPulse { 0% { transform: scale(1); opacity: 0.7; } 80%, 100% { transform: scale(1.45); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .chat__fab::after { display: none; } }

.chat__panel { position: absolute; right: 0; bottom: 76px; width: 380px; height: min(600px, calc(100vh - 120px)); display: flex; flex-direction: column; overflow: hidden;
  border-radius: 20px; background: #15130f; border: 1px solid rgba(212, 175, 115, 0.25); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6); animation: chatIn 0.25s cubic-bezier(0.2, 0.9, 0.3, 1.1); transform-origin: bottom right; }
.chat__panel[hidden] { display: none !important; }
@keyframes chatIn { from { opacity: 0; transform: translateY(12px) scale(0.97); } }
.chat__head { display: flex; align-items: center; gap: 12px; padding: 16px 18px; background: linear-gradient(135deg, #221c13, #15130f); border-bottom: 1px solid var(--color-border); }
.chat__head img { border-radius: 50%; }
.chat__head strong { display: block; font-family: var(--font-display); font-size: 1.1rem; color: var(--color-gold-light); }
.chat__head span { font-size: 0.75rem; color: var(--color-text-secondary); display: inline-flex; align-items: center; gap: 6px; }
.chat__head span i { width: 7px; height: 7px; border-radius: 50%; background: #4fd18b; box-shadow: 0 0 0 3px rgba(79, 209, 139, 0.2); }
.chat__close { margin-left: auto; width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--color-border); background: transparent; color: var(--color-text-secondary); font-size: 1.4rem; line-height: 1; cursor: pointer; }
.chat__close:hover { color: #fff; border-color: var(--color-gold); }
.chat__body { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 12px; scroll-behavior: smooth;
  background: radial-gradient(ellipse at 100% 0%, rgba(212, 175, 115, 0.06), transparent 50%); }
.chat__intro { display: flex; flex-direction: column; gap: 10px; }
.chat__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chat__chips button { padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(212, 175, 115, 0.35); background: rgba(212, 175, 115, 0.06); color: var(--color-gold-light); font: 0.78rem var(--font-body); cursor: pointer; }
.chat__chips button:hover { background: rgba(212, 175, 115, 0.15); }
.chat__list { display: flex; flex-direction: column; gap: 10px; }

.chat .msg, .convpage .msg { display: flex; flex-direction: column; max-width: 84%; }
.chat .msg__bubble, .convpage .msg__bubble { padding: 10px 14px; border-radius: 16px; font-size: 0.9rem; line-height: 1.5; white-space: pre-wrap; word-wrap: break-word; }
.chat .msg__bubble a, .convpage .msg__bubble a { text-decoration: underline; }
.chat .msg__meta, .convpage .msg__meta { font-size: 0.68rem; color: var(--color-text-muted); margin-top: 3px; padding: 0 6px; }
.chat .msg--sklep, .convpage .msg--sklep { align-self: flex-start; }
.chat .msg--sklep .msg__bubble, .convpage .msg--sklep .msg__bubble { background: #26211a; border: 1px solid rgba(212, 175, 115, 0.18); color: var(--color-text); border-bottom-left-radius: 4px; }
.chat .msg--klient, .convpage .msg--klient { align-self: flex-end; align-items: flex-end; }
.chat .msg--klient .msg__bubble, .convpage .msg--klient .msg__bubble { background: linear-gradient(135deg, var(--color-gold), var(--color-gold-dark)); color: #16110a; border-bottom-right-radius: 4px; }
.chat .msg--system, .convpage .msg--system { align-self: center; max-width: 92%; }
.chat .msg--system .msg__bubble, .convpage .msg--system .msg__bubble { background: transparent; color: var(--color-text-muted); font-size: 0.74rem; text-align: center; padding: 2px 8px; }
.msg--pending { opacity: 0.6; }
.msg--failed .msg__bubble { outline: 1px solid #e5484d; }

.chat__start { padding: 14px 16px 16px; border-top: 1px solid var(--color-border); display: flex; flex-direction: column; gap: 8px; background: #121009; }
.chat__row { display: grid; grid-template-columns: 1fr 1.4fr; gap: 8px; }
.chat__start input:not([type=checkbox]), .chat__start textarea, .chat__compose textarea { width: 100%; border-radius: 12px; border: 1px solid var(--color-border); background: rgba(255, 255, 255, 0.04); color: var(--color-text); padding: 10px 12px; font: 0.88rem var(--font-body); resize: none; }
.chat__start input:focus, .chat__start textarea:focus, .chat__compose textarea:focus { outline: none; border-color: var(--color-gold); }
.chat__consent { display: flex; gap: 8px; align-items: center; font-size: 0.75rem; color: var(--color-text-secondary); }
.chat__consent input { accent-color: var(--color-gold); }
.chat__consent a { color: var(--color-gold); text-decoration: underline; }
.chat__error { font-size: 0.8rem; color: #ff9b9b; }
.chat__start .btn { padding: 11px 16px; }
.chat__compose { display: flex; gap: 8px; align-items: flex-end; padding: 12px; border-top: 1px solid var(--color-border); background: #121009; }
.chat__compose[hidden] { display: none !important; }
.chat__compose button { flex-shrink: 0; width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer; display: grid; place-items: center; color: #16110a; background: linear-gradient(135deg, var(--color-gold-light), var(--color-gold)); }
.chat__compose button:hover { filter: brightness(1.08); }

@media (max-width: 640px) {
  .chat { right: 14px; bottom: 14px; }
  .chat__fab { width: 54px; height: 54px; }
  .chat--open .chat__fab { display: none; }
  .chat__panel { position: fixed; inset: 0; width: auto; height: auto; border-radius: 0; bottom: 0; }
  .chat__row { grid-template-columns: 1fr; }
}

/* ================= Conversation page ================= */
.convpage { padding: calc(var(--nav-height) + 40px) 0 80px; }
.convpage__wrap { max-width: 760px; }
.convpage__card { border-radius: 22px; border: 1px solid rgba(212, 175, 115, 0.22); background: #15130f; overflow: hidden; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4); }
.convpage__head { display: flex; gap: 14px; align-items: center; padding: 20px 24px; border-bottom: 1px solid var(--color-border); background: linear-gradient(135deg, #221c13, #15130f); }
.convpage__head img { border-radius: 50%; }
.convpage__head h1 { font-family: var(--font-display); font-size: 1.4rem; }
.convpage__head p { color: var(--color-text-secondary); font-size: 0.85rem; }
.convpage__list { max-height: 60vh; min-height: 280px; overflow-y: auto; padding: 22px; }
.convpage__compose { padding: 14px 18px; }
.convpage__note { padding: 0 22px 18px; font-size: 0.8rem; color: var(--color-text-muted); background: #121009; }
.convpage__note a { color: var(--color-gold); }

/* ================= Pergole ================= */
.pg-hero { position: relative; min-height: 88vh; display: flex; align-items: center; padding: calc(var(--nav-height) + 48px) 0 72px; overflow: hidden; }
.pg-hero__bg { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.04); animation: heroZoom 18s ease-out forwards; }
.pg-hero__bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12, 11, 10, 0.92) 0%, rgba(12, 11, 10, 0.7) 45%, rgba(12, 11, 10, 0.25) 100%), linear-gradient(180deg, transparent 60%, var(--color-bg)); }
.pg-hero__content { position: relative; z-index: 1; max-width: 1280px; }
.pg-hero__title { font-family: var(--font-display); font-size: clamp(2.6rem, 6vw, 4.6rem); line-height: 1.05; margin: 8px 0 20px; max-width: 640px; }
.pg-hero__lead { font-size: 1.12rem; line-height: 1.75; color: #d8d0c4; max-width: 560px; margin-bottom: 32px; }
.pg-hero__actions { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 44px; }
.pg-hero__facts { list-style: none; display: flex; gap: 36px; flex-wrap: wrap; }
.pg-hero__facts li { display: flex; flex-direction: column; border-left: 2px solid var(--color-gold); padding-left: 14px; }
.pg-hero__facts strong { font-family: var(--font-display); font-size: 1.8rem; color: var(--color-gold-light); line-height: 1.1; }
.pg-hero__facts span { font-size: 0.82rem; color: var(--color-text-secondary); }

.pg-features__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.pg-feature { padding: 28px 26px; border-radius: 18px; border: 1px solid var(--color-border); background: linear-gradient(180deg, var(--color-bg-card), #141210); transition: border-color var(--transition), transform var(--transition); }
.pg-feature:hover { border-color: var(--color-border-hover); transform: translateY(-3px); }
.pg-feature__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; background: rgba(212, 175, 115, 0.12); color: var(--color-gold-light); font-size: 1.4rem; margin-bottom: 16px; }
.pg-feature h3 { font-family: var(--font-display); font-size: 1.2rem; margin-bottom: 8px; }
.pg-feature p { color: var(--color-text-secondary); font-size: 0.93rem; line-height: 1.7; }

.pg-media__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 220px; gap: 14px; }
.pg-media__video { grid-column: span 2; grid-row: span 2; margin: 0; border-radius: 18px; overflow: hidden; background: #000; position: relative; border: 1px solid var(--color-border); }
.pg-media__video video { width: 100%; height: 100%; object-fit: cover; display: block; }
.pg-media__video figcaption { position: absolute; left: 14px; top: 14px; padding: 5px 12px; border-radius: 999px; background: rgba(12, 11, 10, 0.75); font-size: 0.8rem; color: #fff; pointer-events: none; }
.pg-media__img { position: relative; border: 0; padding: 0; border-radius: 16px; overflow: hidden; cursor: zoom-in; background: #1a1714; border: 1px solid var(--color-border); }
.pg-media__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1); }
.pg-media__img:hover img { transform: scale(1.06); }
.pg-media__img span { position: absolute; left: 0; right: 0; bottom: 0; padding: 28px 14px 12px; background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.75)); color: #fff; font-size: 0.82rem; text-align: left; }

.pg-config__grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 28px; align-items: start; }
.pg-config__steps { display: flex; flex-direction: column; gap: 18px; }
.pg-step { border: 1px solid var(--color-border); border-radius: 18px; padding: 22px 24px; background: var(--color-bg-card); }
.pg-step legend { display: flex; align-items: center; gap: 10px; font-family: var(--font-display); font-size: 1.2rem; padding: 0 8px; margin-left: -8px; }
.pg-step legend span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--color-gold); color: #000; font: 700 0.85rem var(--font-body); }
.pg-range { margin-top: 14px; }
.pg-range label { display: flex; justify-content: space-between; font-size: 0.9rem; color: var(--color-text-secondary); margin-bottom: 8px; }
.pg-range output { color: var(--color-gold-light); font-weight: 700; }
.pg-range input[type=range] { width: 100%; accent-color: var(--color-gold); height: 6px; cursor: pointer; }
.pg-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 14px; }
.pg-card input, .pg-extra input, .pg-color input { position: absolute; opacity: 0; pointer-events: none; }
.pg-card span, .pg-extra span { display: flex; flex-direction: column; gap: 3px; height: 100%; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--color-border); cursor: pointer; transition: all var(--transition); }
.pg-card small, .pg-extra small { color: var(--color-text-muted); font-size: 0.78rem; }
.pg-card input:checked + span, .pg-extra input:checked + span { border-color: var(--color-gold); background: rgba(212, 175, 115, 0.08); box-shadow: 0 0 0 1px var(--color-gold); }
.pg-card input:focus-visible + span, .pg-extra input:focus-visible + span { outline: 2px solid var(--color-gold-light); }
.pg-extra span { padding-left: 44px; position: relative; }
.pg-extra span::before { content: ''; position: absolute; left: 16px; top: 16px; width: 16px; height: 16px; border-radius: 4px; border: 1.5px solid var(--color-text-muted); }
.pg-extra input:checked + span::before { background: var(--color-gold); border-color: var(--color-gold); box-shadow: inset 0 0 0 3px #1a1714; }
.pg-extras { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.pg-extra--wide { display: block; margin-top: 10px; }
.pg-colors { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.pg-color { display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px 6px 6px; border-radius: 999px; border: 1px solid var(--color-border); cursor: pointer; font-size: 0.82rem; color: var(--color-text-secondary); }
.pg-color i { width: 26px; height: 26px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.25); }
.pg-color:has(input:checked) { border-color: var(--color-gold); color: var(--color-text); box-shadow: 0 0 0 1px var(--color-gold); }

.pg-summary { position: sticky; top: calc(var(--nav-height) + 20px); }
.pg-summary__card, .pg-summary__done { border-radius: 20px; border: 1px solid rgba(212, 175, 115, 0.3); background: linear-gradient(170deg, #1d1914, #15130f); padding: 18px; }
.pg-viz { border-radius: 14px; overflow: hidden; margin-bottom: 14px; border: 1px solid var(--color-border); }
.pg-viz svg { display: block; width: 100%; height: auto; }
.pg-summary__list { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; font-size: 0.86rem; margin-bottom: 14px; }
.pg-summary__list dt { color: var(--color-text-muted); }
.pg-summary__list dd { text-align: right; color: var(--color-text); }
.pg-summary__price { display: flex; flex-direction: column; padding: 14px 0; margin-bottom: 14px; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.pg-summary__price span { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--color-text-muted); }
.pg-summary__price strong { font-family: var(--font-display); font-size: 2rem; color: var(--color-gold-light); }
.pg-summary__price small { color: var(--color-text-muted); font-size: 0.78rem; }
.pg-summary__note { margin-top: 10px; text-align: center; font-size: 0.78rem; color: var(--color-text-muted); }
.pg-summary__done { text-align: center; padding: 32px 24px; }
.pg-summary__done h3 { font-family: var(--font-display); font-size: 1.6rem; margin: 8px 0; }
.pg-summary__done p { color: var(--color-text-secondary); margin-bottom: 18px; line-height: 1.6; }

.pg-faq__wrap { max-width: 860px; }
.pg-faq__list { display: flex; flex-direction: column; gap: 10px; }
.pg-faq__list details { border: 1px solid var(--color-border); border-radius: 14px; background: var(--color-bg-card); padding: 0 20px; }
.pg-faq__list summary { cursor: pointer; padding: 18px 0; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 12px; }
.pg-faq__list summary::after { content: '+'; color: var(--color-gold); font-size: 1.3rem; line-height: 1; }
.pg-faq__list details[open] summary::after { content: '–'; }
.pg-faq__list details p { padding-bottom: 18px; color: var(--color-text-secondary); line-height: 1.7; }

.home-pergola { position: relative; overflow: hidden; }
.home-pergola__grid { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center; }
.home-pergola__img { border-radius: 22px; overflow: hidden; aspect-ratio: 4 / 3; border: 1px solid var(--color-border); }
.home-pergola__img img { width: 100%; height: 100%; object-fit: cover; }
.home-pergola__text p { color: var(--color-text-secondary); line-height: 1.75; margin: 14px 0 22px; }
.home-pergola__text ul { list-style: none; display: grid; gap: 8px; margin-bottom: 26px; }
.home-pergola__text li::before { content: '✓'; color: var(--color-gold); margin-right: 10px; font-weight: 700; }

@media (max-width: 1100px) {
  .pg-config__grid { grid-template-columns: 1fr; }
  .pg-summary { position: static; }
  .pg-features__grid { grid-template-columns: 1fr 1fr; }
  .pg-media__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .pg-hero { min-height: auto; }
  .pg-hero__facts { gap: 20px; }
  .pg-features__grid, .pg-cards, .pg-extras { grid-template-columns: 1fr; }
  .pg-media__grid { grid-auto-rows: 160px; }
  .pg-media__video { grid-column: span 2; grid-row: span 2; }
  .pg-step { padding: 18px; }
  .home-pergola__grid { grid-template-columns: 1fr; }
}

/* ================= Home: dual offer hero ================= */
.duo { padding: calc(var(--nav-height) + 44px) 0 56px; background: radial-gradient(ellipse at 50% -10%, rgba(212, 175, 115, 0.12), transparent 55%), var(--color-bg); }
.duo__head { text-align: center; max-width: 860px; margin-bottom: 34px; }
.duo__title { font-family: var(--font-display); font-size: clamp(2.3rem, 5vw, 4rem); line-height: 1.08; margin: 10px 0 16px; letter-spacing: -0.01em; }
.duo__lead { color: var(--color-text-secondary); font-size: 1.08rem; line-height: 1.7; max-width: 680px; margin: 0 auto; }
.duo__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.duo__card { position: relative; display: block; min-height: 520px; border-radius: 24px; overflow: hidden; border: 1px solid var(--color-border); isolation: isolate; }
.duo__card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(0.2, 0.7, 0.2, 1); z-index: -2; }
.duo__card:hover img { transform: scale(1.05); }
.duo__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(10, 9, 8, 0.05) 25%, rgba(10, 9, 8, 0.55) 55%, rgba(10, 9, 8, 0.94) 100%); }
.duo__body { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 30px 28px; display: flex; flex-direction: column; gap: 8px; }
.duo__tag { align-self: flex-start; padding: 5px 12px; border-radius: 999px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; background: rgba(12, 11, 10, 0.6); border: 1px solid rgba(255, 255, 255, 0.18); color: #e9e1d5; backdrop-filter: blur(6px); }
.duo__tag--new { background: var(--color-gold); color: #16110a; border-color: var(--color-gold); }
.duo__name { font-family: var(--font-display); font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.1; color: #fff; }
.duo__desc { color: #d8d0c4; font-size: 0.95rem; line-height: 1.6; max-width: 480px; }
.duo__cta { margin-top: 10px; align-self: flex-start; display: inline-flex; align-items: center; gap: 10px; padding: 12px 22px; border-radius: 999px; font-weight: 600; font-size: 0.92rem;
  background: linear-gradient(135deg, var(--color-gold-light), var(--color-gold)); color: #16110a; transition: gap var(--transition), box-shadow var(--transition); }
.duo__cta i { font-style: normal; }
.duo__card:hover .duo__cta { gap: 16px; box-shadow: 0 10px 30px rgba(212, 175, 115, 0.35); }
.duo__card:hover { border-color: var(--color-border-hover); }
.duo__trust { list-style: none; display: flex; justify-content: center; flex-wrap: wrap; gap: 10px 28px; margin-top: 26px; color: var(--color-text-secondary); font-size: 0.88rem; }
.duo__trust li::before { content: '✓'; color: var(--color-gold); margin-right: 8px; font-weight: 700; }

.home-pergola__img--video { position: relative; aspect-ratio: 4 / 5; max-height: 640px; background: #000; }
.home-pergola__img--video video { width: 100%; height: 100%; object-fit: cover; display: block; }
.home-pergola__badge { position: absolute; left: 16px; top: 16px; padding: 6px 12px; border-radius: 999px; background: rgba(12, 11, 10, 0.75); color: #fff; font-size: 0.8rem; }

@media (max-width: 900px) {
  .duo__grid { grid-template-columns: 1fr; }
  .duo__card { min-height: 420px; }
}
@media (max-width: 480px) {
  .duo__card { min-height: 380px; }
  .duo__body { padding: 22px 20px; }
}