/* Cognitive Connections Design DNA (Elementor build).
   Ported from designs.corephp.dev/cognitive-connections/v4, DNA hash ebdc92c1b9d3.
   Only what Elementor cannot reach lives here. Section colour, type, spacing,
   grids, cards and buttons are native Elementor settings on Kit globals.

   Kit globals are scoped to body.elementor-kit-N, so the token map sits on body. */

body {
  --paper: var(--e-global-color-paper);
  --paper-raised: var(--e-global-color-paperraised);
  --ink: var(--e-global-color-text);
  --ink-muted: var(--e-global-color-inkmuted);
  --pine: var(--e-global-color-primary);
  --pine-deep: var(--e-global-color-pinedeep);
  --pine-tint: var(--e-global-color-pinetint);
  --terracotta: var(--e-global-color-accent);
  --terracotta-deep: var(--e-global-color-secondary);
  --terracotta-press: var(--e-global-color-terrapress);
  --clay: var(--e-global-color-clay);
  --clay-light: var(--e-global-color-claylight);
  --mist: var(--e-global-color-mist);
  --mist-bright: var(--e-global-color-mistbright);
  --rule: var(--e-global-color-rule);
  --rule-dark: var(--e-global-color-ruledark);
  --font-display: var(--e-global-typography-secondary-font-family), Georgia, serif;
  --font-body: var(--e-global-typography-text-font-family), system-ui, sans-serif;
  --pad-x: clamp(1.25rem, 5vw, 4rem);
  --gap-block: clamp(1.75rem, 3.6vw, 3rem);
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --t-control: 180ms;
  --t-slow: 900ms;
}

.vh, .elementor.elementor .e-con > .elementor-widget.vh {
  position: absolute; width: 1px; height: 1px; padding: 0;
  margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}

/* ── Links inside text ─────────────────────────────────────────────── */
.link {
  color: var(--terracotta-deep);
  text-decoration: none;
  font-weight: 600;
  background-image: linear-gradient(var(--terracotta-deep), var(--terracotta-deep));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 100% 1px;
  padding-bottom: 2px;
  transition: background-size var(--t-control) var(--ease-out);
}
@media (hover: hover) and (pointer: fine) { .link:hover { color: var(--terracotta-deep); background-size: 100% 2px; } }
.band a.link, .band-deep a.link, .on-pine a.link {
  color: var(--clay-light);
  background-image: linear-gradient(var(--clay-light), var(--clay-light));
}
.prose strong { font-weight: 600; color: var(--ink); }
.band .prose strong, .band-deep .prose strong { color: var(--paper); }
.lede, .elementor-widget.lede p { max-width: 46ch; }
.hero-split-b .lede, .hero-split-b .lede p { max-width: 38ch; }
.pull, .pull p { max-width: 22ch; }

