/* =====================================================================
   Lu — vidro texturizado (glassmorphism)
   Camada aplicada sobre styles.css e cinematic.css. Não altera a paleta:
   o vidro usa as mesmas tintas da marca (tinta, vinho, marfim) com
   transparência, textura granulada e borda de luz.
   ===================================================================== */
:root{
  --glass-noise:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n' x='0' y='0'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='.33 .33 .33 0 0 .33 .33 .33 0 0 .33 .33 .33 0 0 0 0 0 0 .12'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
  --glass-sheen:linear-gradient(140deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,.04) 36%,rgba(255,255,255,0) 58%);
  --glass-dark-tint:rgba(33,21,18,.34);
  --glass-light-tint:rgba(248,245,240,.72);
  --glass-edge-dark:rgba(255,244,232,.2);
  --glass-edge-light:rgba(255,255,255,.72);
  --glass-blur:blur(14px) saturate(140%) brightness(.9);
  --glass-radius:28px;
  --glass-shadow-dark:inset 0 1px 0 rgba(255,255,255,.2),inset 0 0 0 1px rgba(255,255,255,.03),0 26px 60px -24px rgba(12,7,5,.55);
  --glass-shadow-light:inset 0 1px 0 rgba(255,255,255,.85),0 18px 44px -26px rgba(52,40,37,.35);
  --glass-text-shadow:0 1px 2px rgba(0,0,0,.2);
}

/* ---------- Vidro escuro: textos sobre o filme ---------- */
.hero-copy,.outro-copy,.chapter-panel,.chapter-panel.on-right,.scroll-cue,.hero-edition,.film-pagination,.editorial-caption,.toast{
  background:var(--glass-noise),var(--glass-sheen),linear-gradient(var(--glass-dark-tint),var(--glass-dark-tint));
  -webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);
  border:1px solid var(--glass-edge-dark);box-shadow:var(--glass-shadow-dark);
  text-shadow:var(--glass-text-shadow);
}
.hero-copy,.outro-copy{
  width:auto;max-width:min(640px,50vw);border-radius:var(--glass-radius);
  padding:clamp(26px,2.5vw,40px) clamp(28px,2.9vw,46px) clamp(22px,2.2vw,32px);
  left:calc(var(--cinema-gutter) - 14px);
}
.hero-copy .text-link,.outro-copy .text-link{margin-top:20px}
.chapter-panel,.chapter-panel.on-right{
  width:min(31vw,470px);padding:26px 28px 20px;border-radius:var(--glass-radius);
  left:calc(var(--cinema-gutter) - 14px);
}
.chapter-panel.on-right{left:auto;right:calc(var(--cinema-gutter) - 14px)}
.chapter-panel .text-link{margin-top:14px}
.scroll-cue{padding:10px 20px 10px 14px;border-radius:999px;bottom:40px;left:calc(var(--cinema-gutter) - 14px)}
.scroll-cue .scroll-line{height:30px}
.hero-edition{padding:12px 18px;border-radius:999px;bottom:44px;right:calc(6.5% + 132px)}
.film-pagination{padding:8px 2px;border-radius:999px;right:calc(3.5vw - 20px);text-shadow:none}

/* ---------- Cabeçalho: vidro sem desfoque (sem efeito ao rolar) ---------- */
.site-header,.is-in-film .site-header{
  -webkit-backdrop-filter:none;backdrop-filter:none;
  transition:height .45s var(--cinema-ease);
}
.site-header{
  background:var(--glass-noise),linear-gradient(rgba(246,243,238,.9),rgba(246,243,238,.9));
  border-bottom:1px solid rgba(87,58,43,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 12px 30px -24px rgba(52,40,37,.4);
}
.is-in-film .site-header{
  background:var(--glass-noise),linear-gradient(rgba(33,21,18,.24),rgba(33,21,18,.24));
  border-bottom:1px solid rgba(255,244,232,.16);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.04);
}
.site-header .brand span,.site-header .brand img{transition:none}

