:root{
  --bg:#ffffff;
  --bg-soft:#f6f6f4;
  --panel:#ffffff;
  --ink:#0f0f0f;
  --muted:#686868;
  --line:rgba(15,15,15,.1);
  --line-strong:rgba(15,15,15,.18);
  --shadow:0 18px 48px rgba(0,0,0,.08);
  --radius:24px;
  --radius-lg:32px;
  --container:min(1440px, calc(100% - 48px));
  --header-h:84px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--ink);
  background:var(--bg);
}
img{display:block;max-width:100%}
a{text-decoration:none;color:inherit}
button,input,textarea,select{font:inherit}
button{cursor:pointer}

body.menu-open,
body.search-open,
body.drawer-open,
body.modal-open{overflow:hidden}

.container{width:var(--container);margin:auto}
.page-spacer{padding-top:var(--header-h)}
.serif{font-family:'Cormorant Garamond',Georgia,serif}
.eyebrow{
  font-size:.72rem;
  font-weight:600;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.display-title{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(2.7rem, 6vw, 5rem);
  line-height:.92;
  letter-spacing:.02em;
  margin:0;
}
.section-title{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(2rem, 3.2vw, 3.25rem);
  line-height:1.05;
  letter-spacing:.02em;
  margin:0;
}
.section-copy{
  color:var(--muted);
  line-height:1.75;
  font-size:1rem;
}
.btn,
.ghost-btn,
.dark-btn,
.light-btn,
.underline-link{
  transition:.28s ease;
}
.btn,
.dark-btn,
.light-btn,
.ghost-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:52px;
  padding:0 22px;
  border-radius:16px;
  border:1px solid var(--line-strong);
  font-weight:600;
  gap:10px;
}
.dark-btn{
  background:#121212;
  color:#fff;
  border-color:#121212;
}
.dark-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.light-btn{
  background:#fff;
  color:#111;
}
.light-btn:hover{background:#f7f7f7}
.ghost-btn{
  background:transparent;
  color:#111;
}
.ghost-btn:hover{background:#f3f3f3}
.underline-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  position:relative;
  padding-bottom:8px;
  font-weight:500;
}
.underline-link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:currentColor;
}
.underline-link:hover{opacity:.7}
.icon-btn,
.icon-only{
  appearance:none;
  background:transparent;
  border:0;
  color:inherit;
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:8px 6px;
}
.icon-only{
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:999px;
}
.icon-only:hover,
.icon-btn:hover{background:rgba(255,255,255,.08)}
.site-header.scrolled .icon-only:hover,
.site-header.solid .icon-only:hover,
.site-header.scrolled .icon-btn:hover,
.site-header.solid .icon-btn:hover{background:rgba(0,0,0,.05)}
.icon svg,
.icon-only svg{width:24px;height:24px;display:block}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

