@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Playfair+Display:wght@500;600;700&display=swap');
/* =====================================================
   1. VARIABLES
===================================================== */

:root {
    --bordo: #7a1f2d;
    --bordo-claro: #9b2d3d;
    --bordo-oscuro: #50121d;
    --dorado: #d4af37;
    --dorado-claro: #efd682;
    --crema: #f6f1e8;
    --crema-claro: #fbf8f2;
    --texto: #25201e;
    --gris: #6d6864;
    --blanco: #fff;
    --borde: #e5ddd2;
    --sombra: 0 18px 45px rgba(54,34,30,.12);
    --sombra-fuerte: 0 25px 65px rgba(43,20,25,.18);
}

/* =====================================================
   2. RESET Y ESTILOS GENERALES
===================================================== */

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

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter',Arial,sans-serif;
    color: var(--texto);
    background: var(--crema-claro);
    line-height: 1.6;
}

img {
    width: 100%;
    display: block;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    font: inherit;
}

/* El header se carga desde shared-layout.css */

/* =====================================================
   4. HERO
===================================================== */

.hero-cordoba {
    min-height: 640px;
    padding: 90px 8%;
    position: relative;
    display: flex;
    align-items: center;
    background: url('Imagenes/Portada.jpg') center/cover no-repeat;
}

.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg,rgba(24,8,12,.90),rgba(35,12,18,.69) 50%,rgba(35,12,18,.18));
}

.hero-content {
    width: 100%;
    max-width: 780px;
    position: relative;
    z-index: 2;
    color: #fff;
}

.hero-kicker,
.section-heading>span {
    color: var(--dorado);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.hero-content h1 {
    margin: 15px 0 20px;
    font-family: 'Playfair Display',Georgia,serif;
    font-size: clamp(52px,7vw,82px);
    font-weight: 600;
    line-height: 1.02;
}

.hero-content>p {
    max-width: 690px;
    margin-bottom: 30px;
    color: rgba(255,255,255,.9);
    font-size: 19px;
    line-height: 1.7;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 13px;
}

.btn-primary,
.btn-secondary {
    min-height: 50px;
    padding: 13px 23px;
}

.btn-primary {
    color: #fff;
    background: var(--bordo);
}

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

.btn-secondary {
    color: #fff;
    background: rgba(255,255,255,.1);
    border: 1px solid rgba(255,255,255,.5);
    backdrop-filter: blur(7px);
}

.btn-secondary:hover {
    color: var(--bordo-oscuro);
    background: #fff;
    transform: translateY(-3px);
}

.hero-stats {
    max-width: 620px;
    margin-top: 38px;
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 13px;
}

.hero-stats>div {
    min-height: 94px;
    padding: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: rgba(255,255,255,.11);
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 15px;
    backdrop-filter: blur(8px);
}

.hero-stats strong {
    color: var(--dorado-claro);
    font-family: 'Playfair Display',Georgia,serif;
    font-size: 31px;
    line-height: 1;
}

.hero-stats span {
    margin-top: 5px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* =====================================================
   5. TÍTULOS Y PRESENTACIÓN
===================================================== */

.intro-section {
    width: min(1300px, 88%);
    margin-left: auto;
    margin-right: auto;
}

/* =====================================================
   6. RESTAURANTES PREMIUM
===================================================== */

.premium-section {
    max-width: 1300px;
    margin: 0 auto;
    padding-left: 6%;
    padding-right: 6%;
}

.intro-section {
    padding-top: 85px;
    padding-bottom: 65px;
}

.section-heading {
    max-width: 790px;
    margin: 0 auto 45px;
    text-align: center;
}

.section-heading-left {
    max-width: 850px;
    margin-left: 0;
    text-align: left;
}

.section-heading h2 {
    margin: 9px 0 14px;
    color: var(--bordo-oscuro);
    font-family: 'Playfair Display',Georgia,serif;
    font-size: clamp(36px,4vw,50px);
    font-weight: 600;
    line-height: 1.15;
}

.section-heading p {
    color: var(--gris);
    font-size: 17px;
    line-height: 1.75;
}

.premium-section {
    padding-top: 35px;
    padding-bottom: 100px;
    scroll-margin-top: 100px;
}

.premium-list {
    display: flex;
    flex-direction: column;
    gap: 42px;
}

.premium-card {
    min-height: 530px;
    display: grid;
    grid-template-columns: minmax(0,1.18fr) minmax(380px,.82fr);
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--borde);
    border-radius: 24px;
    box-shadow: var(--sombra);
    transition: .35s;
}

.premium-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--sombra-fuerte);
}

