@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800;900&display=swap");

*,
*::before,
*::after {
    font-family: "Montserrat", sans-serif;
}

body {
    /* background-image: url("/images/fondo.png"); */
    /* background-size: cover; */
    /* background-position: center; */
    /* background-repeat: no-repeat; */
    background-color: #f5f2f2;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    padding-top: 60px;
}

.portal-skeleton {
    position: fixed;
    inset: 0;
    z-index: 3800;
    padding: 74px 0 42px;
    background: #f5f2f2;
    display: grid;
    align-content: start;
    gap: 18px;
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
        opacity 0.34s ease,
        visibility 0.34s ease;
}

html.portal-loading .portal-skeleton {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.portal-skeleton.is-leaving {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.portal-skeleton-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.portal-skeleton-band,
.portal-skeleton-slider {
    width: 100%;
    padding-inline: clamp(12px, 2.2vw, 24px);
    box-sizing: border-box;
    margin-inline: auto;
}

.portal-skeleton-shell {
    width: min(1240px, calc(100% - clamp(18px, 6vw, 72px)));
    margin-inline: auto;
    border-radius: 18px;
    border: 1px solid rgba(96, 16, 40, 0.1);
    background: #ffffff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.09);
    padding: 16px;
    display: grid;
    gap: 14px;
}

.portal-skeleton-band {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 12px;
    align-items: center;
}

.portal-skeleton-slider {
    margin-bottom: 2px;
}

.portal-skeleton-stack {
    display: grid;
    gap: 9px;
}

.portal-skeleton-shape {
    position: relative;
    overflow: hidden;
    border-radius: 11px;
    border: 1px solid rgba(255, 255, 255, 0.68);
    background: linear-gradient(90deg, #dfdade 0%, #d7d1d6 48%, #dfdade 100%);
}

.portal-skeleton-shape::after {
    content: "";
    position: absolute;
    inset: 0;
    transform: translateX(-100%);
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(255, 255, 255, 0.7) 48%,
        transparent 100%
    );
    animation: portalSkeletonShimmer 1.24s ease-in-out infinite;
}

.portal-skeleton-band-logo {
    width: 44px;
    height: 44px;
    border-radius: 999px;
}

.portal-skeleton-band-line {
    height: 14px;
    border-radius: 999px;
}

.portal-skeleton-band-action {
    width: 188px;
    height: 18px;
    border-radius: 999px;
}

.portal-skeleton-slider-media {
    width: 100%;
    height: clamp(220px, 36vw, 400px);
    border-radius: 10px;
}

.portal-skeleton-news {
    background: #ffffff;
}

.portal-skeleton-news-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.portal-skeleton-title-pill {
    width: 210px;
    height: 20px;
    border-radius: 999px;
}

.portal-skeleton-title-badge {
    width: 158px;
    height: 20px;
    border-radius: 999px;
}

.portal-skeleton-news-main {
    display: grid;
    grid-template-columns: 1.05fr 1.15fr;
    border-radius: 14px;
    border: 1px solid rgba(96, 16, 40, 0.12);
    overflow: hidden;
    background: #ffffff;
}

.portal-skeleton-news-image {
    min-height: 246px;
    border-radius: 0;
}

.portal-skeleton-news-copy {
    padding: 14px;
    display: grid;
    align-content: start;
    gap: 10px;
}

.portal-skeleton-section-title {
    width: min(460px, 78%);
    height: 20px;
    border-radius: 999px;
}

.portal-skeleton-sectors-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.portal-skeleton-mini-card {
    border-radius: 14px;
    border: 1px solid rgba(96, 16, 40, 0.08);
    background: #ffffff;
    padding: 14px 12px;
    display: grid;
    justify-items: center;
    gap: 10px;
}

.portal-skeleton-mini-icon {
    width: 38px;
    height: 38px;
    border-radius: 999px;
}

.portal-skeleton-chip {
    width: min(170px, 56%);
    height: 18px;
    border-radius: 999px;
}

.portal-skeleton-line {
    height: 14px;
    border-radius: 999px;
}

.portal-skeleton-line-long {
    width: min(360px, 94%);
}

.portal-skeleton-line-medium {
    width: min(240px, 80%);
}

.portal-skeleton-line-short {
    width: min(180px, 60%);
}

.portal-skeleton-pill {
    width: min(190px, 72%);
    height: 30px;
    border-radius: 999px;
}

.portal-skeleton-highlights-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.portal-skeleton-card {
    border-radius: 14px;
    border: 1px solid rgba(96, 16, 40, 0.08);
    background: #ffffff;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.07);
    padding: 12px;
    display: grid;
    gap: 10px;
}

.portal-skeleton-media {
    width: 100%;
    height: 126px;
}

.portal-skeleton-search-grid {
    display: grid;
    grid-template-columns: 1.15fr 1fr 1fr auto;
    gap: 10px;
}

.portal-skeleton-search-field,
.portal-skeleton-search-button {
    height: 42px;
    border-radius: 12px;
}

.portal-skeleton-search-button {
    width: 130px;
}

.portal-skeleton-job-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.portal-skeleton-job-cover {
    width: 100%;
    height: 138px;
}

.portal-skeleton-stack-card {
    gap: 8px;
}

.portal-skeleton-map-shell {
    border-radius: 14px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    padding: 12px;
    display: grid;
    gap: 10px;
    background: #ffffff;
}

.portal-skeleton-map-meta {
    width: 46%;
    height: 16px;
    border-radius: 999px;
}

.portal-skeleton-map-canvas {
    width: 100%;
    height: 280px;
}

.portal-skeleton-map-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.portal-skeleton-events-head {
    display: grid;
    gap: 8px;
}

.portal-skeleton-events-hero {
    width: 100%;
    min-height: 224px;
    border-radius: 18px;
}

.portal-skeleton-events-panel {
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: 14px;
}

.portal-skeleton-calendar {
    width: 100%;
    min-height: 336px;
    border-radius: 16px;
}

.portal-skeleton-events-list {
    display: grid;
    align-content: start;
    gap: 10px;
}

.portal-skeleton-event-item {
    border-radius: 12px;
    border: 1px solid rgba(15, 23, 42, 0.09);
    background: #ffffff;
    padding: 10px;
    display: grid;
    grid-template-columns: 84px 1fr;
    gap: 10px;
}

.portal-skeleton-event-date {
    width: 100%;
    min-height: 70px;
    border-radius: 10px;
}

@keyframes portalSkeletonShimmer {
    100% {
        transform: translateX(100%);
    }
}

@media (max-width: 960px) {
    .portal-skeleton {
        padding-top: 72px;
    }

    .portal-skeleton-band {
        grid-template-columns: 1fr auto;
    }

    .portal-skeleton-band-line {
        grid-column: 1 / -1;
    }

    .portal-skeleton-news-main,
    .portal-skeleton-events-panel {
        grid-template-columns: minmax(0, 1fr);
    }

    .portal-skeleton-sectors-grid,
    .portal-skeleton-highlights-grid,
    .portal-skeleton-job-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .portal-skeleton-search-button {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .portal-skeleton {
        padding: 68px 0 28px;
    }

    .portal-skeleton-shell,
    .portal-skeleton-band {
        width: min(1240px, calc(100% - 20px));
    }

    .portal-skeleton-slider {
        width: 100%;
        padding-inline: 0;
    }

    .portal-skeleton-band {
        grid-template-columns: 1fr;
    }

    .portal-skeleton-band-action {
        width: min(190px, 68%);
    }

    .portal-skeleton-sectors-grid,
    .portal-skeleton-highlights-grid,
    .portal-skeleton-job-grid,
    .portal-skeleton-search-grid,
    .portal-skeleton-events-panel,
    .portal-skeleton-event-item {
        grid-template-columns: minmax(0, 1fr);
    }

    .portal-skeleton-news-copy,
    .portal-skeleton-shell {
        padding: 12px;
    }

    .portal-skeleton-map-canvas,
    .portal-skeleton-calendar {
        min-height: 230px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .portal-skeleton,
    .portal-skeleton-shape::after {
        transition: none;
        animation: none;
    }
}

.floating-band {
    transition:
        transform 0.28s ease,
        opacity 0.28s ease;
    opacity: 0;
    pointer-events: none;
}

.floating-band.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.floating-band-top {
    transform: translateY(-105%);
}

.floating-band-bottom {
    transform: translateY(105%);
}

.floating-band-top.is-visible,
.floating-band-bottom.is-visible {
    transform: translateY(0);
}

.floating-band-inner {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    box-sizing: border-box;
}

.floating-band-logo {
    height: 44px;
    width: auto;
}

.site-top-band {
    position: fixed !important;
    top: 0 !important;
    left: 0;
    right: 0;
    z-index: 3000 !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.portal-brand-inline {
    margin-top: 0;
    padding: 6px 16px;
}

.portal-brand-strip-inner {
    max-width: none;
    width: 100%;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.portal-brand-strip-left {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
    flex-wrap: wrap;
}

.portal-brand-logo {
    display: block;
    width: auto;
    object-fit: contain;
}

.portal-brand-logo-gob {
    height: 120px;
}

.portal-brand-logo-impulsala {
    height: 120px;
    max-width: none;
}

.portal-brand-strip-right {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-left: auto;
}

.portal-brand-login-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 8px 16px;
    border: 2px solid #2d9385;
    border-radius: 999px;
    background: #ffffff;
    color: #5e6268;
    text-decoration: none;
    font-weight: 700;
    font-size: clamp(1rem, 1.3vw, 1.15rem);
    line-height: 1;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.1);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
}

.portal-brand-login-btn:hover,
.portal-brand-login-btn:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.14);
    border-color: #1f7468;
}

.portal-brand-login-btn i {
    font-size: clamp(1.2rem, 1.7vw, 1.55rem);
    color: #17c4bc;
    line-height: 1;
}

.portal-brand-login-btn span {
    white-space: nowrap;
}

.portal-brand-user-tools {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.portal-brand-user-chip {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(16, 97, 48, 0.2);
    background: linear-gradient(135deg, #2f9a3f 0%, #238a35 100%);
    color: #ffffff;
    font-weight: 700;
    font-size: clamp(0.9rem, 1.1vw, 1rem);
    line-height: 1;
    box-shadow: 0 6px 14px rgba(21, 97, 44, 0.24);
}

.portal-brand-user-chip i {
    font-size: 1rem;
    line-height: 1;
}

.portal-brand-user-chip-desktop {
    display: inline-flex;
}

.portal-brand-user-toggle {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 42px;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid rgba(16, 97, 48, 0.2);
    background: linear-gradient(135deg, #2f9a3f 0%, #238a35 100%);
    color: #ffffff;
    font-weight: 700;
    font-size: clamp(0.9rem, 1.1vw, 1rem);
    line-height: 1;
    box-shadow: 0 6px 14px rgba(21, 97, 44, 0.24);
    cursor: pointer;
}

.portal-brand-user-toggle-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.portal-brand-user-toggle-icon {
    font-size: 0.88rem;
    transition: transform 0.2s ease;
}

.portal-brand-user-tools.is-open .portal-brand-user-toggle-icon {
    transform: rotate(180deg);
}

.portal-brand-user-menu {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.portal-brand-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 8px 14px;
    border: 2px solid #2d9385;
    border-radius: 999px;
    background: #ffffff;
    color: #27655d;
    text-decoration: none;
    font-weight: 700;
    font-size: clamp(0.9rem, 1.1vw, 1rem);
    line-height: 1;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
}

.portal-brand-action-btn:hover,
.portal-brand-action-btn:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.14);
    border-color: #1f7468;
}

.portal-brand-action-btn i {
    line-height: 1;
}

.portal-brand-action-btn.is-logout {
    border-color: #9b1a4b;
    color: #8e1c46;
}

.portal-brand-action-btn.is-logout:hover,
.portal-brand-action-btn.is-logout:focus-visible {
    border-color: #7f153d;
}

.portal-brand-logout-form {
    margin: 0;
}

.site-footer-band {
    display: block;
}

@media (max-width: 960px) {
    .portal-brand-strip-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 14px;
    }

    .portal-brand-strip-right {
        width: 100%;
        justify-content: flex-start;
    }

    .portal-brand-logo-gob {
        height: 72px;
    }

    .portal-brand-logo-impulsala {
        height: 62px;
        max-width: 100%;
    }

    .portal-brand-login-btn {
        font-size: clamp(0.96rem, 2.9vw, 1.08rem);
        padding: 8px 14px;
    }

    .portal-brand-login-btn i {
        font-size: clamp(1.05rem, 4.2vw, 1.25rem);
    }

    .portal-brand-user-tools {
        justify-content: flex-start;
        width: 100%;
        gap: 8px;
    }

    .portal-brand-user-chip,
    .portal-brand-action-btn {
        font-size: clamp(0.86rem, 2.6vw, 0.96rem);
    }

    .portal-brand-user-toggle {
        font-size: clamp(0.86rem, 2.6vw, 0.96rem);
    }
}

@media (max-width: 640px) {
    .portal-brand-inline {
        padding: 8px 10px;
    }

    .portal-brand-strip-left {
        gap: 14px;
    }

    .portal-brand-logo-gob {
        height: 56px;
    }

    .portal-brand-logo-impulsala {
        height: 50px;
    }

    .portal-brand-login-btn {
        width: 100%;
        justify-content: center;
        min-height: 42px;
    }

    .portal-brand-user-tools {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .portal-brand-user-chip-desktop {
        display: none;
    }

    .portal-brand-user-toggle {
        display: inline-flex;
        width: 100%;
    }

    .portal-brand-user-menu {
        display: none;
        width: 100%;
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .portal-brand-user-tools.is-open .portal-brand-user-menu {
        display: grid;
    }

    .portal-brand-action-btn {
        width: 100%;
        justify-content: center;
    }

    .portal-brand-logout-form {
        width: 100%;
        margin: 0;
    }
}

.load-reveal {
    opacity: 0;
    transform: translateY(18px);
    will-change: transform, opacity;
}

.load-reveal.is-visible {
    animation: loadRevealIn 0.72s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.load-reveal.from-left {
    transform: translateX(-30px);
}

.load-reveal.from-right {
    transform: translateX(30px);
}

.load-reveal.from-up {
    transform: translateY(-24px);
}

.load-reveal.from-down {
    transform: translateY(24px);
}

.load-reveal.from-center {
    transform: scale(0.94);
}

@keyframes loadRevealIn {
    to {
        opacity: 1;
        transform: translate(0, 0);
    }
}

.slider-container {
    width: 100vw;
    max-width: 100%;
    height: 400px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 20px;
    margin-bottom: 80px;
    overflow: hidden;
}

.slider-container::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.14) 0%,
        rgba(0, 0, 0, 0.28) 100%
    );
    z-index: 1;
    pointer-events: none;
}

.slider-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(100%);
    transform: scale(1.01);
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.15);
}

.slider-logo {
    position: absolute;
    top: 50%;
    left: 50%;
    width: min(64vw, 980px);
    max-width: 92%;
    transform: translate(-50%, -50%);
    z-index: 2;
    filter: drop-shadow(0 10px 28px rgba(0, 0, 0, 0.36));
    pointer-events: none;
}

.connecta-wrap {
    max-width: 1240px;
    margin: 0 auto 90px;
    padding: 0 28px;
}

:root {
    --connecta-primary: #a62346;
    --connecta-secondary: #1e5c50;
    --connecta-accent: #c19656;
    --connecta-deep: #601028;
    --connecta-ink: #061e1b;
    --page-max-width: 1240px;
    --page-gutter: 28px;
    --section-space: 72px;
}

.news-wrap,
.sector-jump-wrap,
.highlights-wrap,
.hub-wrap,
.events-wrap,
.hub-docs-only {
    max-width: var(--page-max-width);
    margin: 0 auto var(--section-space);
    padding: 0 var(--page-gutter);
    box-sizing: border-box;
}

.connecta-shell {
    border-radius: 24px;
    border: 1px solid rgba(96, 16, 40, 0.2);
    background: #ffffff;
    box-shadow: 0 16px 36px rgba(6, 30, 27, 0.14);
    overflow: hidden;
}

