/* =====================================================================
   LITSLINK Mega Menu — static prototype (INMT-1108)
   BEM. Values taken 1:1 from the Figma mockup (node 6653:21555).
   Tokens: bg #02061E · intro #090E2B · card #110E2E · accent #3CB7FF.
   ===================================================================== */

/* ------------------------------- Tokens ------------------------------ */
:root {
	--ll-bg:            #02061E;   /* header + links panel base            */
	--ll-bg-intro:      #090E2B;   /* left intro panel                     */
	--ll-bg-card:       #110E2E;   /* featured card                        */
	--ll-accent:        #3CB7FF;   /* brand blue                           */
	--ll-accent-2:      #2AA7F5;   /* CTA gradient stop                    */
	--ll-white:         #FFFFFF;

	--ll-text:          #FFFFFF;
	--ll-text-muted:    rgba(255, 255, 255, .70);
	--ll-text-faint:    rgba(255, 255, 255, .60);
	--ll-label:         rgba(255, 255, 255, .45);
	--ll-border:        rgba(255, 255, 255, .12);
	--ll-card-border:   rgba(255, 255, 255, .10);
	--ll-badge-bg:      rgba(47, 144, 211, .20);

	--ll-header-h:      100px;   /* 60px at ≤960px, like the legacy header */
	--ll-top:           0px;     /* WP admin bar offset for logged-in users */
	--ll-container:     1440px;
	--ll-gutter:        70px;

	--ll-font: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;

	--ll-ease: cubic-bezier(.22, .61, .36, 1);
}

/* --------------------------- Reset / base ---------------------------- */
/* Scoped resets — keep the box model predictable inside the header only. */
.ll-header *, .ll-header *::before, .ll-header *::after,
.ll-mega *, .ll-mega *::before, .ll-mega *::after { box-sizing: border-box; }

.ll-header [hidden], .ll-mega[hidden] { display: none !important; }

/* "→" is not in the self-hosted Montserrat latin subset (U+2192 missing), so the glyph
   fell back to a system font and rendered bigger than the mockup. Draw Montserrat's thin
   arrow as a currentColor mask instead; the text stays in the DOM for screen readers. */
.ll-arrow {
	display: inline-block;
	width: .6em;
	height: 1em;
	overflow: hidden;
	text-indent: 2em;
	white-space: nowrap;
	vertical-align: -.12em;
	background-color: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8'%3E%3Cpath d='M.5 4h8.3M6 1.2 8.8 4 6 6.8' fill='none' stroke='%23000' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% auto no-repeat;
	        mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 8'%3E%3Cpath d='M.5 4h8.3M6 1.2 8.8 4 6 6.8' fill='none' stroke='%23000' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% auto no-repeat;
}

/* ============================== HEADER =============================== */
.ll-header {
	/* Overlays the page, like the legacy header did (position:absolute; top:0): every
	   template starts its content at the very top and already leaves room for a 100px
	   (60px on ≤960px) bar. In-flow positioning would push every page down by that. */
	position: fixed;
	top: var(--ll-top);
	left: 0;
	right: 0;
	z-index: 100;
	height: var(--ll-header-h);
	background: var(--ll-bg);
	/* own type + colour: never inherit the page's (e.g. /ai-map sets IBM Plex + black text) */
	font-family: var(--ll-font);
	color: var(--ll-text);
}

.admin-bar { --ll-top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 960px) { :root { --ll-header-h: 60px; } }

.ll-header__inner {
	max-width: var(--ll-container);
	height: var(--ll-header-h);
	margin: 0 auto;
	padding: 0 clamp(24px, 4vw, 70px);
	display: flex;
	align-items: center;
	gap: 20px;
}

/* Logo */
.ll-header__logo {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	height: 36px;
}
.ll-header__logo img { height: 36px; width: auto; display: block; }

/* ------------------------------ Nav --------------------------------- */
.ll-nav {
	flex: 1 1 auto;
	height: 100%;
	display: flex;
	align-items: center;
}
.ll-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	gap: clamp(8px, 1vw, 18px);
}
.ll-nav__item { display: flex; }

