/* Horizontes UC v1.0.1 — complemento del Kit Digital UC + CSS del Plan Estratégico (Urantiacos SpA) */

/* Tokens */
:root {
    --hz-text: #242424;
    --hz-text-subtle: #616161;
    --hz-blue: #0176de;
    --hz-link: #035bbf;
    --hz-yellow: #fec60d;
    --hz-plan: #1a1e2b;
    --hz-beige: #fffae8;
    --hz-beige-20: #f3ebd4;
    --hz-border: #c6c6c6;
    --hz-border-subtle: #e6e6e6;
    --hz-grey-20: #e6e6e6;
    --hz-shadow: 0 0 8px rgba(136, 136, 136, .18);
    --hz-section-y: 48px;
}

@media (min-width: 992px) {
    :root { --hz-section-y: 80px; }
}

html { scroll-padding-top: 24px; }

/* Header del Plan */
.uc-navbar.navbar-plan .uc-navbar_nav .nav-item > .uc-btn.btn-plan.external::after {
    font-size: 20px;
    margin-left: 4px;
    vertical-align: middle;
}
.uc-navbar.navbar-plan .uc-navbar_mobile-logo img { width: 184px; }

/* Secciones */
.hz-landing { overflow-x: hidden; }
.hz-section { padding: var(--hz-section-y) 0; color: var(--hz-text); }
.hz-section p { letter-spacing: .5px; }
.hz-section h1, .hz-section h2, .hz-section h3, .hz-section h4 { letter-spacing: .5px; color: inherit; margin: 0; }
.hz-section .uc-text-divider { display: block; width: 48px; }
.hz-row { row-gap: 32px; }
.hz-col { display: flex; }
.hz-col > * { width: 100%; }

