:root {
    --landing-orange: #d93800;
    --landing-orange-dark: #ad2f00;
    --landing-orange-soft: #ff7024;
    --landing-blue: #0d3f89;
    --landing-blue-dark: #06275a;
    --landing-yellow: #ffc000;
    --landing-white: #ffffff;
    --landing-light: #edf2f8;
    --landing-light-2: #e1e9f3;
    --landing-text: #0c192c;
    --landing-muted: #4c5c74;
    --landing-shadow: 0 18px 46px rgba(5, 27, 63, 0.2);
    --landing-radius-xl: 28px;
    --landing-radius-lg: 20px;
    --landing-radius-md: 14px;
    --landing-container: 1200px;
}

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: "Inter", Arial, sans-serif;
    color: var(--landing-text);
    background: var(--landing-white);
}

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

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

button,
input {
    font: inherit;
}

.landing-container {
    width: min(var(--landing-container), calc(100% - 40px));
    margin: 0 auto;
}

.landing-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(255, 101, 0, 0.94);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.header-inner {
    min-height: 92px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
}

.brand-mark {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    color: var(--landing-white);
    min-width: 0;
}

.brand-mark img {
    width: 82px;
    height: 82px;
    object-fit: cover;
    border-radius: 18px;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
}

.brand-copy {
    display: flex;
    flex-direction: column;
    line-height: 1;
}

.brand-title {
    font-size: 2.2rem;
    font-weight: 900;
    letter-spacing: -0.04em;
}

.brand-subtitle {
    font-size: 1.55rem;
    font-weight: 700;
}

.landing-nav {
    display: flex;
    align-items: center;
    gap: 18px;
}

.landing-nav a {
    color: var(--landing-white);
    font-weight: 700;
    font-size: 0.98rem;
    transition: opacity 0.34s cubic-bezier(0.16, 1, 0.3, 1), transform 0.34s cubic-bezier(0.16, 1, 0.3, 1);
}

.landing-nav a:hover {
    opacity: 0.88;
    transform: translateY(-1px);
}

.nav-button {
    background: var(--landing-white);
    color: var(--landing-orange) !important;
    padding: 12px 22px;
    border-radius: 999px;
    box-shadow: 0 10px 18px rgba(0, 0, 0, 0.12);
}

.nav-whatsapp {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.nav-whatsapp::before {
    content: "";
    width: 22px;
    height: 22px;
    border: 2px solid currentColor;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
    background: url("../../img/iconos/icon1.ico") center / 100% 100% no-repeat;
}

.menu-toggle {
    display: none;
    width: 48px;
    height: 48px;
    border: none;
    background: rgba(255, 255, 255, 0.12);
    border-radius: 14px;
    padding: 10px;
    cursor: pointer;
}

.menu-toggle span {
    display: block;
    height: 3px;
    background: var(--landing-white);
    border-radius: 999px;
}

.menu-toggle span + span {
    margin-top: 6px;
}

.hero-section {
    position: relative;
    min-height: 100vh;
    background: #101010;
    overflow: hidden;
}

.hero-carousel {
    position: relative;
    min-height: 100vh;
}

.hero-carousel-track {
    position: relative;
    min-height: 100vh;
}

.hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.9s ease;
}

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

.hero-slide img {
    width: 100%;
    height: 100%;
    min-height: 100vh;
    object-fit: cover;
    object-position: center center;
}

.hero-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 58px;
    height: 58px;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.16);
    color: var(--landing-white);
    display: grid;
    place-items: center;
    cursor: pointer;
    z-index: 4;
    backdrop-filter: blur(8px);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.14);
    transition: transform 0.34s cubic-bezier(0.16, 1, 0.3, 1), background 0.34s ease;
}

.hero-arrow:hover {
    transform: translateY(-50%) scale(1.05);
    background: rgba(255, 255, 255, 0.24);
}

.hero-arrow span {
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
}

.hero-arrow-prev {
    left: 28px;
}

.hero-arrow-next {
    right: 28px;
}

.hero-dots {
    position: absolute;
    left: 50%;
    bottom: 34px;
    transform: translateX(-50%);
    display: flex;
    gap: 12px;
    z-index: 4;
}

.hero-dot {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.92);
    background: transparent;
    cursor: pointer;
    padding: 0;
    transition: transform 0.34s cubic-bezier(0.16, 1, 0.3, 1), background 0.34s ease, opacity 0.34s ease;
}

.hero-dot.is-active {
    background: var(--landing-white);
    transform: scale(1.12);
}

.hero-dot:not(.is-active) {
    opacity: 0.8;
}

.hero-socials {
    position: absolute;
    right: 26px;
    bottom: 28px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    z-index: 2;
}

.hero-socials a {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--landing-white);
    color: var(--landing-orange);
    font-weight: 900;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.14);
}

.section-chip {
    display: inline-flex;
    padding: 10px 18px;
    border-radius: 12px;
    background: var(--landing-orange);
    color: var(--landing-white);
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: -0.03em;
}

.section-videos {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(88px, 9vw, 132px) 0;
    background:
        radial-gradient(circle at 28% 19%, rgba(248, 247, 244, 0.76), transparent 29%),
        radial-gradient(circle at 94% 76%, rgba(4, 26, 46, 0.22), transparent 29%),
        radial-gradient(circle at 8% 88%, rgba(213, 165, 56, 0.14), transparent 21%),
        linear-gradient(118deg, #bf2402 0%, #e84603 42%, #ed6b35 72%, #f1c7b0 100%);
}

.section-videos::before,
.section-videos::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
}

.section-videos::before {
    inset: 0;
    opacity: 1;
    background-image:
        linear-gradient(132deg, rgba(141, 25, 6, 0.22) 0 11%, transparent 11% 100%),
        linear-gradient(132deg, transparent 0 15%, rgba(248, 247, 244, 0.12) 15% 22%, transparent 22% 100%),
        linear-gradient(312deg, transparent 0 80%, rgba(8, 40, 68, 0.20) 80% 88%, transparent 88% 100%),
        linear-gradient(rgba(4, 26, 46, 0.09) 1px, transparent 1px),
        linear-gradient(90deg, rgba(4, 26, 46, 0.09) 1px, transparent 1px),
        radial-gradient(rgba(248, 247, 244, 0.16) 1.2px, transparent 1.2px);
    background-size: 100% 100%, 100% 100%, 100% 100%, 40px 40px, 40px 40px, 18px 18px;
    -webkit-mask-image: linear-gradient(110deg, #000 0%, rgba(0, 0, 0, 0.26) 38%, rgba(0, 0, 0, 0.14) 64%, #000 100%);
    mask-image: linear-gradient(110deg, #000 0%, rgba(0, 0, 0, 0.26) 38%, rgba(0, 0, 0, 0.14) 64%, #000 100%);
}

.section-videos::after {
    right: -105px;
    bottom: -125px;
    width: 330px;
    height: 330px;
    border: 2px solid rgba(8, 40, 68, 0.28);
    border-radius: 50%;
    box-shadow: 0 0 0 24px rgba(232, 70, 3, 0.12), 0 0 0 48px rgba(213, 165, 56, 0.10), 0 0 0 70px rgba(4, 26, 46, 0.07);
    animation: videoBackgroundPulse 18s ease-in-out -7s infinite;
}

.videos-decoration {
    z-index: 0;
    position: absolute;
    pointer-events: none;
    border: 1px solid rgba(213, 165, 56, 0.42);
    background: rgba(141, 25, 6, 0.12);
    transform: rotate(16deg);
    animation: videoDecorationDrift 16s ease-in-out infinite;
    will-change: transform;
}

.videos-decoration-one {
    top: 90px;
    right: 6%;
    width: 118px;
    height: 118px;
    border-radius: 30px;
    box-shadow: inset 0 0 0 12px rgba(8, 40, 68, 0.09);
    animation-delay: -4s;
}

.videos-decoration-two {
    bottom: 54px;
    left: 4%;
    width: 74px;
    height: 74px;
    border-radius: 50%;
    border-color: rgba(8, 40, 68, 0.32);
    background: rgba(4, 26, 46, 0.10);
    animation-duration: 20s;
    animation-delay: -11s;
}

.videos-heading {
    position: relative;
    z-index: 1;
    max-width: 760px;
    margin-bottom: clamp(34px, 5vw, 58px);
}

.videos-heading::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -26px -32px;
    border-radius: 32px;
    background: radial-gradient(circle at 38% 42%, rgba(248, 247, 244, 0.74), rgba(248, 247, 244, 0.38) 58%, transparent 84%);
    pointer-events: none;
}

.section-videos .section-eyebrow {
    color: #8d1906;
    font-weight: 900;
    text-shadow: 0 1px 0 rgba(248, 247, 244, 0.62);
}

.videos-heading h2 {
    max-width: 720px;
    margin: 14px 0 0;
    color: #041a2e;
    font-size: clamp(2.5rem, 5vw, 4.6rem);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 1.02;
    text-shadow: 0 2px 2px rgba(248, 247, 244, 0.34);
}

.videos-heading p {
    max-width: 610px;
    margin: 20px 0 0;
    color: #082844;
    font-size: 1rem;
    font-weight: 650;
    line-height: 1.76;
}

.videos-bento {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: 1fr;
    gap: 24px;
    align-items: stretch;
}

.video-card {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid rgba(8, 40, 91, 0.16);
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 21px 52px rgba(5, 34, 82, 0.15);
    transition: transform 340ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 340ms cubic-bezier(0.16, 1, 0.3, 1), border-color 340ms cubic-bezier(0.16, 1, 0.3, 1);
}

.video-card:hover {
    transform: translateY(-3px);
    border-color: rgba(255, 78, 0, 0.36);
    box-shadow: 0 27px 64px rgba(5, 34, 82, 0.2);
}

.video-card-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 15px 18px;
    background: var(--faraday-navy-deep);
    color: #ffffff;
}

.video-card-meta span {
    color: var(--faraday-orange);
    font-size: 0.78rem;
    font-weight: 900;
}

.video-card-meta small {
    font-size: 0.67rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.video-frame {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: #07152d;
}

.video-poster {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
    padding: 0;
    border: 0;
    background: #07152d;
    cursor: pointer;
}

.video-poster img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1), filter 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.video-poster-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(4, 26, 46, 0.08), rgba(4, 26, 46, 0.38));
    transition: background 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.video-play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    display: grid;
    width: 56px;
    aspect-ratio: 1;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.48);
    border-radius: 50%;
    background: var(--faraday-orange);
    color: #ffffff;
    box-shadow: 0 14px 32px rgba(4, 26, 46, 0.32), 0 0 0 8px rgba(255, 255, 255, 0.14);
    transform: translate(-50%, -50%);
    transition: transform 320ms cubic-bezier(0.16, 1, 0.3, 1), background 320ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.video-play-button svg {
    width: 27px;
    height: 27px;
    margin-left: 3px;
}

.video-poster:hover img {
    filter: saturate(1.04);
    transform: scale(1.035);
}

.video-poster:hover .video-poster-overlay {
    background: linear-gradient(180deg, rgba(4, 26, 46, 0.03), rgba(4, 26, 46, 0.30));
}

.video-poster:hover .video-play-button {
    background: var(--faraday-orange-dark);
    box-shadow: 0 17px 38px rgba(4, 26, 46, 0.38), 0 0 0 10px rgba(255, 255, 255, 0.17);
    transform: translate(-50%, -50%) scale(1.06);
}

.video-poster:focus-visible {
    outline: 4px solid #d5a538;
    outline-offset: -4px;
}

.landing-video-modal[hidden] {
    display: none;
}

.landing-video-modal {
    position: fixed;
    z-index: 5000;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 24px;
}

.landing-video-modal-backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(4, 26, 46, 0.82);
    backdrop-filter: blur(7px);
    cursor: pointer;
}

.landing-video-modal-dialog {
    position: relative;
    z-index: 1;
    width: min(980px, 100%);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 24px;
    background: var(--faraday-navy-deep);
    box-shadow: 0 34px 90px rgba(0, 0, 0, 0.42);
    animation: landingVideoModalIn 320ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.landing-video-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    min-height: 64px;
    padding: 12px 14px 12px 22px;
    color: #ffffff;
}

.landing-video-modal-header strong {
    overflow: hidden;
    font-size: 1rem;
    line-height: 1.35;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.landing-video-modal-close {
    display: grid;
    flex: 0 0 auto;
    width: 40px;
    aspect-ratio: 1;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.09);
    color: #ffffff;
    font-size: 1.65rem;
    line-height: 1;
    cursor: pointer;
    transition: background 280ms ease, border-color 280ms ease;
}

.landing-video-modal-close:hover,
.landing-video-modal-close:focus-visible {
    border-color: var(--faraday-orange);
    background: var(--faraday-orange);
    outline: none;
}