/* ── Pine bands: paper-organic texture ─────────────────────────────── */
.e-con.band, .e-con.band-deep { isolation: isolate; }
.e-con.band::before, .e-con.band-deep::before {
  content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0.05;
  background-image:
    radial-gradient(circle at 18% 22%, #ffffff 0.6px, transparent 0.7px),
    radial-gradient(circle at 62% 68%, #ffffff 0.5px, transparent 0.6px),
    radial-gradient(circle at 84% 34%, #ffffff 0.7px, transparent 0.8px);
  background-size: 47px 47px, 61px 61px, 83px 83px;
  pointer-events: none; display: block; mix-blend-mode: normal;
}

/* ── The connective rule. Signature motif. ─────────────────────────── */
.conn {
  display: flex; align-items: center; gap: 0; margin: 0;
  --conn-col: var(--terracotta);
}
.on-pine .conn, .band .conn, .band-deep .conn { --conn-col: var(--clay); }
.conn::before {
  content: ""; height: 1px; width: clamp(3rem, 9vw, 8rem);
  background: var(--conn-col); flex: 0 0 auto;
  transform-origin: left center; transition: transform var(--t-slow) var(--ease-out);
}
.conn::after {
  content: ""; width: 7px; height: 7px; border-radius: 50%;
  background: var(--conn-col); flex: 0 0 auto;
  transition: transform 420ms var(--ease-out) 620ms, opacity 420ms var(--ease-out) 620ms;
}
.dna-js .conn::before { transform: scaleX(0); }
.dna-js .conn::after { transform: scale(0.4); opacity: 0; }
.dna-js .is-in .conn::before, .dna-js .conn.is-in::before { transform: scaleX(1); }
.dna-js .is-in .conn::after, .dna-js .conn.is-in::after { transform: scale(1); opacity: 1; }

/* ── Buttons: the asymmetric corners morph on hover ────────────────── */
.dna-btn .elementor-button, .dna-cta .elementor-button {
  transition: border-radius 500ms var(--ease-in-out), background-color var(--t-control) var(--ease-out),
              color var(--t-control) var(--ease-out), transform 160ms var(--ease-out);
}
.dna-btn .elementor-button:active, .dna-cta .elementor-button:active { transform: scale(0.97); }
.dna-cta .elementor-button { white-space: nowrap; }
.dna-cta .elementor-button-icon { transition: transform 260ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) {
  .dna-btn .elementor-button:hover { border-radius: 4px 24px 4px 24px; }
  .dna-cta .elementor-button:hover { border-radius: 5px 26px 5px 26px; }
  .dna-cta .elementor-button:hover .elementor-button-icon { transform: translateX(3px); }
}
/* The filled action moves into the menu below 560px (DNA behaviour). */
@media (max-width: 559px) { .elementor-widget-button.cta { display: none; } }

/* ── Entrance ──────────────────────────────────────────────────────── */
.dna-js .dna-reveal {
  opacity: 0; transform: translateY(22px);
  transition: opacity var(--t-slow) var(--ease-out), transform var(--t-slow) var(--ease-out);
}
.dna-js .dna-reveal.is-in { opacity: 1; transform: none; }
.dna-d1 { transition-delay: 120ms; }
.dna-d2 { transition-delay: 240ms; }
.dna-d3 { transition-delay: 360ms; }

[data-draw] { stroke-dasharray: var(--len, 1200); stroke-dashoffset: var(--len, 1200); }
.dna-js .is-in [data-draw] { stroke-dashoffset: 0; transition: stroke-dashoffset 1700ms var(--ease-out) var(--draw-delay, 0ms); }
.dna-js [data-draw-dot] { opacity: 0; transition: opacity 420ms var(--ease-out) var(--draw-delay, 0ms); }
.dna-js .is-in [data-draw-dot] { opacity: 1; }
.dna-js .dna-conv-left { transform: translateX(-3.5rem); opacity: 0; }
.dna-js .dna-conv-right { transform: translateX(3.5rem); opacity: 0; }
.dna-js .dna-conv-left, .dna-js .dna-conv-right { transition: transform 1200ms var(--ease-out), opacity 900ms var(--ease-out); }
@media (max-width: 780px) {
  .dna-js .dna-conv-left { transform: translateX(-1.1rem); }
  .dna-js .dna-conv-right { transform: translateX(1.1rem); }
}
.dna-js .is-in .dna-conv-left, .dna-js .is-in .dna-conv-right { transform: none; opacity: 1; }
.dna-js [data-settle="before"] { opacity: 1; transition: opacity 1400ms var(--ease-in-out); }
.dna-js [data-settle="after"] { opacity: 0; transition: opacity 1400ms var(--ease-in-out) 300ms; }
.dna-js .is-in [data-settle="before"] { opacity: 0; }
.dna-js .is-in [data-settle="after"] { opacity: 1; }
.dna-js .dna-seq > * { opacity: 0; transform: translateY(16px); }
.dna-js .is-in .dna-seq > * { opacity: 1; transform: none; transition: opacity 700ms var(--ease-out), transform 700ms var(--ease-out); }
.dna-js .is-in .dna-seq > *:nth-child(2) { transition-delay: 110ms; }
.dna-js .is-in .dna-seq > *:nth-child(3) { transition-delay: 220ms; }
.dna-js .is-in .dna-seq > *:nth-child(4) { transition-delay: 330ms; }
.dna-js .is-in .dna-seq > *:nth-child(5) { transition-delay: 440ms; }
.dna-js .is-in .dna-seq > *:nth-child(6) { transition-delay: 550ms; }
.dna-js .is-in .dna-seq > *:nth-child(7) { transition-delay: 660ms; }
.dna-js .is-in .dna-seq > *:nth-child(8) { transition-delay: 770ms; }

/* ── Photography ───────────────────────────────────────────────────── */
.elementor-widget-image img { display: block; }
.elementor-widget-image figcaption { text-align: left; font-style: normal; }
.pairjoin figcaption { max-width: 42ch; }
.portrait img { aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; }
.hero-media img { aspect-ratio: 1 / 1; object-fit: cover; object-position: 32% center; background: var(--pine-tint); }
@media (min-width: 940px) { .hero-media img { aspect-ratio: 4 / 5; } }
.team-img img { aspect-ratio: 4 / 3; object-fit: cover; object-position: center 28%; }
.pairhero-fig img { aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; }
.pairjoin .fig img { aspect-ratio: 4 / 5; object-fit: cover; object-position: center 22%; }
.motto-fig img { aspect-ratio: 16 / 9; object-fit: cover; object-position: center 72%; border-radius: 0 0 36px 0; }
@media (max-width: 780px) { .motto-fig img { aspect-ratio: 4 / 3; border-radius: 0 0 24px 0; } }
.shelf-fig img { width: 100%; height: 100%; object-fit: cover; }
.shelf-a img { aspect-ratio: 5 / 4; border-radius: 0 0 32px 0; }
.shelf-b img { aspect-ratio: 1 / 1; border-radius: 0 0 0 28px; }
.shelf-c img { aspect-ratio: 4 / 3; border-radius: 0 0 28px 0; }

/* widen: the image opens outward as it scrolls */
.widen-media { position: relative; width: 100%; overflow: hidden; }
.dna-js .widen-media { clip-path: inset(0 var(--wx, 24%) 0 var(--wx, 24%) round 0 0 var(--wr, 28px) 0); will-change: clip-path; }
.widen-media img { width: 100%; height: auto; }

/* ── Home hero and the scroll-grow ─────────────────────────────────── */
.hero-pin { position: relative; z-index: 2; }
.dna-js .hero-pin.is-active { height: 210vh; }
.dna-js .hero-pin.is-active > .hero-pin-inner { position: sticky; top: 0; min-height: 100vh; justify-content: center; }
.hero-cover {
  position: fixed; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; visibility: hidden;
  clip-path: inset(var(--ci-t, 0px) var(--ci-r, 0px) var(--ci-b, 0px) var(--ci-l, 0px) round 0 0 var(--ci-radius, 44px) 0);
  will-change: clip-path;
}
.hero-cover.is-live { visibility: visible; }
.hero-cover img {
  width: 100%; height: 100%; object-fit: cover; object-position: center 45%;
  transform: scale(var(--ci-scale, 1.04)); will-change: transform;
}
.hero-cover::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(22,48,38,0) 28%, rgba(22,48,38,0.62) 62%, rgba(22,48,38,0.93) 100%);
  opacity: var(--ci-scrim, 0);
}
.hero-cover-line {
  position: absolute; left: var(--ci-cap-x, 2rem); right: var(--ci-cap-x, 2rem); bottom: var(--ci-cap-b, 2.5rem);
  z-index: 2; opacity: var(--ci-scrim, 0); color: var(--paper);
}
.hero-cover-line p {
  font-family: var(--font-display); font-size: clamp(1.7rem, 3.4vw, 2.9rem); line-height: 1.22;
  font-weight: 500; letter-spacing: -0.018em; margin: 0; max-width: 30ch; color: inherit;
}
.dna-js .after-runway { position: relative; z-index: 3; }
.dna-js .e-con.after-runway { background-color: var(--paper); }

/* ── Diagrams and lists (kept as authored markup inside text widgets) ─ */
.dna-html > ul, .dna-html > ol, .dna-html ul[class], .dna-html ol[class] { margin: 0; }
/* The widget margin carries the block's outer spacing (set by the generator). */
.dna-html > :first-child { margin-top: 0; }
.dna-html > :last-child { margin-bottom: 0; }

.axis { --axis-gap: clamp(1.75rem, 3.2vw, 2.75rem); list-style: none; margin: 0; padding: 0; display: grid; gap: var(--axis-gap); }
.axis-item { position: relative; display: flex; flex-direction: column; }
.axis-item .axis-img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 0 0 28px 0; background: var(--pine-tint); }
.axis-item:nth-child(even) .axis-img { border-radius: 0 0 0 28px; }
.axis-marker { position: relative; height: 26px; margin-top: 1.5rem; }
.axis-node { position: absolute; left: 0; top: 50%; width: 11px; height: 11px; margin-top: -5.5px; border-radius: 50%; background: var(--terracotta); z-index: 2; }
.axis-age { font-family: var(--font-body); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--terracotta-deep); margin: 0 0 0.7rem; }
.axis-item h3 { margin: 0 0 0.75rem; }
.axis-item p { color: var(--ink-muted); margin: 0 0 1.2rem; }
.axis-item .link { margin-top: auto; align-self: flex-start; }
@media (min-width: 1000px) {
  .axis { grid-template-columns: repeat(3, 1fr); }
  .axis-marker::before { content: ""; position: absolute; left: 5px; right: calc(-1 * var(--axis-gap)); top: 50%; height: 1px; background: var(--rule); }
  .axis-item:last-child .axis-marker::before { right: 0; }
}