/* Título de sección + divisor amarillo */
.hz-title { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }
.hz-title--center { align-items: center; text-align: center; }
.hz-title--left { align-items: flex-start; }
.hz-title--inline { flex-direction: row; align-items: center; flex-wrap: wrap; }
.hz-title--inverted { color: #fff; }
.hz-title h2 { color: inherit; }
.hz-lead { margin: 0 0 40px; }
.hz-section .hz-title + .row,
.hz-section .hz-title + .hz-row { margin-top: 36px; }

/* Botones */
.uc-btn.hz-btn { justify-content: center; gap: 8px; text-align: center; }
.uc-btn.hz-btn .uc-icon { color: inherit; }
.hz-btn--block { width: 100%; margin-top: 32px; }

/* Hero */
.hz-hero { border-bottom: 1px solid var(--hz-beige-20); }
.hz-hero__content { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; margin-bottom: 32px; }
.hz-hero__title { color: var(--hz-text); }
.hz-hero__lead { margin: 0; color: var(--hz-text); }
.uc-btn.hz-hero__btn { margin-top: 20px; min-width: 281px; }
.hz-hero__media { position: relative; border-radius: 4px; overflow: hidden; aspect-ratio: 592 / 444; background: var(--hz-beige-20); }
.hz-hero__video, .hz-hero__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hz-hero__media::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(to top, rgba(0, 0, 0, .2) 0%, rgba(102, 102, 102, 0) 59.9%);
}
.hz-hero__toggle {
    position: absolute; right: 12px; bottom: 12px; z-index: 2;
    width: 36px; height: 36px; border: 0; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: rgba(26, 30, 43, .6); color: #fff; cursor: pointer;
}
.hz-hero__toggle .uc-icon { color: #fff; font-size: 20px; }
.hz-hero__toggle:focus-visible { outline: 2px solid var(--hz-yellow); outline-offset: 2px; }
@media (min-width: 992px) {
    .hz-hero__content { margin-bottom: 0; }
    .hz-hero .row { --hz-gutter: 32px; }
}

/* Qué es */
.hz-subtitle { margin-bottom: 32px !important; color: #000; }
.hz-text { margin: 0; color: #000; }
.hz-que-es__info { margin-bottom: 40px; }
@media (min-width: 992px) {
    .hz-que-es__info { flex: 0 0 59.7%; max-width: 59.7%; margin-bottom: 0; }
    .hz-que-es__aside { flex: 0 0 39.9%; max-width: 39.9%; }
}

/* Cards */
.hz-card { display: flex; flex-direction: column; gap: 12px; border-radius: 4px; padding: 24px; }
.hz-card--outline { background: #fff; border: 1px solid var(--hz-border); }
.hz-card--beige { background: var(--hz-beige); border: 1px solid var(--hz-border); }
.hz-card__title { color: var(--hz-text); }
.hz-card__label { margin: 0; color: var(--hz-text-subtle); font-size: 14px; line-height: 20px; letter-spacing: 1px; font-weight: 500; }
.hz-cards .hz-card { padding: 0; gap: 0; height: 100%; overflow: hidden; }
.hz-card__icon { padding: 24px 24px 4px; line-height: 1; min-height: 88px; }
.hz-card__icon .uc-icon { font-size: 60px; color: var(--hz-plan); }
.hz-card__icon img { width: 60px; height: 60px; object-fit: contain; }
.hz-card__body { display: flex; flex-direction: column; gap: 12px; padding: 24px; }

/* Historias (videos) */
.hz-historias { padding: 64px 0 68px; color: #fff; }
.hz-historias .hz-lead { color: #fff; }
.hz-video { display: flex; flex-direction: column; border: 1px solid var(--hz-border); border-radius: 4px; overflow: hidden; background: #fff; }
.hz-video__media {
    position: relative; display: flex; align-items: center; justify-content: center;
    width: 100%; height: 173px; padding: 0; border: 0;
    background: var(--hz-grey-20); overflow: hidden;
}
.hz-video__media--ready { height: auto; aspect-ratio: 16 / 9; cursor: pointer; }
.hz-video__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hz-video__media iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.uc-icon.hz-video__play { position: relative; z-index: 1; font-size: 57px; color: var(--hz-plan); transition: transform .2s ease; }
.hz-video__media--ready .hz-video__play { color: #fff; text-shadow: 0 2px 8px rgba(0, 0, 0, .4); }
.hz-video__media--ready:hover .hz-video__play,
.hz-video__media--ready:focus-visible .hz-video__play { transform: scale(1.1); }
.hz-video__media--ready:focus-visible { outline: 3px solid var(--hz-yellow); outline-offset: -3px; }
.hz-video__body { padding: 16px 24px; color: var(--hz-text); }

/* Cita (Kit: card-type--plan--bg-light) */
.hz-cita .uc-card.card-type--plan--bg-light { border-top-color: var(--hz-border); border-left-color: var(--hz-border); border-right-color: var(--hz-border); }
.hz-cita .uc-card_body--lg { padding: 44px 48px; }
.hz-cita .col-md-4 .uc-card_body--lg { padding-right: 0; }
@media (min-width: 992px) {
    .hz-cita .row > .col-md-4 { flex: 0 0 288px; max-width: 288px; }
    .hz-cita .row > .col-md .uc-card_body--lg { padding-left: 0; }
}
.hz-cita .avatar { flex-shrink: 0; overflow: hidden; }
.hz-cita .avatar img { width: 100%; height: 100%; object-fit: cover; }
.hz-cita .uc-quote { color: var(--hz-text); line-height: 36px; }
@media (max-width: 767px) {
    .hz-cita .uc-card_body--lg { padding: 24px; }
    .hz-cita .col-md-4 .uc-card_body--lg { padding: 32px 24px 0; display: flex; align-items: center; }
    .hz-cita .uc-card.card-type--plan--bg-light .avatar { width: 160px; height: 160px; }
    .hz-cita .uc-quote { font-size: 1.25em; line-height: 1.5; }
}

/* Cómo comenzar */
.hz-comenzar { background-color: var(--hz-blue); color: #fff; }
.hz-comenzar .hz-title { margin-bottom: 40px; }
.hz-comenzar__text p { color: #fff; font-size: inherit; line-height: 28px; margin: 0 0 28px; }
.hz-comenzar__text p:last-child { margin-bottom: 0; }
.hz-comenzar__content { margin-bottom: 40px; }
.hz-card--form { border-color: var(--hz-border-subtle); box-shadow: var(--hz-shadow); color: var(--hz-text); }
.hz-card__note { margin-top: -12px !important; }
.uc-btn.btn-primary.hz-card__btn { margin-top: 8px; color: var(--hz-link); border-color: var(--hz-border); border-radius: 4px; }
.uc-btn.btn-primary.hz-card__btn .uc-icon { color: var(--hz-link); }
@media (min-width: 992px) {
    .hz-comenzar__content { margin-bottom: 0; padding-right: 8px; }
}

/* Contacto */
.hz-contact { display: flex; flex-direction: column; height: 100%; background: #fff; border: 1px solid var(--hz-border-subtle); border-radius: 4px; box-shadow: var(--hz-shadow); overflow: hidden; }
.hz-contact__body { flex: 1 0 auto; display: flex; flex-direction: column; gap: 12px; padding: 24px; }
.hz-contact__footer { display: flex; justify-content: flex-end; padding: 16px 24px; background: var(--hz-beige); border-top: 1px solid var(--hz-border-subtle); }
.hz-contact__link { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; color: var(--hz-link); font-weight: 500; letter-spacing: .5px; text-decoration: none; }
.hz-contact__link--correo span { text-decoration: underline; }
.hz-contact__link .uc-icon { font-size: 16px; color: var(--hz-link); }
.hz-contact__link:hover span { text-decoration: underline; }

@media (min-width: 992px) { .hz-contact { min-height: 240px; } }

/* Separador */
.hz-separador .uc-hr { margin: 0; }

/* Efectos: reveal on-scroll (solo si JS está activo) */
.hz-js .hz-fade-up { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; transition-delay: var(--hz-delay, 0ms); }
.hz-js .hz-fade-up.hz-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
    .hz-js .hz-fade-up { opacity: 1; transform: none; transition: none; }
}