/* ==========================================================================
   Shared site header for /casting.

   The casting page keeps its own approved stylesheet, so it does not load the
   site-wide styles.css (whose page-level rules would restyle the casting
   design). These are the main-menu rules copied from styles.css in their
   original order, plus the colour values they rely on, scoped to the header.
   If the main menu's look changes in styles.css, regenerate this file.
   ========================================================================== */
.site-header{--ink:#173153;--gold:#ffd36b;--serif:"Playfair Display",serif;line-height:normal;font-family:"DM Sans",sans-serif;font-size:16px}
:where(.site-header) a{color:inherit;text-decoration:none}
:where(.site-header) button{font:inherit;color:inherit}
.skip-link{position:fixed;left:1rem;top:-5rem;z-index:1000;background:white;padding:.8rem 1rem}
.skip-link:focus{top:1rem}
.site-header{height:74px;position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(1.1rem,4vw,4rem);color:white;border-bottom:1px solid rgba(255,255,255,.24);background:linear-gradient(180deg,rgba(10,46,89,.68),transparent)}
.brand{display:flex;gap:.7rem;align-items:center}
.brand-mark{font-size:1.7rem;color:var(--gold);filter:drop-shadow(0 0 10px rgba(255,211,107,.8))}
.brand strong{font:600 1.15rem var(--serif)}
.brand small{display:block;font-size:.55rem;text-transform:uppercase;letter-spacing:.16em;opacity:.8}
.nav{display:flex;align-items:center;gap:1.55rem;font-size:.72rem;font-weight:700;letter-spacing:.04em}
.nav-cta{background:var(--gold);color:var(--ink);padding:.72rem 1.15rem;border-radius:999px;box-shadow:0 5px 20px rgba(255,211,107,.3)}
.menu-toggle{display:none}
@media(max-width:950px){.site-header{height:68px}.menu-toggle{display:flex;flex-direction:column;gap:7px;background:none;border:0;padding:1rem}.menu-toggle span{width:25px;height:1px;background:white}.nav{position:absolute;top:68px;left:0;right:0;background:#0b4f8d;display:none;flex-direction:column;align-items:flex-start;padding:2rem}.nav.open{display:flex}}
@media(max-width:620px){.brand strong{font-size:1rem}}
.site-header{top:50px;left:50%;transform:translateX(-50%);width:min(1180px,calc(100% - 32px));height:76px;padding:0 1.35rem;border:1px solid rgba(255,255,255,.66);border-radius:22px;background:rgba(255,255,255,.76);backdrop-filter:blur(18px) saturate(145%);-webkit-backdrop-filter:blur(18px) saturate(145%);box-shadow:0 18px 48px rgba(38,95,140,.14);color:var(--ink)}
.site-header .brand small{color:#6b8195;opacity:1}
.site-header .brand-mark{color:#f2b93f}
.nav{color:#244a6b}
.nav a:not(.nav-cta){padding:.7rem .2rem}
.nav-cta{background:linear-gradient(135deg,#ffcf70,#ffe8a6);color:#24415e;box-shadow:0 8px 20px rgba(230,174,55,.22)}
@media(max-width:950px){.site-header{top:46px;height:68px}.menu-toggle span{background:#244a6b}.nav{top:76px;background:rgba(255,255,255,.98);color:#244a6b;border-radius:18px;box-shadow:0 20px 50px rgba(25,76,112,.16)}}
@media(max-width:620px){.site-header{top:42px;width:calc(100% - 18px);border-radius:18px;padding:0 .9rem}.site-header .brand small{display:none}}
.site-header{
  background:linear-gradient(135deg,rgba(22,121,189,.88),rgba(91,93,198,.84));
  border-color:rgba(255,255,255,.58);
  box-shadow:0 16px 42px rgba(31,91,147,.2), inset 0 1px 0 rgba(255,255,255,.28);
  color:#fff;
}
.site-header .brand,.site-header .brand strong,.site-header .brand small,.site-header .nav,.site-header .nav a{color:#fff}
.site-header .brand small{color:rgba(255,255,255,.76)}
.site-header .brand-mark{color:#ffe28a;text-shadow:0 0 16px rgba(255,226,138,.65)}
.nav a:not(.nav-cta):after{background:#ffe28a}
.nav-cta{background:rgba(255,255,255,.94);color:#27618b!important}
@media(max-width:950px){.site-header{background:linear-gradient(135deg,rgba(22,121,189,.96),rgba(91,93,198,.95))}.menu-toggle span{background:#fff}.nav{background:linear-gradient(135deg,#1579bd,#5b5dc6);color:#fff}.nav a{color:#fff!important}}
.site-header{top:60px}
.nav-drop{position:relative}
.nav-drop>button{background:none;border:0;cursor:pointer;font:inherit;color:inherit;display:inline-flex;align-items:center;gap:.35rem;padding:.7rem .2rem;letter-spacing:inherit}
.nav-drop>button i{font-style:normal;font-size:.6rem;transition:transform .25s ease}
.nav-drop.open>button i{transform:rotate(180deg)}
.nav-drop-menu{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(-6px);min-width:250px;background:#fff;border:1px solid rgba(255,255,255,.7);border-radius:16px;box-shadow:0 18px 48px rgba(38,95,140,.2);backdrop-filter:blur(14px);padding:.5rem;display:flex;flex-direction:column;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:40}
.nav-drop-menu::before{content:"";position:absolute;left:-10px;right:-10px;top:-14px;height:14px}
.nav-drop.open .nav-drop-menu,.nav-drop:focus-within .nav-drop-menu{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
@media(hover:hover){.nav-drop:hover .nav-drop-menu{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}}
.nav .nav-drop-menu a{display:block;padding:.65rem .85rem;border-radius:10px;font-size:.74rem;font-weight:700;color:#244a6b!important;text-transform:none;letter-spacing:.02em;white-space:nowrap}
.nav-drop-menu a:hover{background:linear-gradient(90deg,#fff3d6,#f4ecff)}
@media(max-width:950px){.nav-drop-menu{position:static;transform:none;min-width:0;box-shadow:none;border:0;background:transparent;padding:.1rem 0 .3rem .9rem;display:none;opacity:1;pointer-events:auto}.nav-drop.open .nav-drop-menu{display:flex}.nav .nav-drop-menu{background:transparent}.nav .nav-drop-menu a{color:#fff!important}}
.nav{font-size:.8rem}
.brand small{font-size:.6rem}
.nav .nav-drop-menu a{font-size:.82rem}
@media(max-width:950px){.nav-drop.open .nav-drop-menu,.nav-drop:focus-within .nav-drop-menu{transform:none}.nav-drop{width:100%}.nav-drop>button{width:100%;justify-content:flex-start}.nav{gap:.35rem;padding:1.5rem 1.6rem;align-items:stretch}.nav>a,.nav .nav-drop>button{margin:0;padding:.7rem .1rem;font-size:.95rem}.nav .nav-drop-menu{padding:.15rem 0 .5rem 1rem}.nav .nav-drop-menu a{margin:0;padding:.55rem .4rem;font-size:.9rem}.nav .nav-cta{background:linear-gradient(135deg,var(--gold),#ffe69b)!important;color:var(--ink)!important;margin-top:.6rem;text-align:center}.nav .fairy-whisper,.nav .booking-fairy{margin-top:.6rem}}
.header-call{display:none}
.nav-call{display:inline-flex;align-items:center;gap:.4rem}
.nav-call svg{flex:none}
@media(max-width:950px){.header-call{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);color:#fff;margin-left:auto;margin-right:.1rem}.header-call:active{background:rgba(255,255,255,.32)}.nav .nav-call{padding:.7rem .1rem}}
.brand small{font-size:0.76rem}
.nav{font-size:0.80rem}
.nav .nav-drop-menu a{font-size:0.90rem}
.nav-drop>button i{font-size:0.76rem}
.site-header{width:min(1360px,calc(100% - 32px));padding:0 1.5rem}
.site-header .nav a,.site-header .nav-drop>button,.site-header .nav-cta{white-space:nowrap}
@media(min-width:951px){.site-header .nav{flex-wrap:nowrap;gap:clamp(.7rem,1.5vw,1.55rem)}}
@media(min-width:951px) and (max-width:1310px){.site-header .nav{font-size:.68rem}.site-header .nav-cta{padding:.68rem 1rem}.site-header .brand strong{font-size:1.05rem}}
@media(min-width:951px) and (max-width:1120px){.site-header .nav .nav-call{display:none}.site-header .header-call{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.4);color:#fff;margin-left:auto;margin-right:.6rem}}
:root{--hdr-top:60px;--hdr-h:68px;--bar-gap:8px}
@media(max-width:950px){:root{--hdr-top:44px;--hdr-h:64px}}
@media(max-width:620px){:root{--hdr-top:38px;--hdr-h:58px}}
.site-header{top:var(--hdr-top);height:var(--hdr-h)}
@media(max-width:620px){.site-header{width:calc(100% - 18px);border-radius:18px;padding:0 .8rem}.site-header .brand strong{font-size:.98rem}.site-header .brand small{display:none}}
.site-header{z-index:60}
@media(min-width:951px){.site-header .brand small{white-space:nowrap;font-size:.62rem;letter-spacing:.1em}.site-header .nav{gap:.1rem}.site-header .nav>a,.site-header .nav>.nav-drop>button{padding-left:.55rem;padding-right:.55rem}}
@media(min-width:951px) and (max-width:1239px){.site-header .nav{gap:0}}
@media(min-width:951px) and (max-width:1100px){.site-header .nav a.nav-call{font-size:0;gap:0}.site-header .nav a.nav-call svg{width:17px;height:17px}}
@media(min-width:951px) and (max-width:1060px){.site-header .nav>.nav-drop>button{padding-left:.5rem;padding-right:.5rem}.site-header .nav{letter-spacing:.02em}}
@media(min-width:951px) and (max-width:1000px){.site-header .nav{font-size:.64rem}.site-header .brand strong{font-size:.95rem}}
/* Casting page: the menu sits at the top of the page above the casting
   section bar instead of floating over the hero photo. */
.casting-page .site-header{position:relative;top:auto;left:auto;transform:none;margin:12px auto}