.ll-nav__link {
	position: relative;
	height: 100%;
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 0;
	border: 0;
	background: none;
	font-family: inherit;
	font-size: 15px;
	font-weight: 500;
	line-height: 1;
	color: var(--ll-text);
	cursor: pointer;
	white-space: nowrap;
	transition: color .18s var(--ll-ease);
}
.ll-nav__chevron {
	flex: 0 0 auto;
	transition: transform .22s var(--ll-ease), color .18s var(--ll-ease);
}
/* animated 2px underline pinned to the header bottom edge */
.ll-nav__link::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	height: 2px;
	background: var(--ll-accent);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform .22s var(--ll-ease);
}
.ll-nav__link:hover,
.ll-nav__item.is-open .ll-nav__link { color: var(--ll-accent); }
.ll-nav__link:hover::after,
.ll-nav__item.is-open .ll-nav__link::after { transform: scaleX(1); }
.ll-nav__item.is-open .ll-nav__chevron { transform: rotate(180deg); }
.ll-nav__link:focus-visible { outline: 2px solid var(--ll-accent); outline-offset: 4px; border-radius: 4px; }

/* ---------------------------- Actions ------------------------------- */
.ll-header__actions {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 16px;
}
.ll-header__search {
	width: 40px;
	height: 40px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--ll-accent);
	border-radius: 50%;
	background: none;
	color: var(--ll-white);
	cursor: pointer;
	transition: border-color .18s var(--ll-ease), color .18s var(--ll-ease);
}
.ll-header__search:hover { border-color: var(--ll-accent); color: var(--ll-accent); }
.ll-header__cta {
	display: inline-flex;
	align-items: center;
	height: 40px;
	padding: 0 22px;
	border-radius: 100px;
	background: var(--ll-accent);
	color: var(--ll-white);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
	transition: filter .18s var(--ll-ease), transform .18s var(--ll-ease);
}
/* the theme's global `a:hover { color: #1690d3 }` (0,1,1) would turn the label blue on blue */
.ll-header .ll-header__cta:hover,
.ll-header .ll-header__cta:focus,
.ll-header .ll-header__cta:visited { color: var(--ll-white); text-decoration: none; }
.ll-header__cta:hover { filter: brightness(1.08); }

/* ≥1440 = the Figma frame width: 1299px row (70px gutters), justify-between,
   16px nav with 20px item gap / 2px chevron gap, 132×40 CTA at 16px. Narrower
   desktops keep the fluid compression above so all 8 items still fit ≥1301px. */
@media (min-width: 1440px) {
	.ll-header__inner { padding: 0 70px; gap: 0; justify-content: space-between; }
	.ll-nav { flex: 0 0 auto; }
	.ll-nav__list { width: auto; justify-content: flex-start; gap: 20px; }
	.ll-nav__link { font-size: 16px; gap: 2px; }
	.ll-header__cta { font-size: 16px; padding: 0 20px; min-width: 132px; justify-content: center; }
}

/* ----------------------------- Search ------------------------------ */
/* Full-width panel under the bar, same surface as the mega panels. */
.ll-header__search[aria-expanded="true"] { background: rgba(60, 183, 255, .14); color: var(--ll-accent); }