.landing-video-modal-frame {
    position: relative;
    aspect-ratio: 16 / 9;
    background: #020b14;
}

.landing-video-modal-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
    border: 0;
}

body.video-modal-open {
    overflow: hidden;
}

@keyframes landingVideoModalIn {
    from {
        opacity: 0;
        transform: translateY(18px) scale(0.985);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.video-card-copy {
    flex: 1;
    padding: 18px 20px 21px;
}

.video-card h3 {
    margin: 0;
    color: var(--faraday-navy-deep);
    font-size: 1.12rem;
    line-height: 1.25;
}

.video-card p {
    margin: 8px 0 0;
    color: var(--faraday-muted);
    font-size: 0.86rem;
    line-height: 1.55;
}

.section-clases {
    position: relative;
    overflow: hidden;
    padding: clamp(76px, 8vw, 116px) 0 clamp(88px, 9vw, 132px);
    background: linear-gradient(180deg, #ffffff 0%, #f5f7fb 100%);
}

.clases-transition {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(16, 40, 79, 0.13), transparent);
}

.clases-feature {
    position: relative;
    display: grid;
    grid-template-columns: minmax(300px, 0.78fr) minmax(480px, 1.22fr);
    gap: clamp(34px, 5vw, 76px);
    align-items: center;
    overflow: hidden;
    padding: clamp(34px, 5vw, 70px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 32px;
    background:
        radial-gradient(circle at 12% 18%, rgba(20, 86, 215, 0.42), transparent 34%),
        linear-gradient(135deg, #03122c 0%, #08285b 100%);
    box-shadow: 0 30px 80px rgba(7, 21, 45, 0.22);
}

.clases-feature::before {
    content: "";
    position: absolute;
    top: -110px;
    left: 34%;
    width: 240px;
    height: 240px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 50%;
}

.clases-copy,
.clases-visual {
    position: relative;
    z-index: 1;
}

.clases-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #ff9c64;
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.clases-eyebrow::before {
    content: "";
    width: 34px;
    height: 2px;
    border-radius: 99px;
    background: var(--faraday-orange);
}

.clases-copy h2 {
    margin: 18px 0 0;
    color: #ffffff;
    font-size: clamp(2.4rem, 4.4vw, 4.25rem);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 1.02;
}

.clases-copy p {
    max-width: 480px;
    margin: 20px 0 0;
    color: rgba(255, 255, 255, 0.72);
    line-height: 1.72;
}

.clases-visual {
    padding: 14px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 25px;
    background: rgba(255, 255, 255, 0.06);
    box-shadow: 0 24px 56px rgba(0, 0, 0, 0.28);
}

.clases-visual img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
    border-radius: 17px;
}

.clases-visual-orbit {
    position: absolute;
    z-index: -1;
    right: -28px;
    bottom: -28px;
    width: 112px;
    height: 112px;
    border: 1px solid rgba(255, 78, 0, 0.58);
    border-radius: 50%;
    animation: clasesOrbit 7.5s ease-in-out infinite;
}

.btn-mas-informacion {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    min-height: 52px;
    margin-top: 30px;
    padding: 0 22px;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 14px;
    background: var(--faraday-orange);
    color: #ffffff;
    font-size: 0.84rem;
    font-weight: 850;
    box-shadow: 0 14px 30px rgba(255, 78, 0, 0.31);
    transition: transform 340ms cubic-bezier(0.16, 1, 0.3, 1), background 340ms ease, box-shadow 340ms ease;
}

.btn-mas-informacion:hover {
    background: #c73100;
    transform: translateY(-2px);
    box-shadow: 0 18px 36px rgba(255, 78, 0, 0.38);
}

@keyframes clasesOrbit {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(-8px, -7px, 0); }
}

.modalities-section {
    isolation: isolate;
    background:
        radial-gradient(circle at 22% 58%, rgba(255, 74, 0, 0.26), transparent 30%),
        radial-gradient(circle at 82% 38%, rgba(20, 91, 230, 0.29), transparent 32%),
        radial-gradient(rgba(255, 255, 255, 0.1) 1px, transparent 1px),
        linear-gradient(145deg, #031128 0%, #05244f 48%, #07306b 100%);
    background-size: auto, auto, 28px 28px, auto;
}

.modalities-section::before,
.modalities-section::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
}

.modalities-section::before {
    top: 10%;
    left: -90px;
    width: 280px;
    height: 280px;
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 50%;
    box-shadow: 0 0 0 48px rgba(255, 78, 0, 0.04);
    animation: faradayAmbientFloatA 20s ease-in-out -7s infinite;
}

.modalities-section::after {
    right: -70px;
    bottom: 7%;
    width: 220px;
    height: 220px;
    border: 1px solid rgba(109, 158, 231, 0.13);
    border-radius: 38% 62% 58% 42%;
    animation: faradayAmbientFloatB 24s ease-in-out -13s infinite;
}

.modalities-section > .landing-container {
    position: relative;
    z-index: 1;
}

.modalities-section .modalities-heading h2 {
    color: #ffffff;
}

.modalities-section .modalities-heading p {
    color: rgba(241, 246, 253, 0.8);
}

.modalities-section .section-eyebrow {
    color: #ff9c64;
}

.modalities-section .clases-transition {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.16), transparent);
}

.modalities-section .modalities-stage::before {
    border-color: rgba(255, 255, 255, 0.1);
}

.modalities-heading {
    max-width: 820px;
    margin: 0 auto clamp(42px, 6vw, 72px);
    text-align: center;
}

.modalities-heading h2 {
    margin: 14px 0 0;
    color: var(--faraday-navy-deep);
    font-size: clamp(2.6rem, 5vw, 4.7rem);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 1.02;
}

.modalities-heading p {
    max-width: 610px;
    margin: 20px auto 0;
    color: var(--faraday-muted);
    line-height: 1.72;
}

.modalities-stage {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(22px, 3vw, 38px);
    align-items: center;
    min-height: min(700px, calc(100vh - 110px));
}

.modalities-stage::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 50%;
    left: 50%;
    width: min(78vw, 860px);
    height: min(78vw, 860px);
    border: 1px solid rgba(16, 40, 79, 0.06);
    border-radius: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.modality-card {
    position: relative;
    z-index: 1;
    overflow: hidden;
    border: 1px solid rgba(5, 31, 73, 0.18);
    border-radius: 28px;
    background: #ffffff;
    box-shadow: 0 27px 70px rgba(2, 19, 48, 0.23);
    will-change: transform, opacity;
}

.modality-card-virtual { margin-top: -28px; }
.modality-card-presencial { margin-top: 28px; }

.modality-visual {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background: var(--faraday-navy-deep);
}

.modality-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 54%, rgba(7, 21, 45, 0.21));
    pointer-events: none;
}

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

.modality-card-presencial .modality-visual img {
    object-position: center 22%;
}

.modality-number {
    position: absolute;
    z-index: 2;
    top: 18px;
    right: 18px;
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 14px;
    background: rgba(7, 21, 45, 0.74);
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 900;
    backdrop-filter: blur(8px);
}

.modality-copy {
    padding: clamp(24px, 3vw, 34px);
}

.modality-label {
    display: inline-flex;
    color: var(--faraday-orange);
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.modality-copy h3 {
    margin: 10px 0 0;
    color: var(--faraday-navy-deep);
    font-size: clamp(1.6rem, 2.5vw, 2.3rem);
    font-weight: 900;
    letter-spacing: -0.045em;
    line-height: 1.08;
}

.modality-copy p {
    margin: 14px 0 0;
    color: var(--faraday-muted);
    font-size: 0.9rem;
    line-height: 1.65;
}

.modality-card-presencial .modality-label { color: #155fc9; }

.modality-card-presencial .btn-mas-informacion {
    background: var(--faraday-navy);
    box-shadow: 0 14px 30px rgba(16, 40, 79, 0.2);
}

.modality-card-presencial .btn-mas-informacion:hover {
    background: #092f70;
    box-shadow: 0 18px 36px rgba(16, 40, 79, 0.25);
}

.modalities-section.modalities-scroll-ready .modalities-heading {
    margin-bottom: 26px;
}

.section-about {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(92px, 10vw, 146px) 0;
    background:
        radial-gradient(circle at 73% 48%, rgba(248, 247, 244, 0.66), transparent 28%),
        radial-gradient(circle at 12% 82%, rgba(4, 26, 46, 0.24), transparent 26%),
        radial-gradient(circle at 92% 12%, rgba(213, 165, 56, 0.16), transparent 20%),
        linear-gradient(118deg, #8d1906 0%, #bf2402 22%, #e84603 54%, #f06d35 76%, #bf2402 100%);
}

.section-about::before,
.section-about::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
}

.section-about::before {
    inset: 0;
    opacity: 1;
    background-image:
        linear-gradient(132deg, rgba(141, 25, 6, 0.28) 0 12%, transparent 12% 100%),
        linear-gradient(132deg, transparent 0 16%, rgba(248, 247, 244, 0.11) 16% 23%, transparent 23% 100%),
        linear-gradient(312deg, transparent 0 78%, rgba(8, 40, 68, 0.22) 78% 87%, transparent 87% 100%),
        radial-gradient(rgba(4, 26, 46, 0.15) 1.3px, transparent 1.3px);
    background-size: 100% 100%, 100% 100%, 100% 100%, 18px 18px;
    -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.34) 46%, rgba(0, 0, 0, 0.16) 66%, #000 100%);
    mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.34) 46%, rgba(0, 0, 0, 0.16) 66%, #000 100%);
}

.section-about::after {
    right: -95px;
    bottom: -135px;
    width: 310px;
    height: 310px;
    border: 2px solid rgba(213, 165, 56, 0.54);
    box-shadow: 0 0 0 26px rgba(8, 40, 68, 0.12), 0 0 0 52px rgba(141, 25, 6, 0.14);
    transform: rotate(38deg);
    animation: aboutGeometryDrift 18s ease-in-out -7s infinite;
}

.about-geometry {
    position: absolute;
    z-index: 0;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

.about-geometry-shape {
    --about-geometry-rotate: 0deg;
    --about-geometry-x: 6px;
    --about-geometry-y: -6px;
    position: absolute;
    display: block;
    transform: translate3d(0, 0, 0) rotate(var(--about-geometry-rotate));
    animation: aboutGeometryFloat 15s ease-in-out infinite;
    will-change: transform, opacity;
}

.about-geometry-frame-one {
    --about-geometry-rotate: 43deg;
    --about-geometry-x: 8px;
    --about-geometry-y: -7px;
    top: -88px;
    left: 4%;
    width: 245px;
    height: 245px;
    border: 18px solid rgba(248, 247, 244, 0.14);
    box-shadow: 0 0 0 2px rgba(213, 165, 56, 0.36), inset 0 0 0 2px rgba(141, 25, 6, 0.28);
    animation-duration: 17s;
    animation-delay: -5s;
}

.about-geometry-frame-two {
    --about-geometry-rotate: 45deg;
    --about-geometry-x: -7px;
    --about-geometry-y: 5px;
    right: 4%;
    bottom: 5%;
    width: 170px;
    height: 170px;
    border: 13px solid rgba(8, 40, 68, 0.34);
    box-shadow: 0 0 0 2px rgba(213, 165, 56, 0.34);
    animation-duration: 19s;
    animation-delay: -11s;
}

.about-geometry-block {
    --about-geometry-rotate: -42deg;
    --about-geometry-x: -6px;
    --about-geometry-y: -8px;
    top: 5%;
    right: -70px;
    width: 270px;
    height: 82px;
    background: linear-gradient(90deg, rgba(4, 26, 46, 0.34), rgba(8, 40, 68, 0.10));
    border-top: 1px solid rgba(213, 165, 56, 0.46);
    border-bottom: 1px solid rgba(213, 165, 56, 0.26);
    animation-duration: 14s;
    animation-delay: -3s;
}

.about-geometry-lines {
    --about-geometry-rotate: -43deg;
    --about-geometry-x: 7px;
    --about-geometry-y: 4px;
    left: -50px;
    bottom: 2%;
    width: 340px;
    height: 125px;
    opacity: 0.52;
    background: repeating-linear-gradient(90deg, transparent 0 17px, rgba(213, 165, 56, 0.52) 17px 20px, transparent 20px 31px);
    animation-duration: 20s;
    animation-delay: -13s;
}

.about-geometry-square {
    --about-geometry-rotate: 42deg;
    --about-geometry-x: -5px;
    --about-geometry-y: -5px;
    top: 18%;
    left: 39%;
    width: 96px;
    height: 96px;
    border: 2px solid rgba(4, 26, 46, 0.26);
    background: rgba(141, 25, 6, 0.10);
    opacity: 0.56;
    animation-duration: 16s;
    animation-delay: -8s;
}

.section-about > .landing-container {
    position: relative;
    z-index: 1;
}

.about-grid {
    display: grid;
    grid-template-columns: minmax(360px, 0.95fr) minmax(400px, 1.05fr);
    gap: clamp(48px, 7vw, 104px);
    align-items: center;
}

.about-visual {
    position: relative;
    min-height: 650px;
}

.about-visual-word {
    position: absolute;
    top: 3%;
    left: -3%;
    color: rgba(16, 40, 79, 0.045);
    font-size: clamp(4rem, 8vw, 8.5rem);
    font-weight: 950;
    letter-spacing: -0.08em;
    writing-mode: vertical-rl;
}

.about-photo-primary {
    position: absolute;
    inset: 7% 7% 6% 12%;
    overflow: hidden;
    border: 1px solid rgba(8, 40, 91, 0.17);
    border-radius: 34px;
    background: linear-gradient(145deg, #ffede0, #e2ecf8);
    box-shadow: 0 33px 82px rgba(5, 34, 82, 0.23);
}

.about-photo-primary img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center top;
}

.about-photo-secondary {
    position: absolute;
    right: 0;
    bottom: 0;
    display: grid;
    place-items: center;
    width: 138px;
    height: 138px;
    padding: 18px;
    border: 9px solid #ffffff;
    border-radius: 30px;
    background: var(--faraday-navy-deep);
    box-shadow: 0 20px 46px rgba(16, 40, 79, 0.22);
}

.about-photo-secondary img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    border-radius: 20px;
}

