/* SWC Archive theme — header, menu, mobile drawer, footer.
   Sizes and colours are the ones measured on the Kadence header and footer (October 2026), so the switch does not
   change the look. Three header variants, chosen in functions.php (swc_theme_header_variant):
     default  – home, guests archive, other pages: full-size logo, gold menu links
     muted    – celebration archive page: full-size logo, light links, darker bar with a shadow
     compact  – guest, panel and celebration pages: 68px bar, 48px logo, light links
   Desktop layout from 1025px; below that the menu moves into the drawer. */

.swc-header {
    --hdr-bg: #020817;
    --hdr-border: rgba(255, 255, 255, 0.08);
    --hdr-shadow: none;
    --bar-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
    --row-pad: 24px;
    --row-min: 0px;
    --logo-w: 369px;
    --logo-max-h: none;
    --nav-link: #f6c84c;
    --nav-weight: 850;
    --nav-ls: 0.01em;
    --nav-hover: #f6c84c;
    --nav-current: #f6c84c;
    --sub-bg: rgba(2, 8, 23, 0.98);
    --sub-link: rgba(255, 255, 255, 0.86);
    --sub-weight: 850;
    --sub-ls: 0.01em;
    --sub-hover: #f6c84c;
    --sub-hover-bg: rgba(246, 200, 76, 0.12);
    --toggle: #f8fafc;
    --drawer-top-link: #f6c84c;

    position: relative;
    z-index: 11;
    background: var(--hdr-bg);
    border-bottom: 1px solid var(--hdr-border);
    box-shadow: var(--hdr-shadow);
    padding: 0 24px;
}
.swc-header-muted .swc-header {
    --hdr-bg: #020617;
    --hdr-border: rgba(255, 255, 255, 0.1);
    --hdr-shadow: 0 12px 30px rgba(0, 0, 0, 0.22);
    --nav-link: #e5eefc;
    --nav-weight: 800;
    --nav-ls: 0.02em;
    --sub-link: #e5eefc;
    --sub-weight: 800;
    --sub-ls: 0.02em;
    --toggle: #e5eefc;
    --drawer-top-link: #f6c84c;
}
.swc-header-compact .swc-header {
    --hdr-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
    --row-pad: 0px;
    --row-min: 68px;
    --logo-w: auto;
    --logo-max-h: 48px;
    --nav-link: #e5edf8;
    --nav-hover: #facc15;
    --nav-current: #facc15;
    --sub-bg: #071426;
    --sub-link: #e5edf8;
    --sub-hover: #facc15;
    --sub-hover-bg: rgba(255, 255, 255, 0.07);
    --toggle: #ffffff;
    --drawer-top-link: rgba(255, 255, 255, 0.88);
}

.swc-header__bar {
    max-width: calc(var(--global-content-width) - 48px);
    margin: 0 auto;
    background: var(--hdr-bg);
    border-bottom: 1px solid var(--hdr-border);
    box-shadow: var(--bar-shadow);
}
/* Header bar in the News badge strip's style (1 Nov 2026, every variant): the lighter navy gradient with the star
   field, edge to edge, and a gold rule along the bottom. The inner bar goes transparent so the outer one shows. */
.swc-header {
    background: url("../img/starfield.svg") 211px 97px / 800px 600px repeat, linear-gradient(135deg, #0b1830 0%, #10284a 54%, #0c1f3a 100%);
    border-bottom: 2px solid #f6c84c;
}
.swc-header__bar { background: transparent; border-bottom: 0; box-shadow: none; }

.swc-header__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: var(--row-min);
    padding: 0 var(--row-pad);
}
.swc-header__brand { display: flex; align-items: center; }
.swc-header__brand a { display: block; text-decoration: none; }
.swc-header__brand .custom-logo {
    display: block;
    width: var(--logo-w);
    height: auto;
    max-width: 100%;
    max-height: var(--logo-max-h);
}
/* !important: the plugin's guest-shell.css still carries Kadence-era logo rules (.single-guest .custom-logo
   { max-height: 42px !important } on phones); remove both once those plugin rules are deleted after the switch. */
