/* =========================
RESET
========================= */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{

font-family:'Montserrat',sans-serif;

background:
radial-gradient(circle at top right,
rgba(107,17,32,.18),
transparent 35%),

radial-gradient(circle at top left,
rgba(255,255,255,.03),
transparent 25%),

#050505;

color:white;

line-height:1.7;

overflow-x:hidden;

}

/* =========================
HEADER
========================= */

header{

position:sticky;
top:0;
z-index:999;

display:flex;
justify-content:space-between;
align-items:center;

padding:12px 8%;

background:#050505;

border-bottom:
1px solid rgba(255,255,255,.05);

backdrop-filter:blur(12px);

}

/* =========================
LOGO
========================= */

.logo-area{

display:flex;
align-items:center;

}

.logo-area img{

width:min(320px,32vw);

height:auto;

display:block;

transition:.3s ease;

}

.logo-area img:hover{

transform:scale(1.03);

}

/* =========================
MENU
========================= */

nav{

display:flex;

gap:35px;

}

nav a{

text-decoration:none;

color:rgba(255,255,255,.75);

font-weight:500;

position:relative;

transition:.3s;

}

nav a:hover{

color:white;

}

nav a::after{

content:'';

position:absolute;

left:0;
bottom:-8px;

width:0;
height:2px;

background:#6B1120;

transition:.3s;

}

nav a:hover::after{

width:100%;

}

/* =========================
HERO
========================= */

.hero{

display:flex;

justify-content:space-between;

align-items:center;

gap:80px;

padding:80px 8%;

min-height:85vh;

}

.hero-text{

max-width:650px;

}

.tag{

display:inline-block;

padding:10px 18px;

border-radius:999px;

background:
rgba(255,255,255,.03);

border:
1px solid rgba(255,255,255,.08);

color:#cfcfcf;

font-size:.8rem;

letter-spacing:2px;

margin-bottom:25px;

}

.hero-text h1{

font-size:clamp(3.5rem,8vw,6rem);

font-weight:900;

line-height:.95;

margin-bottom:25px;

background:
linear-gradient(
180deg,
#ffffff,
#d7d7d7
);

-webkit-background-clip:text;
-webkit-text-fill-color:transparent;

}

.hero-text p{

font-size:1.1rem;

color:#bdbdbd;

margin-bottom:35px;

max-width:550px;

}

/* =========================
BOTÕES
========================= */

.btn{

display:inline-block;

padding:18px 38px;

border-radius:12px;

background:#6B1120;

color:white;

text-decoration:none;

font-weight:700;

transition:.3s;

box-shadow:
0 0 20px rgba(107,17,32,.35);

}

.btn:hover{

transform:translateY(-4px);

box-shadow:
0 0 35px rgba(107,17,32,.55);

}

/* =========================
HERO IMAGE
========================= */

.hero-image{

display:flex;
justify-content:center;
align-items:center;

}

.hero-image img{

width:100%;

max-width:420px;

border-radius:24px;

opacity:1;

transition:
opacity .6s ease,
transform .5s ease;

box-shadow:
0 25px 60px rgba(0,0,0,.45);

}

.hero-image img:hover{

transform:translateY(-8px);

}

/* =========================
SECTIONS
========================= */

section{

padding:100px 8%;

}

/* =========================
TÍTULOS
========================= */

.section-title{

margin-bottom:50px;

}

.section-title span{

display:block;

font-size:.8rem;

letter-spacing:3px;

color:#8f8f8f;

margin-bottom:10px;

}

.section-title h2{

font-size:3rem;

font-weight:800;

margin-bottom:20px;

}

.section-title h2::after{

content:'';

display:block;

width:80px;
height:3px;

margin-top:15px;

background:#6B1120;

}

.section-title p{

max-width:650px;

color:#bdbdbd;

line-height:1.8;

}

/* =========================
COLEÇÃO
========================= */

.grid-produtos{

display:grid;

grid-template-columns:
repeat(auto-fit,minmax(260px,1fr));

gap:35px;

}

.produto{

text-decoration:none;

color:white;

background:
linear-gradient(
145deg,
rgba(255,255,255,.05),
rgba(255,255,255,.015)
);

border:
1px solid rgba(255,255,255,.06);

border-radius:22px;

overflow:hidden;

transition:
transform .4s ease,
box-shadow .4s ease;

position:relative;

}

.produto:hover{

transform:
translateY(-12px);

box-shadow:
0 30px 60px rgba(0,0,0,.45);

}

.produto img{

width:100%;

display:block;

transition:.6s;

}

.produto:hover img{

transform:scale(1.06);

}

.produto-info{

padding:22px;

text-align:center;

}

.produto-info h3{

font-size:1.1rem;

font-weight:700;

margin-bottom:8px;

}

.produto-info p{

font-size:.9rem;

color:#bdbdbd;

line-height:1.6;

}

/* =========================
PÁGINAS INTERNAS
========================= */

.produto-detalhe{

display:grid;

grid-template-columns:
1fr 1fr;

gap:70px;

align-items:center;

min-height:80vh;

}

.produto-detalhe-imagem{

display:flex;
justify-content:center;

}

.produto-detalhe-imagem img{

width:100%;

max-width:500px;

border-radius:24px;

box-shadow:
0 25px 60px rgba(0,0,0,.45);

}

.produto-detalhe-info h1{

font-size:clamp(2.5rem,5vw,4rem);

font-weight:900;

margin-bottom:25px;

}