.site-header{
  position:fixed;
  inset:0 0 auto 0;
  z-index:1000;
  height:var(--header-h);
  color:#fff;
  transition:background .28s ease,color .28s ease,border-color .28s ease,backdrop-filter .28s ease;
}
.site-header .header-bar{
  width:min(1800px, calc(100% - 24px));
  margin:auto;
  height:100%;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:16px;
}
.site-header .header-side{display:flex;align-items:center;gap:10px;min-width:0}
.site-header .header-side.right{justify-content:flex-end}
.site-logo{
  justify-self:center;
  font-size:clamp(2rem, 3vw, 3rem);
  letter-spacing:.08em;
  font-weight:700;
  text-transform:uppercase;
}
.header-text-link{font-size:1rem;font-weight:500}
.site-header.scrolled,
.site-header.solid{
  background:rgba(255,255,255,.92);
  color:#111;
  border-bottom:1px solid rgba(15,15,15,.08);
  backdrop-filter:blur(12px);
}
.header-badge{
  position:absolute;
  top:5px;
  right:1px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  background:#111;
  color:#fff;
  font-size:.65rem;
  display:grid;
  place-items:center;
}
.site-header:not(.scrolled):not(.solid) .header-badge{background:#fff;color:#111}

.mega-menu,
.search-panel,
.side-drawer,
.sheet-overlay,
.toast-stack{
  z-index:1200;
}
.sheet-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.34);
  opacity:0;
  pointer-events:none;
  transition:.24s ease;
}
.sheet-overlay.show{opacity:1;pointer-events:auto}
.mega-menu,
.search-panel{
  position:fixed;
  inset:0;
  background:#fff;
  transform:translateY(-101%);
  transition:.38s ease;
  padding:120px 0 48px;
  overflow:auto;
}
.mega-menu.show,
.search-panel.show{transform:translateY(0)}
.menu-grid,
.search-grid{
  width:var(--container);
  margin:auto;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:48px;
}
.menu-nav{display:grid;gap:18px}
.menu-nav a{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(2rem,4vw,3.3rem);
  line-height:1;
  width:max-content;
}
.menu-nav a:hover{opacity:.6}
.menu-panel-card,
.search-panel-card,
.drawer-card,
.contact-card,
.about-card,
.benefit-card,
.fact-card,
.catalog-toolbar,
.newsletter-card{
  border:1px solid var(--line);
  background:#fff;
  border-radius:var(--radius);
  box-shadow:0 10px 28px rgba(0,0,0,.04);
}
.menu-panel-card{padding:30px}
.menu-panel-card h3,
.search-panel-card h3,
.drawer-card h3,
.contact-card h3,
.about-card h3,
.newsletter-card h3{
  margin:0 0 12px;
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.8rem;
}
.menu-panel-card p,
.search-panel-card p,
.drawer-card p,
.contact-card p,
.about-card p,
.newsletter-card p{margin:0;color:var(--muted);line-height:1.75}
.menu-list{
  margin:22px 0 0;
  padding:0;
  list-style:none;
  display:grid;
  gap:14px;
}
.menu-list li{display:flex;justify-content:space-between;gap:12px;color:#1b1b1b}
.menu-close,
.search-close,
.drawer-close{
  position:absolute;
  top:26px;
  right:28px;
  width:46px;
  height:46px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  display:grid;
  place-items:center;
}
.search-panel-card{padding:26px}
.search-form{display:flex;gap:12px;align-items:center}
.search-input{
  flex:1;
  min-height:58px;
  border:1px solid var(--line-strong);
  border-radius:16px;
  padding:0 18px;
  font-size:1rem;
}
.search-results,
.favorite-list,
.cart-list{margin-top:22px;display:grid;gap:14px}
.search-item,
.favorite-item,
.cart-item{
  display:grid;
  grid-template-columns:84px 1fr auto;
  gap:14px;
  border:1px solid var(--line);
  border-radius:18px;
  padding:10px;
  align-items:center;
}
.search-thumb,
.favorite-thumb,
.cart-thumb{
  width:84px;
  aspect-ratio:1/.95;
  border-radius:14px;
  overflow:hidden;
  background:#f4f4f2;
}
.search-thumb img,
.favorite-thumb img,
.cart-thumb img,
.collection-media img,
.catalog-media img,
.product-thumb img,
.main-media img,
.rec-card-media img,
.hero-media img{width:100%;height:100%;object-fit:cover}
.search-meta,
.favorite-meta,
.cart-meta{display:grid;gap:6px;min-width:0}
.item-subtle{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.item-title{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.35rem;
  line-height:1;
}
.item-price{font-weight:600}
.item-link{font-size:.92rem;color:var(--muted)}
.item-link:hover{color:#111}
.item-remove{
  border:1px solid var(--line);
  background:#fff;
  min-height:42px;
  min-width:42px;
  border-radius:999px;
}
.item-remove:hover{background:#f3f3f3}
.empty-copy{
  color:var(--muted);
  line-height:1.7;
  padding:18px 0 2px;
}
.side-drawer{
  position:fixed;
  inset:0 0 0 auto;
  width:min(420px, 100vw);
  background:#fff;
  transform:translateX(101%);
  transition:.32s ease;
  display:flex;
  flex-direction:column;
}
.side-drawer.show{transform:translateX(0)}
.drawer-card{
  height:100%;
  border-radius:0;
  border:0;
  box-shadow:none;
  padding:88px 22px 24px;
  display:flex;
  flex-direction:column;
}
.drawer-footer{
  margin-top:auto;
  padding-top:16px;
  border-top:1px solid var(--line);
  display:grid;
  gap:14px;
}
.cart-total-row{display:flex;justify-content:space-between;gap:16px;font-weight:600}
.qty-stepper{
  display:inline-flex;
  align-items:center;
  border:1px solid var(--line-strong);
  border-radius:14px;
  overflow:hidden;
  min-width:122px;
  height:46px;
}
.qty-stepper button{
  width:42px;
  height:46px;
  border:0;
  background:#fff;
}
.qty-stepper span,
.qty-stepper input{
  flex:1;
  text-align:center;
  border:0;
  background:#fff;
  min-width:0;
}
.qty-stepper input[type="number"]::-webkit-outer-spin-button,
.qty-stepper input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.qty-stepper input[type="number"]{appearance:textfield}

.toast-stack{
  position:fixed;
  right:18px;
  bottom:18px;
  display:grid;
  gap:10px;
}
.toast{
  min-width:260px;
  max-width:360px;
  padding:16px 18px;
  border-radius:16px;
  background:#111;
  color:#fff;
  box-shadow:var(--shadow);
  animation:fadeUp .3s ease;
}
@keyframes fadeUp{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:translateY(0)}
}

.hero-home{
  position:relative;
  min-height:100svh;
  color:#fff;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  overflow:hidden;
}
.hero-media{
  position:absolute;
  inset:0;
}
.hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.58), rgba(0,0,0,.22) 35%, rgba(0,0,0,.12) 60%, rgba(0,0,0,.28));
}
.hero-media img{height:100%;filter:brightness(.86)}
.hero-content{
  position:relative;
  z-index:2;
  text-align:center;
  padding:0 24px 54px;
  max-width:880px;
}
.hero-content .eyebrow{opacity:.86;margin-bottom:14px}
.hero-content p{
  max-width:620px;
  margin:16px auto 22px;
  font-size:1rem;
  line-height:1.8;
  color:rgba(255,255,255,.88);
}

