/* =============================================================
   VELLORE — SISTEMA VISUAL
   Boutique premium · dark editorial · detalhes champagne
   ============================================================= */

/* ---------- 1. TOKENS ---------------------------------------- */
:root{
  /* cores */
  --black:        #050505;
  --black-soft:   #0B0B0B;
  --graphite:     #151515;
  --graphite-2:   #1D1D1D;
  --gold:         #C9A36A;
  --gold-light:   #D8BA89;
  --beige:        #D7C2A3;
  --white-warm:   #F5F1EB;
  --gray:         #9C9C9C;
  --gray-dark:    #6A6A6A;
  --line:         rgba(201,163,106,.20);
  --line-soft:    rgba(245,241,235,.10);

  /* tipografia */
  --font-display: 'Cormorant Garamond', 'Playfair Display', Georgia, 'Times New Roman', serif;
  --font-body:    'Inter', 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* medidas */
  --header-h:     72px;
  --topbar-h:     34px;
  --shell:        1400px;
  --gutter:       clamp(18px, 4vw, 56px);

  /* movimento */
  --ease:         cubic-bezier(.22,.61,.36,1);
  --t-fast:       .2s var(--ease);
  --t:            .32s var(--ease);
  --t-slow:       .6s var(--ease);

  --radius:       2px;
  --z-header:     600;
  --z-drawer:     800;
  --z-modal:      900;
  --z-toast:      1000;
}

/* ---------- 2. RESET ----------------------------------------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
html,body{ max-width:100%; overflow-x:clip; }
body{
  margin:0;
  background:var(--black);
  color:var(--white-warm);
  font-family:var(--font-body);
  font-size:15px;
  font-weight:300;
  line-height:1.65;
  letter-spacing:.01em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body.no-scroll{ overflow:hidden; }
img{ max-width:100%; display:block; }
button,input,select,textarea{ font:inherit; color:inherit; }
button{ background:none; border:0; cursor:pointer; padding:0; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; margin:0; padding:0; }
h1,h2,h3,h4{ margin:0; font-weight:300; font-family:var(--font-display); line-height:1.05; }
p{ margin:0; }
svg{ display:block; }
::selection{ background:var(--gold); color:var(--black); }

/* scrollbar discreta */
*::-webkit-scrollbar{ width:6px; height:6px; }
*::-webkit-scrollbar-track{ background:transparent; }
*::-webkit-scrollbar-thumb{ background:rgba(201,163,106,.28); border-radius:99px; }
*::-webkit-scrollbar-thumb:hover{ background:rgba(201,163,106,.5); }

/* ---------- 3. UTILIDADES ------------------------------------ */
.shell{ width:100%; max-width:var(--shell); margin-inline:auto; padding-inline:var(--gutter); }
.eyebrow{
  font-size:10px; letter-spacing:.42em; text-transform:uppercase;
  color:var(--gold); font-weight:400;
}
.muted{ color:var(--gray); }
.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;
}
.hairline{ height:1px; background:var(--line-soft); border:0; margin:0; }

.display{
  font-family:var(--font-display);
  font-weight:300;
  letter-spacing:.005em;
  line-height:1.02;
}

/* reveal on scroll */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }
.reveal[data-delay="1"]{ transition-delay:.08s }
.reveal[data-delay="2"]{ transition-delay:.16s }
.reveal[data-delay="3"]{ transition-delay:.24s }
@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.01ms !important; transition-duration:.01ms !important; }
  .reveal{ opacity:1; transform:none; }
}

/* imagem com skeleton */
.ph{ position:relative; overflow:hidden; background:var(--graphite); }
.ph::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.045) 42%,transparent 62%);
  background-size:220% 100%;
  animation:shimmer 1.5s infinite linear;
  pointer-events:none;
}
.ph.is-loaded::after{ display:none; }
.ph img{ opacity:0; transition:opacity .5s var(--ease), transform 1.1s var(--ease); }
.ph.is-loaded img{ opacity:1; }
@keyframes shimmer{ from{background-position:120% 0} to{background-position:-120% 0} }

/* ---------- 4. BOTÕES ---------------------------------------- */
.btn{
  --btn-fg:var(--white-warm);
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  min-height:48px; padding:0 28px;
  border:1px solid var(--line);
  color:var(--btn-fg); background:transparent;
  font-size:11px; font-weight:400; letter-spacing:.26em; text-transform:uppercase;
  border-radius:var(--radius);
  position:relative; overflow:hidden;
  transition:color var(--t), border-color var(--t);
}
.btn::before{
  content:''; position:absolute; inset:0; background:var(--gold);
  transform:scaleX(0); transform-origin:left; transition:transform var(--t);
}
.btn > *{ position:relative; z-index:1; }
.btn:hover{ color:var(--black); border-color:var(--gold); }
.btn:hover::before{ transform:scaleX(1); }
.btn:focus-visible{ outline:1px solid var(--gold); outline-offset:3px; }

.btn--gold{ background:var(--gold); border-color:var(--gold); color:var(--black); }
.btn--gold::before{ background:var(--gold-light); }
.btn--gold:hover{ color:var(--black); }
.btn--block{ width:100%; }
.btn--sm{ min-height:40px; padding:0 18px; font-size:10px; letter-spacing:.2em; }
.btn--ghost{ border-color:var(--line-soft); }
.btn[disabled]{ opacity:.4; pointer-events:none; }

.link-gold{
  display:inline-flex; align-items:center; gap:10px;
  font-size:10.5px; letter-spacing:.28em; text-transform:uppercase; color:var(--gold);
  padding-bottom:4px; position:relative;
}
.link-gold::after{
  content:''; position:absolute; left:0; bottom:0; height:1px; width:100%;
  background:var(--gold); transform:scaleX(0); transform-origin:right; transition:transform var(--t);
}
.link-gold:hover::after{ transform:scaleX(1); transform-origin:left; }
.link-gold .arrow{ transition:transform var(--t); }
.link-gold:hover .arrow{ transform:translateX(5px); }

