:root {
    --color-navegador: #4a8500;
    --color-principal: #1f5f3b;
    --color-principal-oscuro: #123826;
    --color-secundario: #3f8f5a;
    --color-acento: #f2a541;
    --color-fondo: #f4f7f8;
    --color-panel: #ffffff;
    --color-texto: #1f2933;
    --color-suave: #60717c;
    --color-borde: #dbe5e8;
    --sombra: 0 18px 50px rgba(7, 41, 51, 0.12);
    --radio: 22px;
    --ancho: 1180px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    background-color: var(--color-navegador);
}

body {
    margin: 0;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--color-texto);
    background: var(--color-fondo);
    line-height: 1.6;
}

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

a {
    color: inherit;
}

.skip-link {
    position: absolute;
    left: -999px;
    top: 10px;
    z-index: 9999;
    padding: 0.7rem 1rem;
    background: #ffffff;
    color: #000000;
    border: 2px solid #000000;
}

.skip-link:focus {
    left: 10px;
}


/* Banda superior real de color para que Safari tenga un color claro que copiar. */
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 6px;
    background: var(--color-navegador);
    z-index: 9999;
    pointer-events: none;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: linear-gradient(180deg, var(--color-navegador), #3d7800);
    padding-bottom: 14px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow: 0 10px 28px rgba(18, 56, 38, 0.16);
    backdrop-filter: blur(12px);
}

.topbar {
    background: transparent;
    color: #ffffff;
    font-size: 0.92rem;
}

.topbar-inner {
    width: min(var(--ancho), calc(100% - 32px));
    margin: 0 auto;
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: flex-end;
    min-height: 38px;
    flex-wrap: wrap;
}

.topbar a {
    text-decoration: none;
}

.topbar-sede {
    font-weight: 700;
    background: rgba(255, 255, 255, 0.14);
    padding: 0.32rem 0.7rem;
    border-radius: 999px;
}

.selector-idioma {
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.selector-idioma label,
.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.selector-idioma-control {
    min-height: 30px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: #ffffff;
    color: var(--color-principal-oscuro);
    padding: 0.15rem 0.55rem;
}

.selector-idioma-aviso,
.google-translate-hidden {
    display: none;
}

.header-container {
    width: min(var(--ancho), calc(100% - 32px));
    margin: 0 auto;
    min-height: 92px;
    display: grid;
    grid-template-columns: auto minmax(520px, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    background: rgba(255, 255, 255, 0.97);
    padding: 1rem 1.15rem;
    border-radius: 32px;
    border: 1px solid rgba(255, 255, 255, 0.78);
    box-shadow: 0 18px 45px rgba(18, 56, 38, 0.18);
}

.logo-ayuntamiento a {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-decoration: none;
}

.logo-icono {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--color-principal), var(--color-secundario));
    color: #ffffff;
    font-size: 1.7rem;
    box-shadow: var(--sombra);
}

.logo-texto {
    display: grid;
    line-height: 1.1;
}

.logo-texto strong {
    color: var(--color-principal-oscuro);
    font-size: 1.05rem;
}

.logo-texto span {
    color: var(--color-suave);
    font-weight: 600;
}

.menu-principal-lista {
    list-style: none;
    display: flex;
    justify-content: center;
    gap: 0.18rem;
    row-gap: 0.15rem;
    padding: 0;
    margin: 0;
    flex-wrap: wrap;
}

.menu-principal-lista a {
    display: inline-flex;
    padding: 0.55rem 0.62rem;
    border-radius: 999px;
    text-decoration: none;
    color: var(--color-principal-oscuro);
    font-weight: 700;
    line-height: 1.15;
    white-space: nowrap;
}

.menu-principal-lista a:hover,
.menu-principal-lista a:focus {
    background: #e7f1f3;
    outline: none;
}

.buscador-cabecera form {
    display: flex;
    align-items: center;
    background: #eef5f6;
    border: 1px solid var(--color-borde);
    border-radius: 999px;
    overflow: hidden;
}

.buscador-cabecera input {
    width: 190px;
    border: 0;
    background: transparent;
    padding: 0.7rem 0.2rem 0.7rem 0.85rem;
    font: inherit;
    outline: none;
}

.buscador-cabecera button {
    border: 0;
    background: transparent;
    padding: 0.65rem 0.75rem;
    cursor: pointer;
}

.menu-toggle {
    display: none;
    width: 46px;
    height: 46px;
    border-radius: 12px;
    border: 1px solid var(--color-borde);
    background: #ffffff;
    cursor: pointer;
}

.menu-toggle span {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--color-principal-oscuro);
    margin: 5px auto;
}

main {
    width: min(var(--ancho), calc(100% - 32px));
    margin: 0 auto;
}

.hero-inicio {
    display: grid;
    grid-template-columns: 1.35fr 0.65fr;
    gap: 1.4rem;
    align-items: stretch;
    padding: 2rem 0 1.4rem;
}

.hero-inicio-contenido,
.hero-panel,
.caja-info,
.tarjeta-destacada,
.tarjeta-aviso,
.tarjeta-listado-aviso {
    background: var(--color-panel);
    border: 1px solid var(--color-borde);
    box-shadow: var(--sombra);
    border-radius: var(--radio);
}

.hero-inicio-contenido {
    padding: clamp(1.6rem, 4vw, 3rem);
    min-height: 390px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background:
        radial-gradient(circle at top right, rgba(31, 122, 140, 0.18), transparent 34%),
        linear-gradient(135deg, #ffffff, #edf7f9);
}

.hero-kicker {
    margin: 0 0 0.7rem;
    color: var(--color-secundario);
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-size: 0.83rem;
}

.hero-inicio h1,
.contenido-bando h1 {
    margin: 0;
    line-height: 1.06;
    color: var(--color-principal-oscuro);
    font-size: clamp(2.1rem, 5vw, 4.2rem);
}

.hero-servicio h1 {
    margin: 0;
    line-height: 1.06;
    font-size: clamp(2.1rem, 5vw, 4.2rem);
}

.hero-inicio p:not(.hero-kicker) {
    font-size: clamp(1.05rem, 2vw, 1.28rem);
    color: var(--color-suave);
    max-width: 780px;
}

.hero-servicio p:not(.hero-kicker) {
    font-size: clamp(1.05rem, 2vw, 1.28rem);
    max-width: 780px;
}

.hero-acciones,
.acciones-finales {
    display: flex;
    gap: 0.8rem;
    flex-wrap: wrap;
    margin-top: 1rem;
}

.boton-primario,
.boton-secundario,
.btn-falso {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0.65rem 1rem;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 800;
    border: 1px solid transparent;
}

.boton-primario {
    background: var(--color-principal);
    color: #ffffff;
}

.boton-secundario,
.btn-falso {
    background: #ffffff;
    color: var(--color-principal);
    border-color: var(--color-borde);
}

.boton-primario:hover,
.boton-secundario:hover,
.btn-falso:hover {
    transform: translateY(-1px);
}

.hero-panel {
    padding: 1.4rem;
    min-height: 390px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.5rem;
    color: #ffffff;
    background: linear-gradient(135deg, var(--color-principal), var(--color-secundario));
}

.hero-panel strong {
    font-size: 1.7rem;
    line-height: 1.1;
}

.hero-panel span {
    font-size: 2.2rem;
    font-weight: 900;
}

.hero-panel small {
    font-size: 1rem;
    opacity: 0.9;
}

.hero-panel-imagen {
    padding: clamp(1rem, 2vw, 1.35rem);
    overflow: hidden;
    background:
        radial-gradient(circle at top right, rgba(255, 255, 255, 0.88), transparent 42%),
        #d8e8ec;
    display: grid;
    place-items: center;
}

.hero-panel-imagen img {
    width: auto;
    height: auto;
    max-width: min(86%, 430px);
    max-height: 430px;
    min-height: 0;
    object-fit: contain;
}

.bloque-seccion {
    padding: 1.6rem 0;
}

.seccion-cabecera {
    margin-bottom: 1rem;
}

.seccion-cabecera h2 {
    margin: 0;
    color: var(--color-principal-oscuro);
    font-size: clamp(1.7rem, 3vw, 2.4rem);
}

.seccion-cabecera p {
    margin: 0.4rem 0 0;
    color: var(--color-suave);
}

.seccion-cabecera-horizontal {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
}

.grid-destacados,
.grid-avisos-home {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.tarjeta-destacada {
    padding: 1.35rem;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    min-height: 250px;
}

.tarjeta-destacada:hover,
.tarjeta-listado-aviso:hover,
.tarjeta-aviso:hover {
    transform: translateY(-2px);
}

.icono-grande {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: #eef6f7;
    font-size: 1.7rem;
}

.tarjeta-destacada h3,
.tarjeta-aviso h3,
.tarjeta-listado-aviso h2,
.caja-info h2,
.fila-precio-editable h3 {
    color: var(--color-principal-oscuro);
    margin: 0;
    line-height: 1.2;
}

.tarjeta-destacada p,
.tarjeta-aviso p,
.tarjeta-listado-aviso p,
.caja-info p {
    color: var(--color-suave);
}

.tarjeta-destacada .btn-falso {
    margin-top: auto;
    align-self: flex-start;
}

.tarjeta-destacada-importante {
    background: linear-gradient(135deg, var(--color-principal-oscuro), var(--color-principal));
    color: #ffffff;
}

.tarjeta-destacada-importante h3,
.tarjeta-destacada-importante p {
    color: #ffffff;
}

.tarjeta-destacada-importante .icono-grande,
.tarjeta-destacada-importante .btn-falso {
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.28);
}

.tarjeta-aviso,
.tarjeta-listado-aviso {
    padding: 1.25rem;
}

.meta-publicacion {
    margin: 0 0 0.45rem;
    color: var(--color-secundario) !important;
    font-weight: 800;
    font-size: 0.9rem;
}

.enlace-mas {
    color: var(--color-principal);
    font-weight: 800;
    text-decoration: none;
}

.pagina-servicio {
    padding: 1.6rem 0 2rem;
}

.migas-pan {
    margin: 0 0 1rem;
    color: var(--color-suave);
    font-size: 0.95rem;
}

.migas-pan ol {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 0.45rem;
    flex-wrap: wrap;
}

.migas-pan li + li::before {
    content: "/";
    margin-right: 0.45rem;
    color: #91a3aa;
}

.migas-pan a {
    color: var(--color-principal);
    text-decoration: none;
    font-weight: 700;
}

.hero-servicio {
    padding: 0.35rem 0 0.85rem;
    border-radius: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    margin-bottom: 1.1rem;
}

.hero-servicio h1 {
    font-size: clamp(2rem, 4vw, 3.2rem);
}

.caja-info {
    padding: clamp(1.2rem, 3vw, 2rem);
    margin-bottom: 1rem;
}

.contenido-editable-publico p:first-child {
    margin-top: 0;
}

.contenido-editable-publico ul {
    padding-left: 1.3rem;
}

.listado-tarjetas {
    display: grid;
    gap: 1rem;
}

.caja-vacia {
    text-align: center;
}

.caja-vacia span {
    font-size: 2.4rem;
}

.bloque-precios-editables {
    margin-top: 1rem;
}

.lista-precios-editables {
    display: grid;
    gap: 0.7rem;
}

.fila-precio-editable {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--color-borde);
    border-radius: 16px;
    background: #f8fbfc;
}

