/* Portada institucional — estilos aislados */
body:has(#welcomeHome) {
    overflow-x: hidden;
    background: #001c4d;
}

#welcomeHome {
    --home-navy: #032b68;
    --home-navy-deep: #001b49;
    --home-blue: #0b448c;
    --home-yellow: #ffc20a;
    --home-text: #082b66;
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    width: 100%;
    margin: 0;
    padding: 30px 22px 18px;
    overflow: hidden;
    display: block;
    background:
        linear-gradient(133deg, transparent 0 37%, rgba(21, 75, 148, .18) 37.2% 50%, transparent 50.2%),
        radial-gradient(circle at 50% 42%, rgba(14, 67, 141, .28), transparent 43%),
        linear-gradient(135deg, var(--home-navy) 0%, var(--home-navy-deep) 54%, #052f70 100%);
    font-family: "Segoe UI", Aptos, Arial, sans-serif;
}

#welcomeHome::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -150px;
    left: -110px;
    width: 285px;
    height: 310px;
    border-radius: 44% 56% 72% 28% / 42% 45% 55% 58%;
    background: linear-gradient(145deg, #ffd12d, var(--home-yellow));
    transform: rotate(24deg);
    box-shadow: none;
}

#welcomeHome::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: -235px;
    bottom: -255px;
    width: 720px;
    height: 600px;
    border-radius: 68% 0 0 0 / 78% 0 0 0;
    background: linear-gradient(142deg, transparent 0 37%, #0b397c 37.3% 49%, var(--home-yellow) 49.3% 100%);
    transform: rotate(-8deg);
}

#welcomeHome .welcome-layout {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: none;
    min-height: calc(100vh - 48px);
    height: auto;
    margin: 0 auto;
    overflow: visible;
    display: flex;
    flex-direction: column;
    align-items: center;
}

#welcomeHome .welcome-hero {
    position: relative;
    inset: auto;
    width: 100%;
    max-width: 900px;
    margin: 0 auto 26px;
    padding: 0;
    text-align: center;
    color: #fff;
}

#welcomeHome .welcome-flags {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    margin: 0 auto 12px;
}

#welcomeHome .welcome-flags img {
    display: block;
    width: 70px;
    height: 47px;
    object-fit: cover;
    border: 0;
    border-radius: 3px;
    box-shadow: 0 5px 14px rgba(0, 11, 41, .26);
}

#welcomeHome .welcome-brand {
    margin: 0;
    color: #fff;
    font-family: "Segoe UI", Aptos, Arial, sans-serif;
    font-size: clamp(2.65rem, 4vw, 3.8rem);
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -.035em;
    text-shadow: 0 4px 13px rgba(0, 12, 43, .35);
}

#welcomeHome .welcome-brand span {
    color: var(--home-yellow);
}

#welcomeHome .welcome-brand-rule {
    width: 67px;
    height: 3px;
    margin: 14px auto 5px;
    border-radius: 99px;
    background: var(--home-yellow);
}

#welcomeHome .welcome-school-logo {
    display: block;
    width: 94px;
    height: 94px;
    margin: 0 auto 4px;
    object-fit: contain;
}

#welcomeHome .welcome-commitment,
#welcomeHome .welcome-department {
    margin: 0;
    color: rgba(255, 255, 255, .96);
    font-size: 1.08rem;
    font-weight: 400;
    line-height: 1.48;
}

#welcomeHome .welcome-department strong {
    color: var(--home-yellow);
    font-weight: 600;
}

#welcomeHome .welcome-section {
    position: relative;
    inset: auto;
    width: 100%;
    min-height: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

#welcomeHome .welcome-card {
    position: relative;
    width: min(804px, calc(100vw - 44px));
    max-width: 804px;
    height: auto;
    margin: 0 auto;
    padding: 47px 72px 24px;
    overflow: visible;
    text-align: center;
    border: 2px solid var(--home-yellow);
    border-top-width: 9px;
    border-radius: 28px;
    background: linear-gradient(145deg, #fff 0%, #fff 72%, #f8fafc 100%);
    box-shadow: 0 25px 55px rgba(0, 12, 44, .35);
}

#welcomeHome .welcome-card::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: -27px;
    left: calc(50% - 54px);
    width: 108px;
    height: 55px;
    background: #fff;
    clip-path: polygon(0 100%, 50% 0, 100% 100%);
}

#welcomeHome .welcome-card-star {
    position: absolute;
    z-index: 3;
    top: -25px;
    left: calc(50% - 25px);
    width: 50px;
    height: 50px;
    display: grid;
    place-items: center;
    color: var(--home-yellow);
    background: transparent;
    clip-path: none;
    font-size: 30px;
}

#welcomeHome .welcome-title {
    position: relative;
    z-index: 2;
    margin: 0;
    color: var(--home-text);
    font-family: "Segoe UI", Aptos, Arial, sans-serif;
    font-size: clamp(2.8rem, 4.15vw, 3.7rem);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -.035em;
}

