/* Aldous-style tile navigation, expressed in the Figma brand. */
body.site-menu-open { overflow: hidden; }
.site-header .nav-utility { margin-left: auto; }
.nav-utility { display: flex; flex-direction: column; text-align: right; text-decoration: none; color: white; white-space: nowrap; }
.nav-utility>span { font-size: 10px; line-height: 1.4; letter-spacing: .5px; }
.nav-utility>strong { font: 23px/1.3 var(--display); font-weight: 400; color: #b4c9e8; }
.site-header .menu-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 14px; margin-left: 0; padding: 13px 16px; border: 1px solid #8195a4; border-radius: 9px; background: transparent; color: white; font: 20px/1 var(--display); transition: background .2s, border-color .2s; }
.site-header .menu-toggle svg { width: 29px; height: 23px; }
.site-header .menu-toggle:is(:hover,:focus-visible) { background: var(--blue); border-color: var(--blue); }
.mega-menu { position: fixed; inset: 0; width: 100%; max-width: none; height: 100dvh; max-height: none; margin: 0; padding: 0; border: 0; background: #080d13; color: white; overflow: auto; overscroll-behavior: contain; scrollbar-color: #6e89a3 #0a1017; }
.mega-menu::backdrop { background: #080d13e8; }
.mega-shell { min-height: 100%; isolation: isolate; position: relative; }
.mega-shell:before { content: ''; position: fixed; inset: 88px 0 0; z-index: -2; background: url('/assets/img/figma/spotlight-backdrop.png') center/cover; opacity: .45; pointer-events: none; }
.mega-shell:after { content: ''; position: fixed; inset: 88px 0 0; z-index: -1; background: linear-gradient(100deg,#0b111be0,#132b3e73 60%,#0a0e14db); pointer-events: none; }
.mega-top { position: sticky; top: 0; z-index: 5; background: #192c3bf5; border-bottom: 1px solid #ffffff1d; backdrop-filter: blur(18px); }
.mega-top-inner { display: flex; align-items: center; min-height: 88px; gap: 25px; }
.mega-top .brand { text-decoration: none; }
.mega-top .mega-phone { margin-left: auto; }
.mega-close { display: inline-flex; gap: 13px; align-items: center; justify-content: center; min-height: 49px; padding: 12px 15px; border: 1px solid #8ba1b4; border-radius: 9px; background: var(--blue); color: white; font: 20px/1 var(--display); }
.mega-close svg { width: 26px; height: 26px; }
.mega-close:hover { background: #526f9b; }
.mega-content { padding-top: 38px; padding-bottom: 28px; }
.mega-intro { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-bottom: 28px; }
.mega-intro h2 { font: 31px/1.25 var(--display); letter-spacing: .2px; }
.mega-intro p { margin: 0; color: #b6c5d1; font-size: 13px; }
.mega-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 22px; }
.mega-card { display: flex; position: relative; isolation: isolate; min-height: 315px; padding: 26px 24px; color: white; background: #111b26; border: 1px solid #73828e; border-radius: 15px; overflow: hidden; text-decoration: none; transition: border-color .32s, transform .32s, box-shadow .32s; }
.mega-card-image { position: absolute; inset: 0; z-index: -3; width: 100%; height: 100%; max-width: none; object-fit: cover; opacity: .28; filter: grayscale(.65); transition: opacity .65s, filter .65s, transform .8s cubic-bezier(.22,.72,.24,1); }
.mega-card-shade { position: absolute; inset: 0; z-index: -2; background: linear-gradient(180deg,#10182369,#080f19cc 58%,#080e17f2); transition: opacity .4s; }
.mega-card--seated .mega-card-image { object-fit: contain; object-position: right bottom; opacity: .32; }
.mega-card--pointing .mega-card-image { object-fit: contain; object-position: 80% bottom; opacity: .38; }
.mega-card--start { border-color: #829fc4; background: #1b2e45; }
.mega-card-index { position: absolute; top: 18px; left: 24px; color: #c6d7e8; opacity: .62; font: 13px/1 var(--display); letter-spacing: 1px; }
.mega-card-stamp { position: absolute; top: 21px; right: 17px; padding: 3px 6px; color: #ed7166; border: 2px solid #cc4b42; border-radius: 4px; font: 12px/1.2 var(--display); rotate: -5deg; transition: rotate .4s, translate .4s; }
.mega-card-copy { display: flex; flex-direction: column; width: 100%; padding-top: 38px; }
.mega-card h3 { font: clamp(28px,2.7vw,39px)/1.2 var(--display); margin: 0 0 21px; max-width: 100%; text-shadow: 0 2px 10px #0008; transition: translate .4s; }
.mega-card p { color: #c7cfd8; font-size: 13px; line-height: 1.7; margin-bottom: 24px; max-width: 290px; text-shadow: 0 1px 6px #000; }
.mega-card-action { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: auto; font: 18px/1.35 var(--display); text-transform: uppercase; }
.mega-card-action .arrow { width: 28px; height: 23px; transition: translate .35s; }
.mega-current { position: absolute; top: 17px; right: 15px; font-size: 9px; letter-spacing: 1px; text-transform: uppercase; color: #d2e2f4; }
.mega-card:is(:hover,:focus-visible) { transform: translateY(-5px); border-color: #e16b5b; box-shadow: 0 10px 30px #0005, inset 0 0 0 1px #bd4d3d; }
.mega-card:is(:hover,:focus-visible) .mega-card-image { opacity: .58; filter: grayscale(0); transform: scale(1.045); }
.mega-card:is(:hover,:focus-visible) h3 { translate: 0 -3px; }
.mega-card:is(:hover,:focus-visible) .mega-card-action .arrow { translate: 5px 0; }
.mega-card:is(:hover,:focus-visible) .mega-card-stamp { rotate: 0deg; translate: 0 -2px; }
.mega-bottom { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; border-top: 1px solid #ffffff29; margin-top: 30px; padding-top: 23px; }
.mega-bottom p { display: inline-flex; align-items: center; gap: 13px; margin: 0; font: 14px/1.3 var(--display); }
.mega-bottom p>span { display: inline-flex; color: var(--blue); }
.mega-bottom p .arrow { width: 21px; height: 17px; }
.mega-bottom>a { display: flex; align-items: center; gap: 10px; margin-left: auto; text-decoration: none; font: 17px/1.3 var(--display); text-transform: uppercase; }
.mega-bottom>a .arrow--circle { width: 18px; height: 18px; }
.mega-bottom>span { width: 100%; color: #899bab; font-size: 9px; letter-spacing: 1px; }
.mega-menu[open] .mega-intro { animation: menu-reveal .5s both; }
.mega-menu[open] .mega-card { animation: menu-reveal .6s cubic-bezier(.22,.72,.24,1) both; animation-delay: calc(var(--menu-order) * 35ms + 55ms); }
@keyframes menu-reveal { from { opacity: 0; translate: 0 22px; } to { opacity: 1; translate: 0 0; } }
@media(min-width:1550px){.mega-card{min-height:360px;padding:30px}.mega-card h3{font-size:43px}.mega-card p{font-size:15px}.mega-card-action{font-size:21px}}
@media(max-width:1150px){.site-header .nav-utility>strong{font-size:21px}.site-header .menu-toggle{font-size:18px;padding:12px}.mega-grid{gap:17px}.mega-card{padding:23px 19px;min-height:310px}.mega-card h3{font-size:32px}.mega-card-index{left:19px}.mega-card-action{font-size:16px}.mega-top-inner{gap:20px}}
@media(max-width:900px){.mega-top-inner{min-height:78px}.mega-top .mega-phone{display:none}.mega-top .mega-close{margin-left:auto}.mega-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mega-card{min-height:285px;padding:26px}.mega-card h3{font-size:36px}.mega-card-index{left:26px}.mega-card-action{font-size:19px}.mega-content{padding-top:30px}.mega-intro h2{font-size:29px}.mega-shell:before,.mega-shell:after{top:78px}.site-header .nav-utility{display:none}.site-header .nav>.button{margin-left:auto}.site-header .menu-toggle{margin-left:0}.mega-card p{max-width:360px}}
@media(max-width:600px){.site-header .nav{justify-content:space-between}.site-header .menu-toggle{margin-left:auto;font-size:17px;gap:9px;padding:10px 11px;min-height:43px}.site-header .menu-toggle svg{width:23px;height:20px}.mega-top-inner{min-height:72px;gap:10px}.mega-top .brand-name{font-size:25px}.mega-close{font-size:0;gap:0;width:44px;min-height:44px;padding:9px;border-radius:7px}.mega-close>span{display:none}.mega-content{padding-top:26px}.mega-intro{display:block;margin-bottom:23px}.mega-intro h2{font-size:29px}.mega-intro p{font-size:12px;margin-top:9px}.mega-grid{gap:15px}.mega-card{min-height:265px;padding:23px 17px;border-radius:11px}.mega-card h3{font-size:29px;margin-bottom:17px}.mega-card p{font-size:12px;line-height:1.65;margin-bottom:20px}.mega-card-index{left:17px;font-size:11px}.mega-card-copy{padding-top:33px}.mega-card-stamp{font-size:10px;right:12px;top:18px}.mega-card-action{font-size:16px;gap:8px}.mega-card-action .arrow{width:24px;height:20px}.mega-shell:before,.mega-shell:after{top:72px}.mega-bottom{gap:20px;padding-top:24px}.mega-bottom>a{margin-left:0}.mega-bottom>span{font-size:8px}.mega-bottom p{font-size:12px;gap:9px}.mega-bottom p .arrow{width:17px;height:14px}.mega-current{font-size:8px;right:10px}.mega-card--seated .mega-card-image{object-position:70% bottom}}
@media(max-width:430px){.mega-grid{grid-template-columns:1fr}.mega-card{min-height:265px;padding:28px}.mega-card h3{font-size:36px;max-width:90%}.mega-card p{font-size:14px;max-width:290px}.mega-card-copy{padding-top:26px}.mega-card-action{font-size:20px}.mega-card-index{left:28px}.mega-card-stamp{font-size:13px;right:21px}.mega-card--seated .mega-card-image{width:115%;height:100%;left:0;object-position:right bottom}.mega-card--pointing .mega-card-image{object-position:90% bottom}}
@media(max-width:360px){.mega-top .brand-name{font-size:21px}.site-header .menu-toggle{font-size:15px;padding:9px;gap:7px}.site-header .menu-toggle svg{width:21px}.mega-card h3{font-size:33px}.mega-card{padding:25px;min-height:270px}.mega-intro h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){.mega-menu[open] .mega-intro,.mega-menu[open] .mega-card{animation:none}.mega-card,.mega-card-image,.mega-card h3,.mega-card-stamp,.mega-card-action .arrow,.site-header .menu-toggle{transition:none}.mega-card:is(:hover,:focus-visible){transform:none}.mega-card:is(:hover,:focus-visible) .mega-card-image{transform:none}.mega-card:is(:hover,:focus-visible) h3,.mega-card:is(:hover,:focus-visible) .mega-card-action .arrow,.mega-card:is(:hover,:focus-visible) .mega-card-stamp{translate:none}}

@media(max-width:600px){.site-header .brand-name{font-size:21px}}
@media(max-width:360px){.site-header .brand-name{font-size:19px}}

@media(max-width:360px){.site-header .menu-toggle>span{display:none}.site-header .menu-toggle{min-width:43px}.mega-top .brand-name{font-size:19px}}