.premium-card-reverse {
    grid-template-columns: minmax(380px,.82fr) minmax(0,1.18fr);
}

/* =====================================================
   7. CARRUSELES PREMIUM
===================================================== */

.premium-card-reverse .restaurant-carousel {
    order: 2;
}

/* =====================================================
   8. INFORMACIÓN PREMIUM
===================================================== */

.premium-card-reverse .premium-content {
    order: 1;
}

.restaurant-carousel {
    min-height: 530px;
    position: relative;
    overflow: hidden;
    background: #21171a;
}

.carousel-track {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
}

.carousel-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: .65s;
}

.carousel-slide.active {
    opacity: 1;
    visibility: visible;
}

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

.restaurant-carousel::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.24));
}

.carousel-arrow {
    width: 43px;
    height: 43px;
    position: absolute;
    top: 50%;
    z-index: 5;
    display: grid;
    place-items: center;
    transform: translateY(-50%);
    color: #fff;
    background: rgba(32,14,19,.55);
    border: 1px solid rgba(255,255,255,.3);
    border-radius: 50%;
    cursor: pointer;
    backdrop-filter: blur(7px);
}

.carousel-arrow:hover {
    background: var(--bordo);
    transform: translateY(-50%) scale(1.08);
}

.carousel-prev {
    left: 17px;
}

.carousel-next {
    right: 17px;
}

.carousel-dots {
    position: absolute;
    left: 50%;
    bottom: 21px;
    z-index: 6;
    display: flex;
    gap: 8px;
    transform: translateX(-50%);
}

.carousel-dot {
    width: 9px;
    height: 9px;
    padding: 0;
    background: rgba(255,255,255,.5);
    border: 0;
    border-radius: 50%;
    cursor: pointer;
    transition: .25s;
}

.carousel-dot.active {
    width: 28px;
    background: var(--dorado);
    border-radius: 999px;
}