.produto-tag{

display:inline-block;

padding:8px 16px;

border-radius:999px;

background:
rgba(255,255,255,.04);

border:
1px solid rgba(255,255,255,.08);

font-size:.75rem;

letter-spacing:2px;

margin-bottom:20px;

}

.produto-descricao{

color:#cfcfcf;

margin-bottom:30px;

line-height:1.9;

}

.produto-especificacoes{

margin-bottom:35px;

}

.produto-especificacoes p{

margin-bottom:10px;

color:#d8d8d8;

}

.btn-voltar{

display:inline-block;

text-decoration:none;

color:#cfcfcf;

font-weight:600;

transition:.3s;

}

.btn-voltar:hover{

color:white;

}


/* =========================
SOBRE PREMIUM
========================= */

.sobre-intro{

max-width:900px;

margin:0 auto 60px auto;

text-align:center;

}

.sobre-intro p{

color:#d0d0d0;

font-size:1.05rem;

line-height:1.9;

}

/* GRID DOS CARDS */

.sobre-cards{

display:grid;

grid-template-columns:
repeat(auto-fit,minmax(260px,1fr));

gap:30px;

margin-top:20px;

}

/* CARD */

.sobre-card{

position:relative;

display:flex;
flex-direction:column;
align-items:center;
justify-content:center;

text-align:center;

padding:40px 30px;

min-height:320px;

border-radius:24px;

background:
linear-gradient(
145deg,
rgba(255,255,255,.06),
rgba(255,255,255,.015)
);

border:
1px solid rgba(255,255,255,.08);

overflow:hidden;

backdrop-filter:blur(12px);

transition:
transform .35s ease,
box-shadow .35s ease,
border-color .35s ease;

}

/* BRILHO SUPERIOR */

.sobre-card::before{

content:'';

position:absolute;

top:0;
left:0;

width:100%;
height:2px;

background:
linear-gradient(
90deg,
transparent,
rgba(255,255,255,.5),
transparent
);

opacity:.5;

}

/* EFEITO HOVER */

.sobre-card:hover{

transform:
translateY(-12px)
scale(1.02);

border-color:
rgba(107,17,32,.55);

box-shadow:
0 25px 60px rgba(0,0,0,.55),
0 0 35px rgba(107,17,32,.30);

}

/* ÍCONE */

.sobre-icon{

width:80px;
height:80px;

display:flex;
align-items:center;
justify-content:center;

margin:0 auto 25px auto;

border-radius:20px;

font-size:2.2rem;

background:
linear-gradient(
145deg,
rgba(107,17,32,.45),
rgba(107,17,32,.12)
);

border:
1px solid rgba(255,255,255,.08);

box-shadow:
0 10px 30px rgba(107,17,32,.25);

}

/* TÍTULO */

.sobre-card h3{

font-size:1.35rem;

font-weight:700;

margin-bottom:15px;

color:white;

text-align:center;

}

/* TEXTO */

.sobre-card p{

color:#bdbdbd;

line-height:1.8;

font-size:.95rem;

max-width:260px;

margin:0 auto;

text-align:center;

}

/* MOBILE */

@media(max-width:900px){

.sobre-cards{

grid-template-columns:1fr;

gap:20px;

}

.sobre-card{

min-height:auto;

padding:30px 25px;

}

.sobre-icon{

width:65px;
height:65px;

font-size:1.8rem;

}

}

/* =========================
CONTATO
========================= */

#contato p{

color:#d0d0d0;

margin-bottom:30px;

}

/* =========================
FOOTER
========================= */

footer{

padding:60px 20px;

text-align:center;

border-top:
1px solid rgba(255,255,255,.05);

}

footer p{

color:#bdbdbd;

}

footer p:first-child{

margin-bottom:10px;

}

/* =========================
WHATSAPP
========================= */

.whatsapp-float{

position:fixed;

right:25px;
bottom:25px;

width:68px;
height:68px;

border-radius:50%;

display:flex;
justify-content:center;
align-items:center;

background:#111;

border:
1px solid rgba(255,255,255,.08);

color:#25D366;

font-size:32px;

text-decoration:none;

transition:.3s;

box-shadow:
0 15px 40px rgba(0,0,0,.4);

z-index:9999;

}

.whatsapp-float:hover{

transform:
translateY(-4px)
scale(1.08);

box-shadow:
0 0 25px rgba(37,211,102,.3);

}

/* =========================
MOBILE
========================= */

@media(max-width:900px){

header{

flex-direction:column;

gap:20px;

}

.logo-area img{

width:220px;

}

nav{

flex-wrap:wrap;

justify-content:center;

gap:18px;

}

.hero{

flex-direction:column;

text-align:center;

padding-top:40px;

gap:50px;

}

.hero-text{

display:flex;

flex-direction:column;

align-items:center;

}

.hero-image img{

max-width:280px;

}

.section-title h2{

font-size:2rem;

}

section{

padding:70px 8%;

}

.produto-detalhe{

grid-template-columns:1fr;

text-align:center;

gap:40px;

}

.produto-detalhe-imagem img{

max-width:320px;

}

.whatsapp-float{

width:60px;
height:60px;

font-size:28px;

}

}

/* =========================
CARRINHO — LINK DO MENU
========================= */

