/* ks/site-header: header bar, wordmark, nav links, drop-downs, the panel button and the panel
   (mega menu), token-driven. Behaviour: view.js. */
/* == header == */
.header{position:fixed;inset:0 0 auto 0;z-index:40;color:var(--text-on-dark);background:linear-gradient(180deg,var(--primary-d-1-70),transparent);transition:background .35s,box-shadow .35s,transform .4s var(--ease-out)}
.header--hidden{transform:translateY(-100%);box-shadow:none}
.header--scrolled{background:var(--primary-95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:var(--shadow-2)}
.header__bar{display:flex;align-items:center;justify-content:space-between;height:var(--size-header);transition:height .35s var(--ease-out)}
.header--scrolled .header__bar{height:var(--size-header-scrolled)}
.header__actions{display:flex;align-items:center;gap:var(--space-l)}
.header__phone{color:var(--white);text-decoration:none;font-size:var(--text-m);font-weight:700}
.header__cta{padding:var(--space-s) var(--space-m)}
.header--menu-open{background:var(--primary)}
.header__call{display:none}
@media (max-width:720px){
  .header__bar,.header--scrolled .header__bar{height:64px}
  .header__cta{display:none}
  .header__phone{font-size:var(--text-m)}
  .header__actions{margin-left:auto;gap:var(--space-3xs)}
  .header__phone{display:none}
  .header__call{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--white);transition:background .2s}
  .header__call-icon{width:21px;height:21px}
  .header__call:hover,.header__call:focus-visible{background:var(--white-10)}
}
@media (max-width:520px){
  /* Narrow phones: the call button lives in the bottom bar, so the header keeps the logo and menu. */
  .header__phone{display:none}
}

/* == nav-links == */
.nav-links{display:flex;align-items:center;gap:var(--space-xl);font-size:var(--text-s);font-weight:600}
.nav-links__link{text-decoration:none;color:var(--light-80);transition:color .2s}
.nav-links__link:hover,.nav-links__link[aria-current="page"]{color:var(--white)}
@media (max-width:1180px){
  /* The links move into the panel; the panel button stays, next to the phone. */
  .nav-links{margin-left:auto;margin-right:var(--space-l)}
  .nav-links__link{display:none}
}
@media (max-width:720px){
  /* Phones: hamburger + call icon in the header. The menu fills the screen below the header;
   the links scroll and the booking strip stays pinned to the bottom. */
  .nav-links{order:3;margin:0}
}

/* == nav-drop == */
.nav-drop{position:relative}
.nav-drop__button{display:inline-flex;align-items:center;gap:var(--space-2xs);background:none;border:0;padding:var(--space-2xs) 0;color:var(--light-80);font:600 var(--text-s)/1 var(--font-body);cursor:pointer;transition:color .2s}
.nav-drop__button:hover,.nav-drop__button[aria-expanded="true"],.nav-drop__button[data-current]{color:var(--white)}
.nav-drop__icon{width:16px;height:16px;transition:transform .3s var(--ease-out)}
.nav-drop__button[aria-expanded="true"] .nav-drop__icon{transform:rotate(180deg)}
.nav-drop__menu{position:absolute;top:calc(100% + 14px);left:-18px;min-width:170px;background:var(--white);border-top:3px solid var(--secondary);border-radius:0 0 var(--radius-s) var(--radius-s);box-shadow:var(--shadow-12);padding:var(--space-xs) var(--space-m);display:grid}
.nav-drop__menu[hidden]{display:none}
.nav-drop__menu:not([hidden]){animation:rise .2s var(--ease-out)}
.nav-drop__link{display:block;color:var(--text-body);padding:var(--space-xs) 0;text-decoration:underline 1px transparent;text-underline-offset:6px;transition:text-decoration-color .2s}
.nav-drop__link:hover{color:var(--primary);text-decoration-color:var(--secondary)}
.nav-drop__link[aria-current="page"]{color:var(--secondary-d-1);text-decoration-color:var(--secondary)}
@media (max-width:1180px){
  .nav-drop{display:none}
}

