/* Portada: banner "Federico Froebel 2026" (sección 1 de Inicio) */
.fr2-hero{--navy:#05387a;--yellow:#F2BC3E;--sky:#4F9BF0;position:relative;overflow:hidden;background:var(--navy);color:#fff;font-family:Poppins,sans-serif;min-height:clamp(560px,52vw,780px);display:flex;align-items:center}
.fr2-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(1200px 600px at 10% 20%,rgba(255,255,255,.06),transparent 60%);pointer-events:none}
.fr2-hero__photo{position:absolute;top:0;right:0;bottom:0;width:53.2%;background-size:cover;background-position:left center;background-repeat:no-repeat}
.fr2-hero__inner{position:relative;width:100%;max-width:1200px;margin:0 auto;padding:56px 24px}
.fr2-hero__text{width:min(46%,620px);display:flex;flex-direction:column}
.fr2-hero__title{margin:0;padding:0;font-size:inherit;line-height:1;display:flex;flex-direction:column}
.fr2-hero__logo{display:block;width:100%;max-width:560px;height:auto}
.fr2-hero__year{position:relative;align-self:flex-end;margin:-.02em 6% 0 0;font-weight:800;font-size:clamp(64px,8.6vw,140px);line-height:1;letter-spacing:-.02em;color:var(--yellow)}
.fr2-hero__spark{position:absolute;top:-.46em;right:-.9em;width:.56em;height:auto;color:var(--yellow)}
.fr2-hero__bar{display:block;align-self:flex-end;width:74%;height:clamp(9px,1vw,14px);margin:clamp(10px,1.4vw,20px) 3% 0 0;border-radius:20px;background:var(--yellow)}
.fr2-hero__quote{position:relative;margin:clamp(30px,4vw,56px) 0 0;padding:clamp(22px,2.4vw,34px) clamp(22px,2.6vw,36px);border:0;font-style:italic;quotes:none}
.fr2-hero__quote::before,.fr2-hero__quote::after{content:"";position:absolute;width:70%;height:78%;border:3px solid var(--yellow);pointer-events:none}
.fr2-hero__quote::before{left:0;top:0;border-right:0;border-bottom:0;width:36px}
.fr2-hero__quote::after{right:0;bottom:0;border-left:0;border-top:0;width:36px}
.fr2-hero__quote p{margin:0;font-weight:300;font-size:clamp(16px,1.55vw,24px);line-height:1.35;color:#fff}
.fr2-hero__quote strong,.fr2-hero__quote b{font-weight:700}
.fr2-hero__q{position:absolute;font-style:normal;font-weight:700;font-family:Georgia,"Times New Roman",serif;font-size:clamp(70px,7vw,112px);line-height:1;color:var(--sky)}
.fr2-hero__q--open{left:clamp(24px,2.6vw,36px);top:-.3em}
.fr2-hero__q--close{right:clamp(0px,.6vw,10px);bottom:-.78em}
.fr2-hero__btn{align-self:flex-start;margin-top:34px;background:var(--yellow);color:var(--navy)!important;font-weight:700;font-size:15px;padding:13px 28px;border-radius:40px;text-decoration:none!important;transition:transform .2s,box-shadow .2s}
.fr2-hero__btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.25)}
.fr2-hero__btn:empty{display:none}
@media (prefers-reduced-motion:no-preference){
 .fr2-hero__title,.fr2-hero__bar,.fr2-hero__quote{animation:fr2Up .8s cubic-bezier(.2,.7,.2,1) both}
 .fr2-hero__bar{animation-delay:.15s}.fr2-hero__quote{animation-delay:.3s}
 .fr2-hero__photo{animation:fr2Fade 1.1s ease both}
 @keyframes fr2Up{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
 @keyframes fr2Fade{from{opacity:0}to{opacity:1}}
}
@media (max-width:1024px){.fr2-hero__text{width:52%}.fr2-hero__photo{width:50%}}
@media (max-width:767px){
 .fr2-hero{flex-direction:column;align-items:stretch;min-height:0}
 .fr2-hero__inner{padding:36px 22px 40px}
 .fr2-hero__text{width:100%}
 .fr2-hero__logo{max-width:340px}
 .fr2-hero__year{font-size:clamp(64px,20vw,96px);margin-right:14%}
 .fr2-hero__spark{right:-.72em;top:-.52em}
 .fr2-hero__photo{position:relative;width:100%;height:62vw;max-height:380px;order:2;background-position:62% center;border-top:6px solid var(--yellow);border-radius:60px 0 0 0}
 .fr2-hero__quote p{font-size:16px}
}