:root {
      --negro: #0a0a08;
      --dorado: #c9a84c;
      --dorado-claro: #e8c97a;
      --crema: #f5f0e8;
      --gris: #1a1a18;
      --gris-medio: #2e2e2a;
      --texto-claro: #b8b0a0;
      --blanco: #fdfaf5;
    }
    * { margin:0; padding:0; box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body { background:var(--negro); color:var(--blanco); font-family:'DM Sans',sans-serif; font-weight:300; overflow-x:hidden; }

    /* SMOKE */
    #smoke-canvas { position:fixed; inset:0; z-index:0; pointer-events:none; opacity:0.6; }

    /* AGE GATE */
    #agegate { position:fixed; inset:0; background:var(--negro); z-index:9999; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:2rem; transition:opacity 0.8s ease,visibility 0.8s; }
    #agegate.hidden { opacity:0; visibility:hidden; pointer-events:none; }
    .agegate-logo { font-family:'Bebas Neue',sans-serif; font-size:clamp(5rem,15vw,10rem); color:var(--dorado); letter-spacing:0.15em; line-height:1; text-shadow:0 0 80px rgba(201,168,76,0.3); }
    .agegate-line { width:60px; height:1px; background:var(--dorado); margin:0 auto; }
    .agegate-text { font-family:'Playfair Display',serif; font-style:italic; color:var(--texto-claro); font-size:1rem; letter-spacing:0.1em; text-align:center; }
    .agegate-pregunta { font-family:'Playfair Display',serif; font-size:clamp(1.2rem,3vw,1.6rem); color:var(--crema); text-align:center; letter-spacing:0.05em; }
    .agegate-btns { display:flex; gap:1rem; }
    .btn-age { padding:0.9rem 2.5rem; font-family:'DM Sans',sans-serif; font-weight:500; font-size:0.85rem; letter-spacing:0.2em; text-transform:uppercase; cursor:pointer; border:none; transition:all 0.3s; }
    .btn-si { background:var(--dorado); color:var(--negro); }
    .btn-si:hover { background:var(--dorado-claro); transform:translateY(-2px); }
    .btn-no { background:transparent; color:var(--texto-claro); border:1px solid var(--gris-medio); }
    .btn-no:hover { border-color:var(--texto-claro); }
    .agegate-disclaimer { font-size:0.7rem; color:#555; text-align:center; max-width:300px; line-height:1.6; }

  /* NAV */

nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;

    padding: 0.7rem 3rem;   /* antes 1.8rem 5rem */

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

    background: linear-gradient(
        to bottom,
        rgba(10,10,8,0.97),
        transparent
    );

    transition: background 0.4s;
}

nav.scrolled {
    background: rgba(10,10,8,0.98);
    padding: 0.5rem 3rem;   /* antes 1rem 4rem */
    border-bottom: 1px solid rgba(201,168,76,0.15);
}

.nav-logo {
    font-family: 'Bebas Neue', sans-serif;
    font-size: 1.8rem;      /* antes 2.2rem */
    color: var(--dorado);
    letter-spacing: 0.2em;
    text-decoration: none;
}

.nav-links {
    display: flex;
    gap: 1.8rem;            /* antes 2.5rem */
    list-style: none;
    align-items: center;
}

.nav-links a {
    font-size: 0.72rem;     /* antes 0.75 */
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--texto-claro);
    text-decoration: none;
    transition: color 0.3s;
    font-weight: 400;
}

.nav-links a:hover {
    color: var(--dorado);
}

.nav-cta {
    padding: 0.45rem 1.2rem; /* antes 0.6rem 1.5rem */
    border: 1px solid var(--dorado);
    color: var(--dorado) !important;
    transition: all 0.3s !important;
}

.nav-cta:hover {
    background: var(--dorado) !important;
    color: var(--negro) !important;
}



    /* HERO */

#hero {
    min-height: 100vh;
    position: relative;
    display: flex;
    align-items: flex-end;

    padding: 7rem 4rem 8rem; /* espacio para navbar */

    overflow: hidden;
}

.hero-bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(
            ellipse at 70% 40%,
            rgba(139,26,26,0.25) 0%,
            transparent 60%
        ),
        radial-gradient(
            ellipse at 20% 80%,
            rgba(201,168,76,0.1) 0%,
            transparent 50%
        ),
        var(--negro);
}

.hero-number {
    position: absolute;
    right: 4rem;
    top: 50%;
    transform: translateY(-60%);
    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(18rem, 30vw, 28rem);
    color: rgba(201,168,76,0.04);
    line-height: 1;
    user-select: none;
    letter-spacing: -0.05em;
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 700px;
}

