:root{
    --bg:#0f0f0f;
    --card:#161616;
    --accent:#c8a66a; /* dorado tabaco */
    --muted:#9b8c6b;
    --text:#f1eadf;   /* beige */
}

html, body { background: var(--bg); color: var(--text); scroll-behavior:smooth; }
a { color: var(--accent); }
a:hover { color: #e2c88a; }

/* Navbar */
.navbar { background: rgba(10,10,10,.9) !important; backdrop-filter: blur(6px); }
.navbar-brand img { height: 100px; width: auto; }
.nav-link { color: var(--text) !important; opacity:.85; }
.nav-link:hover { color: var(--accent) !important; opacity:1; }

/* Hero (base) */
.hero {
    min-height: 86vh;
    display: grid;
    place-items: center;
    text-align: center;
    position: relative;
    background:
            linear-gradient(180deg, rgba(0,0,0,.55), rgba(0,0,0,.65)),
            url('/assets/img/Banner.png') center/cover no-repeat;
}
/* Tipografía fluida del Hero (nuevo) */
.hero h1 {
    font-weight: 700;
    letter-spacing:.5px;
    font-size: clamp(1.6rem, 3.8vw, 2.8rem);
    line-height: 1.15;
    margin-bottom: .6rem;
}
.hero p {
    color: var(--muted);
    max-width: 760px;
    margin: 0 auto 1rem;
    font-size: clamp(.95rem, 2.2vw, 1.25rem);
    line-height: 1.45;
}
.social i{ font-size: 1.6rem; color: var(--accent); margin:0 .4rem; }
.social i:hover{ transform: translateY(-2px); }

/* Sections */
section { padding: 80px 0; }
.section-title{
    font-weight:700; margin-bottom: 1.2rem; color: var(--accent);
    letter-spacing:.3px;
}
.card-dark{
    background: var(--card); border:1px solid #242424; border-radius: 14px; color:var(--text);
}

/* Forms */
.form-control, .form-check-input{ background:#0e0e0e; border:1px solid #2b2b2b; color:var(--text); }
.btn-accent{ background: var(--accent); color:#151515; border:none; }
.btn-accent:hover{ filter: brightness(1.05); }

/* Footer */
footer { background:#0b0b0b; color: var(--muted); padding: 28px 0; }

/* Modal */
.modal-content{ background:#121212; color:var(--text); border:1px solid #2a2a2a; border-radius: 16px; }
.modal-header, .modal-footer { border-color:#2a2a2a; }

/* Aviso legal reCAPTCHA y aspecto */
#g-recaptcha-legal { font-size:.8rem; opacity:.8; }
.g-recaptcha { transform-origin: left top; }
@media (max-width: 420px){
    .g-recaptcha { transform: scale(0.95); }
}

/* Toggler visible en tema oscuro */
.navbar-dark .navbar-toggler-icon{
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgb(241,234,223)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
.navbar-toggler{ border-color:#2a2a2a; }

/* Mobile: logo más compacto */
@media (max-width: 576px){
    .navbar-brand img{ height: 60px; }
}
@media (min-width: 577px) and (max-width: 991.98px){
    .navbar-brand img{ height: 72px; }
}

/* Estilo del menú desplegado en móvil */
@media (max-width: 991.98px){
    .navbar .navbar-collapse{
        background: rgba(10,10,10,.98);
        border-top: 1px solid #242424;
        padding: 12px 16px;
    }
    .navbar .nav-link{
        padding: 10px 2px !important;
        border-bottom: 1px solid #1c1c1c;
    }
    .navbar .nav-link:last-child{
        border-bottom: 0;
    }
}

/* ✅ Ajustes del Hero en móvil/tablet: más compacto y bien encuadrado */
@media (max-width: 576px){
    .hero{
        min-height: 62vh;           /* antes 86vh */
        padding: 96px 0 24px;       /* evita que la navbar tape el contenido */
        background-position: center 28%;
    }
    .hero .social{ margin-bottom: .5rem; }
    .hero .btn{ padding: .55rem 1rem; font-size: .95rem; }
}

@media (min-width: 577px) and (max-width: 991.98px){
    .hero{
        min-height: 72vh;
        padding: 96px 0 32px;
        background-position: center 30%;
    }
}

/* Empuja el contenido bajo la navbar fija si fuera necesario (mantener) */
@media (max-width: 576px){
    header.hero{ padding-top: 90px; } /* ya contemplado arriba; puedes quitar esta línea si ves doble espacio */
}