/* Type classes used inside authored markup. Values come from the Kit. */
:where(.dna-html) :is(h1, h2, h3, h4) { margin: 0; }
.dna-html .h-sub, .dna-html h3.h-sub {
  font-family: var(--e-global-typography-hsub-font-family), Georgia, serif; font-size: var(--e-global-typography-hsub-font-size);
  font-weight: var(--e-global-typography-hsub-font-weight); line-height: var(--e-global-typography-hsub-line-height);
  letter-spacing: var(--e-global-typography-hsub-letter-spacing); color: inherit;
}
.dna-html .h-card, .dna-html h3.h-card {
  font-family: var(--e-global-typography-hcard-font-family), Georgia, serif; font-size: var(--e-global-typography-hcard-font-size);
  font-weight: var(--e-global-typography-hcard-font-weight); line-height: var(--e-global-typography-hcard-line-height);
  letter-spacing: var(--e-global-typography-hcard-letter-spacing); color: inherit;
}
.dna-html .lede {
  font-family: var(--e-global-typography-lede-font-family), Georgia, serif; font-size: var(--e-global-typography-lede-font-size);
  line-height: var(--e-global-typography-lede-line-height); color: var(--ink-muted); margin: 0;
}
.dna-html :is(.label, .rolelabel) {
  font-family: var(--font-body); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.15em;
  text-transform: uppercase; color: var(--terracotta-deep); margin: 0;
}
.dna-html .rolelabel { font-weight: 700; letter-spacing: 0.12em; margin: 0.5rem 0 0.9rem; }
.band .dna-html :is(.label, .rolelabel), .band-deep .dna-html :is(.label, .rolelabel) { color: var(--clay-light); }
.dna-html :is(.hint, .credit) { font-size: 0.8125rem; color: var(--ink-muted); }
.dna-html .quiet { color: var(--ink-muted); }
.band .dna-html .quiet, .band-deep .dna-html .quiet { color: var(--mist); }
.dna-html .row-v { color: var(--ink-muted); }
.band .dna-html .row-v, .band-deep .dna-html .row-v { color: var(--mist); }

/* Numbered sequence. Used only where the order is real. */
.steps { counter-reset: step; list-style: none; padding: 0; margin: 0; }
.step { counter-increment: step; position: relative; padding-left: 4.25rem; margin-bottom: 2.5rem; }
.step:last-child { margin-bottom: 0; }
.step::before {
  content: counter(step, decimal-leading-zero); position: absolute; left: 0; top: 0.1rem;
  font-family: var(--font-display); font-size: 1.75rem; font-weight: 600; color: var(--terracotta-deep); line-height: 1;
}
.band .step::before, .band-deep .step::before { color: var(--clay); }
.step .quiet { margin: 0.5rem 0 0; }
.ladder .step { padding-left: 4.75rem; }
.ladder .step h3 { margin-bottom: 0.55rem; }
.ladder .step .row-v { max-width: 60ch; margin: 0; }

/* The Magnificent 7 */
.mag7 { position: relative; }
.mag7-track { list-style: none; margin: 0; padding: 0; display: grid; gap: 1.5rem; }
.m7 { position: relative; display: grid; grid-template-columns: 13px 1fr; gap: 0.9rem; align-items: start; }
.m7-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--terracotta); margin-top: 0.5rem; transform: scale(0.4); opacity: 0; transition: transform 420ms var(--ease-out), opacity 300ms var(--ease-out); }
.is-in .m7-dot, :not(.dna-js) .m7-dot { transform: scale(1); opacity: 1; }
.m7-phys .m7-dot { background: var(--pine); }
.m7 b { display: block; font-family: var(--font-display); font-size: 1.1rem; font-weight: 600; line-height: 1.25; }
.m7 .role { display: block; font-size: 0.875rem; color: var(--ink-muted); margin-top: 0.15rem; }
.m7::before { content: ""; position: absolute; left: 5px; top: 1.1rem; bottom: -1.5rem; width: 1px; background: var(--rule); }
.m7:last-child::before { display: none; }
.mag7-key { display: flex; flex-wrap: wrap; gap: 1.25rem; margin: 2rem 0 0; font-size: 0.8125rem; color: var(--ink-muted); max-width: 68ch; }
.mag7-key span { display: inline-flex; align-items: center; gap: 0.5rem; }
.mag7-key i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; }
.mag7-key .k-cog { background: var(--terracotta); }
.mag7-key .k-phy { background: var(--pine); }
@media (min-width: 960px) {
  .mag7 { padding-block: 1rem; }
  .mag7-track { position: relative; grid-template-columns: repeat(7, 1fr); gap: 0; align-items: center; }
  .mag7-track::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: var(--rule); transform: scaleX(0); transform-origin: left center; transition: transform 1600ms var(--ease-out); }
  .is-in .mag7-track::before { transform: scaleX(1); }
  .m7 { grid-template-columns: none; grid-template-rows: 1fr 13px 1fr; gap: 0; text-align: center; min-height: 15rem; padding-inline: 0.4rem; }
  .m7::before { display: none; }
  .m7-dot { grid-row: 2; margin: 0 auto; }
  .m7-txt { grid-row: 1; align-self: end; padding-bottom: 1rem; }
  .m7-down .m7-txt { grid-row: 3; align-self: start; padding: 1rem 0 0; }
  .m7 b { font-size: 1rem; }
  .m7 .role { font-size: 0.8125rem; }
}

/* Said out loud */
.says { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.say { display: grid; gap: 0.45rem 2.5rem; padding-block: clamp(1.1rem, 2.1vw, 1.6rem); border-bottom: 1px solid var(--rule); align-items: baseline; }
@media (min-width: 820px) { .say { grid-template-columns: 1fr 17rem; } }
.say-q { font-family: var(--font-display); font-size: clamp(1.15rem, 1.9vw, 1.5rem); line-height: 1.32; font-weight: 500; margin: 0; max-width: 34ch; }
.say-a { margin: 0; font-size: 0.875rem; color: var(--ink-muted); }
.say-sys { display: block; font-family: var(--font-body); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--terracotta-deep); margin-bottom: 0.2rem; }
.say-phys .say-sys { color: var(--pine); }
.says-foot a { color: var(--terracotta-deep); font-weight: 600; text-decoration: none; border-bottom: 1px solid transparent; }
.says-foot a:hover { border-bottom-color: var(--terracotta-deep); }
.elementor-widget.says-foot p { max-width: 72ch; }

