{% set uid = module.module_id %}

/* ==== Scope + variables ==== */
#ll-header-{
  /* match your site container & main menu rhythm */
  --page-max: 1200px;
  --gutter-desktop: 40px;
  --gutter-mobile: 24px;
  --breakpoint: 767px;        /* ← matches your main site */

  --text: #0F1A28;
  --orange: #FCBA63;
  --watermelon: #F05E56;
  --watermelon-dark: #E2544C;
  --grey-bg: #ECF1F4;
  --white: #fff;

  --nav-gap: 1.25rem;         /* ~ your 0.875rem x 1.4 */
  --item-pad-y: .7rem;        /* from your .menu__item--depth-1 */
  --item-pad-x: .875rem;

  --cta-radius: 12px;

  position: relative; z-index: 50; width:100%;
  text-align: left !important;   /* defeat theme centering */
}

#ll-header- *, #ll-form-modal- * { box-sizing: border-box; }

/* Container */
#ll-header- .ll-container{
  max-width: var(--page-max);
  margin: 0 auto;
  padding-left: var(--gutter-mobile);
  padding-right: var(--gutter-mobile);
}
@media (min-width: 768px){
  #ll-header- .ll-container{
    padding-left: var(--gutter-desktop) !important;
    padding-right: var(--gutter-desktop) !important;
  }
}

/* Row – FLEX on all sizes (kept simple & resilient) */
#ll-header- .ll-row{
  display:flex !important; align-items:center !important;
  justify-content: space-between !important;
  gap: 1rem !important; padding: 10px 0 !important; min-width: 0 !important;
}

/* Neutralise common theme overrides */
#ll-header- .ll-row > *{ float:none !important; position:static !important; }

/* Logo */
#ll-header- .ll-brand{ display:flex; align-items:center; margin:0; }
#ll-header- .ll-brand-logo{
  display:block; height:40px; width:auto; max-width:none; max-height:none;
  transform: translateY(1px);
}

/* Desktop nav (≥768px) */
#ll-header- .ll-desktop-nav{
  list-style:none; display:flex; align-items:center; flex-wrap:nowrap;
  gap: var(--nav-gap); margin:0; padding:0; min-width:0;
  margin-left:auto; /* push right */
}
#ll-header- .ll-desktop-nav li{ white-space:nowrap; }
#ll-header- .ll-desktop-nav a{
  text-decoration:none; color:var(--text);
  font-size: .917rem;                 /* matches your .menu__link */
  line-height: 1.667rem;              /* matches your .menu__link */
  padding: var(--item-pad-y) var(--item-pad-x);
  display: inline-block;
}
#ll-header- .ll-desktop-nav a:hover,
#ll-header- .ll-desktop-nav a:focus{ color: var(--orange); text-decoration:none; }

/* Shrink text in the same window as your main menu */
@media (min-width: 768px) and (max-width: 1150px){
  #ll-header- .ll-desktop-nav a{ font-size: .833rem; }
  #ll-header- .ll-cta{ padding: 10px 16px; font-size: .95rem; }
}

/* CTA (desktop) */
#ll-header- .ll-cta{
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--watermelon); color:var(--white);
  padding: 12px 20px; border-radius: var(--cta-radius);
  border:0; cursor:pointer; font-weight:600; font-size: 1rem; line-height:1; letter-spacing:.2px;
  white-space:nowrap; box-shadow:0 2px 0 rgba(0,0,0,.05);
  transition: background .2s ease, transform .1s ease;
}
#ll-header- .ll-cta:hover{ background: var(--watermelon-dark); }
#ll-header- .ll-cta:active{ transform: translateY(1px); }

/* Hamburger (≤767px) */
#ll-header- .ll-menu-toggle{
  display:none; border:0; background:transparent; cursor:pointer;
  width:36px; height:28px; padding:0; margin-left:auto;
}
#ll-header- .ll-bar{ display:block; height:3px; background:var(--text); margin:5px 0; border-radius:2px; }