.about-visual-formula {
    position: absolute;
    top: 11%;
    right: 0;
    color: var(--faraday-orange);
    font-size: 1.12rem;
    font-weight: 900;
    letter-spacing: 0.14em;
}

.about-copy {
    position: relative;
    z-index: 1;
}

.about-copy::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: -30px -34px;
    border-radius: 34px;
    background: radial-gradient(circle at 52% 42%, rgba(248, 247, 244, 0.52), rgba(248, 247, 244, 0.24) 58%, transparent 82%);
    pointer-events: none;
}

.section-about .section-eyebrow {
    color: #041a2e;
    font-weight: 900;
    text-shadow: 0 1px 0 rgba(248, 247, 244, 0.48);
}

.about-copy h2 {
    margin: 16px 0 0;
    color: #041a2e;
    font-size: clamp(2.65rem, 4.8vw, 4.7rem);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 1.02;
    text-shadow: 0 2px 2px rgba(248, 247, 244, 0.28);
}

.about-copy p {
    margin: 20px 0 0;
    color: #082844;
    font-size: 1.02rem;
    font-weight: 600;
    line-height: 1.78;
}

.about-copy > p + p {
    margin-top: 14px;
}

.about-points {
    display: grid;
    gap: 12px;
    margin-top: 30px;
}

.about-point {
    display: grid;
    grid-template-columns: 46px 1fr;
    gap: 15px;
    align-items: start;
    padding: 16px 17px;
    border: 1px solid rgba(8, 40, 68, 0.18);
    border-radius: 17px;
    background: rgba(248, 247, 244, 0.95);
    box-shadow: 0 12px 30px rgba(8, 39, 84, 0.09);
}

.about-point > span {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    background: rgba(232, 70, 3, 0.12);
    color: #8d1906;
    font-size: 0.72rem;
    font-weight: 900;
}

.about-point h3 {
    margin: 1px 0 0;
    color: #041a2e;
    font-size: 0.96rem;
    font-weight: 850;
}

.about-point p {
    margin: 5px 0 0;
    color: #29475f;
    font-size: 0.79rem;
    font-weight: 550;
    line-height: 1.55;
}

.reviews-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(82px, 9vw, 126px) 0 clamp(92px, 10vw, 142px);
    background:
        radial-gradient(circle at 12% 18%, rgba(20, 86, 215, 0.13), transparent 28%),
        radial-gradient(circle at 88% 74%, rgba(255, 74, 0, 0.13), transparent 30%),
        radial-gradient(rgba(8, 40, 91, 0.1) 1px, transparent 1px),
        linear-gradient(180deg, #e3edf8 0%, #f3f7fc 58%, #e1ebf6 100%);
    background-size: auto, auto, 30px 30px, auto;
}

.reviews-section::before {
    content: "“";
    position: absolute;
    z-index: 0;
    top: 6%;
    left: 3%;
    color: rgba(16, 40, 79, 0.045);
    font-family: Georgia, serif;
    font-size: clamp(8rem, 18vw, 17rem);
    line-height: 0.8;
    pointer-events: none;
    transform: rotate(-4deg);
    animation: faradayAmbientQuote 24s ease-in-out -9s infinite;
}

.reviews-heading {
    position: relative;
    z-index: 1;
    max-width: 790px;
    text-align: center;
    margin-bottom: 44px;
}

.reviews-heading h2 {
    margin: 14px 0 0;
    color: var(--faraday-navy-deep);
    font-size: clamp(2.6rem, 5vw, 4.55rem);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 1.03;
}

.reviews-heading p {
    max-width: 650px;
    margin: 18px auto 0;
    color: var(--faraday-muted);
    line-height: 1.7;
}

.reviews-glow {
    position: absolute;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    filter: blur(14px);
    pointer-events: none;
}

.reviews-glow-orange { top: -190px; right: -120px; background: rgba(255, 74, 0, 0.13); }
.reviews-glow-blue { bottom: -220px; left: -130px; background: rgba(20, 86, 215, 0.12); }

.reviews-empty-shell {
    position: relative;
    z-index: 1;
    width: min(760px, calc(100% - 32px));
    margin: 0 auto;
    padding: 1px;
    border-radius: 24px;
    background: linear-gradient(100deg, rgba(255, 78, 0, 0.32), rgba(20, 86, 215, 0.23));
}

.reviews-empty-track {
    padding: 28px;
    border-radius: 23px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 20px 54px rgba(16, 40, 79, 0.08);
}

.reviews-empty-card {
    display: grid;
    grid-template-columns: 58px 1fr;
    gap: 18px;
    align-items: center;
    max-width: 590px;
    margin: 0 auto;
}

.reviews-quote {
    color: var(--faraday-orange);
    font-family: Georgia, serif;
    font-size: 5rem;
    line-height: 0.7;
}

.reviews-empty-card strong { color: var(--faraday-navy-deep); font-size: 1.1rem; }
.reviews-empty-card p { margin: 7px 0 0; color: var(--faraday-muted); line-height: 1.6; }

.reviews-marquee {
    position: relative;
    z-index: 1;
    width: 100%;
    overflow: hidden;
    padding: 12px 0 30px;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}

.reviews-track {
    display: flex;
    align-items: stretch;
    gap: 24px;
    width: max-content;
    will-change: transform;
}

.reviews-group {
    display: flex;
    flex: 0 0 auto;
    align-items: stretch;
    gap: 24px;
}

.reviews-marquee.is-animated .reviews-track {
    animation: reviews-marquee-scroll var(--reviews-duration, 44s) linear infinite;
}

.reviews-marquee.is-animated:hover .reviews-track {
    animation-play-state: paused;
}

.reviews-marquee.is-static,
.reviews-marquee.is-single {
    width: min(1180px, calc(100% - 32px));
    margin: 0 auto;
    overflow: visible;
    -webkit-mask-image: none;
    mask-image: none;
}

.reviews-marquee.is-static .reviews-track,
.reviews-marquee.is-single .reviews-track {
    width: 100%;
    justify-content: center;
}

.reviews-marquee.is-static .reviews-group {
    flex-wrap: nowrap;
    justify-content: center;
}

.review-card {
    display: flex;
    flex: 0 0 clamp(330px, 28vw, 370px);
    flex-direction: column;
    box-sizing: border-box;
    min-height: 260px;
    padding: 30px;
    border: 1px solid rgba(8, 40, 91, 0.15);
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.985);
    box-shadow: 0 21px 50px rgba(5, 34, 82, 0.14);
    transition: transform 340ms ease, box-shadow 340ms ease;
}

.review-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 27px 60px rgba(5, 34, 82, 0.2);
}

.review-stars {
    display: flex;
    gap: 4px;
    color: #cbd2dc;
    font-size: 1.24rem;
    letter-spacing: 0.02em;
}

.review-stars .is-filled { color: #ffa800; }

.review-comment {
    margin: 22px 0 28px;
    color: #192b45;
    font-size: 1rem;
    line-height: 1.75;
    overflow-wrap: anywhere;
}

.review-author {
    display: grid;
    gap: 4px;
    margin-top: auto;
    padding-top: 19px;
    border-top: 1px solid rgba(8, 40, 91, 0.15);
}

.review-author strong { color: var(--faraday-navy-deep); font-size: 0.98rem; }
.review-author span { color: var(--faraday-muted); font-size: 0.78rem; font-weight: 700; }

@keyframes reviews-marquee-scroll {
    from { transform: translate3d(0, 0, 0); }
    to { transform: translate3d(calc(-1 * var(--reviews-distance)), 0, 0); }
}

.section-contact {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 90px 0 100px;
    background:
        radial-gradient(circle at 84% 16%, rgba(3, 24, 61, 0.42), transparent 29%),
        radial-gradient(circle at 12% 84%, rgba(255, 255, 255, 0.12), transparent 30%),
        linear-gradient(135deg, #d93800 0%, #c13200 48%, #942300 100%);
}

.section-contact::before,
.section-contact::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
}

.section-contact::before {
    inset: 0;
    opacity: 0.16;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.22) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.22) 1px, transparent 1px);
    background-size: 54px 54px;
    -webkit-mask-image: linear-gradient(120deg, #000, transparent 68%);
    mask-image: linear-gradient(120deg, #000, transparent 68%);
}

.section-contact::after {
    right: -150px;
    bottom: -210px;
    width: 430px;
    height: 430px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 50%;
    box-shadow: 0 0 0 72px rgba(7, 21, 45, 0.07);
}

.section-contact > .landing-container {
    position: relative;
    z-index: 1;
}

.contact-grid {
    display: grid;
    grid-template-columns: minmax(300px, 1fr) minmax(320px, 0.9fr);
    gap: 58px;
    align-items: start;
}

.contact-info {
    color: var(--landing-white);
    padding-right: 40px;
    border-right: 3px solid rgba(255, 255, 255, 0.78);
}

.brand-mark-light {
    margin-bottom: 26px;
}

.contact-info h2 {
    margin: 0 0 22px;
    font-size: clamp(2.4rem, 5vw, 3.6rem);
    font-weight: 900;
}

.contact-info p {
    margin: 0 0 24px;
    line-height: 1.85;
    color: rgba(255, 255, 255, 0.94);
    max-width: 640px;
}

.contact-data {
    display: grid;
    gap: 18px;
}

.contact-data div {
    padding: 18px 22px;
    background: rgba(255, 255, 255, 0.11);
    border-radius: 18px;
}

.contact-data span {
    display: block;
    font-size: 0.92rem;
    color: rgba(255, 255, 255, 0.82);
}

.contact-data strong {
    display: block;
    margin-top: 6px;
    font-size: 1.15rem;
}

.contact-form-panel {
    color: var(--landing-white);
}

.contact-form-panel h3 {
    margin: 0 0 24px;
    text-align: center;
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 900;
}

.contact-form {
    display: grid;
    gap: 18px;
}

.contact-form input {
    width: 100%;
    height: 62px;
    border: none;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.97);
    padding: 0 24px;
    color: #704532;
    font-size: 1.08rem;
    font-weight: 600;
    outline: none;
    box-shadow: 0 10px 18px rgba(0, 0, 0, 0.08);
}

.contact-form input:focus {
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.3);
}

.contact-form button {
    justify-self: center;
    min-width: 180px;
    height: 58px;
    border: none;
    border-radius: 999px;
    background: var(--landing-white);
    color: var(--landing-orange);
    font-weight: 900;
    font-size: 1.15rem;
    cursor: pointer;
    box-shadow: 0 12px 22px rgba(0, 0, 0, 0.12);
    transition: transform 0.34s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.34s ease;
}

.contact-form button:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 30px rgba(0, 0, 0, 0.18);
}

.contact-form-message {
    min-height: 26px;
    text-align: center;
    font-weight: 700;
    color: var(--landing-white);
}

.contact-form-message.is-visible {
    padding-top: 6px;
}