nav a.nav-carrinho{

display:inline-flex;

align-items:center;

gap:8px;

padding:7px 16px;

border-radius:999px;

background:
rgba(255,255,255,.03);

border:
1px solid rgba(255,255,255,.10);

color:#e6e6e6;

}

nav a.nav-carrinho::after{

display:none;

}

nav a.nav-carrinho:hover{

border-color:
rgba(107,17,32,.65);

background:
rgba(107,17,32,.18);

color:white;

}

nav a.nav-carrinho.tem-itens{

border-color:
rgba(107,17,32,.75);

box-shadow:
0 0 18px rgba(107,17,32,.30);

}

.carrinho-contador{

display:inline-block;

min-width:24px;

padding:1px 7px;

border-radius:999px;

background:#6B1120;

color:white;

font-size:.78rem;

font-weight:700;

line-height:1.6;

text-align:center;

}

/* =========================
SELETOR DE TAMANHO
========================= */

.tamanhos{

margin-bottom:28px;

}

.tamanhos-label{

display:block;

font-size:.78rem;

letter-spacing:2px;

color:#8f8f8f;

margin-bottom:12px;

text-transform:uppercase;

}

.tamanhos-opcoes{

display:flex;

flex-wrap:wrap;

gap:12px;

}

.produto-detalhe .tamanhos-opcoes{

justify-content:flex-start;

}

.tamanho-btn{

min-width:58px;

padding:12px 0;

border-radius:12px;

background:
rgba(255,255,255,.04);

border:
1px solid rgba(255,255,255,.12);

color:#d8d8d8;

font-family:'Montserrat',sans-serif;

font-size:.95rem;

font-weight:700;

letter-spacing:1px;

cursor:pointer;

transition:.3s;

}

.tamanho-btn:hover{

border-color:
rgba(107,17,32,.65);

color:white;

transform:translateY(-2px);

}

.tamanho-btn.ativo{

background:#6B1120;

border-color:#6B1120;

color:white;

box-shadow:
0 0 20px rgba(107,17,32,.40);

}

.tamanhos.pendente .tamanho-btn{

border-color:
rgba(214,72,72,.75);

}

.tamanhos.pendente .tamanhos-label{

color:#e08b8b;

}

/* =========================
BOTÃO ADICIONAR AO CARRINHO
========================= */

.btn-carrinho{

display:inline-block;

padding:18px 38px;

border-radius:12px;

background:
rgba(255,255,255,.05);

border:
1px solid rgba(255,255,255,.16);

color:white;

font-family:'Montserrat',sans-serif;

font-size:1rem;

font-weight:700;

cursor:pointer;

transition:.3s;

}

.btn-carrinho:hover{

transform:translateY(-4px);

border-color:
rgba(107,17,32,.75);

background:
rgba(107,17,32,.22);

box-shadow:
0 0 30px rgba(107,17,32,.35);

}

.btn-carrinho.confirmado{

animation:pulsoLegacy .6s ease;

}

@keyframes pulsoLegacy{

0%{
transform:scale(1);
}

45%{
transform:scale(1.05);
box-shadow:0 0 35px rgba(107,17,32,.55);
}

100%{
transform:scale(1);
}

}

.produto-acoes{

display:flex;

flex-wrap:wrap;

gap:15px;

margin-bottom:30px;

}

/* =========================
AVISO VISUAL
========================= */

.legacy-toast{

position:fixed;

left:50%;
bottom:35px;

transform:
translate(-50%,25px);

max-width:min(420px,88vw);

padding:16px 26px;

border-radius:14px;

background:
rgba(12,12,12,.96);

border:
1px solid rgba(107,17,32,.55);

color:white;

font-size:.92rem;

font-weight:600;

text-align:center;

letter-spacing:.3px;

box-shadow:
0 20px 50px rgba(0,0,0,.55),
0 0 30px rgba(107,17,32,.25);

opacity:0;

pointer-events:none;

transition:
opacity .35s ease,
transform .35s ease;

z-index:10000;

}

.legacy-toast.visivel{

opacity:1;

transform:
translate(-50%,0);

}

.legacy-toast.erro{

border-color:
rgba(214,72,72,.65);

box-shadow:
0 20px 50px rgba(0,0,0,.55),
0 0 30px rgba(214,72,72,.20);

}

/* =========================
PÁGINA DO CARRINHO
========================= */

.carrinho-lista{

display:flex;

flex-direction:column;

gap:18px;

}

.carrinho-item{

display:grid;

grid-template-columns:
92px 1fr auto auto;

align-items:center;

gap:22px;

padding:18px 22px;

border-radius:20px;

background:
linear-gradient(
145deg,
rgba(255,255,255,.05),
rgba(255,255,255,.015)
);

border:
1px solid rgba(255,255,255,.07);

transition:
border-color .3s ease,
transform .3s ease;

}

.carrinho-item:hover{

border-color:
rgba(107,17,32,.45);

transform:translateY(-3px);

}

.carrinho-item-imagem{

width:92px;
height:92px;

border-radius:14px;

overflow:hidden;

display:flex;
align-items:center;
justify-content:center;

background:
rgba(255,255,255,.03);

}

.carrinho-item-imagem img{

width:100%;
height:100%;

object-fit:cover;

display:block;

}

.carrinho-item-sem-imagem{

font-size:.7rem;

letter-spacing:2px;

color:#8f8f8f;

}

.carrinho-item-info{

display:flex;

flex-direction:column;

gap:6px;

text-align:left;

}