/* Routes (services hero) */
.routes { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--rule); }
.route { position: relative; }
.route > a { position: relative; display: grid; gap: 0.4rem 2rem; align-items: center; padding: clamp(1.5rem, 2.8vw, 2.25rem) 0; border-bottom: 1px solid var(--rule); text-decoration: none; color: inherit; isolation: isolate; }
@media (min-width: 780px) { .route > a { grid-template-columns: 15rem 1fr auto; } }
.route > a::before { content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: calc(-1 * var(--pad-x)); right: calc(-1 * var(--pad-x)); background: var(--pine-tint); transform: scaleX(0); transform-origin: left center; transition: transform 420ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) { .route > a:hover::before { transform: scaleX(1); } }
.route-age { font-family: var(--font-body); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--terracotta-deep); }
.route-name { font-family: var(--font-display); font-size: clamp(1.6rem, 3.4vw, 2.6rem); font-weight: 500; line-height: 1.12; letter-spacing: -0.018em; transition: color var(--t-control) var(--ease-out); }
.route-note { display: block; font-family: var(--font-body); font-size: 0.9375rem; color: var(--ink-muted); margin-top: 0.35rem; max-width: 46ch; letter-spacing: 0; }
.route-go { display: none; color: var(--terracotta-deep); transition: transform 320ms var(--ease-out); }
@media (min-width: 780px) { .route-go { display: block; } }
@media (hover: hover) and (pointer: fine) {
  .route > a:hover .route-name { color: var(--terracotta-deep); }
  .route > a:hover .route-go { transform: translateX(6px); }
}

/* The pair, as the hero (About) */
.pairhero-pair { display: grid; grid-template-columns: 1fr auto 1fr; gap: clamp(0.75rem, 2vw, 1.5rem); align-items: center; }
.pairhero-fig { margin: 0; }
.pairhero-fig img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: center 20%; background: var(--pine-tint); border-radius: 0 0 26px 0; }
.pairhero-fig + .pairhero-fig img, .pairhero-fig.is-right img { border-radius: 0 0 0 26px; }
.pairhero-name { font-family: var(--font-display); font-size: clamp(1rem, 1.4vw, 1.15rem); font-weight: 600; line-height: 1.25; margin: 0.85rem 0 0; }
.pairhero-role { font-family: var(--font-body); font-size: 0.625rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--terracotta-deep); margin: 0.3rem 0 0; }
.pairhero-node { width: 11px; height: 11px; border-radius: 50%; background: var(--terracotta); align-self: center; position: relative; }
.dna-js .pairhero-node { transform: scale(0.4); opacity: 0; transition: transform 460ms var(--ease-out) 700ms, opacity 320ms var(--ease-out) 700ms; }
.dna-js .is-in .pairhero-node { transform: scale(1); opacity: 1; }
.pairhero-node::before, .pairhero-node::after { content: ""; position: absolute; top: 50%; width: clamp(0.5rem, 1.6vw, 1.25rem); height: 1px; background: var(--rule); }
.pairhero-node::before { right: 100%; }
.pairhero-node::after { left: 100%; }

/* The motto, as the ladder (Certification) */
.motto { display: grid; gap: clamp(0.7rem, 1.6vw, 1.35rem); margin: 0; }
.motto-line { display: grid; gap: 0.35rem 1.75rem; align-items: baseline; }
@media (min-width: 860px) { .motto-line { grid-template-columns: auto 1fr; } }
.motto-word { font-family: var(--font-display); font-size: clamp(2.75rem, 7.4vw, 5.75rem); line-height: 0.98; font-weight: 500; letter-spacing: -0.022em; white-space: nowrap; }
.motto-tier { font-family: var(--font-body); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; color: var(--terracotta-deep); line-height: 1.5; }
.motto-tier b { display: block; font-weight: 700; }
.motto-tier em { display: block; font-style: normal; font-weight: 500; letter-spacing: 0.02em; text-transform: none; font-size: 0.9375rem; color: var(--ink-muted); margin-top: 0.15rem; }
.mstep-2 { padding-left: clamp(1.25rem, 7vw, 8rem); }
.mstep-3 { padding-left: clamp(2.5rem, 14vw, 16rem); }

/* Store opening */
.elementor-widget.shelf-note p { max-width: 34ch; }
.shelf-say { font-family: var(--font-display); font-size: clamp(1.6rem, 3vw, 2.6rem); line-height: 1.18; font-weight: 500; letter-spacing: -0.018em; margin: 0; max-width: 18ch; }
@media (min-width: 900px) { .shelf-say { margin-top: 2.25rem; } }

/* Pair joined (About, Contact) */
.pairjoin-node { width: 11px; height: 11px; border-radius: 50%; background: var(--terracotta); justify-self: center; position: relative; }
.pairjoin-node::before, .pairjoin-node::after { content: ""; position: absolute; top: 50%; width: clamp(1rem, 3vw, 2.5rem); height: 1px; background: var(--rule); }
.pairjoin-node::before { right: 100%; }
.pairjoin-node::after { left: 100%; }
@media (max-width: 767px) { .pairjoin-node, .elementor-widget:has(> .pairjoin-node) { display: none; } }

.elementor-widget.rolelabel p { margin: 0; font-weight: 700; letter-spacing: 0.12em; }
.faq-head .elementor-widget.quiet p { max-width: 32ch; }
:where(.dna-html) p { max-width: 68ch; }

/* Six developmental domains */
.domains { list-style: none; margin: 0; padding: 0; display: grid; gap: clamp(1.5rem, 3vw, 2.25rem); }
@media (min-width: 760px) { .domains { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .domains { grid-template-columns: repeat(3, 1fr); } }
.domain { border-top: 1px solid var(--rule); padding-top: 1.1rem; }
.domain-n { display: block; font-family: var(--font-display); font-size: 1.6rem; font-weight: 600; color: var(--terracotta-deep); line-height: 1; margin-bottom: 0.6rem; }
.domain h3 { margin-bottom: 0.6rem; }

/* Tick lists */
.ticks { list-style: none; margin: 0.9rem 0 0; padding: 0; }
.ticks li { position: relative; padding-left: 1.4rem; margin-bottom: 0.5rem; font-size: 0.95rem; }
.ticks li::before { content: ""; position: absolute; left: 0; top: 0.62em; width: 6px; height: 6px; border-radius: 50%; background: var(--terracotta); }
.band .ticks li::before, .band-deep .ticks li::before, .on-pine .ticks li::before { background: var(--clay); }
.convert-aside .ticks li { margin-bottom: 0.9rem; }
.convert-aside .ticks strong { display: block; }

/* Intake question list */
.asks { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.65rem; }
@media (min-width: 700px) { .asks { grid-template-columns: repeat(2, 1fr); } }
.asks li { font-family: var(--font-display); font-size: 1.15rem; border-bottom: 1px solid var(--rule); padding-bottom: 0.65rem; }

/* Conditions */
.condlist { list-style: none; margin: 0; padding: 0; }
.condlist li { border-top: 1px solid var(--rule); padding: 1rem 0; }
.condlist strong { display: block; font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; }
.condlist span { display: block; color: var(--ink-muted); font-size: 0.95rem; margin-top: 0.3rem; }
.cond-go { display: block; text-decoration: none; color: inherit; }
.cond-go strong { transition: color var(--t-control) var(--ease-out); }
.cond-go:hover strong, .cond-go:focus-visible strong { color: var(--terracotta-deep); }

.row-tag { display: inline-block; margin-left: 0.6rem; vertical-align: middle; font-family: var(--font-body); font-size: 0.625rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-muted); border: 1px solid var(--rule); border-radius: 10px 2px 10px 2px; padding: 0.2rem 0.5rem; }

