/* Shared navigation and compact footer, based on the owner's reference. */
header.site-header { background:var(--navy-900); border-bottom:1px solid #ffffff12; color:white; }
.site-header .nav { gap:28px; padding-block:20px; }
.site-header .nav-links { gap:30px; }
.site-header .nav-links a, .brand-page .site-header .nav-links a.is-active { color:#fff; white-space:nowrap; font-size:13px; }
.site-header .nav-links a::after, .brand-page .site-header .nav-links a::after { background:var(--brand-orange); }
.site-header .brand { flex-shrink:0; }
.site-logo { position:relative; display:block; width:170px; aspect-ratio:1924 / 592; flex-shrink:0; }
.site-logo img { width:100%; height:100%; object-fit:contain; }
/* The original transparent logo provides the exact wordmark shape.
   Only its navy lettering is reversed for the dark background. */
.site-logo::after { content:""; position:absolute; inset:0; background:white; mask:url("../images/logo-wordmark.png") center / contain no-repeat; -webkit-mask:url("../images/logo-wordmark.png") center / contain no-repeat; clip-path:polygon(21% 0,100% 0,100% 77%,21% 77%); pointer-events:none; }
.site-header .btn, .site-mobile-menu .btn { border-radius:6px; }
.site-header .nav-actions .btn--secondary, .site-mobile-menu .btn--primary { background:var(--brand-orange); color:var(--navy-950); }
.site-header .nav-actions .btn--secondary:hover, .site-mobile-menu .btn--primary:hover { background:#FF762F; }
.site-header .nav-actions .btn--outline { background:transparent; color:white; border:1px solid #ffffff80; gap:8px; }
.site-header .nav-actions .btn--outline:hover { background:#ffffff10; border-color:white; }
.site-header .nav-actions { flex-shrink:0; gap:12px; }
.site-contact { display:flex; align-items:center; gap:10px; }
.site-contact a { display:inline-flex; align-items:center; justify-content:center; gap:8px; color:white; white-space:nowrap; font-size:13px; font-weight:600; }
.site-contact-phone svg { color:var(--brand-orange); }
.site-contact-phone:hover { color:var(--brand-orange); }
.site-contact-whatsapp { border:1px solid #4eac53; border-radius:999px; padding:8px 14px; }
.site-contact-whatsapp svg { color:#56d775; }
.site-contact-whatsapp:hover { background:#ffffff0c; }
.site-header .nav-toggle { color:white; border-color:#ffffff65; }
.site-header .nav-toggle:hover { background:#ffffff15; }
.login-drawer:not(.is-open) { visibility:hidden; }
.site-menu-backdrop { z-index:92; }
.site-mobile-menu { z-index:95; padding-top:110px; background:var(--navy-950); }
.site-mobile-menu:not(.is-open) { visibility:hidden; }
.site-mobile-menu .btn--primary { color:var(--navy-950); }
.site-header :focus-visible, .site-mobile-menu a:focus-visible, .site-footer a:focus-visible { outline:2px solid var(--brand-cyan); outline-offset:5px; box-shadow:none; }
footer.site-footer { background:var(--navy-950); color:white; padding:24px 28px; }
.site-footer-inner { max-width:1380px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.site-footer .site-logo { width:140px; }
.site-socials { display:flex; gap:21px; align-items:center; border-left:1px solid #ffffff45; padding-left:26px; }
.site-socials a { display:grid; place-items:center; width:26px; height:40px; }
.site-socials a:hover { color:var(--brand-cyan); }
.site-footer-whatsapp { display:inline-flex; align-items:center; justify-content:center; gap:10px; border:1px solid #4eac53; border-radius:999px; padding:12px 18px; white-space:nowrap; font-size:12px; }
.site-footer-whatsapp svg { color:#56d775; }
.site-footer-whatsapp:hover { background:#ffffff0c; }
.site-footer-phone { display:flex; align-items:center; gap:10px; white-space:nowrap; font-size:14px; border-left:1px solid #ffffff45; padding-left:24px; }
.site-footer-phone span { display:grid; place-items:center; width:32px; height:32px; background:var(--brand-orange); color:var(--navy-950); border-radius:50%; font-size:20px; }
footer.site-footer .site-copyright { color:#e0e6ef; font-size:11px; white-space:nowrap; }
@media(max-width:1180px) {
 .site-header .nav { gap:18px; }
 .site-header .nav-links { gap:20px; }
 .site-contact span { display:none; }
 .site-contact a { width:38px; height:38px; padding:0; border:1px solid #ffffff65; border-radius:50%; }
 .site-contact .site-contact-whatsapp { border-color:#4eac53; }
 .site-footer-inner { flex-wrap:wrap; justify-content:center; gap:22px 30px; }
 .site-copyright { flex-basis:100%; text-align:center; }
}
@media(max-width:980px) {
 .site-header .nav { padding-block:16px; }
 .site-header .site-logo { width:145px; }
}
@media(max-width:560px) {
 .site-header .nav { padding:15px 18px; gap:10px; }
 .site-header .site-logo { width:118px; }
 .site-header .nav-actions { gap:8px; }
 .site-contact { gap:6px; }
 .site-contact a { width:32px; height:32px; }
 .site-contact svg { width:16px; height:16px; }
 .site-header .nav-actions .btn--secondary { padding:11px 13px; font-size:12px; gap:6px; }
 .site-header .nav-actions .btn--secondary svg { width:14px; height:14px; }
 .site-mobile-menu { padding-top:100px; }
 footer.site-footer { padding:32px 20px; }
 .site-footer-inner { gap:22px; }
 .site-footer-brand { display:flex; justify-content:center; flex-basis:100%; }
 .site-socials { padding-left:0; border:0; justify-content:center; flex-basis:100%; gap:25px; }
 .site-footer-phone { border:0; padding:0; }
 .site-footer-whatsapp { padding:12px 16px; }
 .site-copyright { white-space:normal; }
}
@media(max-width:360px) {
 .site-header .nav { padding-inline:12px; gap:8px; }
 .site-header .site-logo { width:100px; }
 .site-header .nav-actions .btn--secondary { padding-inline:10px; }
 .site-header .nav-actions .btn--secondary svg { display:none; }
}
@media(max-width:340px) {
 .site-header .site-logo { width:84px; }
 .site-header .nav-actions { gap:6px; }
 .site-contact { gap:4px; }
 .site-contact a { width:28px; height:28px; }
}

/* Second apply button (Kids & Teens) and the application drawers. */
.site-header .nav-actions .site-apply-kids { background:transparent; color:white; border:1px solid var(--brand-cyan); }
.site-header .nav-actions .site-apply-kids:hover { background:#ffffff10; }
.apply-backdrop { position:fixed; inset:0; z-index:111; background:rgba(7,21,48,.55); opacity:0; pointer-events:none; transition:opacity .25s; }
.apply-backdrop.is-open { opacity:1; pointer-events:auto; }
.apply-drawer { position:fixed; top:0; right:0; bottom:0; z-index:112; display:flex; flex-direction:column; width:min(640px,100vw); background:#fff; color:var(--navy-900); box-shadow:-12px 0 40px #031a3940; transform:translateX(100%); transition:transform .3s ease; }
.apply-drawer:not(.is-open) { visibility:hidden; transition:transform .3s ease, visibility 0s .3s; }
.apply-drawer.is-open { transform:none; }
.apply-drawer-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding:22px 28px 16px; border-bottom:1px solid #e5e9ef; }
.apply-drawer-eyebrow { display:block; margin-bottom:4px; color:var(--brand-orange); font-size:11px; font-weight:700; letter-spacing:.08em; }
.apply-drawer-title { font-size:24px; line-height:1.25; letter-spacing:-.03em; }
.apply-drawer-close { flex:0 0 36px; height:36px; display:grid; place-items:center; border:1px solid #d5dbe4; border-radius:6px; background:#fff; color:var(--navy-900); cursor:pointer; }
.apply-drawer-close:hover { background:#f4f6f9; }
.apply-drawer-body { flex:1; overflow-y:auto; overscroll-behavior:contain; }
.apply-drawer-loading, .apply-drawer-error { padding:28px; color:var(--text-muted); font-size:14px; line-height:1.6; }
.apply-drawer-error a { color:var(--navy-900); font-weight:600; text-decoration:underline; }
.apply-drawer .ha-form-card { max-width:none; margin:0; padding:20px 28px 28px; border:0; border-radius:0; box-shadow:none; }
.apply-drawer .ha-form-lede { margin-top:0; }
.apply-drawer .ha-fields { grid-template-columns:1fr; gap:13px; }
.apply-drawer .ha-submit { display:inline-flex; align-items:center; justify-content:center; width:100%; min-height:50px; border:0; border-radius:6px; background:var(--brand-orange); color:var(--navy-950); font-weight:700; cursor:pointer; }
.apply-drawer .ha-submit:hover { background:#FF762F; }
.apply-drawer .lesson-actions--form .lesson-booking { display:none; }
@media(max-width:560px) {
 .site-header .nav-actions .site-apply-kids { display:none; }
 .apply-drawer-head { padding:16px 18px 12px; }
 .apply-drawer .ha-form-card { padding:16px 18px 24px; }
}
@media(prefers-reduced-motion:reduce) { .apply-drawer, .apply-backdrop { transition:none; } }
.site-mobile-menu .site-apply-kids { background:transparent; color:white; border:1px solid var(--brand-cyan); }