#welcomeHome .welcome-title-rule {
    width: 66px;
    height: 4px;
    margin: 13px auto 18px;
    border-radius: 99px;
    background: var(--home-yellow);
}

#welcomeHome .welcome-subtitle {
    max-width: 530px;
    margin: 0 auto 20px;
    color: #183963;
    font-size: 1.12rem;
    font-weight: 500;
    line-height: 1.5;
}

#welcomeHome .welcome-highlight {
    margin: 0 0 18px;
    color: var(--home-text);
    font-size: 1.25rem;
    font-weight: 700;
}

#welcomeHome .welcome-highlight::before,
#welcomeHome .welcome-highlight::after {
    content: "✦";
    display: inline-block;
    margin: 0 18px;
    color: var(--home-yellow);
    font-size: 1.4rem;
}

#welcomeHome .welcome-features {
    width: 100%;
    margin: 0 auto 20px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px;
}

#welcomeHome .feature-item {
    width: 100%;
    min-width: 0;
    min-height: 150px;
    padding: 16px 22px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: var(--home-text);
    font-size: 1.07rem;
    font-weight: 700;
    line-height: 1.24;
    border: 2px solid #dbe5f2;
    border-radius: 18px;
    background: linear-gradient(145deg, #fff, #f5f8fc);
    box-shadow: none;
}

#welcomeHome .feature-item:hover {
    transform: translateY(-3px);
    border-color: var(--home-yellow);
    box-shadow: 0 12px 24px rgba(0, 38, 96, .12);
}

#welcomeHome .feature-icon {
    width: 65px;
    height: 65px;
    display: grid;
    place-items: center;
    color: var(--home-text);
    font-size: 1.65rem;
    border-radius: 50%;
    background: radial-gradient(circle at 32% 28%, #ffe079, var(--home-yellow) 66%, #eba700);
    box-shadow: 0 7px 15px rgba(218, 151, 0, .28);
}

#welcomeHome .welcome-card .btn-primary {
    width: 100%;
    min-height: 66px;
    padding: 15px 30px;
    color: var(--home-text);
    font-size: 1.4rem;
    font-weight: 700;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(100deg, #ffbd05, #ffd331);
    box-shadow: 0 10px 18px rgba(186, 126, 0, .26);
}

#welcomeHome .welcome-card .btn-primary:hover {
    color: var(--home-text);
    background: linear-gradient(100deg, #ffd331, #ffbd05);
    box-shadow: 0 13px 24px rgba(186, 126, 0, .34);
    transform: translateY(-2px);
}

#welcomeHome .welcome-language-card .welcome-title {
    font-size: clamp(1.9rem, 3vw, 2.6rem);
}

#welcomeHome .welcome-language-card .btn-outline {
    color: var(--home-text);
    border-color: var(--home-text);
}

#welcomeHome .welcome-credit {
    position: relative;
    inset: auto;
    width: 100%;
    margin: 17px auto 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    color: rgba(255, 255, 255, .94);
    text-align: center;
    font-size: .86rem;
    line-height: 1.38;
}

#welcomeHome .welcome-credit i,
#welcomeHome .welcome-credit strong {
    color: var(--home-yellow);
}

#welcomeHome .welcome-dots {
    position: absolute;
    z-index: 0;
    width: 120px;
    height: 104px;
    opacity: .7;
    background-image: radial-gradient(#357fd7 3px, transparent 3.5px);
    background-size: 26px 26px;
}

#welcomeHome .welcome-dots-left {
    top: 65px;
    left: 4vw;
}

#welcomeHome .welcome-dots-right {
    top: 58%;
    right: 5vw;
}

#welcomeHome .welcome-speech {
    position: absolute;
    z-index: 0;
    top: 116px;
    right: 6vw;
    width: 205px;
    height: 126px;
    display: grid;
    place-items: center;
    color: var(--home-yellow);
    font-size: 2.4rem;
    border: 4px solid #3b7fd1;
    border-radius: 50%;
}

#welcomeHome .welcome-speech::after {
    content: "";
    position: absolute;
    bottom: -29px;
    left: 30px;
    width: 40px;
    height: 38px;
    border-left: 4px solid #3b7fd1;
    transform: skew(-30deg);
}

#welcomeHome .welcome-plane {
    position: absolute;
    z-index: 0;
    left: 12vw;
    bottom: 235px;
    color: var(--home-yellow);
    font-size: 2.55rem;
    transform: rotate(-40deg);
}

#welcomeHome .welcome-plane::after {
    content: "";
    position: absolute;
    top: 38px;
    right: 20px;
    width: 220px;
    border-top: 3px dashed var(--home-yellow);
    transform: rotate(-42deg);
    transform-origin: right center;
}