.speaker { border-top: 1px solid var(--rule); padding: clamp(1.75rem, 3.4vw, 2.75rem) 0; }
.speaker:first-child { border-top: 0; padding-top: 0; }

.price-cur { font-family: var(--font-body); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.1em; color: var(--ink-muted); }
.band .price-cur, .band-deep .price-cur { color: var(--mist); }
.price-was { font-size: 0.95rem; font-weight: 400; color: var(--ink-muted); text-decoration: line-through; margin-left: 0.6rem; font-family: var(--font-body); }
.band .price-was, .band-deep .price-was { color: var(--mist); }

.smap { list-style: none; padding: 0; margin: 0; display: grid; gap: 1rem; }
@media (min-width: 720px) { .smap-2 { grid-template-columns: repeat(2, 1fr); column-gap: clamp(1.5rem, 3vw, 2.75rem); } }
.smap li { border-top: 1px solid var(--rule); padding-top: 0.85rem; }
.smap span { display: block; margin-top: 0.25rem; font-size: 0.9375rem; color: var(--ink-muted); }

.settle-stage { position: relative; }
.fig-svg { width: 100%; height: auto; display: block; }
.fig-svg text { font-family: var(--font-body); font-size: 12px; font-weight: 600; fill: var(--ink); }
.band .fig-svg text, .band-deep .fig-svg text { fill: var(--paper); }

/* Milestones summary chart */
.varchart { margin: 0; }
.varchart table { width: 100%; border-collapse: collapse; margin: 0; }
.varchart th, .varchart td { text-align: left; padding: 0.85rem 0; vertical-align: middle; border: 0; background: none; }
.varchart thead th { font-family: var(--font-body); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink-muted); padding-bottom: 0.6rem; border-bottom: 1px solid var(--rule); }
.varchart tbody th { font-family: var(--font-body); font-size: 0.9375rem; font-weight: 600; white-space: nowrap; padding-right: 1.25rem; }
.varchart tbody tr + tr th, .varchart tbody tr + tr td { border-top: 1px solid var(--rule); }
.varchart tbody td:nth-child(2) { position: relative; width: 62%; padding-right: 1rem; }
.vbar { display: block; position: relative; height: 9px; border-radius: 5px; background: var(--pine); width: var(--v); transform-origin: left center; transition: transform 900ms var(--ease-out); }
.dna-js .vbar { transform: scaleX(0); }
.dna-js .is-in .vbar { transform: scaleX(1); }
.varchart tbody td:nth-child(2)::after { content: ""; position: absolute; left: 75%; top: 0; bottom: 0; width: 0; border-left: 1px dashed var(--ink-muted); }
.vnum { display: block; margin-top: 0.4rem; font-size: 0.8125rem; color: var(--ink-muted); }
.vdelta { font-family: var(--font-display); font-size: 1.125rem; font-weight: 600; white-space: nowrap; }
.is-behind { color: var(--terracotta-deep); }
.is-ahead, .is-level { color: var(--pine); }
.varchart figcaption { font-size: 0.8125rem; color: var(--ink-muted); margin-top: 1rem; line-height: 1.5; }
@media (max-width: 520px) { .varchart tbody th { white-space: normal; } .varchart tbody td:nth-child(2) { width: 48%; } }

/* Tags */
.tags { display: flex; flex-wrap: wrap; gap: 0.55rem; padding: 0; margin: 0; list-style: none; }
.tags a, .tags span { display: inline-block; font-size: 0.875rem; font-weight: 500; padding: 0.5rem 1rem; border: 1px solid var(--rule); border-radius: 14px 3px 14px 3px; text-decoration: none; color: var(--ink); transition: background-color var(--t-control) var(--ease-out), border-color var(--t-control) var(--ease-out); }
.tags a:hover { background: var(--pine-tint); border-color: var(--terracotta); color: var(--ink); }
.band .tags a, .band-deep .tags a, .band .tags span, .band-deep .tags span { border-color: var(--rule-dark); color: var(--paper); }
.band .tags a:hover, .band-deep .tags a:hover { background: rgba(255,255,255,0.1); border-color: var(--clay); }

.soon { display: inline-block; vertical-align: middle; margin-left: 0.55rem; white-space: nowrap; font-family: var(--font-body); font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--terracotta-deep); border: 1px solid currentColor; border-radius: 12px 3px 12px 3px; padding: 0.18rem 0.5rem; }
.band .soon, .band-deep .soon, .on-pine .soon { color: var(--clay-light); }

/* A quotation inside an essay */
.pullq { position: relative; margin: 2.25rem 0; padding-left: clamp(1.5rem, 3vw, 2.5rem); border: 0; }
.pullq::before { content: "\201C"; position: absolute; left: 0; top: -0.3em; font-family: var(--font-display); font-size: 2.75rem; line-height: 1; color: var(--terracotta-deep); }
.pullq p { margin: 0; font-family: var(--font-display); font-style: italic; font-size: clamp(1.125rem, 1.9vw, 1.375rem); line-height: 1.45; color: var(--ink); }
.band .pullq p, .band-deep .pullq p, .on-pine .pullq p { color: var(--paper); }
.band .pullq::before, .band-deep .pullq::before, .on-pine .pullq::before { color: var(--clay); }

/* Age rail */
.agerail-track { list-style: none; margin: 0; padding: 0; display: flex; justify-content: space-between; align-items: flex-start; position: relative; }
.agerail-track::before { content: ""; position: absolute; left: 0; right: 0; top: 5px; height: 1px; background: var(--rule); transform-origin: left center; transition: transform 1400ms var(--ease-out); }
.dna-js .agerail-track::before { transform: scaleX(0); }
.dna-js .is-in .agerail-track::before, .dna-js .agerail.is-in .agerail-track::before { transform: scaleX(1); }
.agerail-track li { display: grid; justify-items: center; gap: 0.6rem; position: relative; z-index: 1; }
.agerail-track li:first-child { justify-items: start; }
.agerail-track li:last-child { justify-items: end; }
.agerail-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--paper); box-shadow: inset 0 0 0 1.5px var(--rule); }
.agerail-track li:first-child .agerail-dot, .agerail-track li:last-child .agerail-dot { background: var(--terracotta-deep); box-shadow: none; }
.agerail-lab { font-family: var(--font-body); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink-muted); white-space: nowrap; }
.agerail-track li:first-child .agerail-lab, .agerail-track li:last-child .agerail-lab { color: var(--terracotta-deep); }
@media (max-width: 559px) { .agerail-track li:nth-child(even) { display: none; } }