.hero-tag {
    display: inline-block;
    font-size: 0.7rem;
    letter-spacing: 0.35em;
    text-transform: uppercase;
    color: var(--dorado);
    margin-bottom: 1.5rem;
    position: relative;
    padding-left: 2rem;
}

.hero-tag::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 1.2rem;
    height: 1px;
    background: var(--dorado);
}

.hero-titulo {
    font-family: 'Playfair Display', serif;
    font-size: clamp(3.5rem, 8vw, 7rem);
    line-height: 0.95;
    font-weight: 900;
    color: var(--blanco);
    margin-bottom: 1.5rem;
}

.hero-titulo em {
    font-style: italic;
    color: var(--dorado);
}

.hero-subtitulo {
    font-size: 1rem;
    color: var(--texto-claro);
    line-height: 1.7;
    max-width: 440px;
    margin-bottom: 3rem;
    font-weight: 300;
}

.hero-btns {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.btn-primario {
    display: inline-block;
    padding: 1rem 2.5rem;
    background: var(--dorado);
    color: var(--negro);
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.3s;
}

.btn-primario:hover {
    background: var(--dorado-claro);
    transform: translateY(-3px);
}

.btn-secundario {
    display: inline-block;
    padding: 1rem 2.5rem;
    border: 1px solid rgba(201,168,76,0.4);
    color: var(--blanco);
    font-size: 0.75rem;
    font-weight: 400;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    text-decoration: none;
    transition: all 0.3s;
}

.btn-secundario:hover {
    border-color: var(--dorado);
    color: var(--dorado);
}

.hero-scroll {
    position: absolute;
    bottom: 3rem;
    right: 4rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    color: var(--texto-claro);
    font-size: 0.65rem;
    letter-spacing: 0.25em;
    text-transform: uppercase;
}

.scroll-line {
    width: 1px;
    height: 60px;
    background: linear-gradient(
        to bottom,
        var(--dorado),
        transparent
    );
    animation: scrollDown 2s ease-in-out infinite;
}

@keyframes scrollDown {
    0%, 100% {
        transform: scaleY(1);
        opacity: 1;
    }
    50% {
        transform: scaleY(0.5);
        opacity: 0.4;
    }
}


    /* SECTIONS */
    section { padding:8rem 4rem; position:relative; z-index:1; }
    .seccion-tag { font-size:0.68rem; letter-spacing:0.35em; text-transform:uppercase; color:var(--dorado); display:flex; align-items:center; gap:1rem; margin-bottom:1rem; }
    .seccion-tag::after { content:''; flex:1; max-width:40px; height:1px; background:var(--dorado); }
    .seccion-titulo { font-family:'Playfair Display',serif; font-size:clamp(2.2rem,5vw,4rem); font-weight:900; line-height:1.05; color:var(--blanco); }
    .seccion-titulo em { font-style:italic; color:var(--dorado); }

    /* COCKTAILS */
    #cocktails { background:rgba(10,10,8,0.88); backdrop-filter:blur(2px); }
    .cocktails-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:5rem; }
    .cocktails-intro { color:var(--texto-claro); max-width:350px; line-height:1.7; font-size:0.95rem; }
    .cocktails-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
    @media(max-width:1100px){.cocktails-grid{grid-template-columns:repeat(2,1fr);}}
    .cocktail-card { position:relative; border:1px solid rgba(201,168,76,0.08); padding:2.5rem 2rem; overflow:hidden; cursor:pointer; transition:all 0.4s; background:rgba(26,26,24,0.5); }
    .cocktail-card:hover { background:rgba(201,168,76,0.06); border-color:rgba(201,168,76,0.3); transform:translateY(-4px); }
    .cocktail-num { font-family:'Bebas Neue',sans-serif; font-size:5rem; color:rgba(201,168,76,0.08); line-height:1; position:absolute; top:1rem; right:1rem; }
    .cocktail-img { width:100%; height:180px; object-fit:cover; display:block; transition:transform 0.5s ease; }
    .cocktail-card:hover .cocktail-img { transform:scale(1.05); }
    .cocktail-img-wrap { overflow:hidden; margin:-2.5rem -2rem 1.5rem; }
    .cocktail-nombre { font-family:'Playfair Display',serif; font-size:1.4rem; font-weight:700; color:var(--blanco); margin-bottom:0.5rem; }
    .cocktail-desc { font-size:0.82rem; color:var(--texto-claro); line-height:1.6; margin-bottom:1.5rem; }
    .cocktail-precio { font-family:'Bebas Neue',sans-serif; font-size:1.4rem; color:var(--dorado); letter-spacing:0.1em; }
    .cocktail-badge { position:absolute; top:1.5rem; left:1.5rem; font-size:0.6rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--negro); background:var(--dorado); padding:0.3rem 0.7rem; z-index:2; }

    /* BARRA */
    #barra { background:rgba(16,16,14,0.9); backdrop-filter:blur(3px); }
    .barra-bg-text { position:absolute; bottom:-2rem; left:-2rem; font-family:'Bebas Neue',sans-serif; font-size:clamp(10rem,25vw,22rem); color:rgba(201,168,76,0.03); line-height:1; user-select:none; white-space:nowrap; }
    .barra-layout { display:grid; grid-template-columns:1fr 1fr; gap:6rem; position:relative; z-index:2; }
    .barra-promos { display:flex; flex-direction:column; gap:1.5rem; margin-top:3rem; }
    .promo-card { display:flex; gap:1.5rem; align-items:flex-start; padding:1.5rem; border-left:2px solid var(--dorado); background:rgba(10,10,8,0.6); transition:all 0.3s; }
    .promo-card:hover { background:rgba(10,10,8,0.9); transform:translateX(4px); }
    .promo-icon { font-size:1.8rem; flex-shrink:0; }
    .promo-titulo { font-family:'Playfair Display',serif; font-size:1.1rem; font-weight:700; color:var(--blanco); margin-bottom:0.3rem; }
    .promo-desc { font-size:0.82rem; color:var(--texto-claro); line-height:1.6; }
    .promo-hora { font-size:0.68rem; letter-spacing:0.2em; color:var(--dorado); text-transform:uppercase; margin-top:0.5rem; }
    .horarios-titulo { font-family:'Playfair Display',serif; font-size:1.4rem; font-weight:700; color:var(--blanco); margin-bottom:2rem; }
    .horario-row { display:flex; justify-content:space-between; padding:1rem 0; border-bottom:1px solid rgba(201,168,76,0.1); font-size:0.88rem; }
    .horario-dia { color:var(--texto-claro); }
    .horario-tiempo { color:var(--dorado); font-weight:500; }
    .horario-tiempo.cerrado { color:#555; }
    .barra-mapa-link { display:inline-flex; align-items:center; gap:0.5rem; margin-top:2rem; color:var(--dorado); font-size:0.78rem; letter-spacing:0.2em; text-transform:uppercase; text-decoration:none; transition:gap 0.3s; }
    .barra-mapa-link:hover { gap:0.8rem; }

    /* PLANES */
    #planes { background:rgba(10,10,8,0.88); }
    .planes-header { text-align:center; margin-bottom:5rem; }
    .planes-intro { color:var(--texto-claro); max-width:500px; margin:1.5rem auto 0; line-height:1.7; }
    .planes-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; max-width:1100px; margin:0 auto; }
    .plan-card { border:1px solid rgba(201,168,76,0.15); padding:3rem 2.5rem; position:relative; transition:all 0.4s; background:rgba(26,26,24,0.4); }
    .plan-card.destacado { border-color:var(--dorado); background:rgba(201,168,76,0.04); }
    .plan-card:hover { transform:translateY(-8px); border-color:rgba(201,168,76,0.5); }
    .plan-badge { position:absolute; top:-1px; left:50%; transform:translateX(-50%); background:var(--dorado); color:var(--negro); font-size:0.6rem; letter-spacing:0.25em; text-transform:uppercase; padding:0.35rem 1.2rem; font-weight:500; white-space:nowrap; }
    .plan-nombre { font-family:'Bebas Neue',sans-serif; font-size:2.5rem; letter-spacing:0.1em; color:var(--dorado); margin-bottom:0.5rem; }
    .plan-subtitulo { font-family:'Playfair Display',serif; font-style:italic; font-size:0.9rem; color:var(--texto-claro); margin-bottom:2rem; }
    .plan-precio { font-family:'Bebas Neue',sans-serif; font-size:3rem; color:var(--blanco); line-height:1; margin-bottom:0.5rem; }
    .plan-precio span { font-size:1rem; color:var(--texto-claro); font-family:'DM Sans',sans-serif; font-weight:300; }
    .plan-divider { width:100%; height:1px; background:rgba(201,168,76,0.15); margin:2rem 0; }
    .plan-items { list-style:none; display:flex; flex-direction:column; gap:0.8rem; margin-bottom:2.5rem; }
    .plan-items li { font-size:0.85rem; color:var(--texto-claro); padding-left:1.2rem; position:relative; line-height:1.5; }
    .plan-items li::before { content:'—'; position:absolute; left:0; color:var(--dorado); }
    .btn-plan { display:block; text-align:center; padding:0.9rem; font-size:0.72rem; letter-spacing:0.2em; text-transform:uppercase; text-decoration:none; transition:all 0.3s; font-weight:500; }
    .btn-plan-outline { border:1px solid rgba(201,168,76,0.4); color:var(--dorado); }
    .btn-plan-outline:hover { background:var(--dorado); color:var(--negro); }
    .btn-plan-filled { background:var(--dorado); color:var(--negro); }
    .btn-plan-filled:hover { background:var(--dorado-claro); }

    /* TIENDA */
    #tienda { background:rgba(16,16,14,0.9); }
    .tienda-header { display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:4rem; }
    .tienda-intro { color:var(--texto-claro); max-width:350px; line-height:1.7; font-size:0.95rem; }
    .tienda-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; }
    .producto-card { background:rgba(10,10,8,0.7); border:1px solid rgba(201,168,76,0.1); overflow:hidden; transition:all 0.4s; cursor:pointer; }
    .producto-card:hover { border-color:rgba(201,168,76,0.4); transform:translateY(-4px); }
    .producto-img { height:220px; background:rgba(26,26,24,0.9); position:relative; overflow:hidden; }
    .producto-img img { width:100%; height:100%; object-fit:cover; transition:transform 0.5s ease; display:block; }
    .producto-card:hover .producto-img img { transform:scale(1.06); }
    .producto-img::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse at center,rgba(201,168,76,0.08),transparent 70%); z-index:1; pointer-events:none; }
    .producto-info { padding:1.5rem; }
    .producto-categoria { font-size:0.63rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--dorado); margin-bottom:0.5rem; }
    .producto-nombre { font-family:'Playfair Display',serif; font-size:1.1rem; font-weight:700; color:var(--blanco); margin-bottom:0.3rem; }
    .producto-desc { font-size:0.78rem; color:var(--texto-claro); margin-bottom:1.2rem; }
    .producto-footer { display:flex; justify-content:space-between; align-items:center; }
    .producto-precio { font-family:'Bebas Neue',sans-serif; font-size:1.5rem; color:var(--dorado); letter-spacing:0.05em; }
    .btn-comprar { font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--negro); background:var(--dorado); padding:0.5rem 1rem; border:none; cursor:pointer; font-weight:500; transition:all 0.3s; font-family:'DM Sans',sans-serif; }
    .btn-comprar:hover { background:var(--dorado-claro); }

    /* EVENTOS */
    #eventos { background:rgba(10,10,8,0.88); }
    .eventos-layout { display:grid; grid-template-columns:1fr 1.2fr; gap:5rem; align-items:start; }
    .eventos-lista { display:flex; flex-direction:column; gap:1px; margin-top:3rem; }
    .evento-item { display:grid; grid-template-columns:80px 1fr; gap:1.5rem; padding:2rem 0; border-bottom:1px solid rgba(201,168,76,0.1); transition:all 0.3s; cursor:pointer; }
    .evento-item:hover { padding-left:1rem; }
    .evento-dia { font-family:'Bebas Neue',sans-serif; font-size:3rem; color:var(--dorado); line-height:1; }
    .evento-mes { font-size:0.65rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--texto-claro); }
    .evento-nombre { font-family:'Playfair Display',serif; font-size:1.2rem; font-weight:700; color:var(--blanco); margin-bottom:0.3rem; }
    .evento-detalle { font-size:0.82rem; color:var(--texto-claro); line-height:1.5; }
    .evento-tipo { font-size:0.62rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--dorado); margin-top:0.5rem; }
    .eventos-featured { background:rgba(201,168,76,0.05); border:1px solid rgba(201,168,76,0.2); padding:3rem; position:sticky; top:8rem; }
    .featured-tag { font-size:0.65rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--dorado); margin-bottom:2rem; }
    .featured-nombre { font-family:'Playfair Display',serif; font-size:2.2rem; font-weight:900; color:var(--blanco); line-height:1.1; margin-bottom:1rem; }
    .featured-nombre em { color:var(--dorado); font-style:italic; }
    .featured-desc { font-size:0.88rem; color:var(--texto-claro); line-height:1.7; margin-bottom:2rem; }
    .featured-info { display:flex; flex-direction:column; gap:0.8rem; margin-bottom:2.5rem; }
    .featured-info-item { display:flex; gap:1rem; font-size:0.82rem; align-items:center; }
    .featured-info-label { color:var(--dorado); min-width:80px; font-size:0.7rem; letter-spacing:0.15em; text-transform:uppercase; }
    .featured-info-val { color:var(--blanco); }

    /* CONTACTO */
    #contacto { background:rgba(16,16,14,0.92); text-align:center; padding:8rem 4rem; overflow:hidden; }
    .contacto-bg { position:absolute; inset:0; background:radial-gradient(ellipse at center,rgba(201,168,76,0.08),transparent 70%); }
    .contacto-content { position:relative; z-index:2; max-width:600px; margin:0 auto; }
    .contacto-titulo { font-family:'Playfair Display',serif; font-size:clamp(2.5rem,6vw,4.5rem); font-weight:900; color:var(--blanco); line-height:1.05; margin-bottom:1.5rem; }
    .contacto-titulo em { color:var(--dorado); font-style:italic; }
    .contacto-sub { color:var(--texto-claro); line-height:1.7; margin-bottom:3rem; }
    .contacto-btns { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
    .btn-whatsapp { display:inline-flex; align-items:center; gap:0.7rem; padding:1.1rem 2.5rem; background:#25D366; color:white; font-size:0.78rem; letter-spacing:0.15em; text-transform:uppercase; text-decoration:none; font-weight:500; transition:all 0.3s; }
    .btn-whatsapp:hover { background:#1db954; transform:translateY(-3px); }

    /* FOOTER */
    footer { background:var(--negro); padding:5rem 4rem 3rem; border-top:1px solid rgba(201,168,76,0.1); position:relative; z-index:1; }
    .footer-top { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:4rem; margin-bottom:4rem; }
    .footer-logo-big { font-family:'Bebas Neue',sans-serif; font-size:4rem; color:var(--dorado); letter-spacing:0.2em; line-height:1; margin-bottom:1rem; }
    .footer-tagline { font-family:'Playfair Display',serif; font-style:italic; color:var(--texto-claro); font-size:0.9rem; margin-bottom:1.5rem; }
    .footer-desc { font-size:0.82rem; color:#555; line-height:1.7; max-width:280px; }
    .footer-col-titulo { font-size:0.65rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--dorado); margin-bottom:1.5rem; }
    .footer-links { list-style:none; display:flex; flex-direction:column; gap:0.7rem; }
    .footer-links a { font-size:0.82rem; color:var(--texto-claro); text-decoration:none; transition:color 0.3s; }
    .footer-links a:hover { color:var(--dorado); }
    .footer-contact-item { font-size:0.82rem; color:var(--texto-claro); margin-bottom:0.7rem; line-height:1.5; }
    .footer-contact-item a { color:inherit; text-decoration:none; transition:color 0.3s; }
    .footer-contact-item a:hover { color:var(--dorado); }
    .footer-bottom { display:flex; justify-content:space-between; align-items:center; padding-top:2rem; border-top:1px solid rgba(201,168,76,0.08); }
    .footer-copy { font-size:0.72rem; color:#444; }
    .footer-pagos { display:flex; gap:0.5rem; align-items:center; }
    .pago-tag { font-size:0.62rem; letter-spacing:0.15em; color:#444; text-transform:uppercase; margin-right:0.5rem; }
    .pago-chip { padding:0.25rem 0.6rem; border:1px solid rgba(201,168,76,0.15); font-size:0.65rem; color:#666; letter-spacing:0.1em; }

    /* SOCIAL FLOAT */
    .social-float { position:fixed; left:2rem; bottom:2rem; z-index:200; display:flex; flex-direction:column; gap:0.7rem; }
    .social-btn { width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; text-decoration:none; transition:all 0.3s; box-shadow:0 4px 15px rgba(0,0,0,0.4); }
    .social-btn:hover { transform:scale(1.15); }
    .social-btn svg { width:20px; height:20px; fill:white; }
    .social-btn.instagram { background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888); }
    .social-btn.facebook { background:#1877f2; }
    .social-btn.tiktok { background:#010101; border:1px solid rgba(255,255,255,0.15); }

    /* FLOATING WA */
    .wa-float { position:fixed; bottom:2rem; right:2rem; z-index:200; width:56px; height:56px; background:#25D366; border-radius:50%; display:flex; align-items:center; justify-content:center; text-decoration:none; box-shadow:0 4px 20px rgba(37,211,102,0.4); transition:all 0.3s; }
    .wa-float:hover { transform:scale(1.1); }
    .wa-float svg { width:28px; height:28px; fill:white; }

    /* ANIMATIONS */
    @keyframes fadeUp { from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);} }
    .hero-content>*{animation:fadeUp 0.8s ease forwards;opacity:0;}
    .hero-tag{animation-delay:0.2s;}.hero-titulo{animation-delay:0.4s;}.hero-subtitulo{animation-delay:0.6s;}.hero-btns{animation-delay:0.8s;}

    /* RESPONSIVE */
    @media(max-width:900px){
      nav{padding:1.2rem 2rem;}nav.scrolled{padding:0.8rem 2rem;}.nav-links{display:none;}
      section{padding:5rem 2rem;}#hero{padding:0 2rem 5rem;}.hero-number{display:none;}
      .barra-layout{grid-template-columns:1fr;gap:3rem;}
      .planes-grid{grid-template-columns:1fr;max-width:400px;}
      .tienda-grid{grid-template-columns:repeat(2,1fr);}
      .eventos-layout{grid-template-columns:1fr;}.eventos-featured{display:none;}
      .footer-top{grid-template-columns:1fr 1fr;gap:2rem;}
      .cocktails-header,.tienda-header{flex-direction:column;align-items:flex-start;gap:1rem;}
    }
    @media(max-width:600px){.tienda-grid{grid-template-columns:1fr;}.footer-top{grid-template-columns:1fr;}.hero-scroll{display:none;}}
 
/* RESERVA */

.reserva-form{
  margin-top:2.5rem;
  border:1px solid rgba(201,168,76,0.2);
  padding:2.5rem;
  background:rgba(26,26,24,0.6);
  display:none;
}

.reserva-seat-info{
  font-family:'Bebas Neue',sans-serif;
  font-size:1.4rem;
  color:var(--dorado);
  letter-spacing:0.1em;
  margin-bottom:1.5rem;
  text-align:center;
}

.reserva-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
  margin-bottom:1rem;
}

.reserva-field label{
  font-size:0.65rem;
  letter-spacing:0.25em;
  text-transform:uppercase;
  color:var(--dorado);
  display:block;
  margin-bottom:0.5rem;
}

.reserva-field input{
  width:100%;
  background:rgba(10,10,8,0.8);
  border:1px solid rgba(201,168,76,0.2);
  color:var(--blanco);
  padding:0.8rem 1rem;
  font-family:'DM Sans',sans-serif;
  font-size:0.88rem;
  outline:none;
  transition:border 0.3s;
}

.reserva-field input:focus{
  border-color:rgba(201,168,76,0.7);
}

.reserva-btn{
  width:100%;
  padding:1rem;
  background:var(--dorado);
  color:var(--negro);
  font-family:'DM Sans',sans-serif;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.2em;
  text-transform:uppercase;
  border:none;
  cursor:pointer;
  transition:all 0.3s;
}

.reserva-btn:hover{
  background:#e8c97a;
}

.reserva-help{
  text-align:center;
  color:var(--texto-claro);
  font-size:0.78rem;
  margin-top:1.5rem;
}

/* CLUB DRINKO */
#club{
  background:linear-gradient(135deg,#0a0a08 0%,#140a0a 50%,#0a0a08 100%);
  position:relative;
  overflow:hidden;
}

#club::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse at 50% 0%,rgba(201,168,76,0.1) 0%,transparent 60%);
  pointer-events:none;
}

.club-bg-text{
  position:absolute;
  top:-4rem;
  left:50%;
  transform:translateX(-50%);
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(12rem,30vw,25rem);
  color:rgba(201,168,76,0.03);
  white-space:nowrap;
  user-select:none;
  line-height:1;
}

.club-header{
  text-align:center;
  position:relative;
  z-index:2;
  margin-bottom:5rem;
}

.club-header p{
  color:var(--texto-claro);
  max-width:520px;
  margin:1.5rem auto 0;
  line-height:1.7;
  font-size:0.95rem;
}

.club-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2rem;
  max-width:1000px;
  margin:0 auto 6rem;
  position:relative;
  z-index:2;
}

.club-card{
  padding:2.5rem 2rem;
  background:rgba(26,26,24,0.5);
  transition:all 0.4s;
}

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

.club-bronce{
  border:1px solid rgba(176,141,87,0.3);
}

.club-bronce:hover{
  border-color:rgba(176,141,87,0.7);
}

.club-oro{
  border:1px solid var(--dorado);
  background:rgba(201,168,76,0.04);
  position:relative;
}

.club-platino{
  border:1px solid rgba(220,220,230,0.3);
  background:rgba(26,26,24,0.4);
}

.club-platino:hover{
  border-color:rgba(220,220,230,0.7);
}

.club-tier-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:2rem;
  letter-spacing:0.15em;
  margin-bottom:0.3rem;
}

.club-tier-sub{
  font-family:'Playfair Display',serif;
  font-style:italic;
  font-size:0.85rem;
  color:var(--texto-claro);
  margin-bottom:1.5rem;
}

.club-divider{
  width:100%;
  height:1px;
  margin-bottom:1.5rem;
}

.club-list{
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:0.8rem;
  margin-bottom:2rem;
}

.club-list li{
  font-size:0.83rem;
  color:var(--texto-claro);
  padding-left:1.2rem;
  position:relative;
}

.club-list li span{
  position:absolute;
  left:0;
}

.club-tier-range{
  font-size:0.7rem;
  letter-spacing:0.2em;
  text-transform:uppercase;
  text-align:center;
}

.club-form-box{
  max-width:620px;
  margin:0 auto;
  position:relative;
  z-index:2;
  border:1px solid rgba(201,168,76,0.2);
  padding:3.5rem;
  background:rgba(26,26,24,0.6);
}

.club-form-header{
  text-align:center;
  margin-bottom:2.5rem;
}

.club-form-title{
  font-family:'Bebas Neue',sans-serif;
  font-size:1.8rem;
  letter-spacing:0.2em;
  color:var(--dorado);
  margin-bottom:0.5rem;
}

.club-form-header p{
  font-size:0.85rem;
  color:var(--texto-claro);
  line-height:1.6;
}

.club-form{
  display:flex;
  flex-direction:column;
  gap:1.2rem;
}

.club-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1rem;
}

.club-form label{
  font-size:0.65rem;
  letter-spacing:0.25em;
  text-transform:uppercase;
  color:var(--dorado);
  display:block;
  margin-bottom:0.5rem;
}

.club-form input{
  width:100%;
  background:rgba(10,10,8,0.8);
  border:1px solid rgba(201,168,76,0.2);
  color:var(--blanco);
  padding:0.85rem 1rem;
  font-family:'DM Sans',sans-serif;
  font-size:0.88rem;
  outline:none;
  transition:border 0.3s;
}

.club-form input:focus{
  border-color:rgba(201,168,76,0.7);
}

.club-check{
  display:flex;
  align-items:flex-start;
  gap:0.8rem;
}

.club-btn{
  width:100%;
  padding:1rem;
  background:var(--dorado);
  color:var(--negro);
  font-family:'DM Sans',sans-serif;
  font-size:0.78rem;
  font-weight:500;
  letter-spacing:0.2em;
  text-transform:uppercase;
  border:none;
  cursor:pointer;
  transition:all 0.3s;
}

.club-btn:hover{
  background:#e8c97a;
}

#club-msg{
  display:none;
  text-align:center;
  padding:1rem;
  font-size:0.85rem;
  line-height:1.6;
}