/* ---------- 5. TOPBAR ---------------------------------------- */
.topbar{
  height:var(--topbar-h);
  background:linear-gradient(90deg,#8E7343,var(--gold) 40%,var(--gold-light) 60%,#8E7343);
  color:#120E07;
  display:flex; align-items:center; justify-content:center;
  overflow:hidden; position:relative; z-index:calc(var(--z-header) + 1);
}
.topbar__track{ display:flex; align-items:center; gap:26px; }
.topbar__item{
  font-size:9.5px; font-weight:500; letter-spacing:.26em; text-transform:uppercase; white-space:nowrap;
}
.topbar__sep{ opacity:.45; font-size:9px; }
@media (max-width:760px){
  .topbar__track{ animation:marquee 16s linear infinite; will-change:transform; }
  .topbar__item{ font-size:9px; letter-spacing:.2em; }
}
@keyframes marquee{ from{transform:translateX(18%)} to{transform:translateX(-58%)} }

/* ---------- 6. HEADER ---------------------------------------- */
.header{
  position:sticky; top:0; z-index:var(--z-header);
  background:rgba(5,5,5,.72);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:background var(--t), border-color var(--t);
}
.header.is-stuck{ background:rgba(5,5,5,.96); border-bottom-color:var(--line-soft); }
.header__bar{
  height:var(--header-h);
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:16px;
}
.header__side{ display:flex; align-items:center; gap:6px; }
.header__side--right{ justify-content:flex-end; }

.icon-btn{
  width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center;
  color:var(--white-warm); border-radius:50%; position:relative;
  transition:color var(--t), background var(--t);
}
.icon-btn:hover{ color:var(--gold); background:rgba(201,163,106,.08); }
.icon-btn svg{ width:19px; height:19px; }
.icon-btn__label{
  font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gray);
}
.search-trigger{ width:auto; padding:0 14px 0 10px; gap:10px; border-radius:99px; }
@media (max-width:900px){ .search-trigger .icon-btn__label{ display:none; } .search-trigger{ width:42px; padding:0; } }

.badge{
  position:absolute; top:5px; right:4px;
  min-width:16px; height:16px; padding:0 4px;
  background:var(--gold); color:var(--black);
  font-size:9px; font-weight:600; letter-spacing:0;
  border-radius:99px; display:flex; align-items:center; justify-content:center;
}
.badge.is-empty{ display:none; }
.badge.pop{ animation:badgePop .45s var(--ease); }
@keyframes badgePop{ 0%{transform:scale(1)} 35%{transform:scale(1.55)} 100%{transform:scale(1)} }

/* logo */
.logo{ display:flex; flex-direction:column; align-items:center; gap:3px; padding:6px 4px; }
.logo__row{ display:flex; align-items:center; gap:12px; }
.logo__mark{ width:30px; height:30px; color:var(--gold); flex:none; }
.logo__name{
  font-family:var(--font-display); font-size:clamp(21px,2.6vw,29px);
  letter-spacing:.36em; text-indent:.36em; color:var(--white-warm); line-height:1;
}
.logo__tagline{ font-size:7.5px; letter-spacing:.44em; color:var(--gold); text-indent:.44em; }
.logo img.logo__custom{ height:34px; width:auto; }

/* nav */
.nav{ border-top:1px solid var(--line-soft); }
.nav__list{ display:flex; align-items:center; justify-content:center; gap:clamp(18px,3vw,44px); height:46px; }
.nav__link{
  font-size:10.5px; letter-spacing:.28em; text-transform:uppercase; color:rgba(245,241,235,.82);
  position:relative; padding:4px 0; transition:color var(--t);
}
.nav__link::after{
  content:''; position:absolute; left:0; right:0; bottom:-2px; height:1px; background:var(--gold);
  transform:scaleX(0); transform-origin:right; transition:transform var(--t);
}
.nav__link:hover{ color:var(--gold-light); }
.nav__link:hover::after{ transform:scaleX(1); transform-origin:left; }
@media (max-width:900px){ .nav{ display:none; } }

/* burger */
.burger{ display:none; }
.burger span{ display:block; width:20px; height:1px; background:currentColor; transition:transform var(--t), opacity var(--t); }
.burger span + span{ margin-top:5px; }
.burger.is-open span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.burger.is-open span:nth-child(2){ opacity:0; }
.burger.is-open span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }
@media (max-width:900px){
  .burger{ display:inline-flex; flex-direction:column; align-items:center; justify-content:center; }
  .header__bar{ height:64px; }
  .logo__name{ letter-spacing:.3em; text-indent:.3em; }
}

/* menu mobile */
.mobile-menu{
  position:fixed; inset:0; z-index:var(--z-drawer);
  background:var(--black); padding:calc(var(--header-h) + 26px) var(--gutter) 40px;
  transform:translateX(-100%); transition:transform .42s var(--ease);
  overflow-y:auto; overscroll-behavior:contain;
  display:flex; flex-direction:column;
}
.mobile-menu.is-open{ transform:none; }
.mobile-menu__close{ position:absolute; top:18px; right:14px; }
.mobile-menu__list{ display:flex; flex-direction:column; }
.mobile-menu__list a{
  font-family:var(--font-display); font-size:30px; letter-spacing:.06em;
  padding:14px 0; border-bottom:1px solid var(--line-soft); color:var(--white-warm);
  display:flex; align-items:center; justify-content:space-between;
}
.mobile-menu__list a span{ font-size:11px; color:var(--gold); font-family:var(--font-body); letter-spacing:.2em; }
.mobile-menu__foot{ margin-top:auto; padding-top:32px; display:flex; flex-direction:column; gap:16px; }

