:root{
  color-scheme:light;
  --sand-50:#FBF4E7;
  --sand-100:#F3E6D0;
  --sand-200:#E6D3B4;
  --surface:#FFFFFF;
  --ink-900:#17262B;
  --ink-700:#3E4F53;
  --ink-500:#6E7E80;
  --gold-500:#FFC40A;
  --gold-700:#8A5A00;
  --gold-100:#FFF3D0;
  --wine-500:#A1182A;
  --wine-700:#7A1220;
  --wine-100:#F5DEE1;
  --teal-500:#0E7C78;
  --teal-600:#0A615D;
  --teal-100:#DCEFE8;
  --gold-400:#E8A33D;
  --jade:#2F6F5E;
  --piscina:#2C8FB4;
  --backdrop:rgba(23,38,43,0.5);
  --accent: var(--gold-500);
  --accent-strong: var(--gold-700);
  --accent-tint: var(--gold-100);
  --font-display: 'Fraunces', Georgia, 'Iowan Old Style', serif;
  --font-body: 'Work Sans', 'Segoe UI', system-ui, sans-serif;
  --font-brand: 'League Spartan', 'Arial Narrow', sans-serif;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;overflow-x:hidden;}
body{
  background:var(--sand-50);
  color:var(--ink-900);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;}
[hidden]{display:none!important;}

h1,h2,h3{
  font-family:var(--font-display);
  font-weight:600;
  text-wrap:balance;
  margin:0;
}
p{margin:0;}
button{font-family:inherit;}

.page{
  display:flex;
  flex-direction:column;
  min-height:100%;
}
.page[data-mode="atacado"]{
  --accent:var(--wine-500);
  --accent-strong:var(--wine-700);
  --accent-tint:var(--wine-100);
}

/* ---------- topbar ---------- */
.topbar{
  position:sticky;
  top:0;
  z-index:20;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:0.6rem;
  padding:0.9rem 1.25rem;
  background:color-mix(in srgb, var(--sand-50) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--sand-200);
}
@media (min-width:640px){
  .topbar{
    flex-direction:row;
    align-items:center;
    justify-content:space-between;
  }
}
.brand{
  font-family:var(--font-brand);
  font-weight:600;
  font-size:clamp(0.82rem, 2.4vw, 0.98rem);
  letter-spacing:0.01em;
  color:var(--ink-900);
  white-space:nowrap;
}

.mode-switch{
  display:inline-flex;
  background:var(--sand-100);
  border:1px solid var(--sand-200);
  border-radius:999px;
  padding:0.2rem;
  gap:0.15rem;
}
.mode-switch button{
  appearance:none;
  border:none;
  background:transparent;
  font-size:0.82rem;
  font-weight:600;
  color:var(--ink-700);
  padding:0.45rem 0.85rem;
  border-radius:999px;
  cursor:pointer;
  transition:background 0.2s ease, color 0.2s ease;
  white-space:nowrap;
}
.mode-switch button[aria-pressed="true"]{
  background:var(--accent-strong);
  color:var(--surface);
}
.mode-switch button:focus-visible,
.panel:focus-visible,
.tile:focus-visible,
.modal-close:focus-visible,
.scroll-cue:focus-visible,
.model-nav-item:focus-visible,
.back-button:focus-visible{
  outline:2px solid var(--accent-strong);
  outline-offset:3px;
}

/* ---------- gate ---------- */
.gate{
  padding:clamp(2.5rem,6vw,4.5rem) 1.25rem 1.5rem;
  max-width:64rem;
  margin:0 auto;
  width:100%;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.9rem;
}
.eyebrow{
  font-size:0.72rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--ink-500);
  font-weight:600;
}
.gate-logo{
  width:clamp(8.5rem, 24vw, 12rem);
  height:auto;
}
.gate-tagline{
  width:100%;
  font-family:var(--font-brand);
  font-weight:500;
  font-size:clamp(0.85rem, 2vw, 0.98rem);
  letter-spacing:0.01em;
  line-height:1.45;
  color:var(--ink-700);
  max-width:26rem;
}
.gate h1{
  width:100%;
  overflow-wrap:break-word;
  font-family:'Anton', var(--font-display);
  font-weight:400;
  font-size:clamp(1.6rem,7vw,3.2rem);
  line-height:1.08;
}
.gate-sub{
  width:100%;
  max-width:32rem;
  color:var(--ink-700);
  font-size:1.02rem;
  line-height:1.5;
}

.gate-panels{
  margin-top:1.5rem;
  width:100%;
  display:grid;
  grid-template-columns:1fr;
  gap:1rem;
  text-align:left;
}
@media (min-width:720px){
  .gate-panels{grid-template-columns:1fr 1fr;}
}

.panel{
  appearance:none;
  cursor:pointer;
  text-align:left;
  color:var(--ink-900);
  background:var(--surface);
  border:1.5px solid var(--sand-200);
  border-radius:22px;
  padding:1.75rem 1.5rem;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:0.55rem;
  min-height:15rem;
  transition:border-color 0.2s ease, transform 0.2s ease;
}
.panel:hover{transform:translateY(-2px);}
.panel.is-active{border-color:var(--panel-accent);}
.panel--compact{min-height:auto;padding:1.4rem 1.25rem;gap:0.45rem;}

.panel--varejo{--panel-accent:var(--gold-700);}
.panel--atacado{--panel-accent:var(--wine-700);}

.panel-body{position:relative;display:flex;flex-direction:column;gap:0.55rem;height:100%;}
.panel-eyebrow{
  font-size:0.72rem;
  letter-spacing:0.14em;
  text-transform:uppercase;
  font-weight:700;
  color:var(--panel-accent);
}
.panel-title{
  font-family:var(--font-display);
  font-size:1.5rem;
  font-weight:600;
}
.panel--compact .panel-title{font-size:1.25rem;}
.panel-note{color:var(--ink-700);font-size:0.92rem;line-height:1.4;}
.panel-price{
  margin-top:auto;
  display:flex;
  align-items:baseline;
  gap:0.35rem;
  font-family:var(--font-display);
  font-size:clamp(1.5rem,2.6vw,1.9rem);
  font-weight:600;
  color:var(--ink-900);
}
.panel--compact .panel-price{font-size:1.3rem;}
.panel-price small{font-family:var(--font-body);font-size:0.85rem;font-weight:600;color:var(--ink-500);}
.panel-cta{
  align-self:flex-start;
  font-size:0.85rem;
  font-weight:700;
  color:var(--panel-accent);
  display:inline-flex;
  align-items:center;
  gap:0.3rem;
}
.panel-cta svg{width:0.9rem;height:0.9rem;}

.scroll-cue{
  appearance:none;
  background:transparent;
  border:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
  margin-top:0.5rem;
  color:var(--ink-500);
  font-size:0.85rem;
  font-weight:600;
  padding:0.4rem 0.6rem;
  border-radius:999px;
  transition:color 0.2s ease;
}
.scroll-cue:hover{color:var(--ink-900);}
.scroll-cue svg{width:0.85rem;height:0.85rem;}