.carrinho-item-nome{

font-size:1.05rem;

font-weight:700;

color:white;

text-decoration:none;

transition:.3s;

}

a.carrinho-item-nome:hover{

color:#e0b4bc;

}

.carrinho-item-tamanho{

font-size:.85rem;

letter-spacing:1px;

color:#bdbdbd;

}

.carrinho-item-qtd{

display:flex;

align-items:center;

gap:10px;

}

.qtd-btn{

width:34px;
height:34px;

border-radius:10px;

background:
rgba(255,255,255,.04);

border:
1px solid rgba(255,255,255,.12);

color:#e6e6e6;

font-family:'Montserrat',sans-serif;

font-size:1.05rem;

font-weight:700;

line-height:1;

cursor:pointer;

transition:.3s;

}

.qtd-btn:hover{

border-color:
rgba(107,17,32,.70);

background:
rgba(107,17,32,.22);

color:white;

}

.qtd-valor{

min-width:26px;

text-align:center;

font-weight:700;

}

.carrinho-remover{

padding:10px 18px;

border-radius:10px;

background:transparent;

border:
1px solid rgba(255,255,255,.12);

color:#bdbdbd;

font-family:'Montserrat',sans-serif;

font-size:.85rem;

font-weight:600;

cursor:pointer;

transition:.3s;

}

.carrinho-remover:hover{

border-color:
rgba(214,72,72,.65);

color:white;

background:
rgba(214,72,72,.14);

}

.carrinho-vazio{

padding:60px 30px;

text-align:center;

border-radius:22px;

background:
linear-gradient(
145deg,
rgba(255,255,255,.04),
rgba(255,255,255,.012)
);

border:
1px solid rgba(255,255,255,.07);

}

.carrinho-vazio p{

color:#bdbdbd;

margin-bottom:25px;

}

.carrinho-resumo{

display:flex;

flex-wrap:wrap;

align-items:center;

justify-content:space-between;

gap:20px;

margin-top:40px;

padding:28px 30px;

border-radius:22px;

background:
linear-gradient(
145deg,
rgba(255,255,255,.06),
rgba(255,255,255,.015)
);

border:
1px solid rgba(255,255,255,.08);

}

.carrinho-total{

font-size:1.35rem;

font-weight:800;

letter-spacing:.5px;

}

.carrinho-acoes{

display:flex;

flex-wrap:wrap;

align-items:center;

gap:15px;

}

.btn-limpar{

padding:16px 28px;

border-radius:12px;

background:transparent;

border:
1px solid rgba(255,255,255,.14);

color:#cfcfcf;

font-family:'Montserrat',sans-serif;

font-size:.95rem;

font-weight:700;

cursor:pointer;

transition:.3s;

}

.btn-limpar:hover{

border-color:
rgba(214,72,72,.65);

color:white;

background:
rgba(214,72,72,.14);

}

.btn-finalizar{

border:none;

cursor:pointer;

font-family:'Montserrat',sans-serif;

font-size:1rem;

}

/* =========================
CARRINHO — MOBILE
========================= */

@media(max-width:900px){

.carrinho-item{

grid-template-columns:
72px 1fr;

gap:16px 18px;

padding:18px;

}

.carrinho-item-imagem{

width:72px;
height:72px;

}

.carrinho-item-qtd{

grid-column:1 / -1;

justify-content:center;

}

.carrinho-remover{

grid-column:1 / -1;

width:100%;

}

.carrinho-resumo{

flex-direction:column;

align-items:stretch;

text-align:center;

}

.carrinho-acoes{

flex-direction:column;

align-items:stretch;

}

.produto-acoes{

justify-content:center;

}

.tamanhos-opcoes{

justify-content:center;

}

nav a.nav-carrinho{

order:5;

}

}

/* =========================
MENU LATERAL — BOTÃO
========================= */

.drawer-abrir{

display:inline-flex;

align-items:center;

gap:9px;

padding:9px 20px;

border-radius:999px;

background:
rgba(255,255,255,.03);

border:
1px solid rgba(255,255,255,.12);

color:#e6e6e6;

font-family:'Montserrat',sans-serif;

font-size:.82rem;

font-weight:700;

letter-spacing:2px;

cursor:pointer;

transition:
background .3s ease,
border-color .3s ease,
color .3s ease,
transform .3s ease;

}

.drawer-abrir:hover{

border-color:
rgba(107,17,32,.70);

background:
rgba(107,17,32,.20);

color:white;

transform:translateY(-2px);

}

.drawer-abrir-icone{

font-size:1rem;

line-height:1;

}

/* =========================
MENU LATERAL — FUNDO
========================= */

.drawer-overlay{

position:fixed;

inset:0;

background:
rgba(0,0,0,.65);

backdrop-filter:blur(3px);

opacity:0;

visibility:hidden;

transition:
opacity .4s ease,
visibility .4s ease;

z-index:10050;

}

.drawer-overlay.visivel{

opacity:1;

visibility:visible;

}

body.drawer-travado{

overflow:hidden;

}

/* =========================
MENU LATERAL — PAINEL
========================= */

