:root{
    --gold:#d4af37;
    --gold-light:#f5d76e;
    --black:#0b0b0b;
    --card:#171717;
    --white:#ffffff;
    --gray:#b3b3b3;
}

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

html{
    scroll-behavior:smooth;
}

body{
    background:var(--black);
    color:white;
    font-family:'Inter',sans-serif;
}

.container{
    width:90%;
    max-width:1200px;
    margin:auto;
}

header{
    position:fixed;
    width:100%;
    top:0;
    z-index:1000;
    backdrop-filter:blur(10px);
    background:rgba(0,0,0,.85);
}

nav{
    height:80px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.logo{
    color:var(--gold);
    font-size:1.5rem;
    font-weight:800;
    text-decoration:none;
}

.nav-links{
    list-style:none;
    display:flex;
    gap:30px;
}

.nav-links a{
    text-decoration:none;
    color:white;
}

.menu-btn{
    display:none;
    background:none;
    border:none;
    color:white;
    font-size:1.8rem;
}

.hero{
    min-height:100vh;
    background:
        radial-gradient(ellipse at 50% 42%, rgba(212,175,55,.2), transparent 42%),
        radial-gradient(ellipse at 85% 15%, rgba(212,175,55,.1), transparent 32%),
        linear-gradient(135deg,rgba(23,19,10,.24),rgba(9,9,9,.28) 55%,rgba(22,17,10,.24)),
        url("imagenes/portada.jpeg");
    background-size:auto,auto,auto,cover;
    background-position:center,center,center,center;
    background-repeat:no-repeat;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
    text-align:center;
}

.overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.64);
}

.hero-content{
    position:relative;
    z-index:2;
}

.hero h1{
    font-size:5rem;
    font-family:'Montserrat',sans-serif;
}

.hero span{
    color:var(--gold);
}

.hero p{
    max-width:700px;
    margin:20px auto;
    color:#ddd;
}

.hero-buttons{
    margin-top:40px;
    display:flex;
    justify-content:center;
    gap:20px;
}

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    max-width:100%;
    min-height:52px;
    text-decoration:none;
    padding:15px 30px;
    border-radius:40px;
    font-weight:600;
    line-height:1.3;
    text-align:center;
    white-space:normal;
}

.btn-primary{
    background:var(--gold);
    color:black;
}

.btn-secondary{
    border:1px solid var(--gold);
    color:var(--gold);
}

section{
    padding:100px 0;
}

h2{
    text-align:center;
    margin-bottom:50px;
    font-size:2.5rem;
}

.cards{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:30px;
}

.category-card{
    background:var(--card);
    padding:40px;
    border-radius:20px;
    border:1px solid rgba(212,175,55,.2);
}

.about{
    background:linear-gradient(100deg,rgba(212,175,55,.07),transparent 65%);
    border-top:1px solid rgba(212,175,55,.12);
    border-bottom:1px solid rgba(212,175,55,.12);
}

.about-content{
    display:grid;
    grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
    align-items:center;
    gap:clamp(32px,7vw,100px);
}

.about-heading .about-kicker{
    color:var(--gold-light);
    font-size:.82rem;
    font-weight:600;
    text-transform:uppercase;
}

.about-heading h2{
    margin:12px 0 24px;
    text-align:left;
}

.about-copy{
    padding-left:26px;
    border-left:2px solid var(--gold);
}

.about-copy p{
    color:#dedede;
    font-size:1.05rem;
    line-height:1.8;
}

.about-copy p + p{
    margin-top:18px;
}

.gallery{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
    gap:25px;
}

.card{
    background:var(--card);
    border-radius:16px;
    overflow:hidden;
    transition:.3s;
}

.card:hover{
    transform:translateY(-7px);
}

.card img{
    width:100%;
    height:260px;
    object-fit:cover;
}

.product-card{
    color:inherit;
    text-decoration:none;
}

.card img.product-card-image{
    display:block;
    height:300px;
    padding:12px;
    background:#f5f3ed;
    object-fit:contain;
}

.product-card-copy{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-right:20px;
}

.product-card-copy span{
    color:var(--gold-light);
    font-size:.9rem;
}

.product-card:focus-visible{
    outline:2px solid var(--gold-light);
    outline-offset:4px;
}

.catalog-main{
    min-height:calc(100vh - 85px);
    padding:132px 0 80px;
}

.catalog-intro{
    margin-bottom:42px;
    text-align:center;
}

.catalog-eyebrow{
    color:var(--gold-light);
    font-size:.82rem;
    font-weight:700;
    text-transform:uppercase;
}

.catalog-intro h1{
    margin:12px 0 14px;
    font-family:'Montserrat',sans-serif;
    font-size:clamp(2.2rem,5vw,3.5rem);
}

.catalog-intro p{
    max-width:620px;
    margin:0 auto;
    color:#d4d4d4;
    line-height:1.7;
}

.catalog-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));
    gap:22px;
}

.catalog-item{
    overflow:hidden;
    border:1px solid rgba(212,175,55,.2);
    border-radius:10px;
    background:var(--card);
}

.catalog-item img{
    display:block;
    width:100%;
    height:340px;
    padding:12px;
    background:#f5f3ed;
    object-fit:contain;
}