.connecta-head {
    padding: 18px 20px;
    border-bottom: 1px solid rgba(96, 16, 40, 0.15);
    background: linear-gradient(180deg, #fff 0%, rgba(193, 150, 86, 0.1) 100%);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.connecta-head h2 {
    margin: 0;
    color: var(--connecta-primary);
    font-size: clamp(1.2rem, 2.4vw, 1.9rem);
    font-weight: 900;
    letter-spacing: 0.01em;
}

.connecta-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.connecta-tag {
    border-radius: 999px;
    border: 1px solid rgba(96, 16, 40, 0.2);
    background: #ffffff;
    color: var(--connecta-ink);
    font-size: 0.78rem;
    font-weight: 700;
    padding: 6px 10px;
}

.connecta-tag i {
    color: var(--connecta-secondary);
}

.connecta-visual {
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid rgba(96, 16, 40, 0.15);
    background: #ffffff;
}

.connecta-track {
    display: flex;
    width: max-content;
    animation: connectaSlide 20s linear infinite;
}

.connecta-photo {
    width: 360px;
    height: 180px;
    object-fit: cover;
    display: block;
    border-right: 1px solid rgba(15, 23, 42, 0.08);
}

.connecta-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    padding: 14px;
}

.connecta-col {
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(30, 92, 80, 0.18);
    box-shadow: 0 8px 24px rgba(6, 30, 27, 0.09);
    background: #fff;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transform: translateY(18px);
    opacity: 0;
    animation: fadeSlideUp 0.6s ease forwards;
    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease,
        border-color 0.22s ease;
}

.connecta-col:hover {
    transform: translateY(-4px);
    border-color: rgba(166, 35, 70, 0.52);
    box-shadow: 0 16px 26px rgba(96, 16, 40, 0.16);
}

.connecta-col h3,
.connecta-col h4,
.connecta-col p {
    margin: 0;
}

.connecta-col h3 {
    color: var(--connecta-deep);
    font-size: 1.36rem;
    font-weight: 900;
}

.connecta-col h4 {
    color: var(--connecta-secondary);
    font-size: 0.88rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    font-weight: 900;
}

.connecta-col p {
    color: var(--connecta-ink);
    font-size: 0.86rem;
    line-height: 1.5;
}

.connecta-kpis {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.connecta-kpi {
    border-radius: 10px;
    border: 1px solid rgba(193, 150, 86, 0.5);
    background: linear-gradient(180deg, rgba(193, 150, 86, 0.12) 0%, #fff 100%);
    padding: 8px;
    opacity: 0;
    transform: translateY(8px);
    animation: kpiFadeIn 0.45s ease forwards;
    transition:
        box-shadow 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.connecta-kpi:hover {
    border-color: rgba(166, 35, 70, 0.56);
    box-shadow: 0 10px 20px rgba(96, 16, 40, 0.14);
    transform: translateY(-2px);
}

.connecta-kpi strong {
    display: block;
    color: var(--connecta-primary);
    font-size: 0.95rem;
    font-weight: 900;
    line-height: 1.2;
}

.connecta-kpi span {
    display: block;
    margin-top: 3px;
    color: var(--connecta-ink);
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.25;
}

.connecta-kpi span i {
    color: var(--connecta-secondary);
}

.connecta-col:nth-child(1) .connecta-kpi:nth-child(1),
.connecta-col:nth-child(2) .connecta-kpi:nth-child(1),
.connecta-col:nth-child(3) .connecta-kpi:nth-child(1) {
    animation-delay: 0.24s;
}

.connecta-col:nth-child(1) .connecta-kpi:nth-child(2),
.connecta-col:nth-child(2) .connecta-kpi:nth-child(2),
.connecta-col:nth-child(3) .connecta-kpi:nth-child(2) {
    animation-delay: 0.34s;
}

.connecta-steps {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
}

.connecta-steps .step {
    border: 1px solid rgba(30, 92, 80, 0.3);
    border-radius: 999px;
    background: #fff;
    color: var(--connecta-ink);
    padding: 6px 9px;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
}

.connecta-steps .step i {
    color: var(--connecta-secondary);
    margin-right: 4px;
}

.connecta-steps .step.done {
    border-color: rgba(166, 35, 70, 0.4);
    background: rgba(166, 35, 70, 0.08);
    color: var(--connecta-deep);
}

.connecta-progress {
    height: 8px;
    border-radius: 999px;
    background: rgba(6, 30, 27, 0.12);
    overflow: hidden;
}

.connecta-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(
        90deg,
        var(--connecta-accent) 0%,
        var(--connecta-primary) 100%
    );
}

.connecta-mini-list {
    margin: 0;
    padding-left: 0;
    list-style: none;
    color: var(--connecta-ink);
    font-size: 0.82rem;
    line-height: 1.5;
    display: grid;
    gap: 5px;
}

.connecta-mini-list li i {
    color: var(--connecta-primary);
    margin-right: 6px;
}

.connecta-col:nth-child(1) {
    animation-delay: 0.08s;
}

.connecta-col:nth-child(2) {
    animation-delay: 0.18s;
}

.connecta-col:nth-child(3) {
    animation-delay: 0.28s;
}

.connecta-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 0 14px 14px;
}

.connecta-cta {
    border: 1px solid var(--connecta-primary);
    width: 100%;
    background: var(--connecta-primary);
    color: #ffffff;
    border-radius: 12px;
    padding: 10px 12px;
    font-size: 0.85rem;
    font-weight: 800;
    text-align: left;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    cursor: pointer;
    position: relative;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.connecta-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(96, 16, 40, 0.24);
}

.connecta-cta.alt {
    background: var(--connecta-secondary);
    border-color: var(--connecta-secondary);
}

.connecta-cta i {
    font-size: 1rem;
}

.connecta-btn-loader {
    width: 14px;
    height: 14px;
    border-radius: 999px;
    border: 2px solid rgba(255, 255, 255, 0.45);
    border-top-color: #fff;
    display: none;
    animation: spinLoader 0.7s linear infinite;
}

.connecta-cta.is-loading .connecta-btn-loader {
    display: inline-block;
}

.connecta-modal {
    border: 0;
    border-radius: 18px;
    padding: 0;
    width: min(760px, 92vw);
    box-shadow: 0 24px 46px rgba(15, 23, 42, 0.3);
}

.connecta-modal::backdrop {
    background: rgba(15, 23, 42, 0.5);
}

.connecta-modal-body {
    background: #ffffff;
    border: 1px solid #e5eaf0;
    border-radius: 18px;
    overflow: hidden;
}

.connecta-modal-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    border-bottom: 1px solid #e8edf3;
    background: #f8fafc;
}

.connecta-modal-head h3 {
    margin: 0;
    color: var(--connecta-deep);
    font-size: 1rem;
    font-weight: 900;
}

.connecta-close {
    border: 1px solid #d8e0ea;
    background: #fff;
    color: #1f2937;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 800;
    padding: 7px 10px;
    cursor: pointer;
}

.connecta-modal-content {
    padding: 14px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.job-detail-modal {
    width: min(940px, 94vw);
    border: 0;
    border-radius: 20px;
    box-shadow: 0 28px 52px rgba(6, 30, 27, 0.28);
}

.job-detail-modal::backdrop {
    background: rgba(6, 30, 27, 0.58);
    backdrop-filter: blur(2px);
}

.job-detail-modal .connecta-modal-body {
    max-width: 100%;
    border: 1px solid rgba(96, 16, 40, 0.16);
    background: #ffffff;
}

.job-detail-modal .connecta-modal-head {
    align-items: center;
    background: #a62346;
    border-bottom: 1px solid rgba(255, 255, 255, 0.24);
    color: #fff;
    padding: 14px 16px;
}

.job-detail-head-copy {
    display: grid;
    gap: 4px;
}

.job-detail-modal .connecta-modal-head h3 {
    margin: 0;
    color: #fff;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.job-detail-head-copy p {
    margin: 0;
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.89rem;
}

.job-detail-modal .connecta-close {
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    background: rgba(255, 255, 255, 0.18);
    color: #fff;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    transition:
        transform 0.24s ease,
        background-color 0.24s ease;
}

.job-detail-modal .connecta-close:hover {
    background: rgba(255, 255, 255, 0.28);
    transform: translateY(-1px);
}

.job-detail-modal-content {
    display: grid;
    gap: 12px;
    padding: 16px;
    background:
        radial-gradient(
            circle at top right,
            rgba(193, 150, 86, 0.16),
            transparent 42%
        ),
        linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
}

.job-detail-hero {
    display: grid;
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 14px;
    align-items: stretch;
    padding: 10px;
    border: 1px solid rgba(30, 92, 80, 0.16);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
}

.job-detail-image {
    width: 100%;
    height: 188px;
    object-fit: cover;
    border-radius: 14px;
    outline: 1px solid rgba(0, 0, 0, 0.08);
}

.job-detail-summary {
    display: grid;
    gap: 8px;
    align-content: start;
}

.job-detail-status-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.job-detail-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    border: 1px solid rgba(96, 16, 40, 0.2);
    background: rgba(96, 16, 40, 0.08);
    color: #601028;
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1;
    padding: 7px 12px;
}

.job-detail-pill.is-active {
    background: rgba(30, 92, 80, 0.14);
    border-color: rgba(30, 92, 80, 0.24);
    color: #0f5d49;
}

.job-detail-company {
    margin: 0;
    color: #4b5f61;
    font-weight: 600;
}

.job-detail-summary h4 {
    margin: 0;
    color: #163531;
    font-size: clamp(1.08rem, 2vw, 1.32rem);
}

.job-detail-description {
    margin: 0;
    color: #3f5456;
    line-height: 1.55;
}

.job-detail-sections {
    display: grid;
    gap: 12px;
}

.job-detail-section {
    display: grid;
    gap: 8px;
}

.job-detail-section-title {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #7e0f37;
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.job-detail-section-title i {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(166, 35, 70, 0.14);
    color: #8b0032;
    font-size: 0.74rem;
}

.job-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.job-detail-item {
    border: 1px solid rgba(96, 16, 40, 0.15);
    border-radius: 14px;
    padding: 11px 12px;
    display: grid;
    gap: 6px;
    background: linear-gradient(180deg, #fff 0%, #fbfcfd 100%);
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.05);
    transition:
        transform 0.24s ease,
        box-shadow 0.24s ease,
        border-color 0.24s ease;
}

.job-detail-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 18px rgba(15, 23, 42, 0.08);
    border-color: rgba(166, 35, 70, 0.34);
}

.job-detail-item-head {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.job-detail-item-head i {
    width: 24px;
    height: 24px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(166, 35, 70, 0.14);
    color: #8b0032;
    font-size: 0.82rem;
}

.job-detail-item span {
    color: #4f6163;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.job-detail-item strong {
    color: #133531;
    font-size: 0.96rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    word-break: break-word;
}

.job-detail-item-area {
    border-color: rgba(30, 92, 80, 0.28);
    background: linear-gradient(
        180deg,
        rgba(237, 249, 246, 0.95) 0%,
        #ffffff 100%
    );
}

.job-detail-item-area .job-detail-item-head i {
    background: rgba(30, 92, 80, 0.18);
    color: #0f5d49;
}

.job-detail-area-value {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    max-width: 100%;
    padding: 6px 12px;
    border-radius: 999px;
    border: 1px solid rgba(30, 92, 80, 0.32);
    background: rgba(30, 92, 80, 0.08);
    color: #0f5d49;
    font-size: 0.9rem;
    line-height: 1.35;
}

.job-detail-area-value::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #1e5c50;
    box-shadow: 0 0 0 4px rgba(30, 92, 80, 0.16);
    flex-shrink: 0;
}

.job-detail-rich {
    color: #133531;
    font-size: 0.95rem;
    font-weight: 700;
}

.job-detail-list {
    margin: 0;
    padding-left: 18px;
    display: grid;
    gap: 4px;
    color: #133531;
    font-size: 0.9rem;
    font-weight: 600;
}

.job-detail-list li {
    line-height: 1.35;
}

.job-location-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 4px;
    color: #1d4ed8;
    font-size: 0.84rem;
    font-weight: 700;
    text-decoration: none;
}

.job-location-link:hover {
    color: #1e40af;
    text-decoration: underline;
}

.job-location-link.is-hidden {
    display: none;
}

.job-location-link.is-disabled {
    color: #687282;
    pointer-events: none;
    text-decoration: none;
}

.connecta-modal-card {
    border: 1px solid rgba(30, 92, 80, 0.25);
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
}

.connecta-modal-card:hover {
    transform: translateY(-3px);
    border-color: rgba(166, 35, 70, 0.46);
    box-shadow: 0 10px 18px rgba(96, 16, 40, 0.14);
}

.connecta-modal-card img {
    width: 100%;
    height: 100px;
    object-fit: cover;
    display: block;
}

.connecta-modal-card p {
    margin: 0;
    padding: 8px;
    color: var(--connecta-ink);
    font-size: 0.78rem;
    font-weight: 700;
    line-height: 1.35;
}

@keyframes fadeSlideUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes kpiFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes spinLoader {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

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

    .connecta-kpis {
        grid-template-columns: 1fr;
    }

    .connecta-steps {
        grid-template-columns: 1fr;
    }

    .connecta-actions {
        grid-template-columns: 1fr;
    }

    .connecta-modal-content {
        grid-template-columns: 1fr;
    }
}