.swc-header-compact .swc-header__brand .custom-logo { width: auto; height: var(--logo-max-h); max-height: var(--logo-max-h) !important; max-width: none; }
.swc-header__title { color: #f8fafc; font-weight: 900; font-size: 1.5rem; letter-spacing: -0.02em; }

/* ---- Desktop menu -------------------------------------------------------------------------------- */
.swc-nav__menu { display: flex; align-items: center; list-style: none; margin: 0; padding: 0; }
.swc-nav__menu li { position: relative; }
.swc-nav__menu > li > a {
    display: flex;
    align-items: center;
    gap: 0;
    padding: 0.6em 0.64em;
    color: var(--nav-link);
    font-weight: var(--nav-weight);
    letter-spacing: var(--nav-ls);
    text-decoration: none;
}
.swc-nav__menu > li > a:hover,
.swc-nav__menu > li.current-menu-item > a,
.swc-nav__menu > li.current-menu-ancestor > a { color: var(--nav-current); }
.swc-nav__menu > li > a:hover { color: var(--nav-hover); }
.swc-nav__chevron { width: 0.81em; height: 0.81em; margin-left: 2.85px; color: #f6c84c; flex: none; }

.swc-nav__menu .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    width: 303px;
    margin: 0;
    padding: 0;
    list-style: none;
    background: var(--sub-bg);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 16px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.34);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-0.5rem);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s linear 0.2s;
}
.swc-nav__menu li:hover > .sub-menu,
.swc-nav__menu li:focus-within > .sub-menu,
.swc-nav__menu li.is-open > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}
.swc-nav__menu li.is-closed > .sub-menu { opacity: 0; visibility: hidden; }
.swc-nav__menu .sub-menu a {
    display: block;
    padding: 14px;
    font-size: 14px;
    line-height: 1;
    color: var(--sub-link);
    font-weight: var(--sub-weight);
    letter-spacing: var(--sub-ls);
    text-decoration: none;
}
.swc-nav__menu .sub-menu a:hover,
.swc-nav__menu .sub-menu a:focus { color: var(--sub-hover); background: var(--sub-hover-bg); }
.swc-nav__menu .sub-menu .current-menu-item > a { color: var(--sub-hover); }
/* The panel no longer clips (the flyout sits outside it), so the first and last links carry the rounded corners. */
.swc-nav__menu .sub-menu > li:first-child > a { border-radius: 15px 15px 0 0; }
.swc-nav__menu .sub-menu > li:last-child > a { border-radius: 0 0 15px 15px; }
.swc-nav__menu .sub-menu > li:only-child > a { border-radius: 15px; }

