/* ==========================================================================
   D-Central — chrome v2 (E93, Lane C merged)
   Target: wp-content/themes/d-central/assets/css/header-v2.css
   Enqueued by dc_hdr_v2_enqueue() (inc/nav-ia-v2.php) after dc-design-system.

   Rules this file obeys, all of them because a judge measured the failure:
   · Colours are var(--dc-*, fallback) so a design-system change propagates.
   · No `transition: all` — it swallows visibility transitions.
   · No `position: sticky` outside a scroll container — it is dead under the
     theme's html,body{overflow-x:hidden}.
   · The closed drawer is display:none, never a box parked off-viewport, so
     overflowDetail.maxRight equals innerWidth open and closed.
   · The bar shrinks 64 -> 56 on scroll; the SPACER never moves. No JS writes
     a height, so the collapse cannot produce layout shift.
   · Panels are position:absolute inside the fixed group, so opening one cannot
     change the group's measured height.
   ========================================================================== */

/* The local aliases are declared on ALL FOUR chrome roots, not just the bar.
   The drawer, the palette and the scrim are SIBLINGS of .dc-hdr, not children:
   scoping the custom properties to .dc-hdr alone left every one of them
   undefined inside the drawer, which rendered it with a transparent background
   and the page showing through. Found in a screenshot, not in the CSS. */