/* Facts strip */
.facts { display: grid; gap: 0; margin: 0; border-top: 1px solid var(--rule); grid-template-columns: 1fr; }
@media (min-width: 620px) { .facts { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .facts { grid-template-columns: repeat(3, 1fr); } .facts:has(> :nth-child(4)) { grid-template-columns: repeat(4, 1fr); } }
.fact { --fact-gap: clamp(1.25rem, 2.2vw, 1.9rem); padding-block: 1.25rem; padding-inline: 0 var(--fact-gap); border-bottom: 1px solid var(--rule); }
@media (min-width: 620px) {
  .fact { border-bottom: 0; border-right: 1px solid var(--rule); }
  .fact + .fact { padding-inline-start: var(--fact-gap); }
  .fact:last-child { border-right: 0; padding-inline-end: 0; }
}
@media (min-width: 620px) and (max-width: 999px) {
  .fact:nth-child(2n) { border-right: 0; padding-inline-end: 0; }
  .fact:nth-child(2n+1) { padding-inline-start: 0; }
  .fact:nth-child(-n+2) { border-bottom: 1px solid var(--rule); }
  .fact:last-child { border-right: 0; }
}
@media (max-width: 619px) { .fact { padding-inline: 0; } }
.fact dt { font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--terracotta-deep); margin: 0 0 0.45rem; }
.fact dd { margin: 0; font-family: var(--font-display); font-size: 1.1875rem; line-height: 1.3; }
.band .fact dt, .band-deep .fact dt, .on-pine .fact dt { color: var(--clay-light); }
.band .fact, .band-deep .fact, .on-pine .fact { border-color: var(--rule-dark); }

/* Contents bar */
.e-con.toc { position: sticky; top: var(--hdr-h, 79px); z-index: 40; border-block: 1px solid var(--rule); }
[id] { scroll-margin-top: calc(var(--hdr-h, 79px) + 1.5rem); }
.toc ~ [id] { scroll-margin-top: calc(var(--hdr-h, 79px) + 3.75rem); }
.toc ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 0.35rem 1.75rem; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.toc ul::-webkit-scrollbar { display: none; }
.toc a { display: block; white-space: nowrap; padding: 0.9rem 0; font-size: 0.875rem; font-weight: 500; color: var(--ink-muted); text-decoration: none; border-bottom: 2px solid transparent; transition: color var(--t-control) var(--ease-out), border-color var(--t-control) var(--ease-out); }
.toc a:hover { color: var(--ink); }
.toc a[aria-current="true"] { color: var(--terracotta-deep); border-bottom-color: var(--terracotta-deep); }
@media (max-width: 619px) {
  .e-con.toc { display: none; }
  .e-con.toc-shop { display: flex; }
  .toc-shop a { padding: 0.75rem 0; font-size: 0.8125rem; }
  .toc-shop ul { gap: 0.35rem 1.25rem; }
}

/* Domain cards */
.dgrid { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; background: var(--rule); border: 1px solid var(--rule); }
@media (min-width: 700px) { .dgrid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .dgrid { grid-template-columns: repeat(3, 1fr); } }
.dcard { background: var(--paper); padding: clamp(1.5rem, 2.4vw, 2rem); }
@media (min-width: 700px) { .dcard:nth-child(odd):last-child { grid-column: 1 / -1; } }
@media (min-width: 1080px) {
  .dcard:nth-child(odd):last-child { grid-column: auto; }
  .dcard:nth-child(3n+1):last-child { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1.6fr; column-gap: clamp(1.5rem, 3vw, 3rem); align-content: start; }
  .dcard:nth-child(3n+1):last-child > .dcard-n, .dcard:nth-child(3n+1):last-child > .h-card, .dcard:nth-child(3n+1):last-child > .dcard-kicker { grid-column: 1; }
  .dcard:nth-child(3n+1):last-child > .dcard-kicker { margin-bottom: 0; }
  .dcard:nth-child(3n+1):last-child > .quiet { grid-column: 2; grid-row: 2 / span 2; align-self: start; }
}
.dcard:last-child { border-radius: 0 0 28px 0; }
.dcard-n { display: block; font-family: var(--font-display); font-size: clamp(2.25rem, 3.4vw, 3rem); line-height: 1; font-weight: 500; color: var(--terracotta-deep); margin-bottom: 0.85rem; }
.dcard .h-card { margin-bottom: 0.35rem; }
.dcard-kicker { font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.02em; color: var(--ink-muted); margin: 0 0 0.85rem; }
.dcard .quiet { margin: 0; font-size: 0.9375rem; }

/* ── FAQ (Elementor nested accordion) ──────────────────────────────── */
/* The widget boxes every title and panel by default; the DNA has only the rules between items.
   A border set in the widget's own Style tab still outranks this. */
.dna-faq.elementor-widget-n-accordion { --n-accordion-border-width: 0px; }
.dna-faq .e-n-accordion-item { border-bottom: 1px solid var(--rule); }
.band .dna-faq .e-n-accordion-item, .band-deep .dna-faq .e-n-accordion-item { border-color: var(--rule-dark); }
.dna-faq .e-n-accordion-item-title { cursor: pointer; }
/* The DNA's +/− are Inter text glyphs, lighter than the widget's Font Awesome icons. */
.dna-faq .e-n-accordion-item-title-icon svg { display: none; }
.dna-faq .e-n-accordion-item-title-icon span::before {
  display: block; font-family: var(--font-body); font-size: 1.5rem; font-weight: 400; line-height: 1; color: var(--terracotta-deep);
}
/* The DNA pins the glyph to the question's first line rather than centring it in the row. */
.dna-faq.elementor-widget-n-accordion .e-n-accordion-item-title { align-items: flex-start; }
.dna-faq .e-n-accordion-item-title-icon { height: calc(1.2rem * 1.75); align-items: center; }
.dna-faq .e-n-accordion-item-title-icon span { height: auto; }
.dna-faq .e-n-accordion-item-title-icon .e-closed::before { content: "+"; }
.dna-faq .e-n-accordion-item-title-icon .e-opened::before { content: "\2212"; }
.dna-faq .e-n-accordion-item-title-text { max-width: 60ch; }
/* The DNA reserves 2.5rem for the +/- icon; the widget already spends 30px of it
   (4px title padding, 16px glyph, 10px icon gap), so questions wrap at the same width. */