/* Third level: a flyout to the left of its item (the menu sits at the right of the header, so the right has no room) (Celebration Archive → Celebrations → every Celebration). */
.swc-nav__menu .sub-menu .menu-item-has-children > a { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.swc-nav__menu .sub-menu .swc-nav__chevron { transform: rotate(90deg); }
.swc-nav__menu .sub-menu .sub-menu {
    top: -1px;
    right: calc(100% - 6px);
    left: auto;
    /* Two columns so every Celebration shows at once, newest first down the left column. */
    display: grid;
    grid-template-columns: repeat(2, 250px);
    grid-auto-flow: column;
    grid-template-rows: repeat(9, auto);
    width: auto;
    padding: 6px 0;
    transform: translateX(0.5rem);
}
.swc-nav__menu .sub-menu .sub-menu a { padding: 10px 14px; line-height: 1.3; }
.swc-nav__menu .sub-menu .sub-menu a { display: flex; gap: 10px; align-items: baseline; }
.swc-nav__year { flex: none; font-variant-numeric: tabular-nums; opacity: 0.45; font-weight: 500; }
.swc-nav__menu .sub-menu .sub-menu > li:first-child > a,
.swc-nav__menu .sub-menu .sub-menu > li:last-child > a { border-radius: 0; }

/* ---- Mobile header ------------------------------------------------------------------------------- */
.swc-menu-toggle {
    display: none;
    padding: 0.2em;
    background: transparent;
    color: var(--toggle);
    font-size: 14px;
    line-height: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
.swc-menu-toggle:hover, .swc-menu-toggle:focus { background: transparent; color: var(--toggle); box-shadow: none; }

@media (max-width: 1024px) {
    .swc-header-compact .swc-header { --row-min: 64px; --logo-max-h: 44px; }
    .swc-header__row { display: grid; grid-template-columns: 1fr auto 1fr; }
    .swc-header__brand { grid-column: 2; }
    .swc-nav { display: none; }
    .swc-menu-toggle { display: block; grid-column: 3; justify-self: end; }
}
@media (max-width: 767px) {
    .swc-header { --logo-w: 191px; }
}

/* ---- Mobile drawer ------------------------------------------------------------------------------- */
.swc-drawer { position: fixed; inset: 0; z-index: 100000; }
.swc-drawer[hidden] { display: none; }
.swc-drawer__overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.4); animation: swc-fade 0.2s ease; }
.swc-drawer__panel {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 400px;
    max-width: 90%;
    overflow-y: auto;
    background: #020817;
    color: #f8fafc;
    box-shadow: 0 0 32px rgba(0, 0, 0, 0.1);
    animation: swc-fade 0.2s ease;
}
@keyframes swc-fade { from { opacity: 0; } to { opacity: 1; } }
.swc-drawer__head { display: flex; align-items: flex-start; justify-content: flex-end; height: 44px; padding-right: 25.5px; }
.swc-drawer__close {
    padding: 15px 3.6px 0;
    line-height: 0;
    color: #e5be21;
    background: transparent;
    border: 0;
    box-shadow: none;
}
.swc-drawer__close:hover, .swc-drawer__close:focus { background: transparent; color: #f6c84c; box-shadow: none; }
.swc-drawer__nav { padding: 0 25.5px 2rem; text-align: center; }
.swc-drawer__menu, .swc-drawer__menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.swc-drawer__menu .sub-menu { padding-left: 0; }
/* A top-level item with children (Celebration Archive) reads as a section heading over its links. */
.swc-drawer__menu > .menu-item-has-children > a {
    padding: 26px 7px 8px;
    font-size: 11px;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #e5be21;
    border-bottom: 0;
}
/* Third level in the drawer (the Celebrations list): collapsed behind a toggle added by menu.js, laid over the
   row's right edge so the label stays centred. */
.swc-drawer__menu .sub-menu .menu-item-has-children { position: relative; }
.swc-drawer__menu .sub-menu .sub-menu[hidden] { display: none; }
.swc-drawer__menu .sub-menu .sub-menu { padding: 4px 0 8px; background: rgba(255, 255, 255, 0.03); border-bottom: 1px solid rgba(255, 255, 255, 0.1); }
.swc-drawer__menu .sub-menu .sub-menu a { padding: 9px 7px; font-size: 13px; font-weight: 700; border-bottom: 0; }
.swc-drawer__sub-toggle {
    position: absolute;
    top: 0;
    right: 0;
    width: 48px;
    height: calc(14px * 1.6 + 28px);
    padding: 0;
    color: #f6c84c;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    line-height: 0;
}
.swc-drawer__sub-toggle:hover, .swc-drawer__sub-toggle:focus { background: transparent; color: #fff; box-shadow: none; }
.swc-drawer__sub-toggle svg { transition: transform 0.2s ease; }
.swc-drawer__sub-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.swc-drawer__menu a {
    display: block;
    padding: 14px 7px;
    font-size: 14px;
    line-height: 1.6;
    font-weight: 850;
    color: rgba(255, 255, 255, 0.88);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    text-decoration: none;
}
.swc-drawer__menu > li > a { color: var(--drawer-top-link); }
.swc-drawer__menu a:hover, .swc-drawer__menu a:focus,
.swc-drawer__menu .current-menu-item > a { color: #f6c84c; }
body.swc-drawer-open { overflow: hidden; }

/* ---- Footer -------------------------------------------------------------------------------------- */
.swc-footer {
    position: relative;
    overflow: hidden;
    background: var(--swc-bg, #020617);
    color: rgba(255, 255, 255, 0.62);
    padding: 72.5px 24px 73px;
}
.swc-header-compact .swc-footer { padding-left: 0; padding-right: 0; }
.swc-footer::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: url("../img/starfield.svg");
    background-size: 1600px 1200px;
    background-repeat: repeat;
    background-position: 1021px 211px;
    opacity: 0.3;
}
.swc-footer__inner { position: relative; z-index: 1; }
.swc-footer__text { max-width: 760px; margin: 0 auto; text-align: center; }
.swc-footer__text p { margin: 0 0 8px; font-size: 0.82rem; line-height: 1.55; color: rgba(255, 255, 255, 0.62); }
.swc-footer__text p:last-child { margin-bottom: 0; }
.swc-footer__text > p:first-child { font-size: 0.9rem; font-weight: 700; color: rgba(255, 255, 255, 0.8); margin-bottom: 10px; }
.swc-footer__text strong { font-weight: 700; color: rgba(255, 255, 255, 0.78); }
.swc-footer a { color: #f6c84c; font-weight: 800; text-decoration: none; }
@media (max-width: 640px) {
    .swc-footer { padding-top: 69px; padding-bottom: 68px; }
    .swc-footer__text { padding: 0 6px; }
    .swc-footer__text p { font-size: 0.78rem; line-height: 1.5; }
    .swc-footer__text > p:first-child { line-height: 1.5; }
}