@keyframes connectaSlide {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

.different-wrap {
    max-width: 1240px;
    margin: 0 auto 90px;
    padding: 0 28px;
}

.different-shell {
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid rgba(139, 0, 50, 0.16);
    background: #fff;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12);
}

.different-head {
    padding: 16px 18px;
    background: #8b0032;
    color: #fff;
}

.different-head h2 {
    margin: 0;
    font-size: clamp(1.25rem, 2vw, 1.7rem);
    font-weight: 900;
}

.different-head p {
    margin: 6px 0 0;
    font-size: 0.9rem;
    line-height: 1.5;
    opacity: 0.96;
}

.different-grid {
    padding: 16px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.different-card {
    border: 1px solid #e6e9ef;
    border-radius: 14px;
    background: #ffffff;
    padding: 14px;
}

.different-card h3 {
    margin: 0;
    color: #8b0032;
    font-size: 1.02rem;
    font-weight: 900;
}

.different-card p {
    margin: 8px 0 0;
    color: #374151;
    font-size: 0.88rem;
    line-height: 1.5;
}

.different-card ul {
    margin: 8px 0 0;
    padding-left: 18px;
    color: #1f2937;
    font-size: 0.88rem;
    line-height: 1.58;
    display: grid;
    gap: 6px;
}

.different-card li::marker {
    color: #0f5d49;
}

.different-example {
    margin-top: 10px;
    border-radius: 10px;
    background: #edf7f3;
    border: 1px solid #cce9dd;
    color: #0f5d49;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 8px;
    line-height: 1.45;
}

.hub-wrap {
    max-width: 1240px;
    margin: 0 auto 100px;
    padding: 0 28px;
}

/*
.hub-vacantes-title-wrap {
    display: flex;
    justify-content: center;
    margin: 44px auto 22px;
}

.hub-vacantes-title {
    margin: 0 auto;
    color: #0d423c;
    background-image: linear-gradient(180deg, #1e5e51 0%, #0d423c 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    width: min(100%, 900px);
    height: auto;
    display: block;
    text-align: center;
    font-size: clamp(3rem, 8vw, 5.8rem);
    font-weight: 900;
    letter-spacing: 0.18em;
    line-height: 0.92;
    text-transform: uppercase;
    text-shadow: 0 8px 20px rgba(13, 66, 60, 0.22);
}
*/

.hub-vacantes-title-image-wrap {
    display: flex;
    justify-content: center;
    margin: 44px auto 22px;
}

.hub-vacantes-title-image {
    display: block;
    width: min(100%, 900px);
    height: auto;
}

.hub-search {
    background: #ffffff;
    border: 1px solid rgba(96, 16, 40, 0.22);
    border-radius: 20px;
    box-shadow: 0 14px 34px rgba(6, 30, 27, 0.12);
    padding: 18px;
}

.hub-title {
    margin: 0;
    color: var(--connecta-deep);
    font-size: clamp(1.3rem, 2.1vw, 1.9rem);
    font-weight: 900;
}

.hub-title i {
    color: var(--connecta-primary);
    margin-right: 8px;
}

@media (max-width: 640px) {
    /*
    .hub-vacantes-title {
        width: 100%;
        height: auto;
    }
    */

    .hub-vacantes-title-image {
        width: 100%;
        max-width: 620px;
        height: auto;
    }

    .highlights-heading {
        width: 100%;
        height: auto;
    }

    /*
    .hub-vacantes-title {
        font-size: clamp(2rem, 13vw, 3.4rem);
        letter-spacing: 0.09em;
    }
    */

    .highlights-heading {
        font-size: clamp(2rem, 13vw, 3.4rem);
        letter-spacing: 0.09em;
    }
}

.hub-subtitle {
    margin: 8px 0 14px;
    color: var(--connecta-ink);
    font-size: 0.94rem;
    line-height: 1.5;
}

.search-grid {
    display: grid;
    grid-template-columns: 1.3fr 1fr 1fr auto;
    gap: 10px;
}

.search-field {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(96, 16, 40, 0.2);
    border-radius: 12px;
    padding: 0 10px;
    background: #fff;
}

.search-field i {
    color: var(--connecta-secondary);
    font-size: 0.95rem;
}

.search-grid input,
.search-grid select {
    width: 100%;
    border: 0;
    border-radius: 10px;
    padding: 11px 0;
    font-size: 0.9rem;
    color: var(--connecta-ink);
    background: transparent;
    outline: none;
}

.search-clear {
    border: 1px solid var(--connecta-primary);
    border-radius: 12px;
    padding: 11px 14px;
    font-size: 0.85rem;
    font-weight: 700;
    color: #fff;
    background: var(--connecta-primary);
    cursor: pointer;
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease;
}

.search-clear:hover {
    transform: translateY(-2px);
    box-shadow: 0 9px 16px rgba(96, 16, 40, 0.24);
}

.search-meta {
    margin: 12px 0 0;
    color: var(--connecta-deep);
    font-size: 0.84rem;
    font-weight: 700;
}

.vacantes-view-more {
    margin-top: 16px;
    display: flex;
    justify-content: center;
}

.vacantes-view-more .btn-highlight {
    min-width: 220px;
    justify-content: center;
    box-shadow: 0 10px 18px rgba(96, 16, 40, 0.2);
}

.vacantes-view-more .btn-highlight:hover {
    transform: translateY(-2px);
}

.hub-jobs {
    margin-top: 14px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.hub-jobs-empty {
    grid-column: 1 / -1;
    padding: 4px 2px 2px;
}

.hub-jobs-empty-title {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--connecta-deep);
    font-size: 1.02rem;
    font-weight: 800;
}

.hub-jobs-empty-title i {
    color: var(--connecta-primary);
}

.hub-jobs-empty-copy {
    margin: 6px 0 0;
    color: var(--connecta-secondary);
    font-size: 0.92rem;
    font-weight: 700;
}

.job-sample {
    background: #ffffff;
    border: 1px solid rgba(96, 16, 40, 0.2);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 10px 24px rgba(6, 30, 27, 0.1);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease,
        opacity 0.2s ease;
}

.job-sample:hover {
    transform: translateY(-4px);
    border-color: rgba(166, 35, 70, 0.5);
    box-shadow: 0 16px 30px rgba(96, 16, 40, 0.16);
}

.job-sample.filter-enter {
    animation: hubCardReveal 0.32s ease;
}

.job-sample.is-filter-hidden {
    opacity: 0;
    transform: translateY(8px) scale(0.98);
    pointer-events: none;
}

.job-cover {
    width: 100%;
    height: 140px;
    object-fit: cover;
    display: block;
    border-bottom: 1px solid rgba(96, 16, 40, 0.12);
}

.job-content {
    padding: 12px;
}

.job-sample h4 {
    margin: 0;
    color: var(--connecta-deep);
    font-size: 1.02rem;
    font-weight: 800;
}

.job-company {
    margin: 6px 0 10px;
    color: var(--connecta-secondary);
    font-size: 0.9rem;
    font-weight: 700;
}

.job-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.job-tag {
    border-radius: 999px;
    border: 1px solid rgba(193, 150, 86, 0.35);
    background: rgba(193, 150, 86, 0.12);
    color: var(--connecta-ink);
    font-size: 0.76rem;
    font-weight: 700;
    padding: 5px 9px;
}

.job-tag i {
    color: var(--connecta-primary);
    margin-right: 4px;
}

.job-detail-btn {
    margin-top: 12px;
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid var(--connecta-secondary);
    border-radius: 10px;
    background: var(--connecta-secondary);
    color: #fff;
    font-size: 0.9rem;
    font-weight: 700;
    padding: 8px 14px;
    cursor: pointer;
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        background 0.18s ease;
}

.job-detail-btn:hover {
    transform: translateY(-2px);
    background: var(--connecta-deep);
    box-shadow: 0 8px 14px rgba(6, 30, 27, 0.24);
}

@keyframes hubCardReveal {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.99);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.hub-two {
    margin-top: 16px;
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: 14px;
}

.hub-docs-only {
    margin-top: 0;
}

.docs-card-expanded {
    border-color: #cfdceb;
}

.docs-card-expanded .docs-head {
    align-items: flex-start;
}

.docs-card,
.news-card {
    background: #ffffff;
    border: 1px solid #dce4ef;
    border-radius: 18px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
    padding: 16px;
}

.docs-card h3,
.news-card h3,
.faq-wrap h3,
.map-wrap h3 {
    margin: 0 0 10px;
    color: #8b0032;
    font-size: 1.08rem;
    font-weight: 900;
}

.docs-head h3 i,
.map-wrap h3 i,
.faq-wrap h3 i {
    margin-right: 6px;
    color: #0f5d49;
}

.docs-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.docs-head-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(139, 0, 50, 0.12);
    color: #8b0032;
    font-size: 0.72rem;
    font-weight: 800;
    border-radius: 999px;
    padding: 6px 10px;
}

.docs-cta {
    margin-bottom: 12px;
    border: 1px solid rgba(139, 0, 50, 0.18);
    border-radius: 14px;
    background: linear-gradient(
        140deg,
        rgba(139, 0, 50, 0.06) 0%,
        rgba(15, 93, 73, 0.12) 100%
    );
    padding: 12px;
}

.docs-cta p {
    margin: 0 0 10px;
    color: #334155;
    font-size: 0.8rem;
    line-height: 1.45;
}

.docs-intro {
    margin: 0 0 10px;
    color: #475569;
    font-size: 0.78rem;
    line-height: 1.5;
}

.docs-register-btn {
    border: 0;
    border-radius: 10px;
    background: #8b0032;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 800;
    padding: 8px 12px;
    cursor: pointer;
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        filter 0.18s ease;
}

.docs-register-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 18px rgba(139, 0, 50, 0.3);
    filter: saturate(1.08);
}

.docs-ranking {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 10px;
}

.docs-rank-label {
    color: #8b0032;
    font-size: 0.74rem;
    font-weight: 800;
}

.docs-rank-pill {
    border-radius: 999px;
    border: 1px solid #f0d9c9;
    background: #fff7ef;
    color: #854d0e;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 4px 8px;
}

.doc-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid #e4e9f0;
    border-radius: 12px;
    padding: 9px;
    margin-bottom: 9px;
    background: #f9fbff;
    opacity: 1;
    transform: translateY(0);
    transition:
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        opacity 0.3s ease,
        transform 0.3s ease;
}

.doc-item.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.doc-item:hover {
    border-color: rgba(15, 93, 73, 0.3);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.1);
}

.doc-main {
    flex: 1;
    min-width: 0;
}

.doc-name {
    margin: 0;
    color: #1f2937;
    font-size: 0.84rem;
    font-weight: 700;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.doc-meta-row {
    margin-top: 7px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.doc-facts {
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.doc-facts span {
    border-radius: 999px;
    border: 1px solid #dbe7f3;
    background: #ffffff;
    color: #475569;
    font-size: 0.66rem;
    font-weight: 700;
    padding: 4px 8px;
}

.doc-badge {
    border-radius: 999px;
    padding: 4px 8px;
    font-size: 0.66rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.doc-badge.is-exclusive {
    background: rgba(139, 0, 50, 0.12);
    color: #8b0032;
}

.doc-badge.is-new {
    background: rgba(37, 99, 235, 0.12);
    color: #1e40af;
}

.doc-badge.is-recommended {
    background: rgba(245, 158, 11, 0.15);
    color: #92400e;
}

.doc-badge.is-register {
    background: rgba(15, 93, 73, 0.14);
    color: #0f5d49;
}

.doc-badge.is-featured {
    background: rgba(245, 158, 11, 0.18);
    color: #92400e;
    border: 1px solid rgba(217, 119, 6, 0.24);
}

.doc-badge.is-featured i {
    margin-right: 4px;
    color: #d97706;
}

.doc-count {
    color: #475569;
    font-size: 0.7rem;
    font-weight: 700;
}

.doc-preview {
    margin-top: 0;
    border: 1px dashed transparent;
    border-radius: 10px;
    background: #f3fbf8;
    padding: 0 8px;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition:
        max-height 0.24s ease,
        opacity 0.22s ease,
        margin-top 0.2s ease,
        padding 0.2s ease,
        border-color 0.2s ease;
}

.doc-preview p {
    margin: 0;
    color: #33535a;
    font-size: 0.72rem;
    line-height: 1.45;
}

.doc-item:hover .doc-preview,
.doc-item.show-preview .doc-preview {
    max-height: 180px;
    opacity: 1;
    margin-top: 8px;
    padding: 8px;
    border-color: rgba(15, 93, 73, 0.35);
}

.doc-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 128px;
}

.doc-preview-toggle {
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #ffffff;
    color: #334155;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 7px 9px;
    cursor: pointer;
    transition:
        transform 0.18s ease,
        border-color 0.18s ease;
}

.doc-preview-toggle:hover {
    transform: translateY(-1px);
    border-color: rgba(15, 93, 73, 0.45);
}

.doc-preview-toggle.is-open {
    border-color: rgba(15, 93, 73, 0.55);
    background: #eefbf6;
    color: #0f5d49;
}

.doc-name i,
.doc-download i,
.highlight-pill i,
.btn-highlight i,
.about-box h3 i,
.department-item i {
    margin-right: 6px;
}

.doc-download {
    position: relative;
    text-decoration: none;
    border: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    text-decoration: none;
    background: #0f5d49;
    color: #fff;
    border-radius: 10px;
    padding: 7px 10px;
    font-size: 0.76rem;
    font-weight: 700;
    white-space: nowrap;
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        filter 0.18s ease;
}

.doc-download:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 18px rgba(15, 93, 73, 0.28);
}

.doc-download.is-locked {
    background: #8b0032;
}

.doc-download.is-locked:hover {
    box-shadow: 0 10px 18px rgba(139, 0, 50, 0.28);
}

.doc-download.is-loading {
    opacity: 0.75;
    pointer-events: none;
}

.doc-download::after {
    content: attr(data-tooltip);
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    transform: translateX(-50%) translateY(4px);
    background: #0b1322;
    color: #ffffff;
    font-size: 0.66rem;
    font-weight: 600;
    border-radius: 8px;
    padding: 6px 8px;
    width: max-content;
    max-width: 210px;
    text-align: center;
    pointer-events: none;
    opacity: 0;
    transition:
        opacity 0.18s ease,
        transform 0.18s ease;
    z-index: 6;
}

.doc-download:hover::after {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.docs-register-content {
    display: block;
}

.docs-register-card {
    width: 100%;
}

.docs-register-actions {
    margin-top: 10px;
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.docs-register-link {
    text-decoration: none;
    border-radius: 10px;
    border: 1px solid #c7d2e1;
    background: #ffffff;
    color: #1f2937;
    font-size: 0.78rem;
    font-weight: 800;
    padding: 8px 12px;
}

.docs-register-link.primary {
    border-color: transparent;
    background: #8b0032;
    color: #ffffff;
}

.news-list {
    display: grid;
    gap: 9px;
}

.news-wrap {
    margin-top: 18px;
    margin-bottom: 30px;
}

.news-title-wrap {
    display: flex;
    justify-content: center;
    margin: 44px auto 22px;
}

.news-card-standalone {
    max-width: 1200px;
    margin: 0 auto;
}

.news-card-enhanced {
    padding: 0;
    overflow: hidden;
}

.news-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.news-card-enhanced .news-head {
    position: relative;
    z-index: 2;
    padding: 20px 22px 0;
}

.news-card-enhanced .news-head h3 {
    color: #ffffff;
    margin: 0;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(2, 6, 23, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.24);
    text-shadow: 0 2px 12px rgba(15, 23, 42, 0.45);
}

.news-card-enhanced .news-head h3 i {
    margin-right: 8px;
    color: #f6d49a;
}

.news-title-image {
    display: block;
    width: min(100%, 1120px);
    margin: 0 auto;
    height: auto;
}

.news-card-enhanced .news-head .docs-head-badge {
    color: #fff7ed;
    background: rgba(127, 29, 29, 0.5);
    border-color: rgba(254, 215, 170, 0.56);
}

.news-hero {
    position: relative;
    display: flow-root;
    background-size: cover;
    background-position: center;
    min-height: 340px;
    border-radius: 18px 18px 0 0;
}

.news-hero.news-hero-standalone {
    border-radius: 18px;
}

.news-hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(17, 24, 39, 0.22) 0%,
        rgba(17, 24, 39, 0.68) 100%
    );
}

.news-featured {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: 1.05fr 1.15fr;
    gap: 0;
    margin: 14px 22px 22px;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.26);
    box-shadow: 0 16px 34px rgba(0, 0, 0, 0.2);
    background: rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(2px);
}

.news-featured.has-slider {
    padding-inline: 34px;
    background: transparent;
    border-color: transparent;
    box-shadow: none;
    backdrop-filter: none;
}

.news-featured-image,
.news-featured [data-featured-news="badge-label"],
.news-featured [data-featured-news="title"],
.news-featured [data-featured-news="description"],
.news-featured [data-featured-news="source"],
.news-featured [data-featured-news="date"] {
    transition:
        opacity 0.33s ease,
        transform 0.33s ease;
}

.news-featured.is-transitioning-forward .news-featured-image,
.news-featured.is-transitioning-forward [data-featured-news="badge-label"],
.news-featured.is-transitioning-forward [data-featured-news="title"],
.news-featured.is-transitioning-forward [data-featured-news="description"],
.news-featured.is-transitioning-forward [data-featured-news="source"],
.news-featured.is-transitioning-forward [data-featured-news="date"] {
    opacity: 0.04;
    transform: translateX(18px);
}

.news-featured.is-transitioning-backward .news-featured-image,
.news-featured.is-transitioning-backward [data-featured-news="badge-label"],
.news-featured.is-transitioning-backward [data-featured-news="title"],
.news-featured.is-transitioning-backward [data-featured-news="description"],
.news-featured.is-transitioning-backward [data-featured-news="source"],
.news-featured.is-transitioning-backward [data-featured-news="date"] {
    opacity: 0.04;
    transform: translateX(-18px);
}

.news-featured-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.55);
    background: rgba(15, 23, 42, 0.45);
    color: #f8fafc;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 4;
    transition:
        transform 0.2s ease,
        background 0.2s ease,
        border-color 0.2s ease;
}

.news-featured-nav:hover {
    background: rgba(139, 0, 50, 0.65);
    border-color: rgba(253, 230, 138, 0.75);
    transform: translateY(-50%) scale(1.05);
}

.news-featured-nav:focus-visible {
    outline: 2px solid rgba(253, 230, 138, 0.9);
    outline-offset: 2px;
}

.news-featured-nav.prev {
    left: 10px;
}

.news-featured-nav.next {
    right: 10px;
}

.news-featured-image {
    width: 100%;
    height: 100%;
    min-height: 230px;
    object-fit: cover;
}

.news-featured-content {
    padding: 16px 16px 14px;
    color: #ffffff;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.news-featured-content .news-badge {
    align-self: flex-start;
    width: auto;
    max-width: max-content;
}

.news-featured.is-text-only {
    grid-template-columns: 1fr;
}

.news-featured.is-text-only .news-featured-content {
    padding: 20px 22px;
}

.news-featured-content h4 {
    margin: 10px 0 10px;
    font-size: clamp(1.1rem, 2.1vw, 1.35rem);
    font-weight: 800;
    line-height: 1.25;
}

.news-featured-content p {
    margin: 0;
    line-height: 1.62;
    font-size: 0.92rem;
    color: rgba(248, 250, 252, 0.97);
}

.news-featured-description {
    margin: 0;
    line-height: 1.62;
    font-size: 0.92rem;
    color: rgba(248, 250, 252, 0.97);
    white-space: pre-line;
    overflow-wrap: anywhere;
}

.news-featured.has-slider .news-featured-description {
    max-height: none;
    overflow: visible;
    padding-right: 0;
}

.news-featured-bottom {
    margin-top: auto;
    padding-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.news-featured-link-wrap.is-hidden {
    display: none;
}

.news-featured-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 0.83rem;
    font-weight: 800;
    color: #fef3c7;
    text-decoration: none;
    border-radius: 999px;
    border: 1px solid rgba(253, 230, 138, 0.5);
    background: rgba(127, 29, 29, 0.32);
    padding: 6px 12px;
    width: fit-content;
    transition:
        transform 0.2s ease,
        background 0.2s ease,
        border-color 0.2s ease;
}

