/* A is the no-script fallback. All three variants share content and URLs. */
header>a{background:transparent;padding:0;height:64px}
header img{width:108px;max-height:64px}
.brand-red{display:none}
.btn:not(.secondary){background:var(--ink);border-color:var(--ink);color:var(--paper)}
.btn:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.secondary:hover,.hero .btn.secondary:hover{background:#24251f;border-color:#24251f;color:#fff}
.hero h1 em{color:var(--ink)}
.hero h1:after{content:"";display:block;width:64px;height:4px;background:var(--accent);margin-top:24px}
a:focus-visible,button:focus-visible{outline:3px solid var(--ink);outline-offset:5px}
header a:focus-visible,.story a:focus-visible{outline-color:#fff}

:root[data-theme="c"]{--paper:#fff;--line:#e3e3df}
[data-theme="c"] header{background:#fff;color:var(--ink);border-bottom:1px solid var(--line)}
[data-theme="c"] header a:focus-visible{outline-color:var(--ink)}
[data-theme="c"] .brand-white{display:none}
[data-theme="c"] .brand-red{display:block}
[data-theme="c"] .hero-copy{background:#fff}
[data-theme="c"] .hero h1 em{color:var(--accent)}
[data-theme="c"] .hero h1:after{display:none}
[data-theme="c"] .menu-band{background:#f4f4f1}
[data-theme="c"] .story{background:#24251f}
[data-theme="c"] .btn:not(.secondary){background:#ED2424;border-color:#ED2424;color:#fff}

[data-theme="d"] header{background:var(--accent);color:#080808}
[data-theme="d"] header a:focus-visible{outline:3px solid #080808;outline-offset:5px}

@media(max-width:800px){header>a{height:55px}header img{width:88px;max-height:55px}}
@media(max-width:460px){header img{width:74px}}