/* ---------- 7. BUSCA ----------------------------------------- */
.search{
  position:fixed; inset:0; z-index:var(--z-modal);
  background:rgba(5,5,5,.96); backdrop-filter:blur(8px);
  opacity:0; visibility:hidden; transition:opacity var(--t), visibility var(--t);
  display:flex; flex-direction:column;
}
.search.is-open{ opacity:1; visibility:visible; }
.search__head{ border-bottom:1px solid var(--line-soft); }
.search__field{ display:flex; align-items:center; gap:14px; height:88px; }
.search__field svg{ width:20px; height:20px; color:var(--gold); flex:none; }
.search__input{
  flex:1; min-width:0; background:none; border:0; outline:0;
  font-family:var(--font-display); font-size:clamp(22px,4vw,38px); font-weight:300;
  color:var(--white-warm);
}
.search__input::placeholder{ color:var(--gray-dark); }
.search__body{ flex:1; overflow-y:auto; padding-block:26px 60px; }
.search__hint{ font-size:12px; color:var(--gray); }
.search__tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.tag{
  border:1px solid var(--line-soft); border-radius:99px; padding:7px 15px;
  font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--gray);
  transition:color var(--t), border-color var(--t);
}
.tag:hover{ color:var(--gold); border-color:var(--line); }
.search__results{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:26px 20px; margin-top:26px; }

/* ---------- 8. HERO ------------------------------------------ */
.hero{ position:relative; height:clamp(560px,86vh,880px); overflow:hidden; background:var(--black); }
.hero__slide{
  position:absolute; inset:0; opacity:0; visibility:hidden;
  transition:opacity 1s var(--ease), visibility 1s;
}
.hero__slide.is-active{ opacity:1; visibility:visible; }
.hero__media{ position:absolute; inset:0; }
.hero__media img{
  width:100%; height:100%; object-fit:cover; object-position:50% 25%;
  transform:scale(1.06); transition:transform 8s linear;
}
.hero__slide.is-active .hero__media img{ transform:scale(1.14); }
.hero__media::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(5,5,5,.95) 0%, rgba(5,5,5,.82) 30%, rgba(5,5,5,.35) 58%, rgba(5,5,5,.18) 100%),
    linear-gradient(to top, rgba(5,5,5,.95) 0%, transparent 42%);
}
.hero__inner{ position:relative; height:100%; display:flex; align-items:center; }
.hero__content{ max-width:820px; }
.hero__title{
  font-size:clamp(34px,5.6vw,70px); line-height:1.02; margin-top:22px; letter-spacing:.01em;
}
.hero__title em{ font-style:normal; color:var(--gold-light); display:block; }
.hero__text{ margin-top:20px; max-width:420px; color:rgba(245,241,235,.72); font-size:14.5px; }
.hero__cta{ margin-top:34px; }
.hero__slide.is-active .hero__content > *{ animation:heroIn .9s var(--ease) both; }
.hero__slide.is-active .hero__content > *:nth-child(2){ animation-delay:.1s }
.hero__slide.is-active .hero__content > *:nth-child(3){ animation-delay:.2s }
.hero__slide.is-active .hero__content > *:nth-child(4){ animation-delay:.3s }
@keyframes heroIn{ from{opacity:0; transform:translateY(26px)} to{opacity:1; transform:none} }

.hero__dots{
  position:absolute; left:var(--gutter); bottom:34px; display:flex; gap:10px; z-index:2;
}
.hero__dot{ width:38px; height:2px; background:rgba(245,241,235,.24); transition:background var(--t); }
.hero__dot.is-active{ background:var(--gold); }
.hero__arrows{ position:absolute; right:var(--gutter); bottom:26px; display:flex; gap:8px; z-index:2; }
.hero__arrow{
  width:46px; height:46px; border:1px solid var(--line-soft); display:flex; align-items:center; justify-content:center;
  color:var(--white-warm); transition:border-color var(--t), color var(--t), background var(--t);
}
.hero__arrow:hover{ border-color:var(--gold); color:var(--gold); background:rgba(201,163,106,.08); }
@media (max-width:760px){
  .hero{ height:auto; min-height:620px; }
  .hero__media::after{
    background:
      linear-gradient(180deg, rgba(5,5,5,.72) 0%, rgba(5,5,5,.35) 34%, rgba(5,5,5,.86) 78%, var(--black) 100%);
  }
  .hero__inner{ align-items:flex-end; padding-block:120px 96px; }
  .hero__content{ max-width:100%; }
  .hero__arrows{ display:none; }
  .hero__dots{ bottom:26px; }
  .hero__dot{ width:30px; }
}

/* status da loja */
.store-status{
  display:inline-flex; align-items:center; gap:9px;
  font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--gray);
}
.store-status .dot{ width:6px; height:6px; border-radius:50%; background:var(--gray-dark); }
.store-status.is-open .dot{ background:#5FBF7E; box-shadow:0 0 0 3px rgba(95,191,126,.16); }
.store-status.is-open{ color:rgba(245,241,235,.8); }

/* ---------- 9. CATEGORIAS ------------------------------------ */
.cats{ display:grid; grid-template-columns:repeat(3,1fr); gap:2px; background:var(--black); }
.cat{
  position:relative; min-height:clamp(280px,32vw,400px); overflow:hidden; display:block;
  background:var(--graphite);
}
.cat img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 20%;
  transition:transform 1.2s var(--ease); }
.cat::after{
  content:''; position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(5,5,5,.97) 0%, rgba(5,5,5,.88) 40%, rgba(5,5,5,.55) 68%, rgba(5,5,5,.2) 100%),
    linear-gradient(to top, rgba(5,5,5,.55), transparent 55%);
  transition:background var(--t);
}
.cat:hover img{ transform:scale(1.07); }
.cat:hover::after{ background:
    linear-gradient(90deg, rgba(5,5,5,.97) 0%, rgba(5,5,5,.82) 38%, rgba(5,5,5,.4) 76%, rgba(5,5,5,.2) 100%),
    linear-gradient(to top, rgba(5,5,5,.55), transparent 55%); }
.cat__inner{ position:relative; z-index:1; height:100%; display:flex; flex-direction:column; justify-content:center;
  padding:clamp(24px,3vw,44px); gap:12px; }
