/*
 * The mega menu (includes/modules/nav-mega.php). Colours and faces come from
 * the canvas tokens, so it is every site's own; the fallbacks are neutral.
 * Small text and the card's button read in ink, never in the accent: a light
 * accent (B&V's gold) is about 2:1 on a pale panel. A theme with an accent
 * dark enough for text sets --cs-accent-text.
 * The header it sits in needs position: relative for the panel to span it.
 */
.culc-mega-item{position:static;list-style:none}
.culc-mega-open{font:inherit;font-size:inherit;font-weight:inherit;color:inherit;background:none;border:0;padding:10px 12px;border-radius:5px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.culc-mega-open:hover,.culc-mega-open[aria-expanded="true"]{background:var(--cs-paper-2,rgba(0,0,0,.05))}
.culc-mega-open[aria-expanded="true"]{color:var(--cs-accent,currentColor)}
.culc-mega-open:focus-visible,.culc-mega-panel a:focus-visible{outline:3px solid var(--cs-accent,#2f4bf0);outline-offset:2px}
.culc-mega-chev{width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px);transition:transform .15s}
.culc-mega-open[aria-expanded="true"] .culc-mega-chev{transform:rotate(225deg) translate(-1px,-1px)}
.culc-mega-panel{position:absolute;left:0;right:0;top:100%;z-index:50;background:var(--cs-paper,#fff);color:var(--cs-ink,#1d2731);border-top:1px solid var(--cs-line,rgba(0,0,0,.08));border-bottom:1px solid var(--cs-line,rgba(0,0,0,.08));box-shadow:0 18px 30px rgba(0,0,0,.08)}
.culc-mega-panel[hidden]{display:none}
.culc-mega-in{max-width:var(--cs-max,1280px);margin:0 auto;padding:28px 28px 32px;display:flex;flex-wrap:wrap;gap:32px 48px;align-items:flex-start}
.culc-mega-col{flex:1 1 180px;min-width:0;max-width:300px}
.culc-mega-card{flex:0 1 340px;margin-left:auto}
.culc-mega-h{margin:0 0 10px;font-size:16px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cs-accent-text,currentColor)}
.culc-mega-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.culc-mega-col a{display:block;padding:6px 0;font-size:18px;font-weight:500;text-decoration:none;color:inherit}
.culc-mega-col a:hover{color:var(--cs-accent,currentColor)}
.culc-mega-col small{display:block;font-size:16px;font-weight:400;opacity:.75}
.culc-mega-card{background:var(--cs-paper-2,#f6f4f0);border:1px solid var(--cs-line,rgba(0,0,0,.08));border-radius:5px;padding:18px 20px;display:flex;flex-direction:column;gap:8px}
.culc-mega-card p{margin:0}
.culc-mega-eyebrow{font-size:16px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--cs-accent-text,currentColor)}
.culc-mega-title{font-family:var(--cs-display,inherit);font-size:21px;font-weight:600;line-height:1.25}
.culc-mega-text{font-size:16px;opacity:.8}
.culc-mega-go{align-self:flex-start;margin-top:4px;background:var(--cs-ink,#1d2731);color:var(--cs-paper,#fff)!important;font-size:16px;font-weight:700;padding:10px 16px;border-radius:5px;text-decoration:none}
/* A theme's own menu rules reach the lists inside a panel (a stacked phone
   menu hides and positions every ul under its nav), so the panel's are its own. */
.culc-mega-panel ul{position:static!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important;background:none!important;border:0!important;padding:0!important;margin:0!important;box-shadow:none!important}
.culc-mega-panel li{width:auto!important;padding:0!important}
/* A phone: the panel opens in place inside the stacked menu. */
@media (max-width:900px){
  .culc-mega-open{width:100%;justify-content:space-between;padding:12px 0}
  .culc-mega-panel{position:static;box-shadow:none;border:0}
  .culc-mega-in{flex-direction:column;padding:4px 0 12px 12px;gap:16px}
  .culc-mega-col,.culc-mega-card{max-width:none;flex:none;margin-left:0;width:100%}
}
@media (prefers-reduced-motion:reduce){.culc-mega-chev{transition:none}}