/* Mobile overlay */
#ll-header- .ll-overlay{
  position:fixed; inset:0; background:var(--grey-bg);
  display:none; z-index:9999; padding:0 var(--gutter-mobile);
}
#ll-header- .ll-overlay.open{ display:block; }
#ll-header- .ll-close{
  position:absolute; right:16px; top:12px; font-size:28px; line-height:1;
  color:var(--watermelon); background:none; border:none; cursor:pointer;
}
#ll-header- .ll-overlay-header{ padding:20px 0 0; }
#ll-header- .ll-overlay-logo{ height:40px; width:auto; display:block; }
#ll-header- .ll-overlay-body{
  height: calc(100% - 60px);
  display:grid; grid-template-rows:1fr auto; padding:12px 0 16px;
}
#ll-header- .ll-overlay-list{ list-style:none; padding:48px 0 12px; margin:0; }
#ll-header- .ll-overlay-link{
  display:block; padding:.7rem 2rem; text-decoration:none;
  font-size:1.083rem; color:var(--text); font-weight:500;
  border-bottom:2px solid #EBEFF3;
}
#ll-header- .ll-overlay-link:hover{ color:var(--orange); }
#ll-header- .ll-overlay-cta{
  display:block; width:100%; text-align:center; padding:14px 16px; margin:8px 0 12px;
  background:var(--watermelon); color:var(--white); font-weight:600; font-size:16px;
  border-radius: var(--cta-radius); border:0; cursor:pointer;
}
#ll-header- .ll-overlay-cta:hover{ background:var(--watermelon-dark); }

/* ===== Visibility (mirror your main menu) ===== */
@media (max-width: 767px){
  #ll-header- .ll-desktop-nav{ display:none !important; }
  #ll-header- .ll-menu-toggle{ display:block !important; }
}
@media (min-width: 768px){
  #ll-header- .ll-menu-toggle,
  #ll-header- .ll-overlay{ display:none !important; }
  #ll-header- .ll-desktop-nav{ display:flex !important; }
}

/* ===== Modal ===== */
#ll-form-modal-{ position:fixed; inset:0; display:none; z-index:10000; }
#ll-form-modal-.is-open{ display:block; }
#ll-form-modal- .ll-modal-backdrop{ position:absolute; inset:0; background:rgba(15,26,40,.55); }
#ll-form-modal- .ll-modal-dialog{
  position:relative; max-width:800px; width:92%; margin:7vh auto 0;
  background:#fff; border-radius:16px; box-shadow:0 12px 40px rgba(0,0,0,.25);
  overflow:auto; max-height:86vh;
}
#ll-form-modal- .ll-modal-close{
  position:absolute; right:16px; top:14px; font-size:28px; line-height:1;
  color:var(--watermelon); background:none; border:none; cursor:pointer; z-index:1;
}
#ll-form-modal- .ll-modal-body{ padding:28px; }
#ll-form-modal- .ll-form-title{ margin-bottom:10px; }
#ll-form-modal- .ll-form-title h2{
  margin:0 0 8px; font-size:clamp(28px, 4.2vw, 44px); line-height:1.1; color:var(--text); font-weight:800;
}
#ll-form-modal- .ll-emph{ color:var(--watermelon); }
#ll-form-modal- .ll-form-title p{
  margin:6px 0; font-size:clamp(16px, 2.2vw, 22px); line-height:1.5; color:var(--text);
}
#ll-form-modal- #ll-hs-form-{ min-height:120px; }
#ll-form-modal- .ll-loading{ font-size:14px; color:#6b7280; }

/* Keyboard focus */
#ll-header- .ll-desktop-nav a:focus-visible,
#ll-header- .ll-overlay-link:focus-visible,
#ll-header- .ll-cta:focus-visible,
#ll-header- .ll-overlay-cta:focus-visible,
#ll-form-modal- .ll-modal-close:focus-visible,
#ll-header- .ll-close:focus-visible{
  outline: 2px solid var(--orange); outline-offset: 2px; border-radius: 6px;
}
#ll-header- .ll-desktop-nav a:focus,
#ll-header- .ll-overlay-link:focus,
#ll-header- .ll-cta:focus,
#ll-header- .ll-overlay-cta:focus,
#ll-form-modal- .ll-modal-close:focus,
#ll-header- .ll-close:focus{
  outline: 2px solid var(--orange); outline-offset: 2px; border-radius: 6px;
}

/* Motion & bounce guard */
@media (prefers-reduced-motion: reduce){
  #ll-header- * , #ll-form-modal- * { transition:none !important; animation:none !important; }
}
#ll-header- .ll-overlay.open, #ll-form-modal-.is-open{ overscroll-behavior: contain; }

--page-max: 1200px;         /* site container width  */
--gutter-desktop: 40px;     /* left/right inner padding on desktop */
--gutter-mobile: 24px;      /* left/right inner padding on mobile  */

/* Emphasis styling */
.ll-emph {
  color: #F05E56; /* Lawyerlink brand red */
  font-weight: bold;
}