.cat__title{ font-size:clamp(22px,2.2vw,30px); letter-spacing:.12em; color:var(--gold-light); }
.cat__text{ font-size:13.5px; color:rgba(245,241,235,.8); max-width:190px; }
.cat__cta{ margin-top:10px; }
@media (max-width:900px){
  .cats{ grid-template-columns:1fr; }
  .cat{ min-height:230px; }
  .cat__text{ max-width:60%; }
}

/* ---------- 10. SEÇÕES --------------------------------------- */
.section{ padding-block:clamp(64px,8vw,110px); position:relative; }
.section--tight{ padding-block:clamp(48px,6vw,76px); }
.section--soft{ background:var(--black-soft); }
.section__head{ text-align:center; display:flex; flex-direction:column; align-items:center; gap:12px; margin-bottom:clamp(34px,4vw,54px); }
.section__title{ font-size:clamp(30px,4.6vw,52px); letter-spacing:.14em; text-indent:.14em; }
.section__sub{ color:var(--gray); font-size:14px; max-width:520px; }
.section__head--left{ text-align:left; align-items:flex-start; }

/* filtros de coleção */
.filters{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-bottom:34px; }
.filter{
  border:1px solid var(--line-soft); padding:9px 18px; border-radius:99px;
  font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--gray);
  transition:all var(--t);
}
.filter:hover{ color:var(--white-warm); border-color:var(--line); }
.filter.is-active{ background:var(--gold); border-color:var(--gold); color:var(--black); }

/* ---------- 11. CARROSSEL + CARD ----------------------------- */
.carousel{ position:relative; }
.carousel__track{
  display:flex; gap:clamp(12px,1.6vw,22px);
  overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth;
  padding-bottom:6px; scrollbar-width:none;
}
.carousel__track::-webkit-scrollbar{ display:none; }
.carousel__track > *{ scroll-snap-align:start; flex:0 0 clamp(210px,20vw,250px); }
.carousel__nav{
  position:absolute; top:38%; width:46px; height:46px; border:1px solid var(--line-soft);
  background:rgba(5,5,5,.72); backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; color:var(--white-warm);
  transition:all var(--t); z-index:3;
}
.carousel__nav:hover{ border-color:var(--gold); color:var(--gold); }
.carousel__nav--prev{ left:calc(var(--gutter) * -1 + 4px); }
.carousel__nav--next{ right:calc(var(--gutter) * -1 + 4px); }
.carousel__nav[disabled]{ opacity:.2; pointer-events:none; }
@media (max-width:1100px){ .carousel__nav{ display:none; } }

.grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:clamp(26px,3vw,40px) clamp(12px,1.6vw,22px); }

.card{ position:relative; display:flex; flex-direction:column; }
.card__media{
  position:relative; aspect-ratio:3/4; overflow:hidden; background:var(--graphite);
  display:block;
}
.card__media img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 22%;
  transition:transform 1s var(--ease), opacity .5s var(--ease);
}
.card__media img.card__img--alt{ opacity:0; }
.card:hover .card__media img.card__img--main{ transform:scale(1.06); opacity:0; }
.card:hover .card__media img.card__img--alt{ opacity:1; transform:scale(1.06); }
.card__media::after{
  content:''; position:absolute; inset:0; border:1px solid transparent; transition:border-color var(--t);
  pointer-events:none;
}
.card:hover .card__media::after{ border-color:var(--line); }

.card__badge{
  position:absolute; top:12px; left:12px; z-index:2;
  background:rgba(5,5,5,.78); border:1px solid var(--line);
  color:var(--gold-light); font-size:8.5px; letter-spacing:.24em; text-transform:uppercase;
  padding:5px 10px;
}
.card__badge--sale{ border-color:rgba(245,241,235,.25); color:var(--white-warm); }

.fav{
  position:absolute; top:10px; right:10px; z-index:3;
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  background:rgba(5,5,5,.55); backdrop-filter:blur(4px); border-radius:50%;
  color:var(--white-warm); transition:color var(--t), background var(--t), transform var(--t);
}
.fav svg{ width:16px; height:16px; }
.fav:hover{ color:var(--gold); transform:scale(1.08); }
.fav.is-active{ color:var(--gold); }
.fav.is-active svg{ fill:var(--gold); }
.fav.pulse{ animation:favPulse .5s var(--ease); }
@keyframes favPulse{ 0%{transform:scale(1)} 40%{transform:scale(1.3)} 100%{transform:scale(1)} }

.card__quick{
  position:absolute; left:0; right:0; bottom:0; z-index:2;
  padding:12px; transform:translateY(101%); opacity:0;
  transition:transform var(--t), opacity var(--t);
  background:linear-gradient(to top, rgba(5,5,5,.92), transparent);
}
.card:hover .card__quick{ transform:none; opacity:1; }
.card__quick .btn{ width:100%; min-height:42px; background:rgba(5,5,5,.6); backdrop-filter:blur(4px); }

.card__info{ padding:14px 2px 0; display:flex; flex-direction:column; gap:5px; }
.card__name{ font-size:13.5px; font-weight:400; letter-spacing:.02em; color:var(--white-warm); }
.card__meta{ font-size:10px; letter-spacing:.22em; text-transform:uppercase; color:var(--gray-dark); }
.card__prices{ display:flex; align-items:baseline; gap:9px; margin-top:2px; }
.card__price{ font-size:14px; color:var(--gold-light); letter-spacing:.02em; }
.card__old{ font-size:11.5px; color:var(--gray-dark); text-decoration:line-through; }
.card__colors{ display:flex; gap:5px; margin-top:6px; }
.dot-color{ width:9px; height:9px; border-radius:50%; border:1px solid rgba(245,241,235,.25); }

/* toque: mobile mostra botão fixo */
@media (hover:none){
  .card__quick{ transform:none; opacity:1; padding:10px; }
  .card__quick .btn{ min-height:38px; font-size:9.5px; }
  .card:hover .card__media img.card__img--main{ transform:none; opacity:1; }
  .card:hover .card__media img.card__img--alt{ opacity:0; }
}