.ll-search {
	/* compact card under the search button, right-aligned with the header row */
	position: absolute;
	top: calc(100% + 10px);
	right: clamp(24px, 4vw, 70px);
	z-index: 95;
	width: min(520px, calc(100vw - 48px));
	background: var(--ll-bg-intro);
	border: 1px solid var(--ll-border);
	border-radius: 16px;
	box-shadow: 0 20px 44px rgba(0, 0, 0, .45);
	animation: ll-search-in .18s var(--ll-ease);
}
@media (min-width: 1440px) {
	.ll-search { right: calc((100% - var(--ll-container)) / 2 + 70px); }
}
@keyframes ll-search-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.ll-search__inner {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 12px;
}
.ll-search__form {
	position: relative;
	display: flex;
	align-items: center;
	height: 48px;
	padding: 0 5px 0 16px;
	background: var(--ll-bg-intro);
	border: 1px solid var(--ll-border);
	border-radius: 100px;
	transition: border-color .18s var(--ll-ease), box-shadow .18s var(--ll-ease);
}
.ll-search__form:focus-within { border-color: var(--ll-accent); box-shadow: 0 0 0 4px rgba(60, 183, 255, .14); }
.ll-search__form.is-empty { animation: ll-search-nudge .32s var(--ll-ease); }
@keyframes ll-search-nudge { 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }
.ll-header .ll-search__label {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.ll-search__icon { flex: 0 0 auto; color: var(--ll-text-faint); }
.ll-search__form:focus-within .ll-search__icon { color: var(--ll-accent); }
.ll-search__input {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	margin: 0;
	padding: 0 14px;
	border: 0;
	outline: 0;
	background: transparent;
	box-shadow: none;
	color: var(--ll-white);
	font-family: var(--ll-font);
	font-size: 15px;
	font-weight: 500;
	line-height: normal;
	letter-spacing: normal; /* theme gives inputs 1px tracking */
	-webkit-appearance: none;
	appearance: none;
}
.ll-search__input::placeholder { color: rgba(255, 255, 255, .45); font-weight: 400; }
.ll-search__input::-webkit-search-decoration,
.ll-search__input::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.ll-search__submit {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 38px;
	padding: 0 18px;
	border: 0;
	border-radius: 100px;
	background: var(--ll-accent);
	color: var(--ll-white);
	font-family: var(--ll-font);
	font-size: 14px;
	font-weight: 600;
	line-height: 17px;
	letter-spacing: normal;
	cursor: pointer;
	transition: filter .18s var(--ll-ease);
}
.ll-search__submit:hover { filter: brightness(1.08); }
.ll-search__submit:focus-visible { outline: 2px solid var(--ll-white); outline-offset: 2px; }
.ll-header .ll-search__hint {
	margin: 0;
	padding-left: 16px;
	font-size: 11.5px;
	line-height: normal;
	color: var(--ll-label);
}
.ll-search__hint kbd {
	display: inline-block;
	margin-right: 4px;
	padding: 2px 7px;
	border: 1px solid var(--ll-border);
	border-radius: 6px;
	background: var(--ll-bg-intro);
	color: var(--ll-text-muted);
	font-family: var(--ll-font);
	font-size: 11px;
	font-weight: 600;
	box-shadow: none;
}
.ll-search__hint-sep { margin: 0 10px; }

/* Burger (mobile only) */
.ll-header__burger {
	display: none;
	width: 44px;
	height: 44px;
	margin-left: auto;
	border: 0;
	background: none;
	cursor: pointer;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	padding: 10px;
}
.ll-header__burger span {
	display: block;
	height: 2px;
	width: 100%;
	background: var(--ll-white);
	border-radius: 2px;
	transition: transform .22s var(--ll-ease), opacity .18s var(--ll-ease);
}

/* ============================ MEGA PANEL ============================= */
.ll-mega-wrap {
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
}
.ll-mega {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	background: var(--ll-bg);
	border-top: 1px solid var(--ll-border);
	box-shadow: 0 24px 48px rgba(0, 0, 0, .45);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(-8px);
	transition: opacity .2s var(--ll-ease), transform .2s var(--ll-ease), visibility .2s var(--ll-ease);
}
.ll-mega.is-open { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }

/* Page-level element rules (`.some-template p { margin-bottom: 24px; color: inherit }`)
   outrank single-class rules; keep the header's p/ul/li spacing ours. */
.ll-header p, .ll-header ul, .ll-header li { margin-top: 0; margin-bottom: 0; }
/* lean templates ship no normalize: form controls would fall back to the UA font */
.ll-header :where(button, input) { font-family: inherit; }

/* Figma uses line-height: normal throughout; the theme's global p/li/body rules
   (24–27px) would otherwise inflate every row. Explicit per-element values below win. */
.ll-mega :where(p, li, a, span) { line-height: normal; }

/* Drawer-only chrome — hidden on desktop, revealed in the mobile media query */
.ll-drawer-nav__btn,
.ll-drawer__search,
.ll-drawer__actions { display: none; }

.ll-mega__inner {
	max-width: var(--ll-container);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 360px minmax(0, 1fr) 410px;
	align-items: stretch;
}

/* ----------------------------- Intro -------------------------------- */
.ll-intro {
	background: var(--ll-bg-intro);
	padding: 36px 40px 36px var(--ll-gutter);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 16px;
}
.ll-header .ll-intro__title {
	margin: 0;
	font-size: 24px;
	font-weight: 700;
	line-height: 1.2;
	color: var(--ll-white);
}
.ll-intro__dot { color: var(--ll-accent); }
.ll-header .ll-intro__desc {
	margin: 0;
	max-width: 250px;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;
	color: var(--ll-text-muted);
}
.ll-intro__viewall {
	font-size: 14px;
	line-height: 17px;
	font-weight: 600;
	color: var(--ll-accent);
	text-decoration: none;
}
.ll-header .ll-intro__viewall:hover { color: var(--ll-accent); text-decoration: underline; }
.ll-intro__spacer { flex: 1 1 auto; min-height: 24px; }
.ll-intro__cta {
	width: 100%;
	padding-top: 20px;
	border-top: 1px solid var(--ll-border);
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.ll-header .ll-intro__cta-label { margin: 0; font-size: 13px; font-weight: 400; color: var(--ll-text-faint); }
.ll-intro__cta-link { font-size: 14px; line-height: 17px; font-weight: 600; color: var(--ll-white); text-decoration: none; }
.ll-intro__cta-link:hover { color: var(--ll-accent); }

/* ----------------------------- Links -------------------------------- */
.ll-mega__links { padding: 36px 40px 36px 48px; }
.ll-mega__columns { display: flex; gap: 32px; }
.ll-mega__columns--3 { gap: 32px; }
.ll-col { flex: 0 1 275px; min-width: 0; display: flex; flex-direction: column; gap: 28px; }
.ll-col--wide { flex-basis: 275px; }
.ll-mega__columns--3 .ll-col { flex: 0 1 172px; }
.ll-mega__columns--3 .ll-group,
.ll-mega__columns--3 .ll-group__list { gap: 12px; } /* Technologies: 30px row pitch */

.ll-group { display: flex; flex-direction: column; gap: 14px; }
.ll-header .ll-group__label {
	margin: 0;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .88px;
	line-height: 13px;
	text-transform: uppercase;
	color: var(--ll-label);
}
.ll-header .ll-group__label--empty { visibility: hidden; }
.ll-group__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 14px; }
/* flex li = no inline strut, so a row is exactly the link's own height */
.ll-group__list > li,
.ll-tree__list > li { display: flex; flex-direction: column; align-items: flex-start; }
.ll-group__list--rich { gap: 20px; }
.ll-header .ll-group__label + .ll-group__list--rich { margin-top: 6px; } /* rich groups: 20px label gap */

.ll-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 15px;
	font-weight: 500;
	line-height: 18px; /* Figma text box; pins the → glyph's fallback font too */
	color: var(--ll-white);
	text-decoration: none;
	transition: color .16s var(--ll-ease);
}
.ll-link .ll-arrow { color: var(--ll-accent); opacity: 0; transform: translateX(-4px); transition: opacity .16s var(--ll-ease), transform .16s var(--ll-ease); }
.ll-link:hover { color: var(--ll-accent); }
.ll-link:hover .ll-arrow { opacity: 1; transform: translateX(0); }
.ll-link--active { color: var(--ll-accent); }
.ll-link--active .ll-arrow { opacity: 1; transform: translateX(0); }