.drawer{

position:fixed;

top:0;
left:0;

width:min(340px,86vw);

height:100%;

display:flex;

flex-direction:column;

padding:28px 30px 34px 30px;

background:
linear-gradient(
160deg,
#0c0c0c,
#050505 60%
);

border-right:
1px solid rgba(255,255,255,.07);

box-shadow:
25px 0 70px rgba(0,0,0,.65);

transform:
translateX(-100%);

visibility:hidden;

overflow-y:auto;

transition:
transform .45s cubic-bezier(.22,.61,.36,1),
visibility .45s ease;

z-index:10060;

}

.drawer.aberto{

transform:
translateX(0);

visibility:visible;

}

.drawer-topo{

display:flex;

align-items:center;

justify-content:space-between;

padding-bottom:22px;

margin-bottom:26px;

border-bottom:
1px solid rgba(255,255,255,.07);

}

.drawer-marca{

font-size:1.1rem;

font-weight:900;

letter-spacing:5px;

color:white;

}

.drawer-fechar{

width:38px;
height:38px;

border-radius:10px;

background:
rgba(255,255,255,.04);

border:
1px solid rgba(255,255,255,.10);

color:#cfcfcf;

font-size:1rem;

line-height:1;

cursor:pointer;

transition:.3s;

}

.drawer-fechar:hover{

border-color:
rgba(107,17,32,.70);

background:
rgba(107,17,32,.22);

color:white;

}

.drawer-nav{

display:flex;

flex-direction:column;

justify-content:flex-start;

align-items:stretch;

gap:30px;

flex:1;

}

/* Neutraliza as regras globais de nav dentro do painel */

.drawer-nav a::after{

display:none;

}

.drawer-grupo{

display:flex;

flex-direction:column;

gap:4px;

}

.drawer-grupo-titulo{

display:block;

font-size:.72rem;

letter-spacing:3px;

text-transform:uppercase;

color:#8f8f8f;

margin-bottom:10px;

}

.drawer-link{

position:relative;

display:flex;

align-items:center;

justify-content:space-between;

gap:12px;

padding:12px 14px;

border-radius:12px;

text-decoration:none;

color:#d8d8d8;

font-size:.98rem;

font-weight:600;

letter-spacing:.5px;

transition:
background .3s ease,
color .3s ease,
padding-left .3s ease;

}

a.drawer-link::before{

content:'';

position:absolute;

left:0;

top:50%;

width:2px;

height:0;

background:#6B1120;

border-radius:2px;

transform:translateY(-50%);

transition:height .3s ease;

}

a.drawer-link:hover{

background:
rgba(255,255,255,.04);

color:white;

padding-left:20px;

}

a.drawer-link:hover::before{

height:60%;

}

.drawer-link-forte{

font-size:1.02rem;

font-weight:700;

}

.drawer-link-breve{

color:#6f6f6f;

cursor:default;

}

.drawer-link-breve em{

font-style:normal;

font-size:.68rem;

letter-spacing:1.5px;

text-transform:uppercase;

padding:4px 10px;

border-radius:999px;

background:
rgba(255,255,255,.04);

border:
1px solid rgba(255,255,255,.08);

color:#8f8f8f;

}

.drawer-link-carrinho{

border:
1px solid rgba(255,255,255,.10);

justify-content:flex-start;

gap:10px;

}

.drawer-rodape{

padding-top:22px;

margin-top:26px;

border-top:
1px solid rgba(255,255,255,.07);

}

.drawer-rodape p{

font-size:.78rem;

letter-spacing:1.5px;

color:#8f8f8f;

}

/* =========================
GUIA DE TAMANHOS
========================= */

.guia-intro{

max-width:820px;

margin-bottom:45px;

}

.guia-intro p{

color:#d0d0d0;

line-height:1.9;

}

.tabela-medidas-wrapper{

overflow-x:auto;

border-radius:22px;

border:
1px solid rgba(255,255,255,.07);

background:
linear-gradient(
145deg,
rgba(255,255,255,.05),
rgba(255,255,255,.015)
);

}

.tabela-medidas{

width:100%;

min-width:620px;

border-collapse:collapse;

text-align:left;

}

.tabela-medidas caption{

padding:22px 26px 0 26px;

text-align:left;

font-size:.75rem;

letter-spacing:2.5px;

text-transform:uppercase;

color:#8f8f8f;

}

.tabela-medidas thead th{

padding:20px 26px;

font-size:.78rem;

font-weight:700;

letter-spacing:2px;

text-transform:uppercase;

color:#bdbdbd;

border-bottom:
1px solid rgba(255,255,255,.10);

}

.tabela-medidas tbody th{

padding:20px 26px;

font-size:1.15rem;

font-weight:800;

color:white;

}

.tabela-medidas tbody td{

padding:20px 26px;

color:#d8d8d8;

}

.tabela-medidas tbody tr{

transition:background .3s ease;

}

.tabela-medidas tbody tr:not(:last-child) th,
.tabela-medidas tbody tr:not(:last-child) td{

border-bottom:
1px solid rgba(255,255,255,.05);

}

.tabela-medidas tbody tr:hover{

background:
rgba(107,17,32,.14);

}

.guia-aviso{

max-width:760px;

margin-top:25px;

font-size:.9rem;

color:#9f9f9f;

line-height:1.8;

}

.guia-medir{

margin-top:70px;

}

.guia-medir h3{

font-size:1.6rem;

font-weight:800;

margin-bottom:30px;

}

.guia-medir-cards{

display:grid;

grid-template-columns:
repeat(auto-fit,minmax(260px,1fr));

gap:25px;

}