@media (max-width: 1120px) {
    .about-grid,
    .contact-grid {
        grid-template-columns: 1fr;
    }

    .about-copy,
    .contact-info {
        text-align: center;
    }

    .about-visual { width: min(650px, 100%); margin: 0 auto; }
    .about-copy { max-width: 760px; margin: 0 auto; }
    .about-point { text-align: left; }

    .contact-info p {
        margin-left: auto;
        margin-right: auto;
    }

    .contact-info {
        padding-right: 0;
        border-right: none;
        border-bottom: 3px solid rgba(255, 255, 255, 0.78);
        padding-bottom: 34px;
    }

    .brand-mark-light {
        justify-content: center;
    }
}

@media (max-width: 900px) {
    .landing-nav {
        position: absolute;
        top: calc(100% + 8px);
        right: 20px;
        left: 20px;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        background: rgba(255, 101, 0, 0.98);
        border-radius: 22px;
        padding: 18px;
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.16);
        opacity: 0;
        pointer-events: none;
        transform: translateY(-8px);
        transition: opacity 0.34s cubic-bezier(0.16, 1, 0.3, 1), transform 0.34s cubic-bezier(0.16, 1, 0.3, 1);
    }

    .landing-nav.is-open {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }

    .menu-toggle {
        display: block;
    }

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

    .video-frame {
        aspect-ratio: 16 / 9;
    }
}

@media (max-width: 640px) {
    .landing-container {
        width: min(var(--landing-container), calc(100% - 24px));
    }

    .header-inner {
        min-height: 84px;
        gap: 16px;
    }

    .brand-mark img {
        width: 62px;
        height: 62px;
    }

    .brand-title {
        font-size: 1.6rem;
    }

    .brand-subtitle {
        font-size: 1.1rem;
    }

    .hero-arrow {
        width: 46px;
        height: 46px;
    }

    .hero-socials {
        right: 12px;
        bottom: 16px;
    }

    .hero-socials a {
        width: 38px;
        height: 38px;
    }

    .section-videos,
    .section-about,
    .section-contact {
        padding: 70px 0;
    }

    .section-tag h2,
    .section-chip {
        font-size: 1.05rem;
    }

    .contact-form input {
        height: 56px;
        font-size: 1rem;
    }

    .btn-mas-informacion {
        border-radius: 10px;
    }
}

/* ================================================================
   FARADAY DESIGN SYSTEM · LANDING ETAPA 1
   Navbar, hero principal y transición hacia campañas
   ================================================================ */
:root {
    --faraday-orange: #d93800;
    --faraday-orange-dark: #ad2f00;
    --faraday-orange-pale: #ffede0;
    --faraday-navy: #08285b;
    --faraday-navy-deep: #041733;
    --faraday-ink: #07192f;
    --faraday-text: #2c3e5b;
    --faraday-muted: #526781;
    --faraday-surface: #ffffff;
    --faraday-surface-soft: #edf3fa;
    --faraday-border: rgba(8, 34, 76, 0.16);
    --faraday-radius-sm: 12px;
    --faraday-radius-md: 18px;
    --faraday-radius-lg: 28px;
    --faraday-radius-xl: 38px;
    --faraday-shadow-sm: 0 14px 36px rgba(5, 34, 82, 0.15);
    --faraday-shadow-lg: 0 31px 86px rgba(5, 34, 82, 0.22);
    --faraday-container: 1260px;
    --faraday-header-height: 76px;
    --faraday-hero-viewport: 100vh;
    --faraday-transition: 340ms cubic-bezier(0.16, 1, 0.3, 1);
    --landing-container: var(--faraday-container);
}

@supports (height: 100svh) {
    :root { --faraday-hero-viewport: 100svh; }
}

body {
    color: var(--faraday-ink);
    background: var(--faraday-surface);
    overflow-x: hidden;
}

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

.landing-container {
    width: min(var(--faraday-container), calc(100% - 48px));
}

.landing-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(255, 255, 255, 0.82);
    border-bottom: 1px solid transparent;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    transition: background var(--faraday-transition), box-shadow var(--faraday-transition), border-color var(--faraday-transition);
}

.landing-header.is-scrolled {
    background: rgba(255, 255, 255, 0.94);
    border-bottom-color: rgba(15, 29, 50, 0.08);
    box-shadow: 0 8px 28px rgba(16, 40, 79, 0.06);
}

.header-inner {
    min-height: 76px;
    gap: 32px;
}

.brand-mark {
    gap: 12px;
    color: var(--faraday-navy);
    flex-shrink: 0;
}

.brand-mark img {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    box-shadow: 0 8px 22px rgba(16, 40, 79, 0.13);
}

.brand-title {
    font-size: 1.06rem;
    font-weight: 900;
    letter-spacing: -0.025em;
    text-transform: uppercase;
}

.brand-mark-light {
    color: #ffffff;
}

.brand-mark-light .brand-subtitle {
    color: rgba(255, 255, 255, 0.78);
}

.brand-subtitle {
    margin-top: 4px;
    color: var(--faraday-orange-dark);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.landing-nav {
    gap: 6px;
}

.landing-nav a {
    position: relative;
    padding: 11px 12px;
    color: var(--faraday-text);
    font-size: 0.88rem;
    font-weight: 650;
    transition: color var(--faraday-transition), transform var(--faraday-transition), background var(--faraday-transition);
}

.landing-nav > a:not(.nav-button)::after {
    content: "";
    position: absolute;
    right: 12px;
    bottom: 6px;
    left: 12px;
    height: 2px;
    border-radius: 999px;
    background: var(--faraday-orange);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform var(--faraday-transition);
}

.landing-nav > a:not(.nav-button):hover {
    color: var(--faraday-navy);
    opacity: 1;
}

.landing-nav > a:not(.nav-button):hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

.landing-nav .nav-button {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-left: 6px;
    padding: 12px 18px;
    border-radius: var(--faraday-radius-sm);
    background: var(--faraday-orange);
    color: #fff !important;
    box-shadow: 0 10px 24px rgba(255, 78, 0, 0.34);
}

.landing-nav .nav-button:hover {
    background: var(--faraday-orange-dark);
    transform: translateY(-2px);
    opacity: 1;
}

.nav-whatsapp::before {
    width: 18px;
    height: 18px;
    border: 0;
}

.header-login-mobile {
    display: none;
}

.menu-toggle {
    background: var(--faraday-surface-soft);
    border: 1px solid var(--faraday-border);
}

.menu-toggle span:not(.sr-only) {
    background: var(--faraday-navy);
}

.hero-section {
    position: relative;
    display: flex;
    align-items: center;
    min-height: calc(var(--faraday-hero-viewport) - var(--faraday-header-height));
    padding: clamp(44px, 5.5vw, 74px) 0 clamp(56px, 6.5vw, 78px);
    overflow: hidden;
    background:
        radial-gradient(circle at 84% 18%, rgba(232, 70, 3, 0.58), transparent 35%),
        radial-gradient(circle at 68% 84%, rgba(191, 36, 2, 0.32), transparent 34%),
        radial-gradient(circle at 7% 88%, rgba(8, 40, 68, 0.13), transparent 27%),
        linear-gradient(116deg, #f4e7de 0%, #f3d1bf 34%, #ed9067 69%, #d64a18 100%);
}

.hero-section::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 1;
    background-image:
        linear-gradient(126deg, transparent 0 54%, rgba(232, 70, 3, 0.16) 54% 65%, transparent 65% 100%),
        linear-gradient(126deg, transparent 0 67%, rgba(141, 25, 6, 0.14) 67% 76%, transparent 76% 100%),
        linear-gradient(306deg, transparent 0 78%, rgba(191, 36, 2, 0.18) 78% 88%, transparent 88% 100%),
        radial-gradient(circle at 96% 86%, rgba(4, 26, 46, 0.18), transparent 28%),
        radial-gradient(rgba(8, 40, 68, 0.16) 1px, transparent 1px);
    background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 34px 34px;
    -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.42) 48%, #000 100%);
    mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.42) 48%, #000 100%);
}

.hero-section::after {
    content: "π   ∑   √   x²";
    position: absolute;
    z-index: 0;
    bottom: 7%;
    left: 2%;
    color: rgba(16, 40, 79, 0.035);
    font-family: Georgia, serif;
    font-size: clamp(2rem, 4.5vw, 4.8rem);
    letter-spacing: 0.2em;
    white-space: nowrap;
    pointer-events: none;
}

.hero-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(420px, 0.9fr);
    gap: clamp(48px, 7vw, 92px);
    align-items: center;
}

.hero-copy {
    max-width: 710px;
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 13px;
    border: 1px solid rgba(255, 78, 0, 0.34);
    border-radius: 999px;
    background: rgba(255, 237, 224, 0.95);
    color: #8c2a00;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}

.hero-badge > span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--faraday-orange);
    box-shadow: 0 0 0 5px rgba(255, 78, 0, 0.18);
}

.hero-badge b {
    color: var(--faraday-orange);
}

.hero-copy h1 {
    max-width: 700px;
    margin: 24px 0 22px;
    color: var(--faraday-navy-deep);
    font-size: clamp(3.15rem, 5.6vw, 5.35rem);
    font-weight: 900;
    letter-spacing: -0.065em;
    line-height: 0.98;
}

.hero-copy h1 em {
    color: var(--faraday-orange);
    font-style: normal;
}

.hero-description {
    max-width: 640px;
    margin: 0;
    color: var(--faraday-text);
    font-size: clamp(1rem, 1.35vw, 1.14rem);
    line-height: 1.75;
}

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

.hero-cta {
    min-height: 54px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 0 22px;
    border: 1px solid transparent;
    border-radius: 14px;
    font-size: 0.94rem;
    font-weight: 800;
    transition: transform var(--faraday-transition), box-shadow var(--faraday-transition), background var(--faraday-transition), border-color var(--faraday-transition);
}

.hero-cta-primary {
    background: var(--faraday-orange);
    color: #fff;
    box-shadow: 0 14px 32px rgba(255, 78, 0, 0.32);
}

.hero-cta-primary:hover {
    background: var(--faraday-orange-dark);
    box-shadow: 0 18px 38px rgba(255, 78, 0, 0.39);
    transform: translateY(-2px);
}

.hero-cta-secondary {
    border-color: rgba(16, 40, 79, 0.2);
    background: rgba(255, 255, 255, 0.72);
    color: var(--faraday-navy);
}

.hero-cta-secondary:hover {
    border-color: var(--faraday-navy);
    background: #fff;
    transform: translateY(-2px);
}

.hero-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 25px;
    color: var(--faraday-muted);
    font-size: 0.8rem;
    font-weight: 650;
}

.hero-trust span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.hero-trust i {
    width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(255, 78, 0, 0.18);
    color: var(--faraday-orange-dark);
    font-style: normal;
    font-size: 0.68rem;
}

.hero-visual {
    position: relative;
    min-height: 565px;
    display: grid;
    place-items: center;
}

.hero-visual-shape {
    position: absolute;
    width: min(620px, 112%);
    aspect-ratio: 0.92;
    border-radius: 46% 54% 42% 58% / 58% 42% 58% 42%;
    background: linear-gradient(145deg, var(--faraday-orange), #ff8748);
    box-shadow: var(--faraday-shadow-lg);
    transform: rotate(-4deg);
}

.hero-person-frame {
    --hero-person-float-y: -11px;
    position: relative;
    z-index: 2;
    width: min(617px, 112%);
    aspect-ratio: 0.96;
    overflow: hidden;
    border: 8px solid rgba(255, 255, 255, 0.92);
    border-radius: 42% 58% 38% 62% / 54% 38% 62% 46%;
    background: #fff;
    box-shadow: 0 26px 64px rgba(6, 31, 70, 0.27);
    animation: heroPersonFloat 7.4s ease-in-out -0.8s infinite;
    will-change: transform;
}

.hero-person-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 52% 20%;
}

.hero-visual-dots {
    position: absolute;
    z-index: 1;
    top: 4%;
    right: 2%;
    width: 120px;
    height: 120px;
    background-image: radial-gradient(var(--faraday-navy) 2px, transparent 2px);
    background-size: 15px 15px;
    opacity: 0.2;
}

.hero-mini-card {
    --hero-card-float-y: -10px;
    position: absolute;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: 11px;
    min-width: 205px;
    padding: 13px 15px;
    border: 1px solid rgba(255, 255, 255, 0.96);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.97);
    box-shadow: var(--faraday-shadow-sm);
    backdrop-filter: blur(12px);
    animation: heroFloat 7s ease-in-out infinite;
    will-change: transform;
}

.hero-mini-card strong,
.hero-mini-card small {
    display: block;
}

.hero-mini-card strong {
    color: var(--faraday-navy-deep);
    font-size: 0.81rem;
}

.hero-mini-card small {
    margin-top: 3px;
    color: var(--faraday-muted);
    font-size: 0.67rem;
}

.mini-card-icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: var(--faraday-orange-pale);
    color: var(--faraday-orange-dark);
    font-weight: 900;
}