/* ---------- model presentation ---------- */
.models{
  padding:1.5rem 1.25rem 2.5rem;
  max-width:72rem;
  margin:0 auto;
  width:100%;
}
.model-nav{
  display:flex;
  gap:0.85rem;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  padding-bottom:0.5rem;
  -webkit-overflow-scrolling:touch;
}
.model-nav > .model-nav-item{flex:0 0 62%;scroll-snap-align:start;}
.model-nav{scrollbar-width:none;}
.model-nav::-webkit-scrollbar{display:none;}
.model-carousel{position:relative;}
.carousel-arrow{display:none;}
@media (min-width:760px){
  .model-nav{gap:1.25rem;}
  .model-nav > .model-nav-item{flex:0 0 calc((100% - 3.75rem) / 3.3);}
  .carousel-arrow{
    appearance:none;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    position:absolute;
    top:42%;
    transform:translateY(-50%);
    z-index:2;
    width:2.9rem;
    height:2.9rem;
    border-radius:50%;
    border:1px solid var(--sand-200);
    background:var(--surface);
    color:var(--wine-700, #6E1520);
    box-shadow:0 6px 18px rgba(23,38,43,0.16);
    transition:opacity 0.2s ease, transform 0.2s ease;
  }
  .carousel-arrow svg{width:1.1rem;height:1.1rem;}
  .carousel-arrow:hover{transform:translateY(-50%) scale(1.06);}
  .carousel-arrow:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px;}
  .carousel-arrow--prev{left:-0.9rem;}
  .carousel-arrow--next{right:-0.9rem;}
  .carousel-arrow[disabled]{opacity:0;pointer-events:none;}
}
.back-button{
  appearance:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
  background:var(--sand-100);
  border:1px solid var(--sand-200);
  border-radius:999px;
  padding:0.5rem 1rem;
  font-size:0.85rem;
  font-weight:600;
  color:var(--ink-700);
  margin-bottom:1.5rem;
  transition:background 0.2s ease, color 0.2s ease;
}
.back-button:hover{background:var(--sand-200);color:var(--ink-900);}
.back-button svg{width:0.9rem;height:0.9rem;}
.model-nav-item{
  appearance:none;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  gap:0.55rem;
  background:var(--surface);
  border:1.5px solid var(--sand-200);
  border-radius:16px;
  padding:0.7rem;
  text-align:left;
  width:100%;
  transition:border-color 0.2s ease, transform 0.2s ease;
}
.model-nav-item:hover{transform:translateY(-2px);border-color:var(--ink-500);}
.model-nav-item.is-active{border-color:var(--accent-strong);background:var(--accent-tint);}
.model-thumb{
  display:block;
  aspect-ratio:4/5;
  width:100%;
  height:auto;
  object-fit:contain;
  background:#F9EFE3;
  border-radius:10px;
}
.model-nav-name{font-weight:600;font-size:1rem;}

.model-detail{
  background:var(--surface);
  border:1px solid var(--sand-200);
  border-radius:20px;
  padding:1.5rem;
  display:flex;
  flex-direction:column;
  gap:1rem;
}
.model-detail h3{font-size:1.3rem;}
.model-desc{color:var(--ink-700);font-size:0.92rem;line-height:1.5;}

.media-row{
  display:grid;
  grid-template-columns:1fr;
  gap:0.75rem;
}
@media (min-width:560px){
  .media-row{grid-template-columns:1fr 1fr;}
}
.media-placeholder{
  aspect-ratio:4/5;
  border-radius:14px;
  border:1.5px dashed var(--sand-200);
  background:var(--sand-100);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0.4rem;
  color:var(--ink-500);
  font-size:0.78rem;
  text-align:center;
  padding:1rem;
}
.media-placeholder svg{width:1.6rem;height:1.6rem;}

.measure-table{width:100%;border-collapse:collapse;font-size:0.82rem;}
.measure-table th,.measure-table td{border:1px solid var(--sand-200);padding:0.4rem 0.5rem;text-align:center;}
.measure-table th{background:var(--sand-100);font-weight:700;color:var(--ink-700);}
.measure-table td:first-child,.measure-table th:first-child{text-align:left;}
.measure-caption{font-size:0.74rem;color:var(--ink-500);margin-top:0.4rem;}

#modelPageBody{display:flex;flex-direction:column;gap:1.75rem;}
.model-graphic{
  display:block;
  width:100%;
  max-width:30rem;
  margin:0 auto;
  border-radius:14px;
  border:1px solid var(--sand-200);
}
.fit-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(10.5rem,1fr));
  gap:1rem;
}
.fit-photo{
  margin:0;
  border:1px solid var(--sand-200);
  border-radius:14px;
  overflow:hidden;
  background:var(--surface);
}
.fit-photo img{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
}
.fit-photo figcaption{
  padding:0.5rem 0.7rem;
  font-size:0.82rem;
  font-weight:600;
  color:var(--ink-700);
}

/* ---------- gallery ---------- */
.gallery{
  padding:1.5rem 1.25rem 2.5rem;
  max-width:72rem;
  margin:0 auto;
  width:100%;
}
.section-head{
  display:flex;
  flex-direction:column;
  gap:0.5rem;
  margin-bottom:1.75rem;
  padding-top:1.25rem;
  border-top:1px solid var(--sand-200);
}
.section-head h2{font-size:clamp(1.5rem,3.4vw,2.1rem);}
.models-title{
  font-family:'Anton', var(--font-display);
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:0.01em;
  font-size:clamp(1.4rem,6vw,2.5rem);
}
.section-head p{color:var(--ink-700);font-size:1rem;max-width:38rem;}
.section-head--sub{margin-top:2.25rem;padding-top:1.75rem;}
.section-head--sub h2{font-size:clamp(1.25rem,2.6vw,1.6rem);}