.guia-medir-card{

position:relative;

padding:32px 28px;

border-radius:22px;

background:
linear-gradient(
145deg,
rgba(255,255,255,.05),
rgba(255,255,255,.015)
);

border:
1px solid rgba(255,255,255,.07);

transition:
transform .35s ease,
border-color .35s ease,
box-shadow .35s ease;

}

.guia-medir-card:hover{

transform:translateY(-8px);

border-color:
rgba(107,17,32,.50);

box-shadow:
0 25px 55px rgba(0,0,0,.50);

}

.guia-medir-numero{

display:block;

font-size:.8rem;

font-weight:800;

letter-spacing:3px;

color:#6B1120;

margin-bottom:14px;

}

.guia-medir-card h4{

font-size:1.1rem;

font-weight:700;

margin-bottom:12px;

color:white;

}

.guia-medir-card p{

color:#bdbdbd;

font-size:.94rem;

line-height:1.8;

}

.guia-imagem-area{

margin-top:60px;

padding:70px 30px;

text-align:center;

border-radius:22px;

border:
1px dashed rgba(255,255,255,.14);

background:
rgba(255,255,255,.015);

}

.guia-imagem-rotulo{

display:block;

font-size:.72rem;

letter-spacing:3px;

text-transform:uppercase;

color:#8f8f8f;

margin-bottom:14px;

}

.guia-imagem-area p{

color:#6f6f6f;

font-size:.92rem;

}

.guia-cta{

margin-top:60px;

padding:40px 30px;

text-align:center;

border-radius:22px;

background:
linear-gradient(
145deg,
rgba(255,255,255,.06),
rgba(255,255,255,.015)
);

border:
1px solid rgba(255,255,255,.08);

}

.guia-cta p{

color:#d0d0d0;

margin-bottom:25px;

}

/* =========================
MENU LATERAL E GUIA — MOBILE
========================= */

@media(max-width:900px){

.drawer-abrir{

order:-1;

padding:9px 18px;

}

.drawer{

padding:24px 24px 30px 24px;

}

.guia-medir{

margin-top:50px;

}

.guia-medir h3{

font-size:1.35rem;

}

.guia-imagem-area{

padding:50px 24px;

margin-top:45px;

}

.guia-cta{

margin-top:45px;

padding:32px 24px;

}

}

/* =========================
GRADE DE COLEÇÃO COM POUCAS PEÇAS
=========================

A regra padrão usa auto-fit, que colapsa as colunas vazias e faz
com que uma coleção de duas peças ocupe toda a largura da tela.
Esta variação mantém as colunas reservadas com auto-fill, de modo
que os cards fiquem do mesmo tamanho dos demais do site.
*/

.grid-produtos.grid-colecao{

grid-template-columns:
repeat(auto-fill,minmax(260px,1fr));

}

/* =========================
LISTA DE CARACTERÍSTICAS
========================= */

.produto-checklist{

list-style:none;

margin:0 0 22px 0;

padding:0;

display:flex;

flex-direction:column;

gap:11px;

}

.produto-checklist li{

position:relative;

padding-left:30px;

color:#d8d8d8;

line-height:1.6;

}

.produto-checklist li::before{

content:'✓';

position:absolute;

left:0;
top:0;

width:19px;
height:19px;

display:flex;
align-items:center;
justify-content:center;

border-radius:50%;

background:
rgba(107,17,32,.30);

border:
1px solid rgba(107,17,32,.65);

color:#e7b9c2;

font-size:.65rem;

font-weight:700;

line-height:1;

}

@media(max-width:900px){

.produto-checklist{

align-items:flex-start;

text-align:left;

max-width:320px;

margin-left:auto;

margin-right:auto;

}

}

/* =========================
CABEÇALHO REFORMULADO
=========================

Desktop: MENU e logo agrupados à esquerda, carrinho à direita.
Mobile:  MENU | LOGO | CARRINHO em uma única linha, logo centralizada.
Os links de navegação passam a existir apenas no menu lateral.
*/

header{

justify-content:flex-start;

gap:28px;

padding:14px 6%;

}

header .logo-area{

margin-right:auto;

}

.logo-area img{

width:min(360px,30vw);

}

header nav{

gap:0;

}

/* =========================
CABEÇALHO — MOBILE
========================= */

@media(max-width:900px){

header{

display:grid;

grid-template-columns:
minmax(0,1fr) auto minmax(0,1fr);

align-items:center;

flex-direction:row;

gap:10px;

padding:12px 4%;

}

header .drawer-abrir{

justify-self:start;

order:0;

padding:9px 14px;

font-size:.7rem;

letter-spacing:1.5px;

gap:7px;

}

header .logo-area{

justify-self:center;

margin-right:0;

}

.logo-area img{

width:min(190px,36vw);

}

header nav{

justify-self:end;

flex-wrap:nowrap;

justify-content:flex-end;

gap:0;

}

/* No mobile o carrinho fica compacto, apenas ícone e contador.
   O rótulo é ocultado e o ícone reposto por pseudoelemento. */

nav a.nav-carrinho{

order:0;

gap:6px;

padding:8px 12px;

font-size:0;

}

nav a.nav-carrinho::before{

content:'🛒';

font-size:1rem;

line-height:1;

}

nav a.nav-carrinho .carrinho-contador{

font-size:.72rem;

min-width:20px;

padding:1px 6px;

}

}

/* Telas muito estreitas */