.fila-precio-editable p {
    margin: 0.25rem 0 0;
}

.fila-precio-editable strong {
    color: var(--color-principal-oscuro);
    font-size: 1.1rem;
    white-space: nowrap;
}

.galeria-editable {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.galeria-editable figure {
    margin: 0;
    overflow: hidden;
    border-radius: 18px;
    background: #f8fbfc;
    border: 1px solid var(--color-borde);
}

.galeria-editable img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.galeria-editable figcaption {
    padding: 0.75rem 0.9rem;
    color: var(--color-suave);
    font-weight: 650;
}

.formulario-busqueda label {
    display: block;
    font-weight: 800;
    color: var(--color-principal-oscuro);
    margin-bottom: 0.45rem;
}

.grupo-busqueda {
    display: flex;
    gap: 0.7rem;
}

.grupo-busqueda input {
    flex: 1;
    min-height: 48px;
    border: 1px solid var(--color-borde);
    border-radius: 999px;
    padding: 0.65rem 1rem;
    font: inherit;
}

.site-footer {
    margin-top: 2rem;
    background: var(--color-principal-oscuro);
    color: #ffffff;
}

.footer-container {
    width: min(var(--ancho), calc(100% - 32px));
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.4fr 1fr 1fr;
    gap: 1.4rem;
    padding: 2rem 0;
}

.footer-bloque h2 {
    margin: 0 0 0.6rem;
    font-size: 1.1rem;
}

.footer-bloque p,
.footer-bloque ul {
    margin: 0.3rem 0;
    color: rgba(255, 255, 255, 0.82);
}

.footer-bloque ul {
    list-style: none;
    padding: 0;
}

.footer-bloque a {
    color: #ffffff;
    text-decoration: none;
}

.footer-bloque a:hover,
.footer-bloque a:focus {
    text-decoration: underline;
}

.footer-inferior {
    width: min(var(--ancho), calc(100% - 32px));
    margin: 0 auto;
    padding: 1rem 0;
    border-top: 1px solid rgba(255, 255, 255, 0.16);
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    color: rgba(255, 255, 255, 0.78);
}

.footer-inferior p {
    margin: 0;
}

.footer-inferior a {
    color: #ffffff;
    text-decoration: none;
    font-weight: 700;
}


@media (min-width: 1120px) {
    .menu-principal-lista {
        flex-wrap: nowrap;
    }
}

@media (max-width: 980px) {
    .site-header {
        padding-bottom: 10px;
    }

    .header-container {
        grid-template-columns: auto auto;
        border-radius: 26px;
    }

    .menu-toggle {
        display: block;
        justify-self: end;
    }

    .main-nav,
    .buscador-cabecera {
        grid-column: 1 / -1;
        display: none;
    }

    .main-nav.menu-abierto {
        display: block;
    }

    .main-nav.menu-abierto + .buscador-cabecera,
    .buscador-cabecera {
        display: block;
    }

    .menu-principal-lista {
        justify-content: flex-start;
    }

    .buscador-cabecera form {
        width: 100%;
    }

    .buscador-cabecera input {
        width: 100%;
    }

    .hero-inicio,
    .grid-destacados,
    .grid-avisos-home,
    .footer-container {
        grid-template-columns: 1fr;
    }

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

@media (max-width: 640px) {
    .topbar-inner {
        justify-content: flex-start;
    }

    .hero-inicio-contenido,
    .hero-panel {
        min-height: auto;
    }

    .hero-panel-imagen {
        min-height: auto;
    }

    .hero-panel-imagen img {
        max-width: min(62%, 260px);
        max-height: 240px;
        min-height: 0;
    }

    .seccion-cabecera-horizontal,
    .fila-precio-editable,
    .grupo-busqueda,
    .footer-inferior {
        align-items: stretch;
        flex-direction: column;
    }

    .galeria-editable {
        grid-template-columns: 1fr;
    }

    .hero-inicio {
        gap: 0.9rem;
        padding-top: 1rem;
    }

    .hero-inicio-contenido {
        padding: 1.35rem;
    }

    .hero-inicio h1 {
        font-size: clamp(1.85rem, 9vw, 2.65rem);
    }

    .hero-inicio p:not(.hero-kicker) {
        font-size: 1.02rem;
    }

    .hero-panel-imagen {
        padding: 0.9rem;
    }

    .hero-panel-imagen img {
        max-width: min(52%, 210px);
        max-height: 190px;
    }
}

/* Contenido propio por secciones */
.contenido-editable-publico h2 {
    color: var(--color-principal-oscuro);
    font-size: clamp(1.35rem, 2.5vw, 1.8rem);
    margin: 1.4rem 0 0.55rem;
}

.contenido-editable-publico h2:first-child {
    margin-top: 0;
}

.contenido-editable-publico h3 {
    color: var(--color-principal);
    font-size: 1.18rem;
    margin: 1.1rem 0 0.45rem;
}

.contenido-editable-publico p {
    margin: 0 0 0.9rem;
}

.contenido-editable-publico li {
    margin-bottom: 0.3rem;
}

.llamada-accion {
    padding: clamp(1.3rem, 3vw, 2rem);
    border-radius: var(--radio);
    background: linear-gradient(135deg, var(--color-principal), var(--color-secundario));
    color: #ffffff;
    box-shadow: var(--sombra);
    margin-top: 1rem;
}

.bloque-reserva-albergue {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1.3rem;
    flex-wrap: wrap;
}

.bloque-reserva-albergue h2 {
    margin: 0 0 0.4rem;
    color: #ffffff;
}

.bloque-reserva-albergue p {
    margin: 0;
    color: rgba(255,255,255,0.88);
}

.botones-accion {
    display: flex;
    flex-wrap: wrap;
    gap: 0.7rem;
}

.caja-formulario-reserva {
    padding: clamp(1.2rem, 3vw, 2rem);
}

.formulario-reserva label {
    display: block;
    font-weight: 750;
    color: var(--color-principal-oscuro);
    margin-bottom: 0.35rem;
}

.formulario-reserva input,
.formulario-reserva textarea {
    width: 100%;
    border: 1px solid var(--color-borde);
    border-radius: 12px;
    padding: 0.82rem 0.9rem;
    font: inherit;
    color: var(--color-texto);
    background: #ffffff;
}

.formulario-reserva input:focus,
.formulario-reserva textarea:focus {
    outline: 3px solid rgba(63, 143, 90, 0.22);
    border-color: var(--color-secundario);
}

.grupo-formulario {
    margin-bottom: 1.5rem;
}

.grupo-formulario h2 {
    color: var(--color-principal-oscuro);
    font-size: 1.35rem;
    margin: 0 0 1rem;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid var(--color-borde);
}

.grid-formulario {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.grid-formulario p {
    margin: 0;
}

.campo-ancho {
    grid-column: 1 / -1;
}

.campo-trampa {
    display: none;
}

.acciones-formulario {
    display: flex;
    gap: 0.8rem;
    flex-wrap: wrap;
    align-items: center;
}

.aviso-formulario {
    padding: 1rem 1.1rem;
    border-radius: 14px;
    margin-bottom: 1rem;
    font-weight: 650;
}

.aviso-formulario ul {
    margin: 0.5rem 0 0 1.2rem;
    font-weight: 400;
}

.aviso-exito {
    background: #ecfdf5;
    border: 1px solid #bbf7d0;
    color: #166534;
}

.aviso-error {
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #9a3412;
}

@media (max-width: 700px) {
    .grid-formulario {
        grid-template-columns: 1fr;
    }

    .botones-accion,
    .acciones-formulario {
        flex-direction: column;
        align-items: stretch;
    }
}

/* Ajustes: recuperar el diseño anterior de las secciones, manteniendo contenido administrable */
.pagina-diseno-anterior .hero-servicio {
    margin-bottom: 1.35rem;
}

.caracteristicas-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin: 0 0 1rem;
}

.caracteristica-item {
    background: var(--color-panel);
    border: 1px solid var(--color-borde);
    border-radius: var(--radio);
    box-shadow: var(--sombra);
    padding: 1.25rem;
    min-height: 230px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.caracteristica-item:hover {
    transform: translateY(-2px);
}

.caracteristica-item .icono {
    width: 54px;
    height: 54px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    background: #eef6f7;
    font-size: 1.7rem;
    margin-bottom: 0.75rem;
}

.caracteristica-item h3 {
    color: var(--color-principal-oscuro);
    margin: 0 0 0.45rem;
    line-height: 1.2;
}

.caracteristica-item p {
    color: var(--color-suave);
    margin: 0;
}

.bloque-informacion-albergue {
    margin-bottom: 1rem;
}

.info-practica-doble {
    display: grid;
    grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
    gap: 1rem;
    align-items: stretch;
    margin-bottom: 1rem;
}

.caja-tarifas-albergue,
.caja-carrusel-albergue {
    margin-bottom: 0;
}

.lista-tarifas {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
    display: grid;
    gap: 0.75rem;
}

.lista-tarifas li {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    padding: 0.95rem 1rem;
    border: 1px solid var(--color-borde);
    border-radius: 16px;
    background: #f8fbfc;
}

.lista-tarifas small {
    display: block;
    color: var(--color-suave);
    margin-top: 0.25rem;
    line-height: 1.35;
}

.precio-destacado {
    color: var(--color-principal-oscuro);
    font-size: 1.15rem;
    font-weight: 900;
    white-space: nowrap;
}

.contenedor-carrusel-albergue {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    background: #0f172a;
    box-shadow: var(--sombra);
}

#carrusel-albergue {
    display: flex;
    transition: transform 0.45s ease;
    will-change: transform;
}

#carrusel-albergue img {
    width: 100%;
    min-width: 100%;
    height: clamp(280px, 36vw, 500px);
    object-fit: cover;
    background: #e5eef0;
}

.btn-prev-albergue,
.btn-next-albergue {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(15, 23, 42, 0.58);
    color: #ffffff;
    cursor: pointer;
    display: grid;
    place-items: center;
    z-index: 2;
}

.btn-prev-albergue { left: 0.9rem; }
.btn-next-albergue { right: 0.9rem; }

.puntos-albergue {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0.75rem;
    display: flex;
    justify-content: center;
    gap: 0.45rem;
    z-index: 3;
}

.punto-albergue {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.75);
    background: rgba(255, 255, 255, 0.45);
    cursor: pointer;
}