.hero-mini-card-one { --hero-card-float-y: -10px; top: 15%; left: -8%; animation-delay: -1.2s; animation-duration: 7.2s; }
.hero-mini-card-two { --hero-card-float-y: -13px; right: -8%; bottom: 23%; animation-delay: -2.8s; animation-duration: 6.8s; }
.hero-mini-card-three { --hero-card-float-y: -11px; bottom: 7%; left: 1%; animation-delay: -4.1s; animation-duration: 7.6s; }

.hero-orb {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    filter: blur(1px);
}

.hero-orb-one { top: 12%; left: -80px; width: 180px; height: 180px; border: 32px solid rgba(255, 78, 0, 0.12); animation: faradayAmbientFloatA 20s ease-in-out -5s infinite; }
.hero-orb-two { right: 35%; bottom: 7%; width: 56px; height: 56px; background: rgba(16, 40, 79, 0.08); animation: faradayAmbientFloatB 24s ease-in-out -11s infinite; }

/* Figuras geométricas 3D del fondo del hero */
.hero-geometry {
    position: absolute;
    z-index: 1;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    perspective: 1000px;
}

.hero-geometry-shape {
    --shape-rotate: 0deg;
    --shape-float-x: 8px;
    --shape-float-y: -12px;
    position: absolute;
    display: block;
    opacity: 0.72;
    transform: translate3d(0, 0, 0) rotate(var(--shape-rotate));
    animation: heroGeometryFloat 16s cubic-bezier(0.45, 0, 0.55, 1) infinite;
    will-change: transform;
    backface-visibility: hidden;
}