/* ---------- Vidro claro: superfícies do catálogo ---------- */
.collection-tabs{
  background:var(--glass-noise),linear-gradient(rgba(246,243,238,.9),rgba(246,243,238,.9));
  border:1px solid var(--glass-edge-light);border-radius:20px;box-shadow:var(--glass-shadow-light);
  padding:0 26px;top:calc(var(--header-height) + 10px);
}
.site-header.is-compact~main .collection-tabs{top:74px}
.collection-tabs a[aria-current=page]:after{bottom:-1px}
.product-piece-preview{
  background:var(--glass-noise),linear-gradient(rgba(255,255,255,.42),rgba(255,255,255,.42));
  border:1px solid var(--glass-edge-light);border-radius:22px;box-shadow:var(--glass-shadow-light);
  padding:12px 16px 12px 12px;
}
.product-piece-preview>img{border-radius:14px}
.product-card-photo .favorite-button,.image-expand{
  background:var(--glass-noise),linear-gradient(rgba(250,247,242,.72),rgba(250,247,242,.72));
  border:1px solid var(--glass-edge-light);box-shadow:var(--glass-shadow-light);
}
.product-actions .favorite-button{
  border-radius:16px;border-color:rgba(87,58,43,.16);
  background:var(--glass-noise),linear-gradient(rgba(255,255,255,.45),rgba(255,255,255,.45));
  box-shadow:var(--glass-shadow-light);
}
.quantity-control{
  border-radius:999px;border-color:rgba(87,58,43,.16);overflow:hidden;
  background:var(--glass-noise),linear-gradient(rgba(255,255,255,.5),rgba(255,255,255,.5));
}

/* Botão principal: vidro vinho, mesma cor da marca */
.primary-button{
  background:var(--glass-noise),var(--glass-sheen),linear-gradient(rgba(136,77,73,.95),rgba(136,77,73,.95));
  border:1px solid rgba(255,255,255,.16);border-radius:16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 16px 30px -18px rgba(103,55,51,.7);
  transition:background .25s,box-shadow .25s,transform .25s;
}
.primary-button:hover{background:var(--glass-noise),var(--glass-sheen),linear-gradient(rgba(103,55,51,.97),rgba(103,55,51,.97))}
.primary-button:disabled{opacity:.55;cursor:not-allowed}

/* Painel lateral e diálogos */
.side-dialog{
  background:var(--glass-noise),linear-gradient(rgba(248,245,240,.84),rgba(248,245,240,.84));
  -webkit-backdrop-filter:blur(22px) saturate(120%);backdrop-filter:blur(22px) saturate(120%);
  border-left:1px solid var(--glass-edge-light);border-radius:28px 0 0 28px;
  box-shadow:inset 1px 0 0 rgba(255,255,255,.7),-24px 0 60px -30px rgba(28,20,16,.45);
}
.gallery-dialog{border-radius:28px;border:1px solid var(--glass-edge-light)}
.lightbox-image{border-radius:18px}

/* Aviso */
.toast{border-radius:999px;color:var(--paper)}

/* Rodapé: placa de vidro vinho */
.site-footer{
  background:var(--glass-noise),var(--glass-sheen),linear-gradient(rgba(103,55,51,.97),rgba(103,55,51,.97));
  border-radius:34px 34px 0 0;box-shadow:inset 0 1px 0 rgba(255,255,255,.14);
}

/* Cartão editorial da coleção: legenda em vidro no lugar do degradê */
.editorial-product-card{border-radius:4px}
.editorial-product-card:after{content:none}
.editorial-caption{
  position:absolute;left:18px;right:18px;bottom:18px;z-index:1;border-radius:20px;
  padding:16px 20px 18px;display:flex;flex-direction:column;gap:6px;color:#fff;
}
.editorial-caption>span{font-size:10px;text-transform:uppercase;letter-spacing:.16em}
.editorial-caption>em{font-family:var(--serif);font-size:clamp(28px,2.6vw,42px);line-height:1}

@media(max-width:1100px) and (min-width:761px){
  .chapter-panel,.chapter-panel.on-right{width:34%;padding:22px 22px 16px}
}
@media(max-width:760px){
  :root{--glass-blur:blur(12px) saturate(140%) brightness(.9);--glass-radius:22px}
  .hero-copy,.outro-copy{left:4.5%;width:calc(91% - 18px);max-width:none;padding:22px 20px 16px;bottom:19%}
  .hero-copy h1{font-size:clamp(50px,14.6vw,86px)}
  .chapter-panel,.chapter-panel.on-right{left:4.5%;right:auto;width:calc(91% - 18px);padding:16px 16px 10px;bottom:4.5%}
  .scroll-cue{left:4.5%;bottom:28px;padding:8px 16px 8px 12px}
  .film-pagination{right:2px;padding:6px 0}
  .collection-tabs{padding:0 18px;border-radius:16px}
  .site-header.is-compact~main .collection-tabs{top:66px}
  .side-dialog{border-radius:24px 0 0 24px}
  .editorial-caption{left:10px;right:10px;bottom:10px;padding:12px 14px;border-radius:16px}
  .editorial-caption>span{font-size:8px;line-height:1.6}
  .editorial-caption>em{font-size:26px}
}
@media(max-height:700px) and (max-width:760px){
  .chapter-panel,.chapter-panel.on-right{padding:12px 14px 8px}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .hero-copy,.outro-copy,.chapter-panel,.scroll-cue,.hero-edition,.film-pagination,.editorial-caption,.toast{--glass-dark-tint:rgba(33,21,18,.62)}
}
