*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: none; }
ul, ol { list-style: none; }
button { font-family: inherit; cursor: pointer; background: none; border: none; color: inherit; }
img { display: block; max-width: 100%; }
input, select, textarea, button { font-family: inherit; }
h1, h2, h3, h4, h5, h6 { font-weight: inherit; }

:root {
    --gold: #D4AF37;
    --gold-light: #F0D060;
    --gold-dark: #A08020;
    --black: #0A0A0A;
    --zinc-900: #18181b;
    --zinc-950: #09090b;

    --accent: #D4AF37;
    --accent-light: #F0D060;
    --accent-dark: #A08020;
    --accent-rgb: 212, 175, 55;
    --accent-grad: linear-gradient(135deg, #F0D060 0%, #D4AF37 50%, #A08020 100%);
    --accent-soft: rgba(212, 175, 55, 0.12);
    --accent-glow: rgba(212, 175, 55, 0.25);
}

.tema-feminino {
    --accent: #E6A4B4;
    --accent-light: #F6CAD4;
    --accent-dark: #C2718A;
    --accent-rgb: 230, 164, 180;
    --accent-grad: linear-gradient(135deg, #F6CAD4 0%, #E6A4B4 45%, #C2718A 100%);
    --accent-soft: rgba(230, 164, 180, 0.12);
    --accent-glow: rgba(230, 164, 180, 0.28);
}

.tema-masculino {
    --accent: #8FB8D8;
    --accent-light: #BCD6EC;
    --accent-dark: #4E7CA3;
    --accent-rgb: 143, 184, 216;
    --accent-grad: linear-gradient(135deg, #BCD6EC 0%, #8FB8D8 45%, #4E7CA3 100%);
    --accent-soft: rgba(143, 184, 216, 0.12);
    --accent-glow: rgba(143, 184, 216, 0.28);
}

.tema-unissex {
    --accent: #D4AF37;
    --accent-light: #F0D060;
    --accent-dark: #A08020;
    --accent-rgb: 212, 175, 55;
    --accent-grad: linear-gradient(135deg, #F0D060 0%, #D4AF37 50%, #A08020 100%);
    --accent-soft: rgba(212, 175, 55, 0.12);
    --accent-glow: rgba(212, 175, 55, 0.25);
}

.text-accent { color: var(--accent); }
.bg-accent { background-color: var(--accent); }
.border-accent { border-color: var(--accent); }
.accent-gradient-text {
    background: var(--accent-grad);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.btn-gold, .btn-accent, .btn-gold-outline, .btn-accent-outline {
    text-indent: 0.12em;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
}

.btn-accent {
    position: relative;
    overflow: hidden;
    display: inline-block;
    background: var(--accent-grad);
    color: #0A0A0A;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-align: center;
    border: none;
    cursor: pointer;
    transition: transform 0.25s cubic-bezier(.2,.7,.3,1), box-shadow 0.25s ease, filter 0.2s ease;
}
.btn-accent::before {
    content: "";
    position: absolute; top: 0; left: -120%;
    width: 60%; height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255,255,255,0.55), transparent);
    transform: skewX(-20deg);
    transition: left 0.6s cubic-bezier(.2,.7,.3,1);
    pointer-events: none;
}
.btn-accent:hover { transform: translateY(-2px); filter: brightness(1.06); box-shadow: 0 10px 28px var(--accent-glow); }
.btn-accent:hover::before { left: 130%; }
.btn-accent:active { transform: translateY(0); }
.btn-accent:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    font-family: 'Inter', sans-serif;
    background-color: var(--black);
    color: #fff;
    -webkit-font-smoothing: antialiased;
}

.font-playfair { font-family: var(--fonte-titulo, 'Playfair Display'), serif; }
.font-inter { font-family: 'Inter', sans-serif; }

.text-gradient {
    background: linear-gradient(135deg, #F0D060 0%, #D4AF37 50%, #A08020 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.text-gold { color: var(--gold); }
.bg-gold { background-color: var(--gold); }
.border-gold { border-color: var(--gold); }

.btn-gold {
    position: relative;
    overflow: hidden;
    display: inline-block;
    background: linear-gradient(135deg, #F0D060 0%, #D4AF37 45%, #A08020 100%);
    color: #0A0A0A;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    border: none;
    text-align: center;
    transition: transform 0.25s cubic-bezier(.2,.7,.3,1), box-shadow 0.25s ease, filter 0.2s ease;
}
.btn-gold::before {
    content: "";
    position: absolute; top: 0; left: -120%;
    width: 60%; height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255,255,255,0.55), transparent);
    transform: skewX(-20deg);
    transition: left 0.6s cubic-bezier(.2,.7,.3,1);
    pointer-events: none;
}
.btn-gold:hover { transform: translateY(-2px); filter: brightness(1.05); box-shadow: 0 10px 28px rgba(212,175,55,0.32); }
.btn-gold:hover::before { left: 130%; }
.btn-gold:active { transform: translateY(0); }
.btn-gold:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }

.btn-gold-outline {
    position: relative;
    overflow: hidden;
    display: inline-block;
    border: 1px solid rgba(212,175,55,0.6);
    color: var(--gold);
    font-weight: 500;
    font-family: 'Inter', sans-serif;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    background: transparent;
    text-align: center;
    transition: color 0.3s ease, border-color 0.3s ease, transform 0.25s cubic-bezier(.2,.7,.3,1), box-shadow 0.25s ease;
}
.btn-gold-outline::after {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(135deg, #F0D060, #A08020);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s cubic-bezier(.2,.7,.3,1);
    z-index: -1;
}
.btn-gold-outline:hover {
    color: #0A0A0A;
    border-color: var(--gold);
    transform: translateY(-2px);
    box-shadow: 0 10px 26px rgba(212,175,55,0.25);
}
.btn-gold-outline:hover::after { transform: scaleX(1); }
.btn-gold-outline:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

.btn-accent-outline {
    position: relative;
    overflow: hidden;
    display: inline-block;
    border: 1px solid rgba(var(--accent-rgb), 0.6);
    color: var(--accent);
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    cursor: pointer;
    background: transparent;
    text-align: center;
    transition: color 0.3s ease, border-color 0.3s ease, transform 0.25s cubic-bezier(.2,.7,.3,1), box-shadow 0.25s ease;
}
.btn-accent-outline::after {
    content: "";
    position: absolute; inset: 0;
    background: var(--accent-grad);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.35s cubic-bezier(.2,.7,.3,1);
    z-index: -1;
}
.btn-accent-outline:hover {
    color: #0A0A0A;
    border-color: var(--accent);
    transform: translateY(-2px);
    box-shadow: 0 10px 26px var(--accent-glow);
}
.btn-accent-outline:hover::after { transform: scaleX(1); }
.btn-accent-outline:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.produto-card {
    display: block;
    transition: transform 0.3s cubic-bezier(.2,.7,.3,1);
}
.produto-card .produto-thumb {
    position: relative;
    aspect-ratio: 1;
    background: #18181b;
    border: 1px solid rgba(255,255,255,0.06);
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.3s, box-shadow 0.3s;
}
.produto-card:hover { transform: translateY(-4px); }
.produto-card:hover .produto-thumb {
    border-color: rgba(var(--accent-rgb), 0.5);
    box-shadow: 0 12px 32px rgba(0,0,0,0.5), 0 0 0 1px rgba(var(--accent-rgb),0.25);
}
.produto-card .produto-thumb img {
    width: 100%; height: 100%; object-fit: cover;
    transition: transform 0.6s cubic-bezier(.2,.7,.3,1);
}
.produto-card:hover .produto-thumb img { transform: scale(1.07); }

.selo-desconto {
    position: absolute; top: 0; left: 0; z-index: 2;
    background: var(--accent-grad);
    color: #0A0A0A; font-weight: 700; font-size: 0.78rem;
    padding: 0.35rem 0.7rem; border-bottom-right-radius: 10px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.45);
}

.hero-genero {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(var(--accent-rgb), 0.25);
}
.hero-genero::before {
    content: "";
    position: absolute; inset: 0;
    background:
        radial-gradient(ellipse at 25% 30%, rgba(var(--accent-rgb), 0.30) 0%, transparent 60%),
        radial-gradient(ellipse at 80% 70%, rgba(var(--accent-rgb), 0.16) 0%, transparent 55%),
        linear-gradient(180deg, #0A0A0A 0%, #111 100%);
    z-index: 0;
}
.hero-genero > * { position: relative; z-index: 1; }

.genero-chip {
    border: 1px solid rgba(var(--accent-rgb), 0.4);
    color: var(--accent);
    background: var(--accent-soft);
}

.antialiased { -webkit-font-smoothing: antialiased; }
.max-w-7xl { max-width: 80rem; }
.max-w-5xl { max-width: 64rem; }
.max-w-4xl { max-width: 56rem; }
.max-w-3xl { max-width: 48rem; }
.max-w-2xl { max-width: 42rem; }
.max-w-xl { max-width: 36rem; }
.max-w-md { max-width: 28rem; }
.mx-auto { margin-left: auto; margin-right: auto; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-4 { padding-top: 1rem; padding-bottom: 1rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-8 { padding-top: 2rem; padding-bottom: 2rem; }
.py-12 { padding-top: 3rem; padding-bottom: 3rem; }
.py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; }
.flex-wrap { flex-wrap: wrap; }
.py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.py-20 { padding-top: 5rem; padding-bottom: 5rem; }
.pb-20 { padding-bottom: 5rem; }
.pb-8 { padding-bottom: 2rem; }
.pt-12 { padding-top: 3rem; }
.p-4 { padding: 1rem; }
.p-5 { padding: 1.25rem; }
.p-6 { padding: 1.5rem; }
.p-8 { padding: 2rem; }
.pt-4 { padding-top: 1rem; }
.pt-5 { padding-top: 1.25rem; }
.pt-6 { padding-top: 1.5rem; }
.mb-1 { margin-bottom: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-5 { margin-bottom: 1.25rem; }
.mb-6 { margin-bottom: 1.5rem; }
.mb-8 { margin-bottom: 2rem; }
.mb-10 { margin-bottom: 2.5rem; }
.mb-12 { margin-bottom: 3rem; }
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-3 { margin-top: 0.75rem; }
.mt-4 { margin-top: 1rem; }
.mt-6 { margin-top: 1.5rem; }
.mt-7 { margin-top: 1.75rem; }
.mt-8 { margin-top: 2rem; }
.mt-10 { margin-top: 2.5rem; }
.mt-12 { margin-top: 3rem; }
.gap-2 { gap: 0.5rem; }
.gap-3 { gap: 0.75rem; }
.gap-4 { gap: 1rem; }
.gap-5 { gap: 1.25rem; }
.gap-6 { gap: 1.5rem; }
.gap-8 { gap: 2rem; }
.gap-10 { gap: 2.5rem; }
.gap-12 { gap: 3rem; }
.flex { display: flex; }
.flex-col { flex-direction: column; }
.flex-1 { flex: 1 1 0%; }
.flex-shrink-0 { flex-shrink: 0; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.items-end { align-items: flex-end; }
.items-baseline { align-items: baseline; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.grid { display: grid; }
.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.col-span-2 { grid-column: span 2 / span 2; }
.space-y-2 > * + * { margin-top: 0.5rem; }
.space-y-3 > * + * { margin-top: 0.75rem; }
.space-y-4 > * + * { margin-top: 1rem; }
.space-y-5 > * + * { margin-top: 1.25rem; }
.space-y-8 > * + * { margin-top: 2rem; }
.block { display: block; }
.inline-block { display: inline-block; }
.inline { display: inline; }
.hidden { display: none; }
.relative { position: relative; }
.absolute { position: absolute; }
.sticky { position: sticky; }
.inset-0 { top: 0; right: 0; bottom: 0; left: 0; }
.top-0 { top: 0; }
.top-2 { top: 0.5rem; }
.top-24 { top: 6rem; }
.right-2 { right: 0.5rem; }
.left-2 { left: 0.5rem; }
.-top-2 { top: -0.5rem; }
.-right-2 { right: -0.5rem; }
.z-50 { z-index: 50; }
.w-full { width: 100%; }
.w-4 { width: 1rem; }
.w-5 { width: 1.25rem; }
.w-6 { width: 1.5rem; }
.w-10 { width: 2.5rem; }
.w-16 { width: 4rem; }
.w-20 { width: 5rem; }
.w-64 { width: 16rem; }
.h-4 { height: 1rem; }
.h-5 { height: 1.25rem; }
.h-6 { height: 1.5rem; }
.h-10 { height: 2.5rem; }
.h-20 { height: 5rem; }
.h-full { height: 100%; }
.min-h-\[70vh\] { min-height: 70vh; }
.min-h-\[80vh\] { min-height: 80vh; }
.min-w-0 { min-width: 0; }
.aspect-square { aspect-ratio: 1 / 1; }
.overflow-hidden { overflow: hidden; }
.border { border-width: 1px; border-style: solid; }
.border-t { border-top-width: 1px; border-top-style: solid; }
.border-b { border-bottom-width: 1px; border-bottom-style: solid; }
.border-y { border-top-width: 1px; border-top-style: solid; border-bottom-width: 1px; border-bottom-style: solid; }
.rounded-full { border-radius: 9999px; }
.text-xs { font-size: 0.75rem; line-height: 1rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
.text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
.text-5xl { font-size: 3rem; line-height: 1; }
.text-6xl { font-size: 3.75rem; line-height: 1; }
.text-8xl { font-size: 6rem; line-height: 1; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }
.uppercase { text-transform: uppercase; }
.tracking-wider { letter-spacing: 0.05em; }
.tracking-widest { letter-spacing: 0.1em; }
.leading-tight { line-height: 1.25; }
.leading-relaxed { line-height: 1.625; }
.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }
.line-through { text-decoration-line: line-through; }
.resize-none { resize: none; }
.cursor-pointer { cursor: pointer; }
.select-none { user-select: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
.opacity-20 { opacity: 0.2; }
.opacity-30 { opacity: 0.3; }
.transition-all { transition: all 0.2s; }
.transition-colors { transition: color 0.2s, background-color 0.2s, border-color 0.2s; }
.transition-transform { transition: transform 0.2s; }
.duration-300 { transition-duration: 300ms; }
.duration-500 { transition-duration: 500ms; }
.backdrop-blur { backdrop-filter: blur(8px); }
.line-clamp-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.object-cover { object-fit: cover; }
.font-mono { font-family: monospace; }

.text-white { color: #fff; }
.text-white\/20 { color: rgba(255,255,255,0.2); }
.text-white\/30 { color: rgba(255,255,255,0.3); }
.text-white\/40 { color: rgba(255,255,255,0.4); }
.text-white\/50 { color: rgba(255,255,255,0.5); }
.text-white\/60 { color: rgba(255,255,255,0.6); }
.text-white\/70 { color: rgba(255,255,255,0.7); }
.text-white\/80 { color: rgba(255,255,255,0.8); }
.text-black { color: #000; }
.text-red-400 { color: rgb(248,113,113); }
.text-red-400\/60 { color: rgba(248,113,113,0.6); }
.text-green-400 { color: rgb(74,222,128); }
.text-amber-200\/70 { color: rgba(253,230,138,0.7); }
.text-amber-400 { color: rgb(251,191,36); }

.bg-black { background-color: #000; }
.bg-black\/95 { background-color: rgba(0,0,0,0.95); }
.bg-zinc-800 { background-color: #27272a; }
.bg-zinc-900 { background-color: #18181b; }
.bg-zinc-950 { background-color: #09090b; }
.bg-zinc-950\/80 { background-color: rgba(9,9,11,0.8); }
.bg-zinc-900\/50 { background-color: rgba(24,24,27,0.5); }
.bg-zinc-900\/80 { background-color: rgba(24,24,27,0.8); }
.bg-transparent { background-color: transparent; }
.bg-gold\/5 { background-color: rgba(212,175,55,0.05); }
.bg-gold\/10 { background-color: rgba(212,175,55,0.1); }
.bg-red-600 { background-color: rgb(220,38,38); }
.bg-red-950\/20 { background-color: rgba(69,10,10,0.2); }
.bg-amber-950\/20 { background-color: rgba(69,26,3,0.2); }

.bg-gradient-to-br { background: linear-gradient(to bottom right, var(--tw-gradient-stops)); }
.from-black { --tw-gradient-stops: #000, var(--tw-gradient-to, transparent); }
.via-zinc-900 { --tw-gradient-stops: #000, #18181b, var(--tw-gradient-to, transparent); }
.to-black { --tw-gradient-to: #000; }

.border-white\/5 { border-color: rgba(255,255,255,0.05); }
.border-white\/10 { border-color: rgba(255,255,255,0.1); }
.border-white\/20 { border-color: rgba(255,255,255,0.2); }
.border-white\/40 { border-color: rgba(255,255,255,0.4); }
.border-gold\/20 { border-color: rgba(212,175,55,0.2); }
.border-gold\/30 { border-color: rgba(212,175,55,0.3); }
.border-gold\/40 { border-color: rgba(212,175,55,0.4); }
.border-gold\/60 { border-color: rgba(212,175,55,0.6); }
.border-red-900\/40 { border-color: rgba(127,29,29,0.4); }
.border-red-600\/50 { border-color: rgba(220,38,38,0.5); }
.border-green-600\/50 { border-color: rgba(22,163,74,0.5); }
.border-amber-600\/30 { border-color: rgba(217,119,6,0.3); }

.hover\:text-gold:hover { color: var(--gold); }
.hover\:text-white:hover { color: #fff; }
.hover\:underline:hover { text-decoration: underline; }
.hover\:border-gold\/40:hover { border-color: rgba(212,175,55,0.4); }
.hover\:border-gold\/60:hover { border-color: rgba(212,175,55,0.6); }
.hover\:border-white\/40:hover { border-color: rgba(255,255,255,0.4); }
.hover\:border-gold:hover { border-color: var(--gold); }
.hover\:bg-gold\/10:hover { background-color: rgba(212,175,55,0.1); }
.hover\:bg-red-400:hover { color: rgb(248,113,113); }
.hover\:scale-105:hover { transform: scale(1.05); }

.group:hover .group-hover\:text-gold { color: var(--gold); }
.group:hover .group-hover\:border-gold\/30 { border-color: rgba(212,175,55,0.3); }
.group:hover .group-hover\:border-gold\/60 { border-color: rgba(212,175,55,0.6); }
.group:hover .group-hover\:scale-105 { transform: scale(1.05); }
.group:hover .group-hover\:text-gold\/60 { color: rgba(212,175,55,0.6); }
.group-hover\:text-gold\/0 { color: rgba(212,175,55,0); }

.focus\:border-gold\/60:focus { border-color: rgba(212,175,55,0.6); }
.focus\:outline-none:focus { outline: none; }

@media (min-width: 640px) {
    .sm\:block { display: block; }
    .sm\:flex-row { flex-direction: row; }
}

@media (min-width: 768px) {
    .md\:flex { display: flex; }
    .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .md\:col-span-2 { grid-column: span 2 / span 2; }
    .md\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; }
    .md\:text-5xl { font-size: 3rem; line-height: 1; }
    .md\:text-7xl { font-size: 4.5rem; line-height: 1; }
    .md\:block { display: block; }
    .md\:hidden { display: none; }
}

@media (min-width: 1024px) {
    .lg\:w-64 { width: 16rem; }
    .lg\:flex-row { flex-direction: row; }
    .lg\:col-span-2 { grid-column: span 2 / span 2; }
    .lg\:col-span-3 { grid-column: span 3 / span 3; }
    .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.accent-amber-400 { accent-color: rgb(251,191,36); }

[x-cloak] { display: none !important; }

.campo-senha { position: relative; }
.campo-senha > input { padding-right: 2.75rem !important; }
.campo-senha .ver-senha {
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    padding: 0.25rem;
    display: flex;
    align-items: center;
    line-height: 0;
}
.campo-senha .ver-senha:hover { color: #D4AF37; }