.hero-geometry-ring {
    --shape-rotate: -18deg;
    --shape-float-x: 12px;
    --shape-float-y: -16px;
    top: 11%;
    right: 5%;
    width: clamp(92px, 9vw, 148px);
    aspect-ratio: 1;
    border-radius: 50%;
    background: conic-gradient(from 210deg, #8d1906, var(--faraday-orange), #ff8b55, #bf2402, #8d1906);
    box-shadow: 0 24px 38px rgba(141, 25, 6, 0.22), inset -12px -10px 22px rgba(78, 10, 0, 0.26), inset 9px 8px 16px rgba(255, 255, 255, 0.34);
    -webkit-mask: radial-gradient(circle, transparent 0 39%, #000 41%);
    mask: radial-gradient(circle, transparent 0 39%, #000 41%);
    animation-duration: 19s;
    animation-delay: -7s;
}

.hero-geometry-sphere {
    --shape-float-x: -11px;
    --shape-float-y: 14px;
    top: 22%;
    left: 48%;
    width: clamp(54px, 5vw, 82px);
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle at 31% 27%, #ffb38e 0 7%, #f25c1a 24%, var(--faraday-orange) 49%, #8d1906 82%, #5d0d02 100%);
    box-shadow: 0 20px 34px rgba(141, 25, 6, 0.24), inset 7px 6px 13px rgba(255, 255, 255, 0.26);
    animation-duration: 15s;
    animation-delay: -4s;
}

.hero-geometry-cylinder {
    --shape-rotate: 23deg;
    --shape-float-x: -9px;
    --shape-float-y: -15px;
    right: 27%;
    bottom: 9%;
    width: clamp(48px, 4.8vw, 76px);
    height: clamp(112px, 11vw, 164px);
    border-radius: 50% / 12%;
    background: linear-gradient(90deg, #03192c 0%, var(--faraday-navy) 28%, #19527a 52%, #082844 76%, #03192c 100%);
    box-shadow: 18px 24px 34px rgba(4, 26, 46, 0.22), inset 8px 0 12px rgba(255, 255, 255, 0.12);
    animation-duration: 21s;
    animation-delay: -12s;
}

.hero-geometry-cylinder::before {
    content: "";
    position: absolute;
    top: -1px;
    left: 0;
    width: 100%;
    height: 22%;
    border-radius: 50%;
    background: radial-gradient(ellipse at 42% 36%, #2a6b95, #082844 62%, #03192c 100%);
}

.hero-geometry-cone {
    --shape-rotate: -14deg;
    --shape-float-x: 10px;
    --shape-float-y: 13px;
    bottom: 10%;
    left: 7%;
    width: clamp(76px, 7vw, 112px);
    height: clamp(100px, 9vw, 145px);
    clip-path: polygon(50% 0, 100% 92%, 86% 100%, 14% 100%, 0 92%);
    border-radius: 0 0 50% 50% / 0 0 9% 9%;
    background: linear-gradient(100deg, #8d1906 4%, #e84603 38%, #ff9464 58%, #bf2402 83%, #781204 100%);
    box-shadow: 18px 22px 30px rgba(141, 25, 6, 0.18);
    filter: blur(0.15px);
    animation-duration: 18s;
    animation-delay: -9s;
}

.hero-geometry-prism {
    --shape-rotate: 31deg;
    --shape-float-x: -13px;
    --shape-float-y: -10px;
    top: 15%;
    left: 3%;
    width: clamp(58px, 5vw, 88px);
    aspect-ratio: 1;
    clip-path: polygon(50% 0, 96% 27%, 82% 84%, 26% 100%, 0 54%, 13% 14%);
    background: linear-gradient(135deg, #ff9160 0 24%, var(--faraday-orange) 25% 55%, #a51d03 56% 78%, #6f1205 79% 100%);
    box-shadow: 18px 22px 32px rgba(141, 25, 6, 0.18);
    opacity: 0.48;
    filter: blur(0.3px);
    animation-duration: 22s;
    animation-delay: -15s;
}

.hero-geometry-capsule {
    --shape-rotate: -28deg;
    --shape-float-x: 14px;
    --shape-float-y: 10px;
    top: 48%;
    right: 1.5%;
    width: clamp(42px, 4vw, 65px);
    height: clamp(118px, 11vw, 175px);
    border-radius: 999px;
    background: linear-gradient(90deg, #03192c, #0b3959 30%, #23658c 52%, #082844 76%, #03192c);
    box-shadow: 18px 24px 34px rgba(4, 26, 46, 0.22), inset 8px 4px 12px rgba(255, 255, 255, 0.11);
    opacity: 0.54;
    animation-duration: 20s;
    animation-delay: -6s;
}

.hero-scroll-cue {
    position: absolute;
    z-index: 3;
    bottom: 20px;
    left: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    color: var(--faraday-muted);
    font-size: 0.7rem;
    font-weight: 700;
    transform: translateX(-50%);
}

.hero-scroll-cue i { color: var(--faraday-orange); font-size: 1rem; font-style: normal; }

.hero-entrance {
    opacity: 0;
    transform: translateY(18px);
    animation: heroReveal 900ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
    animation-delay: var(--entrance-delay, 0ms);
}

.hero-visual.hero-entrance {
    transform: translateX(28px) scale(0.985);
    animation-name: heroVisualReveal;
}

.campaigns-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: clamp(76px, 8vw, 112px) 0;
    background:
        linear-gradient(180deg, rgba(232, 70, 3, 0.30) 0%, rgba(232, 70, 3, 0.06) 13%, transparent 24%),
        radial-gradient(circle at 2% 18%, rgba(232, 70, 3, 0.22), transparent 27%),
        radial-gradient(circle at 98% 82%, rgba(191, 36, 2, 0.18), transparent 25%),
        linear-gradient(128deg, #041a2e 0%, #082844 58%, #0b3455 100%);
}

.campaigns-section::before,
.campaigns-section::after {
    content: "";
    position: absolute;
    z-index: 0;
    pointer-events: none;
}

.campaigns-section::before {
    inset: 0;
    background-image:
        linear-gradient(132deg, rgba(232, 70, 3, 0.92) 0 8%, rgba(141, 25, 6, 0.82) 8% 12%, transparent 12% 100%),
        linear-gradient(132deg, transparent 0 13%, rgba(213, 165, 56, 0.55) 13% 13.18%, transparent 13.18% 100%),
        linear-gradient(312deg, rgba(191, 36, 2, 0.52) 0 7%, rgba(232, 70, 3, 0.24) 7% 11%, transparent 11% 100%),
        repeating-linear-gradient(60deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 34px),
        repeating-linear-gradient(-60deg, rgba(255, 255, 255, 0.028) 0 1px, transparent 1px 34px);
    background-size: 100% 100%, 100% 100%, 100% 100%, 59px 34px, 59px 34px;
    -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.56) 30%, rgba(0, 0, 0, 0.22) 52%, rgba(0, 0, 0, 0.72) 100%);
    mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.56) 30%, rgba(0, 0, 0, 0.22) 52%, rgba(0, 0, 0, 0.72) 100%);
}

.campaigns-section::after {
    right: -105px;
    bottom: -145px;
    width: 360px;
    height: 290px;
    border: 1px solid rgba(213, 165, 56, 0.58);
    background: linear-gradient(145deg, rgba(232, 70, 3, 0.68), rgba(141, 25, 6, 0.74));
    box-shadow: 0 0 0 18px rgba(232, 70, 3, 0.08), 0 0 68px rgba(232, 70, 3, 0.15);
    clip-path: polygon(26% 0, 100% 0, 100% 100%, 0 100%);
    transform: rotate(-8deg);
    animation: campaignsGlowBreath 16s ease-in-out infinite;
}

.campaigns-section > .landing-container {
    position: relative;
    z-index: 1;
}

.campaigns-heading {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(240px, 0.7fr);
    gap: 36px;
    align-items: end;
    margin-bottom: 34px;
}

.section-eyebrow {
    display: block;
    margin-bottom: 10px;
    color: var(--faraday-orange-dark);
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.campaigns-section .section-eyebrow {
    color: #d5a538;
}

.campaigns-heading h2 {
    max-width: 760px;
    margin: 0;
    color: #f8f7f4;
    font-size: clamp(2rem, 4vw, 3.25rem);
    letter-spacing: -0.045em;
    line-height: 1.08;
}

.campaigns-heading p {
    margin: 0 0 4px;
    color: rgba(248, 247, 244, 0.78);
    line-height: 1.7;
}

.campaigns-section .hero-carousel,
.campaigns-section .hero-carousel-track {
    min-height: 0;
    aspect-ratio: 16 / 9;
}

.campaigns-section .hero-carousel {
    overflow: hidden;
    border-radius: var(--faraday-radius-xl);
    background: var(--faraday-navy-deep);
    box-shadow: 0 30px 70px rgba(4, 26, 46, 0.42), 0 0 0 1px rgba(213, 165, 56, 0.16);
}

.campaigns-section .hero-slide img {
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
}

.campaigns-section .hero-arrow {
    width: 50px;
    height: 50px;
    background: rgba(8, 26, 54, 0.55);
    color: #fff;
}

.campaigns-section .hero-dots { bottom: 24px; }

.campaigns-section .hero-socials {
    right: max(18px, calc((100vw - var(--faraday-container)) / 2 - 60px));
    bottom: 42px;
}

.campaigns-section .hero-socials a {
    width: 40px;
    height: 40px;
    border: 1px solid var(--faraday-border);
    color: var(--faraday-orange-dark);
    box-shadow: var(--faraday-shadow-sm);
}

.programs-section {
    position: relative;
    padding: clamp(84px, 9vw, 126px) 0 clamp(92px, 10vw, 138px);
    overflow: hidden;
    background:
        linear-gradient(rgba(8, 40, 91, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(8, 40, 91, 0.04) 1px, transparent 1px),
        radial-gradient(circle at 88% 18%, rgba(255, 74, 0, 0.13), transparent 27%),
        radial-gradient(circle at 9% 82%, rgba(20, 86, 215, 0.1), transparent 26%),
        linear-gradient(180deg, #eff5fc 0%, #ffffff 54%, #ebf2fa 100%);
    background-size: 46px 46px, 46px 46px, auto, auto, auto;
}

.programs-heading {
    position: relative;
    z-index: 2;
    max-width: 770px;
    margin-bottom: 42px;
}

.programs-heading h2 {
    margin: 0;
    color: var(--faraday-navy-deep);
    font-size: clamp(2.3rem, 4.5vw, 3.8rem);
    font-weight: 900;
    letter-spacing: -0.052em;
    line-height: 1.05;
}

.programs-heading p {
    max-width: 680px;
    margin: 18px 0 0;
    color: var(--faraday-text);
    font-size: 1rem;
    line-height: 1.75;
}

.programs-grid {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px;
}

.program-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(8, 40, 91, 0.16);
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 19px 46px rgba(5, 34, 82, 0.13);
    transition: transform 340ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 340ms cubic-bezier(0.16, 1, 0.3, 1), border-color 340ms cubic-bezier(0.16, 1, 0.3, 1);
}

.program-card:hover {
    border-color: rgba(255, 78, 0, 0.4);
    box-shadow: 0 27px 60px rgba(5, 34, 82, 0.2);
    transform: translateY(-5px);
}

.program-card-visual {
    position: relative;
    height: 190px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: linear-gradient(145deg, #06275a, #0f58ad);
    transform: scale(1);
    transform-origin: center;
    transition: transform 340ms cubic-bezier(0.16, 1, 0.3, 1);
}

.program-card-visual-image {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.program-card-visual.has-configured-image::before,
.program-card-visual.has-configured-image::after,
.program-card-visual.has-configured-image i,
.program-card-visual.has-configured-image .program-card-symbol {
    display: none;
}

.program-card-visual.has-configured-image .program-card-number {
    z-index: 2;
    padding: 5px 7px;
    border-radius: 8px;
    background: rgba(7, 21, 45, 0.68);
    color: #ffffff;
}

.program-card-secondary .program-card-visual {
    background: linear-gradient(145deg, #f04400, #e85a12);
}

.program-card-primary .program-card-visual {
    background: linear-gradient(145deg, #075874, #008f8c);
}

.program-card-coar .program-card-visual {
    background: linear-gradient(145deg, #321878, #7044d4);
}

.program-card-visual::before,
.program-card-visual::after {
    content: "";
    position: absolute;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.24);
}

.program-card-visual::before {
    width: 170px;
    height: 170px;
    right: -50px;
    top: -55px;
}

.program-card-visual::after {
    width: 94px;
    height: 94px;
    left: -28px;
    bottom: -34px;
    background: rgba(255, 255, 255, 0.06);
}

.program-card-visual i {
    position: absolute;
    inset: 0;
    opacity: 0.18;
    background-image: radial-gradient(#ffffff 1.5px, transparent 1.5px);
    background-size: 18px 18px;
    mask-image: linear-gradient(115deg, transparent 0%, #000 42%, #000 100%);
}

.program-card-number {
    position: absolute;
    top: 18px;
    left: 20px;
    color: rgba(255, 255, 255, 0.66);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.14em;
}

.program-card-symbol {
    position: relative;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 92px;
    height: 92px;
    border: 1px solid rgba(255, 255, 255, 0.32);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
    font-size: 2.15rem;
    font-weight: 900;
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.13);
    backdrop-filter: blur(8px);
    transition: transform 340ms cubic-bezier(0.16, 1, 0.3, 1);
}

.program-card:hover .program-card-visual {
    transform: scale(1.02);
}

.program-card:hover .program-card-symbol {
    transform: translateY(-2px);
}

.program-card-body {
    padding: 25px 23px 26px;
}

.program-category {
    display: inline-flex;
    padding: 7px 10px;
    border-radius: 999px;
    background: var(--faraday-orange-pale);
    color: var(--faraday-orange-dark);
    font-size: 0.64rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.program-card h3 {
    margin: 17px 0 10px;
    color: var(--faraday-navy-deep);
    font-size: 1.38rem;
    letter-spacing: -0.03em;
}

.program-card p {
    min-height: 66px;
    margin: 0;
    color: var(--faraday-text);
    font-size: 0.86rem;
    line-height: 1.65;
}

.program-card-action {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    color: var(--faraday-navy);
    font-size: 0.78rem;
    font-weight: 800;
}

.program-card-action b {
    color: var(--faraday-orange);
    font-size: 1rem;
    transition: transform 340ms cubic-bezier(0.16, 1, 0.3, 1);
}

.program-card:hover .program-card-action b {
    transform: translateX(3px);
}

.programs-decoration {
    position: absolute;
    pointer-events: none;
    border-radius: 50%;
}

.programs-decoration-one {
    top: 80px;
    right: -110px;
    width: 270px;
    height: 270px;
    border: 45px solid rgba(255, 78, 0, 0.07);
    animation: faradayAmbientFloatA 18s ease-in-out -6s infinite;
}

.programs-decoration-two {
    bottom: 40px;
    left: 4%;
    width: 110px;
    height: 110px;
    opacity: 0.16;
    background-image: radial-gradient(var(--faraday-navy) 2px, transparent 2px);
    background-size: 15px 15px;
    animation: faradayAmbientFloatB 22s ease-in-out -10s infinite;
}

.programs-decoration-one::before,
.programs-decoration-two::before {
    position: absolute;
    color: rgba(16, 40, 79, 0.055);
    font-weight: 800;
    line-height: 1;
}

.programs-decoration-one::before {
    content: "∑";
    top: 68%;
    left: -42px;
    font-family: Georgia, serif;
    font-size: 5rem;
}

.programs-decoration-two::before {
    content: "✎";
    right: -74px;
    bottom: -34px;
    color: rgba(255, 78, 0, 0.09);
    font-size: 4.6rem;
    transform: rotate(-12deg);
}

.teachers-section {
    position: relative;
    min-height: var(--teachers-scroll-height, var(--teachers-scroll-vh, 172vh));
    overflow: clip;
    background:
        linear-gradient(rgba(8, 40, 91, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(8, 40, 91, 0.04) 1px, transparent 1px),
        radial-gradient(circle at 82% 28%, rgba(255, 74, 0, 0.1), transparent 28%),
        linear-gradient(180deg, #e4eef9 0%, #d6e5f5 72%, #e0ebf6 100%);
    background-size: 42px 42px, 42px 42px, auto, auto;
}

.teachers-section::before,
.teachers-section::after {
    content: "";
    position: absolute;
    z-index: 3;
    left: 0;
    width: 100%;
    height: 100px;
    pointer-events: none;
}

.teachers-section::before {
    top: 0;
    background: linear-gradient(180deg, #eff5fc 0%, rgba(228, 238, 249, 0) 100%);
}

.teachers-section::after {
    bottom: 0;
    background: linear-gradient(0deg, #e4eef9 0%, rgba(224, 235, 246, 0) 100%);
}

.teachers-scroll-layout {
    position: relative;
    z-index: 4;
    min-height: var(--teachers-scroll-height, var(--teachers-scroll-vh, 172vh));
    display: grid;
    grid-template-columns: minmax(300px, 0.72fr) minmax(480px, 1.08fr);
    gap: clamp(54px, 8vw, 112px);
    align-items: start;
}

.teachers-copy,
.teachers-stage {
    position: sticky;
    top: clamp(108px, 14vh, 150px);
    height: min(680px, calc(100vh - 150px));
}

.teachers-copy {
    align-self: start;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.teachers-copy h2 {
    max-width: 540px;
    margin: 0;
    color: var(--faraday-navy-deep);
    font-size: clamp(2.6rem, 4.7vw, 4.5rem);
    font-weight: 900;
    letter-spacing: -0.06em;
    line-height: 1.01;
}

.teachers-copy p {
    max-width: 520px;
    margin: 22px 0 0;
    color: var(--faraday-text);
    font-size: 1rem;
    line-height: 1.75;
}

.teachers-copy-detail {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-top: 30px;
}

.teachers-copy-detail span {
    width: 46px;
    height: 3px;
    border-radius: 999px;
    background: var(--faraday-orange);
}

.teachers-copy-detail small {
    color: var(--faraday-muted);
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.teachers-stage {
    min-width: 0;
    display: grid;
    place-items: center;
    overflow: hidden;
    isolation: isolate;
}

.teachers-section.teachers-pinned-scroll,
.teachers-pinned-scroll .teachers-scroll-layout {
    min-height: var(--teachers-scroll-height);
    height: var(--teachers-scroll-height);
}

.teachers-pinned-scroll .teachers-copy,
.teachers-pinned-scroll .teachers-stage {
    position: relative;
    top: auto;
    height: 100%;
}

.teacher-card-motion {
    position: relative;
    z-index: 5;
    width: min(430px, 78%);
    flex: 0 0 auto;
    will-change: transform, opacity;
}

.teachers-list {
    position: absolute;
    z-index: 5;
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 30px;
    padding: 92px 0;
    will-change: transform;
}

.teacher-offset-right { margin-right: 3%; margin-left: auto; }
.teacher-offset-left { margin-right: auto; margin-left: 3%; }
.teacher-offset-center { margin-right: auto; margin-left: auto; }

.teacher-card {
    overflow: hidden;
    border: 1px solid rgba(8, 40, 91, 0.17);
    border-radius: 26px;
    background: #ffffff;
    box-shadow: 0 31px 76px rgba(5, 34, 82, 0.22);
    transition: transform 340ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 340ms cubic-bezier(0.16, 1, 0.3, 1), border-color 340ms cubic-bezier(0.16, 1, 0.3, 1);
}

.teacher-card:hover {
    border-color: rgba(255, 78, 0, 0.38);
    box-shadow: 0 37px 90px rgba(5, 34, 82, 0.27);
    transform: translateY(-3px);
}

.teacher-photo {
    position: relative;
    height: clamp(320px, 42vh, 405px);
    overflow: hidden;
    background: #e8eef6;
}

.teacher-photo::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 34%;
    background: linear-gradient(0deg, rgba(8, 26, 54, 0.29), transparent);
    pointer-events: none;
}

.teacher-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 52% 18%;
    transition: transform 340ms cubic-bezier(0.16, 1, 0.3, 1);
}

.teacher-photo.has-fallback {
    display: grid;
    place-items: center;
    background:
        radial-gradient(circle at 78% 22%, rgba(255, 255, 255, 0.18), transparent 24%),
        linear-gradient(145deg, var(--faraday-navy), #16509a);
}

.teacher-avatar-fallback {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    color: #ffffff;
}

.teacher-avatar-fallback span {
    width: 126px;
    height: 126px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 38px;
    background: rgba(255, 255, 255, 0.13);
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.16);
    font-size: 2.55rem;
    font-weight: 900;
    letter-spacing: -0.05em;
    backdrop-filter: blur(8px);
}

.teacher-avatar-fallback small {
    color: rgba(255, 255, 255, 0.76);
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.teacher-card-number {
    position: absolute;
    z-index: 3;
    top: 20px;
    left: 22px;
    display: grid;
    place-items: center;
    width: 43px;
    height: 43px;
    border: 1px solid rgba(255, 255, 255, 0.36);
    border-radius: 13px;
    background: rgba(8, 26, 54, 0.46);
    color: #ffffff;
    font-size: 0.74rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    backdrop-filter: blur(9px);
}

.teacher-card:hover .teacher-photo img {
    transform: scale(1.015);
}

.teacher-photo-accent {
    position: absolute;
    z-index: 2;
    right: 22px;
    bottom: 20px;
    width: 48px;
    height: 4px;
    border-radius: 999px;
    background: var(--faraday-orange);
    transform: scaleX(0.55);
    transform-origin: right;
    transition: transform 340ms cubic-bezier(0.16, 1, 0.3, 1);
}

.teacher-card:hover .teacher-photo-accent {
    transform: scaleX(1);
}

.teacher-info {
    position: relative;
    padding: 24px 27px 27px;
}

.teacher-role {
    color: var(--faraday-orange-dark);
    font-size: 0.67rem;
    font-weight: 850;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.teacher-info h3 {
    margin: 9px 0 5px;
    color: var(--faraday-navy-deep);
    font-size: 1.48rem;
    letter-spacing: -0.035em;
}

.teacher-info p {
    margin: 0;
    color: var(--faraday-muted);
    font-size: 0.88rem;
}

.teacher-info i {
    position: absolute;
    right: 27px;
    bottom: 29px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--faraday-orange);
    box-shadow: 0 0 0 7px rgba(255, 78, 0, 0.17);
}

.teacher-card-shadow {
    position: absolute;
    z-index: -1;
    width: min(410px, 70%);
    height: 68%;
    border: 1px solid rgba(16, 40, 79, 0.08);
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.48);
}

.teacher-card-shadow-one { transform: translate(56px, -26px) rotate(3deg); }
.teacher-card-shadow-two { transform: translate(-54px, 34px) rotate(-3deg); opacity: 0.62; }

.teachers-stage-line {
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(16, 40, 79, 0.14), transparent);
}

.teachers-empty-state {
    position: relative;
    z-index: 5;
    width: min(430px, 82%);
    padding: 56px 34px;
    border: 1px dashed rgba(16, 40, 79, 0.2);
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.66);
    text-align: center;
}

.teachers-empty-state > span {
    width: 74px;
    height: 74px;
    display: grid;
    place-items: center;
    margin: 0 auto 20px;
    border-radius: 22px;
    background: var(--faraday-navy);
    color: #fff;
    font-size: 1.45rem;
    font-weight: 900;
}

.teachers-empty-state strong { display: block; color: var(--faraday-navy-deep); }
.teachers-empty-state p { margin: 8px 0 0; color: var(--faraday-muted); font-size: 0.84rem; }

.teachers-section.teachers-no-scrub {
    min-height: auto;
    padding: clamp(92px, 9vw, 126px) 0;
}

.teachers-no-scrub .teachers-scroll-layout {
    min-height: auto;
}

.teachers-no-scrub .teachers-copy,
.teachers-no-scrub .teachers-stage {
    position: relative;
    top: auto;
    height: auto;
}

.teachers-no-scrub .teachers-stage {
    display: block;
    overflow: visible;
}

.teachers-no-scrub .teachers-list {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    padding: 0;
    transform: none !important;
}

.teachers-no-scrub .teacher-card-motion {
    width: 100%;
    margin: 0;
    transform: none !important;
}

.teachers-no-scrub .teacher-card-shadow {
    display: none;
}

.teachers-background {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

.teachers-blur {
    position: absolute;
    top: 25%;
    right: -110px;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    background: rgba(255, 78, 0, 0.125);
    filter: blur(70px);
    animation: faradayAmbientFloatA 22s ease-in-out -8s infinite;
}

.teachers-dots {
    position: absolute;
    bottom: 12%;
    left: 5%;
    width: 130px;
    height: 130px;
    opacity: 0.12;
    background-image: radial-gradient(var(--faraday-navy) 2px, transparent 2px);
    background-size: 17px 17px;
}

.teachers-formula {
    position: absolute;
    top: 44%;
    left: 3%;
    color: rgba(16, 40, 79, 0.045);
    font-family: Georgia, serif;
    font-size: clamp(4rem, 9vw, 8rem);
    font-weight: 700;
    transform: rotate(-8deg);
    animation: faradayAmbientFormula 20s ease-in-out -12s infinite;
}

.reveal-on-scroll {
    opacity: 1;
    transform: translateY(0);
}

.js .reveal-on-scroll {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity 900ms cubic-bezier(0.16, 1, 0.3, 1), transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
}

.js .reveal-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.js .about-copy .about-point {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 900ms cubic-bezier(0.16, 1, 0.3, 1), transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
    transition-delay: var(--about-delay, 0ms);
}

.js .about-copy.is-visible .about-point {
    opacity: 1;
    transform: translateY(0);
}

.js .about-visual.reveal-on-scroll { transform: translateX(-24px); }
.js .about-visual.reveal-on-scroll.is-visible { transform: translateX(0); }

.js .video-card.reveal-on-scroll {
    transition-delay: var(--video-delay, 0ms);
}

.js .video-card.reveal-on-scroll.is-visible:hover {
    transform: translateY(-3px);
}

.js .clases-feature .clases-copy,
.js .clases-feature .clases-visual {
    opacity: 0;
    transition: opacity 900ms cubic-bezier(0.16, 1, 0.3, 1), transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
}

.js .clases-feature .clases-copy { transform: translateY(18px); }
.js .clases-feature .clases-visual { transform: translateX(22px); transition-delay: 160ms; }

.js .clases-feature.is-visible .clases-copy,
.js .clases-feature.is-visible .clases-visual {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

.js .campaigns-section.reveal-on-scroll,
.js .programs-grid.reveal-on-scroll {
    opacity: 1;
    transform: none;
}

.js .campaigns-section .section-eyebrow,
.js .campaigns-section .campaigns-heading h2,
.js .campaigns-section .campaigns-heading p,
.js .campaigns-section .hero-carousel,
.js .programs-grid .program-card {
    opacity: 0;
    transform: translateY(24px) scale(0.985);
    transition: opacity 1050ms cubic-bezier(0.16, 1, 0.3, 1), transform 1050ms cubic-bezier(0.16, 1, 0.3, 1);
}

.js .programs-heading.reveal-on-scroll {
    opacity: 1;
    transform: none;
}

.js .programs-heading .section-eyebrow,
.js .programs-heading h2,
.js .programs-heading p {
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 900ms cubic-bezier(0.16, 1, 0.3, 1), transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
}

.js .programs-heading.is-visible .section-eyebrow,
.js .programs-heading.is-visible h2,
.js .programs-heading.is-visible p {
    opacity: 1;
    transform: translateY(0);
}

.js .programs-heading.is-visible h2 { transition-delay: 160ms; }
.js .programs-heading.is-visible p { transition-delay: 320ms; }

.js .campaigns-section.is-visible .section-eyebrow,
.js .campaigns-section.is-visible .campaigns-heading h2,
.js .campaigns-section.is-visible .campaigns-heading p,
.js .campaigns-section.is-visible .hero-carousel,
.js .programs-grid.is-visible .program-card {
    opacity: 1;
    transform: translateY(0) scale(1);
}

.js .campaigns-section.is-visible .campaigns-heading h2 { transition-delay: 160ms; }
.js .campaigns-section.is-visible .campaigns-heading p { transition-delay: 320ms; }
.js .campaigns-section.is-visible .hero-carousel { transition-delay: 480ms; }
.js .programs-grid.is-visible .program-card { transition-delay: var(--card-delay, 0ms); }

.js .programs-grid.is-visible .program-card:nth-child(1) { transition-delay: 0ms; }
.js .programs-grid.is-visible .program-card:nth-child(2) { transition-delay: 160ms; }
.js .programs-grid.is-visible .program-card:nth-child(3) { transition-delay: 320ms; }
.js .programs-grid.is-visible .program-card:nth-child(4) { transition-delay: 480ms; }

.js .videos-bento .video-card:nth-child(1) { transition-delay: 0ms; }
.js .videos-bento .video-card:nth-child(2) { transition-delay: 160ms; }
.js .videos-bento .video-card:nth-child(3) { transition-delay: 320ms; }
.js .videos-bento .video-card:nth-child(4) { transition-delay: 480ms; }

.js .about-points .about-point:nth-child(1) { transition-delay: 0ms; }
.js .about-points .about-point:nth-child(2) { transition-delay: 160ms; }
.js .about-points .about-point:nth-child(3) { transition-delay: 320ms; }

@media (hover: hover) and (pointer: fine) {
    .js .programs-grid.is-visible .program-card:hover {
        transform: translateY(-6px) scale(1);
        border-color: rgba(255, 78, 0, 0.4);
        box-shadow: 0 26px 58px rgba(16, 40, 79, 0.14);
    }
}

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

@keyframes heroVisualReveal {
    to { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes heroFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translate3d(0, var(--hero-card-float-y), 0); }
}

@keyframes heroPersonFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translate3d(0, var(--hero-person-float-y), 0); }
}

@keyframes faradayAmbientFloatA {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(4px, -14px, 0); }
}

@keyframes faradayAmbientFloatB {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(-4px, 10px, 0); }
}

@keyframes heroGeometryFloat {
    0%, 100% {
        transform: translate3d(0, 0, 0) rotate(var(--shape-rotate)) scale(1);
    }
    50% {
        transform: translate3d(var(--shape-float-x), var(--shape-float-y), 0) rotate(calc(var(--shape-rotate) + 7deg)) scale(1.025);
    }
}

@keyframes campaignsGlowBreath {
    0%, 100% {
        opacity: 0.82;
        box-shadow: 0 0 0 18px rgba(232, 70, 3, 0.08), 0 0 60px rgba(232, 70, 3, 0.12);
    }
    50% {
        opacity: 0.94;
        box-shadow: 0 0 0 22px rgba(232, 70, 3, 0.10), 0 0 76px rgba(232, 70, 3, 0.18);
    }
}

@keyframes aboutGeometryFloat {
    0%, 100% {
        opacity: 0.72;
        transform: translate3d(0, 0, 0) rotate(var(--about-geometry-rotate));
    }
    50% {
        opacity: 0.9;
        transform: translate3d(var(--about-geometry-x), var(--about-geometry-y), 0) rotate(calc(var(--about-geometry-rotate) + 2deg));
    }
}

@keyframes aboutGeometryDrift {
    0%, 100% { opacity: 0.7; transform: translate3d(0, 0, 0) rotate(38deg); }
    50% { opacity: 0.86; transform: translate3d(-6px, -5px, 0) rotate(40deg); }
}

@keyframes videoDecorationDrift {
    0%, 100% { opacity: 0.66; transform: translate3d(0, 0, 0) rotate(16deg); }
    50% { opacity: 0.86; transform: translate3d(7px, -6px, 0) rotate(18deg); }
}

@keyframes videoBackgroundPulse {
    0%, 100% { opacity: 0.66; transform: scale(1); }
    50% { opacity: 0.82; transform: scale(1.025); }
}

@keyframes faradayAmbientFormula {
    0%, 100% { transform: rotate(-8deg) translate3d(0, 0, 0); }
    50% { transform: rotate(-8deg) translate3d(3px, -10px, 0); }
}

@keyframes faradayAmbientQuote {
    0%, 100% { transform: rotate(-4deg) translate3d(0, 0, 0); }
    50% { transform: rotate(-4deg) translate3d(3px, -7px, 0); }
}

@media (max-width: 1100px) {
    .landing-nav { gap: 1px; }
    .landing-nav a { padding-right: 8px; padding-left: 8px; font-size: 0.82rem; }
    .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(370px, 0.82fr); gap: 36px; }
    .hero-visual { min-height: 500px; }
    .hero-mini-card-one { left: -2%; }
    .hero-mini-card-two { right: -2%; }
    .hero-geometry-ring { right: -2%; }
    .hero-geometry-sphere { left: 45%; opacity: 0.56; }
    .hero-geometry-cylinder { right: 18%; }
    .programs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
    .program-card p { min-height: 0; }
    .teachers-section,
    .teachers-scroll-layout { min-height: var(--teachers-scroll-height, var(--teachers-scroll-vh, 150vh)); }
    .teachers-scroll-layout { grid-template-columns: minmax(270px, 0.7fr) minmax(420px, 1fr); gap: 42px; }
    .teachers-copy,
    .teachers-stage { top: 112px; height: min(620px, calc(100vh - 130px)); }
    .teacher-card-motion { width: min(400px, 84%); }
    .teacher-photo { height: clamp(330px, 43vh, 420px); }
    .videos-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .clases-feature { grid-template-columns: minmax(260px, 0.75fr) minmax(420px, 1.25fr); gap: 34px; }
}

@media (min-width: 901px) and (max-height: 820px) {
    .hero-section {
        padding-top: clamp(26px, 4vh, 34px);
        padding-bottom: clamp(46px, 6vh, 56px);
    }
    .hero-grid { gap: clamp(30px, 4vw, 54px); }
    .hero-copy h1 {
        margin-top: 18px;
        margin-bottom: 16px;
        font-size: clamp(2.85rem, 5vw, 4.3rem);
    }
    .hero-description { line-height: 1.6; }
    .hero-actions { margin-top: 20px; }
    .hero-trust { margin-top: 16px; }
    .hero-visual { min-height: clamp(410px, 62vh, 480px); }
    .hero-mini-card { min-width: 182px; padding: 10px 12px; }
    .hero-mini-card strong { font-size: 0.75rem; }
    .hero-mini-card small { font-size: 0.62rem; }
    .hero-scroll-cue { bottom: 10px; }
}

@media (max-width: 900px) {
    .landing-header { background: rgba(255, 255, 255, 0.96); }
    .header-inner { gap: 12px; }
    .header-login-mobile {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 42px;
        margin-left: auto;
        padding: 0 14px;
        border-radius: 11px;
        background: var(--faraday-orange);
        color: #fff;
        font-size: 0.78rem;
        font-weight: 800;
    }
    .menu-toggle { display: block; width: 44px; height: 44px; flex: 0 0 44px; border-radius: 12px; }
    .landing-nav {
        top: calc(100% + 8px);
        right: 24px;
        left: 24px;
        gap: 3px;
        padding: 14px;
        border: 1px solid var(--faraday-border);
        border-radius: 18px;
        background: rgba(255, 255, 255, 0.98);
        box-shadow: var(--faraday-shadow-lg);
    }
    .landing-nav a { padding: 12px 13px; color: var(--faraday-navy); }
    .landing-nav .nav-button { margin: 4px 0 0; justify-content: center; }
    .landing-nav > a:not(.nav-button)::after { display: none; }
    .hero-section { min-height: auto; padding-top: 58px; }
    .hero-grid { grid-template-columns: 1fr; }
    .hero-copy { max-width: 760px; text-align: center; margin: 0 auto; }
    .hero-badge { margin: 0 auto; }
    .hero-copy h1 { margin-right: auto; margin-left: auto; font-size: clamp(3rem, 9vw, 4.7rem); }
    .hero-description { margin-right: auto; margin-left: auto; }
    .hero-actions, .hero-trust { justify-content: center; }
    .hero-visual { width: min(600px, 100%); min-height: 540px; margin: 6px auto 0; }
    .hero-mini-card-one { left: 2%; }
    .hero-mini-card-two { right: 2%; }
    .campaigns-heading { grid-template-columns: 1fr; gap: 14px; }
    .campaigns-section .hero-socials { display: none; }
    .section-videos::after { right: -90px; bottom: -100px; width: 245px; height: 245px; }
    .videos-decoration { opacity: 0.64; }
    .programs-heading { margin-bottom: 34px; }
    .teachers-section { min-height: auto; padding: 96px 0 102px; }
    .teachers-scroll-layout { min-height: auto; grid-template-columns: 1fr; gap: 54px; }
    .teachers-copy,
    .teachers-stage { position: relative; top: auto; height: auto; }
    .teachers-copy { align-items: center; text-align: center; }
    .teachers-copy h2,
    .teachers-copy p { margin-right: auto; margin-left: auto; }
    .teachers-stage { min-height: 0; display: block; overflow: visible; }
    .teachers-list { position: relative; padding: 0; gap: 22px; }
    .teacher-card-motion { width: min(430px, 82%); }
    .teacher-card-shadow { display: none; }
    .teachers-no-scrub .teachers-scroll-layout { grid-template-columns: 1fr; }
    .teachers-no-scrub .teachers-list { grid-template-columns: 1fr; }
    .clases-feature { grid-template-columns: 1fr; }
    .clases-copy { max-width: 640px; }
    .clases-visual { width: 100%; }
    .modalities-stage { grid-template-columns: 1fr; min-height: 0; gap: 24px; }
    .modality-card-virtual,
    .modality-card-presencial { margin-top: 0; }
    .js .modality-card-virtual.reveal-on-scroll { transform: translateX(-24px); }
    .js .modality-card-presencial.reveal-on-scroll { transform: translateX(24px); }
    .js .modality-card.reveal-on-scroll.is-visible { transform: translateX(0); }
    .hero-section::after { font-size: 2.5rem; opacity: 0.7; }
    .campaigns-section::after { width: 190px; height: 190px; }
    .modalities-section::before { width: 210px; height: 210px; }
    .modalities-section::after { width: 160px; height: 160px; }
    .about-geometry { opacity: 0.72; }
    .about-geometry-frame-one { top: -70px; left: -45px; width: 190px; height: 190px; }
    .about-geometry-frame-two { right: -35px; width: 135px; height: 135px; }
    .about-geometry-block { right: -120px; }
    .about-geometry-square { left: 47%; opacity: 0.38; }
    .reviews-section::before { left: -3%; font-size: 9rem; }
}

@media (max-width: 640px) {
    .landing-container { width: min(var(--faraday-container), calc(100% - 28px)); }
    .header-inner { min-height: 68px; }
    .brand-mark { gap: 8px; }
    .brand-mark img { width: 43px; height: 43px; border-radius: 11px; }
    .brand-title { font-size: 0.82rem; }
    .brand-subtitle { font-size: 0.56rem; }
    .header-login-mobile { min-height: 38px; padding: 0 11px; font-size: 0.7rem; }
    .menu-toggle { width: 40px; height: 40px; flex-basis: 40px; padding: 9px; }
    .landing-nav { right: 14px; left: 14px; }
    .hero-section { padding: 42px 0 76px; }
    .hero-copy h1 { margin-top: 20px; font-size: clamp(2.65rem, 13vw, 3.65rem); letter-spacing: -0.06em; }
    .hero-description { font-size: 0.96rem; line-height: 1.65; }
    .hero-actions { display: grid; grid-template-columns: 1fr; }
    .hero-cta { width: 100%; }
    .hero-trust { gap: 10px; flex-direction: column; align-items: center; }
    .hero-visual { min-height: 390px; margin-top: 12px; }
    .hero-person-frame { width: 82%; }
    .hero-visual-shape { width: 84%; }
    .hero-mini-card { min-width: 0; width: 174px; padding: 10px; }
    .hero-mini-card strong { font-size: 0.7rem; }
    .hero-mini-card small { font-size: 0.58rem; }
    .hero-mini-card-one { top: 11%; left: -1%; }
    .hero-mini-card-two { right: -1%; bottom: 18%; }
    .hero-mini-card-three { bottom: 1%; left: 5%; }
    .hero-person-frame { --hero-person-float-y: -7px; }
    .hero-mini-card-one { --hero-card-float-y: -7px; }
    .hero-mini-card-two { --hero-card-float-y: -9px; }
    .hero-mini-card-three { --hero-card-float-y: -8px; }
    .hero-scroll-cue { display: none; }
    .campaigns-section { padding: 64px 0 74px; }
    .campaigns-heading h2 { font-size: 2rem; }
    .campaigns-section .hero-carousel { border-radius: 20px; }
    .campaigns-section .hero-arrow { width: 40px; height: 40px; }
    .campaigns-section .hero-arrow-prev { left: 10px; }
    .campaigns-section .hero-arrow-next { right: 10px; }
    .campaigns-section .hero-dots { bottom: 12px; gap: 8px; }
    .campaigns-section .hero-dot { width: 10px; height: 10px; }
    .programs-section { padding: 68px 0 82px; }
    .programs-heading h2 { font-size: 2.25rem; }
    .programs-grid { grid-template-columns: 1fr; gap: 18px; }
    .program-card-visual { height: 172px; }
    .program-card-body { padding: 22px 20px 23px; }
    .programs-decoration-one { display: none; }
    .hero-section::after,
    .campaigns-section::before,
    .teachers-formula,
    .section-videos::before,
    .videos-decoration-one,
    .section-about::before,
    .section-contact::after { display: none; }
    .programs-decoration-two { left: 1%; width: 82px; height: 82px; background-size: 13px 13px; }
    .modalities-section::before { left: -140px; }
    .modalities-section::after { right: -105px; }
    .reviews-section::before { top: 4%; left: -8%; font-size: 7rem; }
    .teachers-section { padding: 76px 0 82px; }
    .teachers-copy h2 { font-size: 2.55rem; }
    .teachers-copy p { font-size: 0.94rem; }
    .teachers-stage { min-height: 0; }
    .teacher-card-motion { width: min(390px, 94%); }
    .teacher-photo { height: 360px; }
    .teacher-card-shadow { width: 82%; height: 66%; }
    .teacher-card-shadow-one { transform: translate(24px, -18px) rotate(2deg); }
    .teacher-card-shadow-two { transform: translate(-22px, 22px) rotate(-2deg); }
    .teachers-list { gap: 18px; }
    .videos-heading h2 { font-size: 2.55rem; }
    .videos-heading::before { inset: -20px -16px; border-radius: 24px; }
    .section-videos::after { right: -82px; bottom: -82px; width: 175px; height: 175px; animation: none; }
    .videos-decoration-two { left: -18px; bottom: 24px; width: 58px; height: 58px; opacity: 0.42; animation: none; }
    .videos-bento { grid-template-columns: 1fr; gap: 18px; }
    .video-card { border-radius: 20px; }
    .video-card-copy { padding: 18px 18px 21px; }
    .video-play-button { width: 50px; }
    .video-play-button svg { width: 23px; height: 23px; }
    .landing-video-modal { padding: 14px; }
    .landing-video-modal-dialog { border-radius: 18px; }
    .landing-video-modal-header { min-height: 56px; padding: 9px 10px 9px 16px; }
    .landing-video-modal-header strong { font-size: 0.9rem; }
    .landing-video-modal-close { width: 36px; }
    .section-clases { padding: 64px 0 78px; }
    .clases-feature { gap: 30px; padding: 26px 20px 22px; border-radius: 24px; }
    .clases-copy h2 { font-size: 2.55rem; }
    .clases-visual { padding: 9px; border-radius: 19px; }
    .clases-visual img { border-radius: 13px; }
    .modalities-heading { margin-bottom: 36px; }
    .modalities-heading h2 { font-size: 2.55rem; }
    .modality-card { border-radius: 22px; }
    .modality-copy { padding: 22px 20px 24px; }
    .modality-copy h3 { font-size: 1.65rem; }
    .section-about { padding: 74px 0 82px; }
    .about-copy::before { inset: -22px -18px; border-radius: 26px; }
    .about-geometry { opacity: 0.48; }
    .about-geometry-frame-one { top: -55px; left: -58px; width: 145px; height: 145px; border-width: 11px; }
    .about-geometry-frame-two { right: -52px; bottom: 2%; width: 110px; height: 110px; border-width: 8px; }
    .about-geometry-lines { left: -125px; width: 250px; opacity: 0.34; }
    .about-geometry-block,
    .about-geometry-square { display: none; }
    .about-visual { min-height: 470px; }
    .about-photo-primary { inset: 5% 4% 7% 7%; border-radius: 25px; }
    .about-photo-secondary { width: 96px; height: 96px; padding: 11px; border-width: 6px; border-radius: 23px; }
    .about-visual-word { display: none; }
    .about-copy h2 { font-size: 2.55rem; }
    .about-point { grid-template-columns: 42px 1fr; padding: 14px; }
    .reviews-section { padding: 72px 0 82px; }
    .reviews-heading { margin-bottom: 32px; }
    .reviews-heading h2 { font-size: 2.5rem; }
    .reviews-empty-track { padding: 22px 18px; }
    .reviews-empty-card { grid-template-columns: 42px 1fr; gap: 12px; }
    .reviews-quote { font-size: 4rem; }
    .reviews-marquee {
        width: 100%;
        overflow: hidden;
        padding: 8px 18px 24px;
        box-sizing: border-box;
        -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
        mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
    }
    .reviews-marquee.is-static,
    .reviews-marquee.is-single,
    .reviews-marquee.is-manual {
        width: 100%;
        overflow-x: auto;
        -webkit-mask-image: none;
        mask-image: none;
        scroll-snap-type: x proximity;
        scrollbar-width: thin;
    }
    .reviews-marquee.is-single { overflow: visible; }
    .reviews-marquee .reviews-track { width: max-content; }
    .reviews-marquee.is-static .reviews-track {
        width: max-content;
        justify-content: flex-start;
    }
    .reviews-marquee.is-single .reviews-track {
        width: 100%;
        justify-content: center;
    }
    .reviews-marquee .reviews-group { flex-wrap: nowrap; }
    .review-card {
        flex-basis: min(84vw, 350px);
        min-height: 240px;
        padding: 25px;
        scroll-snap-align: center;
    }
}

@media (max-width: 767px) {
    .hero-geometry { opacity: 0.62; }
    .hero-geometry-ring { top: 8%; right: -34px; width: 92px; }
    .hero-geometry-sphere { top: 34%; left: -18px; width: 54px; }
    .hero-geometry-cylinder { right: 5%; bottom: 8%; height: 104px; }
    .hero-geometry-cone { bottom: 3%; left: -18px; width: 70px; height: 92px; }
    .hero-geometry-prism,
    .hero-geometry-capsule { display: none; }
    .review-card { flex-basis: min(84vw, 320px); }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
    .reviews-marquee {
        overflow-x: auto;
        padding-inline: 18px;
        -webkit-mask-image: none;
        mask-image: none;
    }
    .reviews-marquee .reviews-track { animation: none !important; transform: none !important; }
    .review-card:hover { transform: none; }
    .hero-orb,
    .hero-geometry-shape,
    .about-geometry-shape,
    .section-about::after,
    .programs-decoration,
    .teachers-blur,
    .teachers-formula,
    .modalities-section::before,
    .modalities-section::after,
    .reviews-section::before { animation: none !important; }
    .hero-person-frame,
    .hero-mini-card { animation: none !important; transform: none !important; }
    .hero-entrance,
    .hero-visual.hero-entrance,
    .reveal-on-scroll,
    .js .campaigns-section .section-eyebrow,
    .js .campaigns-section .campaigns-heading h2,
    .js .campaigns-section .campaigns-heading p,
    .js .campaigns-section .hero-carousel,
    .js .programs-heading .section-eyebrow,
    .js .programs-heading h2,
    .js .programs-heading p,
    .js .programs-grid .program-card {
        opacity: 1;
        transform: none;
    }
    .program-card:hover,
    .program-card:hover .program-card-visual,
    .program-card:hover .program-card-symbol,
    .program-card:hover .program-card-action b {
        transform: none !important;
    }
    .teachers-section,
    .teachers-scroll-layout { min-height: auto; }
    .teachers-section { padding: 90px 0; }
    .teachers-scroll-layout { grid-template-columns: 1fr; gap: 50px; }
    .teachers-copy,
    .teachers-stage { position: relative; top: auto; height: auto; }
    .teachers-stage { min-height: 0; overflow: visible; }
    .teachers-list { position: relative; padding: 0; transform: none !important; }
    .teacher-card-motion { opacity: 1 !important; transform: none !important; }
}