/* rich link (title + subtitle) */
.ll-link--rich { flex-direction: column; align-items: flex-start; gap: 4px; }
.ll-link__title { font-size: 15px; font-weight: 500; color: var(--ll-white); transition: color .16s var(--ll-ease); }
.ll-link__sub   { font-size: 13px; line-height: 16px; font-weight: 400; color: rgba(255, 255, 255, .55); }
.ll-link--rich:hover .ll-link__title { color: var(--ll-accent); }

/* 2-level tree (Industries) */
.ll-group__list--tree { gap: 14px; }
.ll-header .ll-tree__parent { margin: 0 0 10px; font-size: 15px; line-height: 18px; font-weight: 500; color: var(--ll-white); }
.ll-header a.ll-tree__parent { display: block; text-decoration: none; transition: color .16s var(--ll-ease); }
.ll-header a.ll-tree__parent:hover, .ll-header a.ll-tree__parent.ll-link--active { color: var(--ll-accent); }
.ll-tree__list { list-style: none; margin: 0; padding: 0 0 0 0; display: flex; flex-direction: column; gap: 8px; border-left: 1px solid rgba(255, 255, 255, .15); }
.ll-tree__list > li { padding-left: 12px; }
.ll-link--sub { font-size: 14px; line-height: 17px; font-weight: 400; color: var(--ll-text-muted); }
.ll-link--sub.ll-link--active { color: var(--ll-accent); font-weight: 500; }

/* stats list (Company · In numbers) */
.ll-statlist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.ll-statlist__item { display: flex; flex-direction: column; gap: 2px; }
.ll-statlist__num { font-size: 22px; font-weight: 700; color: var(--ll-white); }
.ll-statlist__label { font-size: 13px; font-weight: 400; color: var(--ll-text-faint); }

/* --------------------------- Featured ------------------------------- */
.ll-mega__featured { padding: 36px 0; display: flex; }
.ll-featured {
	width: 340px;
	align-self: flex-start;
	display: flex;
	flex-direction: column;
	background: var(--ll-bg-card);
	border: 1px solid var(--ll-card-border);
	border-radius: 16px;
	overflow: hidden;
	color: var(--ll-white);
	text-decoration: none;
	transition: border-color .18s var(--ll-ease), transform .18s var(--ll-ease);
}
.ll-featured:hover { border-color: rgba(60, 183, 255, .4); transform: translateY(-2px); }
.ll-header .ll-featured:hover, .ll-header .ll-featured:focus { color: var(--ll-white); text-decoration: none; }
.ll-featured__media { display: block; height: 170px; }
.ll-featured__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ll-featured__body { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 16px 16px 18px; }
.ll-featured__tag {
	display: inline-block;
	padding: 4px 10px;
	border-radius: 100px;
	background: var(--ll-badge-bg);
	color: var(--ll-accent);
	font-size: 10px;
	font-weight: 700;
	line-height: 12px;
	text-transform: uppercase;
}
.ll-featured__title { font-size: 16px; font-weight: 600; line-height: 22px; color: var(--ll-white); }
.ll-featured__link { font-size: 14px; line-height: 17px; font-weight: 600; color: var(--ll-accent); }

