.site-header { position: relative; z-index: 100; min-height: 7.75rem; background: var(--color-ink-900); border-bottom: 1px solid var(--color-border); }
.site-header__bar { min-height: 4.5rem; border-bottom: 1px solid var(--color-border); }
.site-header__inner { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: center; min-height: 4.5rem; gap: var(--space-4); }
.site-header__brand { display: inline-flex; min-width: 0; align-items: center; justify-self: start; gap: 0.625rem; color: var(--color-text); font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.09em; line-height: 1.2; text-decoration: none; text-transform: uppercase; white-space: nowrap; }
.site-header__mark { width: 1.875rem; height: 1.875rem; flex: 0 0 1.875rem; object-fit: contain; }
.site-header__wordmark { color: var(--color-text); font-family: var(--font-display); font-size: 1.5rem; letter-spacing: 0.01em; line-height: 1; text-align: center; text-decoration: none; white-space: nowrap; }
.site-header__wordmark span { color: var(--color-accent); }
.site-header__utilities { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: var(--space-3); }
.site-header__age-marker { display: inline-flex; min-height: 1.75rem; align-items: center; padding: 0.25rem 0.4rem; border: 1px solid var(--color-border-gold); border-radius: var(--radius-control); color: var(--color-text); font-size: var(--text-utility); font-weight: 600; letter-spacing: 0.08em; line-height: 1; }
.site-header__enquiry { min-height: 2.5rem; padding: 0.625rem 0.75rem; white-space: nowrap; }
.site-header__toggle, .site-header__close, .site-header__drawer-enquiry { display: none; }
.site-header__navigation { background: var(--color-ink-900); }
.site-header__nav-inner { display: flex; justify-content: center; }
.site-header__nav-list { display: flex; align-items: center; justify-content: center; gap: clamp(0.7rem, 1.5vw, 1.4rem); width: 100%; min-height: 3.125rem; margin: 0; padding: 0; list-style: none; }
.site-header__nav-list li, .site-header__nav-list li + li { margin: 0; padding: 0; }
.site-header__nav-list a { display: inline-flex; min-height: 3.125rem; align-items: center; color: var(--color-text-muted); font-size: 0.6875rem; font-weight: 600; letter-spacing: 0.075em; line-height: 1.2; text-decoration: none; text-transform: uppercase; white-space: nowrap; transition: color var(--transition-standard); }
.site-header__nav-list a::after { width: 0; height: 1px; margin-left: 0.35rem; background: var(--color-accent); content: ""; transition: width var(--transition-standard); }
.site-header__nav-list a:hover, .site-header__nav-list a:focus-visible { color: var(--color-text); }
.site-header__nav-list a:hover::after, .site-header__nav-list a:focus-visible::after { width: 0.8rem; }
@media (max-width: 68.75rem) { .site-header { min-height: 4.5rem; } .site-header__bar { border-bottom: 0; } .site-header__toggle { display: inline-grid; width: 2.75rem; min-height: 2.75rem; place-content: center; gap: 0.22rem; padding: 0; color: var(--color-text); } .site-header__toggle-line { display: block; width: 1.15rem; height: 1px; background: currentColor; transition: transform var(--transition-fast), opacity var(--transition-fast); } .site-header__toggle-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } .site-header__toggle[aria-expanded="true"] .site-header__toggle-line:nth-child(1) { transform: translateY(0.32rem) rotate(45deg); } .site-header__toggle[aria-expanded="true"] .site-header__toggle-line:nth-child(2) { opacity: 0; } .site-header__toggle[aria-expanded="true"] .site-header__toggle-line:nth-child(3) { transform: translateY(-0.32rem) rotate(-45deg); } .site-header__navigation { position: fixed; inset: 0; display: none; overflow-y: auto; background: var(--color-ink-900); } .site-header__navigation.is-open { display: block; } .site-header__nav-inner { display: flex; min-height: 100%; flex-direction: column; align-items: stretch; justify-content: flex-start; padding-top: 5.5rem; padding-bottom: var(--space-6); } .site-header__close { display: grid; position: absolute; top: 0.875rem; right: max(var(--container-padding), calc((100% - var(--container-max)) / 2)); width: 2.75rem; min-height: 2.75rem; place-items: center; border: 1px solid var(--color-border); color: var(--color-text); font-size: 1.75rem; line-height: 1; } .site-header__nav-list { display: flex; min-height: 0; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; border-top: 1px solid var(--color-border); } .site-header__nav-list li { border-bottom: 1px solid var(--color-border); } .site-header__nav-list a { width: 100%; min-height: 3.5rem; justify-content: space-between; color: var(--color-text); font-family: var(--font-display); font-size: 1.25rem; font-weight: 400; letter-spacing: 0; text-transform: none; } .site-header__drawer-enquiry { display: inline-flex; width: fit-content; margin-top: auto; padding-top: var(--space-6); } }
@media (max-width: 35rem) { .site-header__inner { gap: var(--space-2); display:flex;} .site-header__brand-text { font-size: 0.75rem; } .site-header__mark { width: 1.625rem; height: 1.625rem; flex-basis: 1.625rem; } .site-header__wordmark { display: none; } .site-header__utilities { gap: var(--space-2); } .site-header__enquiry { display: none; } }