.gallery-label{
  font-size:0.8rem;
  font-weight:700;
  color:var(--ink-700);
  margin-bottom:0.75rem;
}
.tile-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(7.5rem,1fr));
  gap:0.85rem;
}
.tile{
  appearance:none;
  cursor:pointer;
  background:var(--surface);
  border:1.5px solid var(--sand-200);
  border-radius:16px;
  padding:0.6rem;
  display:flex;
  flex-direction:column;
  gap:0.4rem;
  position:relative;
  text-align:left;
  transition:border-color 0.2s ease, transform 0.2s ease;
}
.tile:hover{transform:translateY(-1px);border-color:var(--ink-500);}
.tile.is-picked{border-color:var(--ink-900);}
.tile-swatch{
  aspect-ratio:1/1;
  width:100%;
  border-radius:10px;
}
.tile-name{font-family:var(--font-display);font-size:0.95rem;font-weight:600;}
.tile-check{
  position:absolute;
  top:0.5rem;
  right:0.5rem;
  width:1.35rem;
  height:1.35rem;
  border-radius:50%;
  background:var(--ink-900);
  color:var(--surface);
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  transform:scale(0.6);
  transition:opacity 0.2s ease, transform 0.2s ease;
}
.tile-check svg{width:0.7rem;height:0.7rem;}
.tile.is-picked .tile-check{opacity:1;transform:scale(1);}
.photo-frame{display:block;background:#EBE0CB;}
.photo-frame--tile{padding:0.2rem;border-radius:10px;}
.photo-frame--card{padding:0.6rem;}
.tile-photo,
.card-photo{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  object-fit:contain;
  filter:drop-shadow(0 1px 1.5px rgba(70,45,10,0.3));
}
@media (max-width:479px){
  .tile-grid{grid-template-columns:repeat(3, minmax(0,1fr));gap:0.55rem;}
  .tile{padding:0.4rem;border-radius:13px;}
  .tile-name{font-size:0.74rem;line-height:1.2;}
}

/* ---------- busca e filtros ---------- */
.catalog-tools{margin-bottom:1.25rem;}
.searchbar{display:flex;align-items:center;gap:0.6rem;}
.search-field{position:relative;flex:1;min-width:0;}
.search-input{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  height:2.85rem;
  border:1.5px solid var(--sand-200);
  border-radius:999px;
  background:var(--sand-100);
  padding:0 2.9rem 0 1.15rem;
  font:inherit;
  font-size:1rem;
  color:var(--ink-900);
}
.search-input::placeholder{color:var(--ink-500);}
.search-input::-webkit-search-cancel-button,
.search-input::-webkit-search-decoration{-webkit-appearance:none;display:none;}
.search-input:focus-visible{outline:2px solid var(--accent-strong);outline-offset:2px;background:var(--surface);}
.search-btn{
  position:absolute;
  right:0.4rem;
  top:50%;
  transform:translateY(-50%);
  width:2.1rem;
  height:2.1rem;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  border-radius:50%;
  background:transparent;
  color:var(--ink-700);
  cursor:pointer;
}
.search-btn svg{width:1.15rem;height:1.15rem;}
.search-btn:focus-visible,
.filter-btn:focus-visible,
.chip:focus-visible,
.link-btn:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px;}
.filter-btn{
  position:relative;
  flex:none;
  width:2.85rem;
  height:2.85rem;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  border-radius:50%;
  background:var(--ink-900);
  color:var(--surface);
  cursor:pointer;
  transition:background 0.2s ease;
}
.filter-btn[aria-expanded="true"]{background:var(--accent-strong);}
.filter-btn svg{width:1.3rem;height:1.3rem;}
.filter-count{
  position:absolute;
  top:-0.25rem;
  right:-0.25rem;
  min-width:1.2rem;
  height:1.2rem;
  padding:0 0.3rem;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:var(--wine-500);
  color:#fff;
  font-size:0.72rem;
  font-weight:700;
}
.filter-panel{
  margin-top:0.7rem;
  padding:1rem 1.05rem;
  display:flex;
  flex-direction:column;
  gap:0.95rem;
  background:var(--surface);
  border:1px solid var(--sand-200);
  border-radius:16px;
}
.filter-label{font-size:0.8rem;font-weight:700;color:var(--ink-700);margin-bottom:0.5rem;}
.chip-row{display:flex;flex-wrap:wrap;gap:0.4rem;}
.chip{
  appearance:none;
  display:inline-flex;
  align-items:center;
  gap:0.4rem;
  padding:0.42rem 0.8rem;
  font-size:0.85rem;
  font-weight:600;
  color:var(--ink-700);
  background:var(--surface);
  border:1.5px solid var(--sand-200);
  border-radius:999px;
  cursor:pointer;
  transition:background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.chip:hover{border-color:var(--ink-500);}
.chip[aria-pressed="true"]{background:var(--ink-900);border-color:var(--ink-900);color:var(--surface);}
.chip-dot{
  width:0.75rem;
  height:0.75rem;
  border-radius:50%;
  background:var(--dot);
  border:1px solid rgba(0,0,0,0.28);
}
.link-btn{
  appearance:none;
  background:none;
  border:none;
  padding:0;
  font:inherit;
  font-weight:700;
  color:var(--accent-strong);
  text-decoration:underline;
  cursor:pointer;
}
.filter-panel .link-btn{align-self:flex-start;font-size:0.85rem;}
.tools-meta{margin-top:0.6rem;font-size:0.8rem;color:var(--ink-500);}
.empty-state{padding:1.5rem 0;color:var(--ink-700);font-size:0.95rem;}

/* ---------- color / print swatch treatments ---------- */
.tone-amarelo{background:#F5C518;}
.tone-azul-marinho{background:#16324F;}
.tone-branco-borda-verde{background:#F7F3EA;border:5px solid var(--jade);}
.tone-cappuccino{background:#7B5233;}
.tone-coral{background:#F0654A;}
.tone-laranja-canelado{
  background-color:#F2811D;
  background-image:repeating-linear-gradient(8deg, rgba(0,0,0,0.14) 0 3px, transparent 3px 9px);
}
.tone-arco-iris{background:linear-gradient(100deg,#E4483C,#F2811D,#F5C518,#3F9142,#2C8FB4,#6C4F9C);}
.tone-coqueiro{
  background-color:#E7D6AE;
  background-image:radial-gradient(circle at 28% 32%, var(--jade) 3px, transparent 3px),
                    radial-gradient(circle at 68% 60%, #4E9C87 3px, transparent 3px),
                    radial-gradient(circle at 45% 80%, var(--jade) 2.4px, transparent 2.4px);
  background-size:22px 22px;
}
.tone-girassol{
  background-color:#6B4A1F;
  background-image:radial-gradient(var(--gold-400) 3.2px, transparent 3.2px);
  background-size:18px 18px;
}
.tone-mandala-vermelho{
  background-image:repeating-conic-gradient(from 0deg, #8C2A2A 0deg 30deg, #B23A3A 30deg 60deg);
}
.tone-olho-grego{
  background:radial-gradient(circle, #16324F 0 16%, #F4F0E8 16% 24%, var(--piscina) 24% 36%, #F4F0E8 36% 42%, #16242A 42% 48%, #E7D6AE 48% 100%);
}
.tone-oceano{
  background-color:#E7D6AE;
  background-image:repeating-linear-gradient(100deg, var(--teal-500) 0 4px, transparent 4px 28px),
                    repeating-linear-gradient(100deg, var(--piscina) 0 3px, transparent 3px 44px);
}

/* ---------- catalog / listings ---------- */
.catalog{
  flex:1;
  padding:1.5rem 1.25rem clamp(3rem,6vw,4.5rem);
  max-width:72rem;
  margin:0 auto;
  width:100%;
}

.badges{display:flex;flex-wrap:wrap;gap:0.5rem;margin-top:0.35rem;}
.badge{
  font-size:0.72rem;
  font-weight:700;
  letter-spacing:0.06em;
  text-transform:uppercase;
  padding:0.32rem 0.7rem;
  border-radius:999px;
  background:var(--accent-tint);
  color:var(--accent-strong);
}
.catalog[data-mode="varejo"] .badge--atacado{display:none;}
.catalog[data-mode="atacado"] .badge--varejo{display:none;}

.corte-row{display:flex;align-items:center;flex-wrap:wrap;gap:0.6rem;margin-top:0.75rem;}
.corte-label{font-size:0.8rem;font-weight:700;color:var(--ink-700);}
.corte-switch{
  display:inline-flex;
  background:var(--sand-100);
  border:1px solid var(--sand-200);
  border-radius:999px;
  padding:0.2rem;
  gap:0.15rem;
}
.corte-switch button{
  appearance:none;
  border:none;
  background:transparent;
  font-size:0.8rem;
  font-weight:600;
  color:var(--ink-700);
  padding:0.4rem 0.8rem;
  border-radius:999px;
  cursor:pointer;
  transition:background 0.2s ease, color 0.2s ease;
  white-space:nowrap;
}
.corte-switch button[aria-pressed="true"]{background:var(--ink-900);color:var(--surface);}
.corte-switch button:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px;}
.corte-note{font-size:0.76rem;color:var(--ink-500);margin-top:0.4rem;}
/* no varejo o preço é o mesmo nos dois cortes: o seletor só aparece no atacado */
.catalog[data-mode="varejo"] .corte-row,
.catalog[data-mode="varejo"] .corte-note{display:none;}

.tone-avulso{
  background:linear-gradient(115deg, #F5C518 0 20%, #F0654A 20% 40%, #16324F 40% 60%, var(--jade) 60% 80%, #7B5233 80% 100%);
}
.tone-avulso-top{
  background:linear-gradient(245deg, #F5C518 0 20%, #F0654A 20% 40%, #16324F 40% 60%, var(--jade) 60% 80%, #7B5233 80% 100%);
}
.avulso-hint{font-size:0.78rem;color:var(--ink-700);line-height:1.35;}
.tone-viseira{
  background:linear-gradient(180deg, #F5C518 0 20%, #F0654A 20% 40%, #16324F 40% 60%, var(--jade) 60% 80%, #7B5233 80% 100%);
}
.swatch--square{aspect-ratio:1/1;}
.catalog[data-mode="varejo"] .extra-hide-varejo,
.catalog[data-mode="atacado"] .extra-hide-atacado{display:none;}

/* ---------- categorias (Conjuntos / Avulsos / Viseiras) no topo do catálogo ---------- */
#catCategories{margin-top:1.1rem;}
.cat-row{
  display:flex;
  gap:1.1rem;
  overflow-x:auto;
  padding:0.15rem 0.1rem 0.3rem;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.cat-row::-webkit-scrollbar{display:none;}
.cat-item{
  appearance:none;
  flex:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.4rem;
  background:none;
  border:none;
  padding:0;
  cursor:pointer;
}
.cat-circle{
  width:3.6rem;
  height:3.6rem;
  border-radius:50%;
  overflow:hidden;
  border:2px solid var(--sand-200);
  display:flex;
  transition:border-color 0.2s ease, transform 0.2s ease;
}
.cat-circle img{width:100%;height:100%;object-fit:cover;}
.cat-circle--plain{background:var(--sand-100);}
.cat-item:hover .cat-circle{transform:translateY(-1px);}
.cat-item[aria-pressed="true"] .cat-circle{border-color:var(--ink-900);box-shadow:0 0 0 2px var(--sand-50), 0 0 0 3px var(--ink-900);}
.cat-item:focus-visible .cat-circle{outline:2px solid var(--accent-strong);outline-offset:2px;}
.cat-label{font-size:0.78rem;font-weight:600;color:var(--ink-700);white-space:nowrap;}
.cat-item[aria-pressed="true"] .cat-label{color:var(--ink-900);}

.product-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:0.85rem;
}
@media (min-width:480px){
  .product-grid{
    grid-template-columns:repeat(auto-fill, minmax(13rem,1fr));
    gap:1.25rem;
  }
}

.card{
  background:var(--surface);
  border:1px solid var(--sand-200);
  border-radius:18px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  transition:border-color 0.3s ease, box-shadow 0.3s ease;
}
.card.is-highlighted{
  border-color:var(--accent-strong);
  box-shadow:0 0 0 3px var(--accent-tint);
}
.card--avulso{
  border-style:dashed;
  border-color:var(--accent-strong);
  background:var(--accent-tint);
}
.swatch{
  aspect-ratio:4/5;
  width:100%;
}

.card-body{padding:1rem 1.05rem 1.15rem;display:flex;flex-direction:column;gap:0.5rem;flex:1;}
.card-name{font-family:var(--font-display);font-size:1.1rem;font-weight:600;}

.price-block{margin-top:auto;padding-top:0.6rem;border-top:1px dashed var(--sand-200);}
.price-block table{width:100%;border-collapse:collapse;font-size:0.85rem;}
.price-block td{padding:0.2rem 0;}
.price-block td:first-child{color:var(--ink-500);}
.price-block td:last-child{
  text-align:right;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  color:var(--accent-strong);
}
.min-note{font-size:0.74rem;color:var(--ink-500);margin-top:0.3rem;line-height:1.35;}

.catalog[data-mode="varejo"] .price--atacado{display:none;}
.catalog[data-mode="atacado"] .price--varejo{display:none;}

/* ---------- página do varejo / atacado ---------- */
.catalog > .back-button + .section-head{border-top:none;padding-top:0;}

/* ---------- informações da marca (rodapé da página inicial) ---------- */
footer.brand-info{
  margin-top:1rem;
  padding:2rem 0 4.5rem;
  background:var(--sand-100);
  border-top:1px solid var(--sand-200);
  text-align:left;
  color:var(--ink-700);
  font-size:0.92rem;
}
.brand-info-inner{max-width:72rem;margin:0 auto;padding:0 1.25rem;}
.info-grid{display:grid;grid-template-columns:1fr;gap:1.5rem;}
@media (min-width:760px){
  .info-grid{grid-template-columns:repeat(3, 1fr);gap:2rem;}
}
.info-title{font-family:var(--font-display);font-size:1.05rem;font-weight:600;color:var(--ink-900);margin-bottom:0.6rem;}
.info-list,
.pay-list{list-style:none;margin:0;padding:0;}
.info-list{display:flex;flex-direction:column;gap:0.35rem;}
.info-link{color:var(--accent-strong);font-weight:600;text-decoration:underline;text-underline-offset:2px;}
.info-link:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px;}
.hours-table{border-collapse:collapse;font-size:0.9rem;}
.hours-table td{padding:0.2rem 1.25rem 0.2rem 0;}
.hours-table td:first-child{color:var(--ink-500);}
.pay-list{display:flex;flex-wrap:wrap;gap:0.5rem;}
.pay-chip{
  padding:0.4rem 0.85rem;
  background:var(--surface);
  border:1.5px solid var(--sand-200);
  border-radius:999px;
  font-size:0.85rem;
  font-weight:600;
  color:var(--ink-900);
}
.info-legal{
  margin-top:1.75rem;
  padding-top:1.25rem;
  border-top:1px solid var(--sand-200);
  display:flex;
  flex-direction:column;
  gap:0.25rem;
  font-size:0.85rem;
  color:var(--ink-500);
}
.info-legal strong{color:var(--ink-700);}

/* ---------- páginas de política (privacidade, trocas, termos) ---------- */
.policy-header{
  position:sticky;
  top:0;
  z-index:20;
  display:flex;
  align-items:center;
  gap:0.85rem;
  padding:0.9rem 1.25rem;
  background:color-mix(in srgb, var(--sand-50) 88%, transparent);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--sand-200);
}
.policy-header img{width:2.1rem;height:auto;flex:none;}
.policy-header .brand{white-space:normal;}
.policy-main{
  flex:1;
  width:100%;
  max-width:42rem;
  margin:0 auto;
  padding:2rem 1.25rem 3rem;
}
.policy-main .back-button{margin-bottom:1.5rem;}
.policy-main h1{font-size:clamp(1.5rem,4vw,2rem);margin-bottom:0.4rem;}
.policy-updated{font-size:0.82rem;color:var(--ink-500);margin-bottom:2rem;}
.policy-main h2{
  font-size:1.15rem;
  margin-top:2.25rem;
  margin-bottom:0.65rem;
  padding-top:1.5rem;
  border-top:1px solid var(--sand-200);
}
.policy-main h2:first-of-type{padding-top:0;border-top:none;margin-top:0;}
.policy-main p{margin-bottom:0.85rem;line-height:1.6;color:var(--ink-700);}
.policy-main p strong{color:var(--ink-900);}
.policy-main ul,
.policy-main ol{margin:0 0 0.85rem;padding-left:1.3rem;color:var(--ink-700);line-height:1.6;}
.policy-main li{margin-bottom:0.35rem;}
.policy-main li strong{color:var(--ink-900);}
.policy-main a{color:var(--wine-700);}
.policy-cross-links{
  display:flex;
  flex-wrap:wrap;
  gap:0.5rem 1rem;
  margin-top:2.25rem;
  padding-top:1.5rem;
  border-top:1px solid var(--sand-200);
  font-size:0.85rem;
}

/* ---------- carrinho ---------- */
html{scrollbar-gutter:stable;}
body.no-scroll{overflow:hidden;}

.topbar-actions{display:flex;align-items:center;gap:0.6rem;}
.cart-btn{
  position:relative;
  flex:none;
  width:2.6rem;
  height:2.6rem;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  border-radius:50%;
  background:var(--ink-900);
  color:var(--surface);
  cursor:pointer;
}
.cart-btn svg{width:1.3rem;height:1.3rem;}
.cart-btn:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px;}
.cart-count{
  position:absolute;
  top:-0.3rem;
  right:-0.3rem;
  min-width:1.2rem;
  height:1.2rem;
  padding:0 0.3rem;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:var(--wine-500);
  color:#fff;
  font-size:0.72rem;
  font-weight:700;
}

#productGrid .card{cursor:pointer;}
.card-add{
  appearance:none;
  width:100%;
  margin-top:0.7rem;
  padding:0.55rem 0.8rem;
  font:inherit;
  font-size:0.88rem;
  font-weight:700;
  color:var(--accent-strong);
  background:transparent;
  border:1.5px solid var(--accent-strong);
  border-radius:999px;
  cursor:pointer;
  transition:background 0.15s ease, color 0.15s ease;
}
.card-add:hover{background:var(--accent-strong);color:#fff;}
.card-add:focus-visible{outline:2px solid var(--ink-900);outline-offset:3px;}

.btn-primary{
  appearance:none;
  width:100%;
  padding:0.85rem 1.25rem;
  font:inherit;
  font-size:1rem;
  font-weight:700;
  color:#fff;
  background:var(--accent-strong);
  border:none;
  border-radius:999px;
  cursor:pointer;
}
.btn-primary:hover{filter:brightness(1.1);}
.btn-primary:focus-visible{outline:2px solid var(--ink-900);outline-offset:3px;}

/* janelas: cartão do produto (sobe de baixo no celular) e carrinho (lateral) */
.sheet-backdrop{
  position:fixed;
  inset:0;
  z-index:60;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  background:var(--backdrop);
}
.sheet{
  position:relative;
  width:100%;
  max-width:30rem;
  max-height:92vh;
  max-height:92dvh;
  display:flex;
  flex-direction:column;
  background:var(--surface);
  border-radius:22px 22px 0 0;
  overflow:hidden;
}
@media (min-width:640px){
  .sheet-backdrop{align-items:center;padding:1.5rem;}
  .sheet{border-radius:22px;}
  .sheet--grid{max-width:42rem;}
}
.sheet-close{
  appearance:none;
  flex:none;
  width:2.2rem;
  height:2.2rem;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  border-radius:50%;
  background:var(--sand-100);
  color:var(--ink-700);
  cursor:pointer;
}
.sheet-close svg{width:0.9rem;height:0.9rem;}
.sheet-close:hover{background:var(--sand-200);}
.sheet-close:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px;}
.sheet > .sheet-close{position:absolute;top:0.75rem;right:0.75rem;z-index:2;}
.sheet-body{overflow-y:auto;padding:1.1rem 1.25rem 0.75rem;display:flex;flex-direction:column;gap:1.05rem;}
.sheet-top{display:flex;align-items:center;gap:0.9rem;padding-right:2.4rem;}
.photo-frame--sheet{flex:none;width:6.5rem;padding:0.35rem;border-radius:14px;}
.sheet-photo{display:block;width:100%;aspect-ratio:1/1;object-fit:contain;filter:drop-shadow(0 1px 1.5px rgba(70,45,10,0.3));}
.sheet-eyebrow{font-size:0.72rem;letter-spacing:0.14em;text-transform:uppercase;font-weight:700;color:var(--accent-strong);}
.sheet-title{font-size:1.4rem;line-height:1.15;}
.opt-group .filter-label{margin-bottom:0.5rem;}
.chip[aria-checked="true"]{background:var(--ink-900);border-color:var(--ink-900);color:var(--surface);}
.sheet-price{
  display:flex;
  flex-direction:column;
  gap:0.3rem;
}
.price-row{display:flex;justify-content:space-between;align-items:baseline;gap:0.75rem;font-size:0.92rem;color:var(--ink-700);}
.price-row strong{font-variant-numeric:tabular-nums;}
.price-row--pix{color:var(--ink-900);font-weight:600;}
.price-total-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:0.75rem;
  margin-top:0.3rem;
  padding-top:0.4rem;
  border-top:1px dashed var(--sand-200);
  font-size:0.95rem;
  color:var(--ink-700);
}
.price-total-row strong{font-size:1.25rem;color:var(--ink-900);font-variant-numeric:tabular-nums;}
.price-save{font-size:0.8rem;font-weight:600;color:var(--jade);}
.sheet-footer{
  padding:0.85rem 1.25rem 1.1rem;
  border-top:1px solid var(--sand-200);
  display:flex;
  flex-direction:column;
  gap:0.6rem;
}
.sheet-footer .link-btn--center{font-size:0.85rem;}

.sheet-added{display:flex;flex-direction:column;gap:0.6rem;}
.sheet-added-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0.5rem;}
.sheet-added-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:0.5rem 0.75rem;
  padding:0.55rem 0.7rem;
  background:var(--sand-100);
  border-radius:12px;
}
.sheet-added-meta{font-size:0.85rem;font-weight:600;color:var(--ink-900);}
.sheet-added-meta small{display:block;font-weight:500;font-size:0.74rem;color:var(--ink-500);}
.sheet-added-line .link-btn{font-size:0.78rem;}

/* ---------- grade do atacado (modelo × tamanho) ---------- */
.grid-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -0.1rem;}
.size-grid{border-collapse:separate;border-spacing:0.35rem;}
.size-grid th{font-family:var(--font-display);font-weight:600;font-size:0.85rem;color:var(--ink-900);white-space:nowrap;}
.size-grid thead th{padding-bottom:0.15rem;}
.sg-corner,
.sg-model{position:sticky;left:0;background:var(--surface);text-align:left;padding-right:0.6rem;z-index:1;}
.sg-cell{
  min-width:5.4rem;
  padding:0.5rem 0.45rem;
  background:var(--sand-100);
  border-radius:12px;
  text-align:center;
  vertical-align:top;
}
.sg-price{font-size:0.68rem;line-height:1.3;color:var(--ink-700);white-space:nowrap;}
.sg-price span{font-weight:700;color:var(--ink-900);}
.sg-price small{margin-left:0.15rem;color:var(--ink-500);}
.sg-price--pix{margin-bottom:0.4rem;}
.sg-price--pix span{color:var(--jade);}
.stepper--grid{justify-content:center;}
.stepper--grid button{width:1.8rem;height:1.8rem;font-size:1rem;}
.stepper--grid .qty{min-width:1.6rem;font-size:0.85rem;}

.stepper{display:inline-flex;align-items:center;border:1.5px solid var(--sand-200);border-radius:999px;overflow:hidden;}
.stepper button{
  appearance:none;
  width:2.5rem;
  height:2.5rem;
  border:none;
  background:var(--sand-100);
  color:var(--ink-900);
  font:inherit;
  font-size:1.2rem;
  font-weight:700;
  cursor:pointer;
}
.stepper button:disabled{color:var(--ink-500);opacity:0.55;cursor:default;}
.stepper button:focus-visible{outline:2px solid var(--accent-strong);outline-offset:-3px;}
.stepper .qty{min-width:2.4rem;text-align:center;font-weight:700;font-variant-numeric:tabular-nums;}
.stepper--small button{width:2.1rem;height:2.1rem;font-size:1.05rem;}
.stepper--small .qty{min-width:2rem;font-size:0.9rem;}

.obs-note{
  padding:0.55rem 0.8rem;
  font-size:0.82rem;
  line-height:1.4;
  color:var(--ink-700);
  background:var(--accent-tint);
  border-radius:12px;
}
.form-error{
  padding:0.6rem 0.8rem;
  font-size:0.88rem;
  font-weight:600;
  line-height:1.35;
  color:var(--wine-700);
  background:var(--wine-100);
  border-radius:12px;
}

.cart-backdrop{align-items:stretch;justify-content:flex-end;}
.drawer{
  width:100%;
  max-width:26rem;
  height:100%;
  display:flex;
  flex-direction:column;
  background:var(--surface);
}
@media (min-width:640px){
  .drawer{box-shadow:-8px 0 30px rgba(23,38,43,0.18);}
}
.drawer-head{
  flex:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 1.25rem;
  border-bottom:1px solid var(--sand-200);
}
.drawer-head h2{font-size:1.25rem;}
.drawer-body{flex:1;overflow-y:auto;padding:0.5rem 1.25rem;}
.drawer-foot{
  flex:none;
  max-height:60%;
  overflow-y:auto;
  padding:0.9rem 1.25rem 1.1rem;
  display:flex;
  flex-direction:column;
  gap:0.6rem;
  border-top:1px solid var(--sand-200);
  background:var(--sand-50);
}
.drawer-foot:empty{display:none;}
.cart-empty{padding:2rem 0;display:flex;flex-direction:column;gap:0.6rem;color:var(--ink-700);}
.cart-empty .btn-primary{margin-top:0.6rem;}
.cart-list{list-style:none;margin:0;padding:0;}
.cart-line{
  display:grid;
  grid-template-columns:4.25rem 1fr auto;
  gap:0.75rem;
  align-items:start;
  padding:0.9rem 0;
  border-bottom:1px solid var(--sand-200);
}
.cart-line:last-child{border-bottom:none;}
.photo-frame--line{padding:0.2rem;border-radius:10px;}
.photo-frame--line img{display:block;width:100%;aspect-ratio:1/1;object-fit:contain;}
.line-name{font-family:var(--font-display);font-weight:600;font-size:1rem;}
.line-meta{font-size:0.82rem;color:var(--ink-700);}
.line-unit{font-size:0.78rem;color:var(--ink-500);}
.line-actions{margin-top:0.5rem;display:flex;align-items:center;gap:0.6rem;flex-wrap:wrap;}
.line-actions .link-btn{font-size:0.82rem;}
.line-total{font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink-900);white-space:nowrap;}
.sum-row,
.sum-total{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;}
.sum-row{font-size:0.88rem;color:var(--ink-700);}
.sum-total{font-size:1rem;}
.sum-total strong{font-size:1.4rem;font-variant-numeric:tabular-nums;}
.sum-note{font-size:0.78rem;color:var(--ink-500);margin-top:-0.3rem;}
.sum-row--desconto,
.sum-row--desconto strong{color:var(--jade);}

/* ---------- formulário de dados (nota fiscal, endereço, cupom) ---------- */
.field-group{display:flex;flex-direction:column;gap:0.85rem;margin-bottom:1.5rem;}
.field-group:last-child{margin-bottom:0;}
.field{display:flex;flex-direction:column;gap:0.35rem;font-size:0.85rem;font-weight:600;color:var(--ink-700);}
.text-input{
  appearance:none;
  width:100%;
  height:2.85rem;
  padding:0 1rem;
  font:inherit;
  font-size:1rem;
  color:var(--ink-900);
  background:var(--sand-100);
  border:1.5px solid var(--sand-200);
  border-radius:14px;
}
.text-input:focus-visible{outline:2px solid var(--accent-strong);outline-offset:2px;background-color:var(--surface);}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:0.7rem;}
.field--uf .text-input{text-transform:uppercase;}
.field-check{display:flex;align-items:center;gap:0.55rem;font-size:0.88rem;font-weight:600;color:var(--ink-700);cursor:pointer;}
.field-check input{width:1.15rem;height:1.15rem;accent-color:var(--accent-strong);}
.apto-fields{display:flex;flex-direction:column;gap:0.85rem;margin-top:0.85rem;padding-left:0.9rem;border-left:2px solid var(--sand-200);}
.cep-status{font-size:0.78rem;margin-top:-0.45rem;color:var(--ink-500);}
.cep-status--ok{color:var(--jade);}
.cep-status--erro{color:var(--wine-700);}
.frete-box{display:flex;flex-direction:column;gap:0.5rem;margin-top:-0.2rem;padding:0.75rem 0.9rem;background:var(--sand-100);border-radius:0.7rem;}
.frete-box .filter-label{margin:0;}
.frete-status{font-size:0.82rem;color:var(--ink-500);margin:0;}
.frete-status--erro{color:var(--wine-700);}
.frete-opt{display:flex;align-items:center;gap:0.55rem;font-size:0.88rem;font-weight:600;color:var(--ink-700);cursor:pointer;}
.frete-opt span{display:flex;flex-direction:column;gap:0.1rem;}
.frete-opt strong{margin-left:auto;font-weight:700;}
.frete-opt input{width:1.1rem;height:1.1rem;accent-color:var(--accent-strong);flex:none;}
.frete-prazo{font-size:0.74rem;font-weight:500;color:var(--ink-500);}
.coupon-row{display:flex;gap:0.6rem;}
.coupon-row .text-input{flex:1;}
.coupon-status{font-size:0.82rem;margin-top:0.5rem;font-weight:600;}
.coupon-status--ok{color:var(--jade);}
.coupon-status--erro{color:var(--wine-700);}
.btn-secondary{
  appearance:none;
  flex:none;
  padding:0 1.1rem;
  font:inherit;
  font-size:0.9rem;
  font-weight:700;
  color:var(--ink-900);
  background:var(--surface);
  border:1.5px solid var(--sand-200);
  border-radius:14px;
  cursor:pointer;
}
.btn-secondary:hover{border-color:var(--ink-500);}
.btn-secondary:focus-visible{outline:2px solid var(--accent-strong);outline-offset:2px;}
.btn-secondary.btn-block{display:block;width:100%;padding:0.8rem 1.1rem;border-radius:999px;font-size:0.95rem;}
a.btn-primary{display:block;box-sizing:border-box;text-align:center;text-decoration:none;}
.pay-options{display:flex;flex-direction:column;gap:0.5rem;}
.pay-opt{
  appearance:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0.75rem;
  padding:0.65rem 0.9rem;
  text-align:left;
  font:inherit;
  color:var(--ink-900);
  background:var(--surface);
  border:1.5px solid var(--sand-200);
  border-radius:14px;
  cursor:pointer;
}
.pay-opt[aria-checked="true"]{border-color:var(--ink-900);box-shadow:inset 0 0 0 1px var(--ink-900);}
.pay-opt:focus-visible{outline:2px solid var(--accent-strong);outline-offset:3px;}
.pay-opt--pix{border-color:var(--jade);}
.pay-opt--pix[aria-checked="true"]{border-color:var(--jade);box-shadow:inset 0 0 0 1px var(--jade);}
.pay-opt--pix .pay-name small{color:var(--jade);font-weight:600;}
.pay-name{font-weight:700;font-size:0.92rem;}
.pay-name small{display:block;font-weight:500;font-size:0.76rem;color:var(--ink-500);}
.pay-amt{font-weight:700;font-variant-numeric:tabular-nums;}
.link-btn--center{align-self:center;font-size:0.85rem;}

.pix-panel{display:flex;flex-direction:column;gap:0.9rem;padding:0.75rem 0 1.25rem;}
.pix-amount{display:flex;justify-content:space-between;align-items:baseline;font-size:0.95rem;color:var(--ink-700);}
.pix-amount strong{font-size:1.5rem;color:var(--ink-900);font-variant-numeric:tabular-nums;}
.pix-code{
  width:100%;
  resize:none;
  font:inherit;
  font-size:0.8rem;
  line-height:1.4;
  color:var(--ink-900);
  background:var(--sand-100);
  border:1.5px solid var(--sand-200);
  border-radius:14px;
  padding:0.75rem 0.9rem;
  word-break:break-all;
}
.pix-code:focus-visible{outline:2px solid var(--accent-strong);outline-offset:2px;}
.pix-help{font-size:0.85rem;color:var(--ink-700);line-height:1.45;}
.pix-help strong{color:var(--ink-900);}

/* ---------- campos do cartão do produto ---------- */
.select{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  height:2.85rem;
  padding:0 2.6rem 0 1rem;
  font:inherit;
  font-size:1rem;
  color:var(--ink-900);
  background:var(--sand-100) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%233E4F53' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 0.9rem center / 1rem;
  border:1.5px solid var(--sand-200);
  border-radius:14px;
  cursor:pointer;
}
.select:focus-visible{outline:2px solid var(--accent-strong);outline-offset:2px;background-color:var(--surface);}
.sheet-swatch{display:block;width:100%;aspect-ratio:1/1;border-radius:8px;}
.ref-note{margin-top:0.4rem;font-size:0.76rem;color:var(--ink-500);}
.obs-note--info{background:var(--sand-100);}

/* ---------- modal ---------- */
.modal-backdrop{
  position:fixed;
  inset:0;
  background:var(--backdrop);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1.25rem;
  z-index:50;
}
.modal{
  background:var(--surface);
  border:1px solid var(--sand-200);
  border-radius:26px;
  max-width:44rem;
  width:100%;
  max-height:calc(100vh - 3rem);
  overflow-y:auto;
  padding:2rem 1.75rem 1.75rem;
  position:relative;
}
.modal-close{
  position:absolute;
  top:1rem;
  right:1rem;
  width:2.1rem;
  height:2.1rem;
  border-radius:50%;
  border:none;
  background:var(--sand-100);
  color:var(--ink-700);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.modal-close:hover{color:var(--ink-900);}
.modal-close svg{width:0.85rem;height:0.85rem;}
.modal-context{font-size:0.85rem;color:var(--ink-500);margin-bottom:0.2rem;}
.modal h2{font-size:1.45rem;margin-bottom:1.1rem;padding-right:2rem;}
.modal-panels{margin-top:0;}

footer{
  padding:1.5rem 1.25rem;
  text-align:center;
  color:var(--ink-500);
  font-size:0.78rem;
  border-top:1px solid var(--sand-200);
}

.whats-float{
  position:fixed;
  right:0.9rem;
  bottom:0.9rem;
  z-index:30;
  width:2.75rem;
  height:2.75rem;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#25D366;
  color:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,0.22);
  transition:transform 0.2s ease, box-shadow 0.2s ease;
}
.whats-float:hover{transform:scale(1.08);box-shadow:0 4px 12px rgba(0,0,0,0.28);}
.whats-float:focus-visible{outline:3px solid var(--ink-900);outline-offset:3px;}
.whats-float svg{width:1.4rem;height:1.4rem;}

@media (prefers-reduced-motion: reduce){
  *{transition:none!important;animation:none!important;}
}


/* ---------- home: escolha de compra depois dos modelos + catálogo sem preço ---------- */
.gate{padding-bottom:0.5rem;}
.gate--choose{
  padding:1.75rem 1.25rem 1.5rem;
  border-top:1px solid var(--sand-200);
  max-width:72rem;
}
.gate--choose .gate-panels{margin-top:0.75rem;}
.gallery-label--sets{margin-top:1.75rem;}
.tile-grid--extras .tile-swatch{border-radius:10px;}

/* ---------- avaliações ---------- */
.reviews{padding:1.5rem 1.25rem 2.5rem;max-width:72rem;margin:0 auto;width:100%;}
.reviews .section-head{margin-bottom:1.1rem;}
.reviews-summary{display:flex;align-items:center;gap:0.6rem;flex-wrap:wrap;margin-bottom:1rem;}
.reviews-avg{font-family:'Anton', var(--font-display);font-size:2.4rem;line-height:1;}
.reviews-count{font-size:0.9rem;color:var(--ink-700);}
.stars{display:inline-flex;gap:0.12rem;}
.stars .star svg{width:1.05rem;height:1.05rem;fill:var(--sand-200);display:block;}
.stars .star.is-on svg{fill:var(--gold-400);}
.reviews-summary .stars .star svg{width:1.35rem;height:1.35rem;}
.reviews-tabs{display:flex;gap:0.4rem;flex-wrap:wrap;margin-bottom:1.1rem;}
.reviews-tabs button{
  appearance:none;font:inherit;font-size:0.85rem;font-weight:600;
  padding:0.45rem 0.95rem;border-radius:999px;cursor:pointer;
  background:var(--surface);color:var(--ink-700);border:1.5px solid var(--sand-200);
}
.reviews-tabs button[aria-pressed="true"]{background:var(--ink-900);border-color:var(--ink-900);color:var(--surface);}
.reviews-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(16.5rem,1fr));gap:0.85rem;}
.review-card{
  background:var(--surface);border:1.5px solid var(--sand-200);border-radius:18px;
  padding:1rem 1.05rem;display:flex;flex-direction:column;gap:0.55rem;
}
.review-top{display:flex;justify-content:space-between;align-items:center;gap:0.5rem;}
.review-tag{font-size:0.68rem;font-weight:700;letter-spacing:0.04em;text-transform:uppercase;padding:0.18rem 0.55rem;border-radius:999px;background:var(--gold-100);color:var(--gold-700);}
.review-tag--atacado{background:var(--wine-100);color:var(--wine-700);}
.review-text{font-size:0.94rem;line-height:1.5;color:var(--ink-900);white-space:pre-line;overflow-wrap:anywhere;}
.review-photo img{display:block;width:100%;max-height:16rem;object-fit:cover;border-radius:12px;}
.review-author{font-size:0.84rem;color:var(--ink-700);}
.review-date{font-size:0.74rem;color:var(--ink-500);margin-top:-0.35rem;}
.reviews-empty{font-size:0.92rem;color:var(--ink-700);background:var(--surface);border:1.5px dashed var(--sand-200);border-radius:16px;padding:1.1rem;text-align:center;}
.reviews-actions{display:flex;flex-direction:column;align-items:center;gap:0.7rem;margin-top:1.3rem;}
.reviews-actions .btn-secondary{padding:0.7rem 1.3rem;border-radius:999px;}
.reviews-write{max-width:22rem;}
.modal--review{max-width:34rem;}
.rv-fieldset{border:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0.4rem;}
.rv-stars{display:flex;gap:0.3rem;}
.rv-star{appearance:none;background:none;border:none;padding:0.1rem;cursor:pointer;}
.rv-star svg{width:2.1rem;height:2.1rem;fill:var(--sand-200);display:block;transition:fill 0.12s ease;}
.rv-star.is-on svg{fill:var(--gold-400);}
.rv-star:focus-visible{outline:2px solid var(--accent-strong);outline-offset:2px;border-radius:6px;}
.rv-choice{display:flex;gap:1.2rem;flex-wrap:wrap;font-size:0.95rem;}
.rv-choice label{display:flex;align-items:center;gap:0.4rem;cursor:pointer;}
.rv-choice input{width:1.1rem;height:1.1rem;accent-color:var(--accent-strong);}
.field small{font-weight:400;color:var(--ink-500);}
select.text-input{padding-right:0.6rem;}
.rv-textarea{height:auto;min-height:6.5rem;padding:0.75rem 1rem;resize:vertical;line-height:1.45;}
.rv-file{font:inherit;font-size:0.85rem;font-weight:400;}
.rv-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.rv-note{font-size:0.76rem;color:var(--ink-500);margin-top:0.7rem;text-align:center;}
.rv-thanks{display:flex;flex-direction:column;gap:0.8rem;text-align:center;}
.rv-thanks-title{font-family:var(--font-display);font-size:1.25rem;font-weight:600;}
#rvForm .form-error{margin-bottom:0.8rem;}

/* ---------- vitrine: fotos maiores (formato retrato, menos moldura) e 2 por linha no celular ---------- */
.tile-grid{grid-template-columns:repeat(auto-fill, minmax(10.5rem,1fr));gap:0.9rem;}
.photo-frame--tile{padding:0;border-radius:12px;overflow:hidden;}
.photo-frame--card{padding:0.35rem;}
.tile-photo,
.card-photo{aspect-ratio:4/5;padding:0.45rem 0.6rem;}
.tile-name{font-size:1rem;line-height:1.25;}
.tile-grid--extras .tile-swatch{aspect-ratio:4/5;}
@media (max-width:479px){
  .tile-grid{grid-template-columns:repeat(2, minmax(0,1fr));gap:0.7rem;}
  .tile{padding:0.45rem;}
  .tile-name{font-size:0.92rem;}
}

/* aviso "adicionado ao pedido" */
.add-toast{
  position:fixed;left:50%;bottom:1.1rem;transform:translateX(-50%);z-index:70;
  width:calc(100% - 2rem);max-width:28rem;
  display:flex;align-items:center;justify-content:space-between;gap:0.8rem;
  padding:0.8rem 0.9rem 0.8rem 1.1rem;border-radius:16px;
  background:var(--ink-900);color:var(--surface);font-size:0.9rem;font-weight:600;
  box-shadow:0 8px 24px rgba(23,38,43,0.25);
}
.add-toast-btn{
  appearance:none;flex:none;font:inherit;font-size:0.82rem;font-weight:700;cursor:pointer;
  padding:0.45rem 0.85rem;border-radius:999px;border:none;background:var(--accent);color:var(--ink-900);
}

/* grade do atacado compacta: + / qtd / − em pé, P M G GG cabem no celular */
.size-grid{border-spacing:0.22rem;width:100%;}
.size-grid thead th{text-align:center;font-size:0.9rem;}
.sg-corner,.sg-model{padding-right:0.3rem;}
.sg-model{font-size:0.78rem!important;white-space:normal!important;line-height:1.15;max-width:5.2rem;}
.sg-cell{min-width:0;padding:0.3rem 0.15rem 0.35rem;border:1.5px solid transparent;transition:background 0.15s ease, border-color 0.15s ease;}
.sg-cell.has-qty{background:var(--accent-tint);border-color:var(--accent-strong);}
.sg-pix{font-size:0.66rem;font-weight:700;color:var(--jade);white-space:nowrap;margin-bottom:0.25rem;}
.sg-stepper{display:flex;flex-direction:column;align-items:center;gap:0.1rem;}
.sg-stepper button{
  appearance:none;width:2rem;height:1.75rem;border-radius:10px;border:1.5px solid var(--sand-200);
  background:var(--surface);color:var(--ink-900);font:inherit;font-size:1.05rem;font-weight:700;line-height:1;cursor:pointer;
}
.sg-stepper button:disabled{opacity:0.4;cursor:default;}
.sg-stepper button:focus-visible{outline:2px solid var(--accent-strong);outline-offset:1px;}
.sg-stepper .qty{font-weight:700;font-size:0.95rem;font-variant-numeric:tabular-nums;min-width:1.4rem;text-align:center;}
.sg-cell.has-qty .qty{color:var(--accent-strong);}
.sg-legend{font-size:0.72rem;line-height:1.4;color:var(--ink-700);margin-top:0.5rem;}
.sheet--grid .sheet-body{padding-left:0.8rem;padding-right:0.8rem;}
.sg-pix{font-size:0.62rem;}
.size-grid{border-spacing:0.18rem;}
.sg-pix{margin-bottom:0;}
.sg-card{font-size:0.58rem;font-weight:600;color:var(--ink-500);white-space:nowrap;margin-bottom:0.25rem;}
.sg-total{margin-top:0.6rem;display:flex;flex-direction:column;gap:0.35rem;}
.sg-total-row{display:flex;justify-content:space-between;align-items:center;gap:0.6rem;padding:0.7rem 0.85rem;border-radius:14px;background:var(--ink-900);color:var(--surface);font-size:0.88rem;}
.sg-total-vals{text-align:right;line-height:1.25;white-space:nowrap;}
.sg-total-vals strong{font-size:1rem;color:var(--gold-500);}
.sg-total-vals small{font-size:0.74rem;opacity:0.8;}
.sg-total-empty{font-size:0.8rem;color:var(--ink-700);background:var(--sand-100);border-radius:12px;padding:0.6rem 0.8rem;}
.sg-total-order{font-size:0.78rem;color:var(--ink-700);font-weight:600;}
.sg-total-falta{font-size:0.76rem;color:var(--wine-700);}
.sg-pix{font-size:0.7rem;}
.sg-card{font-size:0.64rem;}
.sg-key{display:flex;flex-wrap:wrap;gap:0.25rem 0.8rem;font-size:0.72rem;color:var(--ink-500);margin-bottom:0.3rem;}
.sg-key-pix{color:var(--jade);font-weight:700;}
.sg-key-card{color:var(--ink-500);font-weight:700;}
/* legenda ao lado da foto + soma acima da grade (cartão primeiro, à vista em destaque) */
.sheet-key{display:flex;flex-wrap:wrap;align-items:center;gap:0.2rem 0.6rem;margin-top:0.45rem;font-size:0.74rem;}
.sheet-key small{flex-basis:100%;color:var(--ink-500);font-size:0.7rem;}
.sk-card,.sk-pix{display:inline-flex;align-items:center;gap:0.3rem;font-weight:700;}
.sk-card{color:var(--ink-500);}
.sk-pix{color:var(--jade);}
.sk-card::before,.sk-pix::before{content:'';width:0.6rem;height:0.6rem;border-radius:50%;background:currentColor;}
.sg-card{font-size:0.6rem;margin-bottom:0;}
.sg-pix{font-size:0.74rem;margin-bottom:0.25rem;}
.sg-total{margin:0 0 0.5rem;}

/* SEO: o h1 é a frase da empresa (mesmo visual de antes) e "Como você quer comprar?" virou h2 com o visual antigo do h1 */
h1.gate-tagline{font-family:var(--font-brand);font-weight:500;font-size:clamp(0.85rem, 2vw, 0.98rem);letter-spacing:0.01em;line-height:1.45;color:var(--ink-700);max-width:26rem;}
.gate h2.gate-title{width:100%;overflow-wrap:break-word;font-family:'Anton', var(--font-display);font-weight:400;font-size:clamp(1.6rem,7vw,3.2rem);line-height:1.08;}
.about-block{max-width:46rem;margin:0 auto 1.6rem;text-align:left;display:flex;flex-direction:column;gap:0.5rem;}
.about-block p{font-size:0.88rem;line-height:1.55;color:var(--ink-700);}
.reviews-google{font-size:0.88rem;font-weight:600;color:var(--ink-700);text-decoration:underline;text-underline-offset:3px;}
.reviews-google:hover{color:var(--ink-900);}
.rv-google-btn{display:block;padding:0.8rem 1.1rem;border-radius:999px;text-decoration:none;text-align:center;}
.review-tags{display:flex;gap:0.3rem;flex-wrap:wrap;justify-content:flex-end;}
.review-tag--google{background:#E8F0FE;color:#1A56C4;}

/* ---------- perguntas frequentes ---------- */
.faq{padding:1.5rem 1.25rem 2.5rem;max-width:72rem;margin:0 auto;width:100%;}
.faq .section-head{margin-bottom:1.1rem;}
.faq-list{display:flex;flex-direction:column;gap:0.55rem;max-width:52rem;}
.faq-item{background:var(--surface);border:1.5px solid var(--sand-200);border-radius:16px;overflow:hidden;}
.faq-item summary{
  list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:0.8rem;
  padding:0.9rem 1.05rem;font-weight:700;font-size:0.95rem;line-height:1.35;color:var(--ink-900);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:'+';flex:none;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--sand-100);
  display:flex;align-items:center;justify-content:center;font-size:1.1rem;font-weight:700;color:var(--ink-700);transition:transform 0.2s ease;
}
.faq-item[open] summary::after{content:'−';}
.faq-item[open]{border-color:var(--ink-500);}
.faq-item summary:focus-visible{outline:2px solid var(--accent-strong);outline-offset:-2px;border-radius:16px;}
.faq-item p{padding:0 1.05rem 1rem;font-size:0.92rem;line-height:1.55;color:var(--ink-700);}