/* ==========================================================================
   KASA3 — Page & section layouts
   ========================================================================== */

.view{ display:none; }
.view.is-active{ display:block; }

/* ---------- Hero ---------- */
.hero{
  position:relative;
  min-height:100vh;
  display:grid;
  grid-template-columns:1fr;
  overflow:hidden;
  background:var(--ink-950);
}
.hero__media{
  position:absolute; inset:0;
  overflow:hidden;
  opacity:1;
}
.hero__scrim{
  position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(5,5,5,0.96) 0%, rgba(5,5,5,0.82) 42%, rgba(5,5,5,0.55) 68%, rgba(5,5,5,0.78) 100%);
}
.hero__content{
  position:relative;
  z-index:2;
  max-width:var(--container);
  margin-inline:auto;
  width:100%;
  padding-inline:var(--gutter);
  min-height:100vh;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding-bottom:clamp(64px, 9vw, 120px);
  padding-top:calc(var(--header-h) + 40px);
}
@media (max-width:768px){
  .hero__content{
    padding-top:calc(var(--header-h) + 36px);
    padding-bottom:24px;
    transform:translateY(-30px);
  }
}
.hero__eyebrow{ overflow:hidden; margin-bottom:20px; }
.hero__eyebrow span{ display:inline-block; font-size:var(--step--1); letter-spacing:0.04em; color:var(--gold-pale); }
.hero__title{
  font-size:clamp(2.6rem, 2rem + 4.4vw, 6.2rem);
  font-weight:500;
  line-height:0.98;
  max-width:14ch;
  overflow:hidden;
}
.hero__title span{ display:block; overflow:hidden; }
.hero__title span em{ font-style:italic; font-weight:400; color:var(--gold-pale); }
.hero__foot{
  margin-top:38px;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  flex-wrap:wrap;
}
.hero__foot .lede{ color:var(--ivory-dim); max-width:38ch; }
.hero__scroll-cue{
  display:flex; align-items:center; gap:10px;
  color:var(--ivory-faint); font-size:12px; letter-spacing:0.04em;
}
.hero__scroll-cue .line{ width:1px; height:34px; background:linear-gradient(180deg, var(--gold), transparent); }

/* ---------- Marquee strip (destaques) ---------- */
.strip{
  border-top:1px solid var(--ink-line);
  border-bottom:1px solid var(--ink-line);
  padding-block:18px;
  overflow:hidden;
  background:var(--ink-900);
}
.strip__track{
  display:flex; gap:56px; white-space:nowrap;
  animation:marquee 34s linear infinite;
  width:max-content;
}
.strip__track span{ font-family:var(--f-display); font-size:var(--step-1); color:var(--text-faint); font-style:italic; }
.strip__track span strong{ color:var(--text); font-style:normal; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .strip__track{ animation:none; } }

/* ---------- Product grid (asymmetric) ---------- */
.product-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:clamp(20px, 2.4vw, 34px);
}
.product-grid.is-featured-lead .product-card:first-child{
  grid-column:span 2; grid-row:span 2;
}
.product-grid.is-featured-lead .product-card:first-child .product-card__frame{ aspect-ratio:1/1.28; }
@media (max-width:980px){
  .product-grid{ grid-template-columns:repeat(2, 1fr); }
  .product-grid.is-featured-lead .product-card:first-child{ grid-column:span 2; grid-row:auto; }
  .product-grid.is-featured-lead .product-card:first-child .product-card__frame{ aspect-ratio:16/9; }
}
@media (max-width:560px){
  .product-grid{ grid-template-columns:1fr 1fr; gap:16px; }
}

/* ---------- Institutional block ---------- */
.institutional{
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:clamp(32px, 6vw, 100px);
  align-items:center;
}
.institutional__figure{ font-family:var(--f-display); font-size:clamp(3rem, 2.4rem + 3vw, 6rem); line-height:1; color:var(--gold-pale); }
.institutional__label{ margin-top:12px; color:var(--text-faint); font-size:var(--step--1); max-width:26ch; }
.institutional__quote{ font-family:var(--f-display); font-size:var(--step-3); line-height:1.3; font-weight:400; }
@media (max-width:900px){ .institutional{ grid-template-columns:1fr; } }

/* ---------- Atendimento (contact strip) ---------- */
.contact-strip{
  display:grid; grid-template-columns:repeat(2, 1fr); gap:1px;
  background:var(--ink-line);
  border:1px solid var(--ink-line);
}
.contact-strip__item{ background:var(--ink-950); padding:34px; }
.contact-strip__item h4{ margin-bottom:10px; }
.contact-strip__item p{ color:var(--text-faint); font-size:var(--step--1); margin-bottom:16px; }
@media (max-width:700px){ .contact-strip{ grid-template-columns:1fr; } }

/* ---------- Shop layout ---------- */
.shop-layout{ display:grid; grid-template-columns:248px 1fr; gap:56px; align-items:start; }
@media (max-width:900px){ .shop-layout{ grid-template-columns:1fr; } }

