/* Four approved hero directions. Header geometry remains in style.css. */
.hero,.hero-content{min-height:900px}
.hero-content{padding-top:192px;padding-bottom:170px}
.hero h1{font-size:clamp(42px,4.5vw,64px);line-height:1.13;max-width:620px;color:#FFFFFF}
.hero h1 strong{color:#FFFFFF;text-decoration:underline;text-decoration-color:#BD9B54;text-decoration-thickness:3px;text-underline-offset:10px}
.hero .intro{max-width:430px;font-size:20px;line-height:1.65;font-weight:400;color:#FFFFFF}
.hero .hero-shape{left:-74%;top:-175px;width:118%;height:1140px;border-radius:32px;transform:rotate(-45deg);clip-path:none;background:#0E2244;transition:background .45s}
.hero .hero-photo{inset:0;width:100%;background-size:cover;background-position:center;transform:none;filter:saturate(.7) contrast(1.03);opacity:0;transition:opacity .55s ease;pointer-events:none}
.hero .hero-photo.is-active{opacity:1}
.hero .hero-photo[data-photo="0"]{background-size:auto 120%;background-position:left center;filter:saturate(.72) contrast(1.02)}
.hero .hero-photo[data-photo="1"]{filter:saturate(.65) contrast(1.03)}
.hero .hero-photo[data-photo="2"]{transform:scaleX(-1);filter:saturate(.65) contrast(1.03)}
.hero .hero-photo[data-photo="3"]{left:0;width:100%;background-position:40% center;transform:scaleX(-1);filter:saturate(.82) contrast(1.01)}
.hero[data-slide="1"] .hero-shape{background:color-mix(in srgb,#0E2244 45%,#878786 55%)}
.hero[data-slide="2"] .hero-shape{background:#BD9B54}
.hero[data-slide="3"] .hero-shape{background:color-mix(in srgb,#0E2244 65%,#878786 35%)}
.hero:after{background:linear-gradient(180deg,rgba(14,34,68,.85),rgba(14,34,68,0) 185px,rgba(14,34,68,0) 72%,rgba(14,34,68,.9) 100%)}
.hero[data-slide="2"]:after{background:linear-gradient(180deg,#0E2244 0,rgba(14,34,68,.88) 95px,rgba(14,34,68,0) 185px,rgba(14,34,68,0) 70%,rgba(14,34,68,.9) 100%)}
.hero[data-slide="2"] h1,.hero[data-slide="2"] h1 strong,.hero[data-slide="2"] .intro{color:#0E2244}
.hero[data-slide="2"] h1 strong{text-decoration-color:#FFFFFF}
.hero .hero-learn,.hero .hero-learn::before{background:#BD9B54;color:#0E2244;transition:background .22s,color .22s}
.hero .hero-learn{width:272px;min-height:68px;padding:18px 26px;font-size:16px}
.hero[data-slide="2"] .hero-learn,.hero[data-slide="2"] .hero-learn::before{background:#0E2244;color:#FFFFFF}
.hero .hero-learn span{transition:transform .22s}
.hero .hero-learn:hover,.hero .hero-learn:focus-visible,.hero .hero-learn:hover::before,.hero .hero-learn:focus-visible::before{background:#FFFFFF;color:#0E2244}
.hero .hero-learn:hover span,.hero .hero-learn:focus-visible span{transform:translate(4px,-4px)}
.hero-selector{bottom:26px;gap:28px}
@media(max-width:767px){
 .hero,.hero-content{min-height:1120px}.hero-content{padding-top:155px;padding-bottom:400px}
 .hero h1{font-size:38px;line-height:1.13}.hero .intro{font-size:18px;line-height:1.6;max-width:100%}
 .hero .hero-shape{left:-110%;top:-167px;width:180%;height:836px;border-radius:28px;transform:rotate(-35deg)}
 .hero .hero-photo[data-photo]{left:0;width:100%;background-size:cover;background-position:65% bottom;filter:saturate(.8) brightness(1.02)}
 .hero .hero-photo[data-photo="0"]{background-position:53% bottom}.hero .hero-photo[data-photo="3"]{background-size:auto 100%;background-repeat:no-repeat;background-position:30% bottom}
 .hero:after{background:linear-gradient(180deg,rgba(14,34,68,.9),rgba(14,34,68,.2) 200px,rgba(14,34,68,.55) 60%,rgba(14,34,68,.85) 100%)}
 .hero[data-slide="2"]:after{background:linear-gradient(180deg,rgba(14,34,68,.92),rgba(14,34,68,0) 175px,rgba(14,34,68,0) 40%,rgba(14,34,68,.75) 100%)}
 .hero[data-slide="2"] .intro{color:#FFFFFF;text-shadow:0 1px 8px #0E2244}
 .hero-selector{grid-template-columns:1fr 1fr;bottom:22px;gap:8px 24px}.hero .hero-learn{width:250px;min-height:64px}
}
@media(prefers-reduced-motion:reduce){.hero .hero-photo,.hero .hero-shape,.hero .hero-learn,.hero .hero-learn::before,.hero .hero-learn span{transition:none}.hero .hero-learn:hover span,.hero .hero-learn:focus-visible span{transform:none}}

/* Mobile identity: slogan centred in the space between logo and controls. */
@media(max-width:767px){
 header{gap:0}
 header .brand{flex:1;min-width:0;align-self:stretch;position:relative;display:flex;align-items:center;gap:0}
 header .header-monogram{flex:none}
 header .slogan-art{position:absolute;left:calc(50% + 27px);top:50%;transform:translate(-50%,-50%);width:min(150px,calc(100% - 74px));height:60px}
 header .search-toggle{margin-left:0;flex:none}
 header #menu{flex:none}
}
@media(max-width:359px){header .slogan-art{left:calc(50% + 23px);width:min(126px,calc(100% - 62px));height:50px}}

.hero-rotation{position:absolute;bottom:116px;right:48px;z-index:2;min-height:44px;padding:10px 0 10px 16px;background:none;border:0;color:#FFFFFF;font:500 12px/1.4 NJAPoppins,Arial,sans-serif}.hero-rotation:hover{color:#BD9B54}
@media(max-width:767px){.hero-rotation{right:20px;bottom:166px}}
@media(max-width:767px){
 .hero h1{font-size:38px!important;line-height:1.13!important}
 .hero[data-slide="2"] .intro{color:#0E2244;text-shadow:none}
 .hero .hero-photo[data-photo="2"]{background-position:20% bottom}
}
@media(max-width:767px){.hero[data-slide="2"] .hero-shape{width:200%}}
