/* Animated opening: one shared image coordinate system for the landscape and flows. */
.hero.hero-cinematic{isolation:isolate;background:#102722;color:#fff;min-height:min(900px,calc(100svh - 84px));padding:27px 5% 0;display:flex;flex-direction:column}
.hero-landscape{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none;background:#102722}
.hero-landscape-frame{display:block;width:100%;height:100%;animation:landscape-drift 26s ease-in-out infinite alternate;transform-origin:61% 44%;will-change:transform}
.hero-cinematic:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(8,24,22,.94) 0%,rgba(8,24,22,.85) 28%,rgba(8,24,22,.4) 54%,rgba(8,24,22,.06) 83%),linear-gradient(0deg,rgba(8,24,22,.82),transparent 32%,transparent 78%,rgba(8,24,22,.3))}
.hero-cinematic .hero-overline{position:relative;z-index:1;color:#e4ede9;font-size:12px;line-height:1.5}
.hero-cinematic .hero-overline>span:last-child{color:#fff}
.hero-cinematic .hero-main{display:flex;align-items:center;min-height:600px;padding:20px 0 35px;flex:1;width:100%;margin:0;max-width:1600px}
.hero-cinematic .hero-copy{max-width:650px;width:54%;padding:0}
.hero-cinematic .hero-copy h1{font-size:clamp(52px,5vw,76px);color:#fff;line-height:1.06;letter-spacing:-2.5px;margin:22px 0 26px;text-shadow:0 2px 25px #0a1f1940}
.hero-cinematic .hero-copy h1 span{color:#e9bb7a}
.hero-cinematic .hero-copy p{font-size:20px;line-height:1.65;max-width:560px;color:#edf3ef;margin-bottom:28px}
.hero-cinematic .hero-bottom{position:relative;left:auto;right:auto;bottom:auto;z-index:1;width:100%;color:#e4ede9;border-color:#ffffff45;margin-top:auto;padding:21px 0 24px;flex-wrap:wrap}
.hero-cinematic .hero-bottom a{color:#fff}
.hero-motion-toggle{display:inline-flex;align-items:center;gap:12px;border:1px solid #ffffff66;background:#10272277;color:#fff;border-radius:24px;font-size:13px;line-height:1.4;padding:10px 15px;min-height:42px;backdrop-filter:blur(10px)}
.hero-motion-toggle:hover{background:#27443dbb}.hero-motion-toggle:focus-visible{outline:2px solid #e9bb7a;outline-offset:5px}
.hero-flow{fill:none;stroke:#c2edff;stroke-width:2.8;stroke-linecap:round;stroke-dasharray:1 120 14 240 2 310 7 306;opacity:.85;filter:drop-shadow(0 0 7px #59bcff);animation:flow-travel 9s linear infinite;vector-effect:non-scaling-stroke}
.hero-flow-soft{stroke:#64c7ff;stroke-width:7;opacity:.32;animation-delay:-4.5s;filter:blur(4px)}
.hero-flow-outgoing{animation-duration:7s;animation-delay:-2s}.hero-flow-upper{animation-duration:8s;animation-delay:-5s;opacity:.55}
.hero-cinematic.is-paused .hero-landscape-frame,.hero-cinematic.is-paused .hero-flow{animation-play-state:paused}
@keyframes landscape-drift{from{transform:scale(1.025) translate3d(0,0,0)}to{transform:scale(1.105) translate3d(-.8%,.5%,0)}}
@keyframes flow-travel{to{stroke-dashoffset:-1000}}
@media(min-width:1800px){.hero-cinematic .hero-main{min-height:650px}}
@media(max-width:1000px){.hero-cinematic .hero-copy{width:65%}.hero-cinematic .hero-copy h1{font-size:58px}.hero-cinematic .hero-main{min-height:570px}.hero-cinematic:after{background:linear-gradient(90deg,#081816ed,#081816b5 50%,#08181625),linear-gradient(0deg,#081816d9,transparent 50%)}}
@media(max-width:760px){.hero.hero-cinematic{min-height:calc(100svh - 86px);padding:22px 6% 0}.hero-cinematic .hero-main{min-height:0;padding:30px 0 38px}.hero-cinematic .hero-copy{max-width:540px;width:100%}.hero-cinematic .hero-copy h1{font-size:clamp(43px,10.5vw,62px);letter-spacing:-1.8px;line-height:1.08;margin:12px 0 24px}.hero-cinematic .hero-copy p{font-size:18px;line-height:1.65;max-width:470px}.hero-cinematic .hero-overline{font-size:10px}.hero-cinematic .hero-overline>span:last-child{display:none}.hero-cinematic:after{background:linear-gradient(90deg,#081816ed,#081816ba 65%,#08181670),linear-gradient(0deg,#081816d9,transparent 55%)}.hero-cinematic .hero-bottom{gap:18px;padding:18px 0 22px}.hero-cinematic .hero-bottom>span:first-child{width:100%}.hero-cinematic .hero-bottom a{font-size:12px}.hero-cinematic .hero-bottom a span{margin-left:14px}.hero-motion-toggle{font-size:11px;padding:10px 12px}.hero-flow{stroke-width:2}}
@media(prefers-reduced-motion:reduce){.hero-cinematic .hero-landscape-frame,.hero-cinematic .hero-flow{animation:none;transform:none}.hero-flow{display:none}}

/* Original colour logo, rendered without its black matte. */
.hero-cinematic .hero-main{max-width:none;justify-content:space-between;gap:5%}
.hero-brand-display{position:relative;isolation:isolate;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 1 43%;width:43%;max-width:570px;margin:0 0 0 auto;padding:18px 15px 26px}
.hero-brand-display:before{content:'';position:absolute;inset:-12% -18%;z-index:-1;background:radial-gradient(ellipse,#071c17a6 12%,#071c1770 45%,#071c1700 71%);pointer-events:none}
.hero-brand-display>img{display:block;width:100%;height:auto;filter:drop-shadow(0 2px 2px #0009) drop-shadow(0 0 12px #f3e3bd20)}
.hero-brand-display .hero-brand-motto{white-space:nowrap;margin:15px 0 0;font-size:clamp(25px,2.6vw,43px);line-height:1.2;letter-spacing:.3px;text-align:center;text-shadow:0 2px 12px #00160fcc}
.hero-brand-motto>span{color:#e8af62;font-style:italic;font-weight:400}.hero-brand-motto>strong{color:#9acbfa;font-weight:700}
@media(min-width:1800px){.hero-brand-display{max-width:650px}}
@media(max-width:1000px) and (min-width:761px){.hero-cinematic .hero-copy{width:57%}.hero-brand-display{width:38%;flex-basis:38%;padding:12px 0}.hero-brand-display .hero-brand-motto{font-size:26px}}
@media(max-width:760px){.hero-cinematic .hero-main{flex-direction:column;align-items:flex-start;gap:32px}.hero-cinematic .hero-copy{width:100%}.hero-brand-display{width:min(75%,360px);flex-basis:auto;margin:0 auto;padding:0 0 15px}.hero-brand-display .hero-brand-motto{font-size:clamp(25px,6.5vw,32px);margin-top:12px}}
