/*
 * LH header + footer v2 — group frame shared with UKSE and UKSR.
 * Spec: shared-docs/design/HEADER-FOOTER-V2-PORT.md.
 * Rules ported from UKSE's v2.css via UKSR's frame.css (class names identical on purpose, so a
 * fix on one site can be copied to the others). Tokens are namespaced --v2-* because LH's own
 * CSS already uses --accent and --cta. LH overrides (cyan accent, see-through dark header over
 * the hero, LH hero list) are at the end.
 * Only loads when lh_design_v2() is true (inc/design-v2.php). Never aggregated by Autoptimize.
 */
body.lh-v2{
  --v2-navy: #000032;
  --v2-cta: #E6007E;
  --v2-cta-hover: #C4006B;
  --v2-magenta: #E6007E;
  --v2-blue: #6ACAF3;
  --v2-accent: #1C94D2;
  --v2-accent-text: #0E6E9E;
  --v2-sky: #E8F6FD;
  --v2-soft: #F5F7FA;
  --v2-line: #E4E6EE;
  --v2-font: proxima-nova, "Proxima Nova", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --v2-head-h: 72px;
}
@media (min-width: 960px){ body.lh-v2{--v2-head-h: 84px;} }

body.lh-v2 .site-head, body.lh-v2 .site-foot2, body.lh-v2 .sh-drawer, body.lh-v2 .sh-sticky{font-family: var(--v2-font); line-height: 1.5;}
body.lh-v2 .site-head :is(a, button, p, img), body.lh-v2 .site-foot2 :is(a, p, img, h2, h3, ul, li), body.lh-v2 .sh-drawer :is(a, p, img){margin: 0;}
body.lh-v2 .site-head img, body.lh-v2 .site-foot2 img{max-width: 100%; display: block;}
body.lh-v2 .v2-wrap{max-width: 1240px; margin: 0 auto; padding-inline: 20px; box-sizing: border-box; width: 100%;}