/* ICONOS */
.club-icon{
font-size:2.4rem;
margin-bottom:1rem;
}

/* PRODUCTOS */

.producto-img{
width:320px;
height:320px;
overflow:hidden;
display:flex;
align-items:center;
justify-content:center;
}

.producto-img img{
width:100%;
height:100%;
object-fit:contain;
}

/* =========================
DRINCO RESPONSIVE CSS
========================= */

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

body{
font-family:'DM Sans',sans-serif;
background:#0f0f10;
color:#fff;
line-height:1.4;
}

/* =========================
IMAGES
========================= */

img{
max-width:100%;
height:auto;
display:block;
}

/* =========================
CONTAINER
========================= */

.container{
width:100%;
max-width:1200px;
margin:auto;
padding:15px;
}

/* =========================
PRODUCT GRID
========================= */

.productos{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
padding:20px;
}

/* =========================
PRODUCT CARD
========================= */

.producto-card{
background:#18181b;
border-radius:12px;
overflow:hidden;
transition:.25s;
box-shadow:0 4px 12px rgba(0,0,0,.4);
display:flex;
flex-direction:column;
}

.producto-card:hover{
transform:translateY(-4px);
box-shadow:0 10px 30px rgba(0,0,0,.5);
}

/* =========================
PRODUCT IMAGE
========================= */