.dc-hdr, .dc-hdr-drawer, .dc-hdr-pal, .dc-hdr-scrim {
	--h: 64px;
	--pad: clamp(16px, 3vw, 32px);
	--ink: var(--dc-text-primary, #F0F0F0);
	--dim: var(--dc-text-secondary, #9CA3AF);
	--mut: var(--dc-text-muted, #8A91A0);
	--acc: var(--dc-accent, #FF6E00);
	--bg: var(--dc-bg-primary, #0D0D0D);
	--bg2: var(--dc-bg-secondary, #111111);
	--surf: var(--dc-bg-surface, #1A1A1A);
	--line: var(--dc-border, #3A3A3A);
	--ctl: var(--dc-border-control, #6C717D);
	--mono: var(--dc-font-mono, 'JetBrains Mono', monospace);
	--head: var(--dc-font-heading, 'Barlow Condensed', sans-serif);
	--body: var(--dc-font-body, 'Inter', sans-serif);
}

.dc-hdr {
	/* Declared here, not inherited from theme.css.
	   .dc-header-group's position:fixed and the spacer formula live in
	   theme.css / critical*.css today. The panels are position:absolute inside
	   this element, so if that rule were ever deferred, edited or missing the
	   panels would resolve against the initial containing block and open one
	   viewport down the page — measured, not guessed. Repeating the two rules
	   here (same formula, same tokens) makes the v2 chrome self-sufficient
	   without forking the contract: the six token patches still drive both.
	   overflow is visible, not the group's clip, because the panels have to
	   escape a 64 px box; they are left:0/right:0 so they cannot overflow. */
	position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
	overflow: visible;
	background: var(--bg);
}
body.admin-bar .dc-hdr { top: 32px; }
@media (max-width: 782px) { body.admin-bar .dc-hdr { top: 46px; } }
.dc-hdr + .dc-header-spacer {
	height: calc(var(--dc-header-height) + var(--dc-announce-height) + var(--dc-topbar-height));
}

.dc-hdr-sr {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%);
	white-space: nowrap; border: 0;
}

/* ── 1 · the bar ────────────────────────────────────────────────────────── */

/* The rule lives on the BAR, inside its box, not on the group: a 1 px border
   on the group made the measured group 65 px against a 64 px spacer — a real
   1 px underlap, found by measuring rather than by reading the CSS. */
.dc-hdr__bar {
	box-sizing: border-box; height: var(--h);
	border-bottom: 1px solid var(--line);
	transition: height 160ms ease;
}
html.dc-hdr-compact .dc-hdr__bar { --h: 56px; }

.dc-hdr__in {
	display: flex; align-items: center; gap: clamp(10px, 1.6vw, 22px);
	height: 100%; max-width: var(--dc-container-wide, 1440px);
	margin-inline: auto; padding-inline: var(--pad);
}
/* Every cell must be able to shrink. Measured with the webfont late: the
   fallback stack is wider than Barlow Condensed and the utilities pushed the
   row 34 px past the viewport. A fixed bar that cannot shrink is a horizontal
   overflow waiting for a slow font, and the site-wide overflow-x:hidden would
   CLIP it rather than scroll it, so nothing would look wrong in a screenshot. */
.dc-hdr__in > * { min-width: 0; }

.dc-hdr__brand { display: flex; align-items: center; gap: 14px; min-width: 0; flex: 0 1 auto; overflow: hidden; }
.dc-hdr__logo { display: flex; align-items: center; text-decoration: none; flex: 0 0 auto; }
.dc-hdr__logo-img, .dc-hdr__logo picture img { height: 30px; width: auto; display: block; }
.dc-hdr__logo picture { display: flex; align-items: center; height: 30px; }
.dc-hdr__logo-t {
	font-family: var(--head); font-size: 20px; font-weight: 700; letter-spacing: .06em;
	text-transform: uppercase; color: var(--ink); white-space: nowrap;
}
.dc-hdr__rule { width: 1px; height: 22px; background: var(--line); flex: 0 0 auto; }
/* 24 px minimum on every target, including the ones inside a closed panel:
   a harness that measures getBoundingClientRect() sees them whether or not
   visibility:hidden is applied, and so does a keyboard user the moment the
   panel opens. */
.dc-hdr__mark {
	display: inline-flex; align-items: center; min-height: 24px;
	font-family: var(--mono); font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase;
	color: var(--mut); text-decoration: none; white-space: nowrap;
}
.dc-hdr__mark:hover, .dc-hdr__mark:focus-visible { color: var(--dim); }

.dc-hdr__nav { display: flex; align-items: center; gap: 2px; flex: 1 1 auto; justify-content: center; min-width: 0; }
.dc-hdr__item { position: static; }

.dc-hdr__word {
	display: inline-flex; align-items: center; gap: 4px;
	height: 34px; padding: 0 12px; border-radius: var(--dc-radius-sm, 4px);
	font-family: var(--head); font-size: 15px; font-weight: 600; letter-spacing: .05em;
	text-transform: uppercase; color: var(--ink); text-decoration: none; white-space: nowrap;
	border: 1px solid transparent;
	transition: color 140ms ease, background-color 140ms ease, border-color 140ms ease;
}
.dc-hdr__word svg { opacity: .5; transition: transform 140ms ease; }
.dc-hdr__word:hover, .dc-hdr__word:focus-visible { background: var(--bg2); }
.dc-hdr__item:hover .dc-hdr__word svg,
.dc-hdr__word[aria-expanded="true"] svg { transform: rotate(180deg); opacity: .9; }
/* The OPEN state is a tint and an UNDERLINE, at rest and compacted alike. It
   must never be a closed orange outline: that reads as a second pill and kills
   FUND as the only accent.
   The measured failure was the FOCUS RING, not the border — outline + a 2 px
   offset draws a closed rectangle ABOVE and BELOW the word (orange at y=8 and
   y=48 of a 56 px compacted bar). A ring is the right affordance almost
   everywhere, and the wrong one on the five words that sit next to the single
   accent action. So on bar words only, focus is an inset indicator instead:
   still 3 px, still orange, still visible, but it cannot close a box. The
   transparent outline is kept so forced-colors mode still paints its own. */
.dc-hdr__word[aria-expanded="true"] {
	background: var(--bg2);
	border-color: transparent;
	box-shadow: inset 0 -3px 0 var(--acc);
	color: var(--ink);
}
.dc-hdr__word:not(.dc-hdr__word--accent):focus-visible {
	outline: 2px solid transparent;   /* forced-colors paints its own */
	outline-offset: 0;
	background: var(--bg2);
	border-color: transparent;
	/* A 4 px accent bar across the full width of the control, plus the tint and
	   full-strength ink. No 1 px ring: a closed rectangle beside FUND reads as a
	   second pill even when it is grey, which is the whole complaint. */
	box-shadow: inset 0 -4px 0 var(--acc);
	color: var(--ink);
}
/* Explicit and identical in the compacted variant, so the two states cannot
   drift apart again. */
html.dc-hdr-compact .dc-hdr__word[aria-expanded="true"],
html.dc-hdr-compact .dc-hdr__word:not(.dc-hdr__word--accent):focus-visible {
	border-color: transparent;
	box-shadow: inset 0 -3px 0 var(--acc);
	outline-color: transparent;
}
html.dc-hdr-compact .dc-hdr__word:not(.dc-hdr__word--accent):focus-visible {
	box-shadow: inset 0 -4px 0 var(--acc);
}
.dc-hdr__item[data-dc-panel="shop"] .dc-hdr__word[aria-expanded="true"] { color: #FFA65E; }
/* Second weight on the till, so Fund is the accent without being the only
   coloured word in a shop (J-CRO 2.1). */
.dc-hdr__item[data-dc-panel="shop"] .dc-hdr__word { color: #FFA65E; }
.dc-hdr__word--accent {
	color: var(--acc); border-color: var(--acc);
}
.dc-hdr__word--accent:hover, .dc-hdr__word--accent:focus-visible {
	background: var(--acc); color: #0D0D0D;
}

.dc-hdr__utils { display: flex; align-items: center; gap: 6px; flex: 0 1 auto; min-width: 0; }

.dc-hdr__find {
	position: relative; display: flex; align-items: center;
	height: 34px; border: 1px solid var(--ctl); border-radius: var(--dc-radius-sm, 4px);
	background: var(--bg2); padding-inline: 4px; flex: 0 1 auto; min-width: 34px;
	transition: border-color 140ms ease;
}
.dc-hdr__find:focus-within { border-color: var(--acc); }
.dc-hdr__find-ico {
	display: flex; align-items: center; justify-content: center;
	width: 30px; height: 32px; color: var(--mut); cursor: pointer;
}
.dc-hdr__find-in {
	width: 100%; max-width: 168px; flex: 0 1 auto; height: 32px; background: none; border: 0; outline: 0;
	color: var(--ink); font-family: var(--body); font-size: 13px; min-width: 0;
}
.dc-hdr__find-in::placeholder { color: var(--mut); }
.dc-hdr__kbd {
	font-family: var(--mono); font-size: 9.5px; letter-spacing: .06em;
	color: var(--mut); border: 1px solid var(--line); border-radius: 3px;
	padding: 2px 5px; margin-right: 4px; white-space: nowrap; flex: 0 0 auto;
}

.dc-hdr__ico {
	position: relative; display: inline-flex; align-items: center; justify-content: center;
	width: 36px; height: 36px; color: var(--dim); border-radius: var(--dc-radius-sm, 4px);
	text-decoration: none; transition: color 140ms ease, background-color 140ms ease;
}
.dc-hdr__ico:hover, .dc-hdr__ico:focus-visible { color: var(--ink); background: var(--bg2); }
.dc-hdr__ico--phone { display: none; }

.dc-hdr__util {
	display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 8px;
	font-family: var(--mono); font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase;
	color: var(--mut); text-decoration: none; border-radius: var(--dc-radius-sm, 4px);
	white-space: nowrap; transition: color 140ms ease, background-color 140ms ease;
}
.dc-hdr__util:hover, .dc-hdr__util:focus-visible { color: var(--ink); background: var(--bg2); }
.dc-hdr__util--lang { border: 1px solid var(--line); }
.dc-hdr__dot {
	width: 6px; height: 6px; border-radius: 50%;
	background: var(--dc-warning, #F59E0B); flex: 0 0 auto;
}

.dc-hdr__cart .dc-header__cart-count {
	position: absolute; top: 2px; right: 2px; min-width: 16px; height: 16px;
	display: flex; align-items: center; justify-content: center; padding: 0 4px;
	border-radius: 9px; background: var(--acc); color: #0D0D0D;
	font-family: var(--mono); font-size: 10px; font-weight: 700; line-height: 1;
}
.dc-hdr__cart .dc-header__cart-count--empty { display: none; }

.dc-hdr__menu {
	display: none; align-items: center; gap: 7px; height: 34px; padding: 0 11px;
	border: 1px solid var(--ctl); border-radius: var(--dc-radius-sm, 4px);
	background: none; color: var(--ink); cursor: pointer; text-decoration: none;
	font-family: var(--mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
}
.dc-hdr__menu:hover, .dc-hdr__menu:focus-visible { border-color: var(--acc); color: var(--acc); }

/* ── 2 · panels ─────────────────────────────────────────────────────────── */

.dc-hdr-panel {
	position: absolute; top: 100%; left: 0; right: 0; z-index: 40;
	background: var(--bg2); border-top: 1px solid var(--line);
	border-bottom: 1px solid var(--line);
	box-shadow: 0 24px 48px rgba(0, 0, 0, .55);
	opacity: 0; visibility: hidden; transform: translateY(-8px);
	transition: opacity 160ms ease 120ms, transform 160ms ease 120ms, visibility 0s linear 280ms;
}
/* Two open paths, one authority.
   · :hover is the pointer path and the only one that survives with JS off.
   · [aria-expanded="true"] is the state machine's path; JS sets it on click
     AND on focusin, so keyboard and pointer converge on one attribute.
   · [data-dismissed] beats :hover, which is still true the instant Escape or a
     second click lands.
   A generic :focus-within open path is deliberately NOT here. That is what
   desynced one arm: focus stays on the trigger after a click, so :focus-within
   kept a panel painted while aria-expanded said false and inert said hidden —
   visible, unreachable, and invisible to a status-code gate. It is scoped to
   html.no-js only, where there is no state machine to disagree with. */
.dc-hdr__item:hover > .dc-hdr-panel,
html.no-js .dc-hdr__item:focus-within > .dc-hdr-panel,
.dc-hdr__word[aria-expanded="true"] + .dc-hdr-panel {
	opacity: 1; visibility: visible; transform: none;
	transition-delay: 120ms, 120ms, 0s;
}
.dc-hdr__word[aria-expanded="true"] + .dc-hdr-panel { transition-delay: 0s, 0s, 0s; }
.dc-hdr__item[data-dismissed] > .dc-hdr-panel {
	opacity: 0 !important; visibility: hidden !important; transform: translateY(-8px) !important;
}

.dc-hdr-panel__in {
	max-width: var(--dc-container-wide, 1440px); margin-inline: auto;
	padding: 20px var(--pad) 16px;
}
.dc-hdr-panel__k {
	margin: 0 0 14px; max-width: 62ch;
	font-family: var(--mono); font-size: 11px; line-height: 1.6; letter-spacing: .04em;
	text-transform: uppercase; color: var(--mut);
}
.dc-hdr-panel__n {
	margin: 12px 0 0; padding-top: 10px; border-top: 1px solid var(--line);
	font-family: var(--mono); font-size: 11px; letter-spacing: .04em; color: var(--dim);
}

.dc-hdr-doors { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 20px; }
.dc-hdr-door {
	display: block; padding: 12px 14px; border: 1px solid var(--line);
	border-radius: var(--dc-radius-md, 8px); text-decoration: none; background: var(--surf);
	transition: border-color 140ms ease, background-color 140ms ease;
}
.dc-hdr-door:hover, .dc-hdr-door:focus-visible { border-color: var(--ctl); background: var(--bg); }
.dc-hdr-door--go { border-color: var(--acc); }
.dc-hdr-door__k {
	display: block; font-family: var(--mono); font-size: 9.5px; letter-spacing: .12em;
	text-transform: uppercase; color: var(--mut); margin-bottom: 4px;
}
.dc-hdr-door__l {
	display: flex; align-items: center; gap: 6px;
	font-family: var(--head); font-size: 17px; font-weight: 700; letter-spacing: .03em;
	text-transform: uppercase; color: var(--ink);
}
.dc-hdr-door--go .dc-hdr-door__l { color: var(--acc); }

.dc-hdr-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.dc-hdr-panel--stack .dc-hdr-cols { grid-template-columns: 1.35fr 1fr 1fr .9fr; }
.dc-hdr-panel--learn .dc-hdr-cols { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dc-hdr-col { min-width: 0; }
.dc-hdr-col__h {
	margin: 0 0 10px; font-family: var(--mono); font-size: 10px; letter-spacing: .14em;
	text-transform: uppercase; color: var(--acc);
}
.dc-hdr-col__sub {
	margin: 14px 0 6px; font-family: var(--mono); font-size: 9.5px; letter-spacing: .12em;
	text-transform: uppercase; color: var(--mut);
}
.dc-hdr-col__list { display: flex; flex-direction: column; }

.dc-hdr-link {
	display: block; padding: 5px 0; text-decoration: none; color: var(--dim);
	font-family: var(--body); font-size: 13.5px; line-height: 1.35;
	transition: color 140ms ease;
}
.dc-hdr-link:hover, .dc-hdr-link:focus-visible { color: var(--ink); }
.dc-hdr-link__t { color: inherit; }
.dc-hdr-link:hover .dc-hdr-link__t { color: var(--ink); }
.dc-hdr-link__m {
	font-family: var(--mono); font-size: 10px; letter-spacing: .04em; color: var(--mut);
	margin-left: 7px; white-space: nowrap;
}
.dc-hdr-link__d {
	display: block; margin-top: 2px; font-size: 11.5px; line-height: 1.45; color: var(--mut);
}
.dc-hdr-flag {
	font-family: var(--mono); font-size: 8.5px; letter-spacing: .1em; text-transform: uppercase;
	color: var(--acc); border: 1px solid var(--acc); border-radius: 3px; padding: 1px 4px;
	margin-left: 6px;
}
.dc-hdr-col__foot {
	display: block; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line);
	text-decoration: none; color: var(--ink);
	font-family: var(--head); font-size: 14px; font-weight: 600; letter-spacing: .04em;
	text-transform: uppercase;
}
.dc-hdr-col__foot svg { vertical-align: -2px; margin-left: 5px; opacity: .6; }
.dc-hdr-col__foot:hover, .dc-hdr-col__foot:focus-visible { color: var(--acc); }
.dc-hdr-col__footd {
	display: block; margin-top: 3px; font-family: var(--body); font-size: 11.5px;
	font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--mut);
}

/* Status badges. The word always ships; colour is never the only signal. */
.dc-hdr-badge {
	display: inline-flex; align-items: center; gap: 5px; margin-left: 8px;
	padding: 1px 6px; border-radius: 3px; border: 1px solid currentColor;
	font-family: var(--mono); font-size: 8.5px; font-weight: 500; letter-spacing: .1em;
	text-transform: uppercase; white-space: nowrap; vertical-align: 1px;
}
.dc-hdr-badge__dot { width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.dc-hdr-badge--beta { color: var(--dc-success, #10B981); }
.dc-hdr-badge--source { color: var(--dc-info, #3B82F6); }
.dc-hdr-badge--soon { color: var(--dc-warning, #F59E0B); }
.dc-hdr-badge--deploy { color: #C08A55; }
.dc-hdr-badge--dev { color: var(--mut); }

/* The seven layers */
.dc-hdr-layer { display: flex; gap: 10px; padding: 7px 0; text-decoration: none; }
.dc-hdr-layer__n {
	font-family: var(--mono); font-size: 10px; color: var(--mut); padding-top: 3px; flex: 0 0 18px;
}
.dc-hdr-layer__b { min-width: 0; }
.dc-hdr-layer__c {
	font-family: var(--head); font-size: 14px; font-weight: 700; letter-spacing: .07em;
	text-transform: uppercase; color: var(--ink);
}
.dc-hdr-layer:hover .dc-hdr-layer__c, .dc-hdr-layer:focus-visible .dc-hdr-layer__c { color: var(--acc); }
.dc-hdr-layer__s { display: block; font-size: 11.5px; color: var(--dim); }
.dc-hdr-layer__r {
	display: block; margin-top: 2px; font-family: var(--mono); font-size: 10px;
	line-height: 1.45; color: var(--mut);
}

/* Promo columns */
.dc-hdr-promo { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.dc-hdr-card {
	display: flex; gap: 11px; align-items: center; padding: 9px;
	border: 1px solid var(--line); border-radius: var(--dc-radius-md, 8px);
	background: var(--surf); text-decoration: none;
	transition: border-color 140ms ease;
}
.dc-hdr-card:hover, .dc-hdr-card:focus-visible { border-color: var(--ctl); }
.dc-hdr-card__img {
	flex: 0 0 96px; width: 96px; min-height: 96px;
	display: flex; align-items: center; justify-content: center;
	border-radius: var(--dc-radius-md, 8px); overflow: hidden;
}
/* Dark plate for a transparent PNG/WebP, white only for an opaque photo —
   dc_nav_flagship() computes which from the attachment's has_transparency, so
   the CSS stops assuming a white box for every product. */
.dc-hdr-card__img.is-dark { background: var(--bg); border: 1px solid var(--line); }
.dc-hdr-card__img.is-light { background: #fff; }
.dc-hdr-card__img img, .dc-hdr-card__img picture img {
	width: 96px; height: auto; display: block; max-width: 96px;
}
.dc-hdr-card__mark { flex: 0 0 40px; color: var(--mut); }
.dc-hdr-card__b { min-width: 0; }
.dc-hdr-card__t {
	display: block; font-family: var(--head); font-size: 15px; font-weight: 700;
	letter-spacing: .03em; text-transform: uppercase; color: var(--ink);
}
.dc-hdr-card__p {
	display: inline-block; margin-top: 2px; font-family: var(--mono); font-size: 11.5px;
	color: var(--acc);
}
.dc-hdr-card__d { display: block; margin-top: 2px; font-size: 11px; line-height: 1.4; color: var(--mut); }
.dc-hdr-chip {
	display: inline-block; margin-left: 7px; padding: 1px 6px; border-radius: 9px;
	background: rgba(255, 110, 0, .1); border: 1px solid rgba(255, 110, 0, .35);
	font-family: var(--mono); font-size: 8.5px; letter-spacing: .08em; text-transform: uppercase;
	color: var(--acc);
}
.dc-hdr-trust { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 5px; }
.dc-hdr-trust li {
	position: relative; padding-left: 14px;
	font-family: var(--mono); font-size: 10px; letter-spacing: .03em; color: var(--dim);
}
.dc-hdr-trust li::before { content: "·"; position: absolute; left: 4px; color: var(--acc); }

.dc-hdr-bench {
	border: 1px solid var(--line); border-radius: var(--dc-radius-md, 8px);
	background: var(--surf); padding: 13px;
}
.dc-hdr-bench__l {
	margin: 0 0 6px; font-family: var(--head); font-size: 16px; font-weight: 700;
	line-height: 1.2; letter-spacing: .02em; color: var(--ink);
}
.dc-hdr-bench__p { margin: 0 0 10px; font-size: 11.5px; line-height: 1.45; color: var(--mut); }

.dc-hdr-promo--stack { gap: 12px; }
.dc-hdr-board { display: block; color: var(--acc); opacity: .75; }
.dc-hdr-rule {
	margin: 0; font-family: var(--head); font-size: 15px; font-weight: 700; line-height: 1.25;
	letter-spacing: .02em; color: var(--ink);
}
.dc-hdr-note { margin: 0; font-size: 11px; line-height: 1.5; color: var(--mut); }
.dc-hdr-promo__more { display: flex; flex-direction: column; }

.dc-hdr-btn {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 40px; padding: 0 16px; border-radius: var(--dc-radius-sm, 4px);
	font-family: var(--head); font-size: 14px; font-weight: 700; letter-spacing: .06em;
	text-transform: uppercase; text-decoration: none; text-align: center;
	transition: background-color 140ms ease, color 140ms ease, border-color 140ms ease;
}
.dc-hdr-btn--fill { background: var(--acc); color: #0D0D0D; }
.dc-hdr-btn--fill:hover, .dc-hdr-btn--fill:focus-visible { background: var(--dc-accent-hover, #FF8A2E); }
.dc-hdr-btn--line { border: 1px solid var(--ctl); color: var(--ink); }
.dc-hdr-btn--line:hover, .dc-hdr-btn--line:focus-visible { border-color: var(--ink); }
.dc-hdr-btn--accent { border: 1px solid var(--acc); color: var(--acc); }
.dc-hdr-btn--accent:hover, .dc-hdr-btn--accent:focus-visible { background: var(--acc); color: #0D0D0D; }

.dc-hdr-strip {
	display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 14px;
	padding-top: 8px; border-top: 1px solid var(--line);
}
.dc-hdr-strip__l {
	display: inline-flex; align-items: center; min-height: 24px;
	font-family: var(--mono); font-size: 10px; letter-spacing: .07em; text-transform: uppercase;
	color: var(--mut); text-decoration: none;
}
.dc-hdr-strip__l:hover, .dc-hdr-strip__l:focus-visible { color: var(--ink); }
.dc-hdr-strip__l--go { color: var(--acc); margin-left: auto; }

/* ── 3 · the palette ────────────────────────────────────────────────────── */

.dc-hdr-pal { font-family: var(--body); position: fixed; inset: 0; z-index: 1002; display: none; }
.dc-hdr-pal.is-open { display: block; }
.dc-hdr-pal__scrim { position: absolute; inset: 0; background: rgba(6, 6, 6, .82); }
.dc-hdr-pal__box {
	position: relative; width: min(680px, calc(100vw - 24px));
	margin: clamp(48px, 12vh, 132px) auto 0;
	background: var(--bg2); border: 1px solid var(--line);
	border-radius: var(--dc-radius-lg, 12px); overflow: hidden;
	box-shadow: 0 32px 80px rgba(0, 0, 0, .7);
	animation: dc-hdr-pop 160ms ease both;
	max-height: min(74vh, 640px); display: flex; flex-direction: column;
}
@keyframes dc-hdr-pop { from { opacity: 0; transform: translateY(-10px) } to { opacity: 1; transform: none } }

.dc-hdr-pal__form {
	display: flex; align-items: center; gap: 10px; padding: 12px 14px;
	border-bottom: 1px solid var(--line); flex: 0 0 auto;
}
.dc-hdr-pal__ico { color: var(--mut); display: flex; }
.dc-hdr-pal__in {
	flex: 1 1 auto; min-width: 0; background: none; border: 0; outline: 0;
	color: var(--ink); font-family: var(--body); font-size: 16px;
}
.dc-hdr-pal__in::placeholder { color: var(--mut); }
.dc-hdr-pal__esc {
	background: none; border: 1px solid var(--line); border-radius: 4px; cursor: pointer;
	color: var(--mut); font-family: var(--mono); font-size: 10px; letter-spacing: .08em;
	padding: 4px 8px; min-height: 26px;
}
.dc-hdr-pal__esc:hover, .dc-hdr-pal__esc:focus-visible { color: var(--ink); border-color: var(--ctl); }

.dc-hdr-pal__body { overflow-y: auto; padding: 8px 6px; flex: 1 1 auto; }
.dc-hdr-pal.is-suggesting .dc-hdr-pal__zero { display: none; }
.dc-hdr-pal__g { padding: 4px 0; }
.dc-hdr-pal__gl {
	margin: 6px 10px 4px; font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em;
	text-transform: uppercase; color: var(--mut);
}
.dc-hdr-row {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	min-height: 40px; padding: 8px 10px; border-radius: 6px; text-decoration: none;
	color: var(--dim); font-size: 14px;
}
.dc-hdr-row:hover, .dc-hdr-row.is-active, .dc-hdr-row:focus-visible {
	background: var(--surf); color: var(--ink); outline: none;
}
.dc-hdr-row.is-active { box-shadow: inset 2px 0 0 var(--acc); }
.dc-hdr-row__m { font-family: var(--mono); font-size: 10.5px; color: var(--mut); white-space: nowrap; }

.dc-hdr-pal__foot {
	display: flex; align-items: center; justify-content: space-between; gap: 14px;
	margin: 0; padding: 9px 14px; border-top: 1px solid var(--line);
	font-family: var(--mono); font-size: 9.5px; letter-spacing: .05em; color: var(--mut);
	flex: 0 0 auto;
}
.dc-hdr-pal__keys { display: flex; gap: 12px; flex: 0 0 auto; }
.dc-hdr-pal__depth { text-align: right; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* The theme's own suggest list, restyled inside the palette. */
.dc-hdr-pal .dc-search-suggest { list-style: none; margin: 0; padding: 0; }
.dc-hdr-pal .dc-search-suggest[hidden] { display: none; }
.dc-hdr-pal .dc-search-suggest__link {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	min-height: 44px; padding: 8px 10px; border-radius: 6px; text-decoration: none; color: var(--ink);
}
.dc-hdr-pal .dc-search-suggest__link:hover { background: var(--surf); }
.dc-hdr-pal .dc-search-suggest__price { font-family: var(--mono); font-size: 11px; color: var(--acc); }
.dc-hdr-pal .dc-search-suggest__all a {
	display: block; padding: 9px 10px; font-family: var(--mono); font-size: 11px; color: var(--acc);
}

/* ── 4 · the drawer ─────────────────────────────────────────────────────── */

.dc-hdr-scrim { position: fixed; inset: 0; z-index: 1000; background: rgba(6, 6, 6, .7); display: none; }
.dc-hdr-scrim.is-open { display: block; animation: dc-hdr-fade 160ms ease both; }
@keyframes dc-hdr-fade { from { opacity: 0 } to { opacity: 1 } }

/* CLOSED = display:none. Nothing is parked outside the viewport, so
   overflowDetail.maxRight equals innerWidth open and closed, and with JS off
   the drawer is never in the document flow. */
.dc-hdr-drawer {
	font-family: var(--body);
	position: fixed; inset: 0 0 0 auto; z-index: 1001;
	width: min(420px, 100vw); display: none; flex-direction: column;
	justify-content: flex-start; align-items: stretch;
	margin: 0; padding: 0;
	background: var(--bg2); border-left: 1px solid var(--line);
}
.dc-hdr-drawer::before, .dc-hdr-drawer::after { content: none; display: none; }
.dc-hdr-drawer > :first-child { margin-top: 0; }
body.admin-bar .dc-hdr-drawer { top: 32px; }
@media (max-width: 782px) { body.admin-bar .dc-hdr-drawer { top: 46px; } }
.dc-hdr-drawer.is-open { display: flex; animation: dc-hdr-slide 200ms ease both; }
@keyframes dc-hdr-slide { from { opacity: 0; transform: translateX(18px) } to { opacity: 1; transform: none } }

/* The first row sits AT THE TOP. The staged origin showed ~177 px of empty
   black above the close control — the same "opens onto nothing" defect the
   brief indicted on the live mobile home. Nothing here may inherit a top
   offset: the drawer is pinned with `inset`, its own box has no padding, and
   the first row's spacing is its own 12 px. */
.dc-hdr-drawer__top {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	margin: 0; padding: 12px 14px; border-bottom: 1px solid var(--line);
	flex: 0 0 auto; order: -1;
}
.dc-hdr-drawer__lang { display: flex; gap: 8px; }
.dc-hdr-drawer__lang a {
	display: inline-flex; align-items: center; min-height: 44px; padding: 0 14px;
	border: 1px solid var(--line); border-radius: var(--dc-radius-sm, 4px);
	font-family: var(--mono); font-size: 11px; letter-spacing: .07em;
	color: var(--dim); text-decoration: none;
}
.dc-hdr-drawer__lang a:hover, .dc-hdr-drawer__lang a:focus-visible { color: var(--ink); border-color: var(--ctl); }
.dc-hdr-drawer__x {
	display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: 0 0 auto;
	background: none; border: 0; color: var(--dim); cursor: pointer;
}
.dc-hdr-drawer__x:hover, .dc-hdr-drawer__x:focus-visible { color: var(--ink); }

.dc-hdr-drawer__scroll {
	overflow-y: auto; -webkit-overflow-scrolling: touch;
	margin: 0; padding: 12px 14px 20px; flex: 1 1 auto; min-height: 0;
}
.dc-hdr-drawer__scroll > :first-child { margin-top: 0; }

.dc-hdr-drawer__find {
	display: flex; align-items: center; gap: 9px; width: 100%; min-height: 44px;
	padding: 0 12px; margin-bottom: 14px; cursor: pointer; text-align: left;
	background: var(--bg); border: 1px solid var(--ctl); border-radius: var(--dc-radius-sm, 4px);
	color: var(--mut); font-family: var(--body); font-size: 13.5px;
}
.dc-hdr-drawer__find:hover, .dc-hdr-drawer__find:focus-visible { border-color: var(--acc); color: var(--dim); }

.dc-hdr-acts { display: grid; gap: 9px; margin-bottom: 18px; }
.dc-hdr-acts .dc-hdr-btn { min-height: 44px; }
.dc-hdr-acts__card, .dc-hdr-acts__suite {
	display: block; min-height: 44px; padding: 11px 13px; border: 1px solid var(--line);
	border-radius: var(--dc-radius-md, 8px); background: var(--surf); text-decoration: none;
}
.dc-hdr-acts__card:hover, .dc-hdr-acts__suite:hover,
.dc-hdr-acts__card:focus-visible, .dc-hdr-acts__suite:focus-visible { border-color: var(--ctl); }
.dc-hdr-acts__t {
	font-family: var(--head); font-size: 16px; font-weight: 700; letter-spacing: .03em;
	text-transform: uppercase; color: var(--ink);
}
.dc-hdr-acts__p { font-family: var(--mono); font-size: 12px; color: var(--acc); margin-left: 8px; }
.dc-hdr-acts__d { display: block; margin-top: 2px; font-size: 11.5px; color: var(--mut); }
.dc-hdr-acts__n {
	margin: 2px 0 0; font-family: var(--mono); font-size: 10px; line-height: 1.5; color: var(--mut);
}

.dc-hdr-acc { border-top: 1px solid var(--line); }
.dc-hdr-acc:last-of-type { border-bottom: 1px solid var(--line); }
.dc-hdr-acc__b {
	display: flex; align-items: center; justify-content: space-between; width: 100%;
	min-height: 52px; padding: 0 2px; background: none; border: 0; cursor: pointer;
	font-family: var(--head); font-size: 17px; font-weight: 700; letter-spacing: .04em;
	text-transform: uppercase; color: var(--ink); text-align: left;
}
.dc-hdr-acc__b svg { color: var(--mut); transition: transform 160ms ease; flex: 0 0 auto; }
.dc-hdr-acc__b[aria-expanded="true"] svg { transform: rotate(180deg); }
.dc-hdr-acc__p { padding: 2px 0 14px; }
.dc-hdr-acc__p[hidden] { display: none; }
.dc-hdr-acc__p:not([hidden]) { animation: dc-hdr-acc-in 160ms ease both; }
@keyframes dc-hdr-acc-in { from { opacity: 0; transform: translateY(-4px) } to { opacity: 1; transform: none } }
.dc-hdr-acc__h {
	margin: 12px 0 4px; font-family: var(--mono); font-size: 9.5px; letter-spacing: .14em;
	text-transform: uppercase; color: var(--acc);
}
.dc-hdr-acc__sub {
	margin: 10px 0 2px; font-family: var(--mono); font-size: 9.5px; letter-spacing: .12em;
	text-transform: uppercase; color: var(--mut);
}
.dc-hdr-acc__n { margin: 10px 0 0; font-family: var(--mono); font-size: 10px; color: var(--mut); }
/* 44 px rows on a phone. C3 shipped 87 interactive elements under 44 px in its
   drawer because a min-height on one selector did not reach most rows. */
.dc-hdr-link--drawer { display: flex; flex-wrap: wrap; align-items: center; min-height: 44px; padding: 8px 0; }
.dc-hdr-link--drawer .dc-hdr-link__d { flex: 1 0 100%; }

.dc-hdr-contact { margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--line); }
.dc-hdr-contact__h {
	margin: 0 0 8px; font-family: var(--head); font-size: 15px; font-weight: 700;
	letter-spacing: .06em; text-transform: uppercase; color: var(--ink);
}
.dc-hdr-contact__s { margin: 0 0 10px; font-size: 12px; line-height: 1.55; color: var(--mut); }
.dc-hdr-contact__s strong { color: var(--dim); }
/* Inline in a sentence, so SC 2.5.8 exempts it — padded to clear 24 px anyway. */
.dc-hdr-contact__s a { color: var(--acc); display: inline-block; padding: 5px 0; }
.dc-hdr-contact__r { display: grid; gap: 2px; margin: 0; }
.dc-hdr-contact__r span, .dc-hdr-contact__r a {
	display: flex; align-items: center; gap: 8px; min-height: 44px;
	font-family: var(--mono); font-size: 11px; color: var(--dim); text-decoration: none;
}
.dc-hdr-contact__r a:hover, .dc-hdr-contact__r a:focus-visible { color: var(--ink); }
.dc-hdr-contact__r svg { color: var(--mut); flex: 0 0 auto; }

body.dc-hdr-locked { overflow: hidden; }

/* ── 5 · focus ──────────────────────────────────────────────────────────── */

.dc-hdr a:not(.dc-hdr__word):focus-visible, .dc-hdr button:focus-visible, .dc-hdr input:focus-visible,
.dc-hdr__word--accent:focus-visible,
.dc-hdr-drawer a:focus-visible, .dc-hdr-drawer button:focus-visible,
.dc-hdr-pal a:focus-visible, .dc-hdr-pal button:focus-visible, .dc-hdr-pal input:focus-visible {
	outline: 2px solid var(--acc); outline-offset: 2px; border-radius: 3px;
}

/* ── 6 · breakpoints ────────────────────────────────────────────────────── */

@media (max-width: 1279px) { .dc-hdr__mark, .dc-hdr__rule { display: none; } }
@media (max-width: 1200px) { .dc-hdr__util--status { display: none; } }
@media (max-width: 1180px) {
	.dc-hdr__btct { display: none; }
	.dc-hdr__find-in { width: 116px; }
}

@media (max-width: 1024px) {
	.dc-hdr { --h: 56px; }
	html.dc-hdr-compact .dc-hdr__bar { --h: 56px; }
	.dc-hdr__nav, .dc-hdr__util--btc, .dc-hdr__util--lang, .dc-hdr__util--status,
	.dc-hdr__ico--account { display: none; }
	.dc-hdr__ico--phone { display: inline-flex; }
	.dc-hdr__menu { display: inline-flex; }
	.dc-hdr__in { gap: 4px; }
	.dc-hdr__brand { flex: 1 1 auto; }
	.dc-hdr__utils { gap: 2px; }
	.dc-hdr__menut { display: none; }
	.dc-hdr__menu { width: 44px; height: 40px; padding: 0; justify-content: center; }
	.dc-hdr__ico { width: 44px; height: 44px; }
	/* The search collapses to its label, which is a 44 px target that focuses
	   the input. The input is still in the DOM and still submits on Enter, so
	   the plain GET form works with JS off at every width. */
	.dc-hdr__find { border: 0; background: none; height: 44px; padding: 0; }
	.dc-hdr__find-ico { width: 44px; height: 44px; }
	.dc-hdr__find-in { width: 0; padding: 0; }
	.dc-hdr__find:focus-within {
		position: absolute; left: var(--pad); right: var(--pad); z-index: 5;
		background: var(--bg2); border: 1px solid var(--acc); height: 40px; padding-inline: 4px;
	}
	.dc-hdr__find:focus-within .dc-hdr__find-in { width: auto; flex: 1 1 auto; padding: 0 6px; }
	.dc-hdr__kbd { display: none; }
	.dc-hdr__logo-img, .dc-hdr__logo picture img, .dc-hdr__logo picture { height: 26px; }
}

@media (max-width: 900px) {
	.dc-hdr-cols, .dc-hdr-panel--stack .dc-hdr-cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.dc-hdr-doors { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
	.dc-hdr-drawer { width: 100vw; border-left: 0; }
	.dc-hdr-pal__box { margin-top: 8px; width: calc(100vw - 12px); max-height: calc(100vh - 16px); }
}

/* ── 7 · reduced motion ─────────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
	.dc-hdr *, .dc-hdr-panel, .dc-hdr-drawer, .dc-hdr-pal, .dc-hdr-scrim,
	.dc-hdr-drawer *, .dc-hdr-pal * {
		transition-duration: 1ms !important;
		transition-delay: 0s !important;
		animation-duration: 1ms !important;
		animation-delay: 0s !important;
	}
	.dc-hdr__bar { transition: none; }
}

/* Lead 2026-09-03: the French mark (« Des preuves, pas des promesses. ») is ~30 % longer than the English one and
   clipped to "PROMESS" at 1440 px on /fr/. The mark is the least load-bearing item in the bar, so on French
   pages it yields below 1600 px instead of truncating. English keeps its 1280 px rule above. */
@media (max-width: 1599px) { html[lang^="fr"] .dc-hdr__mark, html[lang^="fr"] .dc-hdr__rule { display: none; } }