.punto-albergue.activo {
    background: #ffffff;
}

.nota-admin {
    margin: 0.75rem 0 0;
    font-size: 0.95rem;
    color: var(--color-suave);
}

.caja-vacia-compacta {
    padding: 1rem;
    border-radius: 16px;
    border: 1px dashed var(--color-borde);
    background: #f8fbfc;
}

.caja-vacia-compacta p {
    margin: 0;
}

@media (max-width: 1040px) {
    .caracteristicas-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .info-practica-doble {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .caracteristicas-grid {
        grid-template-columns: 1fr;
    }

    .lista-tarifas li {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* =========================================================
   Secciones completas con diseño anterior + administrador
   ========================================================= */
.hero-seccion-diseno {
    text-align: left;
}

.hero-seccion-diseno p:not(.hero-kicker) {
    margin-left: 0;
}

.hero-acciones-interior {
    margin-top: 1.3rem;
}

.seccion-cabecera-mini {
    margin-bottom: 1rem;
}

.seccion-cabecera-mini h2 {
    color: var(--color-principal-oscuro);
    margin: 0;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
}

.bloque-contenido-administrable {
    min-height: 100%;
}

.grid-destacados-interior {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.texto-suave {
    color: var(--color-suave);
    margin-top: 0.35rem;
}

.caja-tarifas-seccion {
    margin-top: 1rem;
}

.caja-carrusel-seccion {
    overflow: hidden;
}

.contenedor-carrusel-seccion,
.contenedor-carrusel-albergue {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
    background: #0f172a;
    box-shadow: var(--sombra);
}

.carrusel-seccion {
    display: flex;
    transition: transform 0.45s ease;
    will-change: transform;
}

.carrusel-seccion figure {
    min-width: 100%;
    margin: 0;
    position: relative;
}

.carrusel-seccion img {
    width: 100%;
    min-width: 100%;
    height: clamp(280px, 36vw, 500px);
    object-fit: cover;
    background: #e5eef0;
}

.carrusel-seccion figcaption {
    position: absolute;
    left: 1rem;
    bottom: 1rem;
    max-width: calc(100% - 2rem);
    padding: 0.45rem 0.75rem;
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.62);
    color: #ffffff;
    font-weight: 750;
    backdrop-filter: blur(8px);
}

.btn-prev-seccion,
.btn-next-seccion {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 2.6rem;
    height: 2.6rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    background: rgba(15, 23, 42, 0.58);
    color: #ffffff;
    cursor: pointer;
    display: grid;
    place-items: center;
    z-index: 2;
}

.btn-prev-seccion { left: 0.9rem; }
.btn-next-seccion { right: 0.9rem; }

.puntos-seccion {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0.75rem;
    display: flex;
    justify-content: center;
    gap: 0.45rem;
    z-index: 3;
}

.punto-seccion {
    width: 0.75rem;
    height: 0.75rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.75);
    background: rgba(255, 255, 255, 0.45);
    cursor: pointer;
}

.punto-seccion.activo {
    background: #ffffff;
}

.llamada-accion-diseno {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1.3rem;
    flex-wrap: wrap;
}

.llamada-accion-diseno h2 {
    margin: 0 0 0.4rem;
    color: #ffffff;
}

.llamada-accion-diseno p {
    margin: 0;
    color: rgba(255,255,255,0.88);
    max-width: 760px;
}

.lista-datos-contacto {
    list-style: none;
    padding: 0;
    margin: 1rem 0 0;
    display: grid;
    gap: 0.8rem;
}

.lista-datos-contacto li {
    display: grid;
    gap: 0.2rem;
    padding: 0.85rem;
    background: #f8fbfc;
    border: 1px solid var(--color-borde);
    border-radius: 14px;
}

.lista-datos-contacto strong {
    color: var(--color-principal-oscuro);
}

.lista-datos-contacto a {
    color: var(--color-principal);
    font-weight: 800;
    text-decoration: none;
}

.chips-localidades {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-top: 1rem;
}

.chips-localidades span {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding: 0.45rem 0.8rem;
    border-radius: 999px;
    background: #eef6f7;
    border: 1px solid var(--color-borde);
    color: var(--color-principal-oscuro);
    font-weight: 800;
}

.grid-recomendaciones {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.9rem;
    margin-top: 1rem;
}

.grid-recomendaciones article {
    padding: 1rem;
    border-radius: 16px;
    border: 1px solid var(--color-borde);
    background: #f8fbfc;
}

.grid-recomendaciones strong {
    display: block;
    color: var(--color-principal-oscuro);
    margin-bottom: 0.35rem;
}

.grid-recomendaciones span {
    color: var(--color-suave);
}

.avisos-seccion {
    margin-top: 1rem;
}

.pagina-legal-diseno .caracteristicas-grid .caracteristica-item {
    min-height: 190px;
}

@media (max-width: 980px) {
    .grid-destacados-interior,
    .grid-recomendaciones {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .hero-seccion-diseno {
        text-align: center;
    }

    .hero-seccion-diseno p:not(.hero-kicker) {
        margin-left: auto;
    }

    .grid-destacados-interior,
    .grid-recomendaciones {
        grid-template-columns: 1fr;
    }

    .llamada-accion-diseno,
    .llamada-accion-diseno .botones-accion,
    .hero-acciones-interior {
        align-items: stretch;
        flex-direction: column;
    }

    .botones-accion a,
    .hero-acciones-interior a {
        width: 100%;
    }
}

/* Ajuste final del escudo de portada en tablet y móvil.
   En ordenador se mantiene como tarjeta lateral.
   En pantallas pequeñas se convierte en un escudo pequeño, sin caja gigante. */
@media (max-width: 900px) {
    .hero-inicio {
        gap: 0.85rem;
    }

    .hero-panel-imagen {
        width: auto;
        max-width: 230px;
        min-height: 0;
        margin: 0.15rem auto 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        background: transparent;
        overflow: visible;
    }

    .hero-panel-imagen img {
        display: block;
        width: auto;
        max-width: 170px;
        max-height: 190px;
        margin: 0 auto;
        object-fit: contain;
    }
}

@media (max-width: 640px) {
    .hero-inicio {
        gap: 0.55rem;
        padding-bottom: 0.6rem;
    }

    .hero-panel-imagen {
        max-width: 190px;
        margin-top: 0;
    }

    .hero-panel-imagen img {
        max-width: 135px;
        max-height: 155px;
    }
}

@media (max-width: 420px) {
    .hero-panel-imagen img {
        max-width: 115px;
        max-height: 135px;
    }
}

/* Mejora V2: aviso de privacidad del formulario de reserva */
.aviso-privacidad-formulario {
    border: 1px solid var(--color-borde);
    border-radius: 16px;
    padding: 1rem;
    background: #f8fafc;
}

.campo-checkbox {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    margin: 0.8rem 0 0;
}

.formulario-reserva .campo-checkbox input[type="checkbox"] {
    width: auto;
    min-width: 20px;
    height: 20px;
    margin-top: 0.15rem;
}

.formulario-reserva .campo-checkbox label {
    margin-bottom: 0;
    color: var(--color-texto);
    font-weight: 650;
}


/* Prueba V2.1: cabecera más limpia, sin franja superior de contacto. */
.site-header-simple {
    padding: 16px 0;
}

.header-container-simple {
    min-height: 74px;
    grid-template-columns: auto minmax(420px, 1fr) auto;
    padding: 0.72rem 0.95rem;
    border-radius: 26px;
}

.header-container-simple .logo-icono {
    width: 48px;
    height: 48px;
    border-radius: 15px;
    font-size: 1.45rem;
}

.header-container-simple .logo-texto strong {
    font-size: 1rem;
}

.header-container-simple .logo-texto span {
    font-size: 0.96rem;
}

.header-container-simple .menu-principal-lista a {
    padding: 0.48rem 0.58rem;
}

.header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.45rem;
    white-space: nowrap;
}

.header-sede,
.header-search-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 42px;
    border-radius: 999px;
    text-decoration: none;
    font-weight: 800;
    line-height: 1;
}

.header-sede {
    padding: 0.65rem 0.92rem;
    color: #ffffff;
    background: linear-gradient(135deg, var(--color-principal), var(--color-secundario));
    box-shadow: 0 10px 24px rgba(18, 56, 38, 0.18);
}

.header-sede:hover,
.header-sede:focus {
    outline: 3px solid rgba(63, 143, 90, 0.25);
    text-decoration: none;
}

.header-search-link {
    padding: 0.6rem 0.75rem;
    color: var(--color-principal-oscuro);
    background: #eef5f6;
    border: 1px solid var(--color-borde);
}

.header-search-link:hover,
.header-search-link:focus {
    background: #e7f1f3;
    outline: none;
}

@media (max-width: 980px) {
    .header-container-simple {
        grid-template-columns: auto 1fr auto;
        min-height: auto;
    }

    .header-actions {
        justify-self: end;
    }

    .header-container-simple .main-nav {
        grid-column: 1 / -1;
        display: none;
    }

    .header-container-simple .main-nav.menu-abierto {
        display: block;
    }

    .header-container-simple .menu-toggle {
        justify-self: end;
    }
}

@media (max-width: 720px) {
    .site-header-simple {
        padding: 10px 0;
    }

    .header-container-simple {
        width: min(var(--ancho), calc(100% - 20px));
        padding: 0.65rem;
        border-radius: 22px;
        gap: 0.55rem;
    }

    .header-container-simple .logo-icono {
        width: 44px;
        height: 44px;
    }

    .header-container-simple .logo-texto strong {
        font-size: 0.96rem;
    }

    .header-container-simple .logo-texto span {
        font-size: 0.88rem;
    }

    .header-search-link span:last-child {
        display: none;
    }

    .header-sede {
        padding: 0.62rem 0.72rem;
        font-size: 0.92rem;
    }
}

@media (max-width: 520px) {
    .header-container-simple {
        grid-template-columns: 1fr auto;
    }

    .header-actions {
        grid-column: 1 / -1;
        justify-content: stretch;
        width: 100%;
    }

    .header-actions .header-sede,
    .header-actions .header-search-link {
        flex: 1;
    }

    .header-container-simple .menu-toggle {
        grid-column: 2;
        grid-row: 1;
    }
}


.menu-principal-lista a.activo,
.menu-principal-lista a[aria-current="page"] {
    background: #e7f1f3;
    color: var(--color-principal-oscuro);
}

.mapa-web-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.mapa-web-grid > div {
    border: 1px solid rgba(9, 70, 91, 0.12);
    border-radius: 18px;
    padding: 1rem;
    background: #ffffff;
}

.mapa-web-grid h3 {
    margin-top: 0;
}

.mapa-web-grid ul {
    margin-bottom: 0;
}

.mapa-web-grid a {
    font-weight: 700;
    color: var(--color-principal-oscuro);
}

@media (max-width: 760px) {
    .mapa-web-grid {
        grid-template-columns: 1fr;
    }
}


.resumen-avisos-publicos {
    margin-bottom: 1rem;
}

.etiqueta-aviso {
    display: inline-flex;
    align-items: center;
    padding: 0.18rem 0.55rem;
    margin-right: 0.45rem;
    border-radius: 999px;
    background: rgba(9, 70, 91, 0.08);
    color: var(--color-principal-oscuro);
    font-weight: 800;
    font-size: 0.86rem;
}

.tarjeta-aviso-destacado {
    border-left: 6px solid var(--color-acento);
}

.opciones-checks {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.estado-pendiente {
    background: #fff4d6;
    color: #8a5a00;
}

@media (max-width: 760px) {
    .opciones-checks {
        gap: 0.35rem;
    }
}


.resumen-funcional-reserva {
    margin-bottom: 1rem;
}

.resumen-funcional-reserva ul {
    margin-bottom: 0;
}

.aviso-exito strong {
    font-weight: 900;
}

.formulario-reserva[novalidate] input:invalid,
.formulario-reserva[novalidate] textarea:invalid {
    box-shadow: none;
}


.caja-formulario-contacto {
    margin-top: 1rem;
}

.formulario-contacto .grid-formulario,
.formulario-busqueda .grupo-busqueda {
    width: 100%;
}

.resultado-atajos-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.8rem;
}

.resultado-atajos-grid a {
    display: grid;
    gap: 0.25rem;
    padding: 1rem;
    border-radius: 18px;
    background: #fff;
    border: 1px solid rgba(9, 70, 91, 0.12);
    text-decoration: none;
    color: var(--color-principal-oscuro);
    font-weight: 800;
}

.resultado-atajos-grid a span {
    color: var(--color-texto-suave);
    font-weight: 500;
}

.resultado-atajos-grid a em {
    font-style: normal;
    color: var(--color-acento-oscuro);
    font-weight: 900;
}

.aviso-funcional-solicitudes {
    margin-bottom: 1rem;
}

@media (max-width: 760px) {
    .resultado-atajos-grid {
        grid-template-columns: 1fr;
    }
}


.lista-contenido-oficial li {
    margin: 0.55rem 0;
}

.grid-telefonos-oficiales {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.tarjeta-telefono-oficial h2 {
    margin-top: 0;
}

@media (max-width: 760px) {
    .grid-telefonos-oficiales {
        grid-template-columns: 1fr;
    }
}


.tabla-estado-contenido {
    margin-bottom: 1.2rem;
}

.estado-contenido {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0.35rem 0.7rem;
    font-weight: 900;
    font-size: 0.9rem;
}

.estado-contenido.estado-ok {
    background: #dcfce7;
    color: #166534;
}

.estado-contenido.estado-pendiente {
    background: #fff7d6;
    color: #7a4d00;
}

.estado-contenido.estado-neutral {
    background: #e0f2fe;
    color: #075985;
}


.estructura-completa-grid {
    margin-top: 0.8rem;
}

.estructura-seccion {
    margin-bottom: 1.2rem;
}

.footer-extra-estructura {
    max-width: 1180px;
    margin: 1.5rem auto 0;
    padding: 1rem;
    border-top: 1px solid rgba(255,255,255,0.18);
}

.footer-extra-estructura h2 {
    font-size: 1rem;
    margin: 0 0 0.5rem;
}

.footer-extra-estructura ul {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem 1rem;
    list-style: none;
    padding: 0;
    margin: 0;
}


.hero-inicio-revision .hero-inicio-contenido {
    align-self: center;
}

.hero-panel-avisos {
    display: grid;
    gap: 0.9rem;
    align-content: start;
}

.hero-panel-avisos-cabecera h2 {
    margin: 0;
}

.lista-avisos-portada {
    display: grid;
    gap: 0.75rem;
}

.aviso-portada {
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid rgba(9, 70, 91, 0.12);
    padding: 0.85rem;
}

.aviso-portada h3 {
    margin: 0.15rem 0 0.35rem;
    font-size: 1.05rem;
}

.aviso-portada h3 a {
    color: inherit;
    text-decoration: none;
}

.aviso-portada p {
    margin-bottom: 0;
}

.aviso-portada-destacado {
    border-color: rgba(169, 119, 39, 0.38);
}

.enlace-avisos-portada {
    justify-self: start;
    margin-top: 0.2rem;
}


.site-header .header-container.header-container-simple {
    max-width: 1380px;
    grid-template-columns: minmax(250px, 300px) minmax(0, 1fr) auto;
    gap: 1.15rem;
    align-items: center;
}

.logo-ayuntamiento a {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    min-width: 0;
}

.logo-ayuntamiento .logo-icono {
    width: 72px;
    height: 72px;
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(31,95,59,0.9), rgba(31,95,59,1));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 72px;
    overflow: hidden;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.16);
}