/* == menu-btn == */
.menu-btn{display:inline-flex;align-items:center;gap:var(--space-2xs);background:none;border:0;padding:var(--space-2xs) 0;color:var(--light-80);font:600 var(--text-s)/1 var(--font-body);cursor:pointer;transition:color .2s}
.menu-btn:hover,.menu-btn[aria-expanded="true"],.menu-btn[data-current]{color:var(--white)}
.menu-btn__icon{width:16px;height:16px;flex:none;transition:transform .3s var(--ease-out)}
.menu-btn[aria-expanded="true"] .menu-btn__icon{transform:rotate(180deg)}
.menu-btn__short-label,.menu-btn__burger{display:none}
@media (max-width:720px){
  .menu-btn{width:44px;height:44px;padding:0;justify-content:center;border-radius:50%;color:var(--white)}
  .menu-btn__icon,.menu-btn__label{display:none}
  .menu-btn__short-label{display:block;position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .menu-btn__burger{display:grid;gap:var(--space-3xs);width:22px}
  .menu-btn__bar{display:block;height:2px;border-radius:var(--radius-xs);background:currentColor;transition:transform .3s var(--ease-out),opacity .2s}
  .menu-btn[aria-expanded="true"] .menu-btn__bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .menu-btn[aria-expanded="true"] .menu-btn__bar:nth-child(2){opacity:0}
  .menu-btn[aria-expanded="true"] .menu-btn__bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* == practice-menu == */
.practice-menu{position:absolute;left:0;right:0;top:100%;background:var(--white);color:var(--text-body);border-top:3px solid var(--secondary);border-bottom:3px solid var(--secondary);box-shadow:var(--shadow-7);max-height:calc(100svh - var(--size-header));overflow:auto;overscroll-behavior:contain}
.practice-menu:not([hidden]){animation:rise .25s var(--ease-out)}
/* Columns size to their text and spread across the full width, so the last column ends at the right edge. */
.practice-menu__grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-l) var(--space-xl);padding-block:var(--space-xl) var(--space-xl)}
.practice-menu__heading{font-family:var(--font-body);font-size:var(--text-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--secondary-d-1);margin:0 0 var(--space-s)}
.practice-menu__heading-link{text-decoration:none}
.practice-menu__heading-link:hover{color:var(--primary)}
.practice-menu__list{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-4xs)}
/* Continuation column: an empty heading keeps its links level with the first. */
/* Menu links are type only: an accent underline fades in on hover and marks the current page. */
.practice-menu__link{display:block;padding:var(--space-xs) 0;text-decoration:underline 1px transparent;text-underline-offset:6px;font-weight:600;font-size:var(--text-s);line-height:1.35;transition:color .2s,text-decoration-color .2s}
.practice-menu__link:hover{color:var(--primary);text-decoration-color:var(--secondary)}
.practice-menu__link[aria-current="page"]{color:var(--secondary-d-1);text-decoration-color:var(--secondary)}
.practice-menu__strip{background:var(--neutral-l-4);color:var(--neutral);border-top:1px solid var(--border)}
.practice-menu__strip-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-m) var(--space-l);flex-wrap:wrap;padding-block:var(--space-m)}
.practice-menu__strip-text{margin:0;font-size:var(--text-s)}
.practice-menu__strip-lead{font-family:var(--font-heading);font-weight:500;font-size:var(--text-l);color:var(--primary);margin-right:var(--space-xs)}
.practice-menu__strip-actions{display:flex;gap:var(--space-s);flex-wrap:wrap}
.practice-menu__strip-btn{padding:var(--space-s) var(--space-m)}
.practice-menu__list--more{display:none}
@media (max-width:1180px){
  .practice-menu__list--more{display:grid;flex-basis:100%;border-top:1px solid var(--border);padding-top:var(--space-s)}
  /* Top-level pages in the panel: set like the column headings. */
  .practice-menu__link--more{font-size:var(--text-xs);font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--secondary-d-1);padding:var(--space-s) 0}
  .practice-menu__link--more:hover{color:var(--primary)}
}
@media (max-width:720px){
  .practice-menu{display:flex;flex-direction:column;height:calc(100dvh - 100%);max-height:none;overflow:hidden;border-bottom:0}
  .practice-menu[hidden]{display:none}
  .practice-menu__grid{flex:1 1 auto;flex-wrap:nowrap;min-height:0;overflow-y:auto;overscroll-behavior:contain;width:100%;padding-inline:var(--space-gutter)}
  .practice-menu__col{flex:none}
  .practice-menu__list--more{flex-grow:0;flex-shrink:0}
  .practice-menu__strip{flex:none;box-shadow:var(--shadow-8)}
  .practice-menu__strip-inner{padding-block:var(--space-s) calc(var(--space-s) + env(safe-area-inset-bottom));gap:var(--space-xs)}
  .practice-menu__strip-text{font-size:var(--text-s)}
  .practice-menu__strip-lead{font-size:var(--text-l)}
  .practice-menu__grid{flex-direction:column;padding-block:var(--space-l) var(--space-l);gap:var(--space-l)}
  .practice-menu__col--cont{margin-top:calc(-1 * var(--space-l))}
  .practice-menu__heading--spacer{display:none}
  .practice-menu__strip-lead{display:block;margin:0 0 var(--space-4xs)}
  .practice-menu__strip-actions,.practice-menu__strip-btn{width:100%}
}

/* == menu-lock (set on <html> and <body> by view.js) == */
@media (max-width:720px){
  .menu-lock{overflow:hidden}
}
/* signed-in users: WordPress's admin bar is fixed at the top (32px, 46px under 782px; absolute under 600px) */
.admin-bar .header{top:var(--wp-admin--admin-bar--height)}
@media (max-width:600px){.admin-bar .header{top:0}}
