/* Portada panorámica: fotografía real, navegación transparente y lectura abierta. */
#hero{min-height:max(760px,100svh);padding:0;background:#171a1c;border-radius:0;isolation:isolate;justify-content:flex-start}
#hero .hero-bg{background:none;filter:none;position:absolute;inset:0;z-index:-2}
#hero .hero-bg picture,#hero .hero-bg img{display:block;width:100%;height:100%}
#hero .hero-bg img{position:absolute;bottom:0;height:100%;object-fit:cover;object-position:50% 45%;filter:saturate(.94) contrast(1.015)}
#hero .hero-bg::after{background:linear-gradient(90deg,rgba(8,12,14,.8),rgba(8,12,14,.38) 39%,rgba(8,12,14,.03) 72%),linear-gradient(180deg,rgba(8,12,14,.34),transparent 28%,transparent 62%,rgba(8,12,14,.78));}
#hero .hero-noise{display:none}
#hero #nav,#hero #nav.scrolled{position:relative;inset:auto;width:100%;margin:0;padding:0;background:transparent;border:0;box-shadow:none;backdrop-filter:none;z-index:5}
#hero #nav .nav-wrap{width:100%;max-width:1536px;padding:32px clamp(24px,4.4vw,68px);grid-template-columns:auto 1fr;gap:24px;align-items:center;background:transparent}
#hero #nav .nav-logo{font-size:48px;letter-spacing:2px;color:#fff}
#hero #nav .nav-links{gap:25px}
#hero #nav .nav-links a{font-size:13px;letter-spacing:.15px;text-transform:none;color:#fff}
#hero #nav .nav-links>li:last-child{display:none}
#hero .hero-content{width:100%;max-width:1536px;padding:80px clamp(24px,4.4vw,68px) 44px;margin:auto auto 0;}
#hero .hero-headline{font-weight:400;letter-spacing:0;line-height:.98;margin:0;max-width:650px;}
#hero .hero-headline .line{overflow:visible;line-height:1}
#hero .hero-headline .line span{opacity:1;transform:none;animation:panorama-in .65s ease-out both;color:#fff}
#hero .hero-headline .l1{font-size:clamp(42px,4.4vw,68px);margin-bottom:7px}
#hero .hero-headline .l2{font-size:clamp(80px,8vw,122px)}
#hero .hero-headline .l3{font-size:clamp(96px,9.4vw,145px)}
#hero .hero-headline .l3 span{color:#e51b25;animation-delay:.08s}
#hero .hero-sub-row{margin-top:22px;gap:22px;opacity:1;transform:none;animation:panorama-in .7s .12s both;display:flex;align-items:flex-start;flex-direction:column}
#hero .hero-desc{max-width:570px;color:#f4f4f2;font-size:18px;line-height:1.55;text-wrap:pretty}
#hero .hero-actions{gap:14px;flex-wrap:wrap;width:auto}
#hero .hero-actions .btn{border-radius:10px;text-transform:none;letter-spacing:0;font-size:16px;font-weight:600;min-height:54px;padding:15px 30px;min-width:174px;justify-content:center;flex:none}
#hero .hero-actions .btn-ghost{border-color:#ffffffb0;background:#11141628}
.panorama-bottom{position:relative;z-index:2;display:grid;grid-template-columns:1fr 72px 1fr;align-items:center;gap:20px;margin:0 auto;padding:0 clamp(24px,4.4vw,68px) 25px;max-width:1536px;width:100%;color:#fff;min-height:74px}
.panorama-rule{height:1px;background:#ffffff60}
.panorama-scroll{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:13px;min-height:44px;justify-content:center}
.panorama-scroll svg{width:18px;height:24px;stroke:currentColor;fill:none;stroke-width:1.3}
.panorama-rating{display:flex;justify-content:flex-end;align-items:center;gap:10px;font-size:12px;line-height:1.5;min-height:44px}
.panorama-rating:before{content:'';height:1px;flex:1;background:#ffffff60;margin-right:15px}
.panorama-rating svg{width:24px;height:24px;flex:0 0 24px;fill:#e51b25}
.panorama-rating strong{font-weight:650;white-space:nowrap}
.panorama-rating span{white-space:nowrap}
.panorama-rating-link{display:flex;justify-content:flex-end;align-items:center;gap:inherit;flex-wrap:inherit;min-height:44px;min-width:0;color:inherit}
.panorama-rating-link:hover{text-decoration:underline;text-underline-offset:4px}
.panorama-rating-link:focus-visible{outline:2px solid #fff;outline-offset:4px;border-radius:4px}
@keyframes panorama-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(min-width:941px) and (max-width:1150px){#hero #nav .nav-links{gap:15px}#hero #nav .nav-links a{font-size:12px}#hero #nav .nav-logo{font-size:40px}}
@media(max-width:940px){#hero{min-height:max(760px,100svh)}#hero #nav .nav-wrap{padding:24px 30px}#hero #nav .nav-logo{font-size:38px}#hero .hero-content{padding-inline:30px}#hero .hero-bg img{object-position:60% 45%}.panorama-bottom{padding-inline:30px;grid-template-columns:1fr 54px 1fr;gap:12px}.panorama-rating{gap:7px}.panorama-rating:before{display:none}.panorama-rating span{white-space:normal}.panorama-rating svg{width:20px;flex-basis:20px}}
@media(max-width:640px){#hero{min-height:100svh}#hero #nav .nav-wrap{padding:19px 22px}#hero #nav .nav-logo{font-size:34px}#hero .hero-bg img{object-position:62% center}#hero .hero-bg::after{background:linear-gradient(90deg,#080c0ea6,#080c0e35),linear-gradient(180deg,#080c0e3d,transparent 25%,#080c0e9c 75%,#080c0ed9)}#hero .hero-content{padding:80px 24px 29px}#hero .hero-headline .l1{font-size:39px}#hero .hero-headline .l2{font-size:clamp(68px,18vw,99px)}#hero .hero-headline .l3{font-size:clamp(82px,22vw,119px)}#hero .hero-sub-row{margin-top:19px;gap:22px}#hero .hero-desc{font-size:16px;line-height:1.6;max-width:460px}#hero .hero-actions{width:100%;gap:12px}#hero .hero-actions .btn{font-size:14px;min-width:0;flex:1;padding:14px 12px;min-height:50px}.panorama-bottom{padding:0 24px 20px;grid-template-columns:1fr 54px 1fr;gap:10px;min-height:91px;align-items:center}.panorama-rule{align-self:center}.panorama-rating{justify-content:flex-end;flex-wrap:wrap;gap:1px 6px;text-align:right;font-size:10px}.panorama-rating span{flex-basis:100%;max-width:133px}.panorama-rating svg{width:17px;height:17px;flex-basis:17px}.panorama-scroll{font-size:12px}}
@media(max-width:360px){#hero .hero-content{padding-top:48px}#hero .hero-desc{font-size:15px}.panorama-bottom{padding-inline:20px;gap:6px}}
@media(max-height:650px) and (min-width:641px){#hero .hero-content{padding-top:40px}#hero .hero-headline .l1{font-size:40px}#hero .hero-headline .l2{font-size:80px}#hero .hero-headline .l3{font-size:95px}}
@media(prefers-reduced-motion:reduce){#hero .hero-headline .line span,#hero .hero-sub-row{animation:none!important}}
.wa-float.panorama-in-view{bottom:24px}
/* Desktop: fit the opening composition to the usable browser height at 100% zoom. */
@media(min-width:941px){
 #hero{min-height:100svh}
 #hero #nav .nav-wrap{padding-block:clamp(12px,2.8svh,32px)}
 #hero .hero-content{padding-top:clamp(16px,3svh,60px);padding-bottom:clamp(18px,3.5svh,44px)}
 #hero .hero-headline .l1{font-size:clamp(34px,min(4.4vw,7.5svh),68px)}
 #hero .hero-headline .l2{font-size:clamp(60px,min(8vw,14svh),122px)}
 #hero .hero-headline .l3{font-size:clamp(72px,min(9.4vw,16.5svh),145px)}
 #hero .hero-sub-row{margin-top:clamp(12px,2.5svh,22px);gap:clamp(12px,2.5svh,22px)}
 #hero .hero-desc{font-size:clamp(16px,2.4svh,18px)}
 #hero .hero-actions .btn{min-height:48px;padding-block:12px}
 #hero .panorama-bottom{flex-shrink:0;min-height:64px;padding-bottom:clamp(14px,2.5svh,25px)}
}
@media(max-width:640px){#hero .hero-bg img{height:100%}.wa-float.panorama-in-view{visibility:hidden;opacity:0;pointer-events:none}}