.logo-ayuntamiento .logo-icono img {
    width: 46px;
    height: auto;
    display: block;
}

.logo-ayuntamiento .logo-texto {
    min-width: 0;
    line-height: 1.05;
}

.logo-ayuntamiento .logo-texto strong {
    display: block;
    font-size: 1rem;
    line-height: 1.05;
}

.logo-ayuntamiento .logo-texto span {
    display: block;
    font-size: 0.84rem;
    color: var(--color-suave);
    line-height: 1.08;
}

.main-nav {
    min-width: 0;
}

.menu-principal-lista {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.2rem;
}

.menu-principal-lista a {
    padding: 0.5rem 0.6rem;
    font-size: 0.98rem;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    justify-content: flex-end;
}

.header-search,
.header-sede {
    white-space: nowrap;
}

.header-search {
    padding: 0.8rem 1rem;
}

.header-sede {
    padding: 0.8rem 1.2rem;
}

@media (max-width: 1360px) {
    .site-header .header-container.header-container-simple {
        max-width: 1280px;
        grid-template-columns: minmax(220px, 260px) minmax(0, 1fr) auto;
        gap: 0.85rem;
    }

    .logo-ayuntamiento .logo-icono {
        width: 64px;
        height: 64px;
        flex-basis: 64px;
    }

    .logo-ayuntamiento .logo-icono img {
        width: 41px;
    }

    .menu-principal-lista a {
        padding: 0.46rem 0.48rem;
        font-size: 0.93rem;
    }

    .header-search,
    .header-sede {
        padding: 0.72rem 0.92rem;
        font-size: 0.94rem;
    }
}