.premium-badge {
    position: absolute;
    top: 19px;
    left: 19px;
    z-index: 7;
    padding: 8px 13px;
    color: #2b1c08;
    background: linear-gradient(135deg,#f3d77c,#d4af37);
    border: 1px solid rgba(255,255,255,.6);
    border-radius: 999px;
    box-shadow: 0 8px 22px rgba(0,0,0,.18);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.premium-content {
    padding: 48px 44px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

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

.location {
    color: var(--bordo);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

.premium-heading h3 {
    margin-top: 5px;
    color: var(--bordo-oscuro);
    font-family: 'Playfair Display',Georgia,serif;
    font-size: 38px;
    font-weight: 600;
    line-height: 1.12;
}

.rating-box {
    min-width: 75px;
    padding: 10px 11px;
    text-align: center;
    background: var(--crema);
    border: 1px solid #eadcbf;
    border-radius: 13px;
}

.rating-box strong {
    display: block;
    color: var(--bordo-oscuro);
    font-size: 20px;
    line-height: 1;
}

.rating-box span {
    display: block;
    margin-top: 5px;
    color: var(--dorado);
    font-size: 9px;
    letter-spacing: 1px;
}

.restaurant-type {
    margin: 12px 0 18px;
    color: var(--dorado);
    font-size: 13px;
    font-weight: 700;
}

.premium-description {
    margin-bottom: 25px;
    color: var(--gris);
    font-size: 15px;
    line-height: 1.75;
}

.premium-details {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 13px;
}

.detail-item {
    min-height: 68px;
    padding: 12px 13px;
    display: flex;
    align-items: center;
    gap: 11px;
    background: var(--crema-claro);
    border: 1px solid var(--borde);
    border-radius: 12px;
}

.detail-icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: grid;
    place-items: center;
    color: var(--bordo);
    background: #fff;
    border: 1px solid #eadfd5;
    border-radius: 50%;
    font-size: 14px;
    font-weight: 800;
}

.detail-item small {
    display: block;
    color: #8a827d;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .7px;
    text-transform: uppercase;
}

.detail-item a,
.detail-item div>span {
    display: block;
    overflow: hidden;
    color: var(--texto);
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.premium-actions {
    margin-top: 26px;
    display: flex;
    flex-wrap: wrap;
    gap: 11px;
}

.btn-premium,
.btn-outline {
    min-height: 46px;
    padding: 12px 20px;
    font-size: 13px;
}

.btn-premium {
    color: #fff;
    background: var(--bordo);
}

.btn-premium:hover {
    background: var(--bordo-oscuro);
    transform: translateY(-2px);
}

.btn-outline {
    color: var(--bordo);
    background: #fff;
    border: 1px solid var(--bordo);
}

.btn-outline:hover {
    color: #fff;
    background: var(--bordo);
    transform: translateY(-2px);
}

/* =====================================================
   9. RESTAURANTES BÁSICOS
===================================================== */

.basic-section {
    max-width: none;
    padding: 90px 0 105px;
    background: var(--crema);
    scroll-margin-top: 90px;
}

.basic-section>.section-heading,
.basic-grid {
    width: min(1160px,88%);
    margin-left: auto;
    margin-right: auto;
}

.basic-grid {
    display: grid;
    grid-template-columns: repeat(4,minmax(0,1fr));
    gap: 23px;
}

.basic-card {
    overflow: hidden;
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--borde);
    border-radius: 18px;
    box-shadow: 0 10px 26px rgba(55,34,30,.08);
    transition: .3s;
}

.basic-card:hover {
    transform: translateY(-7px);
    box-shadow: 0 18px 40px rgba(55,34,30,.14);
}

.basic-image {
    height: 220px;
    position: relative;
    overflow: hidden;
    background: #ded7cf;
}

.basic-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: .45s;
}

.basic-card:hover .basic-image img {
    transform: scale(1.05);
}

.basic-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    padding: 6px 10px;
    color: #fff;
    background: #8f8a86;
    border: 1px solid rgba(255,255,255,.38);
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.basic-content {
    min-height: 165px;
    padding: 21px;
    display: flex;
    flex-direction: column;
}

.basic-content h3 {
    margin: 6px 0 17px;
    color: var(--bordo-oscuro);
    font-family: 'Playfair Display',Georgia,serif;
    font-size: 23px;
    font-weight: 600;
    line-height: 1.2;
}

.basic-phone {
    width: 100%;
    min-height: 43px;
    margin-top: auto;
    padding: 10px 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--bordo);
    background: var(--crema-claro);
    border: 1px solid #eadfd5;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 700;
}

.basic-phone:hover {
    color: #fff;
    background: var(--bordo);
    border-color: var(--bordo);
}

/* =====================================================
   10. LLAMADO A LA ACCIÓN
===================================================== */

.cta-section {
    width: min(1230px,88%);
    margin: 82px auto;
    padding: 48px 55px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 48px;
    color: #fff;
    background: linear-gradient(135deg,var(--bordo-oscuro),var(--bordo));
    border-radius: 22px;
}

.cta-section span {
    color: var(--dorado);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}

.cta-section h2 {
    max-width: 780px;
    margin: 8px 0;
    font-family: 'Playfair Display',Georgia,serif;
    font-size: 36px;
    font-weight: 600;
    line-height: 1.17;
}

.cta-section p {
    max-width: 740px;
    color: rgba(255,255,255,.82);
}

.btn-light {
    flex-shrink: 0;
    min-height: 49px;
    padding: 13px 23px;
    color: var(--bordo);
    background: #fff;
}

.btn-light:hover {
    color: #fff;
    background: var(--dorado);
    transform: translateY(-3px);
}

/* =====================================================
   11. FOOTER
===================================================== */

.footer-bodegar {
    width: 100%;
    margin-top: 60px;
    color: #fff;
    background: linear-gradient(180deg,#5a0b1c,#3b0713);
}

.footer-bodegar-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 40px 45px 28px;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    align-items: flex-start;
    gap: 65px;
}

.footer-bodegar-logo {
    width: 210px;
    height: auto;
    margin-bottom: 6px;
}

.footer-brand h2 {
    color: #fff;
    font-family: -apple-system,BlinkMacSystemFont,'SF Pro Display','Helvetica Neue',Arial,sans-serif;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -1px;
}

.footer-brand h2 span {
    display: block;
    color: var(--dorado);
    font-size: 40px;
    font-weight: 800;
}

.footer-bodegar h3 {
    margin-bottom: 15px;
    color: var(--dorado);
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.footer-bodegar p {
    max-width: 320px;
    margin-top: 10px;
    color: #eee;
    font-size: 14px;
    line-height: 1.6;
}

.footer-bodegar a {
    display: block;
    margin-bottom: 8px;
    color: #fff;
    font-size: 14px;
}

.footer-bodegar-bottom {
    padding: 12px 45px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    color: #ddd;
    border-top: 1px solid rgba(255,255,255,.12);
    font-size: 12px;
}

/* =====================================================
   12. RESPONSIVE
===================================================== */

@media(max-width:1100px) {
    .main-nav {
        gap: 18px;
    }

    .premium-card,.premium-card-reverse {
        grid-template-columns: 1fr;
    }

    .premium-card-reverse .restaurant-carousel,.premium-card-reverse .premium-content {
        order: initial;
    }

    .restaurant-carousel {
        min-height: 460px;
    }

    .basic-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }

    .footer-bodegar-container {
        grid-template-columns: 1.5fr 1fr 1fr;
        gap: 40px;
    }

}

@media(max-width:850px) {
    .site-header {
        height: auto;
        padding: 16px 5%;
        flex-wrap: wrap;
    }

    .main-nav {
        width: 100%;
        order: 3;
        overflow-x: auto;
        justify-content: flex-start;
    }

    .main-nav a {
        flex-shrink: 0;
        padding: 10px 0;
    }

    .main-nav a::after {
        bottom: 4px;
    }

    .hero-cordoba {
        min-height: 600px;
    }

    .premium-content {
        padding: 38px 30px;
    }

    .premium-details {
        grid-template-columns: 1fr;
    }

    .cta-section {
        padding: 40px 35px;
        flex-direction: column;
        align-items: flex-start;
    }

    .footer-bodegar-container {
        grid-template-columns: repeat(2,1fr);
    }

    .footer-bodegar-bottom {
        flex-direction: column;
        align-items: flex-start;
    }

}

@media(max-width:580px) {
    .logo img {
        width: 145px;
    }

    .btn-header {
        padding: 10px 13px;
        font-size: 12px;
    }

    .hero-cordoba {
        min-height: 650px;
        padding: 65px 22px;
    }

    .hero-content h1 {
        font-size: 48px;
    }

    .hero-content>p {
        font-size: 16px;
    }

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

    .btn-primary,.btn-secondary {
        width: 100%;
    }

    .hero-stats {
        grid-template-columns: 1fr;
    }

    .hero-stats>div {
        min-height: 76px;
    }

    .intro-section,.premium-section {
        padding-left: 20px;
        padding-right: 20px;
    }

    .restaurant-carousel {
        min-height: 330px;
    }

    .carousel-arrow {
        width: 38px;
        height: 38px;
    }

    .premium-content {
        padding: 30px 22px;
    }

    .premium-heading {
        flex-direction: column;
    }

    .premium-actions {
        flex-direction: column;
    }

    .btn-premium,.btn-outline {
        width: 100%;
    }

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

    .basic-image {
        height: 250px;
    }

    .cta-section {
        width: calc(100% - 40px);
        margin: 55px auto;
        padding: 35px 24px;
    }

    .cta-section h2 {
        font-size: 29px;
    }

    .btn-light {
        width: 100%;
    }

    .footer-bodegar-container {
        padding: 35px 25px;
        grid-template-columns: 1fr;
    }

    .footer-brand h2 {
        font-size: 30px;
    }

    .footer-brand h2 span {
        font-size: 34px;
    }

    .footer-bodegar-bottom {
        padding: 16px 25px;
    }

}
/*==========================
      AUSPICIANTES
==========================*/

.footer-auspicia h3{
    margin-bottom:22px;
    text-align:center;
}

.logos-auspiciantes{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    align-items:center;
    justify-items:center;
    margin-top:20px;
}

.logos-auspiciantes a{
    display:flex;
    justify-content:center;
    align-items:center;
    text-decoration:none;
}

.logos-auspiciantes img{
    width:100%;
    max-width:300px;
    max-height:150px;
    object-fit:contain;

    opacity:.92;
    filter:brightness(1.05);

    transition:
        transform .30s ease,
        opacity .30s ease,
        filter .30s ease;
}

.logos-auspiciantes img:hover{
    transform:scale(1.08);
    opacity:1;
    filter:brightness(1.18);
}
.hero-entre-rios{background-image:linear-gradient(90deg,rgba(24,8,12,.90),rgba(35,12,18,.66) 50%,rgba(35,12,18,.15)),url("Imagenes/Portada-Entre-Rios.jpg")}
.basic-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:auto}
.basic-actions .basic-phone{margin-top:0;background:#1b1819;color:#fff;border-color:#1b1819;text-decoration:none}
.basic-actions .basic-phone:hover{background:#1b1819;color:#fff;opacity:.9;transform:translateY(-2px)}
.hotel-address{margin-bottom:16px;color:var(--gris);font-size:13px;line-height:1.55}
@media(max-width:580px){.basic-actions{grid-template-columns:1fr}}


/* =====================================================
   AJUSTES FINALES · ENTRE RÍOS
===================================================== */

.hero-entre-rios {
    background:
        linear-gradient(
            90deg,
            rgba(24, 8, 12, .90),
            rgba(35, 12, 18, .66) 50%,
            rgba(35, 12, 18, .15)
        ),
        url("Imagenes/Portada-Entre-Rios.jpg") center / cover no-repeat;
}

.premium-list,
.basic-grid {
    min-width: 0;
}

.premium-card,
.basic-card {
    min-width: 0;
}

.premium-details {
    min-width: 0;
}

.detail-item > div {
    min-width: 0;
}

.detail-item a,
.detail-item div > span {
    white-space: normal;
    overflow-wrap: anywhere;
}

.basic-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: auto;
}

.basic-actions .basic-phone {
    margin-top: 0;
    color: #fff;
    background: #1b1819;
    border-color: #1b1819;
}

.basic-actions .basic-phone:hover {
    color: #fff;
    background: #1b1819;
    border-color: #1b1819;
    opacity: .9;
    transform: translateY(-2px);
}

.hotel-address {
    margin-bottom: 16px;
    color: var(--gris);
    font-size: 13px;
    line-height: 1.55;
}

@media (max-width: 580px) {
    .basic-actions {
        grid-template-columns: 1fr;
    }
}