.empty{
  text-align:center; padding:60px 20px; color:var(--gray);
  display:flex; flex-direction:column; align-items:center; gap:14px;
}
.empty__title{ font-family:var(--font-display); font-size:24px; color:var(--white-warm); }

/* ---------- 12. SOBRE ---------------------------------------- */
.about{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); background:var(--black-soft); }
.about__media{ position:relative; min-height:clamp(380px,44vw,560px); overflow:hidden; }
.about__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 28%; }
.about__media::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(5,5,5,.25), rgba(11,11,11,.9) 96%);
}
.about__body{ display:flex; flex-direction:column; justify-content:center; gap:18px; padding:clamp(40px,6vw,90px) clamp(24px,6vw,90px); }
.about__title{ font-size:clamp(26px,3.6vw,46px); letter-spacing:.05em; }
.about__title span{ display:block; color:var(--gold-light); }
.about__text{ color:rgba(245,241,235,.66); max-width:480px; font-size:14.5px; }
.about__cta{ margin-top:14px; align-self:flex-start; }
@media (max-width:900px){
  .about{ grid-template-columns:1fr; }
  .about__media{ min-height:300px; }
  .about__media::after{ background:linear-gradient(180deg, rgba(5,5,5,.2), rgba(11,11,11,.94) 94%); }
}

/* ---------- 13. BENEFÍCIOS ----------------------------------- */
.benefits{ background:var(--graphite); border-block:1px solid var(--line-soft); }
.benefits__grid{ display:grid; grid-template-columns:repeat(4,1fr); }
.benefit{ display:flex; align-items:flex-start; gap:16px; padding:clamp(26px,3vw,40px) clamp(16px,2vw,32px); }
.benefit + .benefit{ border-left:1px solid var(--line-soft); }
.benefit__icon{ color:var(--gold); flex:none; }
.benefit__icon svg{ width:28px; height:28px; }
.benefit__title{ font-size:10.5px; letter-spacing:.24em; text-transform:uppercase; color:var(--white-warm); }
.benefit__text{ font-size:12.5px; color:var(--gray); margin-top:6px; line-height:1.55; }
@media (max-width:900px){
  .benefits__grid{ grid-template-columns:repeat(2,1fr); }
  .benefit:nth-child(odd){ border-left:0; }
  .benefit:nth-child(n+3){ border-top:1px solid var(--line-soft); }
}
@media (max-width:520px){
  .benefit{ flex-direction:column; gap:10px; padding:22px 16px; }
}

/* ---------- 14. NEWSLETTER ----------------------------------- */
.news{ position:relative; overflow:hidden; background:var(--black-soft); }
.news__bg{ position:absolute; inset:0; opacity:.16; }
.news__bg img{ width:100%; height:100%; object-fit:cover; }
.news__inner{
  position:relative; display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,80px);
  align-items:center; padding-block:clamp(54px,7vw,92px);
}
.news__title{ font-size:clamp(30px,4.4vw,52px); letter-spacing:.06em; }
.news__title span{ display:block; color:var(--gold-light); }
.news__text{ color:var(--gray); margin-bottom:18px; }
.news__form{ display:flex; gap:10px; flex-wrap:wrap; }
.news__form input{
  flex:1 1 240px; min-width:0; height:52px; padding:0 18px;
  background:rgba(5,5,5,.6); border:1px solid var(--line-soft); color:var(--white-warm);
  outline:0; transition:border-color var(--t);
}
.news__form input:focus{ border-color:var(--gold); }
.news__form input::placeholder{ color:var(--gray-dark); }
.news__ok{ color:var(--gold); font-size:12px; margin-top:12px; min-height:18px; letter-spacing:.06em; }
@media (max-width:820px){ .news__inner{ grid-template-columns:1fr; } }

/* ---------- 15. FOOTER --------------------------------------- */
.footer{ background:var(--black); border-top:1px solid var(--line-soft); padding-top:clamp(46px,5vw,72px); }
.footer__grid{
  display:grid; grid-template-columns:1.4fr repeat(3,1fr) 1.1fr; gap:clamp(24px,3vw,44px);
  padding-bottom:clamp(36px,4vw,58px);
}
.footer__brand{ display:flex; flex-direction:column; gap:16px; }
.footer__about{ font-size:13px; color:var(--gray); max-width:260px; }
.footer__social{ display:flex; gap:8px; }
.footer__social a{
  width:38px; height:38px; border:1px solid var(--line-soft); display:flex; align-items:center; justify-content:center;
  color:var(--gray); transition:all var(--t);
}
.footer__social a:hover{ color:var(--gold); border-color:var(--line); }
.footer__social svg{ width:16px; height:16px; }
.footer__col h4{ font-family:var(--font-body); font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold); margin-bottom:16px; }
.footer__col a{ display:block; font-size:13px; color:var(--gray); padding:5px 0; transition:color var(--t); }
.footer__col a:hover{ color:var(--white-warm); }
.pay{ display:flex; flex-wrap:wrap; gap:7px; }
.pay span{
  border:1px solid var(--line-soft); padding:6px 9px; font-size:9px; letter-spacing:.12em;
  color:var(--gray); text-transform:uppercase;
}
.footer__bottom{
  border-top:1px solid var(--line-soft); padding-block:20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-size:11px; color:var(--gray-dark);
}
.footer__legal{ display:flex; gap:20px; flex-wrap:wrap; }
.footer__legal a:hover{ color:var(--gold); }
@media (max-width:1000px){
  .footer__grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .footer__grid{ grid-template-columns:1fr; gap:30px; }
  .footer__bottom{ flex-direction:column; align-items:flex-start; }
}

/* ---------- 16. DRAWER / SACOLA ------------------------------ */
.overlay{
  position:fixed; inset:0; z-index:var(--z-drawer);
  background:rgba(0,0,0,.72); backdrop-filter:blur(3px);
  opacity:0; visibility:hidden; transition:opacity var(--t), visibility var(--t);
}
.overlay.is-open{ opacity:1; visibility:visible; }