@media(max-width:400px){

header{

gap:6px;

padding:12px 3%;

}

header .drawer-abrir{

padding:9px 11px;

font-size:0;

gap:0;

}

header .drawer-abrir .drawer-abrir-icone{

font-size:1.05rem;

}

.logo-area img{

width:min(190px,40vw);

}

}

/* =========================
RECOMENDADOS PARA VOCÊ
========================= */

.recomendados{

padding-top:0;

border-top:
1px solid rgba(255,255,255,.05);

margin-top:20px;

}

.recomendados .section-title{

margin-bottom:38px;

padding-top:70px;

}

.recomendados .section-title h2{

font-size:1.9rem;

letter-spacing:1px;

margin-bottom:0;

}

.recomendados .section-title h2::after{

margin-top:18px;

}

.recomendados-trilha{

display:grid;

grid-template-columns:
repeat(4,1fr);

gap:28px;

}

/* Os cards reaproveitam a classe .produto, então o hover,
   a borda e a sombra são exatamente os da grade de coleção. */

.recomendados-trilha .produto-info{

padding:20px 18px;

}

.recomendados-trilha .produto-info h3{

margin-bottom:0;

font-size:1rem;

}

/* =========================
RECOMENDADOS — TABLET
========================= */

@media(max-width:1100px) and (min-width:901px){

.recomendados-trilha{

grid-template-columns:
repeat(2,1fr);

gap:24px;

}

}

/* =========================
RECOMENDADOS — MOBILE
=========================

Vira carrossel horizontal, arrastável, com encaixe por card
e sem barra de rolagem visível.
*/

@media(max-width:900px){

.recomendados .section-title{

padding-top:55px;

margin-bottom:28px;

}

.recomendados .section-title h2{

font-size:1.5rem;

}

.recomendados-trilha{

display:flex;

grid-template-columns:none;

gap:16px;

overflow-x:auto;

overflow-y:hidden;

scroll-snap-type:x mandatory;

/* Sem isto o encaixe engole a margem lateral e o primeiro
   card encosta na borda da tela */

scroll-padding-left:8%;

scroll-behavior:smooth;

-webkit-overflow-scrolling:touch;

overscroll-behavior-x:contain;

scrollbar-width:none;

-ms-overflow-style:none;

padding-bottom:6px;

/* Sangra até a borda da tela e devolve o respiro interno */

margin-left:-8%;

margin-right:-8%;

padding-left:8%;

padding-right:8%;

}

.recomendados-trilha::-webkit-scrollbar{

display:none;

}

.recomendados-trilha .produto{

flex:0 0 72%;

max-width:280px;

scroll-snap-align:start;

}

/* No toque o realce de hover não se aplica */

.recomendados-trilha .produto:hover{

transform:none;

}

}

/* =========================
PREÇOS
=========================

Branco, Montserrat pesado e sem selos promocionais: o valor
aparece como parte natural do card, não como oferta.
*/

.produto-info .produto-preco{

margin-top:14px;

font-family:'Montserrat',sans-serif;

font-size:1.2rem;

font-weight:800;

letter-spacing:.5px;

color:#ffffff;

line-height:1.2;

}

.produto-preco-detalhe{

margin:-8px 0 26px 0;

font-family:'Montserrat',sans-serif;

font-size:1.7rem;

font-weight:800;

letter-spacing:.5px;

color:#ffffff;

line-height:1.2;

}

.recomendados-trilha .produto-info .produto-preco{

margin-top:8px;

font-size:1.05rem;

}

/* =========================
KITS — COMPLETE SEU KIT
========================= */

.grid-kits{

display:grid;

grid-template-columns:
repeat(2,minmax(0,1fr));

gap:35px;

max-width:980px;

margin:0 auto;

}

.kit-card{

display:flex;

flex-direction:column;

}

.kit-imagens{

display:grid;

grid-template-columns:
1fr 1fr;

gap:2px;

overflow:hidden;

}

.kit-imagens img{

width:100%;

aspect-ratio:1 / 1;

object-fit:cover;

}

.kit-card .produto-info{

flex:1;

display:flex;

flex-direction:column;

align-items:center;

padding:26px 24px 28px;

}

.kit-card .produto-info h3{

font-size:1.25rem;

font-weight:800;

letter-spacing:1.5px;

margin-bottom:10px;

}

.kit-card .produto-info .kit-composicao{

font-size:.8rem;

letter-spacing:1px;

text-transform:uppercase;

color:#8f8f8f;

}

.kit-card .produto-info .kit-descricao{

margin:16px 0 22px;

flex:1;

}


@media(max-width:900px){

.grid-kits{

grid-template-columns:
minmax(0,1fr);

gap:26px;

max-width:460px;

}


}

/* =========================
CARRINHO — PREÇOS E KITS
========================= */

.carrinho-item-composicao{

font-size:.78rem;

letter-spacing:.5px;

color:#8f8f8f;

}

.carrinho-item-preco{

font-size:.98rem;

font-weight:800;

color:#ffffff;

}

.carrinho-item-subtotal{

font-size:.82rem;

color:#bdbdbd;

}

/* =========================
KIT DENTRO DA PÁGINA DO PRODUTO
========================= */

.kit-upsell{

display:flex;

align-items:center;

flex-wrap:wrap;

gap:16px;

margin-bottom:30px;

padding:16px 18px;

border-radius:18px;

background:
linear-gradient(
145deg,
rgba(255,255,255,.05),
rgba(255,255,255,.015)
);

border:1px solid rgba(255,255,255,.08);

}

