header{position:sticky;top:0;z-index:10;background:#852a23;border-bottom:1px solid #852a23;color:#fff}header .nav{max-width:1280px;margin:auto;height:88px;min-height:0;display:grid;grid-template-columns:1fr 270px 1fr;align-items:center;padding:0 45px;gap:0}header .nav-side{display:flex;gap:42px;align-items:center;font-size:14px;letter-spacing:2px}header .nav-side:last-child{justify-content:flex-end}.nav-center{grid-column:2}.brand img{display:block}.about-menu{position:relative}.about-menu summary{cursor:pointer;list-style:none;color:#f2dcd8;white-space:nowrap}.about-menu summary::-webkit-details-marker{display:none}.about-menu summary:after{content:"⌄";font-size:11px;margin-left:7px}.about-links{position:absolute;top:calc(100% + 20px);left:-20px;min-width:170px;display:grid;background:#fff;box-shadow:0 8px 24px #0002;border-top:3px solid #9d3229;padding:8px 0}.nav-side .about-links a{color:#852a23;display:block;padding:13px 20px;font-size:13px;letter-spacing:1px}.nav-side .about-links a:hover{color:#852a23;background:#f8efed}header a[aria-current="page"]{text-decoration:underline;text-underline-offset:7px}.about-menu summary:focus-visible{outline:2px solid white;outline-offset:6px}
/* Two complete compositions slide independently; neither changes shape. */
:root{--paper:#fff;--line:#e5e5e5;--nav-red:#852a23;--badge-red:#9d3229}
body,.discover,.preview-note,.hero{background:#fff}
header{background:var(--nav-red);border-bottom-color:var(--nav-red);color:white}
.nav-side a{color:rgba(255,255,255,.8)}.nav-side a:hover{color:#fff}
.discover{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.nav{grid-template-columns:1fr 270px 1fr}
.brand,.compact .brand{position:absolute;top:0;left:50%;width:240px;height:212px;padding:0;background:transparent;clip-path:none;filter:none;animation:none;transform:translate(-50%,0);opacity:1;transition:transform 1.5s ease-in-out,opacity 1.5s ease-in-out}
.brand-emblem{height:116px;display:flex;align-items:center;justify-content:center;background:var(--badge-red)}
.brand-emblem img{width:100px;height:100px;display:block}
.brand-title{position:absolute;left:12px;top:130px;width:216px}
.brand-title img{display:block;width:100%;height:auto}
.brand-subtitle{display:block;color:white;font:10px Georgia,serif;letter-spacing:2px;text-align:center;margin-top:9px;white-space:nowrap}
.brand-chevron{position:absolute;left:-5px;top:47px;width:calc(100% + 10px);height:35px;color:white}
.brand-chevron path,.brand-chevron circle{fill:none;stroke:currentColor;stroke-width:1.4;vector-effect:non-scaling-stroke}.brand-chevron circle{stroke-width:1}
.compact .brand{transform:translate(-50%,-300px);opacity:0;pointer-events:none}
.brand-fixed{position:absolute;left:50%;top:0;width:256px;height:100px;transform:translate(-50%,-150px);opacity:0;pointer-events:none;transition:transform 1.5s ease-in-out,opacity 1.5s ease-in-out;isolation:isolate}
.compact .brand-fixed{transform:translate(-50%,0);opacity:1;pointer-events:auto}
.brand-fixed-bg{position:absolute;inset:0;width:100%;height:100%;z-index:-1;fill:var(--badge-red);filter:drop-shadow(0 4px 4px #0002)}
.brand-fixed-content{display:flex;align-items:center;gap:12px;padding:20px 16px 0}
.brand-fixed-emblem{display:block;width:49px;height:49px;flex-shrink:0}
.brand-fixed-title{flex:1;min-width:0}.brand-fixed-title>img{display:block;width:100%;height:auto}
.brand-fixed-title .brand-subtitle{font-size:8px;letter-spacing:1px;margin-top:7px}
@media(max-width:760px){.nav{grid-template-columns:1fr 158px 1fr;padding:0 12px}.nav-side{font-size:11px}.hero{background:#fff;padding-top:60px}.brand,.compact .brand{width:142px;height:145px;padding:0}.brand-emblem{height:75px}.brand-emblem img{width:65px;height:65px}.brand-title{left:8px;top:84px;width:126px}.brand-subtitle{font-size:7px;letter-spacing:1px;margin-top:6px}.brand-chevron{top:33px;height:25px}.brand-fixed{width:152px;height:74px}.brand-fixed-content{gap:7px;padding:17px 8px 0}.brand-fixed-emblem{width:30px;height:30px}.brand-fixed-title .brand-subtitle{font-size:5px;letter-spacing:.4px;margin-top:4px}}
@media(prefers-reduced-motion:reduce){.brand,.compact .brand,.brand-fixed{transition:none;animation:none}}
@media(max-width:760px){header .nav{height:112px;padding:0 18px;grid-template-columns:1fr 158px 1fr;align-items:start}header .nav-side{padding-top:19px;display:flex;flex-direction:column;align-items:flex-start;gap:22px;font-size:11px;letter-spacing:0}header .nav-side:last-child{align-items:flex-end}header .nav-side .desktop{display:block}.about-links{top:calc(100% + 10px);left:-10px;min-width:150px}.about-links a{white-space:nowrap}}
