/* LCDC brand wordmark — canonical sizing (single source of truth). * * Loaded last in on every page so these rules win the cascade * over the per-page duplicated .nav-logo/.burger-logo declarations * without needing to touch those 44 inline copies. * * Sized by width + height:auto (not height + width:auto): the wordmark * sits inside flex/grid containers whose available space can vary * (e.g. the burger drawer's close-button row), and the site's Tailwind * preflight (assets/css/tailwind.min.css) sets `img,video{max-width:100%}` * globally. Combined, a height-driven image can get silently compressed * narrower than its true aspect ratio when its flex container is tight * (confirmed: burger wordmark rendered ~1.7% narrow at 375px viewport). * width + max-width:none + flex-shrink:0 makes the box exact and * container-independent everywhere it appears. * * Canonical target widths were measured from the homepage (the * approved visual reference) at each breakpoint; height is derived * automatically from the SVG's intrinsic aspect ratio (1180:58). */ .nav-logo, .burger-logo { height: auto; max-width: none; display: block; flex-shrink: 0; } .nav-brand, .burger-brand { flex-shrink: 0; } .nav-logo { width: 406.9px; } .nav-logo-esp { display: none; } #nav.nav--scrolled .nav-logo-off, #nav:not(.nav--scrolled):hover .nav-logo-off { display: none; } #nav.nav--scrolled .nav-logo-esp, #nav:not(.nav--scrolled):hover .nav-logo-esp { display: block; } .burger-logo { width: 305.17px; } @media (max-width: 600px) { /* Mobile design-correction pass: increase wordmark presence on phones. 225px is the verified safe ceiling at the narrowest target (375px) — measured empirically against the hamburger/BOOK NOW row; beyond ~234px BOOK NOW is pushed off-viewport. Kept as one fixed value (not tiered per breakpoint) since 375 is the tightest constraint in this range and 390/430 inherit the same size with more slack. */ .nav-logo { width: 225px; } } @media (max-width: 900px) { /* Same exercise for the burger drawer: 233px is the verified safe ceiling before the wordmark touches the close button at 375px. */ .burger-logo { width: 233px; } }