.shop-header{
  padding-top:calc(var(--header-h) + 30px);
  padding-bottom:24px;
}
.shop-header .breadcrumb{ margin-bottom:18px; }

/* ---------- PDP ---------- */
.pdp{ padding-top:calc(var(--header-h) + 30px); }
.pdp-layout{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:clamp(32px, 5vw, 80px);
  align-items:start;
}
@media (max-width:900px){ .pdp-layout{ grid-template-columns:1fr; } }
.pdp-info__brand{ color:var(--text-faint); font-size:var(--step--1); letter-spacing:0.02em; }
.pdp-info__name{ margin-top:8px; margin-bottom:16px; }
.pdp-info__price-row{ display:flex; align-items:baseline; gap:12px; margin-bottom:6px; }
.pdp-info__price{ font-family:var(--f-display); font-size:var(--step-3); }
.pdp-info__price-old{ color:var(--text-faint); text-decoration:line-through; font-size:var(--step-0); }
.pdp-info__installments{ color:var(--text-dim); font-size:var(--step--1); margin-bottom:26px; }
.pdp-info__meta{ display:flex; gap:22px; color:var(--text-faint); font-size:12px; margin-bottom:26px; flex-wrap:wrap; }
.pdp-info__qty-row{ display:flex; align-items:center; gap:16px; margin-bottom:20px; }
.qty-selector{ display:inline-flex; align-items:center; border:1px solid var(--ink-line-strong); }
.qty-selector button{ width:38px; height:44px; display:flex; align-items:center; justify-content:center; }
.qty-selector span{ min-width:36px; text-align:center; }
.pdp-info__actions{ display:flex; gap:12px; margin-bottom:28px; flex-wrap:wrap; }
.pdp-info__actions .btn{ flex:1; min-width:180px; }
.pdp-info__delivery{ border:1px solid var(--ink-line); padding:18px; display:flex; gap:14px; align-items:flex-start; margin-bottom:8px; }
.pdp-info__delivery svg{ flex-shrink:0; margin-top:2px; color:var(--gold-pale); }
.pdp-info__delivery strong{ display:block; font-size:var(--step--1); margin-bottom:2px; }
.pdp-info__delivery span{ font-size:12px; color:var(--text-faint); }
.pdp-accordions{ margin-top:8px; }
.related-heading{ margin-top:clamp(60px,8vw,110px); margin-bottom:32px; }

/* ---------- Cart page ---------- */
.cart-page{ padding-top:calc(var(--header-h) + 30px); }
.cart-page-layout{ display:grid; grid-template-columns:1.5fr 0.9fr; gap:56px; align-items:start; }
@media (max-width:900px){ .cart-page-layout{ grid-template-columns:1fr; } }
.order-summary{ border:1px solid var(--ink-line); padding:28px; position:sticky; top:calc(var(--header-h) + 24px); }
.promo-row{ display:flex; gap:10px; margin:18px 0; }
.promo-row input{ flex:1; }

/* ---------- Checkout ---------- */
.checkout{ padding-top:calc(var(--header-h) + 30px); }
.checkout-layout{ display:grid; grid-template-columns:1.4fr 0.9fr; gap:56px; align-items:start; }
@media (max-width:900px){ .checkout-layout{ grid-template-columns:1fr; } }
.checkout-step{ display:none; }
.checkout-step.is-active{ display:block; }
.checkout-step h3{ margin-bottom:24px; }
.checkout-actions{ display:flex; justify-content:space-between; margin-top:36px; }
.review-block{ border:1px solid var(--ink-line); padding:20px 22px; margin-bottom:16px; }
.review-block__head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.review-block__head button{ font-size:12px; color:var(--gold-pale); }
.review-block p{ color:var(--text-dim); font-size:var(--step--1); line-height:1.7; }
.confirmation{ text-align:center; padding-block:60px; }
.confirmation__mark{ width:64px; height:64px; border:1px solid var(--gold-line); border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 28px; color:var(--gold-pale); }

/* ---------- About / Sobre ---------- */
.about-hero{ padding-top:calc(var(--header-h) + 60px); padding-bottom:40px; }
.placeholder-block{
  border:1px dashed var(--ink-line-strong);
  padding:28px;
  color:var(--text-faint);
  font-size:var(--step--1);
}
.placeholder-block strong{ display:block; color:var(--text-dim); margin-bottom:6px; }

/* ---------- Contact page ---------- */
.contact-layout{ display:grid; grid-template-columns:1fr 0.9fr; gap:64px; align-items:start; padding-top:calc(var(--header-h) + 60px); }
@media (max-width:900px){ .contact-layout{ grid-template-columns:1fr; } }
.contact-info-item{ display:flex; gap:16px; padding-block:20px; border-bottom:1px solid var(--ink-line); }
.contact-info-item svg{ color:var(--gold-pale); flex-shrink:0; margin-top:3px; }
.contact-info-item strong{ display:block; margin-bottom:3px; }
.contact-info-item span{ color:var(--text-faint); font-size:var(--step--1); }

/* ---------- Search results view ---------- */
.search-view{ padding-top:calc(var(--header-h) + 30px); }