#welcomeHome .welcome-orbit {
    position: absolute;
    z-index: 0;
    display: block;
    border: 3px solid rgba(49, 117, 210, .6);
    border-radius: 50%;
}

#welcomeHome .welcome-orbit-left {
    width: 325px;
    height: 325px;
    left: -100px;
    bottom: -82px;
}

#welcomeHome .welcome-orbit-left::before,
#welcomeHome .welcome-orbit-left::after {
    content: "";
    position: absolute;
    inset: 36px -28px;
    border: 2px solid rgba(49, 117, 210, .58);
    border-radius: 50%;
    transform: rotate(34deg);
}

#welcomeHome .welcome-orbit-left::before {
    inset: -28px 55px;
    transform: rotate(-28deg);
}

#welcomeHome .welcome-orbit-right {
    width: 600px;
    height: 600px;
    right: -315px;
    bottom: -370px;
    border-color: var(--home-yellow);
}

@media (max-height: 940px) and (min-width: 701px) {
    #welcomeHome { padding-top: 18px; }
    #welcomeHome .welcome-flags { margin-bottom: 8px; }
    #welcomeHome .welcome-flags img { width: 58px; height: 39px; }
    #welcomeHome .welcome-brand { font-size: 2.9rem; }
    #welcomeHome .welcome-brand-rule { margin: 9px auto 3px; }
    #welcomeHome .welcome-school-logo { width: 72px; height: 72px; }
    #welcomeHome .welcome-commitment,
    #welcomeHome .welcome-department { font-size: .94rem; line-height: 1.35; }
    #welcomeHome .welcome-hero { margin-bottom: 20px; }
    #welcomeHome .welcome-card { padding-top: 39px; }
    #welcomeHome .welcome-title { font-size: 3rem; }
    #welcomeHome .welcome-title-rule { margin: 9px auto 13px; }
    #welcomeHome .welcome-subtitle { margin-bottom: 14px; font-size: 1rem; }
    #welcomeHome .welcome-highlight { margin-bottom: 14px; font-size: 1.12rem; }
    #welcomeHome .feature-item { min-height: 130px; }
    #welcomeHome .feature-icon { width: 58px; height: 58px; }
    #welcomeHome .welcome-card .btn-primary { min-height: 58px; }
    #welcomeHome .welcome-credit { margin-top: 10px; font-size: .75rem; }
}

@media (max-width: 900px) {
    #welcomeHome { padding-inline: 16px; }
    #welcomeHome .welcome-speech,
    #welcomeHome .welcome-plane,
    #welcomeHome .welcome-dots-right { display: none; }
    #welcomeHome .welcome-card { padding-inline: 42px; }
}

@media (max-width: 700px) {
    #welcomeHome {
        min-height: 100svh;
        padding: 22px 14px 16px;
    }
    #welcomeHome::before {
        top: -115px;
        left: -100px;
        width: 220px;
        height: 235px;
    }
    #welcomeHome::after {
        right: -300px;
        bottom: -330px;
    }
    #welcomeHome .welcome-layout { min-height: calc(100svh - 38px); }
    #welcomeHome .welcome-hero { margin-bottom: 25px; }
    #welcomeHome .welcome-flags { gap: 14px; margin-bottom: 10px; }
    #welcomeHome .welcome-flags img { width: 52px; height: 35px; }
    #welcomeHome .welcome-brand { font-size: clamp(2.1rem, 10vw, 3rem); }
    #welcomeHome .welcome-brand-rule { margin-top: 10px; }
    #welcomeHome .welcome-school-logo { width: 70px; height: 70px; }
    #welcomeHome .welcome-commitment,
    #welcomeHome .welcome-department { font-size: .87rem; }
    #welcomeHome .welcome-card {
        width: 100%;
        padding: 40px 20px 22px;
        border-radius: 22px;
    }
    #welcomeHome .welcome-title { font-size: clamp(2.25rem, 12vw, 3rem); }
    #welcomeHome .welcome-subtitle { font-size: .98rem; }
    #welcomeHome .desktop-break { display: none; }
    #welcomeHome .welcome-highlight { font-size: 1.02rem; }
    #welcomeHome .welcome-highlight::before,
    #welcomeHome .welcome-highlight::after { margin-inline: 7px; }
    #welcomeHome .welcome-features { gap: 10px; }
    #welcomeHome .feature-item { min-height: 124px; padding: 13px 7px; font-size: .9rem; }
    #welcomeHome .feature-icon { width: 52px; height: 52px; font-size: 1.35rem; }
    #welcomeHome .welcome-card .btn-primary { min-height: 54px; padding: 13px 15px; font-size: 1.03rem; }
    #welcomeHome .welcome-credit { font-size: .73rem; }
    #welcomeHome .welcome-dots-left { top: 65px; left: 8px; opacity: .35; }
    #welcomeHome .welcome-orbit-left { opacity: .45; }
}