@media (max-width: 1120px) {
    .site-header .header-container.header-container-simple {
        grid-template-columns: minmax(200px, 1fr) auto;
        row-gap: 0.8rem;
    }

    .main-nav {
        grid-column: 1 / -1;
        order: 3;
    }

    .menu-principal-lista {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    .site-header .header-container.header-container-simple {
        grid-template-columns: 1fr auto;
        padding: 0.8rem;
    }

    .logo-ayuntamiento .logo-icono {
        width: 56px;
        height: 56px;
        border-radius: 16px;
        flex-basis: 56px;
    }

    .logo-ayuntamiento .logo-icono img {
        width: 35px;
    }

    .logo-ayuntamiento .logo-texto strong {
        font-size: 0.92rem;
    }

    .logo-ayuntamiento .logo-texto span {
        font-size: 0.78rem;
    }

    .header-actions {
        display: none;
    }
}


.site-footer.footer-compacto {
    margin-top: 2rem;
    background: linear-gradient(135deg, #0f4b2f 0%, #0b3d28 100%);
    color: #ffffff;
}

.footer-container.footer-container-compacto {
    display: flex;
    width: min(var(--ancho), calc(100% - 32px));
    margin: 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 1.1rem;
    padding: 1rem 0 0.65rem;
}

.footer-compacto .footer-bloque h2 {
    margin: 0 0 0.45rem;
    font-size: 1rem;
    line-height: 1.2;
}

.footer-compacto .footer-bloque p,
.footer-compacto .footer-bloque li {
    margin: 0.18rem 0;
    line-height: 1.45;
}

.footer-compacto .footer-bloque ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-compacto .footer-bloque a {
    color: rgba(255, 255, 255, 0.92);
    text-decoration: none;
}

.footer-compacto .footer-bloque a:hover,
.footer-compacto .footer-bloque a:focus {
    text-decoration: underline;
}

.footer-compacto-inferior {
    width: min(var(--ancho), calc(100% - 32px));
    margin: 0 auto;
    padding: 0.55rem 0 0.7rem;
    border-top: 1px solid rgba(255, 255, 255, 0.14);
}

.footer-compacto-inferior p {
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
}

@media (max-width: 900px) {
    .footer-container.footer-container-compacto {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }
}

@media (max-width: 640px) {
    .footer-container.footer-container-compacto {
        padding-top: 0.95rem;
    }

    .footer-compacto-inferior {
        padding-top: 0.5rem;
    }
}


.seccion-cabecera-simple {
    margin-bottom: 1rem;
}

.seccion-cabecera-simple h2 {
    margin-bottom: 0;
}


.hero-ayuntamiento-limpio {
    margin-bottom: 1.2rem;
}

.ayuntamiento-grid-principal {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.4rem;
}

.tarjeta-ayuntamiento {
    background: var(--color-panel);
    border: 1px solid var(--color-borde);
    border-radius: var(--radio);
    box-shadow: var(--sombra);
    padding: 1.35rem;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    min-height: 255px;
}

.tarjeta-ayuntamiento:hover,
.tarjeta-ayuntamiento:focus {
    transform: translateY(-2px);
}

.tarjeta-ayuntamiento h2 {
    margin: 0;
    color: var(--color-principal-oscuro);
    font-size: 1.35rem;
    line-height: 1.15;
}

.tarjeta-ayuntamiento p {
    margin: 0;
    color: var(--color-suave);
}

.ayuntamiento-bloques-secundarios {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.4rem;
}

.lista-enlaces-limpia {
    margin: 0.3rem 0 0;
    padding-left: 1.1rem;
}

.lista-enlaces-limpia li {
    margin: 0.35rem 0;
}

.lista-enlaces-limpia a {
    font-weight: 800;
    color: var(--color-principal-oscuro);
}

@media (max-width: 980px) {
    .ayuntamiento-grid-principal {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .ayuntamiento-grid-principal,
    .ayuntamiento-bloques-secundarios {
        grid-template-columns: 1fr;
    }
}


.hero-apartado-limpio {
    margin-bottom: 1.2rem;
}

.apartado-grid-principal {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.4rem;
}

.tarjeta-apartado {
    background: var(--color-panel);
    border: 1px solid var(--color-borde);
    border-radius: var(--radio);
    box-shadow: var(--sombra);
    padding: 1.35rem;
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    min-height: 255px;
}

.tarjeta-apartado:hover,
.tarjeta-apartado:focus {
    transform: translateY(-2px);
}

.tarjeta-apartado h2 {
    margin: 0;
    color: var(--color-principal-oscuro);
    font-size: 1.35rem;
    line-height: 1.15;
}

.tarjeta-apartado p {
    margin: 0;
    color: var(--color-suave);
}

.apartado-bloques-secundarios {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.4rem;
}

@media (max-width: 980px) {
    .apartado-grid-principal {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .apartado-grid-principal,
    .apartado-bloques-secundarios {
        grid-template-columns: 1fr;
    }
}


/* Ajuste cabecera: menú en una sola línea */
@media (min-width: 1121px) {
    .site-header {
        padding-bottom: 10px;
    }

    .site-header .header-container.header-container-simple {
        width: min(1440px, calc(100% - 48px));
        min-height: 76px;
        grid-template-columns: minmax(230px, 270px) minmax(0, 1fr) auto;
        gap: 0.9rem;
        padding: 0.65rem 0.9rem;
        border-radius: 28px;
    }

    .logo-ayuntamiento .logo-icono {
        width: 58px;
        height: 58px;
        flex-basis: 58px;
        border-radius: 17px;
    }

    .logo-ayuntamiento .logo-icono img {
        width: 38px;
    }

    .logo-ayuntamiento .logo-texto strong {
        font-size: 0.95rem;
    }

    .logo-ayuntamiento .logo-texto span {
        font-size: 0.8rem;
    }

    .main-nav {
        min-width: 0;
    }

    .menu-principal-lista {
        flex-wrap: nowrap;
        justify-content: center;
        gap: 0.14rem;
        white-space: nowrap;
    }

    .menu-principal-lista a {
        padding: 0.44rem 0.48rem;
        font-size: 0.93rem;
        line-height: 1.05;
    }

    .header-actions {
        gap: 0.55rem;
    }

    .header-search-link,
    .header-sede {
        min-height: 40px;
        font-size: 0.92rem;
    }

    .header-search-link {
        padding: 0.55rem 0.72rem;
    }

    .header-sede {
        padding: 0.62rem 0.9rem;
    }
}

@media (min-width: 1121px) and (max-width: 1260px) {
    .site-header .header-container.header-container-simple {
        grid-template-columns: minmax(205px, 230px) minmax(0, 1fr) auto;
        gap: 0.55rem;
    }

    .menu-principal-lista a {
        padding-left: 0.36rem;
        padding-right: 0.36rem;
        font-size: 0.88rem;
    }

    .header-search-link span:last-child {
        display: none;
    }

    .header-sede {
        padding-left: 0.72rem;
        padding-right: 0.72rem;
    }
}


.avisos-panel-control {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.2rem;
}

.avisos-panel-control h2 {
    margin: 0 0 0.35rem;
}

.avisos-panel-control p {
    margin: 0;
}

.filtros-avisos {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    justify-content: flex-end;
}

.filtros-avisos a {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.55rem 0.75rem;
    border-radius: 999px;
    border: 1px solid var(--color-borde);
    background: #fff;
    text-decoration: none;
    font-weight: 700;
    color: var(--color-principal-oscuro);
}

.filtros-avisos a.activo,
.filtros-avisos a:hover,
.filtros-avisos a:focus {
    background: var(--color-principal);
    color: #fff;
    border-color: var(--color-principal);
}

.filtros-avisos span {
    display: inline-flex;
    min-width: 1.4rem;
    justify-content: center;
    padding: 0.05rem 0.35rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.28);
    font-size: 0.85rem;
}

.filtros-avisos a:not(.activo) span {
    background: var(--color-fondo);
    color: var(--color-suave);
}

.avisos-bloque-publico {
    margin-bottom: 1.3rem;
}

@media (max-width: 780px) {
    .avisos-panel-control {
        align-items: flex-start;
        flex-direction: column;
    }

    .filtros-avisos {
        justify-content: flex-start;
    }
}


.contacto-grid-principal {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.3rem;
}

.contacto-grid-principal .tarjeta-apartado {
    min-height: 210px;
}

.contacto-grid-principal a {
    color: var(--color-principal-oscuro);
    font-weight: 800;
    overflow-wrap: anywhere;
}

.contacto-doble {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.3rem;
}

@media (max-width: 1050px) {
    .contacto-grid-principal {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .contacto-grid-principal,
    .contacto-doble {
        grid-template-columns: 1fr;
    }
}


.grid-actividades {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.4rem;
}

.tarjeta-actividad {
    background: var(--color-panel);
    border: 1px solid var(--color-borde);
    border-radius: var(--radio);
    box-shadow: var(--sombra);
    padding: 1.35rem;
}

.tarjeta-actividad-cabecera {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.7rem;
}

.tarjeta-actividad h2 {
    margin: 0 0 0.5rem;
    color: var(--color-principal-oscuro);
}

.datos-actividad {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 0.45rem 0.75rem;
    margin: 1rem 0;
}

.datos-actividad dt {
    font-weight: 800;
    color: var(--color-principal-oscuro);
}

.datos-actividad dd {
    margin: 0;
}

.boton-deshabilitado {
    opacity: 0.7;
    cursor: not-allowed;
}

.actividad-resumen-inscripcion {
    margin-bottom: 1.3rem;
}

@media (max-width: 820px) {
    .grid-actividades {
        grid-template-columns: 1fr;
    }
}


.localizacion-mapa-principal {
    display: grid;
    grid-template-columns: minmax(280px, 0.9fr) minmax(320px, 1.6fr);
    gap: 1.25rem;
    align-items: stretch;
}

.localizacion-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.mapa-embed {
    min-height: 420px;
    border-radius: var(--radio);
    overflow: hidden;
    border: 1px solid var(--color-borde);
    background: #eef2f7;
}

.mapa-embed iframe {
    width: 100%;
    height: 100%;
    min-height: 420px;
    border: 0;
    display: block;
}

@media (max-width: 900px) {
    .localizacion-mapa-principal {
        grid-template-columns: 1fr;
    }
}


.hero-pueblo-con-foto {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(260px, 0.8fr);
    gap: 1.4rem;
    align-items: center;
}

.foto-pueblo-principal {
    margin: 0;
    border-radius: var(--radio);
    overflow: hidden;
    border: 1px solid var(--color-borde);
    min-height: 260px;
    background: #edf2f7;
}

.foto-pueblo-principal img {
    width: 100%;
    height: 100%;
    min-height: 260px;
    object-fit: cover;
    display: block;
}

.pueblo-resumen {
    margin-bottom: 1.2rem;
}

.grid-pueblos-fotos {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.tarjeta-pueblo {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    background: var(--color-panel);
    border: 1px solid var(--color-borde);
    border-radius: var(--radio);
    overflow: hidden;
    box-shadow: var(--sombra);
}

.tarjeta-pueblo img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
}

.tarjeta-pueblo span {
    margin: 1rem 1rem 0.35rem;
    color: var(--color-suave);
    font-weight: 800;
    font-size: 0.9rem;
}

.tarjeta-pueblo strong {
    margin: 0 1rem 0.7rem;
    color: var(--color-principal-oscuro);
    font-size: 1.25rem;
}

.tarjeta-pueblo em {
    margin: auto 1rem 1rem;
    font-style: normal;
    font-weight: 800;
    color: var(--color-principal);
}

@media (max-width: 980px) {
    .hero-pueblo-con-foto,
    .grid-pueblos-fotos {
        grid-template-columns: 1fr;
    }
}




/* V2_36: fotos de pueblos en formato grande.
   Aunque algunas imágenes actuales tengan baja resolución, se mantienen grandes
   porque serán sustituidas después por fotografías de mayor calidad. */
.hero-pueblo-con-foto {
    grid-template-columns: minmax(0, 1.2fr) minmax(300px, 0.8fr);
}

.foto-pueblo-principal {
    min-height: 280px;
    max-height: none;
    background: #edf2f7;
}

.foto-pueblo-principal img {
    width: 100%;
    height: 100%;
    min-height: 280px;
    object-fit: cover;
    padding: 0;
    background: transparent;
}

.tarjeta-pueblo img {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    padding: 0;
    background: transparent;
}

@media (max-width: 980px) {
    .hero-pueblo-con-foto {
        grid-template-columns: 1fr;
    }

    .foto-pueblo-principal {
        max-width: none;
    }
}


.tiempo-bloque-principal,
.camara-tiempo-real {
    display: grid;
    grid-template-columns: minmax(280px, 0.85fr) minmax(320px, 1.6fr);
    gap: 1.25rem;
    align-items: stretch;
    margin-bottom: 1.25rem;
}

.tiempo-info,
.camara-info {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.tiempo-widget,
.camara-visor {
    min-height: 430px;
    border-radius: var(--radio);
    overflow: hidden;
    border: 1px solid var(--color-borde);
    background: #f8fafc;
}

.tiempo-widget iframe,
.camara-visor iframe {
    width: 100%;
    height: 100%;
    min-height: 430px;
    border: 0;
    display: block;
}

.camara-placeholder {
    min-height: 430px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.65rem;
    padding: 2rem;
    text-align: center;
    color: var(--color-texto);
    background:
        radial-gradient(circle at 20% 20%, rgba(29, 78, 48, 0.10), transparent 30%),
        linear-gradient(135deg, #f8fafc, #eef4f1);
}

.camara-placeholder span {
    font-size: 3rem;
}

.camara-placeholder strong {
    color: var(--color-principal-oscuro);
    font-size: 1.3rem;
}

.camara-placeholder p {
    margin: 0;
    color: var(--color-suave);
}

@media (max-width: 900px) {
    .tiempo-bloque-principal,
    .camara-tiempo-real {
        grid-template-columns: 1fr;
    }
}


.camping-estado {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(260px, 0.7fr);
    gap: 1.25rem;
    align-items: stretch;
    margin-bottom: 1.25rem;
}

.etiqueta-estado {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.35rem 0.75rem;
    border-radius: 999px;
    background: #fff7ed;
    color: #9a3412;
    border: 1px solid #fed7aa;
    font-weight: 900;
    margin: 0 0 0.75rem;
}

.camping-aviso {
    border-radius: var(--radio);
    background: #f8fafc;
    border: 1px solid var(--color-borde);
    padding: 1.1rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.camping-aviso strong {
    color: var(--color-principal-oscuro);
    font-size: 1.15rem;
}

.camping-aviso p {
    margin-bottom: 0;
}

.camping-grid-info {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.lista-limpia {
    margin: 0;
    padding-left: 1.25rem;
}

.lista-limpia li + li {
    margin-top: 0.45rem;
}

@media (max-width: 1000px) {
    .camping-estado,
    .camping-grid-info {
        grid-template-columns: 1fr;
    }
}


.header-social-link {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: var(--color-principal-oscuro);
    text-decoration: none;
    font-weight: 800;
}

.header-social-link span:first-child {
    width: 1.7rem;
    height: 1.7rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--color-principal);
    color: #fff;
    font-family: Arial, sans-serif;
    font-weight: 900;
}

.footer-bloque-redes .footer-redes {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
}

.footer-redes a {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    text-decoration: none;
    color: inherit;
    border: 1px solid var(--color-borde);
    border-radius: 999px;
    padding: 0.45rem 0.75rem;
    background: rgba(255, 255, 255, 0.7);
}

.footer-redes span {
    width: 1.65rem;
    height: 1.65rem;
    border-radius: 999px;
    background: var(--color-principal);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-family: Arial, sans-serif;
}

.grid-redes-sociales {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.tarjeta-red-social {
    border: 1px solid var(--color-borde);
    border-radius: var(--radio);
    padding: 1.1rem;
    text-decoration: none;
    color: inherit;
    background: #ffffff;
    box-shadow: var(--sombra);
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
}

.tarjeta-red-social .red-icono {
    width: 3rem;
    height: 3rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--color-principal);
    color: #ffffff;
    font-size: 1.45rem;
    font-weight: 900;
    font-family: Arial, sans-serif;
}

.tarjeta-red-social strong {
    font-size: 1.35rem;
    color: var(--color-principal-oscuro);
}

.tarjeta-red-social em {
    font-style: normal;
    width: fit-content;
    border-radius: 999px;
    padding: 0.25rem 0.65rem;
    font-weight: 900;
    font-size: 0.85rem;
}

.red-activa em {
    background: #e8f6ed;
    color: #166534;
}

.red-pendiente {
    background: #f8fafc;
}

.red-pendiente em {
    background: #fff7ed;
    color: #9a3412;
}


/* V2_42: contraste del enlace del tablón en la portada. */
.hero-panel-avisos .enlace-avisos-portada {
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.65);
}

.hero-panel-avisos .enlace-avisos-portada:hover,
.hero-panel-avisos .enlace-avisos-portada:focus {
    background: rgba(255, 255, 255, 0.14);
}


/* V3: actividades compactas para listados largos. */
.pagina-actividades-compactas .actividades-resumen-superior {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin: 1.2rem 0;
}

.tarjeta-dato-actividad {
    background: #ffffff;
    border: 1px solid var(--color-borde);
    border-radius: 18px;
    padding: 1rem;
    box-shadow: var(--sombra-suave);
}

.tarjeta-dato-actividad span {
    display: block;
    font-size: 2rem;
    line-height: 1;
    font-weight: 800;
    color: var(--color-principal);
}

.tarjeta-dato-actividad p {
    margin: 0.35rem 0 0;
    color: var(--color-texto-suave);
}

.encabezado-seccion-linea {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.encabezado-seccion-linea h2 {
    margin: 0;
}

.bloque-actividades-destacadas {
    margin: 1.6rem 0;
}

.grid-actividades-destacadas {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.tarjeta-actividad-destacada {
    background: #ffffff;
    border: 1px solid var(--color-borde);
    border-radius: 20px;
    padding: 1.1rem;
    box-shadow: var(--sombra-suave);
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.tarjeta-actividad-destacada h3 {
    margin: 0;
}

.tarjeta-actividad-destacada p {
    margin: 0;
    color: var(--color-texto-suave);
}

.meta-actividad-compacta {
    margin: 0;
    padding-left: 1.1rem;
    color: var(--color-texto-suave);
    font-size: 0.95rem;
}

.meta-actividad-compacta li + li {
    margin-top: 0.25rem;
}

.bloque-listado-actividades {
    margin-top: 1.5rem;
}

.controles-actividades {
    display: grid;
    grid-template-columns: auto minmax(220px, 1fr) auto minmax(170px, 240px) auto;
    gap: 0.7rem;
    align-items: center;
    margin: 1rem 0 1.2rem;
    padding: 0.9rem;
    border: 1px solid var(--color-borde);
    border-radius: 16px;
    background: #f8fafc;
}

.controles-actividades label {
    font-weight: 700;
}

.controles-actividades input[type="search"],
.controles-actividades select {
    width: 100%;
    min-height: 42px;
    border: 1px solid var(--color-borde);
    border-radius: 12px;
    padding: 0.55rem 0.75rem;
    font: inherit;
    background: #ffffff;
}

.checkbox-filtro-actividad {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    white-space: nowrap;
}

.listado-actividades-compacto {
    display: grid;
    gap: 1rem;
}

.grupo-actividades {
    border: 1px solid var(--color-borde);
    border-radius: 18px;
    padding: 0.85rem;
    background: #ffffff;
}

.grupo-actividades h3 {
    margin: 0 0 0.7rem;
    color: var(--color-principal);
}

.actividad-acordeon {
    border: 1px solid var(--color-borde);
    border-radius: 14px;
    background: #ffffff;
    overflow: hidden;
}

.actividad-acordeon + .actividad-acordeon {
    margin-top: 0.55rem;
}

.actividad-acordeon summary {
    cursor: pointer;
    list-style: none;
    display: grid;
    grid-template-columns: minmax(180px, 1.4fr) minmax(120px, 1fr) auto;
    gap: 0.75rem;
    align-items: center;
    padding: 0.85rem 0.95rem;
}

.actividad-acordeon summary::-webkit-details-marker {
    display: none;
}

.actividad-acordeon summary::before {
    content: "+";
    display: inline-grid;
    place-items: center;
    width: 1.45rem;
    height: 1.45rem;
    border-radius: 999px;
    background: #eef2ff;
    color: var(--color-principal);
    font-weight: 800;
    grid-column: 1;
    grid-row: 1;
    transform: translateX(-0.15rem);
}

.actividad-acordeon[open] summary::before {
    content: "–";
}

.actividad-resumen-titulo {
    font-weight: 800;
    padding-left: 1.8rem;
    grid-column: 1;
    grid-row: 1;
}

.actividad-resumen-meta {
    color: var(--color-texto-suave);
    font-size: 0.95rem;
}

.actividad-acordeon-contenido {
    border-top: 1px solid var(--color-borde);
    padding: 0.95rem;
    background: #f8fafc;
}

.actividad-acordeon-contenido p:first-child {
    margin-top: 0;
}

.datos-actividad-compactos {
    grid-template-columns: minmax(90px, 130px) minmax(0, 1fr);
    margin: 0.8rem 0;
}

.mensaje-sin-resultados {
    margin: 1rem 0 0;
    padding: 1rem;
    border-radius: 14px;
    background: #fff7ed;
    border: 1px solid #fed7aa;
}

@media (max-width: 1000px) {
    .grid-actividades-destacadas {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .controles-actividades {
        grid-template-columns: 1fr;
    }

    .checkbox-filtro-actividad {
        white-space: normal;
    }
}

@media (max-width: 720px) {
    .pagina-actividades-compactas .actividades-resumen-superior,
    .grid-actividades-destacadas {
        grid-template-columns: 1fr;
    }

    .encabezado-seccion-linea {
        display: block;
    }

    .encabezado-seccion-linea .boton-secundario {
        margin-top: 0.8rem;
    }

    .actividad-acordeon summary {
        grid-template-columns: 1fr;
        gap: 0.35rem;
    }

    .actividad-resumen-titulo {
        padding-left: 1.8rem;
    }

    .actividad-resumen-meta,
    .actividad-acordeon summary .estado {
        margin-left: 1.8rem;
        justify-self: start;
    }
}


.tarjeta-actividad-destacada .boton-primario,
.tarjeta-actividad-destacada .boton-secundario,
.tarjeta-actividad-destacada .boton-deshabilitado {
    margin-top: auto;
    width: 100%;
    justify-content: center;
}


.tarjeta-actividad-cabecera-simple {
    justify-content: flex-start;
    margin-bottom: 0;
}

.tarjeta-actividad-pie {
    margin-top: auto;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.tarjeta-actividad-pie .estado-anclado {
    align-self: flex-start;
}

.tarjeta-actividad-pie .boton-primario,
.tarjeta-actividad-pie .boton-secundario,
.tarjeta-actividad-pie .boton-deshabilitado {
    width: 100%;
    justify-content: center;
}


/* V3_4: categorías desplegables en el listado de actividades. */
.grupo-actividades-desplegable {
    border: 1px solid var(--color-borde);
    border-radius: 18px;
    background: #ffffff;
    overflow: hidden;
}

.grupo-actividades-desplegable + .grupo-actividades-desplegable {
    margin-top: 0.9rem;
}

.grupo-actividades-resumen {
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.15rem;
    color: var(--color-principal);
    font-weight: 800;
}

.grupo-actividades-resumen::-webkit-details-marker {
    display: none;
}

.grupo-actividades-resumen::before {
    content: "+";
    display: inline-grid;
    place-items: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 999px;
    background: #eef2ff;
    color: var(--color-principal);
    font-weight: 900;
    flex: 0 0 auto;
}

.grupo-actividades-desplegable[open] .grupo-actividades-resumen::before {
    content: "–";
}

.grupo-actividades-resumen span:first-child {
    flex: 1;
    font-size: 1.08rem;
}

.grupo-actividades-resumen span:last-child {
    color: var(--color-texto-suave);
    font-size: 0.95rem;
    font-weight: 700;
}

.grupo-actividades-contenido {
    padding: 0 0.85rem 0.85rem;
}

.grupo-actividades-contenido .actividad-acordeon:first-child {
    margin-top: 0;
}

.grupo-actividades-desplegable > h3 {
    display: none;
}

@media (max-width: 720px) {
    .grupo-actividades-resumen {
        align-items: flex-start;
    }

    .grupo-actividades-resumen span:last-child {
        white-space: nowrap;
    }
}


/* V3_5: corrección de visibilidad del texto en el buscador de actividades. */
.controles-actividades input[type="search"],
.controles-actividades input[type="text"],
.controles-actividades select {
    color: var(--color-texto);
    -webkit-text-fill-color: var(--color-texto);
    caret-color: var(--color-principal);
    opacity: 1;
}

.controles-actividades input[type="search"]::placeholder,
.controles-actividades input[type="text"]::placeholder {
    color: #7a8793;
    -webkit-text-fill-color: #7a8793;
    opacity: 1;
}

.controles-actividades input[type="search"]:focus,
.controles-actividades input[type="text"]:focus,
.controles-actividades select:focus {
    color: var(--color-texto);
    -webkit-text-fill-color: var(--color-texto);
    background: #ffffff;
}

/* Portada con imagen hero y acciones visuales. */
.hero-inicio-con-imagen {
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
}

.hero-inicio-contenido-visual {
    position: relative;
    overflow: hidden;
    min-height: clamp(320px, 42vw, 430px);
    padding: 0;
    border: none;
    background: #123826;
}

.hero-inicio-foto {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 35%;
}

.hero-inicio-texto {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: inherit;
    padding: clamp(1.4rem, 3vw, 2.4rem);
    color: #ffffff;
    background: linear-gradient(
        180deg,
        rgba(8, 34, 24, 0.08) 0%,
        rgba(8, 34, 24, 0.42) 42%,
        rgba(8, 34, 24, 0.88) 100%
    );
}

.hero-inicio-contenido-visual .hero-kicker {
    color: #f2d08a;
}

.hero-inicio-contenido-visual h1 {
    color: #ffffff;
    font-size: clamp(1.85rem, 4vw, 2.75rem);
    text-shadow: 0 2px 18px rgba(0, 0, 0, 0.28);
}

.hero-inicio-contenido-visual p:not(.hero-kicker) {
    color: rgba(255, 255, 255, 0.92);
    max-width: 42ch;
    margin-bottom: 0;
}

.hero-inicio-con-imagen .hero-panel-avisos {
    background: linear-gradient(160deg, #ffffff, #f3faf5);
    border: 1px solid rgba(31, 95, 59, 0.14);
    box-shadow: 0 20px 50px rgba(7, 41, 51, 0.12);
}

@media (max-width: 900px) {
    .hero-inicio-con-imagen {
        grid-template-columns: 1fr;
    }

    .hero-inicio-contenido-visual {
        min-height: clamp(280px, 58vw, 360px);
    }
}

.bloque-simbolos-municipales {
    margin-top: 0;
}

/* Portada: una única entrada con tres intenciones de visita. */
.hero-inicio-unificada {
    margin-left: calc((100% - 100vw) / 2);
    margin-right: calc((100% - 100vw) / 2);
    width: 100vw;
    max-width: none;
    grid-template-columns: minmax(0, 1fr) minmax(310px, 0.42fr);
    gap: 0;
    padding: 0;
    background: #103b2b;
}

.hero-inicio-unificada .hero-inicio-contenido-visual,
.hero-inicio-unificada .hero-panel-avisos {
    border-radius: 0;
    min-height: clamp(430px, 54vw, 620px);
}

.hero-inicio-unificada .hero-inicio-texto {
    padding: clamp(2rem, 7vw, 7rem);
    padding-right: clamp(2rem, 10vw, 10rem);
}

.hero-inicio-unificada h1 {
    max-width: 10ch;
    font-size: clamp(3rem, 6.6vw, 6.6rem);
    letter-spacing: -0.07em;
}

.boton-hero {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    margin-top: 1.35rem;
    padding: .85rem 1.1rem;
    border-radius: 999px;
    background: #f26b2b;
    color: #fff;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .18);
}

.hero-inicio-unificada .hero-panel-avisos {
    padding: clamp(1.5rem, 3vw, 2.6rem);
    color: #193f31;
    background: #f5f2e9;
    border: 0;
    box-shadow: none;
}

.hero-inicio-unificada .hero-panel-avisos .hero-kicker { color: #d85d25; }
.hero-inicio-unificada .aviso-portada { background: #fff; }
.hero-inicio-unificada .enlace-avisos-portada { color: #174d39; font-weight: 800; }

.puertas-principales { padding: clamp(3.5rem, 7vw, 6.5rem) 0 2.5rem; }
.puertas-principales .seccion-cabecera { max-width: 680px; }
.puertas-principales-lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.puerta-principal { min-height: 360px; padding: clamp(1.4rem, 2.4vw, 2.1rem); border-radius: 24px; display: flex; flex-direction: column; color: #fff; overflow: hidden; }
.puerta-residente { background: linear-gradient(145deg, #0e4d42, #176b57); }
.puerta-paso { background: linear-gradient(145deg, #d85d25, #ef8734); }
.puerta-visitante { background: linear-gradient(145deg, #234b37, #0b2c25); }
.puerta-icono { font-size: 2.15rem; font-weight: 700; line-height: 1; }
.puerta-etiqueta { margin: 1.8rem 0 .35rem; color: rgba(255,255,255,.7); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: .76rem; }
.puerta-principal h3 { margin: 0; color: #fff; font-size: clamp(1.7rem, 2.5vw, 2.25rem); }
.puerta-principal > p:not(.puerta-etiqueta) { max-width: 29ch; color: rgba(255,255,255,.88); }
.puerta-enlaces { display: grid; gap: .45rem; margin-top: auto; padding-top: 1rem; }
.puerta-enlaces a { color: #fff; font-weight: 800; text-decoration: none; }
.puerta-enlaces a::after { content: ' ↗'; }
.acciones-prioritarias-utiles { padding-top: 2.3rem; }

/* Orientación antes que catálogo: la portada no usa una cuadrícula de tarjetas. */
.orientador-inicio { padding: clamp(4rem, 9vw, 8rem) 0 clamp(3rem, 6vw, 5rem); }
.orientador-inicio > h2 { max-width: 12ch; margin: 0; color: #163d2e; font-size: clamp(2.6rem, 6vw, 5.4rem); line-height: .96; letter-spacing: -.065em; }
.busqueda-inicio { max-width: 820px; margin: 2rem 0 4rem; }
.busqueda-inicio label { display: block; margin-bottom: .7rem; font-weight: 800; color: #234b37; }
.busqueda-inicio div { display: flex; border-bottom: 2px solid #173f30; }
.busqueda-inicio input { min-width: 0; flex: 1; padding: 1rem 0; border: 0; outline: 0; background: transparent; color: #1d382e; font: inherit; font-size: clamp(1.05rem, 2vw, 1.35rem); }
.busqueda-inicio input::placeholder { color: #718078; opacity: 1; }
.busqueda-inicio button { border: 0; background: transparent; padding: .6rem 0 .6rem 1rem; color: #d95622; font: inherit; font-weight: 900; cursor: pointer; }
.rutas-utiles { border-top: 1px solid rgba(21, 61, 45, .25); }
.ruta-util { display: grid; grid-template-columns: 80px minmax(190px, .9fr) minmax(230px, 1.25fr) auto; gap: 1.5rem; align-items: center; min-height: 138px; border-bottom: 1px solid rgba(21, 61, 45, .25); }
.ruta-util > span { color: #dc632e; font-weight: 900; font-size: 1rem; }
.ruta-util h3 { margin: 0; color: #173f30; font-size: clamp(1.35rem, 2.6vw, 2.15rem); letter-spacing: -.04em; line-height: 1; }
.ruta-util p { margin: 0; color: #62726a; }
.ruta-util a { color: #173f30; font-weight: 900; text-decoration: none; white-space: nowrap; }
.ruta-util a::after { content: '  ↗'; color: #dc632e; }
.enlaces-esenciales { margin: 0 calc((100% - 100vw) / 2); padding: clamp(2.8rem, 6vw, 5rem) max(16px, calc((100vw - var(--ancho)) / 2)); color: #fff; background: #173f30; }
.enlaces-esenciales h2 { margin: 0 0 1.35rem; color: #fff; font-size: clamp(1.5rem, 3vw, 2.3rem); }
.enlaces-esenciales nav { display: flex; flex-wrap: wrap; gap: .45rem 1.2rem; }
.enlaces-esenciales a { padding: .25rem 0; color: rgba(255,255,255,.92); font-weight: 700; text-decoration: none; }
.enlaces-esenciales a::after { content: ' ↗'; color: #f0a34e; }

@media (max-width: 800px) {
    .ruta-util { grid-template-columns: 44px 1fr; gap: .8rem 1rem; padding: 1.35rem 0; }
    .ruta-util > span { grid-row: span 3; }
    .ruta-util p, .ruta-util a { grid-column: 2; }
    .ruta-util a { white-space: normal; }
}

.pagina-puerta { padding-top: 1.8rem; padding-bottom: 3rem; }
.hero-puerta { position: relative; overflow: visible; margin-bottom: 1.35rem; padding: 0.35rem 0 0.85rem; border-radius: 0; background: transparent; color: var(--color-texto); box-shadow: none; }
.hero-puerta::after { content: none; }
.hero-puerta > * { position: relative; z-index: 1; }
.hero-puerta .hero-kicker { color: var(--color-acento); }
.hero-puerta h1 { max-width: 18ch; font-size: clamp(2.4rem, 5vw, 4.6rem); letter-spacing: -.055em; }
.hero-puerta p:not(.hero-kicker) { max-width: 60ch; }
.pagina-puerta-paso .hero-puerta { background: transparent; }
.pagina-puerta-visitante .hero-puerta { background: transparent; }
.grid-puerta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.grid-puerta .tarjeta-apartado { min-height: 250px; }

@media (max-width: 850px) { .grid-puerta { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .grid-puerta { grid-template-columns: 1fr; } .hero-puerta { border-radius: 0; } }

@media (max-width: 900px) {
    .hero-inicio-unificada { grid-template-columns: 1fr; }
    .hero-inicio-unificada .hero-panel-avisos { min-height: auto; }
    .puertas-principales-lista { grid-template-columns: 1fr; }
    .puerta-principal { min-height: 290px; }
}

.simbolos-municipales-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr);
    gap: 1.5rem;
    align-items: center;
}

.simbolo-municipal {
    margin: 0;
    text-align: center;
}

.simbolo-municipal img {
    display: block;
    width: 100%;
    max-width: 320px;
    margin: 0 auto;
    height: auto;
}

.simbolo-bandera img {
    max-width: 100%;
}

.simbolo-municipal figcaption {
    margin-top: 0.75rem;
    font-weight: 600;
    color: var(--color-principal-oscuro);
}

.hero-albergue {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(220px, 360px);
    gap: 1.5rem;
    align-items: center;
}

.hero-albergue-marca {
    margin: 0;
}

.hero-albergue-marca img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 16px;
    background: #fff;
    border: 1px solid var(--color-borde);
    padding: 0.75rem;
}

@media (max-width: 768px) {
    .simbolos-municipales-grid,
    .hero-albergue {
        grid-template-columns: 1fr;
    }
}

/* Cabecera definitiva: evita solapamientos entre menú y accesos. */
@media (max-width: 1260px) {
    .site-header .header-container.header-container-simple {
        grid-template-columns: minmax(200px, 1fr) auto auto;
        gap: 0.65rem;
    }

    .logo-ayuntamiento {
        grid-column: 1;
        grid-row: 1;
    }

    .header-actions {
        grid-column: 2;
        grid-row: 1;
    }

    .header-container-simple .menu-toggle {
        display: inline-flex;
        grid-column: 3;
        grid-row: 1;
        justify-self: end;
    }

    .header-container-simple .main-nav {
        display: none;
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .header-container-simple .main-nav.menu-abierto {
        display: block;
    }
}

@media (min-width: 1261px) and (max-width: 1360px) {
    .site-header .header-container.header-container-simple {
        grid-template-columns: minmax(200px, 220px) minmax(0, 1fr) auto;
        gap: 0.45rem;
    }

    .logo-ayuntamiento .logo-icono {
        width: 52px;
        height: 52px;
        flex-basis: 52px;
    }

    .logo-ayuntamiento .logo-icono img {
        width: 34px;
    }

    .menu-principal-lista a {
        padding: 0.42rem 0.3rem;
        font-size: 0.84rem;
    }

    .header-actions {
        gap: 0.35rem;
    }

    .header-search-link span:last-child,
    .header-social-link span:last-child {
        display: none;
    }

    .header-search-link,
    .header-social-link,
    .header-sede {
        min-height: 40px;
        padding: 0.55rem 0.68rem;
        font-size: 0.86rem;
    }
}

@media (max-width: 760px) {
    .site-header .header-container.header-container-simple {
        grid-template-columns: 1fr auto;
    }

    .logo-ayuntamiento {
        grid-column: 1;
        grid-row: 1;
    }

    .header-container-simple .menu-toggle {
        grid-column: 2;
        grid-row: 1;
    }

    .header-actions {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .header-container-simple .main-nav,
    .header-container-simple .main-nav.menu-abierto {
        grid-column: 1 / -1;
        grid-row: 3;
    }
}