.producto-img{
width:100%;
aspect-ratio:1/1;
overflow:hidden;
}

.producto-img img{
width:100%;
height:100%;
object-fit:cover;
}

/* =========================
PRODUCT INFO
========================= */

.producto-info{
padding:15px;
display:flex;
flex-direction:column;
gap:10px;
flex:1;
}

.producto-nombre{
font-family:'Playfair Display',serif;
font-size:20px;
font-weight:700;
}

/* descripción */

.producto-detalle{
font-size:14px;
opacity:.75;
line-height:1.4;
}

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

.producto-footer{
display:flex;
justify-content:space-between;
align-items:center;
margin-top:auto;
}

/* precio */

.producto-precio{
font-family:'Bebas Neue',sans-serif;
font-size:26px;
color:#22c55e;
letter-spacing:1px;
}

/* =========================
BUTTON
========================= */

.btn-comprar{
background:#22c55e;
border:none;
color:#fff;
padding:10px 16px;
border-radius:8px;
cursor:pointer;
font-weight:600;
transition:.2s;
}

.btn-comprar:hover{
background:#16a34a;
}

/* =========================
NAVBAR
========================= */

.navbar{
display:flex;
justify-content:space-between;
align-items:center;
padding:15px 20px;
background:#111;
border-bottom:1px solid #222;
}