.kit-upsell-imagens{

display:flex;

flex-shrink:0;

}

.kit-upsell-imagens img{

width:58px;

height:58px;

object-fit:cover;

border-radius:12px;

border:2px solid #0a0a0a;

}

.kit-upsell-imagens img + img{

margin-left:-14px;

}

.kit-upsell-texto{

flex:1;

min-width:200px;

display:flex;

flex-direction:column;

gap:4px;

}

.kit-upsell-rotulo{

font-size:.68rem;

letter-spacing:2px;

color:#8f8f8f;

}

.kit-upsell-texto strong{

font-size:1rem;

font-weight:800;

color:#ffffff;

}

.kit-upsell-texto small{

font-size:.82rem;

line-height:1.5;

color:#bdbdbd;

}

.kit-upsell-botao{

display:inline-flex;

align-items:center;

justify-content:center;

min-height:46px;

padding:12px 22px;

border-radius:12px;

background:rgba(255,255,255,.05);

border:1px solid rgba(255,255,255,.16);

color:white;

font-family:'Montserrat',sans-serif;

font-size:.85rem;

font-weight:700;

letter-spacing:1px;

text-decoration:none;

cursor:pointer;

transition:.3s;

}

.kit-upsell-botao:hover{

transform:translateY(-3px);

border-color:rgba(107,17,32,.75);

background:rgba(107,17,32,.22);

box-shadow:0 0 30px rgba(107,17,32,.35);

}

.kit-upsell-botao.confirmado{

animation:pulsoLegacy .6s ease;

}

@media(max-width:900px){

.kit-upsell{

justify-content:center;

text-align:center;

}

.kit-upsell-texto{

align-items:center;

min-width:100%;

}

.kit-upsell-botao{

width:100%;

}

}

/* =========================
KITS — CARD DA HOME
========================= */

.kit-cta{

display:block;

width:100%;

padding:17px 20px;

border-radius:12px;

background:rgba(255,255,255,.05);

border:1px solid rgba(255,255,255,.16);

color:white;

font-size:.9rem;

font-weight:700;

letter-spacing:1.5px;

text-align:center;

transition:.3s;

}

.kit-card:hover .kit-cta{

border-color:rgba(107,17,32,.75);

background:rgba(107,17,32,.22);

}

/* =========================
PÁGINA DO KIT
========================= */

.kit-preview{

position:relative;

width:100%;

max-width:500px;

}

.kit-preview img{

width:100%;

display:block;

border-radius:24px;

box-shadow:0 25px 60px rgba(0,0,0,.45);

}

.kit-preview .kit-preview-acessorio{

position:absolute;

right:-14px;

bottom:-18px;

width:34%;

aspect-ratio:1 / 1;

object-fit:cover;

border:3px solid #0a0a0a;

border-radius:18px;

}

.kit-passo{

margin-bottom:26px;

}

.kit-opcoes{

display:grid;

grid-template-columns:
repeat(auto-fill,minmax(112px,1fr));

gap:12px;

}

.kit-opcao{

display:flex;

flex-direction:column;

align-items:center;

gap:8px;

padding:8px 8px 10px;

border-radius:14px;

background:rgba(255,255,255,.04);

border:1px solid rgba(255,255,255,.12);

color:#d8d8d8;

font-family:'Montserrat',sans-serif;

font-size:.72rem;

font-weight:700;

line-height:1.3;

letter-spacing:.3px;

cursor:pointer;

transition:.3s;

}

.kit-opcao img{

width:100%;

aspect-ratio:1 / 1;

object-fit:cover;

border-radius:10px;

}

.kit-opcao:hover{

border-color:rgba(107,17,32,.65);

color:white;

transform:translateY(-2px);

}

.kit-opcao.ativo{

background:rgba(107,17,32,.30);

border-color:#6B1120;

color:white;

box-shadow:0 0 20px rgba(107,17,32,.40);

}

/* Acessório único: aparece como item incluso, sem parecer escolha */

.kit-passo-fixo .kit-opcoes{

grid-template-columns:minmax(112px,132px);

}

.kit-passo-fixo .kit-opcao{

cursor:default;

}

.kit-passo-fixo .kit-opcao:hover{

transform:none;

border-color:#6B1120;

}

/* =========================
KIT NA PÁGINA DO PRODUTO — VÁRIOS KITS
========================= */

.kit-upsell.kit-upsell-lista{

flex-direction:column;

align-items:stretch;

gap:0;

padding:6px 18px;

}

.kit-upsell-linha{

display:flex;

align-items:center;

flex-wrap:wrap;

gap:16px;

padding:14px 0;

}

.kit-upsell-linha + .kit-upsell-linha{

border-top:1px solid rgba(255,255,255,.07);

}

.kit-upsell-texto small a{

color:#e0b4bc;

text-decoration:underline;

}

@media(max-width:900px){

.kit-preview{

margin:0 auto;

}

.kit-preview .kit-preview-acessorio{

right:6px;

bottom:-14px;

}

.kit-opcoes{

grid-template-columns:
repeat(2,minmax(0,1fr));

}

.kit-passo-fixo .kit-opcoes{

grid-template-columns:minmax(0,calc(50% - 6px));

}

.kit-upsell-linha{

justify-content:center;

text-align:center;

}

}