.home-intro{
  padding:74px 0 22px;
  text-align:center;
}
.home-intro .section-title{max-width:920px;margin:0 auto 14px}
.home-intro .section-copy{max-width:720px;margin:0 auto}
.collection-grid,
.catalog-grid,
.recommend-grid,
.benefits-grid,
.about-grid,
.contact-grid{
  display:grid;
  gap:20px;
}
.collection-grid{
  grid-template-columns:repeat(4, minmax(0,1fr));
  padding:0 0 72px;
}
.collection-card,
.catalog-card,
.rec-card{
  display:grid;
  gap:16px;
}
.collection-card:hover .collection-media img,
.catalog-card:hover .catalog-media img,
.rec-card:hover .rec-card-media img{transform:scale(1.03)}
.collection-media,
.catalog-media,
.rec-card-media{
  position:relative;
  overflow:hidden;
  background:#f1f1ee;
}
.collection-media{aspect-ratio:.82}
.catalog-media,
.rec-card-media{aspect-ratio:.84}
.collection-media img,
.catalog-media img,
.rec-card-media img,
.main-media img{transition:transform .45s ease}
.collection-label,
.collection-card h3,
.catalog-card h3,
.rec-card h3{
  text-align:center;
  margin:0;
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.28rem;
  line-height:1.08;
}
.collection-meta,
.catalog-meta,
.rec-card-meta{display:grid;gap:10px}
.catalog-card .price-row,
.rec-card .price-row{
  display:flex;
  gap:10px;
  align-items:flex-end;
  justify-content:flex-start;
  flex-wrap:wrap;
}
.price-now{font-size:1.18rem;font-weight:700}
.price-was{color:#848484;text-decoration:line-through}
.card-top-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.pill,
.stock-pill,
.tag-pill{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  border:1px solid var(--line-strong);
  font-size:.74rem;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.stock-pill.low{background:#111;color:#fff;border-color:#111}
.stock-pill.out{background:#f5f5f5;color:#8a8a8a}
.home-cta-wrap{text-align:center;padding-bottom:84px}

.catalog-page-hero,
.static-hero{
  padding:144px 0 36px;
  background:#fff;
}
.catalog-page-hero .header-copy,
.static-hero .header-copy{
  max-width:680px;
  display:grid;
  gap:14px;
}
.catalog-toolbar{
  padding:16px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 220px 220px;
  gap:12px;
  margin:0 0 26px;
}
.catalog-search{
  min-height:52px;
  border:1px solid var(--line-strong);
  border-radius:16px;
  padding:0 16px;
}
.catalog-select{
  min-height:52px;
  border:1px solid var(--line-strong);
  border-radius:16px;
  padding:0 14px;
  background:#fff;
}
.catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr));padding:0 0 88px}
.catalog-card{
  border:1px solid var(--line);
  border-radius:24px;
  padding:12px 12px 16px;
  background:#fff;
}
.catalog-card[data-card-link]{cursor:pointer}
.catalog-card[data-card-link]:focus-visible{outline:2px solid #111;outline-offset:2px}
.catalog-card .tag-row,
.rec-card .tag-row{display:flex;gap:8px;flex-wrap:wrap}
.catalog-card .catalog-desc,
.rec-card .catalog-desc{color:var(--muted);line-height:1.7;font-size:.95rem}
.catalog-empty{padding:24px 0 90px;color:var(--muted)}

.breadcrumbs{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  color:#888;
  font-size:.9rem;
  padding:124px 0 18px;
}
.breadcrumbs span:last-child{color:#111}
.product-shell{
  display:grid;
  grid-template-columns:94px minmax(0,1fr) minmax(360px, 470px);
  gap:22px;
  align-items:start;
}
.product-gallery{
  display:grid;
  gap:16px;
}
.product-thumbs{
  display:grid;
  gap:12px;
}
.product-thumb{
  width:100%;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  overflow:hidden;
  aspect-ratio:1/1.18;
  padding:0;
}
.product-thumb.active{border-color:#111}
.main-media{
  position:relative;
  background:#f3f2ef;
  min-height:680px;
  border-radius:28px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.main-media img{width:100%;height:100%;object-fit:contain;padding:40px}

.main-media img[hidden]{
  display:none;
}

.media-nav{
  position:absolute;
  inset:50% 14px auto;
  display:flex;
  justify-content:space-between;
  transform:translateY(-50%);
  pointer-events:none;
}
.media-nav button{
  pointer-events:auto;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(15,15,15,.12);
  background:rgba(255,255,255,.9);
}
.product-summary{
  position:sticky;
  top:110px;
  display:grid;
  gap:18px;
}
.brand-mark{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.2rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.product-name{
  margin:0;
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:clamp(2rem, 3vw, 3rem);
  line-height:1.02;
}
.product-summary .price-block{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.product-summary .price-block .price-now{font-size:2rem}
.inline-note{color:var(--muted);line-height:1.75}
.option-group{display:grid;gap:10px}
.option-label{font-weight:600;font-size:.96rem}
.option-chips{display:flex;gap:10px;flex-wrap:wrap}
.option-chip{
  border:1px solid var(--line-strong);
  background:#fff;
  min-height:42px;
  padding:0 16px;
  border-radius:14px;
}
.option-chip.active{background:#111;color:#fff;border-color:#111}
.buy-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.buy-row .dark-btn,
.buy-row .light-btn{flex:1;min-width:220px}
.utility-actions{display:flex;gap:12px;align-items:center}
.utility-actions .icon-only{border:1px solid var(--line-strong)}
.highlight-box{
  border:1px solid #d5c593;
  background:#f5ecd2;
  color:#6b5414;
  border-radius:16px;
  padding:16px;
  line-height:1.65;
}
.viewer-note{display:flex;align-items:center;gap:10px;color:var(--muted)}
.viewer-note svg{width:18px;height:18px}
.accordions{border-top:1px solid var(--line)}
.accordion-item{border-bottom:1px solid var(--line)}
.accordion-toggle{
  width:100%;
  text-align:left;
  background:#fff;
  border:0;
  padding:22px 0;
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
}
.accordion-toggle span:first-child{font-weight:500}
.accordion-content{
  max-height:0;
  overflow:hidden;
  transition:max-height .28s ease;
}
.accordion-content-inner{padding:0 0 22px;color:var(--muted);line-height:1.8}
.product-story{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:40px;
  padding:72px 0 34px;
}
.story-block{display:grid;gap:18px}
.story-block .section-title{font-size:clamp(2rem,3vw,3rem)}
.story-text{color:#3e3e3e;line-height:1.88;font-size:1rem}
.story-text p{margin:0 0 14px}
.fact-card{
  border-radius:22px;
  padding:22px;
  display:grid;
  gap:14px;
  align-content:start;
}
.fact-list{display:grid;gap:16px}
.fact-row{
  display:grid;
  grid-template-columns:28px 1fr;
  gap:12px;
  padding-bottom:16px;
  border-bottom:1px solid var(--line);
}
.fact-row:last-child{padding-bottom:0;border-bottom:0}
.fact-icon{width:28px;height:28px;display:grid;place-items:center}
.fact-icon svg{width:22px;height:22px}
.fact-label{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:#777;margin-bottom:6px}
.fact-value{line-height:1.6}
.benefits-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  padding:28px 0 56px;
}
.benefit-card{padding:24px;text-align:center;display:grid;gap:14px;justify-items:center}
.benefit-card svg{width:48px;height:48px}
.benefit-card h4{margin:0;font-size:1.05rem}
.benefit-card p{margin:0;color:var(--muted);line-height:1.65}
.recommend-section{padding:12px 0 120px}
.recommend-header{text-align:center;display:grid;gap:10px;margin-bottom:28px}
.recommend-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.rec-card{
  border:1px solid var(--line);
  border-radius:24px;
  padding:10px;
  background:#fff;
}

.product-bar{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:950;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(12px);
  border-top:1px solid var(--line);
  transform:translateY(102%);
  transition:.28s ease;
}
.product-bar.show{transform:translateY(0)}
.product-bar-inner{
  width:min(1600px, calc(100% - 24px));
  margin:auto;
  min-height:84px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto auto;
  gap:14px;
  align-items:center;
  padding:10px 0;
}
.bar-product-meta{display:flex;align-items:center;gap:14px;min-width:0}
.bar-product-meta .mini-thumb{
  width:42px;
  height:42px;
  border-radius:10px;
  background:#f2f2ef;
  overflow:hidden;
  flex:0 0 auto;
}
.bar-title{font-family:'Cormorant Garamond',Georgia,serif;font-size:1.6rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-price{font-weight:700;color:#111}
.bar-select{
  min-height:48px;
  border:1px solid var(--line-strong);
  border-radius:14px;
  padding:0 40px 0 14px;
  background:#fff;
  min-width:220px;
}

.static-page{padding:140px 0 100px}
.about-grid{grid-template-columns:1.1fr .9fr;gap:24px}
.about-card{padding:30px}
.contact-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.contact-card{padding:30px}
.contact-list{display:grid;gap:16px;margin-top:18px}
.contact-item strong{display:block;margin-bottom:4px}
.form-grid{display:grid;gap:14px;margin-top:20px}
.input,
.textarea{
  width:100%;
  min-height:54px;
  border:1px solid var(--line-strong);
  border-radius:16px;
  padding:0 16px;
  background:#fff;
}
.textarea{min-height:150px;padding:16px;resize:vertical}
.newsletter-card{padding:30px;margin-top:24px}
.newsletter-form{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.newsletter-form .input{flex:1;min-width:240px}

.site-footer{
  border-top:1px solid var(--line);
  background:#f8f8f6;
}
.footer-main{
  padding:62px 0 24px;
  display:grid;
  grid-template-columns:1.35fr .9fr .9fr 1.05fr;
  gap:32px;
}
.footer-brand-title{
  font-size:2.2rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin:0 0 12px;
}
.footer-col h4{
  margin:0 0 16px;
  font-family:'Cormorant Garamond',Georgia,serif;
  font-size:1.65rem;
}
.footer-col p,
.footer-col a,
.footer-brand-copy{
  color:#444;
  line-height:1.9;
}
.footer-col a{display:block;width:max-content}
.footer-col a:hover{opacity:.6}
.footer-newsletter{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:18px;
}
.footer-newsletter .input{flex:1;min-width:220px;background:transparent}
.footer-social{display:flex;gap:14px;margin-top:22px}
.footer-social a{
  width:42px;
  height:42px;
  border-radius:999px;
  border:1px solid var(--line);
  display:grid;
  place-items:center;
}
.footer-social a:hover{background:#111;color:#fff;border-color:#111}
.footer-bottom{
  border-top:1px solid var(--line);
  padding:18px 0 26px;
  display:flex;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  color:#696969;
}

@media (max-width:1280px){
  .collection-grid,
  .catalog-grid,
  .recommend-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .benefits-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .product-shell{grid-template-columns:80px minmax(0,1fr) minmax(320px,420px)}
}

@media (max-width:1100px){
  .menu-grid,
  .search-grid,
  .about-grid,
  .product-story,
  .footer-main,
  .contact-grid{grid-template-columns:1fr}
  .product-shell{grid-template-columns:1fr}
  .product-gallery{order:1}
  .product-summary{position:static;order:2}
  .product-thumbs{grid-template-columns:repeat(5, minmax(0,1fr));order:2}
  .main-media{min-height:520px;order:1}
  .catalog-toolbar{grid-template-columns:1fr 1fr}
  .catalog-toolbar .catalog-search{grid-column:1/-1}
  .product-bar-inner{grid-template-columns:1fr auto auto}
  .bar-product-meta{grid-column:1/-1}
}

@media (max-width:900px){
  :root{--container:min(100%, calc(100% - 28px));--header-h:76px}
  .site-header .header-bar{grid-template-columns:1fr auto 1fr;width:min(100%, calc(100% - 16px))}
  .site-logo{font-size:2rem}
  .icon-btn span,
  .header-text-link{display:none}
  .home-intro{padding:54px 0 16px}
  .collection-grid,
  .catalog-grid,
  .recommend-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .breadcrumbs{padding-top:104px}
  .main-media{min-height:420px}
  .product-story{padding-top:54px}
  .footer-main{padding-top:48px}
  .hero-content{padding-bottom:40px}
  .product-bar-inner{grid-template-columns:1fr}
  .bar-select,
  .product-bar .qty-stepper,
  .product-bar .dark-btn{width:100%}
}

@media (max-width:640px){
  .collection-grid,
  .recommend-grid,
  .benefits-grid,
  .contact-grid{grid-template-columns:1fr}
  .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .catalog-card{padding:10px 10px 14px;gap:10px}
  .catalog-meta{gap:8px}
  .catalog-card h3{font-size:1.15rem}
  .catalog-card .item-subtle{font-size:.78rem;letter-spacing:.12em}
  .catalog-card .price-row{gap:6px}
  .catalog-card .price-now{font-size:1rem}
  .catalog-card .price-was{font-size:.84rem}
  .catalog-card .tag-row{gap:6px}
  .catalog-card .tag-pill,
  .catalog-card .stock-pill{min-height:24px;padding:0 8px;font-size:.62rem;letter-spacing:.08em}
  .collection-card h3,
  .rec-card h3{font-size:1.55rem}
  .catalog-toolbar{grid-template-columns:1fr}
  .menu-grid,
  .search-grid{gap:28px}
  .hero-content p{font-size:.95rem}
  .main-media{min-height:360px;border-radius:22px}
  .main-media img{padding:24px}
  .product-thumbs{grid-template-columns:repeat(4, minmax(0,1fr))}
  .buy-row{display:grid;grid-template-columns:1fr}
  .utility-actions{justify-content:flex-start}
  .footer-bottom{padding-bottom:92px}
}

/* ===============================
   VUZALKA 2026 LUXURY REDESIGN
   =============================== */
:root{
  --bg:#f8f8f6;
  --bg-soft:#f1ece4;
  --panel:rgba(255,255,255,.82);
  --ink:#0f0f10;
  --muted:#6b675f;
  --line:rgba(15,15,16,.1);
  --line-strong:rgba(15,15,16,.16);
  --accent:#b7a58c;
  --accent-soft:#e6ddd2;
  --shadow:0 26px 80px rgba(15,15,16,.08);
  --radius:28px;
  --radius-lg:38px;
  --container:min(1440px, calc(100% - 64px));
}

body{
  font-family:'Manrope',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:
    radial-gradient(circle at top left, rgba(183,165,140,.12), transparent 28%),
    linear-gradient(180deg, #fbfaf8 0%, #f8f8f6 36%, #f7f5f1 100%);
  color:var(--ink);
}

.serif,
.display-title,
.section-title,
.site-logo,
.item-title,
.footer-brand-title,
.footer-col h4,
.menu-nav a,
.menu-panel-card h3,
.search-panel-card h3,
.drawer-card h3,
.contact-card h3,
.about-card h3,
.newsletter-card h3,
.collection-card h3,
.catalog-card h3,
.rec-card h3,
.brand-mark,
.product-name,
.bar-title{
  font-family:'Cormorant Garamond',Georgia,serif;
}

.display-title{
  font-size:clamp(4rem, 9vw, 7.35rem);
  line-height:.9;
  letter-spacing:.025em;
}

.section-title{
  font-size:clamp(2.2rem, 4vw, 4rem);
  line-height:.96;
}

.section-copy{
  font-size:1rem;
  line-height:1.9;
  color:var(--muted);
}

.eyebrow,
.item-subtle,
.fact-label,
.tag-pill,
.stock-pill,
.hero-note-label,
.module-index,
.featured-count{
  letter-spacing:.22em;
  text-transform:uppercase;
}

.dark-btn,
.light-btn,
.ghost-btn,
.btn{
  min-height:54px;
  border-radius:999px;
  padding:0 24px;
  font-size:.94rem;
}

.dark-btn{
  background:var(--ink);
  border-color:var(--ink);
  color:#fbfaf8;
  box-shadow:0 16px 36px rgba(15,15,16,.12);
}

.dark-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 22px 48px rgba(15,15,16,.18);
}

.light-btn,
.ghost-btn,
.btn{
  background:rgba(255,255,255,.7);
  backdrop-filter:blur(14px);
}

.ghost-btn:hover,
.light-btn:hover,
.btn:hover{
  background:#fff;
}

.site-header{
  color:var(--ink);
}

.site-header:not(.scrolled):not(.solid){
  background:linear-gradient(180deg, rgba(248,248,246,.92), rgba(248,248,246,.25));
  backdrop-filter:blur(12px);
}

.site-header.scrolled,
.site-header.solid{
  background:rgba(248,248,246,.84);
  color:var(--ink);
  border-bottom:1px solid rgba(15,15,16,.08);
  backdrop-filter:blur(18px);
}

.site-logo{
  font-size:clamp(2rem, 3vw, 3.2rem);
  letter-spacing:.16em;
  font-weight:700;
}

.icon-only:hover,
.icon-btn:hover,
.site-header.scrolled .icon-only:hover,
.site-header.solid .icon-only:hover,
.site-header.scrolled .icon-btn:hover,
.site-header.solid .icon-btn:hover{
  background:rgba(15,15,16,.05);
}

.header-badge,
.site-header:not(.scrolled):not(.solid) .header-badge{
  background:var(--ink);
  color:#fff;
}

.menu-panel-card,
.search-panel-card,
.drawer-card,
.contact-card,
.about-card,
.benefit-card,
.fact-card,
.catalog-toolbar,
.newsletter-card,
.catalog-card,
.rec-card,
.collection-card{
  border:1px solid rgba(15,15,16,.08);
  background:rgba(255,255,255,.74);
  backdrop-filter:blur(12px);
  box-shadow:0 16px 44px rgba(15,15,16,.05);
}

.search-item,
.favorite-item,
.cart-item,
.product-thumb,
.option-chip,
.input,
.textarea,
.bar-select,
.search-input,
.item-remove,
.footer-social a,
.menu-close,
.search-close,
.drawer-close{
  border-color:rgba(15,15,16,.1);
}

.hero-home{
  position:relative;
  overflow:hidden;
  min-height:100svh;
  padding:150px 0 90px;
  display:flex;
  align-items:flex-start;
  color:#fff;
  background:
    linear-gradient(90deg,
      rgba(10,10,10,.28) 0%,
      rgba(10,10,10,.14) 32%,
      rgba(10,10,10,.05) 58%,
      rgba(10,10,10,.22) 100%
    ),
    url("assets/hero-inicio.webp") 68% center / cover no-repeat;
}

.hero-home::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0) 30%),
    radial-gradient(circle at 82% 42%, rgba(255,255,255,.08), transparent 24%);
  pointer-events:none;
}

.hero-shell{
  position:relative;
  z-index:2;
  display:block;
}

.hero-copy{
  max-width:760px;
  display:grid;
  gap:20px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  backdrop-filter:none;
  box-shadow:none;
}

.hero-top-label{
  color:rgba(255,255,255,.88);
  text-shadow:0 2px 10px rgba(0,0,0,.18);
}

.hero-title-overlay{
  margin:0;
  color:#fff;
  line-height:.86;
  text-shadow:
    0 14px 34px rgba(0,0,0,.18),
    0 3px 12px rgba(0,0,0,.14);
}

.hero-lead{
  max-width:620px;
  margin:0;
  font-size:1.08rem;
  line-height:1.9;
  color:rgba(255,255,255,.88);
  text-shadow:0 2px 10px rgba(0,0,0,.20);
}

.hero-actions{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  margin-top:6px;
}

.hero-panel,
.hero-notes,
.hero-note-row,
.hero-note-card{
  display:none !important;
}

.hero-composition{
  display:none !important;
}

.hero-frame{
  position:relative;
  overflow:hidden;
  border-radius:34px;
  border:1px solid rgba(15,15,16,.07);
  background:linear-gradient(180deg, rgba(255,255,255,.84), rgba(241,236,228,.85));
  box-shadow:var(--shadow);
}

.hero-frame::after{
  content:"";
  position:absolute;
  inset:auto 14px 14px auto;
  width:92px;
  height:92px;
  border-radius:50%;
  border:1px solid rgba(15,15,16,.08);
  background:radial-gradient(circle at 30% 30%, rgba(255,255,255,.68), rgba(183,165,140,.12));
  filter:blur(.4px);
}

.hero-frame img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:48px;
}

.hero-frame-main{grid-row:1 / span 2}
.hero-frame-tall img{padding:34px}
.hero-frame-small img{padding:26px}

.home-news-strip{padding:0 0 42px}
.home-news-strip-inner{
  align-items:center;
  justify-content:space-between;
  padding:18px 22px;
  border:1px solid rgba(15,15,16,.08);
  border-radius:999px;
  background:rgba(255,255,255,.6);
  backdrop-filter:blur(12px);
}
.home-news-strip-inner p{margin:0;color:#524d46;line-height:1.8}

.home-intro,
.home-universes,
.featured-section,
.editorial-block,
.home-modules{padding:34px 0 34px}

.home-intro-grid,
.section-heading-inline{
  align-items:end;
  justify-content:space-between;
}

.home-intro-grid > *:first-child,
.section-heading-inline > *:first-child{max-width:760px}
.home-intro-grid > .section-copy,
.section-heading-inline > .section-copy,
.featured-heading-side{max-width:440px}

.universe-chip-wrap{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
}

.universe-chip{
  min-height:46px;
  padding:0 18px;
  border-radius:4px;
  border:1px solid rgba(15,15,16,.18);
  background:#fff;
  color:var(--ink);
  font-size:.95rem;
  font-weight:600;
  letter-spacing:.02em;
  transition:.22s ease;
}

.universe-chip:hover{
  background:#f4f4f1;
  border-color:#111;
}

.universe-chip.active{
  background:#111;
  color:#fff;
  border-color:#111;
}

.featured-heading-inline{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:18px;
}

.collection-rail{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(300px, 360px);
  gap:8px;
  overflow-x:auto;
  overflow-y:hidden;
  padding:8px 0 18px;
  scroll-snap-type:x mandatory;
  scrollbar-width:thin;
}

.collection-rail::-webkit-scrollbar{
  height:8px;
}

.collection-rail::-webkit-scrollbar-thumb{
  background:rgba(15,15,16,.18);
  border-radius:999px;
}

.collection-rail .collection-card{
  scroll-snap-align:start;
  min-height:100%;
  padding:0;
  border:none;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.collection-card{
  position:relative;
  padding:10px;
  border-radius:30px;
  overflow:hidden;
}

.collection-media{
  position:relative;
  display:block;
  border-radius:0;
  overflow:hidden;
  background:#efefea;
  aspect-ratio:4 / 5;
}

.collection-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:16px;
  transition:transform .35s ease;
}

.collection-info{
  display:grid;
  gap:8px;
  padding:14px 2px 8px;
}

.collection-card h3{
  margin:2px 0 0;
  font-size:1.28rem;
  line-height:1.02;
}
.collection-meta-row{
  align-items:center;
  justify-content:space-between;
}

.collection-detail-link,
.collection-toggle{
  min-height:40px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(15,15,16,.1);
  background:transparent;
  font-size:.82rem;
  font-weight:600;
}

.collection-detail-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.collection-detail-link:hover,
.collection-toggle:hover{
  background:#fff;
}

.collection-drawer{
  max-height:0;
  overflow:hidden;
  transition:max-height .3s ease, padding .3s ease, opacity .3s ease;
  opacity:0;
  padding:0 6px;
}

.collection-card.is-open .collection-drawer{
  max-height:240px;
  opacity:1;
  padding:4px 6px 10px;
}

.collection-drawer p{
  margin:0 0 12px;
  color:var(--muted);
  line-height:1.8;
}

.collection-drawer-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.collection-drawer-tags span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(183,165,140,.12);
  color:#514a41;
  font-size:.78rem;
}

.editorial-block{
  display:grid;
  grid-template-columns:minmax(360px, .84fr) minmax(0, 1.16fr);
  gap:26px;
  align-items:stretch;
}

.editorial-media,
.editorial-copy{
  border:1px solid rgba(15,15,16,.08);
  border-radius:32px;
  overflow:hidden;
  background:rgba(255,255,255,.72);
  box-shadow:0 18px 50px rgba(15,15,16,.05);
}

.editorial-media{
  min-height:540px;
  background:linear-gradient(180deg, #f1ece4, #e9dfcf);
}

.editorial-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:44px;
}

.editorial-copy{
  padding:44px;
  display:grid;
  align-content:center;
  gap:18px;
}

.module-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.module-card{
  padding:30px;
  border:1px solid rgba(15,15,16,.08);
  border-radius:30px;
  background:rgba(255,255,255,.68);
  box-shadow:0 16px 44px rgba(15,15,16,.04);
  display:grid;
  gap:18px;
}

.module-index{font-size:.72rem;color:var(--muted)}
.module-card h3{margin:0;font-size:1.38rem}
.module-card p{margin:0;line-height:1.8;color:var(--muted)}

.catalog-card,
.rec-card{
  border-radius:28px;
  padding:12px;
}

.catalog-media,
.rec-card-media{
  background:linear-gradient(180deg, #f4f0ea, #ebe4d8);
  border-radius:22px;
}

.catalog-media img,
.rec-card-media img{
  object-fit:contain;
  padding:22px;
}

.main-media,
.favorite-thumb,
.search-thumb,
.cart-thumb,
.product-thumb,
.hero-media,
.contact-card,
.about-card,
.fact-card{
  background:rgba(255,255,255,.76);
}

.site-footer{
  margin-top:52px;
  background:linear-gradient(180deg, rgba(255,255,255,.2), rgba(241,236,228,.75));
}

.footer-main{
  padding:72px 0 30px;
}

.footer-brand-copy,
.footer-col p,
.footer-col a{
  color:#4f4a42;
}

.footer-social a{
  background:rgba(255,255,255,.54);
}

@media (max-width:1280px){
  .hero-shell{grid-template-columns:1fr;gap:28px}
  .hero-copy{max-width:none}
  .hero-composition{min-height:auto;grid-template-columns:1.05fr .95fr}
  .collection-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .module-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
}


@media (max-width:900px){
  :root{--container:min(100%, calc(100% - 28px))}
  .display-title{font-size:clamp(3rem, 16vw, 4.8rem)}
  .section-title{font-size:clamp(2rem, 9vw, 3rem)}

  .hero-home{
  padding-top:118px;
  padding-bottom:54px;
  background:
    linear-gradient(180deg,
      rgba(10,10,10,.22) 0%,
      rgba(10,10,10,.10) 48%,
      rgba(10,10,10,.16) 100%
    ),
    url("assets/hero-inicio.webp") 72% center / cover no-repeat;
}

.hero-copy{
  max-width:none;
}

.hero-title-overlay{
  font-size:clamp(3.1rem, 18vw, 5rem);
  line-height:.9;
}

.hero-lead{
  max-width:100%;
  font-size:1rem;
}

  .hero-composition{display:none}
  .hero-note-card{min-width:unset;flex:1 1 220px}
  .home-news-strip-inner,
  .home-intro-grid,
  .section-heading-inline,
  .featured-heading-side,
  .collection-meta-row{display:grid}

  .featured-heading-inline{
    display:grid;
    gap:10px;
  }

  .universe-heading{
    display:grid;
    gap:12px;
  }
  
  .editorial-block{grid-template-columns:1fr}
  .editorial-media{min-height:380px}
  .module-grid{grid-template-columns:1fr}
}

@media (max-width:640px){
  .hero-actions .dark-btn,
  .hero-actions .ghost-btn,
  .collection-actions,
  .collection-detail-link,
  .collection-toggle{
    width:100%;
  }

  .hero-composition{
    grid-template-columns:1fr 1fr;
    grid-template-rows:280px 160px;
  }

  .hero-frame-main{grid-column:1 / -1;grid-row:auto}
  .hero-frame-tall,
  .hero-frame-small{min-height:160px}
  .home-news-strip{padding-bottom:26px}
  .home-intro,
  .home-universes,
  .featured-section,
  .editorial-block,
  .home-modules{padding:26px 0}
  .collection-rail{
  grid-auto-columns:minmax(240px, 82vw);
  gap:14px;
}
  .collection-card{padding:8px;border-radius:24px}
  .collection-media{border-radius:18px}
  .collection-media img{padding:18px}
  .collection-hover-panel{display:none}
  .collection-card h3{font-size:1.28rem}
  .collection-info{padding:12px 4px 6px;gap:10px}
  .collection-detail-link,
  .collection-toggle{padding:0 10px;font-size:.74rem;min-height:36px}
  .collection-meta-row .price-now{font-size:.96rem}
  .editorial-copy{padding:28px}
  .module-card{padding:24px}
}