/* ── Header ──────────────────────────────────────────────────────────── */
.lh-v2 .site-head{height: var(--v2-head-h); display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-inline: 20px; position: relative; z-index: 40; box-sizing: border-box;}
@media (min-width: 960px){ .lh-v2 .site-head{padding-inline: 48px;} }
.lh-v2 .btn-enquire{display: inline-flex; align-items: center; justify-content: center; gap: 8px; background: var(--v2-cta); color: #FFFFFF !important; text-decoration: none; font-weight: 700; font-size: 18px; min-height: 50px; padding: 0 24px; border-radius: 999px; border: 0; cursor: pointer; white-space: nowrap;}
.lh-v2 .btn-enquire:hover{background: var(--v2-cta-hover); text-decoration: none;}
.lh-v2 .sh-logo{flex-shrink: 0; display: inline-flex;}
.lh-v2 .sh-logo img{height: 38px; width: auto;}
.lh-v2 .sh-nav{display: none; align-items: center; gap: 26px; font-weight: 700; font-size: 15px;}
.lh-v2 .sh-nav a, .lh-v2 .sh-dd__btn{white-space: nowrap; text-decoration: none;}
.lh-v2 .sh-tools{display: none; align-items: center; gap: 10px;}
.lh-v2 .sh-icon{width: 44px; height: 44px; border: 0; border-radius: 10px; background: transparent; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;}
.lh-v2 .site-head .sh-icon svg{width: 20px; height: 20px;}
.lh-v2 .sh-dd{position: relative;}
.lh-v2 .sh-dd__btn{border: 0; background: transparent; font: inherit; font-weight: 700; font-size: 15px; display: inline-flex; align-items: center; gap: 4px; cursor: pointer; padding: 8px 4px;}
.lh-v2 .sh-dd__btn svg:last-child{transition: transform .15s;}
.lh-v2 .sh-dd.is-open .sh-dd__btn svg:last-child{transform: rotate(180deg);}
.lh-v2 .sh-lang{gap: 6px; padding: 8px 10px; border-radius: 10px;}
.lh-v2 .sh-dd__menu{display: none; position: absolute; top: calc(100% + 8px); left: -12px; min-width: 210px; background: #FFFFFF; border-radius: 14px; padding: 8px; box-shadow: 0 18px 40px rgba(0,0,50,.22); flex-direction: column; z-index: 30;}
.lh-v2 .sh-dd__menu--right{left: auto; right: 0; max-height: 70vh; overflow-y: auto;}
.lh-v2 .sh-dd.is-open .sh-dd__menu{display: flex;}
.lh-v2 .sh-dd__menu a{color: var(--v2-navy) !important; padding: 9px 12px; border-radius: 8px; font-weight: 700; font-size: 15px; text-decoration: none; display: flex; align-items: center; gap: 10px;}
.lh-v2 .sh-dd__menu a:hover{background: var(--v2-soft); text-decoration: none;}
.lh-v2 .sh-dd__menu a[aria-current]{background: var(--v2-sky);}
.lh-v2 .sh-enq{min-height: 44px; font-size: 16px; padding: 0 20px; flex-shrink: 0;}
.lh-v2 .sh-burger{width: 44px; height: 44px; border: 1px solid rgba(255,255,255,.45); border-radius: 10px; background: transparent; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;}
.lh-v2 .sh-search{position: absolute; left: 20px; right: 20px; top: 100%; display: flex; gap: 8px; background: #FFFFFF; border-radius: 14px; padding: 8px; box-shadow: 0 18px 40px rgba(0,0,50,.22); margin: 0; z-index: 35;}
.lh-v2 .sh-search[hidden]{display: none;}
.lh-v2 .sh-search input{flex: 1; min-width: 0; border: 1.5px solid #C9CCDA; border-radius: 10px; padding: 10.5px 14px; height: 46px; font: inherit; font-size: 16px; line-height: 22px; color: var(--v2-navy); box-sizing: border-box; -webkit-appearance: none; appearance: none; background: #FFFFFF; margin: 0;}
.lh-v2 .sh-search button{border: 0; border-radius: 10px; background: var(--v2-navy); color: #FFFFFF; font: inherit; font-weight: 700; padding: 0 18px; cursor: pointer; margin: 0;}
@media (min-width: 960px){
  .lh-v2 .sh-logo img{height: 44px;}
  .lh-v2 .sh-nav, .lh-v2 .sh-tools{display: flex;}
  .lh-v2 .sh-burger{display: none;}
  .lh-v2 .sh-search{left: auto; right: 48px; width: 460px;}
}
@media (min-width: 960px) and (max-width: 1180px){
  .lh-v2 .sh-nav{gap: 16px;}
  .lh-v2 .sh-tools{gap: 8px;}
  .lh-v2 .sh-nav a, .lh-v2 .sh-dd__btn{font-size: 14px;}
  .lh-v2 .sh-enq{padding: 0 16px; font-size: 15px;}
  .lh-v2 .site-head .sh-logo img{height: 38px;}
}

/* Dark (see-through, over a hero): white logo, white links. Light (in the page flow): colour logo, navy links. */
.lh-v2 .site-head--dark{color: #FFFFFF; background: transparent;}
.lh-v2 .site-head--dark :is(.sh-nav a, .sh-dd__btn, .sh-icon, .sh-burger){color: #FFFFFF !important;}
.lh-v2 .site-head--dark .sh-nav a:hover{color: var(--v2-blue) !important;}
.lh-v2 .site-head--dark :is(.sh-icon, .sh-lang):hover{background: rgba(255,255,255,.12);}
.lh-v2 .site-head--dark .sh-lang .sh-flag{box-shadow: 0 0 0 1px rgba(255,255,255,.35);}
.lh-v2 .site-head--dark .sh-logo__colour{display: none;}
.lh-v2 .site-head--light{color: var(--v2-navy); background: #FFFFFF; border-bottom: 1px solid rgba(0,0,50,.06);}
.lh-v2 .site-head--light :is(.sh-nav a, .sh-dd__btn, .sh-icon, .sh-burger){color: var(--v2-navy) !important;}
.lh-v2 .site-head--light .sh-nav a:hover{color: var(--v2-accent-text) !important;}
.lh-v2 .site-head--light :is(.sh-icon, .sh-lang):hover{background: var(--v2-soft);}
.lh-v2 .site-head--light .sh-burger{border-color: #D5D8E3;}
.lh-v2 .site-head--light .sh-logo__white{display: none;}

/* ── Phone drawer ────────────────────────────────────────────────────── */
.lh-v2 .sh-drawer{position: fixed; inset: 0; z-index: 900;}
.lh-v2 .sh-drawer[hidden]{display: none;}
.lh-v2 .sh-drawer__shade{position: absolute; inset: 0; background: rgba(0,0,50,.5);}
.lh-v2 .sh-drawer__panel{position: absolute; top: 0; right: 0; bottom: 0; width: min(360px, 88vw); background: var(--v2-navy); color: #FFFFFF; padding: calc(14px + env(safe-area-inset-top, 0px)) 20px calc(24px + env(safe-area-inset-bottom, 0px)); display: flex; flex-direction: column; gap: 18px; overflow-y: auto; box-sizing: border-box;}
.lh-v2 .sh-drawer__top{display: flex; justify-content: space-between; align-items: center;}
.lh-v2 .sh-drawer__top img{height: 34px; width: auto;}
.lh-v2 .sh-drawer .sh-icon{color: #FFFFFF;}
.lh-v2 .sh-drawer .sh-icon:hover{background: rgba(255,255,255,.12);}
.lh-v2 .sh-drawer__search{display: flex; background: #FFFFFF; border-radius: 12px; overflow: hidden; flex-shrink: 0; margin: 0;}
.lh-v2 .sh-drawer__search input{flex: 1; min-width: 0; border: 0; padding: 12px 14px; height: 46px; font: inherit; font-size: 16px; line-height: 22px; color: var(--v2-navy); box-sizing: border-box; -webkit-appearance: none; appearance: none; border-radius: 10px; background: #FFFFFF; margin: 0;}
.lh-v2 .sh-drawer__search button{border: 0; background: var(--v2-navy); color: #FFFFFF; width: 48px; margin: 4px; border-radius: 9px; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0;}
.lh-v2 .sh-drawer__nav{display: flex; flex-direction: column;}
.lh-v2 .sh-drawer__nav > a, .lh-v2 .sh-drawer__nav summary{color: #FFFFFF !important; text-decoration: none; font-weight: 700; font-size: 19px; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.14); display: flex; justify-content: space-between; align-items: center; cursor: pointer; list-style: none;}
.lh-v2 .sh-drawer__nav summary::-webkit-details-marker{display: none;}
.lh-v2 .sh-drawer__nav details[open] summary svg{transform: rotate(180deg);}
.lh-v2 .sh-drawer__nav details a{display: block; color: #DDE0F0 !important; text-decoration: none; padding: 9px 0 9px 14px; font-size: 16px;}
.lh-v2 .sh-drawer__enq{width: 100%; box-sizing: border-box;}
.lh-v2 .sh-drawer__lang{display: flex; flex-direction: column; gap: 6px; font-size: 14px; color: #C9CCE4; margin: 0;}
.lh-v2 .sh-drawer__lang span{display: flex; gap: 6px; align-items: center;}
.lh-v2 .sh-drawer__lang select{height: 46px; border-radius: 10px; border: 0; padding: 0 12px; font: inherit; font-weight: 700; color: var(--v2-navy); background: #FFFFFF; margin: 0; width: 100%;}
.lh-v2 .sh-drawer__stay span{font-size: 13px; color: #C9CCE4; display: block; margin-bottom: 8px;}
.lh-v2 .sh-drawer__stay div{display: flex; gap: 10px; align-items: center; flex-wrap: wrap;}
.lh-v2 .sh-drawer__stay a{background: #FFFFFF; border-radius: 10px; padding: 6px 10px; display: inline-flex;}
.lh-v2 .sh-drawer__stay img{height: 34px; width: auto;}
.lh-v2 .sh-drawer__contact{display: flex; flex-direction: column; font-size: 15px; color: #DDE0F0; user-select: all;}
.lh-v2 .sh-drawer__portal{color: var(--v2-blue) !important; font-weight: 700; font-size: 15px; text-decoration: none;}
body.sh-locked{overflow: hidden;}
/* The chat bubble and the cookie banner would sit over the open menu */
body.sh-locked #lh-chat-widget-host, body.sh-locked #lh-cookie-consent{display: none !important;}

/* ── Desktop slim sticky bar (navy, like UKSE) ───────────────────────── */
.lh-v2 .sh-sticky{display: none;}
@media (min-width: 960px){
  .lh-v2 .sh-sticky{display: block; position: fixed; left: 0; right: 0; top: 0; z-index: 60; background: var(--v2-navy); box-shadow: 0 6px 20px rgba(0,0,50,.25); transform: translateY(-100%); transition: transform .2s;}
  .lh-v2 .sh-sticky.is-on{transform: none;}
  .lh-v2 .sh-sticky__in{max-width: 1240px; margin: 0 auto; padding: 0 20px; height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 20px; box-sizing: border-box;}
  .lh-v2 .sh-sticky .sh-logo img{height: 32px;}
  .lh-v2 .sh-sticky .sh-nav{display: flex;}
  .lh-v2 .sh-sticky :is(.sh-nav a, .sh-dd__btn){color: #FFFFFF !important;}
  .lh-v2 .sh-sticky .sh-nav a:hover{color: var(--v2-blue) !important;}
  .lh-v2 .sh-sticky .sh-enq{min-height: 40px; font-size: 15px;}
  .lh-v2 .sh-sticky__tools{display: inline-flex; align-items: center; gap: 10px;}
}
@media (prefers-reduced-motion: reduce){ .lh-v2 .sh-sticky{transition: none;} }

/* ── Footer ──────────────────────────────────────────────────────────── */
.lh-v2 .site-foot2{--sf-card: #0A0A44; --sf-line: rgba(255,255,255,.10); --sf-text: #B9BDDA; margin-top: 64px; color: #C9CCE4; font-size: 15px;}
.lh-v2 .sf-panels{background: var(--v2-navy); padding-block: 56px 0;}
.lh-v2 .sf-panels__grid{display: grid; gap: 16px;}
.lh-v2 .sf-panel{--brand: #1C94D2; background: var(--sf-card); border: 1.5px solid color-mix(in srgb, var(--brand) 70%, transparent); border-radius: 20px; padding: 26px 26px 24px; display: flex; flex-direction: column; gap: 20px; color: #FFFFFF; position: relative; overflow: hidden; transition: border-color .2s;}
.lh-v2 .sf-panel::before{content: ""; position: absolute; inset: 0 0 auto 0; height: 120px; background: radial-gradient(120% 100% at 0% 0%, color-mix(in srgb, var(--brand) 16%, transparent), transparent 70%); pointer-events: none;}
.lh-v2 .sf-panel:hover{border-color: var(--brand);}
.lh-v2 .sf-panel--lh{--brand: #1C94D2;}
.lh-v2 .sf-panel--ukse{--brand: #EE7218;}
.lh-v2 .sf-panel--uksr{--brand: #B1CB13;}
.lh-v2 .sf-panel img{height: 42px; width: auto; align-self: flex-start; position: relative;}
.lh-v2 .sf-panel ul{margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 18px; position: relative;}
.lh-v2 .sf-panel li{margin: 0; padding: 0; list-style: none;}
.lh-v2 .sf-panel li::before{content: none;}
.lh-v2 .sf-panel a:not(.sf-panel__btn){color: #DDE0F0 !important; font-weight: 600; font-size: 15px; text-decoration: none;}
.lh-v2 .sf-panel a:not(.sf-panel__btn):hover{color: #FFFFFF !important; text-decoration: none; box-shadow: inset 0 -1.5px 0 var(--brand);}
.lh-v2 .sf-panel__btn{position: relative; align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; background: transparent; border: 1.5px solid var(--brand); color: #FFFFFF !important; border-radius: 999px; padding: 10px 18px; margin-top: auto; font-weight: 600; font-size: 15px; text-decoration: none; transition: background .2s;}
.lh-v2 .sf-panel__btn:hover{background: color-mix(in srgb, var(--brand) 18%, transparent); text-decoration: none !important;}
.lh-v2 .sf-panel__btn svg{transition: transform .2s;}
.lh-v2 .sf-panel__btn:hover svg{transform: translateX(3px);}
.lh-v2 .sf-main{background: var(--v2-navy); padding-block: 56px 28px;}
.lh-v2 .sf-cols{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px 24px;}
.lh-v2 .sf-col{display: flex; flex-direction: column; gap: 0; min-width: 0;}
.lh-v2 .site-foot2 h2{font-size: 12px !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: #8E92B6 !important; font-weight: 700 !important; text-align: left !important; margin: 0 0 14px !important; padding: 0 0 14px !important; border-bottom: 1px solid var(--sf-line); line-height: 1.5 !important;}
.lh-v2 .site-foot2 h2::after{content: none !important; display: none !important;}
.lh-v2 .sf-col > a, .lh-v2 .sf-langs a{color: var(--sf-text) !important; font-size: 15px; padding-block: 5px; text-decoration: none; transition: color .15s, transform .15s; align-self: flex-start;}
.lh-v2 .sf-col > a:hover, .lh-v2 .sf-langs a:hover{color: #FFFFFF !important; text-decoration: underline; transform: translateX(3px);}
.lh-v2 .sf-col p{color: #DDE0F0; font-size: 15px;}
.lh-v2 .sf-contact{display: flex; flex-direction: column; gap: 6px;}
.lh-v2 .sf-contact a{color: #FFFFFF !important; font-size: 17px; font-weight: 600; text-decoration: none;}
.lh-v2 .sf-contact a:hover{color: var(--v2-blue) !important; text-decoration: none;}
.lh-v2 .sf-addr{color: #8E92B6 !important; font-size: 14px; line-height: 1.6; margin-top: 14px !important;}
.lh-v2 .sf-social{display: flex; gap: 10px; margin-top: 18px;}
.lh-v2 .sf-social a{width: 42px; height: 42px; border-radius: 50%; background: transparent; border: 1px solid rgba(255,255,255,.22); display: inline-flex; align-items: center; justify-content: center; color: #FFFFFF !important; transition: border-color .15s, background .15s;}
.lh-v2 .sf-social a:hover{background: rgba(255,255,255,.08); border-color: #FFFFFF;}
.lh-v2 .sf-langs{display: grid; grid-template-columns: max-content minmax(max-content, 1fr); column-gap: 22px; align-content: start;}
.lh-v2 .sf-langs h2{grid-column: 1 / -1;}
.lh-v2 .sf-langs a{display: inline-flex; align-items: center; gap: 9px;}
.lh-v2 .sf-langs a span{white-space: nowrap;}
.lh-v2 .sf-langs a[aria-current]{color: #FFFFFF !important; font-weight: 700;}
.lh-v2 .sf-langs a[dir="rtl"]{direction: ltr; flex-direction: row; justify-content: flex-start;}
.lh-v2 .sf-langs a[dir="rtl"] span{direction: rtl; unicode-bidi: isolate;}
.lh-v2 .sh-flag{width: 20px; height: 15px; border-radius: 3px; box-shadow: 0 0 0 1px rgba(0,0,50,.12); object-fit: cover; flex: none; display: inline-block;}
.lh-v2 .sf-bottom{display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 28px; border-top: 1px solid var(--sf-line); margin-top: 48px; padding-top: 24px !important; font-size: 13px; color: #8E92B6;}
.lh-v2 .sf-bottom img{height: 32px; width: auto; opacity: .9;}
.lh-v2 .sf-bottom nav{display: flex; flex-wrap: wrap; gap: 8px 20px;}
.lh-v2 .sf-bottom a{color: #B9BDDA !important; font-size: 13px; text-decoration: none;}
.lh-v2 .sf-bottom a:hover{color: #FFFFFF !important; text-decoration: underline;}
.lh-v2 .sf-note{flex: 1 1 100%; font-size: 13px; color: #8E92B6;}
.lh-v2 .sf-cols .sf-col:nth-child(n+3){grid-column: 1 / -1;}
@media (min-width: 760px){
  .lh-v2 .sf-panels__grid{grid-template-columns: repeat(3, minmax(0, 1fr));}
  .lh-v2 .sf-cols{grid-template-columns: 1fr 1fr;}
  .lh-v2 .sf-cols .sf-col:nth-child(n+3){grid-column: auto;}
  .lh-v2 .sf-cols .sf-col:nth-child(5){grid-column: 1 / -1;}
  .lh-v2 .sf-langs{grid-template-columns: repeat(auto-fill, minmax(150px, max-content)); column-gap: 32px;}
}
@media (min-width: 960px){
  .lh-v2 .sf-panels__grid{gap: 20px;}
  .lh-v2 .sf-cols{grid-template-columns: 1fr 1fr 1.15fr 1.2fr 1.1fr; gap: 40px;}
  .lh-v2 .sf-cols .sf-col:nth-child(5){grid-column: auto;}
  .lh-v2 .sf-langs{grid-template-columns: 1fr;}
}
@media (min-width: 1240px){ .lh-v2 .sf-langs{grid-template-columns: max-content minmax(max-content, 1fr);} }
@media (max-width: 599px){ .lh-v2 .sf-panel{padding: 22px;} }

/* ── Skip link, focus, leaving bar ───────────────────────────────────── */
.lh-v2 .v2-skip{position: absolute; left: 12px; top: -60px; z-index: 950; background: var(--v2-navy); color: #FFFFFF !important; padding: 10px 16px; border-radius: 10px; font-weight: 700; text-decoration: none;}
.lh-v2 .v2-skip:focus{top: 12px;}
.lh-v2 :is(.site-head, .sh-drawer, .sh-sticky, .site-foot2) :is(a, button, select, input, summary):focus-visible, .lh-v2 .v2-skip:focus-visible{outline: 3px solid var(--v2-accent); outline-offset: 2px;}
body.v2-leaving::before{content: ""; position: fixed; top: 0; left: 0; z-index: 100000; height: 3px; width: 100%; background: linear-gradient(90deg, #E6007E, #1C94D2); transform-origin: left; animation: v2-leave 2.4s cubic-bezier(.1,.7,.3,1) forwards; pointer-events: none;}
@keyframes v2-leave{from { transform: scaleX(0); } to { transform: scaleX(.85); }}
@media (prefers-reduced-motion: reduce){ body.v2-leaving::before{animation: none; transform: scaleX(.6);} }

/* ── Theme resets that leak into the frame ───────────────────────────── */
.lh-v2 :is(.site-head, .sh-drawer, .sh-sticky, .site-foot2) a:not(.btn-enquire, .sf-panel__btn){border-bottom: 0; box-shadow: none;}
.lh-v2 :is(.site-head, .sh-drawer, .site-foot2) :is(input, select, button){box-sizing: border-box; font-family: var(--v2-font); text-transform: none; letter-spacing: normal; box-shadow: none; line-height: normal;}
.lh-v2 :is(.site-head, .sh-drawer, .site-foot2) ul, .lh-v2 :is(.site-head, .sh-drawer, .site-foot2) li{margin: 0; padding: 0; list-style: none;}
.lh-v2 :is(.site-head, .sh-drawer, .site-foot2) li::before{content: none;}
.lh-v2 :is(.site-head, .sh-drawer, .sh-sticky) nav a{text-transform: none; letter-spacing: normal;}
.lh-v2 .site-foot2 p{margin: 0;}
.lh-v2 .sh-drawer details{margin: 0; padding: 0; border: 0; background: transparent;}
.lh-v2 .sh-drawer__lang select{-webkit-appearance: menulist; appearance: menulist;}
.lh-v2 .lh-skip-link{display: none;} /* v1 skip link is not printed in v2; belt and braces */

/* RTL (no Arabic on LH today; kept so the frame matches UKSE/UKSR if a language is added) */
html[dir="rtl"] .lh-v2 .sh-drawer__panel{right: auto; left: 0;}
html[dir="rtl"] .lh-v2 .sh-dd__menu--right{right: auto; left: 0;}
html[dir="rtl"] .lh-v2 .sh-dd__menu{left: auto; right: -12px;}
html[dir="rtl"] .lh-v2 .site-foot2 h2{text-align: right !important;}

/* ── Header over the hero (see-through, as on UKSE) ───────────────────
   Every LH hero opens with a navy band (--lh-primary-dark) or the home video on navy, so the
   see-through header with the white logo works (Steve, 16 Oct). The header is absolute over the
   hero; the hero gets a transparent top border the height of the header with
   background-origin: border-box, so its colour runs up behind the bar and its content is not
   covered. LH hero media is in the page flow (not absolutely positioned), so no overlay fix is
   needed. Pages without a hero band (about, pillar, location guides, how-it-works, hosts
   stepper, why-work-with-us, default template) keep the normal white bar in the page flow. */
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head{
  position: absolute; top: 0; left: 0; right: 0; z-index: 50;
  color: #FFFFFF; background: linear-gradient(180deg, rgba(0,0,50,.38), rgba(0,0,50,0)); border-bottom: 0;
}
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head :is(.sh-nav a, .sh-dd__btn, .sh-icon, .sh-burger){color: #FFFFFF !important;}
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head .sh-nav a:hover{color: var(--v2-blue) !important;}
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head :is(.sh-icon, .sh-lang):hover{background: rgba(255,255,255,.12);}
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head .sh-burger{border-color: rgba(255,255,255,.45);}
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head .sh-logo__colour{display: none;}
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head .sh-logo__white{display: block;}
body.lh-v2.admin-bar:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head{top: 46px;}
@media (min-width: 783px){ body.lh-v2.admin-bar:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head{top: 32px;} }
/* Slight dark glow on the white nav text over the hero (Steve, 16 Oct) */
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head :is(.sh-nav a, .sh-dd__btn){text-shadow: 0 1px 3px rgba(0,0,50,.8), 0 0 12px rgba(0,0,50,.6);}
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head .sh-nav a:hover{text-shadow: none;} /* no glow on hover (Steve, 16 Oct) */
body.lh-v2:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner)) .site-head :is(.sh-icon, .sh-burger) svg{filter: drop-shadow(0 1px 2px rgba(0,0,50,.8));}
body.lh-v2 :is(.lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner){border-top: var(--v2-head-h) solid transparent; background-origin: border-box;}
/* Blog post hero: its full-cover overlay starts at the padding box, so stretch it up behind the header */
body.lh-v2 .blog-single__hero-overlay{top: calc(-1 * var(--v2-head-h));}
/* Home hero: on desktop the video runs up behind the see-through header (no band). The text
   overlay inside the video box gets the header height added to its top padding. On tablets and
   phones (≤900px) the hero is a navy text block above the video, so the band trick applies there. */
@media (min-width: 901px){
  body.lh-v2 .lh-hero__content{padding-top: calc(clamp(48px, 8vh, 100px) + var(--v2-head-h));}
}
@media (max-width: 900px){
  body.lh-v2 .lh-hero{border-top: var(--v2-head-h) solid transparent; background: var(--lh-primary-dark, #000032); background-origin: border-box;}
}
/* No hero on the page: the light bar applies whatever class PHP guessed */
body.lh-v2:not(:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner))) .site-head{position: relative; color: var(--v2-navy); background: #FFFFFF; border-bottom: 1px solid rgba(0,0,50,.06);}
body.lh-v2:not(:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner))) .site-head :is(.sh-nav a, .sh-dd__btn, .sh-icon, .sh-burger){color: var(--v2-navy) !important;}
body.lh-v2:not(:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner))) .site-head .sh-nav a:hover{color: var(--v2-accent-text) !important;}
body.lh-v2:not(:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner))) .site-head :is(.sh-icon, .sh-lang):hover{background: var(--v2-soft);}
body.lh-v2:not(:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner))) .site-head .sh-burger{border-color: #D5D8E3;}
body.lh-v2:not(:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner))) .site-head .sh-logo__colour{display: block;}
body.lh-v2:not(:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner))) .site-head .sh-logo__white{display: none;}
body.lh-v2:not(:has(:is(.lh-hero, .lh-page-hero, .lh-journey-hero, .lh-blog-hero, .lh-groups-landing__hero, .cogc-hero, .blog-single__hero-banner))) .site-head .sh-lang .sh-flag{box-shadow: 0 0 0 1px rgba(0,0,50,.12);}

/* The old header's body offsets must not apply in v2 */
body.lh-v2, body.lh-v2.header-sticky{padding-top: 0 !important;} /* the old fixed header's body offset (64px on phones) */