.dna-faq .e-n-accordion-item-title-header { margin-inline-end: 10px; }
.dna-faq .faq-a p { max-width: 62ch; }

/* ── Gravity Forms, dressed as the DNA form ────────────────────────────
   Orbital is themed through its own --gf-* properties, mapped onto the DNA tokens.
   GF prints its defaults inline keyed on the wrapper id, so the id is needed here. */
.dna-gform #gform_wrapper_1.gform-theme.gform_wrapper {
  --gf-color-primary: var(--terracotta-deep);
  --gf-ctrl-size: 3.05rem;
  --gf-ctrl-padding-x: 1rem;
  --gf-ctrl-font-family: var(--font-body);
  --gf-ctrl-font-size: 1rem;
  --gf-ctrl-line-height: 1.4;
  --gf-ctrl-color: var(--ink);
  --gf-ctrl-bg-color: var(--paper-raised);
  --gf-ctrl-border-width: 1.5px;
  --gf-ctrl-border-color: var(--rule);
  --gf-ctrl-border-color-hover: var(--rule);
  --gf-ctrl-border-color-focus: var(--terracotta);
  --gf-ctrl-outline-width-focus: 0;
  --gf-ctrl-shadow: none;
  --gf-ctrl-label-color-primary: var(--ink);
  --gf-ctrl-label-color-req: var(--terracotta-deep);
  --gf-ctrl-label-font-family-primary: var(--font-body);
  --gf-ctrl-label-font-size-primary: 0.875rem;
  --gf-ctrl-label-font-weight-primary: 600;
  --gf-form-gap-y: 1.5rem;
  --gf-ctrl-btn-bg-color-primary: var(--terracotta-deep);
  --gf-ctrl-btn-bg-color-hover-primary: var(--terracotta-press);
  --gf-ctrl-btn-color-primary: #ffffff;
  --gf-ctrl-btn-border-width-primary: 0;
  --gf-ctrl-btn-font-family: var(--font-body);
  --gf-ctrl-btn-font-size: 0.9375rem;
  --gf-ctrl-btn-font-weight: 600;
  --gf-ctrl-btn-line-height: 1.75;
  --gf-ctrl-btn-padding-x: 1.35rem;
  --gf-ctrl-btn-padding-y: 0.8rem;
  --gf-ctrl-btn-size: auto;
  --gf-ctrl-btn-shadow: none;
}
/* One radius variable cannot express the DNA's asymmetric corners. */
.dna-gform #gform_wrapper_1 .gfield :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  border-start-start-radius: 14px; border-start-end-radius: 3px; border-end-end-radius: 14px; border-end-start-radius: 3px;
}
.dna-gform #gform_wrapper_1 .gfield textarea { min-block-size: 8.5rem; }
.dna-gform #gform_wrapper_1 .gform_footer .gform_button {
  border-start-start-radius: 26px; border-start-end-radius: 5px; border-end-end-radius: 26px; border-end-start-radius: 5px;
  transition: background-color var(--t-control) var(--ease-out), border-radius 500ms var(--ease-in-out);
}
@media (hover: hover) and (pointer: fine) {
  .dna-gform #gform_wrapper_1 .gform_footer .gform_button:hover {
    border-start-start-radius: 5px; border-start-end-radius: 26px; border-end-end-radius: 5px; border-end-start-radius: 26px;
  }
}
.dna-gform #gform_wrapper_1 .gfield_required { display: none; }
.dna-gform .gform_confirmation_message { font-family: var(--font-display); font-size: 1.2rem; }

/* ── Header ────────────────────────────────────────────────────────── */
.mark { display: inline-flex; align-items: center; gap: 0.7rem; text-decoration: none; color: inherit; }
.mark:hover { color: inherit; }
.mark svg { flex: 0 0 auto; display: block; }
.mark-a { stroke: var(--pine); }
.mark-b { stroke: var(--terracotta); }
.ftr .mark-a { stroke: var(--paper); }
.ftr .mark-b { stroke: var(--clay); }
.mark-txt { display: flex; flex-direction: column; line-height: 1; }
.mark-txt b { font-family: var(--font-display); font-size: clamp(1.15rem, 1.7vw, 1.4rem); font-weight: 600; letter-spacing: -0.015em; color: var(--ink); }
.mark-txt span { font-family: var(--font-body); font-size: 0.625rem; font-weight: 600; letter-spacing: 0.17em; text-transform: uppercase; color: var(--ink-muted); margin-top: 4px; }
.ftr .mark-txt b { color: var(--paper); }
.ftr .mark-txt span { color: var(--mist); }

.hdr .elementor-nav-menu--main .elementor-item { border-radius: 12px 2px 12px 2px; white-space: nowrap; }
/* Dropdown triggers are buttons in the DNA: normal line-height, never marked as the current
   page, chevron flipped while open. The body/location prefix outranks the widget's own rules. */
body .elementor-location-header .hdr .elementor-nav-menu--main .menu-item-has-children > .elementor-item { line-height: normal; align-self: center; }
body .elementor-location-header .hdr .elementor-nav-menu--main .menu-item-has-children > .elementor-item.elementor-item-active:not(:hover, :focus-visible, .highlighted) { color: var(--ink); }
body .elementor-location-header .hdr .elementor-nav-menu--main .menu-item-has-children > .elementor-item.elementor-item-active:not(:hover, :focus-visible, .highlighted)::before { opacity: 0; }
/* The DNA's chevron is a thin stroked line, lighter than the widget's Font Awesome icon. */
.hdr .elementor-nav-menu--main .sub-arrow svg { display: none; }
body .elementor-location-header .hdr .elementor-nav-menu--main .sub-arrow { padding: 0 0 0 0.65rem; margin: 0; }
.hdr .elementor-nav-menu--main .sub-arrow::before {
  content: ""; width: 12px; height: 8px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5l5-5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  transition: transform 260ms var(--ease-out);
}
.hdr .elementor-nav-menu--main .elementor-item.highlighted .sub-arrow::before { transform: rotate(180deg); }
/* !important: SmartMenus writes min-width: 10em inline when a submenu opens. */
.hdr .elementor-nav-menu--main ul.sub-menu { box-shadow: 0 14px 34px rgba(27,38,32,0.13); padding: 0.65rem; min-width: 20rem !important; }
.hdr .elementor-nav-menu--main ul.sub-menu a { border-radius: 10px 2px 10px 2px; }
/* The widget's dropdown typography reaches only the phone menu, so desktop submenu links take the
   Nav preset's line-height here, and stack the menu item description (.sub-note) under the label. */