.news-featured-link:hover,
.news-featured-link:focus {
    color: #fff7ed;
    background: rgba(139, 0, 50, 0.58);
    border-color: rgba(253, 230, 138, 0.78);
    transform: translateY(-1px);
}

.news-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 0.73rem;
    font-weight: 800;
    border: 1px solid transparent;
}

.news-badge-danger {
    background: rgba(239, 68, 68, 0.2);
    border-color: rgba(239, 68, 68, 0.44);
    color: #fee2e2;
}

.news-badge-info {
    background: rgba(59, 130, 246, 0.15);
    border-color: rgba(59, 130, 246, 0.4);
    color: #dbeafe;
}

.news-badge-warning {
    background: rgba(251, 191, 36, 0.2);
    border-color: rgba(245, 158, 11, 0.4);
    color: #78350f;
}

.news-badge-success {
    background: rgba(16, 185, 129, 0.18);
    border-color: rgba(16, 185, 129, 0.42);
    color: #064e3b;
}

.news-featured .news-badge {
    background: var(--news-badge-area-color, #a62346);
    border-color: var(--news-badge-area-color, #a62346);
    color: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}

.news-gallery {
    margin-top: 11px;
    display: flex;
    gap: 8px;
    align-items: center;
}

.news-featured-footer {
    margin-top: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.news-featured-counter {
    font-size: 0.74rem;
    font-weight: 800;
    color: #f8fafc;
    letter-spacing: 0.01em;
    white-space: nowrap;
}

.news-featured-footer .news-gallery {
    margin-top: 0;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.news-gallery-item {
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 999px;
    background: transparent;
    line-height: 0;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 16px;
    height: 16px;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.news-gallery-item:hover {
    transform: scale(1.1);
}

.news-gallery-item:focus-visible {
    outline: 2px solid #fde68a;
    outline-offset: 2px;
}

.news-gallery-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: rgba(248, 250, 252, 0.42);
    border: 1px solid rgba(248, 250, 252, 0.68);
    transition:
        transform 0.22s ease,
        background 0.22s ease,
        border-color 0.22s ease,
        box-shadow 0.22s ease;
}

.news-gallery-item:hover .news-gallery-dot {
    background: rgba(253, 230, 138, 0.72);
    border-color: rgba(254, 243, 199, 0.95);
}

.news-gallery-item.is-active .news-gallery-dot {
    transform: scale(1.25);
    background: #fde68a;
    border-color: #fef3c7;
    box-shadow: 0 0 0 3px rgba(253, 230, 138, 0.25);
}

.news-carousel-wrap {
    position: relative;
    padding: 18px 50px 26px;
}

.news-card-enhanced .docs-intro {
    margin: 14px 22px 0;
    padding: 12px 14px;
    border-radius: 12px;
    background: linear-gradient(135deg, #fff8fb 0%, #fff2f7 100%);
    border: 1px solid #f2c8d7;
    color: #4b1026;
    font-size: 0.9rem;
    line-height: 1.6;
    font-weight: 600;
}

.news-carousel {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
    scrollbar-color: rgba(139, 0, 50, 0.45) transparent;
    scroll-behavior: smooth;
}

.news-carousel::-webkit-scrollbar {
    height: 8px;
}

.news-carousel::-webkit-scrollbar-thumb {
    background: rgba(139, 0, 50, 0.4);
    border-radius: 999px;
}

.news-carousel-item {
    min-width: min(360px, 100%);
    max-width: 380px;
    scroll-snap-align: start;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #d6deea;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    box-shadow: 0 12px 30px rgba(2, 6, 23, 0.14);
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}

.news-carousel-item:hover {
    transform: translateY(-4px);
    border-color: rgba(139, 0, 50, 0.35);
    box-shadow: 0 16px 28px rgba(96, 16, 40, 0.2);
}

.news-item-banner {
    position: relative;
    background-size: cover;
    background-position: center;
    min-height: 108px;
}

.news-item-banner::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.12) 0%,
        rgba(2, 6, 23, 0.18) 100%
    );
}

.news-item-banner .news-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
}

.news-item-content {
    display: flex;
    gap: 11px;
    align-items: flex-start;
    padding: 14px;
}

.news-mini-icon {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(139, 0, 50, 0.08);
    color: #8b0032;
    flex-shrink: 0;
    margin-top: 2px;
}

.news-item h4 {
    margin: 0;
    color: #0f172a;
    font-size: 1.04rem;
    font-weight: 800;
    line-height: 1.28;
}

.news-item p {
    margin: 10px 0 0;
    color: #475569;
    font-size: 0.9rem;
    line-height: 1.6;
}

.news-meta {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    font-size: 0.76rem;
    color: #e2e8f0;
    line-height: 1.5;
}

.news-item .news-meta {
    color: #475569;
}

.news-meta img {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    object-fit: cover;
    border: 1px solid rgba(148, 163, 184, 0.4);
    background: #ffffff;
}

.news-carousel-btn {
    position: absolute;
    top: calc(50% + 8px);
    transform: translateY(-50%);
    width: 36px;
    height: 36px;
    border-radius: 999px;
    border: 1px solid rgba(139, 0, 50, 0.3);
    background: #ffffff;
    color: #8b0032;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 3;
    box-shadow: 0 8px 14px rgba(15, 23, 42, 0.15);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease;
}

.news-carousel-btn:hover {
    transform: translateY(-50%) scale(1.05);
    background: #fff5fa;
    box-shadow: 0 12px 18px rgba(96, 16, 40, 0.24);
}

.news-carousel-btn.prev {
    left: 8px;
}

.news-carousel-btn.next {
    right: 8px;
}

.news-theme-empleo {
    background: linear-gradient(145deg, #f4fff8 0%, #e9f9f1 100%);
}

.news-theme-evento {
    background: linear-gradient(145deg, #fff8f1 0%, #ffeed7 100%);
}

.news-theme-finanzas {
    background: linear-gradient(145deg, #f4f8ff 0%, #e8effb 100%);
}

.news-item {
    border: 1px solid #e4e9f0;
    border-radius: 12px;
    padding: 10px;
    background: #ffffff;
}

.news-item h4 {
    margin: 0;
    color: #1f2937;
    font-size: 0.9rem;
    font-weight: 800;
}

.news-item p {
    margin: 5px 0 0;
    color: #475569;
    font-size: 0.8rem;
    line-height: 1.45;
}

.hub-bottom {
    margin-top: 14px;
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 14px;
}

.hub-bottom.hub-bottom-map-only {
    grid-template-columns: 1fr;
}

.faq-fab {
    position: fixed;
    right: 16px;
    bottom: 20px;
    z-index: 1040;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid rgba(139, 0, 50, 0.35);
    background: #8b0032;
    color: #ffffff;
    border-radius: 999px;
    padding: 10px 14px;
    font-size: 0.86rem;
    font-weight: 800;
    cursor: pointer;
    box-shadow: 0 12px 24px rgba(96, 16, 40, 0.3);
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        filter 0.2s ease;
}

.faq-fab[hidden],
.faq-floating-modal[hidden] {
    display: none !important;
}

.faq-fab i {
    font-size: 1rem;
}

.faq-fab:hover,
.faq-fab:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 16px 26px rgba(96, 16, 40, 0.38);
    filter: brightness(1.04);
}

.faq-fab:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.9);
    outline-offset: 2px;
}

.faq-floating-modal {
    border: 0;
    width: min(840px, 94vw);
}

.faq-floating-modal::backdrop {
    background: rgba(15, 23, 42, 0.56);
    backdrop-filter: blur(2px);
}

.faq-floating-modal .faq-list {
    max-height: min(52vh, 430px);
    overflow: auto;
    padding: 14px 16px 4px;
    display: grid;
    gap: 12px;
    scroll-padding-top: 10px;
}

.faq-floating-body {
    max-width: min(920px, 94vw);
    border: 1px solid rgba(139, 0, 50, 0.16);
    background: #ffffff;
    transform: translateY(18px) scale(0.985);
    opacity: 0;
    transition:
        transform 0.28s cubic-bezier(0.2, 0, 0, 1),
        opacity 0.28s ease;
}

.faq-floating-modal[open] .faq-floating-body {
    transform: translateY(0) scale(1);
    opacity: 1;
}

.faq-floating-head {
    align-items: flex-start;
    padding: 16px 18px;
    border-bottom: 1px solid rgba(139, 0, 50, 0.12);
    background: #f4f5f9;
}

.faq-floating-head-copy {
    display: grid;
    gap: 4px;
}

.faq-floating-head h3 {
    margin: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #5a0f26;
    font-size: 1.06rem;
    text-wrap: balance;
}

.faq-floating-head-copy p {
    margin: 0;
    color: #36545f;
    font-size: 0.84rem;
    font-weight: 600;
}

.faq-close-btn {
    border-radius: 999px;
    border: 1px solid rgba(139, 0, 50, 0.2);
    background: #ffffff;
    color: #5a0f26;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 40px;
    padding: 8px 14px;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        border-color 0.2s ease;
}

.faq-close-btn:hover,
.faq-close-btn:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(139, 0, 50, 0.38);
    box-shadow: 0 10px 18px rgba(90, 15, 38, 0.14);
}

.faq-close-btn i {
    font-size: 0.82rem;
}

.faq-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 12px 16px;
    border-bottom: 1px solid #e8edf4;
    background: #ffffff;
}

.faq-search {
    flex: 1 1 340px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #ccd7e5;
    border-radius: 999px;
    background: #ffffff;
    padding: 0 12px;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.faq-search i {
    color: #5f6f86;
    font-size: 0.85rem;
}

.faq-search input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: #1f2937;
    font-size: 0.86rem;
    font-weight: 600;
}

.faq-search input::placeholder {
    color: #6b7a90;
    font-weight: 500;
}