.navbar-logo{
font-family:'Bebas Neue',sans-serif;
font-size:28px;
letter-spacing:2px;
}

.navbar-icons{
display:flex;
gap:15px;
font-size:20px;
}

/* =========================
SNACKBAR
========================= */

.snackbar{
position:fixed;
bottom:20px;
left:50%;
transform:translateX(-50%);
background:#22c55e;
padding:12px 20px;
border-radius:8px;
color:#fff;
opacity:0;
pointer-events:none;
transition:.3s;
}

.snackbar.show{
opacity:1;
pointer-events:auto;
}

/* =========================
RESPONSIVE
========================= */

@media (max-width:1024px){

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

}

@media (max-width:768px){

.productos{
grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
gap:15px;
}

.producto-nombre{
font-size:18px;
}

.producto-precio{
font-size:22px;
}

.btn-comprar{
width:100%;
}

.producto-footer{
flex-direction:column;
align-items:flex-start;
gap:8px;
}

}

@media (max-width:480px){

.container{
padding:10px;
}

.productos{
grid-template-columns:1fr;
}

.producto-precio{
font-size:24px;
}

}


.nav-toggle{
display:none;
background:rgba(201,168,76,0.12);
border:1px solid rgba(201,168,76,0.35);
color:var(--dorado);
font-size:28px;
cursor:pointer;

width:48px;
height:48px;

border-radius:10px;

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

transition:all .25s;
}