.drawer{
  position:fixed; top:0; right:0; bottom:0; z-index:calc(var(--z-drawer) + 1);
  width:min(440px,100%); background:var(--black-soft);
  border-left:1px solid var(--line-soft);
  transform:translateX(100%); transition:transform .42s var(--ease);
  display:flex; flex-direction:column;
  max-height:100dvh;
}
.drawer.is-open{ transform:none; }
.drawer__head{
  flex:0 0 auto; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:20px 20px 16px; border-bottom:1px solid var(--line-soft);
}
.drawer__title{ font-family:var(--font-display); font-size:22px; letter-spacing:.16em; }
.drawer__count{ font-size:10px; letter-spacing:.2em; color:var(--gray); }

/* barra de frete grátis */
.freebar{ flex:0 0 auto; padding:14px 20px; border-bottom:1px solid var(--line-soft); background:rgba(201,163,106,.04); }
.freebar__text{ font-size:11.5px; color:var(--white-warm); letter-spacing:.02em; }
.freebar__text b{ color:var(--gold-light); font-weight:500; }
.freebar__track{ height:3px; background:rgba(245,241,235,.1); margin-top:9px; overflow:hidden; }
.freebar__fill{ height:100%; width:0; background:linear-gradient(90deg,var(--gold),var(--gold-light)); transition:width .6s var(--ease); }
.freebar.is-free .freebar__text{ color:var(--gold-light); letter-spacing:.12em; font-size:11px; text-transform:uppercase; }

/* corpo com itens — regra crítica de checkout mobile */
.sh-body{
  flex:1 1 auto;
  min-height:24vh;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  padding:6px 20px 10px;
}
/* na etapa SACOLA o rodapé rola junto e nunca engole a lista */
.drawer:not(.is-checkout) .sh-foot{
  flex:0 1 auto;
  max-height:62vh;
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.drawer.is-checkout .sh-body{
  flex:0 1 auto;
  min-height:0;
  overflow-y:auto;
  max-height:34vh;
}
.sh-foot{
  flex:0 0 auto;
  min-height:0;
  border-top:1px solid var(--line-soft);
  background:var(--black-soft);
}
.drawer.is-checkout .sh-foot{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain;
}
.checkout-submit{
  position:sticky;
  bottom:0;
  z-index:10;
  background:var(--black-soft);
  padding:12px 20px calc(12px + env(safe-area-inset-bottom));
  border-top:1px solid var(--line-soft);
}

.citem{ display:grid; grid-template-columns:74px 1fr; gap:14px; padding:16px 0; border-bottom:1px solid var(--line-soft); }
.citem:last-child{ border-bottom:0; }
.citem__media{ aspect-ratio:3/4; overflow:hidden; background:var(--graphite); }
.citem__media img{ width:100%; height:100%; object-fit:cover; }
.citem__body{ display:flex; flex-direction:column; gap:6px; min-width:0; }
.citem__top{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.citem__name{ font-size:13px; letter-spacing:.02em; }
.citem__opts{ font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--gray-dark); }
.citem__price{ font-size:13px; color:var(--gold-light); white-space:nowrap; }
.citem__foot{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; }
.qty{ display:inline-flex; align-items:center; border:1px solid var(--line-soft); }
.qty button{ width:30px; height:30px; display:flex; align-items:center; justify-content:center; color:var(--gray); transition:color var(--t), background var(--t); }
.qty button:hover{ color:var(--gold); background:rgba(201,163,106,.08); }
.qty span{ min-width:28px; text-align:center; font-size:12px; }
.citem__remove{ font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--gray-dark); transition:color var(--t); }
.citem__remove:hover{ color:#D98A8A; }

/* complete o look na sacola */
.upsell-strip{ padding:18px 20px; border-top:1px solid var(--line-soft); background:var(--black); }
.upsell-strip__title{ font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold); margin-bottom:14px; }
.upsell-row{ display:flex; gap:12px; overflow-x:auto; scrollbar-width:none; }
.upsell-row::-webkit-scrollbar{ display:none; }
.mini{ flex:0 0 132px; }
.mini__media{ aspect-ratio:3/4; overflow:hidden; background:var(--graphite); position:relative; }
.mini__media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.mini:hover .mini__media img{ transform:scale(1.06); }
.mini__name{ font-size:11.5px; margin-top:8px; }
.mini__price{ font-size:11.5px; color:var(--gold-light); }
.mini__btn{ margin-top:7px; width:100%; min-height:32px; font-size:9px; letter-spacing:.16em; }

/* resumo */
.summary{ padding:16px 20px; display:flex; flex-direction:column; gap:9px; }
.summary__row{ display:flex; align-items:center; justify-content:space-between; font-size:13px; color:var(--gray); }
.summary__row b{ color:var(--white-warm); font-weight:400; }
.summary__row--discount b{ color:var(--gold-light); }
.summary__total{
  display:flex; align-items:baseline; justify-content:space-between;
  border-top:1px solid var(--line-soft); margin-top:6px; padding-top:14px;
}
.summary__total span{ font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--gray); }
.summary__total b{ font-family:var(--font-display); font-size:30px; color:var(--gold-light); font-weight:400; }
.summary__note{ font-size:11px; color:var(--gray-dark); }