.faq-search:focus-within {
    border-color: rgba(29, 78, 216, 0.5);
    box-shadow:
        0 0 0 3px rgba(29, 78, 216, 0.14),
        inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.faq-count {
    margin: 0;
    border: 1px solid rgba(15, 93, 73, 0.24);
    background: rgba(15, 93, 73, 0.08);
    color: #0f5d49;
    border-radius: 999px;
    font-size: 0.73rem;
    font-weight: 800;
    padding: 8px 12px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.faq-empty {
    margin: 10px 16px 4px;
    border: 1px dashed rgba(30, 92, 80, 0.35);
    border-radius: 16px;
    background: #f3f8f6;
    padding: 18px 16px;
    display: grid;
    gap: 8px;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
}

.faq-empty[hidden] {
    display: none !important;
}

.faq-empty i {
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 93, 73, 0.14);
    color: #0f5d49;
    font-size: 1rem;
}

.faq-empty h4 {
    margin: 0;
    color: #133531;
    font-size: 1rem;
    font-weight: 900;
}

.faq-empty p {
    margin: 0;
    color: #476066;
    font-size: 0.84rem;
    line-height: 1.5;
}

.faq-empty-link,
.faq-cta-link {
    width: fit-content;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    border-radius: 999px;
    min-height: 40px;
    padding: 8px 14px;
    font-size: 0.79rem;
    font-weight: 800;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        filter 0.2s ease;
}

.faq-empty-link {
    border: 1px solid rgba(15, 93, 73, 0.3);
    background: #ffffff;
    color: #0f5d49;
}

.faq-cta {
    margin: 10px 16px 16px;
    border: 1px solid rgba(139, 0, 50, 0.18);
    border-radius: 12px;
    background: #f7f1f3;
    padding: 10px 12px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.faq-cta[hidden] {
    display: none !important;
}

.faq-cta p {
    margin: 0;
    color: #5a0f26;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.4;
}

.faq-cta-actions {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.faq-cta-link {
    gap: 6px;
    border: 1px solid rgba(139, 0, 50, 0.28);
    background: #ffffff;
    color: #8b0032;
}

button.faq-cta-link {
    appearance: none;
    font-family: inherit;
    cursor: pointer;
}

button.faq-cta-link:disabled {
    opacity: 0.62;
    cursor: not-allowed;
}

.faq-cta-link-comment {
    border-color: rgba(15, 93, 73, 0.32);
    color: #0f5d49;
}

.faq-comment-inline {
    width: 100%;
    border-top: 1px dashed rgba(90, 15, 38, 0.24);
    padding-top: 10px;
    display: grid;
    gap: 8px;
}

.faq-comment-inline[hidden] {
    display: none !important;
}

.faq-comment-inline-label {
    font-size: 0.79rem;
    font-weight: 700;
    color: #5a0f26;
}

.faq-comment-inline-input {
    width: 100%;
    border: 1px solid #ccd7e5;
    border-radius: 10px;
    min-height: 94px;
    resize: vertical;
    padding: 10px 12px;
    font-size: 0.86rem;
    color: #1f2937;
    background: #ffffff;
    outline: none;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.faq-comment-inline-input:focus {
    border-color: rgba(15, 93, 73, 0.5);
    box-shadow: 0 0 0 3px rgba(15, 93, 73, 0.12);
}

.faq-comment-inline-actions {
    display: flex;
    justify-content: flex-end;
}

.faq-comment-inline-feedback {
    margin: 0;
    min-height: 1em;
    font-size: 0.76rem;
    font-weight: 700;
    color: #5a0f26;
}

.faq-comment-inline-feedback.is-error {
    color: #ab1f2d;
}

.faq-comment-inline-feedback.is-success {
    color: #0f5d49;
}

.faq-empty-link:hover,
.faq-empty-link:focus-visible,
.faq-cta-link:hover,
.faq-cta-link:focus-visible {
    transform: translateY(-1px);
    box-shadow: 0 8px 16px rgba(15, 23, 42, 0.12);
    filter: brightness(1.02);
}

.map-wrap,
.faq-wrap {
    background: #ffffff;
    border: 1px solid #dce4ef;
    border-radius: 18px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
    padding: 16px;
}

.map-intro {
    margin: 0 0 10px;
    color: #475569;
    font-size: 0.8rem;
    line-height: 1.4;
}

.map-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 10px;
}

.legend-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    border: 1px solid #d8e2f0;
    background: #f8fbff;
    color: #334155;
    font-size: 0.72rem;
    font-weight: 800;
    padding: 6px 10px;
}

.legend-item i {
    font-size: 0.78rem;
}

.legend-item.is-admin i {
    color: #1d4ed8;
}

.legend-item.is-tech i {
    color: #0f766e;
}

.legend-item.is-oper i {
    color: #dc2626;
}

.legend-item.is-serv i {
    color: #7c3aed;
}

.map-demo {
    position: relative;
    border-radius: 14px;
    height: 280px;
    border: 1px solid #dce5ef;
    overflow: hidden;
    background: #eef4fb;
}

.map-demo::before {
    content: none;
}

.map-demo .leaflet-control-attribution {
    display: none !important;
}

.map-demo .leaflet-top,
.map-demo .leaflet-bottom {
    z-index: 900;
}

.map-filter-field {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 42px;
    border-radius: 12px;
    border: 1px solid #d7e2ef;
    background: #ffffff;
    padding: 8px 10px;
}

.map-filter-field i {
    color: #0f5d49;
    font-size: 0.9rem;
}

.map-filter-field select {
    border: 0;
    background: transparent;
    font-size: 0.78rem;
    font-weight: 700;
    color: #0f172a;
    outline: none;
}

.leaflet-job-pin,
.leaflet-event-pin {
    position: relative;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    border: 2px solid #ffffff;
    box-shadow: 0 7px 16px rgba(15, 23, 42, 0.32);
    transform: translateZ(0);
}

.leaflet-job-pin i,
.leaflet-event-pin i {
    font-size: 0.75rem;
}

.leaflet-job-pin.admin {
    background: #1d4ed8;
}

.leaflet-job-pin.tech {
    background: #0f766e;
}

.leaflet-job-pin.oper {
    background: #dc2626;
}

.leaflet-job-pin.serv {
    background: #7c3aed;
}

.leaflet-event-pin {
    background: #dc2626;
}

.leaflet-event-pin.is-highlighted {
    transform: scale(1.16);
    box-shadow:
        0 0 0 4px rgba(255, 255, 255, 0.82),
        0 11px 22px rgba(15, 23, 42, 0.42);
}

.leaflet-job-pin-count {
    position: absolute;
    top: -7px;
    right: -7px;
    min-width: 16px;
    height: 16px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    background: #ffffff;
    color: #0f172a;
    border: 1px solid rgba(15, 23, 42, 0.22);
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.22);
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1;
}

.map-demo .leaflet-popup-content-wrapper {
    border-radius: 14px;
    border: 1px solid #dce5ef;
    box-shadow: 0 18px 30px rgba(15, 23, 42, 0.16);
}

.map-demo .leaflet-popup-content {
    margin: 0;
    min-width: 240px;
}

.map-demo .leaflet-popup-tip {
    background: #ffffff;
}

.leaflet-vacancy-popup {
    padding: 10px 12px 12px;
}

.leaflet-vacancy-popup-head {
    margin: 0 0 10px;
    color: #0f5d49;
    font-size: 0.77rem;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.leaflet-vacancy-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: 192px;
    overflow-y: auto;
}

.leaflet-vacancy-item {
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.leaflet-vacancy-title {
    color: #601028;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.25;
}

.leaflet-vacancy-company {
    color: #0f172a;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.3;
}

.leaflet-vacancy-category {
    width: fit-content;
    border-radius: 999px;
    border: 1px solid rgba(15, 93, 73, 0.26);
    background: rgba(15, 93, 73, 0.1);
    color: #0f5d49;
    font-size: 0.66rem;
    font-weight: 800;
    line-height: 1;
    padding: 4px 8px;
}

.leaflet-event-popup {
    --event-popup-accent: #8b0032;
    padding: 10px 12px 12px;
}

.leaflet-event-popup-head {
    margin: 0 0 8px;
}

.leaflet-event-popup-head strong {
    color: color-mix(in srgb, var(--event-popup-accent) 86%, #0f172a);
    font-size: 0.8rem;
    font-weight: 900;
    line-height: 1.25;
}

.leaflet-event-popup-meta {
    margin: 0 0 6px;
    color: #334155;
    font-size: 0.73rem;
    font-weight: 700;
    line-height: 1.3;
}

.leaflet-event-popup-meta i {
    color: var(--event-popup-accent);
    margin-right: 4px;
}

.leaflet-event-popup-actions {
    margin-top: 10px;
}

.leaflet-event-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-decoration: none;
    border: 1px solid color-mix(in srgb, var(--event-popup-accent) 24%, #ffffff);
    border-radius: 8px;
    background: color-mix(in srgb, var(--event-popup-accent) 10%, #ffffff);
    color: color-mix(in srgb, var(--event-popup-accent) 84%, #0f172a);
    font-size: 0.72rem;
    font-weight: 800;
    padding: 6px 9px;
}

.leaflet-event-link.is-disabled {
    opacity: 0.65;
    pointer-events: none;
}

.heat-zone {
    position: absolute;
    border-radius: 999px;
    transform: translate(-50%, -50%);
    pointer-events: none;
    mix-blend-mode: multiply;
    animation: heatPulse 3s ease-in-out infinite;
}

.heat-zone.level-high {
    width: 130px;
    height: 130px;
    background: radial-gradient(
        circle,
        rgba(220, 38, 38, 0.4) 0%,
        rgba(220, 38, 38, 0) 70%
    );
}

.heat-zone.level-mid {
    width: 100px;
    height: 100px;
    background: radial-gradient(
        circle,
        rgba(245, 158, 11, 0.32) 0%,
        rgba(245, 158, 11, 0) 70%
    );
    animation-delay: 0.6s;
}

.heat-zone.level-low {
    width: 84px;
    height: 84px;
    background: radial-gradient(
        circle,
        rgba(14, 165, 233, 0.3) 0%,
        rgba(14, 165, 233, 0) 70%
    );
    animation-delay: 1.2s;
}

.pin {
    position: absolute;
    width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transform: translate(-50%, -50%);
    border-radius: 999px;
    border: 0;
    cursor: pointer;
    background: #e11d48;
    border: 2px solid #fff;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.28);
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        filter 0.18s ease;
    animation: pinDrop 0.45s ease backwards;
}

.pin:nth-of-type(4) {
    animation-delay: 0.05s;
}

.pin:nth-of-type(5) {
    animation-delay: 0.1s;
}

.pin:nth-of-type(6) {
    animation-delay: 0.15s;
}

.pin:nth-of-type(7) {
    animation-delay: 0.2s;
}

.pin:nth-of-type(8) {
    animation-delay: 0.25s;
}

.pin:nth-of-type(9) {
    animation-delay: 0.3s;
}

.pin:nth-of-type(10) {
    animation-delay: 0.35s;
}

.pin:nth-of-type(11) {
    animation-delay: 0.4s;
}

.pin:hover,
.pin:focus-visible,
.pin.is-highlight {
    transform: translate(-50%, -50%) scale(1.14);
    box-shadow: 0 10px 20px rgba(15, 23, 42, 0.35);
    filter: saturate(1.1);
}

.pin:focus-visible {
    outline: 3px solid rgba(255, 255, 255, 0.92);
    outline-offset: 2px;
}

.pin-admin {
    background: #1d4ed8;
}

.pin-tech {
    background: #0f766e;
}

.pin-oper {
    background: #dc2626;
}

.pin-serv {
    background: #7c3aed;
}

.pin::after {
    content: "";
    position: absolute;
    inset: -4px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.85);
    animation: pingWave 1.8s ease-out infinite;
}

.pin-tooltip {
    position: absolute;
    left: 50%;
    bottom: calc(100% + 8px);
    transform: translateX(-50%) translateY(4px);
    background: #0b1322;
    color: #ffffff;
    border-radius: 8px;
    padding: 5px 8px;
    font-size: 0.66rem;
    line-height: 1.35;
    font-weight: 700;
    width: max-content;
    max-width: 220px;
    opacity: 0;
    pointer-events: none;
    transition:
        opacity 0.18s ease,
        transform 0.18s ease;
    z-index: 12;
}

.pin:hover .pin-tooltip,
.pin:focus-visible .pin-tooltip,
.pin.is-highlight .pin-tooltip {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

.map-controls {
    margin-top: 10px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

.map-location-btn {
    border: 1px solid #0f5d49;
    background: #0f5d49;
    color: #fff;
    border-radius: 12px;
    padding: 9px 14px;
    font-size: 0.82rem;
    font-weight: 800;
    cursor: pointer;
    min-height: 42px;
    transition:
        transform 0.18s ease,
        box-shadow 0.18s ease,
        filter 0.18s ease;
}

.map-location-btn:hover,
.map-location-btn:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 10px 18px rgba(15, 93, 73, 0.28);
}

.map-location-status {
    margin: 0;
    color: #475569;
    font-size: 0.76rem;
    font-weight: 700;
}

.user-pin {
    position: absolute;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    display: none;
    align-items: center;
    justify-content: center;
    background: #0f172a;
    color: #ffffff;
    border: 2px solid #ffffff;
    transform: translate(-50%, -50%);
    box-shadow: 0 12px 22px rgba(15, 23, 42, 0.4);
    z-index: 11;
}

.user-pin.is-visible {
    display: inline-flex;
    animation: userPinPop 0.35s ease;
}

.map-stats {
    margin-top: 10px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.map-badge {
    background: #edf4ff;
    border: 1px solid #d5e5ff;
    border-radius: 999px;
    padding: 6px 10px;
    color: #1d4ed8;
    font-size: 0.78rem;
    font-weight: 700;
}

.map-badge-demand {
    background: #fff7ed;
    border-color: #fed7aa;
    color: #9a3412;
}

@keyframes pinDrop {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) translateY(-10px) scale(0.8);
    }

    to {
        opacity: 1;
        transform: translate(-50%, -50%) translateY(0) scale(1);
    }
}

@keyframes pingWave {
    0% {
        transform: scale(0.84);
        opacity: 0.7;
    }

    100% {
        transform: scale(1.35);
        opacity: 0;
    }
}

@keyframes heatPulse {
    0%,
    100% {
        transform: translate(-50%, -50%) scale(0.96);
        opacity: 0.88;
    }

    50% {
        transform: translate(-50%, -50%) scale(1.06);
        opacity: 1;
    }
}

@keyframes userPinPop {
    from {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.72);
    }

    to {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }
}

.faq-list {
    display: grid;
    gap: 12px;
}

.faq-list details {
    position: relative;
    overflow: hidden;
    border: 1px solid #d9e4f2;
    border-radius: 16px;
    background: #ffffff;
    padding: 14px 15px;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
    transition:
        transform 0.24s ease,
        border-color 0.24s ease,
        box-shadow 0.24s ease,
        background-color 0.24s ease;
}

.faq-list details::before {
    content: "";
    position: absolute;
    top: 8px;
    bottom: 8px;
    left: 0;
    width: 0;
    border-radius: 0 999px 999px 0;
    background: #0f5d49;
    transition: width 0.24s ease;
}

.faq-list details:hover {
    border-color: rgba(29, 78, 216, 0.34);
    box-shadow: 0 14px 26px rgba(15, 23, 42, 0.11);
    transform: translateY(-1px);
}

.faq-list details[open] {
    border-color: rgba(15, 93, 73, 0.48);
    background: #f3f8f6;
    box-shadow: 0 16px 28px rgba(15, 93, 73, 0.16);
}

.faq-list details[open]::before {
    width: 4px;
}

.faq-list summary {
    cursor: pointer;
    list-style: none;
    color: #0f2a66;
    font-size: 0.9rem;
    font-weight: 800;
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 9px;
    line-height: 1.45;
}

.faq-list summary::-webkit-details-marker {
    display: none;
}

.faq-list summary::after {
    content: "\F282";
    font-family: "bootstrap-icons";
    margin-left: auto;
    color: #5f6f86;
    font-size: 0.82rem;
    transition: transform 0.22s ease;
}

.faq-list details[open] summary::after {
    transform: rotate(180deg);
}

.faq-list summary i {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 93, 73, 0.14);
    color: #0f5d49;
    font-size: 0.92rem;
    flex-shrink: 0;
}

.faq-list summary:focus-visible {
    outline: 3px solid rgba(29, 78, 216, 0.24);
    outline-offset: 3px;
    border-radius: 10px;
}

.faq-answer {
    margin-top: 8px;
    padding-top: 10px;
    border-top: 1px dashed #d6e2f1;
    display: grid;
    grid-template-rows: 0fr;
    opacity: 0.2;
    transition:
        grid-template-rows 0.24s ease,
        opacity 0.2s ease;
}

.faq-list details[open] .faq-answer {
    grid-template-rows: 1fr;
    opacity: 1;
}

.faq-answer-inner {
    overflow: hidden;
}

.faq-list p {
    margin: 2px 0;
    color: #475569;
    font-size: 0.84rem;
    line-height: 1.52;
}

@media (max-width: 680px) {
    .faq-floating-modal {
        width: calc(100vw - 12px);
    }

    .faq-floating-body {
        max-width: 100%;
        min-height: min(88vh, 760px);
        border-radius: 16px;
    }

    .faq-floating-head {
        position: sticky;
        top: 0;
        z-index: 3;
        padding: 14px;
    }

    .faq-floating-head h3 {
        font-size: 0.98rem;
    }

    .faq-floating-head-copy p {
        font-size: 0.8rem;
    }

    .faq-close-btn {
        min-height: 42px;
        padding: 8px 12px;
    }

    .faq-tools {
        position: sticky;
        top: 74px;
        z-index: 2;
        padding: 10px 12px;
        gap: 8px;
    }

    .faq-search {
        min-height: 46px;
        flex-basis: 100%;
    }

    .faq-count {
        width: 100%;
        text-align: center;
        font-size: 0.71rem;
    }

    .faq-floating-modal .faq-list {
        max-height: min(50vh, 380px);
        padding: 12px 12px 2px;
    }

    .faq-list details {
        padding: 12px;
    }

    .faq-list summary {
        min-height: 44px;
        font-size: 0.86rem;
    }

    .faq-empty,
    .faq-cta {
        margin-left: 12px;
        margin-right: 12px;
    }

    .faq-cta-actions {
        width: 100%;
    }

    .faq-comment-inline-actions,
    .faq-comment-inline-actions .faq-cta-link {
        width: 100%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .faq-floating-body,
    .faq-list details,
    .faq-list summary::after,
    .faq-answer,
    .faq-close-btn,
    .faq-empty-link,
    .faq-cta-link {
        transition: none !important;
    }
}

.highlights-wrap {
    max-width: 1240px;
    margin: 24px auto 120px;
    padding: 0 28px;
}

.highlights-head {
    display: flex;
    justify-content: center;
    margin: 44px auto 22px;
}

.highlights-eyebrow {
    margin: 0;
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #8b0032;
    font-weight: 800;
}

.highlights-heading {
    margin: 0 auto;
    color: #601028;
    background-image: linear-gradient(180deg, #a52346 0%, #601028 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    width: 100%;
    max-width: 1240px;
    height: auto;
    display: block;
    text-align: center;
    font-size: clamp(2.4rem, 6.2vw, 5.2rem);
    font-weight: 900;
    letter-spacing: 0.07em;
    line-height: 0.92;
    text-transform: uppercase;
    text-shadow: 0 8px 20px rgba(96, 16, 40, 0.24);
    text-wrap: balance;
}

.highlights-heading-image {
    display: block;
    width: min(100%, 1120px);
    height: auto;
}

@media (max-width: 640px) {
    .highlights-heading {
        font-size: clamp(1.45rem, 6.8vw, 2.6rem);
        letter-spacing: 0.04em;
    }

    .highlights-heading-image {
        width: 100%;
        max-width: 620px;
    }
}

.highlights-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.highlight-card {
    background: rgba(255, 255, 255, 0.93);
    border: 1px solid rgba(139, 0, 50, 0.12);
    border-radius: 22px;
    box-shadow: 0 14px 38px rgba(31, 41, 55, 0.15);
    backdrop-filter: blur(2px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

.highlight-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 42px rgba(31, 41, 55, 0.2);
}

.highlight-media {
    height: 190px;
    position: relative;
}

.highlight-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.highlight-media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.08) 40%,
        rgba(0, 0, 0, 0.48) 100%
    );
}

.highlight-pill {
    position: absolute;
    left: 14px;
    top: 14px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.9);
    color: #8b0032;
    border-radius: 999px;
    border: 1px solid rgba(139, 0, 50, 0.22);
    padding: 6px 12px;
    font-size: 0.8rem;
    font-weight: 700;
}

.highlight-content {
    padding: 20px;
}

.highlight-title {
    margin: 0 0 12px;
    color: #8b0032;
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: 0.2px;
}

.highlight-list {
    margin: 0;
    padding-left: 18px;
    color: #2d2d2d;
    line-height: 1.7;
    font-size: 1rem;
}

.highlight-kpis {
    margin-top: 18px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.kpi-box {
    background: linear-gradient(135deg, #fff7fa 0%, #fff 100%);
    border: 1px solid rgba(139, 0, 50, 0.14);
    border-radius: 12px;
    padding: 10px;
}

.kpi-value {
    margin: 0;
    color: #8b0032;
    font-size: 1.35rem;
    font-weight: 800;
}

.kpi-label {
    margin: 2px 0 0;
    color: #505050;
    font-size: 0.83rem;
}

.highlight-actions {
    margin-top: 16px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.btn-highlight {
    border: 0;
    text-decoration: none;
    border-radius: 10px;
    font-size: 0.86rem;
    font-weight: 700;
    padding: 10px 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.btn-primary {
    background: linear-gradient(135deg, #8b0032 0%, #b10d4d 100%);
    color: #fff;
}

.btn-secondary {
    background: #f2f4f7;
    color: #374151;
    border: 1px solid #d7dce2;
}

.btn-highlight.is-planned-hidden {
    display: none;
}

.about-wrap {
    max-width: 1240px;
    margin: 0 auto 140px;
    padding: 0 28px;
}

.about-panel {
    background: linear-gradient(
        145deg,
        rgba(255, 255, 255, 0.96) 0%,
        rgba(252, 247, 250, 0.95) 100%
    );
    border: 1px solid rgba(139, 0, 50, 0.14);
    border-radius: 24px;
    box-shadow: 0 20px 48px rgba(23, 33, 50, 0.14);
    overflow: hidden;
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    min-height: 520px;
}

.about-image {
    position: relative;
    min-height: 520px;
}

.about-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.about-image::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        140deg,
        rgba(139, 0, 50, 0.15) 0%,
        rgba(0, 0, 0, 0.45) 100%
    );
}

.about-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 2;
    background: rgba(255, 255, 255, 0.9);
    color: #8b0032;
    border: 1px solid rgba(139, 0, 50, 0.2);
    border-radius: 999px;
    padding: 8px 14px;
    font-size: 0.79rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 800;
}

.about-content {
    padding: 28px 28px 24px;
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.about-title {
    margin: 0;
    color: #1f2937;
    font-size: clamp(1.5rem, 2.2vw, 2.1rem);
    line-height: 1.2;
    font-weight: 900;
}

.about-lead {
    margin: 0;
    color: #3f3f46;
    line-height: 1.65;
    font-size: 1rem;
}

.about-split {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.about-box {
    background: #ffffff;
    border: 1px solid #ece7eb;
    border-radius: 14px;
    padding: 14px;
}

.about-box h3 {
    margin: 0 0 8px;
    color: #8b0032;
    font-size: 1rem;
    font-weight: 800;
}

.about-box p {
    margin: 0;
    color: #4b5563;
    font-size: 0.92rem;
    line-height: 1.58;
}

.about-departments {
    display: grid;
    grid-template-columns: 1fr;
    gap: 9px;
}

.department-item {
    background: linear-gradient(135deg, #fff 0%, #f8f1f5 100%);
    border: 1px solid #eed9e4;
    border-radius: 11px;
    padding: 9px 11px;
    color: #2f2f37;
    font-size: 0.9rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 8px;
}

.about-metrics {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.metric-card {
    border-radius: 12px;
    background: #f8fafc;
    border: 1px solid #e3e8ef;
    padding: 12px;
}

.metric-value {
    margin: 0;
    color: #8b0032;
    font-size: 1.28rem;
    font-weight: 900;
}

.metric-label {
    margin: 3px 0 0;
    color: #4b5563;
    font-size: 0.77rem;
    font-weight: 600;
    line-height: 1.3;
}

.events-wrap {
    max-width: 1240px;
    margin: 0 auto 120px;
    padding: 0 28px;
}

.events-head {
    margin-bottom: 18px;
}

.events-title {
    margin: 0;
    color: #1f2937;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
    font-weight: 900;
}

.events-title-image {
    display: block;
    width: min(100%, 900px);
    margin: 0 auto;
    height: auto;
}

.events-subtitle {
    margin: 8px 0 0;
    color: #4b5563;
    font-size: 0.98rem;
}

.events-panel {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(139, 0, 50, 0.12);
    border-radius: 22px;
    box-shadow: 0 16px 40px rgba(31, 41, 55, 0.14);
    padding: 22px;
    display: grid;
    grid-template-columns: 0.95fr 1.05fr;
    gap: 22px;
}

.events-calendar {
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
    border: 1px solid #d9e3f0;
    border-radius: 18px;
    padding: 16px;
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
}

.calendar-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 8px;
}

.calendar-month {
    margin: 0;
    color: #7a1232;
    font-size: 1rem;
    font-weight: 900;
}

.calendar-badge {
    background: #0f5d49;
    color: #fff;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 5px 10px;
}

.calendar-week,
.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 6px;
}

.calendar-week {
    margin-bottom: 6px;
}

.calendar-week span {
    text-align: center;
    color: #0f5d49;
    font-size: 0.7rem;
    font-weight: 800;
    text-transform: uppercase;
}

.day {
    aspect-ratio: 1 / 1;
    border-radius: 9px;
    background: #fff;
    border: 1px solid #dce5f0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #374151;
    font-size: 0.83rem;
    font-weight: 700;
}

.day.empty {
    border-style: dashed;
    color: transparent;
    background: rgba(255, 255, 255, 0.4);
}

.day.marked {
    background: linear-gradient(180deg, #fff1f5 0%, #fde8ef 100%);
    border-color: #f5c2d2;
    color: #8b0032;
    box-shadow: inset 0 0 0 1px rgba(139, 0, 50, 0.08);
}

.day.marked-programa {
    background: linear-gradient(180deg, #fff6e8 0%, #f4e8d1 100%);
    border-color: #cbaa74;
    color: #5f4418;
    box-shadow: inset 0 0 0 1px rgba(95, 68, 24, 0.08);
}

.events-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.event-item {
    display: grid;
    grid-template-columns: 84px 1fr;
    gap: 10px;
    align-items: start;
    background: #fff;
    border: 1px solid #e9edf2;
    border-radius: 12px;
    padding: 10px;
}

.event-date {
    background: linear-gradient(135deg, #edf2ff 0%, #f5f8ff 100%);
    border: 1px solid #dbe4ff;
    color: #2d4aaa;
    border-radius: 10px;
    text-align: center;
    padding: 8px 6px;
    font-size: 0.74rem;
    font-weight: 800;
    line-height: 1.35;
}

.event-name {
    margin: 0;
    color: #1f2937;
    font-size: 0.92rem;
    font-weight: 700;
    line-height: 1.4;
}

.events-carousel {
    margin-top: 12px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.carousel-card {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    background: #fff;
}

.carousel-card img {
    width: 100%;
    height: 96px;
    object-fit: cover;
    display: block;
}

.carousel-card p {
    margin: 0;
    padding: 7px 8px 8px;
    color: #374151;
    font-size: 0.76rem;
    font-weight: 700;
    line-height: 1.35;
}

.events-hero {
    --event-accent: #8b0032;
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    min-height: 220px;
    margin-bottom: 16px;
    border: 1px solid color-mix(in srgb, var(--event-accent) 34%, #ffffff);
    box-shadow: 0 14px 30px rgba(23, 33, 50, 0.18);
}

.events-hero-image {
    width: 100%;
    height: 100%;
    min-height: 220px;
    max-height: 255px;
    object-fit: cover;
    display: block;
}

.events-hero-overlay {
    position: absolute;
    inset: 42% 0 0 0;
    background: linear-gradient(
        180deg,
        rgba(96, 16, 40, 0.28),
        rgba(15, 23, 42, 0.74)
    );
}

.events-hero-content {
    position: absolute;
    inset: auto 0 0 0;
    padding: 14px 16px;
    color: #ffffff;
}

.events-hero-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: color-mix(
        in srgb,
        var(--event-accent) 38%,
        rgba(255, 255, 255, 0.2)
    );
    border: 1px solid color-mix(in srgb, var(--event-accent) 56%, #ffffff);
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 0.72rem;
    font-weight: 800;
}

.events-hero-content h3 {
    margin: 7px 0 5px;
    font-size: clamp(1.05rem, 1.9vw, 1.45rem);
    font-weight: 900;
}

.events-hero-content p {
    margin: 0;
    max-width: 760px;
    line-height: 1.38;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.95);
}

.events-hero-meta {
    margin-top: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 0.8rem;
    font-weight: 700;
}

.events-countdown {
    margin-top: 10px;
    width: fit-content;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 10px;
    padding: 8px 12px;
    font-size: 0.82rem;
    font-weight: 800;
}

.events-hero-actions {
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.events-empty-state {
    border: 1px dashed #d9e3ef;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    padding: 22px 20px;
    text-align: center;
    margin-bottom: 12px;
}

.events-empty-state-icon {
    width: 48px;
    height: 48px;
    margin: 0 auto 10px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    color: #7a1232;
    background: #fff1f5;
    border: 1px solid #f5c2d2;
}

.events-empty-state h3 {
    margin: 0;
    color: #1f2937;
    font-size: 1.1rem;
    font-weight: 900;
}

.events-empty-state p {
    margin: 8px auto 0;
    max-width: 720px;
    color: #475569;
    font-size: 0.9rem;
    line-height: 1.55;
    font-weight: 600;
}

.events-btn {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    text-decoration: none;
    border-radius: 10px;
    padding: 8px 12px;
    font-size: 0.8rem;
    font-weight: 800;
}

.events-btn.primary {
    background: #ffffff;
    color: color-mix(in srgb, var(--event-accent) 86%, #0f172a);
}

.events-btn.secondary {
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.32);
    color: #ffffff;
}

.events-btn.info {
    background: color-mix(
        in srgb,
        var(--event-accent) 28%,
        rgba(255, 255, 255, 0.16)
    );
    border: 1px solid color-mix(in srgb, var(--event-accent) 54%, #ffffff);
    color: #ffffff;
}

.events-btn.is-disabled {
    opacity: 0.6;
    pointer-events: none;
}

.events-filters {
    display: grid;
    grid-template-columns: 1.2fr repeat(3, minmax(0, 1fr)) auto auto;
    gap: 10px;
    margin-bottom: 14px;
}

.events-filter-field {
    border: 1px solid #d9e1ed;
    border-radius: 12px;
    background: #ffffff;
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 0 10px;
}

.events-filter-field i {
    color: #0f5d49;
    font-size: 0.9rem;
}

.events-filter-field input,
.events-filter-field select {
    border: 0;
    outline: none;
    background: transparent;
    width: 100%;
    padding: 10px 0;
    font-size: 0.84rem;
    color: #1f2937;
}

.events-filter-counter {
    align-self: center;
    color: #334155;
    font-size: 0.82rem;
    font-weight: 700;
}

.events-filter-reset {
    border: 1px solid #d6deea;
    border-radius: 10px;
    background: #ffffff;
    color: #334155;
    font-size: 0.8rem;
    font-weight: 800;
    padding: 9px 12px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    justify-content: center;
    cursor: pointer;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease;
}

.events-filter-reset:hover,
.events-filter-reset:focus-visible {
    background: #f8fafc;
    border-color: color-mix(in srgb, var(--connecta-primary) 30%, #ffffff);
    color: #1f2937;
    transform: translateY(-1px);
}

.events-filter-reset:active {
    transform: translateY(0);
}

.events-panel-enhanced {
    grid-template-columns: minmax(340px, 0.95fr) minmax(0, 1.05fr);
    align-items: start;
}

.events-panel-enhanced > div:last-child {
    min-width: 0;
}

.events-panel-side-no-upcoming {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 0;
}

.events-calendar {
    min-width: 340px;
}

.event-item {
    position: relative;
    grid-template-columns: 108px 1fr;
    padding-left: 124px;
    border-left: 3px solid var(--event-accent, #8b0032);
    transition:
        transform 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        opacity 0.2s ease;
}

.event-item:hover,
.event-item:focus-within,
.event-item:focus-visible,
.event-item.is-map-active {
    transform: translateY(-2px);
    border-color: color-mix(in srgb, var(--event-accent, #8b0032) 74%, #ffffff);
    box-shadow: 0 12px 22px rgba(15, 23, 42, 0.12);
}

.event-item:focus-visible {
    outline: 2px solid
        color-mix(in srgb, var(--event-accent, #8b0032) 64%, #0f172a);
    outline-offset: 1px;
}

.event-item.event-item-programa {
    border-color: #cbaa74;
    background: linear-gradient(
        180deg,
        rgba(255, 246, 232, 0.96) 0%,
        rgba(244, 232, 209, 0.96) 100%
    );
    box-shadow: inset 0 0 0 1px rgba(95, 68, 24, 0.08);
}

.event-item.event-item-aprende {
    border-color: #f5c2d2;
    background: linear-gradient(
        180deg,
        rgba(255, 241, 245, 0.96) 0%,
        rgba(253, 232, 239, 0.96) 100%
    );
    box-shadow: inset 0 0 0 1px rgba(139, 0, 50, 0.08);
}

.event-item.event-item-programa .event-date {
    background: linear-gradient(135deg, #f7eddb 0%, #ecd7b3 100%);
    border-color: #cbaa74;
    color: #5f4418;
}

.event-item.event-item-aprende .event-date {
    background: linear-gradient(135deg, #fff1f5 0%, #fde8ef 100%);
    border-color: #f5c2d2;
    color: #8b0032;
}

.event-item::before {
    content: "";
    position: absolute;
    top: 10px;
    left: 10px;
    width: 98px;
    height: calc(100% - 20px);
    border-radius: 10px;
    background-image: var(--event-cover, url("/images/mapa_sala.jpeg"));
    background-size: cover;
    background-position: center;
    border: 1px solid
        color-mix(in srgb, var(--event-accent, #8b0032) 24%, #ffffff);
}

.event-item.is-filter-entering {
    animation: eventCardReveal 0.24s ease;
}

.event-item.is-filter-leaving {
    opacity: 0;
    transform: translateY(8px) scale(0.985);
    pointer-events: none;
}

@keyframes eventCardReveal {
    from {
        opacity: 0;
        transform: translateY(10px) scale(0.99);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.events-empty-note {
    margin: 0;
    border: 1px dashed #dce4ef;
    border-radius: 12px;
    padding: 12px;
    color: #475569;
    font-size: 0.84rem;
    font-weight: 700;
    background: #f8fafc;
}

.events-empty-note-friendly {
    border-style: solid;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    color: #334155;
    line-height: 1.55;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    text-align: center;
    padding: 20px 18px;
}

.events-empty-note-icon {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #7a1232;
    background: #fff1f5;
    border: 1px solid #f5c2d2;
    font-size: 1.15rem;
}

.events-empty-note-title {
    margin: 0;
    font-size: 1.08rem;
    font-weight: 900;
    line-height: 1.3;
    color: #1f2937;
}

.events-empty-note-copy {
    margin: 2px 0 0;
    max-width: 44ch;
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.7;
    color: #475569;
}

.event-main {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.event-mini-icon {
    width: 24px;
    height: 24px;
    margin-right: 6px;
    border-radius: 7px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--event-accent, #8b0032);
    background: color-mix(in srgb, var(--event-accent, #8b0032) 12%, #ffffff);
}

.event-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    color: #64748b;
    font-size: 0.73rem;
    font-weight: 700;
}

.event-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.event-btn,
.event-link {
    text-decoration: none;
    border-radius: 8px;
    font-size: 0.72rem;
    font-weight: 800;
    padding: 6px 10px;
}

.event-btn {
    background: #8b0032;
    color: #ffffff;
}

.event-link {
    border: 1px solid #d2dae8;
    color: #334155;
    background: #ffffff;
    cursor: pointer;
}

.event-link.event-link-info {
    border-color: color-mix(in srgb, var(--event-accent, #8b0032) 30%, #ffffff);
    color: color-mix(in srgb, var(--event-accent, #8b0032) 82%, #0f172a);
    background: color-mix(in srgb, var(--event-accent, #8b0032) 10%, #ffffff);
}

.event-link[aria-disabled="true"] {
    opacity: 0.6;
    pointer-events: none;
}

.events-map-card {
    margin-top: 12px;
    border: 1px solid #e4e9f0;
    border-radius: 12px;
    background: #ffffff;
    overflow: hidden;
}

.events-map-card img {
    width: 100%;
    height: 140px;
    object-fit: cover;
    display: block;
}

.events-map-content {
    padding: 10px;
}

.events-map-content p {
    margin: 0 0 7px;
    color: #475569;
    font-size: 0.8rem;
}

.events-map-content a {
    text-decoration: none;
    color: #0f5d49;
    font-size: 0.78rem;
    font-weight: 800;
}

.events-slider-shell {
    margin-top: 12px;
    border: 1px solid #e7eaf0;
    border-radius: 12px;
    padding: 10px;
    background: linear-gradient(160deg, #fff 0%, #f9f6f8 100%);
}

.events-slider-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.events-slider-head h3 {
    margin: 0;
    color: #8b0032;
    font-size: 0.93rem;
    font-weight: 900;
}

.events-slider-controls {
    display: flex;
    gap: 6px;
}

.events-slider-btn {
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 1px solid #d8dfe9;
    background: #ffffff;
    color: #475569;
    cursor: pointer;
}

.events-carousel[data-events-carousel] {
    margin-top: 0;
    display: flex;
    overflow-x: auto;
    gap: 10px;
    scroll-snap-type: x mandatory;
    scrollbar-width: thin;
}

.events-carousel[data-events-carousel] .carousel-card {
    min-width: 205px;
    max-width: 220px;
    scroll-snap-align: start;
}

.events-mini-btn {
    display: inline-block;
    margin: 0 8px 8px;
    text-decoration: none;
    color: #8b0032;
    font-size: 0.74rem;
    font-weight: 800;
}

.events-testimonials {
    margin-top: 12px;
    border: 1px solid #e4e9f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 10px;
}

.events-testimonials h3 {
    margin: 0 0 10px;
    color: #1f2937;
    font-size: 0.92rem;
    font-weight: 900;
}

.events-testimonial-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.events-quote {
    margin: 0;
    border: 1px solid #e7ecf2;
    border-radius: 10px;
    overflow: hidden;
    background: #f9fbff;
}

.events-quote img {
    width: 100%;
    height: 80px;
    object-fit: cover;
    display: block;
}

.events-quote blockquote {
    margin: 0;
    padding: 8px;
    color: #334155;
    font-size: 0.78rem;
    line-height: 1.42;
}

.events-quote figcaption {
    padding: 0 8px 8px;
    color: #64748b;
    font-size: 0.7rem;
    font-weight: 700;
}

.event-info-modal .connecta-modal-body {
    width: 100%;
    max-width: none;
    max-height: min(86vh, 760px);
    overflow: auto;
}

.event-info-modal {
    width: min(560px, 94vw);
}

.event-info-modal::backdrop {
    background: rgba(15, 23, 42, 0.56);
    opacity: 0;
    animation: eventInfoBackdropIn 0.2s ease forwards;
}

.event-info-modal.is-closing::backdrop {
    animation: eventInfoBackdropOut 0.18s ease forwards;
}

.event-info-modal-body {
    --event-info-accent: #8b0032;
    border-top: 4px solid var(--event-info-accent);
}

.event-info-modal[open] .event-info-modal-body {
    animation: eventInfoModalIn 0.22s cubic-bezier(0.2, 0.78, 0.2, 1) both;
}

.event-info-modal.is-closing .event-info-modal-body {
    animation: eventInfoModalOut 0.18s ease both;
}

.event-info-head h3 {
    color: color-mix(in srgb, var(--event-info-accent) 84%, #0f172a);
}

.event-info-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
}

.event-info-status {
    width: fit-content;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--event-info-accent) 26%, #ffffff);
    background: color-mix(in srgb, var(--event-info-accent) 12%, #ffffff);
    color: color-mix(in srgb, var(--event-info-accent) 84%, #0f172a);
    font-size: 0.72rem;
    font-weight: 800;
    padding: 5px 10px;
}

.event-info-meta {
    margin: 0;
    color: #334155;
    font-size: 0.84rem;
    font-weight: 700;
}

.event-info-meta i {
    color: var(--event-info-accent);
    margin-right: 6px;
}

.event-info-description {
    margin: 0;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #f8fafc;
    color: #1f2937;
    font-size: 0.9rem;
    line-height: 1.6;
    padding: 12px;
    line-clamp: 6;
    display: -webkit-box;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
}

.event-info-description.is-expanded {
    display: block;
    max-height: none;
    overflow: visible;
}

.event-info-description-toggle {
    justify-self: flex-start;
    border: 1px solid #d3dbe7;
    border-radius: 8px;
    background: #ffffff;
    color: #334155;
    font-size: 0.78rem;
    font-weight: 800;
    padding: 7px 10px;
    cursor: pointer;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease;
}

.event-info-description-toggle:hover,
.event-info-description-toggle:focus-visible {
    background: #f8fafc;
    border-color: color-mix(in srgb, var(--event-info-accent) 32%, #ffffff);
    color: color-mix(in srgb, var(--event-info-accent) 82%, #0f172a);
}

@keyframes eventInfoModalIn {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.985);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes eventInfoModalOut {
    from {
        opacity: 1;
        transform: translateY(0) scale(1);
    }

    to {
        opacity: 0;
        transform: translateY(12px) scale(0.985);
    }
}

@keyframes eventInfoBackdropIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes eventInfoBackdropOut {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

.event-info-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.event-info-actions .events-btn.primary {
    background: var(--event-info-accent);
    color: #ffffff;
}

.event-info-actions .events-btn.primary.is-disabled {
    background: #94a3b8;
}

@media (max-width: 680px) {
    .event-info-modal {
        width: min(96vw, 560px);
    }

    .event-info-modal .connecta-modal-body {
        max-height: 88vh;
    }

    .event-info-modal .connecta-modal-head {
        padding: 12px 12px;
    }

    .event-info-modal .event-info-content {
        padding: 10px;
        gap: 8px;
    }

    .event-info-modal .event-info-meta {
        font-size: 0.8rem;
    }

    .event-info-modal .event-info-description {
        font-size: 0.85rem;
        line-clamp: 5;
        -webkit-line-clamp: 5;
    }

    .event-info-modal .event-info-description.is-expanded {
        max-height: none;
    }
}

.sector-jump-wrap {
    max-width: 1240px;
    margin: 30px auto 16px;
    padding: 0 28px;
}

.sector-jump-head {
    margin-bottom: 12px;
}

.sector-jump-kicker {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.74rem;
    color: #64748b;
    font-weight: 800;
}

.sector-jump-title {
    margin: 6px 0 0;
    color: #1f2937;
    font-size: clamp(1.2rem, 2.1vw, 1.8rem);
    font-weight: 900;
}

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

.sector-jump-card {
    --sector-bg: #f8fafc;
    --sector-border: #d9e2ec;
    --sector-accent: #0f172a;
    position: relative;
    text-decoration: none;
    border: 1px solid var(--sector-border);
    background: linear-gradient(180deg, #ffffff 0%, var(--sector-bg) 100%);
    border-radius: 16px;
    padding: 14px 10px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.1);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 10px;
    transition:
        transform 0.22s ease,
        box-shadow 0.22s ease,
        border-color 0.22s ease;
}

.sector-jump-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 28px rgba(15, 23, 42, 0.15);
    border-color: color-mix(in srgb, var(--sector-accent) 42%, #ffffff);
}

.sector-jump-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 62px;
    height: 62px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--sector-accent) 14%, #ffffff);
    color: var(--sector-accent);
    border: 1px solid color-mix(in srgb, var(--sector-accent) 26%, #ffffff);
    font-size: 2rem;
    transition: transform 0.2s ease;
}

.sector-jump-card:hover .sector-jump-icon {
    transform: scale(1.07);
}

.sector-jump-icon-image {
    width: 40px;
    height: 40px;
    object-fit: contain;
    display: block;
}

.sector-jump-card h3 {
    margin: 0;
    color: #1f2937;
    font-size: 0.95rem;
    line-height: 1.25;
    font-weight: 800;
}

.sector-jump-agro {
    --sector-bg: #f5fbf1;
    --sector-border: #cfe5bf;
    --sector-accent: #3f7d20;
}

.sector-jump-mipy {
    --sector-bg: #eefbf5;
    --sector-border: #c7ead8;
    --sector-accent: #0f5d49;
}

.sector-jump-tourism {
    --sector-bg: #eef8ff;
    --sector-border: #c9def6;
    --sector-accent: #0f5b8b;
}

.sector-jump-invest {
    --sector-bg: #f3f3ff;
    --sector-border: #d8d7f7;
    --sector-accent: #2f4aa2;
}

.sector-proposals-wrap {
    max-width: 1240px;
    margin: 6px auto 46px;
    padding: 0 28px;
    display: grid;
    gap: 26px;
}

.sector-proposals-head h2 {
    margin: 0;
    color: #1e293b;
    font-size: clamp(1.2rem, 2vw, 1.75rem);
    font-weight: 900;
}

.sector-proposals-head p {
    margin: 6px 0 0;
    color: #475569;
    font-size: 0.9rem;
    line-height: 1.45;
}

.sector-proposal-block {
    display: grid;
    gap: 12px;
}

.sector-proposal-block-head h3 {
    margin: 0;
    color: #334155;
    font-size: 0.96rem;
    font-weight: 900;
}

.sector-proposal-block-head p {
    margin: 4px 0 0;
    color: #64748b;
    font-size: 0.8rem;
    line-height: 1.45;
}

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

.sector-proposal-card {
    position: relative;
    min-height: 222px;
    border-radius: 16px;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid rgba(148, 163, 184, 0.26);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
    background: #11243f;
}

.sector-proposal-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition:
        transform 0.42s ease,
        opacity 0.42s ease,
        filter 0.42s ease;
}

.sector-proposal-overlay,
.sector-proposal-glint {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.sector-proposal-overlay {
    z-index: 1;
    transition:
        opacity 0.35s ease,
        background 0.35s ease;
}

.sector-proposal-glint {
    z-index: 2;
    opacity: 0;
}

.sector-proposal-title {
    position: absolute;
    right: 16px;
    bottom: 16px;
    left: 16px;
    z-index: 3;
    margin: 0;
    color: #f8fafc;
    font-size: clamp(1.1rem, 1.6vw, 1.55rem);
    font-weight: 900;
    line-height: 1.18;
    text-wrap: balance;
    text-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
}

.sector-proposal-grid-tint .sector-proposal-overlay {
    background: linear-gradient(
        180deg,
        rgba(24, 116, 215, 0.54) 0%,
        rgba(16, 77, 145, 0.62) 100%
    );
}

.sector-proposal-grid-tint .sector-proposal-title {
    top: 50%;
    right: 22px;
    bottom: auto;
    left: 22px;
    transform: translateY(-50%);
    text-align: center;
    font-size: clamp(1.55rem, 2.35vw, 2.35rem);
}

.sector-proposal-grid-tint .sector-proposal-card:hover img {
    transform: scale(1.06);
}

.sector-proposal-grid-reveal .sector-proposal-card {
    background: linear-gradient(140deg, #0d1f3d 0%, #215385 100%);
}

.sector-proposal-grid-reveal .sector-proposal-card img {
    opacity: 0;
    transform: scale(1.1);
    filter: saturate(0.8) contrast(1.06);
}

.sector-proposal-grid-reveal .sector-proposal-overlay {
    background: linear-gradient(
        160deg,
        rgba(8, 22, 44, 0.84) 0%,
        rgba(17, 84, 143, 0.72) 100%
    );
    opacity: 1;
}

.sector-proposal-grid-reveal .sector-proposal-title {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
    text-align: center;
}

.sector-proposal-grid-reveal .sector-proposal-card:hover img {
    opacity: 1;
    transform: scale(1);
}

.sector-proposal-grid-reveal
    .sector-proposal-card:hover
    .sector-proposal-overlay {
    opacity: 0.36;
}

.sector-proposal-grid-panel .sector-proposal-overlay {
    background: linear-gradient(
        180deg,
        rgba(8, 25, 46, 0.2) 10%,
        rgba(8, 25, 46, 0.82) 100%
    );
}

.sector-proposal-grid-panel .sector-proposal-title {
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.34);
    border-radius: 12px;
    padding: 10px 12px;
    transform: translateY(22px);
    backdrop-filter: blur(7px);
    transition:
        transform 0.32s ease,
        background 0.32s ease;
}

.sector-proposal-grid-panel .sector-proposal-card:hover img {
    transform: scale(1.07);
}

.sector-proposal-grid-panel .sector-proposal-card:hover .sector-proposal-title {
    transform: translateY(0);
    background: rgba(8, 25, 46, 0.56);
}

.sector-proposal-grid-spotlight .sector-proposal-card img {
    transform: scale(1.04);
    filter: brightness(0.94) saturate(1.02);
}

.sector-proposal-grid-spotlight .sector-proposal-overlay {
    background: radial-gradient(
        circle at 18% 14%,
        rgba(78, 194, 255, 0.34) 0%,
        rgba(10, 24, 45, 0.68) 52%,
        rgba(10, 24, 45, 0.9) 100%
    );
}

.sector-proposal-grid-spotlight .sector-proposal-glint {
    opacity: 0;
    background: linear-gradient(
        110deg,
        transparent 0%,
        rgba(255, 255, 255, 0.08) 34%,
        rgba(255, 255, 255, 0.34) 50%,
        rgba(255, 255, 255, 0.08) 66%,
        transparent 100%
    );
    transform: translateX(-122%) skewX(-16deg);
    transition:
        opacity 0.32s ease,
        transform 0.65s ease;
}

.sector-proposal-grid-spotlight .sector-proposal-title {
    font-size: clamp(1.05rem, 1.55vw, 1.42rem);
    text-transform: uppercase;
    letter-spacing: 0.035em;
}

.sector-proposal-grid-spotlight .sector-proposal-title::after {
    content: "";
    display: block;
    width: 0;
    height: 2px;
    margin-top: 8px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.92);
    transition: width 0.34s ease;
}

.sector-proposal-grid-spotlight .sector-proposal-card:hover img {
    transform: scale(1.09) rotate(-1.2deg);
    filter: brightness(1.02) saturate(1.05);
}

.sector-proposal-grid-spotlight
    .sector-proposal-card:hover
    .sector-proposal-glint {
    opacity: 0.82;
    transform: translateX(124%) skewX(-16deg);
}

.sector-proposal-grid-spotlight
    .sector-proposal-card:hover
    .sector-proposal-title::after {
    width: 86px;
}

@media (hover: none) {
    .sector-proposal-grid-reveal .sector-proposal-card img {
        opacity: 1;
        transform: scale(1);
    }

    .sector-proposal-grid-reveal .sector-proposal-overlay {
        opacity: 0.38;
    }
}

@media (max-width: 980px) {
    .sector-proposals-wrap {
        padding: 0 16px;
    }

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

@media (max-width: 640px) {
    .sector-proposal-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .sector-proposal-card {
        min-height: 192px;
    }

    .sector-proposal-grid-tint .sector-proposal-title {
        font-size: clamp(1.28rem, 6.5vw, 1.9rem);
    }

    .sector-proposal-grid-reveal .sector-proposal-title {
        font-size: clamp(1.1rem, 5.2vw, 1.42rem);
    }
}

.agro-wrap {
    max-width: 1240px;
    margin: 0 auto 120px;
    padding: 0 28px;
}

.agro-head {
    margin-bottom: 16px;
}

.agro-title {
    margin: 0;
    color: #1f2937;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
    font-weight: 900;
}

.agro-subtitle {
    margin: 8px 0 0;
    color: #4b5563;
    font-size: 0.96rem;
    line-height: 1.55;
}

.agro-layout {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: 18px;
    align-items: start;
}

.agro-list {
    display: grid;
    gap: 12px;
}

.agro-card {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(139, 0, 50, 0.14);
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(31, 41, 55, 0.12);
    padding: 14px;
}

.agro-card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.agro-name {
    margin: 0;
    color: #8b0032;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.35;
}

.agro-acronym {
    background: #fdf1f7;
    border: 1px solid #efcfe0;
    color: #8b0032;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 0.72rem;
    font-weight: 800;
    white-space: nowrap;
}

.agro-services {
    margin: 0;
    padding-left: 16px;
    color: #374151;
    font-size: 0.9rem;
    line-height: 1.55;
}

.agro-observation {
    margin: 10px 0 0;
    color: #4b5563;
    font-size: 0.86rem;
    line-height: 1.5;
    background: #f8fafc;
    border: 1px solid #e7ecf2;
    border-radius: 11px;
    padding: 9px;
}

.agro-link {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    border-radius: 10px;
    padding: 9px 12px;
    background: linear-gradient(135deg, #1f4f9d 0%, #2d66be 100%);
    color: #fff;
    font-size: 0.83rem;
    font-weight: 700;
}

.agro-floating {
    position: sticky;
    top: 130px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(139, 0, 50, 0.14);
    border-radius: 16px;
    box-shadow: 0 12px 26px rgba(31, 41, 55, 0.14);
    padding: 12px;
}

.agro-floating h3 {
    margin: 0 0 8px;
    color: #8b0032;
    font-size: 0.86rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
}

.agro-floating a {
    display: block;
    text-decoration: none;
    color: #1f2937;
    background: #f8fafc;
    border: 1px solid #e7ecf2;
    border-radius: 10px;
    padding: 8px;
    font-size: 0.8rem;
    font-weight: 700;
    margin-bottom: 7px;
}

.agro-floating a:hover {
    border-color: #cfd8e5;
    background: #eef4ff;
}

.mipy-wrap {
    max-width: 1240px;
    margin: 0 auto 120px;
    padding: 0 28px;
}

.mipy-head {
    margin-bottom: 16px;
}

.mipy-title {
    margin: 0;
    color: #1f2937;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
    font-weight: 900;
}

.mipy-subtitle {
    margin: 8px 0 0;
    color: #4b5563;
    font-size: 0.96rem;
    line-height: 1.55;
}

.mipy-layout {
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 18px;
    align-items: start;
}

.mipy-list {
    display: grid;
    gap: 12px;
}

.mipy-card {
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(22, 98, 77, 0.2);
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(31, 41, 55, 0.12);
    padding: 14px;
}

.mipy-card-head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.mipy-name {
    margin: 0;
    color: #0f5d49;
    font-size: 1rem;
    font-weight: 800;
    line-height: 1.35;
}

.mipy-acronym {
    background: #eefaf5;
    border: 1px solid #c8eadc;
    color: #0f5d49;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 0.72rem;
    font-weight: 800;
    white-space: nowrap;
}

.mipy-services {
    margin: 0;
    padding-left: 16px;
    color: #374151;
    font-size: 0.9rem;
    line-height: 1.55;
}

.mipy-observation {
    margin: 10px 0 0;
    color: #4b5563;
    font-size: 0.86rem;
    line-height: 1.5;
    background: #f8fafc;
    border: 1px solid #e7ecf2;
    border-radius: 11px;
    padding: 9px;
}

.mipy-link {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    border-radius: 10px;
    padding: 9px 12px;
    background: linear-gradient(135deg, #0f5d49 0%, #1a8a6b 100%);
    color: #fff;
    font-size: 0.83rem;
    font-weight: 700;
}

.mipy-floating {
    position: sticky;
    top: 130px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(22, 98, 77, 0.2);
    border-radius: 16px;
    box-shadow: 0 12px 26px rgba(31, 41, 55, 0.14);
    padding: 12px;
}

.mipy-floating h3 {
    margin: 0 0 8px;
    color: #0f5d49;
    font-size: 0.86rem;
    text-transform: uppercase;
    letter-spacing: 0.07em;
}

.mipy-floating a {
    display: block;
    text-decoration: none;
    color: #1f2937;
    background: #f7fcfa;
    border: 1px solid #d8eee5;
    border-radius: 10px;
    padding: 8px;
    font-size: 0.8rem;
    font-weight: 700;
    margin-bottom: 7px;
}

.mipy-floating a:hover {
    border-color: #b7dfd1;
    background: #edfaf4;
}

.tourism-wrap {
    max-width: 1240px;
    margin: 0 auto 120px;
    padding: 0 28px;
}

.tourism-shell {
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(17, 94, 89, 0.2);
    box-shadow: 0 16px 38px rgba(15, 23, 42, 0.14);
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    background: #fff;
}

.tourism-hero {
    position: relative;
    min-height: 460px;
    padding: 28px;
    color: #fff;
    background:
        linear-gradient(
            155deg,
            rgba(10, 76, 85, 0.94) 0%,
            rgba(13, 120, 94, 0.88) 100%
        ),
        url("/images/salamanca.jpg") center/cover no-repeat;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.tourism-kicker {
    margin: 0;
    letter-spacing: 0.12em;
    font-size: 0.76rem;
    text-transform: uppercase;
    font-weight: 800;
    opacity: 0.92;
}

.tourism-title {
    margin: 8px 0 0;
    font-size: clamp(1.5rem, 2.3vw, 2rem);
    line-height: 1.2;
    font-weight: 900;
}

.tourism-lead {
    margin: 14px 0 0;
    font-size: 0.95rem;
    line-height: 1.55;
    max-width: 34ch;
    opacity: 0.95;
}

.tourism-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tourism-tag {
    border: 1px solid rgba(255, 255, 255, 0.34);
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    border-radius: 999px;
    padding: 6px 10px;
    font-size: 0.76rem;
    font-weight: 700;
}

.tourism-content {
    padding: 24px;
    background: linear-gradient(180deg, #ffffff 0%, #f4fbf9 100%);
}

.tourism-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 12px;
}

.tourism-item {
    border: 1px solid #d5ece5;
    border-radius: 14px;
    background: #fff;
    padding: 12px;
    position: relative;
    padding-left: 44px;
}

.tourism-item::before {
    content: "";
    position: absolute;
    left: 16px;
    top: 16px;
    width: 12px;
    height: 12px;
    border-radius: 999px;
    background: #0f766e;
    box-shadow: 0 0 0 4px rgba(15, 118, 110, 0.16);
}

.tourism-item h3 {
    margin: 0;
    color: #115e59;
    font-size: 0.98rem;
    font-weight: 800;
    line-height: 1.35;
}

.tourism-item .tourism-acronym {
    margin: 6px 0 0;
    color: #0f766e;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.tourism-services {
    margin: 8px 0 0;
    padding-left: 16px;
    color: #334155;
    font-size: 0.88rem;
    line-height: 1.5;
}

.tourism-link {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    font-size: 0.8rem;
    font-weight: 700;
    color: #0f766e;
    background: #e8f7f3;
    border: 1px solid #c3e8df;
    border-radius: 999px;
    padding: 7px 11px;
}

.tourism-note {
    margin-top: 14px;
    border-radius: 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 10px;
    color: #475569;
    font-size: 0.82rem;
    line-height: 1.45;
}

.invest-wrap {
    max-width: 1240px;
    margin: 0 auto 120px;
    padding: 0 28px;
}

.invest-head {
    margin-bottom: 14px;
}

.invest-title {
    margin: 0;
    color: #1f2937;
    font-size: clamp(1.5rem, 2.4vw, 2.05rem);
    font-weight: 900;
}

.invest-subtitle {
    margin: 8px 0 0;
    color: #4b5563;
    font-size: 0.95rem;
    line-height: 1.55;
}

.invest-panel {
    border-radius: 20px;
    border: 1px solid rgba(37, 99, 235, 0.18);
    box-shadow: 0 16px 38px rgba(30, 64, 175, 0.14);
    overflow: hidden;
    background: #fff;
}

.invest-topbar {
    background: linear-gradient(135deg, #0f2a66 0%, #1d4ed8 65%, #0ea5e9 100%);
    padding: 14px 16px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.invest-topbar strong {
    font-size: 0.98rem;
    letter-spacing: 0.02em;
}

.invest-badges {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.invest-badges span {
    font-size: 0.72rem;
    font-weight: 700;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    border: 1px solid rgba(255, 255, 255, 0.28);
    padding: 5px 10px;
}

.invest-grid {
    padding: 16px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.invest-card {
    border: 1px solid #dbe7ff;
    border-radius: 14px;
    background: linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%);
    padding: 12px;
    display: flex;
    flex-direction: column;
}

.invest-card h3 {
    margin: 0;
    color: #1e3a8a;
    font-size: 0.97rem;
    font-weight: 800;
    line-height: 1.35;
}

.invest-code {
    margin: 6px 0 0;
    color: #1d4ed8;
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.invest-services {
    margin: 8px 0 0;
    padding-left: 16px;
    color: #334155;
    font-size: 0.87rem;
    line-height: 1.5;
}

.invest-why {
    margin: 8px 0 0;
    border-radius: 10px;
    background: #eef4ff;
    border: 1px solid #d6e4ff;
    padding: 8px;
    color: #334155;
    font-size: 0.81rem;
    line-height: 1.45;
}

.invest-link {
    margin-top: 10px;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    text-decoration: none;
    border-radius: 10px;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 8px 11px;
    background: #1d4ed8;
    color: #fff;
    width: fit-content;
}

.directorios-wrap {
    max-width: 1240px;
    margin: 0 auto 120px;
    padding: 0 28px;
}

.directorios-head {
    margin-bottom: 16px;
}

.directorios-kicker {
    margin: 0;
    color: #8b0032;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 800;
}

.directorios-title {
    margin: 8px 0 0;
    color: #1f2937;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
    font-weight: 900;
}

.directorios-subtitle {
    margin: 8px 0 0;
    color: #4b5563;
    font-size: 0.94rem;
    line-height: 1.55;
    max-width: 72ch;
}

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

.direccion-card {
    background: #fff;
    border-radius: 18px;
    border: 1px solid #dde5ef;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12);
    overflow: hidden;
    display: grid;
    grid-template-columns: 210px 1fr;
}

.direccion-image {
    width: 100%;
    height: 100%;
    min-height: 240px;
    object-fit: cover;
    display: block;
}

.direccion-content {
    padding: 16px;
}

.direccion-content h3 {
    margin: 0;
    color: #1f2937;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.35;
}

.direccion-content h3 i {
    margin-right: 6px;
}

.direccion-content ul {
    margin: 10px 0 0;
    padding-left: 18px;
    color: #334155;
    font-size: 0.88rem;
    line-height: 1.55;
    display: grid;
    gap: 4px;
}

.direccion-link {
    margin-top: 10px;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 10px;
    padding: 8px 11px;
    color: #fff;
    font-size: 0.8rem;
    font-weight: 700;
}

.direccion-invest .direccion-link {
    background: #1d4ed8;
}

.direccion-mipy .direccion-link {
    background: #0f766e;
}

.direccion-agro .direccion-link {
    background: #15803d;
}

.direccion-tourism .direccion-link {
    background: #8b0032;
}

.uso-wrap {
    max-width: 1240px;
    margin: 0 auto 120px;
    padding: 0 28px;
}

.uso-head {
    margin-bottom: 14px;
}

.uso-kicker {
    margin: 0;
    color: #0f2a66;
    font-size: 0.8rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    font-weight: 800;
}

.uso-title {
    margin: 8px 0 0;
    color: #1f2937;
    font-size: clamp(1.45rem, 2.2vw, 2rem);
    font-weight: 900;
}

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

.uso-card {
    background: #fff;
    border: 1px solid #dce5ef;
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12);
}

.uso-visual {
    position: relative;
    height: 200px;
}

.uso-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.uso-badge {
    position: absolute;
    left: 14px;
    top: 14px;
    background: rgba(255, 255, 255, 0.92);
    color: #1f2937;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: 6px 11px;
    font-size: 0.78rem;
    font-weight: 800;
}

.uso-badge i {
    margin-right: 6px;
}

.uso-content {
    padding: 14px;
}

.uso-content h3 {
    margin: 0;
    color: #8b0032;
    font-size: 1.05rem;
    font-weight: 900;
}

.uso-content ul {
    margin: 10px 0 0;
    padding-left: 18px;
    color: #334155;
    font-size: 0.88rem;
    line-height: 1.55;
    display: grid;
    gap: 5px;
}

.uso-messages {
    margin-top: 10px;
    display: grid;
    gap: 7px;
}

.uso-messages p {
    margin: 0;
    border: 1px solid #d9e9de;
    background: #f3fbf6;
    border-radius: 10px;
    padding: 8px 10px;
    color: #14532d;
    font-size: 0.8rem;
    font-weight: 700;
}

.uso-messages i {
    margin-right: 6px;
}

.uso-steps {
    margin-top: 10px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.uso-steps span {
    border-radius: 10px;
    border: 1px solid #dbe4ff;
    background: #f6f9ff;
    color: #1e3a8a;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 8px;
    text-align: center;
}

.animate-rise {
    opacity: 0;
    transform: translateY(22px);
    animation: riseIn 0.7s ease forwards;
}

.animate-delay-1 {
    animation-delay: 0.14s;
}

.animate-delay-2 {
    animation-delay: 0.24s;
}

.animate-delay-3 {
    animation-delay: 0.34s;
}

.department-item {
    animation: slideSoft 0.65s ease both;
}

.department-item:nth-child(1) {
    animation-delay: 0.18s;
}

.department-item:nth-child(2) {
    animation-delay: 0.24s;
}

.department-item:nth-child(3) {
    animation-delay: 0.3s;
}

.department-item:nth-child(4) {
    animation-delay: 0.36s;
}

.department-item:nth-child(5) {
    animation-delay: 0.42s;
}

@keyframes riseIn {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideSoft {
    from {
        opacity: 0;
        transform: translateX(15px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@media (max-width: 980px) {
    :root {
        --section-space: 52px;
        --page-gutter: 16px;
    }

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

    .highlights-wrap {
        padding: 0 16px;
    }

    .highlight-media {
        height: 210px;
    }

    .about-wrap {
        padding: 0 16px;
    }

    .events-wrap {
        padding: 0 16px;
    }

    .sector-jump-wrap {
        padding: 0 16px;
    }

    .agro-wrap {
        padding: 0 16px;
    }

    .mipy-wrap {
        padding: 0 16px;
    }

    .tourism-wrap {
        padding: 0 16px;
    }

    .invest-wrap {
        padding: 0 16px;
    }

    .directorios-wrap {
        padding: 0 16px;
    }

    .uso-wrap {
        padding: 0 16px;
    }

    .hub-wrap {
        padding: 0 16px;
    }

    .connecta-wrap {
        padding: 0 16px;
    }

    .news-wrap,
    .hub-docs-only {
        padding: 0 16px;
    }

    .different-wrap {
        padding: 0 16px;
    }

    .about-panel {
        grid-template-columns: 1fr;
    }

    .events-panel {
        grid-template-columns: 1fr;
    }

    .events-calendar {
        min-width: 0;
    }

    .event-item {
        grid-template-columns: 1fr;
        padding-left: 10px;
        padding-top: 124px;
    }

    .event-item::before {
        width: calc(100% - 20px);
        height: 104px;
    }

    .agro-layout {
        grid-template-columns: 1fr;
    }

    .mipy-layout {
        grid-template-columns: 1fr;
    }

    .tourism-shell {
        grid-template-columns: 1fr;
    }

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

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

    .connecta-head {
        padding: 14px;
    }

    .connecta-photo {
        width: 280px;
        height: 150px;
    }

    .connecta-actions {
        grid-template-columns: 1fr;
    }

    .connecta-modal-content {
        grid-template-columns: 1fr;
    }

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

    .job-detail-image {
        height: 200px;
    }

    .job-detail-grid {
        grid-template-columns: 1fr;
    }

    .job-detail-modal .connecta-modal-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .job-detail-modal .connecta-close {
        align-self: flex-end;
    }

    @media (max-width: 640px) {
        .slider-container {
            height: 230px;
            margin-top: 12px;
            margin-bottom: 28px;
        }

        .slider-img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
            display: block;
        }

        .slider-logo {
            width: min(86vw, 520px);
        }

        .sector-jump-grid {
            grid-template-columns: 1fr;
        }

        .job-detail-modal-content {
            padding: 12px;
        }

        .job-detail-image {
            height: 176px;
        }

        .job-detail-pill {
            font-size: 0.74rem;
            padding: 6px 10px;
        }
    }
    .different-grid {
        grid-template-columns: 1fr;
    }

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

    .hub-jobs,
    .hub-two,
    .hub-bottom {
        grid-template-columns: 1fr;
    }

    .faq-fab {
        right: 12px;
        bottom: 14px;
        padding: 9px 12px;
    }

    .map-demo {
        height: 320px;
        touch-action: pan-x pan-y;
    }

    .map-legend {
        gap: 6px;
    }

    .legend-item {
        font-size: 0.7rem;
        padding: 7px 10px;
    }

    .map-controls {
        flex-direction: column;
        align-items: stretch;
    }

    .map-location-btn {
        width: 100%;
        min-height: 46px;
        font-size: 0.84rem;
    }

    .map-filter-field {
        width: 100%;
    }

    .map-filter-field select {
        width: 100%;
    }

    .map-location-status {
        font-size: 0.74rem;
    }

    .pin {
        width: 22px;
        height: 22px;
    }

    .pin-tooltip {
        font-size: 0.64rem;
        max-width: 160px;
    }

    .news-head {
        align-items: flex-start;
        flex-direction: column;
    }

    .news-featured {
        grid-template-columns: 1fr;
    }

    .news-featured.has-slider {
        padding-inline: 10px;
    }

    .news-featured-image {
        min-height: 180px;
        max-height: 220px;
    }

    .news-featured-nav {
        display: none;
    }

    .news-featured-footer {
        flex-direction: column;
        align-items: flex-start;
    }

    .news-carousel-wrap {
        padding: 12px 14px 18px;
    }

    .news-carousel-btn {
        display: none;
    }

    .news-carousel-item {
        min-width: 86%;
    }

    .doc-actions {
        width: 100%;
        min-width: 0;
        flex-direction: row;
    }

    .doc-item {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        padding: 12px;
    }

    .doc-main {
        width: 100%;
    }

    .doc-facts {
        gap: 8px;
    }

    .doc-facts span {
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .doc-actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .doc-preview-toggle,
    .doc-download {
        width: 100%;
        min-height: 42px;
    }

    .docs-head {
        flex-direction: column;
        align-items: flex-start;
    }

    .docs-head-badge {
        align-self: flex-start;
    }

    .doc-preview-toggle,
    .doc-download {
        flex: 1;
    }

    .tourism-hero {
        min-height: 340px;
    }

    .about-image {
        min-height: 260px;
    }

    .about-split {
        grid-template-columns: 1fr;
    }

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

    .events-carousel {
        grid-template-columns: 1fr;
    }

    .events-filters {
        grid-template-columns: 1fr;
    }

    .events-panel-enhanced {
        grid-template-columns: 1fr;
    }

    .events-testimonial-grid {
        grid-template-columns: 1fr;
    }

    .events-carousel[data-events-carousel] .carousel-card {
        min-width: 82%;
    }

    .agro-floating {
        position: static;
    }

    .mipy-floating {
        position: static;
    }

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

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

    .direccion-card {
        grid-template-columns: 1fr;
    }

    .direccion-image {
        min-height: 180px;
    }

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

    .invest-topbar {
        flex-direction: column;
        align-items: flex-start;
    }
}