.catalog-item figcaption{
    padding:14px 18px;
    color:#e6e6e6;
    font-size:.95rem;
}

.catalog-cta{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    margin:54px auto 0;
    padding:34px 20px;
    border-top:1px solid rgba(212,175,55,.2);
    text-align:center;
}

.catalog-cta h2{
    margin:0;
    font-size:1.7rem;
}

.catalog-cta p{
    max-width:560px;
    color:#d4d4d4;
    line-height:1.6;
}

.catalog-cta .btn{
    margin-top:10px;
}

.catalog-prices{
    width:min(100%,680px);
    margin:32px auto 0;
    padding:24px;
    border:1px solid rgba(212,175,55,.28);
    border-radius:10px;
    background:var(--card);
}

.catalog-prices h2{
    margin:0 0 10px;
    font-size:1.5rem;
}

.catalog-prices p{
    margin-bottom:18px;
    color:#d4d4d4;
    line-height:1.6;
    text-align:center;
}

.catalog-prices table{
    width:100%;
    border-collapse:collapse;
    text-align:left;
}

.catalog-prices th,
.catalog-prices td{
    padding:12px 10px;
    border-bottom:1px solid rgba(255,255,255,.1);
}

.catalog-prices th{
    color:var(--gold-light);
    font-size:.9rem;
}

.catalog-prices tr:last-child td{
    border-bottom:0;
}

.product-art{
    height:260px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--gold-light);
    font-size:5rem;
    background:radial-gradient(circle at 50% 45%,rgba(245,215,110,.2),transparent 38%),linear-gradient(145deg,#272216,#111);
}

.card:nth-child(even) .product-art{
    color:#f2eee2;
    background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.16),transparent 38%),linear-gradient(145deg,#252525,#111);
}

.card h3{
    padding:20px;
}

.steps{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
    gap:25px;
}

.step{
    text-align:center;
}

.step span{
    width:70px;
    height:70px;
    border-radius:50%;
    background:var(--gold);
    color:black;
    font-weight:bold;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:auto;
    margin-bottom:15px;
}

.review-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));
    gap:20px;
    margin-top:40px;
}

.review{
    min-width:0;
    padding:24px;
    border:1px solid rgba(212,175,55,.35);
    border-radius:12px;
    background:linear-gradient(145deg,#1c1b17,#121212 68%);
    box-shadow:0 12px 30px rgba(0,0,0,.2);
    text-align:left;
}

.review-heading{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:12px;
}

.review-heading h3{
    color:var(--white);
    font-size:1rem;
}

.review-heading span{
    flex:0 0 auto;
    color:var(--gray);
    font-size:.8rem;
}

.review-stars{
    margin:12px 0;
    color:#fbbc04;
    letter-spacing:2px;
}

.review p{
    color:#e3e3e3;
    line-height:1.65;
}

.review-source{
    display:inline-block;
    margin-top:16px;
    color:var(--gold-light);
    font-size:.9rem;
    text-decoration:none;
}

.reviews .container,
.contact .container{
    display:flex;
    flex-direction:column;
    align-items:center;
}

.reviews h2,
.contact h2{
    margin-bottom:18px;
}

.reviews .container > p,
.contact .container > p{
    max-width:640px;
    color:#ddd;
    line-height:1.6;
    text-align:center;
}

.reviews .btn,
.contact .btn{
    margin-top:22px;
}

.contact{
    text-align:center;
}

footer{
    text-align:center;
    padding:30px;
    border-top:1px solid rgba(255,255,255,.1);
}

.whatsapp-floating{
    position:fixed;
    bottom:25px;
    right:25px;
    width:65px;
    height:65px;
    display:flex;
    justify-content:center;
    align-items:center;
    border-radius:50%;
    background:#25d366;
    font-size:30px;
    text-decoration:none;
    z-index:1001;
}

.reveal{
    opacity:0;
    transform:translateY(40px);
    transition:.8s;
}

.reveal.active{
    opacity:1;
    transform:translateY(0);
}

@media(max-width:768px){

    section{
        padding:76px 0;
    }

    h2{
        font-size:2rem;
        margin-bottom:36px;
    }

    .btn{
        padding:14px 22px;
    }

    .review-grid{
        width:100%;
        grid-template-columns:1fr;
        margin-top:32px;
    }

    .review-heading{
        flex-wrap:wrap;
    }

    .about-content{
        grid-template-columns:1fr;
        gap:28px;
    }

    .about-heading h2{
        margin-bottom:22px;
    }

    .about-copy{
        padding-left:18px;
    }

    .hero h1{
        font-size:3rem;
    }

    .hero-buttons{
        flex-direction:column;
    }

    .card img.product-card-image{
        height:280px;
    }

    .catalog-main{
        padding-top:112px;
    }

    .catalog-grid{
        grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));
        gap:16px;
    }

    .catalog-item img{
        height:300px;
    }

    .nav-links{
        display:none;
        position:absolute;
        top:80px;
        left:0;
        right:0;
        padding:20px 5%;
        flex-direction:column;
        gap:18px;
        background:rgba(0,0,0,.96);
        border-top:1px solid rgba(212,175,55,.2);
    }

    .nav-links.open{
        display:flex;
    }

    .menu-btn{
        display:block;
    }
}