.nav-toggle:hover{
background:rgba(201,168,76,0.25);
transform:scale(1.05);
}


/* MOBILE */

@media (max-width:768px){

.nav-toggle{
display:block;
}

@media (max-width:768px){

.nav-toggle{
display:block;
}

.nav-links{
position:absolute;
top:70px;
left:0;
width:100%;
background:#111;
flex-direction:column;
display:none;
padding:20px;
}

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

}

/* MENU MOBILE FIX */

@media (max-width:768px){

.nav-links{
position:absolute;
top:100%;
left:0;
width:100%;

background:#0a0a08;

flex-direction:column;
align-items:flex-start;

display:none;

padding:15px 25px;

border-top:1px solid rgba(201,168,76,0.2);

z-index:999;
}

.nav-links li{
width:100%;
}

.nav-links a{
display:block;
width:100%;
padding:12px 0;
}

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

/* =====================================
EVENTOS DRINKO — FIX TOTAL (CARDS FULL)
===================================== */

/* layout full ancho */
#eventos .eventos-layout{
  display:block !important;
}

/* grid responsive */
#eventos .eventos-lista{
  display:grid !important;
  grid-template-columns: repeat(auto-fit, minmax(280px,1fr)) !important;
  gap:20px !important;
  margin-top:3rem !important;
  width:100% !important;
}