/* cupom */
.coupon{ display:flex; gap:8px; padding:0 20px 8px; }
.coupon input{
  flex:1; min-width:0; height:44px; padding:0 14px; background:transparent;
  border:1px solid var(--line-soft); color:var(--white-warm); outline:0;
  font-size:12px; letter-spacing:.2em; text-transform:uppercase;
  transition:border-color var(--t);
}
.coupon input:focus{ border-color:var(--gold); }
.coupon .btn{ min-height:44px; flex:none; }
.coupon-msg{ padding:0 20px 10px; font-size:11px; min-height:16px; letter-spacing:.04em; }
.coupon-msg.ok{ color:#7FC79A; }
.coupon-msg.err{ color:#D98A8A; }
.coupon-hint{ padding:0 20px 12px; display:flex; gap:6px; flex-wrap:wrap; }
.coupon-hint button{
  border:1px dashed var(--line); color:var(--gold); font-size:9px; letter-spacing:.16em;
  padding:5px 9px; transition:background var(--t);
}
.coupon-hint button:hover{ background:rgba(201,163,106,.1); }

/* ---------- 17. CHECKOUT ------------------------------------- */
.checkout{ padding:18px 20px 4px; display:flex; flex-direction:column; gap:20px; }
.fieldset__title{
  font-size:10px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold);
  padding-bottom:10px; margin-bottom:14px; border-bottom:1px solid var(--line-soft);
}
.field{ margin-bottom:12px; }
.field label{ display:block; font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--gray); margin-bottom:6px; }
.field input, .field textarea, .field select{
  width:100%; height:46px; padding:0 14px; background:rgba(5,5,5,.5);
  border:1px solid var(--line-soft); color:var(--white-warm); outline:0;
  border-radius:var(--radius); font-size:14px; transition:border-color var(--t), background var(--t);
}
.field textarea{ height:auto; padding:12px 14px; resize:vertical; min-height:70px; }
.field input:focus, .field textarea:focus{ border-color:var(--gold); background:rgba(201,163,106,.04); }
.field input::placeholder{ color:var(--gray-dark); }
.field.is-error input{ border-color:#B4595B; }
.field__err{ font-size:10.5px; color:#D98A8A; margin-top:5px; display:none; }
.field.is-error .field__err{ display:block; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.field-row--3{ grid-template-columns:1.2fr 1fr; }

.choice{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.choice--stack{ grid-template-columns:1fr; }
.choice__item{
  border:1px solid var(--line-soft); padding:14px; cursor:pointer;
  display:flex; flex-direction:column; gap:4px; transition:all var(--t); position:relative;
  background:rgba(5,5,5,.4);
}
.choice__item:hover{ border-color:var(--line); }
.choice__item.is-active{ border-color:var(--gold); background:rgba(201,163,106,.07); }
.choice__label{ font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; }
.choice__note{ font-size:11px; color:var(--gray); }
.choice__item.is-active .choice__label{ color:var(--gold-light); }
.choice input{ position:absolute; opacity:0; pointer-events:none; }

/* ---------- 18. MODAL DE PRODUTO ----------------------------- */
.modal{
  position:fixed; inset:0; z-index:var(--z-modal);
  display:flex; align-items:center; justify-content:center; padding:clamp(0px,3vw,40px);
  opacity:0; visibility:hidden; transition:opacity var(--t), visibility var(--t);
}
.modal.is-open{ opacity:1; visibility:visible; }
.modal__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.82); backdrop-filter:blur(4px); }
.modal__box{
  position:relative; z-index:1; width:min(1120px,100%);
  max-height:min(94dvh,100%); background:var(--black-soft);
  border:1px solid var(--line-soft); display:flex; flex-direction:column;
  transform:translateY(18px) scale(.99); transition:transform .42s var(--ease);
  overflow:hidden;
}
.modal.is-open .modal__box{ transform:none; }
.modal__close{
  position:absolute; top:10px; right:10px; z-index:5;
  width:42px; height:42px; display:flex; align-items:center; justify-content:center;
  background:rgba(5,5,5,.7); color:var(--white-warm); border:1px solid var(--line-soft);
  transition:all var(--t);
}
.modal__close:hover{ color:var(--gold); border-color:var(--gold); }
.modal__scroll{ overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }

.pdp{ display:grid; grid-template-columns:1fr 1fr; }
.pdp__gallery{ position:relative; background:var(--graphite); }
.pdp__main{ position:relative; aspect-ratio:3/4; overflow:hidden; }
.pdp__main img{ width:100%; height:100%; object-fit:cover; object-position:50% 20%; transition:opacity var(--t); }
.pdp__thumbs{ display:flex; gap:8px; padding:10px; position:absolute; bottom:0; left:0; right:0;
  background:linear-gradient(to top,rgba(5,5,5,.8),transparent); }
.pdp__thumb{ width:54px; aspect-ratio:3/4; overflow:hidden; border:1px solid transparent; opacity:.6; transition:all var(--t); }
.pdp__thumb img{ width:100%; height:100%; object-fit:cover; }
.pdp__thumb.is-active{ border-color:var(--gold); opacity:1; }
.pdp__badge{ position:absolute; top:14px; left:14px; z-index:2;
  background:rgba(5,5,5,.8); border:1px solid var(--line); color:var(--gold-light);
  font-size:8.5px; letter-spacing:.24em; padding:6px 11px; text-transform:uppercase; }

.pdp__body{ padding:clamp(24px,3vw,40px); display:flex; flex-direction:column; gap:18px; }
.pdp__cat{ font-size:10px; letter-spacing:.28em; text-transform:uppercase; color:var(--gold); }
.pdp__name{ font-size:clamp(26px,3.4vw,40px); letter-spacing:.03em; margin-top:8px; }
.pdp__prices{ display:flex; align-items:baseline; gap:12px; }
.pdp__price{ font-family:var(--font-display); font-size:30px; color:var(--gold-light); }
.pdp__old{ font-size:14px; color:var(--gray-dark); text-decoration:line-through; }
.pdp__installment{ font-size:12px; color:var(--gray); }
.pdp__desc{ font-size:14px; color:rgba(245,241,235,.7); }
.pdp__block{ display:flex; flex-direction:column; gap:10px; }
.pdp__label{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.pdp__label span{ font-size:10px; letter-spacing:.24em; text-transform:uppercase; color:var(--gray); }
.pdp__label b{ font-size:11px; color:var(--white-warm); font-weight:400; letter-spacing:.1em; }
.size-link{ font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); border-bottom:1px solid var(--line); padding-bottom:2px; }
.size-link:hover{ color:var(--gold-light); }

.opts{ display:flex; flex-wrap:wrap; gap:8px; }
.opt{
  min-width:48px; height:42px; padding:0 14px; border:1px solid var(--line-soft);
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-size:12px; letter-spacing:.12em; color:var(--gray);
  transition:all var(--t);
}
.opt:hover{ border-color:var(--line); color:var(--white-warm); }
.opt.is-active{ border-color:var(--gold); color:var(--gold-light); background:rgba(201,163,106,.08); }
.opt--color{ padding-left:10px; }
.opt__dot{ width:14px; height:14px; border-radius:50%; border:1px solid rgba(245,241,235,.28); flex:none; }

.pdp__actions{ display:flex; flex-direction:column; gap:10px; margin-top:4px; }
.pdp__row{ display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:stretch; }
.qty--lg{ height:52px; }
.qty--lg button{ width:44px; height:100%; }
.qty--lg span{ min-width:36px; font-size:13px; }
.pdp__add{ min-height:52px; }
.pdp__stock{ font-size:11px; letter-spacing:.16em; text-transform:uppercase; }
.pdp__stock.ok{ color:#7FC79A; }
.pdp__stock.low{ color:var(--gold-light); }
.pdp__stock.out{ color:#D98A8A; }
.pdp__details{ border-top:1px solid var(--line-soft); padding-top:16px; }
.pdp__details li{ font-size:12.5px; color:var(--gray); padding:4px 0 4px 16px; position:relative; }
.pdp__details li::before{ content:''; position:absolute; left:0; top:12px; width:5px; height:1px; background:var(--gold); }

.pdp__upsell{ border-top:1px solid var(--line-soft); padding:clamp(24px,3vw,36px); }
@media (max-width:900px){
  .pdp{ grid-template-columns:1fr; }
  .modal{ padding:0; align-items:flex-end; }
  .modal__box{ max-height:94dvh; width:100%; border-bottom:0; }
  .pdp__main{ aspect-ratio:4/5; }
}

/* guia de tamanhos */
.sizetable{ width:100%; border-collapse:collapse; margin-top:18px; }
.sizetable th, .sizetable td{ border:1px solid var(--line-soft); padding:11px 10px; font-size:12.5px; text-align:center; }
.sizetable th{ font-size:9.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold); font-weight:400; }
.sizetable td:first-child{ color:var(--gold-light); letter-spacing:.1em; }
.sizetable tr:hover td{ background:rgba(201,163,106,.05); }

.modal__box--slim{ width:min(560px,100%); }
.modal__pad{ padding:clamp(26px,4vw,40px); }
.modal__title{ font-family:var(--font-display); font-size:26px; letter-spacing:.08em; }
.modal__text{ color:var(--gray); font-size:14px; margin-top:12px; }
.modal__text + .modal__text{ margin-top:10px; }

/* ---------- 19. TOAST / INSTALL / REPEAT --------------------- */
.toast-wrap{
  position:fixed; left:50%; bottom:24px; transform:translateX(-50%);
  z-index:var(--z-toast); display:flex; flex-direction:column; gap:8px; align-items:center;
  width:min(420px,calc(100% - 24px)); pointer-events:none;
}
.toast{
  width:100%; background:rgba(11,11,11,.97); border:1px solid var(--line);
  padding:13px 16px; display:flex; align-items:center; gap:12px;
  font-size:12.5px; letter-spacing:.02em;
  animation:toastIn .35s var(--ease);
  box-shadow:0 18px 40px rgba(0,0,0,.5);
}
.toast.is-out{ animation:toastOut .3s var(--ease) forwards; }
.toast__icon{ color:var(--gold); flex:none; }
.toast__icon svg{ width:17px; height:17px; }
@keyframes toastIn{ from{opacity:0; transform:translateY(16px)} to{opacity:1; transform:none} }
@keyframes toastOut{ to{opacity:0; transform:translateY(10px)} }

.install{
  position:fixed; left:12px; right:12px; bottom:12px; z-index:700;
  background:var(--graphite); border:1px solid var(--line);
  padding:14px 16px; display:none; align-items:center; gap:14px;
  box-shadow:0 18px 40px rgba(0,0,0,.6);
}
.install.is-open{ display:flex; }
body.no-scroll .install{ display:none; }
.install__icon{ width:42px; height:42px; flex:none; }
.install__title{ font-size:12.5px; letter-spacing:.06em; }
.install__text{ font-size:11px; color:var(--gray); }
.install__close{ color:var(--gray-dark); padding:6px; }
@media (min-width:820px){ .install{ left:auto; width:380px; } }

.repeat-bar{
  display:none; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  border:1px solid var(--line); background:rgba(201,163,106,.05);
  padding:16px 18px; margin-bottom:26px;
}
.repeat-bar.is-open{ display:flex; }
.repeat-bar__text{ font-size:12.5px; color:var(--gray); }
.repeat-bar__text b{ color:var(--white-warm); font-weight:400; }

/* ---------- 20. FAVORITOS ------------------------------------ */
.favs__head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:20px; }

/* ---------- 21. RESPONSIVO GERAL ----------------------------- */
@media (max-width:760px){
  body{ font-size:14.5px; }
  .section{ padding-block:52px; }
  .grid{ grid-template-columns:repeat(2,1fr); gap:24px 12px; }
  .search__results{ grid-template-columns:repeat(2,1fr); gap:22px 12px; }
  .carousel__track > *{ flex:0 0 62vw; max-width:250px; }
  .drawer{ width:100%; border-left:0; }
  .field-row{ grid-template-columns:1fr; }
  .field-row--3{ grid-template-columns:1fr 1fr; }
  .choice{ grid-template-columns:1fr; }
  .toast-wrap{ bottom:14px; }
}
@media (max-width:380px){
  .grid{ gap:20px 10px; }
  .card__name{ font-size:12.5px; }
  .logo__name{ font-size:19px; }
}