body .elementor-location-header .hdr .elementor-nav-menu--main .elementor-sub-item {
  line-height: var(--e-global-typography-nav-line-height); flex-direction: column; align-items: flex-start;
  border-inline-start: 0; /* the widget's 8px nesting indent; the DNA has one level */
}
.hdr .sub-note { display: block; font-size: 0.8125rem; color: var(--ink-muted); margin-top: 0.15rem; }
/* The Care panel: services in the first column, conditions in two beside it.
   !important below: SmartMenus (Elementor Pro nav) writes display and width inline on open. */
@media (min-width: 1025px) {
  .hdr .elementor-nav-menu--main .cc-care > ul.sub-menu {
    grid-template-columns: 17rem 1fr 1fr; grid-auto-flow: row dense; gap: 0.1rem 0.5rem;
    min-width: 45rem !important; padding: 1rem;
  }
  .hdr .elementor-nav-menu--main .cc-care:hover > ul.sub-menu,
  .hdr .elementor-nav-menu--main .cc-care:focus-within > ul.sub-menu,
  .hdr .elementor-nav-menu--main .cc-care > ul.sub-menu[aria-hidden="false"] { display: grid !important; }
  .hdr .cc-svc { grid-column: 1; }
  .hdr .cc-c1 { grid-column: 2; border-left: 1px solid var(--rule); padding-left: 1.25rem; }
  .hdr .cc-c2 { grid-column: 3; }
  .hdr .cc-care > ul.sub-menu li { width: auto !important; }
  /* dna.js packs the panel once it can measure; items keep their own height either way. */
  .hdr .elementor-nav-menu--main .cc-care > ul.sub-menu > li { align-self: start; }
  .hdr .elementor-nav-menu--main .cc-care > ul.sub-menu.is-packed { grid-auto-rows: 1px; row-gap: 0; }
  .hdr .elementor-nav-menu--main .cc-care > ul.sub-menu.is-packed > li.cc-c1 { align-self: stretch; }
}
/* The DNA's toggle is a labelled pill ("Menu"), not a bare icon. */
.hdr .elementor-menu-toggle {
  gap: 0.55rem; width: auto; min-height: 44px; padding: 0.65rem 1rem;
  border: 1.5px solid var(--ink); border-radius: 16px 3px 16px 3px;
}
.hdr .elementor-menu-toggle::after {
  content: "Menu"; font-family: var(--font-body); font-size: 0.875rem; font-weight: 600; line-height: 1;
}
.hdr .elementor-menu-toggle.elementor-active::after { content: "Close"; }
/* The menu's own call to action exists for the phone overlay only. */
body .elementor-location-header .hdr .elementor-nav-menu li.cc-cta-mobile { display: none; }
/* Below desktop the dropdown becomes the DNA's pine overlay. The body/location prefix outranks
   the widget's per-element dropdown styles, which stay in force for the desktop panels. */
@media (max-width: 1024px) {
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown.elementor-nav-menu__container {
    background: var(--pine-deep); min-height: calc(100dvh - 79px); padding: 1rem var(--pad-x) 2rem; border: 0; border-radius: 0;
  }
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown.elementor-nav-menu__container .sub-arrow svg { fill: var(--paper); }
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown.elementor-nav-menu__container .sub-menu { background: none; border: 0; box-shadow: none; padding: 0.4rem 0 1rem; }
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown.elementor-nav-menu__container .elementor-item {
    background: none; color: var(--paper); font-family: var(--font-display); font-size: 1.35rem; font-weight: 500;
    padding: 0.7rem 0; border-bottom: 1px solid rgba(255, 255, 255, 0.09); border-radius: 0;
  }
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown.elementor-nav-menu__container .elementor-sub-item {
    background: none; color: var(--mist-bright); font-family: var(--font-body); font-size: 1rem; font-weight: 500;
    padding: 0.55rem 0 0.55rem 1.1rem; border: 0; border-radius: 0;
  }
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown.elementor-nav-menu__container :is(.elementor-item, .elementor-sub-item):is(:hover, :focus, .highlighted, .elementor-item-active) {
    background: none; color: var(--clay-light);
  }
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown.elementor-nav-menu__container .elementor-sub-item { flex-direction: column; align-items: flex-start; }
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown .sub-note { color: var(--mist); }
  .hdr .elementor-nav-menu--dropdown .sub-arrow svg { transition: transform 260ms var(--ease-out); }
  .hdr .elementor-nav-menu--dropdown .elementor-item.highlighted .sub-arrow svg { transform: rotate(180deg); }
}
@media (max-width: 559px) {
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown li.cc-cta-mobile { display: block; margin-top: 1.75rem; }
  body .elementor-location-header .hdr .elementor-nav-menu--dropdown.elementor-nav-menu__container .cc-cta-mobile > .elementor-item {
    display: inline-flex; width: auto; background: var(--terracotta-deep); color: #ffffff;
    font-family: var(--font-body); font-size: 0.9375rem; font-weight: 600; padding: 0.8rem 1.35rem;
    border: 0; border-radius: 26px 5px 26px 5px;
  }
}


/* ── Footer ────────────────────────────────────────────────────────── */
.ftr ul { list-style: none; padding: 0; margin: 0; }
.ftr li { margin-bottom: 0.6rem; }
.ftr li a { font-size: 0.9375rem; color: var(--mist-bright); text-decoration: none; }
.ftr li a:hover { color: #ffffff; text-decoration: underline; text-underline-offset: 3px; }
.ftr-conds ul { columns: 2; column-gap: 1.75rem; }
@media (max-width: 479px) { .ftr-conds ul { columns: 1; } }
.ftr-conds li { break-inside: avoid; }
.ftr-star { color: var(--clay-light); margin-left: 0.35em; font-size: 0.7em; vertical-align: 0.25em; }
.ftr-key { margin: 1.1rem 0 0; font-size: 0.8125rem; color: var(--mist); }
.ftr-key a { color: var(--mist-bright); text-decoration: underline; text-underline-offset: 3px; }
.ftr-base p { max-width: none; }

/* !important below: the user's reduced-motion preference must beat every transition, Elementor's included. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  .dna-js .dna-reveal, .dna-js .dna-conv-left, .dna-js .dna-conv-right, .dna-js .dna-seq > * { opacity: 1 !important; transform: none !important; }
  .dna-js [data-draw] { stroke-dashoffset: 0 !important; }
  .dna-js [data-draw-dot] { opacity: 1 !important; }
  .dna-js [data-settle="before"] { opacity: 0 !important; }
  .dna-js [data-settle="after"] { opacity: 1 !important; }
  .dna-js .conn::before { transform: scaleX(1); }
  .dna-js .conn::after { transform: scale(1); opacity: 1; }
  .dna-js .widen-media { clip-path: inset(0 4% 0 4% round 0 0 28px 0); }
  .dna-js .hero-pin.is-active { height: auto; }
  .hero-cover { display: none; }
}