/* card */
#eventos .evento-item{
  display:flex !important;
  flex-direction:column !important;
  background:rgba(26,26,24,0.6) !important;
  border:1px solid rgba(201,168,76,0.1) !important;
  border-radius:12px !important;
  overflow:hidden !important;
  transition:all .3s !important;
}

#eventos .evento-item:hover{
  transform:translateY(-4px) !important;
  border-color:rgba(201,168,76,0.4) !important;
}

/* IMAGEN PRO */
#eventos .evento-img{
  width:100% !important;
  height:250px !important;
  object-fit:cover !important;
  aspect-ratio:1/1 !important;
  display:block !important;
}

/* ocultar fecha lateral vieja */
#eventos .evento-fecha{
  display:none !important;
}

/* contenido */
#eventos .evento-contenido{
  padding:16px !important;
}

#eventos .evento-nombre{
  font-family:'Playfair Display',serif !important;
  font-size:1.1rem !important;
  font-weight:700 !important;
  margin-bottom:6px !important;
}

#eventos .evento-detalle{
  font-size:0.85rem !important;
  color:var(--texto-claro) !important;
  margin-bottom:8px !important;
  line-height:1.5 !important;
}

#eventos .evento-tipo{
  font-size:0.75rem !important;
  color:var(--dorado) !important;
  letter-spacing:0.05em !important;
}

@media (max-width:768px){

  .nav-links{
    position:absolute !important;
    top:70px !important;
    left:0;
    width:100%;
    background:#0a0a08;
    flex-direction:column;
    display:none;
    padding:20px;
    z-index:9999;
  }

  .nav-links.menu-open{
    display:flex !important;
  }

}