/* * Header Styles - Mobile First * Extracted from Figma designs with exact measurements * Mobile:320px-767px (base) * Desktop:1024px+ *//*--------------------------------------------------------------# Header Base Styles (Mobile First)--------------------------------------------------------------*/.site-header{position:sticky;top:0;left:0;right:0;z-index:var(--z-index-sticky);background:var(--navbar-bg);border-bottom:1px solid var(--navbar-border);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:box-shadow var(--transition-base);}.site-header.is-scrolled{box-shadow:0 2px 8px rgba(0,0,0,0.05);}.header-container{display:flex;align-items:center;justify-content:space-between;height:65px;padding:0 var(--spacing-16);max-width:100%;margin:0 auto;}/*--------------------------------------------------------------# Site Branding / Logo--------------------------------------------------------------*/.site-branding{position:relative;z-index:calc(var(--z-index-sticky) + 1);flex-shrink:0;}.site-logo-link{display:inline-flex;align-items:center;text-decoration:none;font-family:var(--font-primary);font-weight:var(--font-weight-bold);font-size:var(--navbar-logo-size);line-height:32px;letter-spacing:-0.6px;transition:opacity var(--transition-fast);}.site-logo-link:hover{opacity:0.8;}.site-logo-link:focus{outline:2px solid var(--color-primary);outline-offset:4px;border-radius:4px;}.site-logo-text{color:var(--color-text-primary);}.site-logo-dot{color:var(--color-text-accent);margin-left:-2px;}.custom-logo-link{display:inline-flex;align-items:center;max-height:32px;transition:opacity var(--transition-fast);}.custom-logo-link:hover{opacity:0.8;}.custom-logo{max-height:32px;width:auto;height:auto;}/*--------------------------------------------------------------# Desktop Navigation (Hidden on Mobile)--------------------------------------------------------------*/.main-navigation{display:none;}.nav-menu{display:flex;align-items:center;gap:var(--navbar-menu-gap);list-style:none;margin:0;padding:0;}.nav-menu .menu-item{margin:0;padding:0;}.nav-menu .menu-item a{display:inline-flex;align-items:center;padding:var(--spacing-8) var(--spacing-12);color:var(--color-text-primary);font-family:var(--font-primary);font-size:var(--navbar-menu-font-size);font-weight:var(--font-weight-medium);line-height:20px;text-decoration:none;transition:color var(--transition-fast),background-color var(--transition-fast);border-radius:var(--radius-small);}.nav-menu .menu-item a:hover,.nav-menu .menu-item a:focus{color:var(--color-primary);background-color:rgba(244,183,64,0.1);}.nav-menu .menu-item.current-menu-item a{color:var(--color-primary);}/*--------------------------------------------------------------# Header CTA Button (Hidden on Mobile)--------------------------------------------------------------*/.header-cta{display:none;flex-shrink:0;}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-8);font-family:var(--font-primary);font-weight:var(--font-weight-semibold);text-decoration:none;border:none;cursor:pointer;transition:all var(--transition-base);white-space:nowrap;}.btn:focus{outline:2px solid var(--color-primary);outline-offset:2px;}.btn-primary{background:var(--button-bg-primary);color:var(--button-text-primary);border-radius:var(--button-border-radius);box-shadow:var(--button-shadow);height:var(--button-height-navbar);padding:0 var(--spacing-24);font-size:var(--button-font-size-navbar);line-height:var(--button-line-height-navbar);}.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--button-shadow),0px 6px 12px rgba(0,0,0,0.15);}.btn-primary:active{transform:translateY(0);}.btn-icon{flex-shrink:0;}/*--------------------------------------------------------------# Mobile Menu Toggle (Visible on Mobile Only)--------------------------------------------------------------*/.mobile-menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:40px;height:40px;padding:8px;background:transparent;border:none;cursor:pointer;z-index:calc(var(--z-index-sticky) + 2);transition:all var(--transition-fast);border-radius:var(--radius-small);}.mobile-menu-toggle:hover{background:rgba(244,183,64,0.1);}.mobile-menu-toggle:focus{outline:2px solid var(--color-primary);outline-offset:2px;}.hamburger-line{display:block;width:24px;height:2px;background:var(--color-text-primary);transition:all var(--transition-base);border-radius:2px;}.mobile-menu-toggle[aria-expanded="true"] .hamburger-line:nth-child(1){transform:translateY(7px) rotate(45deg);}.mobile-menu-toggle[aria-expanded="true"] .hamburger-line:nth-child(2){opacity:0;transform:translateX(-10px);}.mobile-menu-toggle[aria-expanded="true"] .hamburger-line:nth-child(3){transform:translateY(-7px) rotate(-45deg);}/*--------------------------------------------------------------# Mobile Navigation Overlay--------------------------------------------------------------*/.mobile-navigation{position:fixed;top:65px;left:0;right:0;bottom:0;background:var(--color-bg-cream);z-index:calc(var(--z-index-sticky) - 1);overflow-y:auto;-webkit-overflow-scrolling:touch;transform:translateX(100%);transition:transform var(--transition-base);box-shadow:inset 0 1px 0 var(--color-border);}.mobile-navigation[aria-hidden="false"]{transform:translateX(0);}.mobile-nav-inner{padding:var(--spacing-32) var(--spacing-24);}.mobile-nav-menu{list-style:none;margin:0;padding:0;}.mobile-nav-menu .menu-item{margin:0;padding:0;border-bottom:1px solid var(--color-border);}.mobile-nav-menu .menu-item:last-child{border-bottom:none;}.mobile-nav-menu .menu-item a{display:block;padding:var(--spacing-20) var(--spacing-16);color:var(--color-text-primary);font-family:var(--font-primary);font-size:var(--font-size-body-large-mobile);font-weight:var(--font-weight-medium);line-height:var(--line-height-body-large-mobile);text-decoration:none;transition:all var(--transition-fast);}.mobile-nav-menu .menu-item a:hover,.mobile-nav-menu .menu-item a:focus{background:rgba(244,183,64,0.1);color:var(--color-primary);padding-left:var(--spacing-24);}.mobile-nav-menu .menu-item.current-menu-item a{color:var(--color-primary);font-weight:var(--font-weight-semibold);}.mobile-cta{margin-top:var(--spacing-32);padding-top:var(--spacing-24);border-top:1px solid var(--color-border);}.btn-mobile{width:100%;height:var(--button-height-mobile);font-size:var(--button-font-size-mobile);line-height:var(--button-line-height);}/*--------------------------------------------------------------# Tablet Styles (768px - 1023px)--------------------------------------------------------------*/@media screen and (min-width:768px){.header-container{height:72px;padding:0 var(--spacing-40);}.mobile-navigation{top:72px;}.site-logo-link,.custom-logo-link{font-size:24px;}.mobile-nav-menu .menu-item a{font-size:var(--font-size-h3-mobile);line-height:var(--line-height-h3-mobile);}}/*--------------------------------------------------------------# Desktop Styles (1024px+)--------------------------------------------------------------*/@media screen and (min-width:1024px){.header-container{height:var(--navbar-height-desktop);padding:0 var(--container-padding-desktop);max-width:var(--container-max-width);}.main-navigation{display:flex;align-items:center;flex:1;justify-content:center;}.header-cta{display:flex;}.mobile-menu-toggle{display:none;}.mobile-navigation{display:none;}.site-logo-link,.custom-logo-link{font-size:var(--navbar-logo-size);}.custom-logo{max-height:29px;}}/*--------------------------------------------------------------# Large Desktop (1440px+)--------------------------------------------------------------*/@media screen and (min-width:1440px){.header-container{padding:0 calc((100vw - var(--container-max-width)) / 2 + var(--container-padding-desktop));}}/*--------------------------------------------------------------# Accessibility & Reduced Motion--------------------------------------------------------------*/.skip-link{position:absolute;top:-100px;left:var(--spacing-16);z-index:calc(var(--z-index-tooltip) + 1);padding:var(--spacing-12) var(--spacing-16);background:var(--color-primary);color:var(--color-text-primary);text-decoration:none;font-weight:var(--font-weight-semibold);border-radius:var(--radius-small);transition:top var(--transition-fast);}.skip-link:focus{top:var(--spacing-16);outline:2px solid var(--color-text-primary);outline-offset:2px;}@media (prefers-reduced-motion:reduce){.mobile-navigation,.mobile-menu-toggle *,.nav-menu .menu-item a,.btn,.site-logo-link{transition:none;}}/*--------------------------------------------------------------# Print Styles--------------------------------------------------------------*/@media print{.site-header{position:relative;border-bottom:2px solid var(--color-border);}.mobile-menu-toggle,.header-cta,.main-navigation{display:none;}}