/* ---------------------------- Overlay ------------------------------- */
.ll-overlay {
	position: fixed;
	inset: calc(var(--ll-top) + var(--ll-header-h)) 0 0 0;
	z-index: 90;
	background: rgba(2, 6, 30, .55);
	backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity .2s var(--ll-ease);
}
.ll-overlay.is-visible { opacity: 1; }

/* ======================= RESPONSIVE / MOBILE ======================== */
@media (max-width: 1300px) {
	/* switch to mobile drawer — the full 8-item nav needs ~1300px to fit cleanly */
	.ll-nav, .ll-header__actions { display: none; }
	.ll-header__burger { display: flex; }

	.ll-mega-wrap {
		position: fixed;
		top: calc(var(--ll-top) + var(--ll-header-h));
		left: 0;
		right: 0;
		bottom: 0;
		overflow-y: auto;
		background: var(--ll-bg);
		transform: translateX(100%);
		transition: transform .28s var(--ll-ease);
		-webkit-overflow-scrolling: touch;
	}
	body.ll-nav-open .ll-mega-wrap { transform: translateX(0); }
	body.ll-nav-open { overflow: hidden; }

	/* burger -> X */
	body.ll-nav-open .ll-header__burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	body.ll-nav-open .ll-header__burger span:nth-child(2) { opacity: 0; }
	body.ll-nav-open .ll-header__burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

	/* panels become stacked accordion bodies */
	.ll-mega {
		position: static;
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: none;
		box-shadow: none;
		border-top: 0;
		border-bottom: 1px solid var(--ll-border);
	}
	.ll-mega:not(.is-open) { display: none; }
	.ll-drawer-nav__btn { display: flex; }
	.ll-drawer__actions { display: flex; }
	.ll-mega__inner { grid-template-columns: 1fr; }
	/* mobile drawer = just the link groups: no intro panel, no featured card */
	.ll-mega__intro,
	.ll-mega__featured { display: none; }
	.ll-mega__links { padding: 14px 24px 26px; }
	.ll-mega__columns, .ll-mega__columns--3 { flex-direction: column; gap: 28px; }
	.ll-col, .ll-col--wide { flex-basis: auto; width: 100%; }

	/* mobile accordion header list, injected by JS */
	.ll-drawer-nav { list-style: none; margin: 0; padding: 8px 0; }
	.ll-drawer-nav__btn {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 18px 24px;
		border: 0;
		border-bottom: 1px solid var(--ll-border);
		background: none;
		color: var(--ll-white);
		font-family: inherit;
		font-size: 18px;
		font-weight: 600;
		cursor: pointer;
	}
	.ll-drawer-nav__btn .ll-nav__chevron { transition: transform .22s var(--ll-ease); }
	.ll-drawer-nav__btn[aria-expanded="true"] { color: var(--ll-accent); }
	.ll-drawer-nav__btn[aria-expanded="true"] .ll-nav__chevron { transform: rotate(180deg); }
	.ll-drawer__actions { display: flex; flex-direction: column; gap: 14px; padding: 24px; }
	/* search lives at the top of the drawer (the bar's search button is hidden here) */
	.ll-search { display: none; }
	.ll-drawer__search { display: block; padding: 20px 24px 8px; }
	.ll-drawer__search .ll-search__form { height: 52px; padding-left: 18px; }
	.ll-drawer__search .ll-search__input { font-size: 16px; } /* ≥16px: no iOS zoom-on-focus */
	.ll-drawer__search .ll-search__submit { height: 40px; padding: 0 18px; font-size: 14px; }
	.ll-drawer__actions .ll-header__cta { width: 100%; justify-content: center; height: 48px; }
}

@media (max-width: 560px) {
	:root { --ll-gutter: 20px; }
	.ll-header__inner { padding: 0 20px; }
}

@media (prefers-reduced-motion: reduce) {
	.ll-header *, .ll-mega *, .ll-mega-wrap, .ll-overlay { transition: none !important; }
}