﻿/* LadyZone homepage */

/*
 * Typography per locale comes from `--lz-font-display` / `--lz-font-body` tokens
 * (set on html.ladyzone-locale-en + html[lang="fa|hy|ru"] in `locale-fonts.css`).
 * EN: Gilroy stack. fa/hy/ru: locale-specific stacks. Feature CSS just uses the tokens.
 */
body.ladyzone-route-home {
  --lz-chrome-z: 10050;
  background: var(--lz-paper, #f4f1ec);
  color: var(--lz-ink, #0a0a0a);
  font-family: var(--lz-font-body);
}

.page-home {
  --lz-ink: #0a0a0a;
  --lz-paper: #f4f1ec;
  --lz-accent: var(--ladyzone-brand);
  --lz-muted: #5c5c5c;
  --lz-left-pad: clamp(1.25rem, 4vw, 3.5rem);
  --lz-col-gap: clamp(1rem, 3vw, 2.5rem);
  --lz-home-main-ratio: 0.8;
  background: var(--lz-paper);
  color: var(--lz-ink);
  font-family: var(--lz-font-body);
}

body.ladyzone-route-home .page-home :where(h1, h2, h3, .heading) {
  font-family: var(--lz-font-display);
}

body.ladyzone-route-home .tpl-site-header .lz-header__bar,
body.ladyzone-route-home .tpl-site-header .lz-header__bar a {
  font-family: var(--lz-font-body);
}

/* --- Two columns until contact form --- */
.lz-home-columns {
  --lz-home-columns-pad-bottom: clamp(5rem, 11vw, 7.5rem);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  overflow-x: clip;
  container-type: inline-size;
  container-name: lz-home;
}

@media (min-width: 900px) {
  .lz-home-columns {
    grid-template-columns: minmax(0, 80%) 20%;
    align-items: stretch;
    overflow: visible;
  }

  .lz-home-columns__left {
    z-index: 2;
  }

  .lz-home-rail {
    z-index: 1;
  }
}

/* Junction teaser — shared ring text: layout/teaser-ring.css
 *
 * The ring lives at the boundary between the home columns and the next
 * section. Single source of truth (mobile-first):
 *   - Position of the junction point: small = (left: 0, bottom: 0) of the
 *     home columns (i.e. the most-left edge of the horizontal junction with
 *     the classes section below); large = (left: 80%, bottom: 0) which is
 *     the vertical 80/20 column boundary.
 *   - The teaser circle is then centered ON that point via
 *     `transform: translate(-50%, -50%)` — same rule for both breakpoints.
 *
 * `[data-ladyzone-home-columns]` needs `position: relative` always so the
 * absolute junction can anchor on it at every viewport.
 */
[data-ladyzone-home-columns] {
  position: relative;
}

.lz-column-junction {
  display: none;
}

[data-ladyzone-home-columns] .lz-column-junction {
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 30;
  width: 0;
  height: 0;
  overflow: visible;
  pointer-events: none;
}

[data-ladyzone-home-columns] .lz-column-junction > .lz-teaser-circle {
  --lz-teaser-size: clamp(8rem, 24vw, 11rem);
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  width: var(--lz-teaser-size);
  height: var(--lz-teaser-size);
  color: var(--ladyzone-brand, #ea098d);
  transform: translate(-50%, -50%);
}

@media (min-width: 900px) {
  [data-ladyzone-home-columns] .lz-column-junction {
    left: 80%;
  }

  [data-ladyzone-home-columns] .lz-column-junction > .lz-teaser-circle {
    --lz-teaser-size: 11rem;
  }
}

@media (min-width: 992px) {
  [data-ladyzone-home-columns] .lz-column-junction > .lz-teaser-circle {
    --lz-teaser-size: 14.5rem;
  }
}

.lz-home-columns__left {
  position: relative;
  min-width: 0;
  overflow: visible;
  /*
   * Always a stacking context — single source of truth for how the hero
   * title (z=3), intro video (z=2), and intro block (z=3) layer against
   * each other. Without this, the ≥ 900px `z-index: 2` rule created the
   * context only on wide screens, so on small screens the z-indices
   * escaped to the .lz-home-columns container and the title could land
   * behind the video in browsers that promote the video's stacking sooner.
   * `isolation: isolate` makes the context without committing to a z value,
   * so the big-screen `z-index: 2` (which still positions us above the
   * rail) keeps working unchanged.
   */
  isolation: isolate;
}

.lz-home-columns__inner {
  padding: 0 var(--lz-left-pad) var(--lz-home-columns-pad-bottom);
}

/* Upper block: left column ends after about section (offset sits outside __inner) */
.lz-home-columns:not(.lz-home-columns--classes):not(.lz-home-columns--lead) > .lz-home-columns__left {
  padding-bottom: var(--lz-home-columns-pad-bottom);
}

@media (min-width: 900px) {
  .lz-home-columns > .lz-home-rail,
  .lz-home-columns--classes > .lz-classes-band__rail,
  .lz-home-columns--lead > .lz-lead__rail {
    padding-bottom: var(--lz-home-columns-pad-bottom);
  }
}

/* Header: fixed chrome — direct child of main so z-index is not trapped by .lz-home-columns__left (z-index: 2). */
.page-home > .tpl-site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--lz-chrome-z);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  /* Page paints under the notch (viewport-fit=cover); push the chrome's
   * interactive content (logo, menu) below the safe-area top so it isn't
   * occluded by the notch / Dynamic Island on iOS. */
  padding: env(safe-area-inset-top, 0px) 0 0;
  background: transparent;
  border: 0;
  pointer-events: none;
}

.lz-header__chrome {
  position: relative;
  z-index: 1;
  isolation: isolate;
  overflow: hidden;
  pointer-events: auto;
  box-sizing: border-box;
  width: max-content;
  max-width: calc(100% - (var(--lz-header-menu-margin-inline) * 2));
  margin: var(--lz-header-menu-margin-block) var(--lz-header-menu-margin-inline);
  border: 0;
  border-radius: var(--lz-header-menu-radius);
  background: none;
  color: var(--lz-ink);
  /* Width expand/collapse: CSS only (interpolate-size + is-open); no JS FLIP */
  transition: width var(--lz-menu-hide-dur) var(--lz-menu-ease);
}

.lz-header__chrome.is-open {
  width: var(--lz-header-menu-open-width);
  max-width: var(--lz-header-menu-open-width);
  align-self: flex-start;
  transition: width var(--lz-menu-chrome-dur) var(--lz-menu-ease);
  /*
   * Open-state radius — soft rounded rectangle (matches the wide desktop pill
   * and avoids the stadium / half-circle look the closed-state pill token
   * would produce on a tall narrow menu). This is the ONLY per-state override
   * of --lz-header-menu-radius in the codebase.
   *
   * Burger size / band are intentionally NOT redefined here.
   * Single source of truth for .lz-header__brand position + size lives on
   * .page-home (--lz-header-burger-size, --lz-header-logo-height, --lz-header-band).
   * Opening the menu must not resize the brand row — only the chrome grows.
   */
  --lz-header-menu-radius: clamp(1.25rem, 3.5vw, 2.5rem);
}

/*
 * Layered concrete plate — single source of truth across the project:
 *   ::before = concrete + brand border (background, painted first)
 *   ::after  = white wash             (overlay, painted on top via tree order)
 * Same arrangement is used by `.lz-btt__plate`, `.ladyzone-footer-logo-badge`,
 * and `.ladyzone-preloader__badge`. Natural CSS painting order (::before
 * before element children before ::after) handles the stacking, so no
 * per-pseudo z-index is needed — `.lz-header__bar` still wins via its
 * own `z-index: 2`.
 */
.lz-header__chrome::before {
  content: "";
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  border: var(--lz-ui-concrete-border, 3px solid var(--ladyzone-brand, #ea098d));
  border-radius: inherit;
  background-color: var(--lz-ui-concrete-base, #e8e4de);
  background-image: var(--lz-ui-concrete-bg);
  background-size: var(--lz-ui-concrete-bg-tile, clamp(18rem, 40vw, 48rem));
  background-repeat: repeat;
  background-position: center;
  background-clip: padding-box;
  pointer-events: none;
}

.lz-header__chrome::after {
  content: "";
  position: absolute;
  inset: var(--lz-ui-concrete-border-width, 3px);
  border-radius: max(0px, calc(var(--lz-header-menu-radius) - var(--lz-ui-concrete-border-width, 3px)));
  background: var(--lz-ui-concrete-wash, color-mix(in srgb, #fff 32%, transparent));
  pointer-events: none;
}

.lz-header__chrome > .lz-header__bar {
  position: relative;
  z-index: 2;
}

.lz-header__bar {
  display: grid;
  grid-template-columns: minmax(max-content, auto) minmax(0, 0fr) minmax(0, 0fr);
  column-gap: 0;
  align-items: center;
  width: 100%;
  max-width: none;
  min-height: var(--lz-header-band);
  padding: var(--lz-header-pad-block) var(--lz-header-pad-inline);
  pointer-events: auto;
  background: transparent;
  line-height: 1;
  transition:
    grid-template-columns var(--lz-menu-hide-dur) var(--lz-menu-ease),
    column-gap var(--lz-menu-hide-dur) var(--lz-menu-ease),
    min-height var(--lz-menu-hide-dur) var(--lz-menu-ease);
}

.lz-header__chrome.is-open .lz-header__bar {
  grid-template-columns: minmax(0, 1fr) minmax(0, max-content) minmax(0, 1fr);
  column-gap: clamp(0.75rem, 2vw, 1.75rem);
  transition:
    grid-template-columns var(--lz-menu-chrome-dur) var(--lz-menu-ease),
    column-gap var(--lz-menu-chrome-dur) var(--lz-menu-ease),
    min-height var(--lz-menu-chrome-dur) var(--lz-menu-ease);
}

.lz-header__brand {
  display: flex;
  align-items: center;
  gap: var(--lz-header-logo-gap);
  min-width: 0;
  grid-column: 1;
  transition: gap var(--lz-menu-hide-dur) var(--lz-menu-ease);
}

.lz-header__bar > .lz-header__brand,
.lz-header__bar > .lz-nav,
.lz-header__bar > .lz-header__langs {
  align-self: center;
  margin-block: 0;
}

.lz-header__chrome.is-open .lz-header__brand {
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
}

.lz-header__chrome.is-open .lz-header__bar .lz-nav.is-open {
  grid-column: 2;
  justify-self: center;
  width: max-content;
  max-width: 100%;
}

.lz-header__bar .lz-nav,
.lz-header__langs {
  min-width: 0;
  overflow: hidden;
}

.lz-header__chrome.is-open .lz-header__bar:not(:has(.lz-header__langs)) {
  grid-template-columns: minmax(0, 1fr) minmax(0, max-content);
}

.lz-header__chrome.is-open .lz-header__bar:not(:has(.lz-header__langs)) .lz-nav.is-open {
  grid-column: 2;
  justify-self: end;
}

/* Home page menu tokens (ref: nav + burger) */
.page-home {
  interpolate-size: allow-keywords;
  --lz-menu-ease: var(--lz-ease-out-quart);
  --lz-menu-dur: 0.8s;
  --lz-menu-chrome-dur: 0.8s;
  --lz-menu-reveal-delay: calc(var(--lz-menu-chrome-dur) * 0.3);
  --lz-menu-hide-dur: calc(var(--lz-menu-chrome-dur) * 0.28);
  --lz-menu-burger-dur: calc(var(--lz-menu-dur) * 0.5);
  --lz-menu-burger-delay: calc(var(--lz-menu-dur) * 0.5);
  --lz-menu-panel: #fafafa;
  --lz-menu-overlay: #fff;
  --lz-menu-ink: #121212;
  --lz-menu-chrome-fg: #fff;
  --lz-menu-lang-fill: #fff;
  --lz-menu-lang-stroke: #000;
  --lz-menu-lang-stroke-width: max(1.25px, 0.055em);
  --lz-chrome-z: 10050;
  --lz-header-pad-top: 1rem;
  --lz-header-pad-block: 0.85rem;
  --lz-header-pad-inline: var(--lz-header-pad-block);
  --lz-header-logo-height: 2rem;
  --lz-header-nav-cap: clamp(1.25rem, 1.85vw, 2.25rem);
  --lz-header-nav-link-size: var(--text-tpl-header-nav);
  --lz-header-burger-size: var(--lz-header-logo-height);
  --lz-header-logo-gap: 0.85rem;
  --lz-header-band: calc(var(--lz-header-burger-size) + var(--lz-header-pad-block) * 2);
  --lz-header-menu-margin-block: clamp(0.65rem, 2vw, 1.25rem);
  --lz-header-menu-margin-inline: clamp(1rem, 3.5vw, 2rem);
  --lz-header-menu-open-width: calc(100% - (var(--lz-header-menu-margin-inline) * 2));
  /*
   * Closed-state radius — pill / circle for any chrome footprint.
   * CSS auto-clamps border-radius to half the smaller dimension, so this
   * single value yields:
   *   square (burger-only, closed + scrolled) → perfect circle
   *   short pill (closed with logo)          → rounded pill ends
   * The open state overrides this token on .lz-header__chrome.is-open so the
   * expanded menu reads as a softly rounded rectangle, not a stadium.
   */
  --lz-header-menu-radius: 9999px;
  --lz-home-scroll-offset: calc(
    var(--lz-header-menu-margin-block) + var(--lz-header-band)
  );
  --lz-section-inset-y-pad: 10vw;
  --lz-about-section-pad-top: clamp(1.5rem, 4vw, 3rem);
  /*
   * Home menu scroll offsets — single source on .page-home.
   * site-chrome.js reads computed scroll-margin-top on each target (see resolveHomeSectionScrollOffsetPx).
   * Each section: structural formula + --lz-home-scroll-nudge-{id} for small tweaks (±~1rem per step).
   */
  --lz-home-scroll-nudge-step: clamp(0.75rem, 1.5vw, 1.25rem);
  --lz-home-scroll-offset-about: calc(
    var(--lz-home-scroll-offset)
    + var(--lz-section-inset-y-pad)
    - var(--lz-about-section-pad-top)
    + var(--lz-home-scroll-nudge-about)
  );
  --lz-home-scroll-nudge-about: calc(var(--lz-home-scroll-nudge-step) * 2);
  --lz-home-scroll-offset-services: calc(
    var(--lz-home-scroll-offset)
    + var(--lz-section-inset-y-pad)
    + var(--lz-home-scroll-nudge-services)
  );
  --lz-home-scroll-nudge-services: calc(var(--lz-home-scroll-nudge-step) * 2);
  --lz-classes-section-pad-top: clamp(5rem, 11vw, 7.5rem);
  --lz-home-scroll-offset-classes: calc(
    var(--lz-home-scroll-offset)
    - var(--lz-section-inset-y-pad)
    - var(--lz-classes-section-pad-top)
    + var(--lz-home-scroll-nudge-classes)
  );
  --lz-home-scroll-nudge-classes: clamp(6rem, 13vw, 10rem);
  --lz-locations-inset-section-pad-top: clamp(9.5rem, 23vw, 16.5rem);
  --lz-home-scroll-offset-locations: calc(
    var(--lz-home-scroll-offset)
    - var(--lz-locations-inset-section-pad-top)
    + var(--lz-home-scroll-nudge-locations)
  );
  --lz-home-scroll-nudge-locations: 0px;
  --lz-lead-marquee-pad-y: clamp(1.75rem, 4.5vw, 3rem);
  --lz-lead-marquee-scroll-trim: calc(
    var(--lz-lead-marquee-pad-y) * 2 + clamp(2rem, 4vw, 3rem)
  );
  --lz-home-scroll-offset-lead: calc(
    var(--lz-home-scroll-offset)
    - var(--lz-lead-marquee-scroll-trim)
    + var(--lz-home-scroll-nudge-lead)
  );
  --lz-home-scroll-nudge-lead: calc(var(--lz-home-scroll-nudge-step) * 3);
  /*
   * Hero band height. Poster asset is 1440×1024 (45∶32); we cap at its native
   * height on tall viewports and scale fluidly with the viewport on shorter
   * ones — `min()` (not `max()`) so the hero never grows past either bound:
   *   - On viewports >= 1024px tall, hero = 1024px (the poster's full height).
   *   - On shorter viewports, hero = 100dvh (fills the screen exactly, never
   *     pushes content below the fold with a forced 1024px floor).
   * `--lz-hero-min-sm` is the phone-only variant; full viewport, no caps.
   */
  --lz-hero-poster-height: 1024px;
  --lz-hero-min: min(100dvh, var(--lz-hero-poster-height));
  --lz-hero-min-sm: 100dvh;
}

/* Scroll targets: each `--lz-home-scroll-offset-{id}` on .page-home; tweak only `--lz-home-scroll-nudge-{id}`. */
.page-home :is(
  section[id]:not(#hero):not(#about):not(#locations),
  .lz-home-columns[id]:not(#classes):not(#lead),
  .lz-services[id]:not(#services)
) {
  scroll-margin-top: var(--lz-home-scroll-offset);
}

.page-home section#about {
  scroll-margin-top: var(--lz-home-scroll-offset-about);
}

.page-home #services {
  scroll-margin-top: var(--lz-home-scroll-offset-services);
}

.page-home #classes {
  scroll-margin-top: var(--lz-home-scroll-offset-classes);
}

.page-home section#locations {
  scroll-margin-top: var(--lz-home-scroll-offset-locations);
}

.page-home #lead {
  scroll-margin-top: var(--lz-home-scroll-offset-lead);
}

@media (min-width: 1000px) {
  .page-home {
    --lz-locations-inset-section-pad-top: clamp(9.5rem, 12.5vw, 13.5rem);
    --lz-locations-inset-section-pad-bottom: 9rem;
  }
}

@media (min-width: 900px) {
  .page-home {
    /* Open menu spans main column only — same inset from viewport left and rail edge */
    --lz-header-menu-open-width: calc(
      var(--lz-home-main-ratio) * 100% - (var(--lz-header-menu-margin-inline) * 2)
    );
  }
}

@media (min-width: 1200px) {
  .page-home {
    --lz-header-nav-cap: clamp(1.5rem, 2vw, 2.75rem);
    --lz-header-nav-link-size: var(--text-tpl-header-nav-lg);
  }
}

.list-unstyled {
  /* Logical inline padding so the reset works in both LTR and RTL
     (browser default for <ul> is padding-inline-start: 40px, which would
     otherwise leak as padding-right in RTL and push flex content off-center). */
  padding-inline: 0;
  margin-bottom: 0;
  list-style: none;
}

/* Burger + logo live in the sticky header bar */
.lz-header__menu-btn {
  --menu-color: var(--lz-menu-chrome-fg);
  position: relative;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--lz-header-burger-size);
  height: var(--lz-header-burger-size);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  cursor: pointer;
  overflow: visible;
  transition:
    width var(--lz-menu-chrome-dur) var(--lz-menu-ease),
    height var(--lz-menu-chrome-dur) var(--lz-menu-ease);
}

.lz-header__menu-btn:focus-visible {
  outline: 2px solid var(--lz-accent);
  outline-offset: 3px;
}

.lz-header__menu-btn.is-open {
  background: transparent;
}

/* Two lines morph into X when .is-open */
.lz-header__burger-wrap {
  position: relative;
  display: block;
  width: calc(var(--lz-header-burger-size) * 0.65);
  height: calc(var(--lz-header-burger-size) * 0.65);
  transition:
    width var(--lz-menu-chrome-dur) var(--lz-menu-ease),
    height var(--lz-menu-chrome-dur) var(--lz-menu-ease);
}

.lz-header__burger-line {
  position: absolute;
  left: 0;
  top: 50%;
  display: block;
  width: 100%;
  height: 0.1875rem;
  margin-top: -0.09375rem;
  background-color: var(--menu-color);
  transform-origin: center;
  transition:
    transform var(--lz-menu-burger-dur) var(--lz-menu-ease),
    background-color 0.2s ease;
}

.lz-header__burger-line:first-child {
  transform: translate3d(0, -0.21875rem, 0);
}

.lz-header__burger-line:nth-child(2) {
  transform: translate3d(0, 0.21875rem, 0);
}

/* Closed → open: burger lines rotate into cross after panel starts expanding */
.lz-header__menu-btn.is-open .lz-header__burger-line {
  transition:
    transform var(--lz-menu-burger-dur) var(--lz-menu-ease) var(--lz-menu-burger-delay),
    background-color 0.2s ease calc(var(--lz-menu-burger-delay) - 0.05s);
}

.lz-header__menu-btn.is-open .lz-header__burger-line:first-child {
  transform: translate3d(0, 0, 0) rotate(45deg);
}

.lz-header__menu-btn.is-open .lz-header__burger-line:nth-child(2) {
  transform: translate3d(0, 0, 0) rotate(-45deg);
}

/*
 * Burger line transforms are owned by exactly two states — closed (default
 * rule above) and .is-open (X). We deliberately do NOT add a :hover transform
 * here: it would be a third source of truth and would leak after close,
 * because :hover stays active while the cursor / tap is still on the button
 * (and iOS Safari keeps it stuck until the user taps elsewhere). Result: the
 * burger reliably returns to its default two-line shape after every open/close
 * cycle, on both desktop and touch.
 */

.lz-header__logo {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 1 auto;
  min-width: 0;
  height: var(--lz-header-logo-height);
  max-width: min(36rem, calc(100vw - (var(--lz-header-pad-inline) * 2) - var(--lz-header-burger-size) - var(--lz-header-logo-gap) - (var(--lz-header-menu-margin-inline) * 2) - 1rem));
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  line-height: 0;
  opacity: 1;
  visibility: visible;
  transform: none;
  transition:
    opacity var(--lz-menu-hide-dur) var(--lz-menu-ease),
    transform var(--lz-menu-hide-dur) var(--lz-menu-ease),
    visibility 0s linear var(--lz-menu-hide-dur),
    flex-basis var(--lz-menu-hide-dur) var(--lz-menu-ease),
    width var(--lz-menu-hide-dur) var(--lz-menu-ease),
    max-width var(--lz-menu-hide-dur) var(--lz-menu-ease);
}

.lz-header__logo-img {
  display: block;
  height: 100%;
  width: auto;
  max-height: 100%;
  object-fit: contain;
  object-position: left center;
  transition: max-width var(--lz-menu-hide-dur) var(--lz-menu-ease);
}

/* After scroll (menu closed): logo slides away like nav links; chrome shrinks to burger only */
body.ladyzone-route-home.lz-header--scrolled .lz-header__chrome:not(.is-open) .lz-header__brand {
  gap: 0;
  transition: gap var(--lz-menu-chrome-dur) var(--lz-menu-ease);
}

body.ladyzone-route-home.lz-header--scrolled .lz-header__chrome:not(.is-open) .lz-header__logo {
  flex: 0 0 0;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(-101%, 0, 0);
  width: 0;
  max-width: 0;
  margin: 0;
  overflow: hidden;
  transition:
    opacity var(--lz-menu-chrome-dur) var(--lz-menu-ease),
    transform var(--lz-menu-chrome-dur) var(--lz-menu-ease),
    visibility 0s,
    flex-basis var(--lz-menu-chrome-dur) var(--lz-menu-ease),
    width var(--lz-menu-chrome-dur) var(--lz-menu-ease),
    max-width var(--lz-menu-chrome-dur) var(--lz-menu-ease);
}

body.ladyzone-route-home.lz-header--scrolled .lz-header__chrome:not(.is-open) .lz-header__logo-img {
  max-width: 0;
  transition: max-width var(--lz-menu-chrome-dur) var(--lz-menu-ease);
}

.lz-header__chrome.is-open .lz-header__logo {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: none;
  flex-shrink: 0;
  transition:
    opacity var(--lz-menu-hide-dur) var(--lz-menu-ease),
    transform var(--lz-menu-hide-dur) var(--lz-menu-ease),
    visibility 0s linear var(--lz-menu-hide-dur),
    flex-basis var(--lz-menu-hide-dur) var(--lz-menu-ease),
    width var(--lz-menu-hide-dur) var(--lz-menu-ease),
    max-width var(--lz-menu-hide-dur) var(--lz-menu-ease);
}

.lz-header__actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-left: auto;
}

/* Inline nav — grid column 2; reveal synced to 0.8s link slide */
.lz-header__bar .lz-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  align-self: center;
  grid-column: 2;
  gap: clamp(0.75rem, 2vw, 1.75rem);
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  font-weight: 700;
  line-height: 1;
  pointer-events: none;
  transition:
    opacity var(--lz-menu-hide-dur) var(--lz-menu-ease),
    visibility 0s linear var(--lz-menu-hide-dur);
}

.lz-header__bar .lz-nav.is-open {
  overflow-x: auto;
  overflow-y: hidden;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity var(--lz-menu-dur) var(--lz-menu-ease) var(--lz-menu-reveal-delay),
    visibility 0s;
  scrollbar-width: none;
}

.lz-header__langs {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  grid-column: 3;
  min-width: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity var(--lz-menu-hide-dur) var(--lz-menu-ease),
    visibility 0s linear var(--lz-menu-hide-dur);
}

.lz-header__chrome.is-open .lz-header__langs {
  justify-content: flex-end;
  width: 100%;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity var(--lz-menu-dur) var(--lz-menu-ease) var(--lz-menu-reveal-delay),
    visibility 0s;
}

.lz-header__langs .nav-sub {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: clamp(0.25rem, 0.65vw, 0.5rem);
  margin: 0;
}

.lz-header__chrome.is-open .lz-header__langs .nav-sub {
  padding: 0.35em 0.55em;
  border-radius: 999px;
  background: color-mix(in srgb, var(--lz-menu-lang-stroke) 52%, transparent);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}

.lz-header__bar .lz-nav.is-open::-webkit-scrollbar {
  display: none;
}

/* Lang rows: per-link :lang() fonts in locale-fonts.css; not inherited from panel */
.lz-nav .nav-main__link {
  font-family: var(--lz-font-display);
}

.lz-nav .nav-main {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: clamp(0.75rem, 2vw, 1.75rem);
  margin: 0;
  flex: 0 0 auto;
}

.lz-nav .nav-main__list,
.lz-header__langs .nav-sub__list {
  display: flex;
  align-items: center;
  height: 1em;
  overflow: hidden;
  letter-spacing: 0.02em;
}

.lz-nav .nav-main__list {
  font-size: var(--lz-header-nav-link-size);
  line-height: 1;
  flex-shrink: 0;
}

.lz-nav .nav-main__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 1em;
  padding-block: 0;
  color: inherit;
  text-decoration: none;
  text-transform: lowercase;
  white-space: nowrap;
  line-height: 1;
  transition:
    transform var(--lz-menu-hide-dur) var(--lz-menu-ease);
  transition-delay: 0s;
  transform: translate3d(-101%, 0, 0);
  /* Stroke + fill recipe owned by components/outline-text.css (variant: --from-fill). */
  --lz-outline-stroke-c: var(--ladyzone-brand);
  --lz-outline-text-dur: var(--lz-menu-dur);
  --lz-outline-text-ease: var(--lz-menu-ease);
}

.lz-nav.is-open .nav-main__link {
  transition:
    transform var(--lz-menu-dur) var(--lz-menu-ease);
  transform: translate3d(0, 0, 0);
}

.lz-nav.is-open .nav-main__list:nth-child(1) .nav-main__link { transition-delay: 120ms; }
.lz-nav.is-open .nav-main__list:nth-child(2) .nav-main__link { transition-delay: 160ms; }
.lz-nav.is-open .nav-main__list:nth-child(3) .nav-main__link { transition-delay: 200ms; }
.lz-nav.is-open .nav-main__list:nth-child(4) .nav-main__link { transition-delay: 240ms; }
.lz-nav.is-open .nav-main__list:nth-child(5) .nav-main__link { transition-delay: 280ms; }
.lz-nav.is-open .nav-main__list:nth-child(6) .nav-main__link { transition-delay: 320ms; }
.lz-nav.is-open .nav-main__list:nth-child(7) .nav-main__link { transition-delay: 360ms; }
.lz-nav.is-open .nav-main__list:nth-child(8) .nav-main__link { transition-delay: 400ms; }

.lz-header__langs .nav-sub__list {
  font-size: var(--text-tpl-header-lang);
  line-height: 1;
  flex-shrink: 0;
  padding: 0.08em;
}

@media (min-width: 1200px) {
  .lz-header__langs .nav-sub__list {
    font-size: var(--text-tpl-header-lang-lg);
  }
}

.lz-header__langs .nav-sub__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 1em;
  padding-block: 0;
  color: var(--lz-menu-lang-fill);
  font-weight: 600;
  text-decoration: none;
  text-transform: none;
  white-space: nowrap;
  line-height: 1;
  -webkit-text-fill-color: var(--lz-menu-lang-fill);
  -webkit-text-stroke: 0;
  transition:
    transform var(--lz-menu-hide-dur) var(--lz-menu-ease);
  transition-delay: 0s;
  transform: translate3d(-101%, 0, 0);
}

/* Black outline layer — sits behind solid white fill for crisp edges on concrete texture */
.lz-header__langs .nav-sub__link::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: visible;
  white-space: nowrap;
  content: attr(data-text);
  color: transparent;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke: var(--lz-menu-lang-stroke-width) var(--lz-menu-lang-stroke);
  paint-order: stroke fill;
  pointer-events: none;
}

.lz-header__chrome.is-open .lz-header__langs .nav-sub__link {
  transition:
    transform var(--lz-menu-dur) var(--lz-menu-ease);
  transform: translate3d(0, 0, 0);
}

.lz-header__chrome.is-open .lz-header__langs .nav-sub__list:nth-child(1) .nav-sub__link { transition-delay: 440ms; }
.lz-header__chrome.is-open .lz-header__langs .nav-sub__list:nth-child(2) .nav-sub__link { transition-delay: 480ms; }
.lz-header__chrome.is-open .lz-header__langs .nav-sub__list:nth-child(3) .nav-sub__link { transition-delay: 520ms; }
.lz-header__chrome.is-open .lz-header__langs .nav-sub__list:nth-child(4) .nav-sub__link { transition-delay: 560ms; }
.lz-header__chrome.is-open .lz-header__langs .nav-sub__list:nth-child(5) .nav-sub__link { transition-delay: 600ms; }
.lz-header__chrome.is-open .lz-header__langs .nav-sub__list:nth-child(6) .nav-sub__link { transition-delay: 640ms; }

/* Close: snap off open stagger/duration so links/langs don't outlive the chrome */
.lz-header__chrome:not(.is-open) .lz-header__bar .lz-nav,
.lz-header__chrome:not(.is-open) .lz-header__langs {
  width: 0;
  max-width: 0;
  min-width: 0;
  padding: 0;
  margin: 0;
  transition:
    opacity var(--lz-menu-hide-dur) var(--lz-menu-ease),
    visibility 0s linear var(--lz-menu-hide-dur);
}

.lz-header__chrome:not(.is-open) .lz-nav .nav-main__link,
.lz-header__chrome:not(.is-open) .lz-header__langs .nav-sub__link {
  transition:
    transform var(--lz-menu-hide-dur) var(--lz-menu-ease);
  transition-delay: 0s;
  transform: translate3d(-101%, 0, 0);
}

.lz-header__chrome:not(.is-open) .lz-nav .nav-main__link::before {
  transition-duration: var(--lz-menu-hide-dur);
}

/*
 * Mobile menu (< 900px) — open chrome stacks brand / nav / langs into rows.
 * Nav links stay in a single horizontal row that wraps onto new lines as needed,
 * so nothing overlaps the brand or the langs strip at narrow widths.
 * Desktop (≥ 900px) keeps the original brand | nav | langs three-column grid.
 * Closed state is untouched (small floating pill at top-left).
 */
@media (max-width: 899.98px) {
  /* Safety: cap open chrome to viewport and allow internal scroll on tall menus
     (many nav items, larger locale fonts) without spilling past the screen.
     Corner radius is the global pill token — no per-state override here. */
  .lz-header__chrome.is-open {
    max-height: calc(100dvh - (var(--lz-header-menu-margin-block) * 2));
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
  }

  /*
   * Open chrome: replace 3-col grid with a flex column so children take full
   * width and grow downward. The brand row keeps its closed-state dimensions
   * untouched — bar padding is the same in both states, and the brand sizes
   * itself from its content (burger + logo) via the base .lz-header__brand
   * rule, so the burger lands on the same pixel as the closed state.
   */
  .lz-header__chrome.is-open .lz-header__bar {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    column-gap: 0;
    row-gap: clamp(0.85rem, 3vw, 1.5rem);
    min-height: var(--lz-header-band);
  }

  /* Nav: full-width block; horizontal row that wraps onto new lines as needed */
  .lz-header__chrome.is-open .lz-header__bar .lz-nav.is-open {
    display: block;
    width: 100%;
    max-width: 100%;
    grid-column: auto;
    justify-self: stretch;
    overflow: visible;
  }

  .lz-header__chrome.is-open .lz-header__bar .lz-nav.is-open .nav-main {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: clamp(0.5rem, 2vw, 1rem) clamp(0.75rem, 2.5vw, 1.5rem);
    width: 100%;
  }

  .lz-header__chrome.is-open .lz-header__bar .lz-nav.is-open .nav-main__list {
    width: auto;
    height: auto;
    overflow: visible;
    flex: 0 0 auto;
  }

  .lz-header__chrome.is-open .lz-header__bar .lz-nav.is-open .nav-main__link {
    height: auto;
    padding-block: 0.2em;
  }

  /* Langs row: centered pill below the nav stack */
  .lz-header__chrome.is-open .lz-header__langs {
    width: 100%;
    justify-content: center;
    grid-column: auto;
  }

  /* "No langs" variant — keep nav full-width */
  .lz-header__chrome.is-open .lz-header__bar:not(:has(.lz-header__langs)) .lz-nav.is-open {
    justify-self: stretch;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lz-header__brand,
  .lz-header__logo,
  .lz-header__logo-img,
  .lz-header__bar,
  .lz-header__chrome,
  .lz-header__menu-btn,
  .lz-header__burger-wrap {
    transition-duration: 0.01ms !important;
    transition-delay: 0s !important;
  }

  body.ladyzone-route-home.lz-header--scrolled .lz-header__chrome:not(.is-open) .lz-header__logo {
    transform: none;
  }

  .lz-nav,
  .lz-nav .nav-main__link,
  .lz-header__langs .nav-sub__link,
  .lz-header__burger-line {
    transition-duration: 0.01ms !important;
    transition-delay: 0s !important;
  }

  .lz-header__bar .lz-nav.is-open {
    max-width: 100%;
  }

  .lz-nav.is-open .nav-main__link,
  .lz-header__chrome.is-open .lz-header__langs .nav-sub__link {
    transform: none;
  }
}

/* --- Sticky right rail: 20% width, dark fill, vertical text only () --- */
.lz-home-rail {
  display: none;
}

@media (min-width: 900px) {
  .lz-home-rail {
    display: block;
    position: relative;
    z-index: 1;
    width: 100%;
    overflow: visible;
    background: #121212;
  }

  .lz-home-rail__sticky {
    --lz-rail-title-pad-top: clamp(1.25rem, 3vh, 2.5rem);
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 100vh;
    overflow: visible;
    background: #121212;
  }

  /* Vertical copy: writing-mode (no rotate). top = Y inset, translateX = X center only. */
  .lz-home-rail__title {
    position: absolute;
    top: var(--lz-rail-title-pad-top);
    left: 50%;
    z-index: 2;
    margin: 0;
    padding: 0.06em 0;
    width: max-content;
    max-width: 100%;
    min-height: calc(100vh - var(--lz-rail-title-pad-top));
    white-space: nowrap;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: translateX(-50%);
    pointer-events: none;
    user-select: none;
  }

  .lz-home-rail__title {
    font-family: var(--lz-font-display);
  }

}

/* Shared display type: hero slogan + right-rail vertical copy (rail metrics are canonical) */
.page-home :is(.lz-home-rail__title, .lz-intro__title.lz-heading-one) {
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  text-transform: lowercase;
}

.page-home .lz-home-rail__title {
  font-size: var(--text-tpl-rail-title);
}

.page-home .lz-intro__title.lz-heading-one {
  font-size: var(--text-tpl-intro-title);
}

/* Outline display type (.type-outline) */
.page-home .lz-type-outline {
  color: transparent;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-width: 0.012em;
  paint-order: stroke fill;
}

/* Light stroke on hero (second slogan line) */
.page-home .lz-hero .lz-type-outline {
  -webkit-text-stroke-color: #fff;
}

.page-home .lz-hero .lz-intro__title__first-line {
  -webkit-text-stroke-color: var(--ladyzone-brand, #ea098d);
}

.page-home .lz-home-rail .lz-type-outline {
  -webkit-text-stroke-color: #fff;
}

/* Brand stroke on marquee */
.page-home .lz-marquee .lz-type-outline {
  -webkit-text-stroke-color: var(--ladyzone-brand, #ea098d);
}

/* --- Hero: ~1024px band like template (width = column; height = poster px, not width×ratio) --- */
.lz-hero {
  position: relative;
  width: 100%;
  min-height: var(--lz-hero-min);
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  overflow: visible;
  color: #f8f8f8;
}

/* Background fills hero from top (sits under transparent fixed header) */
.lz-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background: #0a0a0a;
}

.lz-hero__bg picture {
  position: absolute;
  inset: 0;
  display: block;
}

.lz-hero__img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 28%;
}

/* intro overlay title — absolute over poster (bg is out of flow; negative margin was clipping above hero) */
.lz-hero__intro-content {
  position: absolute;
  left: 0;
  right: 0;
  bottom: clamp(3.25rem, 26vh, 12.5rem);
  z-index: 3;
  width: 100%;
  margin: 0;
  padding: 0 var(--lz-left-pad);
  pointer-events: none;
}

.lz-text-light {
  color: #fff !important;
}

.lz-intro__title {
  position: relative;
  z-index: 10;
  margin: 0;
}

.lz-intro__title.mb-0 {
  margin-bottom: 0;
}

/* .anim-title — line reveal */
.page-home .lz-anim-title {
  position: relative;
}

.page-home .lz-anim-title__wrapper {
  position: relative;
  display: block;
  overflow: hidden;
}

/* : transition on transform + .is-shown (not keyframes) */
.page-home .lz-anim-title__inner {
  display: block;
  /*
   * `transform-style: preserve-3d` was a no-op here — this is a leaf node
   * (text only), and `will-change: transform` below already creates a
   * stacking context which per spec forces transform-style to compute to
   * `flat`. Removing it eliminates a phantom second source of truth for
   * how the title participates in 3D rendering.
   */
  will-change: transform;
  transition: transform 1s var(--lz-ease-out-quart);
}

.page-home .lz-anim-title__wrapper:first-child .lz-anim-title__inner {
  transition-delay: 150ms;
}

.page-home .lz-anim-title__wrapper:nth-child(2) .lz-anim-title__inner {
  transition-delay: 0.2s;
}

.page-home .lz-anim-title__inner--pos {
  transform: translate3d(0, 110%, 0);
}

.page-home .lz-anim-title__inner--neg {
  transform: translate3d(0, -110%, 0);
  color: #fff;
}

.page-home .lz-anim-title.is-shown .lz-anim-title__inner--pos,
.page-home .lz-anim-title.is-shown .lz-anim-title__inner--neg {
  transform: translate3d(0, 0, 0);
}

.page-home .lz-anim-title.is-shown .lz-intro__title__first-line {
  transform: translate3d(0, 0, 0);
}

.page-home .lz-anim-title.is-waapi-reveal .lz-anim-title__inner {
  transition: none !important;
}

@media (min-width: 768px) {
  .lz-hero__intro-content {
    bottom: clamp(3.75rem, 28vh, 14.5rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-home .lz-anim-title__inner {
    transition: none;
  }

  .page-home .lz-anim-title__inner--pos,
  .page-home .lz-anim-title__inner--neg {
    transform: translate3d(0, 0, 0);
  }
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 991px) {
  .lz-hero {
    min-height: var(--lz-hero-min);
  }
}

@media (max-width: 479px) {
  .lz-hero {
    min-height: var(--lz-hero-min-sm);
    width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }

  .lz-hero__img {
    object-position: center 24%;
  }
}

/* --- Intro video — overlaps hero bottom-right (tune via --lz-intro-video-*) --- */
.page-home {
  --lz-intro-video-pull-up: clamp(14rem, 32vh, 24rem);
  /* Intro teaser — 16:9; cap raised from 750px (46.875rem) */
  --lz-intro-video-width: min(75%, 56.25rem);
  --lz-intro-video-inset-right: clamp(0.75rem, 2vw, 1.5rem);
}

.lz-intro-video {
  position: relative;
  z-index: 2;
  margin-top: calc(-1 * var(--lz-intro-video-pull-up));
  padding: 0;
  pointer-events: none;
}

.lz-intro-video__frame {
  width: var(--lz-intro-video-width);
  max-width: 100%;
  margin-left: auto;
  margin-right: var(--lz-intro-video-inset-right);
  pointer-events: auto;
}

@media (max-width: 767px) {
  .page-home {
    --lz-intro-video-pull-up: clamp(8rem, 20vh, 13rem);
    --lz-intro-video-width: calc(100% - var(--lz-left-pad));
  }

  .lz-intro-video__frame {
    margin-right: var(--lz-intro-video-inset-right);
  }

  /* Park the hero title above the video band — derive the offset from
   * --lz-intro-video-pull-up so the title and the video can never share a
   * vertical strip on narrow viewports. Spatial separation > z-index fight:
   * with no overlap there is nothing for the native <video> compositor to
   * land in front of, regardless of how the WAAPI reveal commits its layers. */
  .lz-hero__intro-content {
    bottom: calc(var(--lz-intro-video-pull-up) + clamp(0.75rem, 3vh, 1.5rem));
  }
}

.lz-video-teaser {
  position: relative;
  z-index: 1;
  cursor: pointer;
  background-color: #6c757d;
}

.lz-video-teaser::before {
  display: block;
  width: 100%;
  padding-top: 56.25%;
  content: "";
}

.lz-video-teaser__inner {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lz-video-teaser__media {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.lz-video-teaser__btn {
  font-weight: 700;
  color: #fff;
  text-align: center;
  text-transform: lowercase;
  transition: opacity 0.3s ease-in-out;
  pointer-events: none;
}

.lz-video-teaser__btn-text {
  position: relative;
  display: block;
  overflow: hidden;
  color: transparent;
  text-align: center;
}

.lz-video-teaser__btn-text::before,
.lz-video-teaser__btn-text::after {
  position: absolute;
  left: 0;
  width: 100%;
  color: var(--ladyzone-brand, #ea098d);
  transition:
    transform 0.3s var(--lz-ease-out-quart),
    color 0.25s ease-in-out;
}

.lz-video-teaser__btn-text::before {
  content: attr(data-text-play);
  transform: translate3d(0, 0, 0);
}

.lz-video-teaser__btn-text::after {
  content: attr(data-text-pause);
  transform: translate3d(0, 100%, 0);
}

.lz-video-teaser__btn-text.is-playing::before {
  transform: translate3d(0, -100%, 0);
}

.lz-video-teaser__btn-text.is-playing::after {
  transform: translate3d(0, 0, 0);
}

.lz-video-teaser:hover .lz-video-teaser__btn-text::before,
.lz-video-teaser:hover .lz-video-teaser__btn-text::after {
  color: var(--ladyzone-brand, #ea098d);
}

.lz-video-teaser.is-playing .lz-video-teaser__btn {
  animation: lz-video-teaser-btn-fade-out 0.3s linear 0.3s forwards;
}

.lz-video-teaser.is-playing:hover .lz-video-teaser__btn {
  animation: lz-video-teaser-btn-fade-in 0.3s linear forwards;
}

@keyframes lz-video-teaser-btn-fade-out {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes lz-video-teaser-btn-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.lz-video-teaser:focus-visible {
  outline: 2px solid var(--lz-accent);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .lz-video-teaser.is-playing .lz-video-teaser__btn,
  .lz-video-teaser.is-playing:hover .lz-video-teaser__btn {
    animation: none;
    opacity: 1;
  }

  .lz-video-teaser__btn-text,
  .lz-video-teaser__btn-text::before,
  .lz-video-teaser__btn-text::after {
    transition: none;
  }
}

/* --- Intro block (`.block-text` after hero video) --- */
.lz-intro-block {
  position: relative;
  z-index: 3;
  padding: 0 var(--lz-left-pad);
  pointer-events: none;
}

.lz-block-text {
  position: relative;
  z-index: 10;
  /* Mobile: wider so the block doesn't read as a narrow column on phones;
   * desktop reverts to the 58.3% template width inside the min-width MQ. */
  max-width: min(85%, 44rem);
  padding: 1.875rem;
  background-color: #fff;
  pointer-events: auto;
}

.lz-block-text::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: -1;
  height: 6.25rem;
  content: "";
}

/* Mobile: smaller pull-up so the block sits lower under the prior section;
 * desktop keeps the full -7.5rem overlap inside the min-width MQ below. */
.lz-block-text--offset {
  margin-top: -2rem;
}

.lz-block-text__title {
  margin: 0 0 0.75rem;
  font-size: var(--text-tpl-intro-block-title);
  font-weight: 800;
  line-height: 1.2;
  text-transform: none;
}

.lz-block-text__body {
  margin: 0;
  font-size: var(--text-tpl-body-md);
  line-height: 1.55;
  color: var(--lz-ink);
}

.lz-block-text__body p {
  margin: 0;
}

.lz-anim-fade {
  opacity: 0;
  transform: translate3d(0, 1.25rem, 0);
  transition:
    opacity 0.55s var(--lz-menu-ease, ease),
    transform 0.55s var(--lz-menu-ease, ease);
}

.lz-anim-fade.is-shown {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.lz-block-text__body.lz-anim-fade {
  transition-delay: 0.12s;
}

@media (min-width: 768px) {
  .lz-block-text {
    max-width: min(58.333333%, 44rem);
  }

  .lz-block-text::before {
    height: 7.5rem;
  }

  .lz-block-text--offset {
    margin-top: -7.5rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lz-anim-fade {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* --- Marquee (.marquee + .type-outline; spans main+rail over pink bar at 900px+) --- */
.lz-marquee {
  position: relative;
  z-index: 5;
  left: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  white-space: nowrap;
  background: transparent;
  padding: clamp(3rem, 8vw, 5.5rem) 0;
  pointer-events: none;
  user-select: none;
}

.lz-marquee__track {
  display: inline-flex;
  align-items: center;
  width: max-content;
  gap: clamp(2.5rem, 8vw, 6rem);
  animation: lz-marquee-scroll 50s linear infinite;
}

.lz-marquee__item {
  margin: 0;
  font-family: var(--lz-font-display);
  font-size: var(--text-tpl-marquee-item);
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  text-transform: lowercase;
}

@keyframes lz-marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .lz-marquee__track {
    animation: none;
    flex-wrap: wrap;
    justify-content: center;
    width: auto;
    max-width: 100%;
    white-space: normal;
  }
}

/* --- Section inset (.section-inset-y) --- */
.lz-section-inset-y {
  padding-top: var(--lz-section-inset-y-pad, 10vw);
  padding-bottom: 10vw;
}

/* --- About (.section-index row + container-offset image) --- */
.lz-about.lz-section-inset-y {
  padding-top: var(--lz-about-section-pad-top);
}

.lz-about {
  position: relative;
  z-index: 1;
  max-width: none;
}

.lz-about__article {
  width: 100%;
}

.lz-about__row {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
}

.lz-about__col {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
  min-width: 0;
}

@media (max-width: 767px) {
  .lz-about__col--text {
    margin-top: 0;
  }
}

.lz-about__title {
  margin: 0;
  font-size: var(--text-tpl-about-title);
  font-weight: 800;
  line-height: 1.12;
  text-transform: none;
}

.page-home .lz-about .lz-anim-title__wrapper:nth-child(3) .lz-anim-title__inner {
  transition-delay: 0.25s;
}

.page-home .lz-about .lz-anim-title__wrapper:nth-child(4) .lz-anim-title__inner {
  transition-delay: 0.3s;
}

.lz-about__text {
  margin: 0;
  font-size: var(--text-tpl-body-md);
  line-height: 1.6;
  color: var(--lz-muted);
}

.lz-about__text.lz-el-inset-t {
  padding-top: 0;
}

.lz-about__offset {
  width: 100%;
  overflow: visible;
}

.lz-about__offset-row {
  position: relative;
  z-index: 5;
  left: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: end;
  gap: clamp(1.5rem, 4vw, 2.5rem);
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  margin: clamp(2rem, 5vw, 3.5rem) 0 0;
  overflow: visible;
}

.lz-about__offset-col--services {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  min-width: 0;
  box-sizing: border-box;
  padding-left: var(--lz-left-pad);
  padding-right: var(--lz-left-pad);
  overflow: visible;
}

.lz-about__offset-col--media {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: stretch;
  min-width: 0;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  padding-top: clamp(1rem, 3vw, 2rem);
  padding-bottom: 0;
  padding-inline: clamp(2rem, 7vw, 4rem);
  position: relative;
  z-index: 2;
  overflow: visible;
}

/*
 * Ring sits on offset row (not inside bottom-aligned .lz-services).
 *
 * Anchor side is a design exception: < 768px the ring sits on the RIGHT
 * (so it doesn't collide with the heading column on narrow widths), ≥ 768px
 * it sits on the LEFT (the canonical placement that pairs with the
 * services + portrait grid).
 *
 * The position + pull-x are the single source of truth per breakpoint —
 * declared once in the base rule (small) and once in the ≥ 768px override
 * (wide). Pull-y is identical for both sides, so it's declared once below
 * and only re-tuned in the wide breakpoint.
 */
.lz-about__services-ring {
  --lz-services-ring-size: clamp(10rem, 26vw, 13.5rem);
  position: absolute;
  z-index: 4;
  top: 0;
  right: var(--lz-left-pad);
  width: var(--lz-services-ring-size);
  height: var(--lz-services-ring-size);
  margin: 0;
  color: var(--ladyzone-brand, #ea098d);
  pointer-events: none;
  transform: translate(clamp(4rem, 16vw, 6.5rem), clamp(-13rem, -32vw, -8.5rem));
}

.lz-about__offset .lz-services {
  padding: 0;
  max-width: none;
}

.lz-about__offset .lz-services__heading {
  margin: 0 0 clamp(1rem, 2.5vw, 1.5rem);
  font-size: var(--text-tpl-services-heading);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: 0;
  text-transform: none;
  color: var(--lz-ink);
}

.lz-about__offset .lz-services__heading {
  font-family: var(--lz-font-display);
}

.lz-about__figure {
  margin: 0;
  width: 100%;
  max-width: 100%;
  overflow: visible;
  align-self: stretch;
}

/* About-section service portrait — click-to-select, opacity crossfade (-menu-ease) */
.lz-about__portrait {
  position: relative;
  width: 100%;
  max-width: 100%;
  aspect-ratio: 570 / 770;
  overflow: hidden;
  background-color: var(--lz-paper, #f4f1ec);
}

.lz-about__portrait .lz-about__img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: cover;
  object-position: center center;
  opacity: 0;
  transition: opacity 0.8s var(--lz-menu-ease, var(--lz-ease-out-quart));
  pointer-events: none;
}

.lz-about__portrait .lz-about__img.is-visible {
  opacity: 1;
}

@media (min-width: 768px) {
  .lz-about__col--title {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
    margin-left: 16.666667%;
  }

  .lz-about__col--text {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    margin-left: 8.333333%;
  }

  .lz-about__offset-row {
    margin-top: clamp(2.5rem, 6vw, 4rem);
    /* Services wider than portrait (≈58% / 42%); columns share row height, content at bottom */
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
    align-items: end;
    gap: clamp(1rem, 3vw, 2rem);
  }

  .lz-about__offset-col--services {
    padding-right: clamp(1rem, 3vw, 2rem);
  }

  .lz-about__services-ring {
    /* Wide breakpoint reverts to the canonical left-anchored placement */
    right: auto;
    left: var(--lz-left-pad);
    transform: translate(clamp(-7.5rem, -18vw, -5rem), clamp(-10rem, -24vw, -7rem));
  }

  .lz-about__offset-col--media {
    padding-top: clamp(1.25rem, 3vw, 2.5rem);
    padding-bottom: 0;
    padding-inline: clamp(2.5rem, 8vw, 5.5rem);
  }
}

@media (min-width: 900px) {
  /*
   * Extend into the 20% rail from the 80% main column — no 100vw/125% (scrollbar overflow).
   * Cap with container query width (lz-home-columns), not layout viewport units.
   */
  .lz-home-columns__left > .lz-marquee {
    width: calc(100% / var(--lz-home-main-ratio));
    max-width: none;
  }

  .lz-about__offset-row {
    width: calc(100% / var(--lz-home-main-ratio));
    max-width: none;
    overflow: visible;
  }

  .lz-about__offset-col--services {
    padding-left: var(--lz-left-pad);
  }

  .lz-about__offset-col--media {
    padding-inline: clamp(3rem, 9vw, 6rem);
  }
}

/* --- Services list (about-section offset) --- */
.lz-services {
  padding: clamp(2rem, 5vw, 4rem) 0;
  max-width: 36rem;
}

.lz-services__teaser-ring {
  --lz-services-ring-size: clamp(8rem, 20vw, 11rem);
  width: var(--lz-services-ring-size);
  height: var(--lz-services-ring-size);
  margin: 0 0 clamp(1rem, 2.5vw, 1.5rem);
  color: var(--ladyzone-brand, #ea098d);
  pointer-events: none;
}

.lz-services__heading {
  font-size: var(--text-tpl-eyebrow);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin: 0 0 1rem;
}

.lz-service-list {
  margin: 0;
  padding: 0;
}

.lz-service-list__item {
  position: relative;
  overflow: hidden;
  line-height: 1.2;
}

.lz-service-list__link {
  display: block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  text-align: inherit;
  font-size: var(--text-tpl-services-link);
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
  color: transparent;
  /* Stroke + fill recipe owned by components/outline-text.css. */
  --lz-outline-stroke-c: var(--lz-ink, #121212);
  transition: transform 1s var(--lz-ease-out-quart);
  transform: translate3d(0, 101%, 0);
}

.lz-service-list--ink .lz-service-list__link {
  --lz-outline-stroke-c: var(--ladyzone-brand, #ea098d);
}

.lz-service-list__link--static {
  cursor: default;
  pointer-events: none;
}

.lz-service-list__link:focus {
  outline: none;
}

.lz-service-list__link:focus-visible {
  outline: 2px solid var(--lz-accent);
  outline-offset: 0.15em;
}

.lz-service-list.is-shown .lz-service-list__link,
[data-lz-outline-text-reveal].is-shown .lz-service-list__link {
  transform: translate3d(0, 0, 0);
}

.lz-service-list__item:nth-child(1) .lz-service-list__link { transition-delay: 150ms; }
.lz-service-list__item:nth-child(2) .lz-service-list__link { transition-delay: 0.2s; }
.lz-service-list__item:nth-child(3) .lz-service-list__link { transition-delay: 0.25s; }
.lz-service-list__item:nth-child(4) .lz-service-list__link { transition-delay: 0.3s; }
.lz-service-list__item:nth-child(5) .lz-service-list__link { transition-delay: 0.35s; }
.lz-service-list__item:nth-child(6) .lz-service-list__link { transition-delay: 0.4s; }

.lz-service-list__link {
  font-family: var(--lz-font-display);
}

@media (prefers-reduced-motion: reduce) {
  /* Stroke/fill always-on state handled by components/outline-text.css. */
  .lz-service-list__link {
    transform: none;
    transition: none;
  }

  .lz-about__portrait .lz-about__img {
    transition: none;
    opacity: 1;
  }
}


/* --- Classes band — dark main column (left), white right rail (same 80/20 grid as hero) --- */
.lz-home-columns--classes {
  --lz-home-columns-pad-top: var(--lz-classes-section-pad-top);
  --lz-home-columns-pad-bottom: clamp(3.5rem, 7.5vw, 5.5rem);
  background: #121212;
  overflow: visible;
  /* Size containment on `.lz-home-columns` clips paint past the 80% column — disable here. */
  container-type: normal;
}

.lz-home-columns--classes .lz-home-columns__inner {
  padding: var(--lz-home-columns-pad-top) var(--lz-left-pad) var(--lz-home-columns-pad-bottom);
}

@media (min-width: 900px) {
  .lz-home-columns--classes > .lz-classes-band__rail {
    padding-top: var(--lz-home-columns-pad-top);
  }
}

@media (min-width: 900px) {
  .lz-home-columns--classes .lz-classes-band__panel {
    z-index: 2;
    overflow: visible;
  }

  .lz-home-columns--classes .lz-classes-band__rail {
    z-index: 1;
  }

  .lz-home-columns--classes .lz-home-columns__inner {
    overflow: visible;
  }
}

.lz-classes-band__rail,
.lz-lead__rail {
  display: none;
}

@media (min-width: 900px) {
  .lz-classes-band__rail,
  .lz-lead__rail {
    display: block;
    position: relative;
    overflow: visible;
    background: #fff;
  }

  .lz-classes-band__rail-sticky {
    --lz-rail-title-pad-top: clamp(1.25rem, 3vh, 2.5rem);
    position: sticky;
    top: 0;
    height: 100vh;
    min-height: 100vh;
    overflow: visible;
  }

  .lz-lead__rail-sticky {
    position: sticky;
    top: 0;
    height: 100%;
    min-height: 0;
    overflow: visible;
  }

  .lz-classes-band__rail-title,
  .lz-lead__rail-title {
    position: absolute;
    top: var(--lz-rail-title-pad-top);
    left: 50%;
    z-index: 2;
    margin: 0;
    padding: 0.06em 0;
    width: max-content;
    max-width: 100%;
    min-height: calc(100vh - var(--lz-rail-title-pad-top));
    white-space: nowrap;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: translateX(-50%);
    pointer-events: none;
    user-select: none;
    font-size: var(--text-tpl-rail-title);
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0;
    text-transform: lowercase;
    -webkit-text-stroke-color: var(--ladyzone-brand, #ea098d);
  }

  .lz-classes-band__rail-title,
  .lz-lead__rail-title {
    font-family: var(--lz-font-display);
  }

  .lz-lead__rail-ring.lz-teaser-circle {
    position: absolute;
    right: 0;
    bottom: calc(var(--lz-home-columns-pad-bottom, 3rem) * -0.5);
    left: auto;
    top: auto;
    transform: translate(50%, 50%);
    --lz-teaser-size: clamp(7.5rem, 12vw, 10rem);
    color: var(--ladyzone-brand, #ea098d);
    pointer-events: none;
  }
}

@media (min-width: 992px) {
  .lz-lead__rail-ring.lz-teaser-circle {
    --lz-teaser-size: clamp(9rem, 14vw, 12rem);
  }
}

.lz-classes-band.lz-section-inset-y {
  padding-bottom: 3.5vw;
}

.lz-classes-band {
  overflow: visible;
}

.lz-classes-band__panel {
  background: #121212;
  color: #fff;
  min-width: 0;
  overflow: visible;
}

.lz-classes-band__body {
  width: 100%;
  max-width: none;
}

@media (min-width: 900px) {
  /* Shift full block right; use full column width so cards can paint over the white rail. */
  .lz-classes-band__body {
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
    transform: translateX(clamp(2rem, 6vw, 5rem));
  }
}

.lz-classes-band__eyebrow {
  margin: 0 0 0.75rem;
  font-size: var(--text-tpl-eyebrow);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
}

.lz-classes-band__heading {
  margin: 0 0 1.25rem;
  font-size: var(--text-tpl-classes-heading);
  font-weight: 700;
  line-height: 0.95;
  letter-spacing: -0.04em;
  text-transform: lowercase;
  color: #fff;
  -webkit-text-fill-color: #fff;
  -webkit-text-stroke: 0;
}

.lz-classes-band__heading {
  font-family: var(--lz-font-display);
}

.lz-classes-band__intro {
  max-width: 42rem;
  margin: 0 0 clamp(2rem, 5vw, 3.5rem);
  font-size: var(--text-tpl-body-md);
  line-height: 1.65;
  color: #fff;
}

.lz-classes-band__panel .lz-classes-band__heading,
.lz-classes-band__panel .lz-classes-band__intro {
  color: #fff;
}

.lz-classes-band__panel .lz-classes-band__intro.is-shown {
  color: #fff;
}

.lz-classes-band__list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 0;
  row-gap: clamp(3.5rem, 7vw, 5.5rem);
  width: 100%;
}

@media (max-width: 639px) {
  .lz-classes-band__list {
    grid-template-columns: 1fr;
  }
}

.lz-class-card {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  min-height: clamp(9.5rem, 18vw, 15.5rem);
  padding: 1.25rem 1.5rem;
  overflow: hidden;
  background-color: var(--lz-menu-panel, #fafafa);
  background-image: var(--lz-ui-concrete-bg);
  background-size: cover;
  background-position: center;
  color: #fff;
}

.lz-class-card--light {
  background-color: #fff;
  background-image: none;
  color: var(--lz-ink, #121212);
}

.lz-class-card__visual {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: auto;
  display: flex;
  justify-content: flex-end;
  align-items: stretch;
  box-sizing: border-box;
  width: min(52%, 14rem);
  height: 100%;
  margin: 0;
  padding: 0.75rem 1.25rem 0.75rem 0;
  z-index: 0;
  pointer-events: none;
  transition: transform 0.8s var(--lz-ease-out-quart);
}

.lz-class-card__visual img {
  display: block;
  box-sizing: border-box;
  width: auto;
  max-width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: right center;
}

.lz-class-card__titles {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: 0.15em;
  line-height: 1;
}

.lz-class-card__title {
  position: relative;
  display: inline-block;
  font-weight: 700;
  text-transform: lowercase;
  transition: transform 0.8s var(--lz-ease-out-quart);
}

.lz-class-card__title--meta {
  font-size: var(--text-tpl-class-card-meta);
  color: #fff;
  -webkit-text-fill-color: #fff;
}

.lz-class-card__title--name {
  font-size: var(--text-tpl-class-card-name);
  color: #fff;
  -webkit-text-stroke: 0.015em #fff;
  -webkit-text-fill-color: transparent;
  transform: translate3d(0, 100%, 0);
}

.lz-class-card__title--name.lz-class-card__title--stacked {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.08em;
}

.lz-class-card__title--stacked::before {
  display: none;
}

.lz-class-card__title-line {
  display: block;
  line-height: 1;
  color: #fff;
  -webkit-text-stroke: 0.015em #fff;
  -webkit-text-fill-color: transparent;
  transition: -webkit-text-fill-color 0.8s var(--lz-ease-out-quart);
}

.lz-class-card--light .lz-class-card__title-line {
  color: var(--ladyzone-brand, #ea098d);
  -webkit-text-stroke: 0.015em var(--ladyzone-brand, #ea098d);
}

.lz-class-card:hover .lz-class-card__title--stacked .lz-class-card__title-line,
.lz-class-card:focus-within .lz-class-card__title--stacked .lz-class-card__title-line {
  -webkit-text-fill-color: #fff;
}

.lz-class-card--light:hover .lz-class-card__title--stacked .lz-class-card__title-line,
.lz-class-card--light:focus-within .lz-class-card__title--stacked .lz-class-card__title-line {
  -webkit-text-fill-color: var(--ladyzone-brand, #ea098d);
}

/* Shared geometry/animation: components/outline-text.css */
.lz-class-card__title::before {
  -webkit-text-fill-color: #fff;
}

.lz-class-card--light .lz-class-card__title--meta {
  color: var(--ladyzone-brand, #ea098d);
  -webkit-text-fill-color: var(--ladyzone-brand, #ea098d);
}

.lz-class-card--light .lz-class-card__title--name {
  color: var(--ladyzone-brand, #ea098d);
  -webkit-text-stroke: 0.015em var(--ladyzone-brand, #ea098d);
}

.lz-class-card--light .lz-class-card__title::before {
  -webkit-text-fill-color: var(--ladyzone-brand, #ea098d);
}

/* Delegate hover from card to its outline-text titles (component owns the animation) */
.lz-class-card:hover .lz-outline-text-reveal::before,
.lz-class-card:focus-within .lz-outline-text-reveal::before {
  clip-path: var(--lz-outline-text-active);
}

.lz-class-card.is-shown .lz-class-card__title--name {
  transform: translate3d(0, 0, 0);
}

.lz-class-card:hover .lz-class-card__visual,
.lz-class-card:focus-within .lz-class-card__visual {
  transform: scale(1.03);
}

.lz-class-card__title {
  font-family: var(--lz-font-display);
}

@media (prefers-reduced-motion: reduce) {
  .lz-class-card__title,
  .lz-class-card__title--name,
  .lz-class-card__visual {
    transition: none;
    transform: none;
  }

  .lz-class-card__title--name {
    -webkit-text-fill-color: #fff;
  }

  .lz-class-card__title--stacked .lz-class-card__title-line {
    -webkit-text-fill-color: #fff;
    -webkit-text-stroke: 0;
  }

  .lz-class-card--light .lz-class-card__title--name {
    -webkit-text-fill-color: var(--ladyzone-brand, #ea098d);
  }

  .lz-class-card--light .lz-class-card__title-line {
    -webkit-text-fill-color: var(--ladyzone-brand, #ea098d);
    -webkit-text-stroke: 0;
  }

  .lz-class-card__title::before {
    display: none;
  }
}

/* --- Locations inset (: container > row > col > image-wrapper > portrait + map) --- */
.lz-locations-inset.lz-section-inset-y {
  padding-top: var(--lz-locations-inset-section-pad-top);
  padding-bottom: var(--lz-locations-inset-section-pad-bottom);
}

.lz-locations-inset {
  --lz-locations-inset-section-pad-bottom: clamp(4.5rem, 14vw, 11rem);
  --lz-locations-inset-portrait-width: 85%;
  --lz-locations-inset-portrait-ratio: 3 / 4;
  --lz-locations-inset-map-width: 82%;
  --lz-locations-inset-map-shift: 1.25rem;
  --lz-locations-inset-portrait-offset-top: 4.6875rem;
  --lz-locations-inset-headline-align-y: var(--lz-locations-inset-portrait-offset-top);
  --lz-locations-inset-headline-nudge-y: 0px;
  --lz-locations-inset-headline-shift-x: clamp(2rem, 6vw, 4.5rem);
  --lz-locations-inset-map-row-md: -3.75rem;
  --lz-locations-inset-map-row-lg: -17.5rem;
  --lz-locations-inset-secondary-title-size: var(--text-tpl-locations-title);
  --lz-locations-inset-connector-end-offset-x: -1.5rem;
  --lz-connector-path-length: 0;
  --lz-connector-end-x: 0px;
  --lz-connector-end-y: 0px;
  --lz-connector-duration: 0.9s;
  --lz-connector-ease: cubic-bezier(0.22, 1, 0.36, 1);

  position: relative;
  padding-left: var(--lz-left-pad);
  padding-right: var(--lz-left-pad);
  overflow: visible;
  isolation: isolate;
}

.lz-locations-inset__container {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  overflow: visible;
}

.lz-locations-inset__row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}

.lz-locations-inset__col {
  flex: 0 0 100%;
  max-width: 100%;
  min-width: 0;
}

.lz-locations-inset__title {
  margin: 0 0 clamp(0.25rem, 0.75vw, 0.5rem);
  font-size: var(--lz-locations-inset-secondary-title-size, var(--text-tpl-locations-title));
  font-weight: 800;
  line-height: 1.12;
  text-transform: none;
  color: #000;
}

.lz-locations-inset__title--selected {
  color: var(--ladyzone-brand, #ea098d);
}

.page-home .lz-locations-inset__title .lz-anim-title__wrapper {
  display: block;
  white-space: nowrap;
  overflow: visible;
}

.page-home .lz-locations-inset__title .lz-anim-title__inner {
  color: var(--ladyzone-brand, #ea098d);
  -webkit-text-fill-color: var(--ladyzone-brand, #ea098d);
}

/* Headline: 2 lines only; visible overflow (no crop from anim wrappers) */
.page-home .lz-locations-inset__headline-slot .lz-intro__title .lz-anim-title__wrapper {
  display: block;
  white-space: nowrap;
  overflow: visible;
}

.page-home .lz-locations-inset__headline-slot .lz-intro__title {
  overflow: visible;
}

/* Hero-style headline on paper — line 1 outline, line 2 brand fill */
.page-home .lz-locations-inset .lz-intro__title.lz-heading-one .lz-anim-title__inner--pos.lz-type-outline {
  color: transparent;
  -webkit-text-fill-color: transparent;
  -webkit-text-stroke-width: 0.012em;
  -webkit-text-stroke-color: #000;
}

.page-home .lz-locations-inset .lz-intro__title.lz-heading-one .lz-anim-title__inner--neg {
  color: var(--ladyzone-brand, #ea098d);
  -webkit-text-fill-color: var(--ladyzone-brand, #ea098d);
}

.lz-locations-inset__text {
  margin: 0;
  font-size: var(--text-tpl-body-md);
  line-height: 1.6;
  color: var(--lz-muted);
}

.lz-locations-inset__address {
  margin: 0 0 clamp(0.35rem, 1vw, 0.5rem);
  color: var(--lz-ink, #0a0a0a);
}

.lz-locations-inset__address.is-hidden {
  display: none;
}

.lz-locations-inset__contact-row {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: clamp(0.35rem, 1vw, 0.5rem);
  margin: 0 0 clamp(4rem, 10vw, 7rem);
}

.lz-locations-inset__phone {
  font-size: var(--text-tpl-body-md);
  line-height: 1.2;
  color: var(--lz-ink, #0a0a0a);
  text-decoration: none;
  text-align: left;
  justify-self: start;
}

.lz-locations-inset__phone:hover {
  color: var(--ladyzone-brand, #ea098d);
}

.lz-locations-inset__phone.is-hidden {
  display: none;
}

.lz-locations-inset__phone-ltr {
  unicode-bidi: isolate;
}

.lz-locations-inset__map-link {
  font-size: var(--text-tpl-body-md);
  line-height: 1.2;
  color: var(--ladyzone-brand, #ea098d);
  text-align: left;
  justify-self: start;
  text-decoration: underline;
  text-decoration-color: currentColor;
  text-underline-offset: 0.15em;
}

.lz-locations-inset__map-link:hover {
  color: color-mix(in srgb, var(--ladyzone-brand, #ea098d) 82%, #0a0a0a);
}

.lz-locations-inset__branches {
  margin: 0;
  line-height: 1.65;
}

.lz-locations-inset__branch-link {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  font: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-align: inherit;
  cursor: pointer;
  color: var(--lz-ink, #0a0a0a);
  text-decoration: none;
}

.lz-locations-inset__branch-link:hover,
.lz-locations-inset__branch-link.is-selected {
  color: var(--ladyzone-brand, #ea098d);
  text-decoration: none;
}

.lz-locations-inset__branch-sep {
  color: var(--ladyzone-brand, #ea098d);
  user-select: none;
}

/* .image-wrapper */
.lz-locations-inset__image-wrapper {
  position: relative;
  display: flow-root;
  width: var(--lz-locations-inset-portrait-width);
  max-width: 100%;
  padding-top: var(--lz-locations-inset-portrait-offset-top);
  overflow: visible;
}

/* .image.image--y */
.lz-locations-inset__image {
  display: block;
  margin: 0;
}

.lz-locations-inset__image--y {
  width: 100%;
  overflow: hidden;
}

.lz-locations-inset__image--y img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* .portrait — offset lives on .image-wrapper (padding) so ring top matches image corner */
.lz-locations-inset__portrait {
  margin-top: 0;
  aspect-ratio: var(--lz-locations-inset-portrait-ratio);
  position: relative;
}

.lz-locations-inset__portrait [data-lz-locations-inset-portrait] {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lz-locations-inset__portrait [data-lz-locations-inset-portrait]:not(:only-child) {
  position: absolute;
  inset: 0;
}

.lz-locations-inset__map {
  width: var(--lz-locations-inset-map-width);
  max-width: 100%;
}

.lz-locations-inset__map img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 540 / 400;
  object-fit: contain;
  object-position: center;
  background: #fff;
}

.lz-locations-inset__map-stage {
  position: relative;
  width: var(--lz-locations-inset-map-width);
  max-width: 100%;
}

/* Width lives on the stage only — avoid 82% × 82% shrink from the old single-figure layout */
.lz-locations-inset__map-stage .lz-locations-inset__map {
  width: 100%;
  max-width: none;
}

.lz-locations-inset__map-pins {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.lz-locations-inset__map-pin {
  --map-pin-x: 50%;
  --map-pin-y: 50%;
  position: absolute;
  left: var(--map-pin-x);
  top: var(--map-pin-y);
  width: auto;
  height: auto;
  padding: 0;
  border: 0;
  background: transparent;
  transform: translate(-50%, -50%);
  cursor: pointer;
  pointer-events: auto;
}

.lz-locations-inset__map-pin-border {
  width: auto;
  height: auto;
  border: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.lz-locations-inset__map-pin-dot {
  --lz-map-pin-glow: color-mix(in srgb, var(--ladyzone-brand, #ea098d) 24%, transparent);
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 999px;
  display: block;
  flex-shrink: 0;
  background-color: var(--ladyzone-brand, #ea098d);
  box-shadow: 0 0 0 0.45rem var(--lz-map-pin-glow);
  transition:
    width 0.35s ease,
    height 0.35s ease,
    box-shadow 0.35s ease;
}

.lz-locations-inset__map-pin-plus,
.lz-locations-inset__map-pin-core {
  display: none;
}

.lz-locations-inset__map-pin.is-active .lz-locations-inset__map-pin-dot {
  width: 0.7rem;
  height: 0.7rem;
  box-shadow: 0 0 0 1.2rem var(--lz-map-pin-glow);
}

.lz-locations-inset__branch-panel {
  position: relative;
}

.lz-locations-inset__branch-panel-inner {
  position: relative;
  z-index: 1;
}

.lz-locations-inset__connector {
  position: absolute;
  inset: 0;
  z-index: 3;
  overflow: visible;
  pointer-events: none;
}

.lz-locations-inset__connector-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.lz-locations-inset__connector-path {
  fill: none;
  stroke: var(--ladyzone-brand, #ea098d);
  stroke-width: 1;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: var(--lz-connector-path-length, 0) var(--lz-connector-path-length, 0);
  stroke-dashoffset: var(--lz-connector-path-length, 0);
}

.lz-locations-inset.is-connector-ready .lz-locations-inset__connector-path {
  transition: stroke-dashoffset var(--lz-connector-duration) var(--lz-connector-ease);
}

.lz-locations-inset.is-line-active .lz-locations-inset__connector-path {
  stroke-dashoffset: 0;
}

.lz-locations-inset__connector-node {
  --lz-map-pin-glow: color-mix(in srgb, var(--ladyzone-brand, #ea098d) 24%, transparent);
  position: absolute;
  left: var(--lz-connector-end-x, 0);
  top: var(--lz-connector-end-y, 0);
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 999px;
  background-color: var(--ladyzone-brand, #ea098d);
  box-shadow: 0 0 0 0.45rem var(--lz-map-pin-glow);
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
}

.lz-locations-inset.is-connector-ready .lz-locations-inset__connector-node {
  transition:
    transform 0.35s var(--lz-connector-ease) var(--lz-connector-duration),
    opacity 0.35s var(--lz-connector-ease) var(--lz-connector-duration);
}

.lz-locations-inset.is-line-active .lz-locations-inset__connector-node {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

.lz-locations-inset__portrait img {
  transition: opacity 0.8s ease;
}

.lz-locations-inset__portrait img:not(.is-visible) {
  opacity: 0;
}

.lz-locations-inset__portrait img.is-visible {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .lz-locations-inset.is-line-active .lz-locations-inset__connector-path {
    stroke-dashoffset: 0;
    transition: none;
  }

  .lz-locations-inset.is-line-active .lz-locations-inset__connector-node {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
    transition: none;
  }

  .lz-locations-inset__portrait img {
    transition: none;
  }
}

/* Junction-matched ring — center pinned to the portrait's top corner,
 * outside the figure so figure's `overflow: hidden` does not clip it.
 *
 * Single source of truth (mobile-first):
 *   small (< 768px) → center on the TOP-RIGHT corner of the image wrapper
 *                     (design exception: the portrait stacks under the
 *                     headline at this breakpoint, so the ring reads better
 *                     when it hugs the right edge rather than the left)
 *   ≥ 768px         → center on the TOP-LEFT corner (default desktop look)
 * Both branches share the same vertical anchor (`--lz-locations-inset-portrait-offset-top`)
 * and the same centering technique (translate ±50% on X, -50% on Y).
 */
.lz-locations-inset__image-wrapper > .lz-teaser-circle.lz-teaser-ring {
  --lz-teaser-size: 11rem;

  position: absolute;
  right: 0;
  top: var(--lz-locations-inset-portrait-offset-top);
  z-index: 2;
  width: var(--lz-teaser-size);
  height: var(--lz-teaser-size);
  color: var(--ladyzone-brand, #ea098d);
  transform: translate(50%, -50%);
  pointer-events: none;
}

.lz-locations-inset__hide-md-down {
  display: none;
}

.lz-locations-inset__map-row {
  margin-top: 0;
}

.lz-locations-inset__sidebar {
  display: none;
}

.lz-locations-inset__sidebar--light {
  background: rgba(255, 255, 255, 0.55);
}

@media (max-width: 767.98px) {
  .lz-locations-inset {
    --lz-locations-inset-portrait-offset-top: 0;
    --lz-locations-inset-headline-align-y: 0;
    /* Stacked layout: the connector end-node sits in the gap between the
     * section's content edge and the branch-panel's left edge (see
     * `--lz-locations-inset-panel-inset` below). The negative offset slides
     * the dot well left of the title so there's clear breathing room (≈1rem)
     * between the dot's right edge and the first glyph of the heading. */
    --lz-locations-inset-connector-end-offset-x: -1.25rem;
    /* Top/bottom padding are equal on small screens — the desktop top pad
     * accommodates the headline's negative overshoot, which the stacked layout
     * removes. Single token used for both ends keeps them in lockstep. */
    --lz-locations-inset-section-pad-top: clamp(2.25rem, 8vw, 5rem);
    --lz-locations-inset-section-pad-bottom: clamp(2.25rem, 8vw, 5rem);
    /* Inset the whole branch panel (title + address + contact + branches)
     * from the section's left edge so the connector end-node has clear room
     * on the title's leading side. Keep this >= |connector-end-offset-x| so
     * the dot lands inside the cleared lane, never past the section padding. */
    --lz-locations-inset-panel-inset: clamp(2.25rem, 6vw, 3rem);
  }

  /* Small-screen layout (single source of truth):
   *   The narrow viewport collapses the two desktop rows into one CSS Grid
   *   on the container. Row wrappers and the two media columns are flattened
   *   with `display: contents`, which promotes the headline column, the
   *   image-wrapper, the map-stage, and the branch-panel column to direct
   *   grid items of the container. The image-wrapper and map-stage share
   *   the same "stack" cell so the map (with pins) overlays the location
   *   portrait — the small-screen counterpart of the desktop negative-margin
   *   overlap (`--lz-locations-inset-map-row-md/-lg`). */
  .lz-locations-inset__container {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "headline"
      "stack"
      "panel";
    row-gap: clamp(2.75rem, 9vw, 4.5rem);
  }

  .lz-locations-inset__row--main,
  .lz-locations-inset__row.lz-locations-inset__map-row,
  .lz-locations-inset__col--main-media,
  .lz-locations-inset__hide-md-down {
    display: contents;
  }

  .lz-locations-inset__col--main-right {
    grid-area: headline;
    transform: none;
    padding-top: 0;
  }

  .lz-locations-inset__headline-slot {
    transform: none;
    margin: 0 0 1.25rem;
  }

  .lz-locations-inset__image-wrapper {
    grid-area: stack;
    padding-top: 0;
    z-index: 1;
  }

  .lz-locations-inset__portrait {
    margin-bottom: 0;
  }

  .lz-locations-inset__map-stage {
    grid-area: stack;
    align-self: end;
    justify-self: end;
    width: var(--lz-locations-inset-portrait-width);
    margin: 0;
    z-index: 2;
    transform: translateY(clamp(2rem, 7vw, 3.5rem));
  }

  .lz-locations-inset__map-row .lz-locations-inset__col-md-4 {
    grid-area: panel;
    margin-top: clamp(1.5rem, 4vw, 2.5rem);
    padding-inline-start: var(--lz-locations-inset-panel-inset);
  }
}

@media (min-width: 768px) {
  .lz-locations-inset {
    --lz-locations-inset-portrait-offset-top: 3.75rem;
    --lz-locations-inset-headline-align-y: var(--lz-locations-inset-portrait-offset-top);
    --lz-locations-inset-headline-nudge-y: -2.5rem;
  }

  .lz-locations-inset__row--main {
    align-items: flex-start;
  }

  .lz-locations-inset__col--main-media {
    order: 1;
    overflow: visible;
  }

  /* Desktop layout puts the portrait on the left of a two-column row, so the
   * ring flips back to the top-LEFT corner (the small-screen base above pins
   * it on the right). One token swap (`right` ↔ `left`) + transform sign. */
  .lz-locations-inset__image-wrapper > .lz-teaser-circle.lz-teaser-ring {
    right: auto;
    left: 0;
    transform: translate(-50%, -50%);
  }

  /* Right stack: headline + body (normal flow — no zero-height grid clip) */
  .lz-locations-inset__col--main-right {
    order: 2;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;
    min-width: 0;
    overflow: visible;
    padding-top: var(--lz-locations-inset-headline-align-y);
    box-sizing: border-box;
  }

  .lz-locations-inset__headline-slot {
    width: max-content;
    max-width: 100%;
    margin: 0 0 0 auto;
    transform: translate(
      var(--lz-locations-inset-headline-shift-x),
      calc(-50% + var(--lz-locations-inset-headline-nudge-y, 0px))
    );
    overflow: visible;
  }

  .lz-locations-inset__col-md-5 {
    flex: 0 0 41.666667%;
    max-width: 41.666667%;
  }

  .lz-locations-inset__col-md-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .lz-locations-inset__col-md-4 {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }

  .lz-locations-inset__offset-md-1 {
    margin-left: 8.333333%;
  }

  .lz-locations-inset__order-md-1 {
    order: 1;
  }

  .lz-locations-inset__order-md-2 {
    order: 2;
  }

  .lz-locations-inset__hide-md-down {
    display: block;
  }

  .lz-locations-inset__map-row .lz-locations-inset__map-stage {
    margin-inline-start: var(--lz-locations-inset-map-shift);
  }

  /* .map-row */
  .lz-locations-inset__map-row {
    position: relative;
    z-index: 2;
    margin-top: var(--lz-locations-inset-map-row-md);
  }

  .lz-locations-inset__sidebar {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    width: clamp(2rem, 4vw, 3.5rem);
    height: 100%;
    pointer-events: none;
  }
}

@media (min-width: 992px) {
  .lz-locations-inset {
    --lz-locations-inset-headline-shift-x: clamp(2.5rem, 8vw, 6rem);
  }

  .lz-locations-inset__image-wrapper > .lz-teaser-circle.lz-teaser-ring {
    --lz-teaser-size: 14.5rem;
  }

  .lz-locations-inset__map-row {
    margin-top: var(--lz-locations-inset-map-row-lg);
  }
}

/* --- Facts --- */
.lz-facts {
  padding: clamp(2rem, 5vw, 4rem) 0 clamp(3rem, 8vw, 5rem);
  max-width: 36rem;
}

.lz-facts__title {
  font-size: var(--text-tpl-facts-title);
  font-weight: 800;
  margin: 0 0 1rem;
  line-height: 1.1;
}

.lz-facts__text {
  font-size: var(--text-tpl-body-md);
  line-height: 1.65;
  color: var(--lz-muted);
  margin: 0;
}

/* --- Lead contact: marquee + 3-column layout (classes | services | form) + white rail --- */
.lz-home-columns--lead {
  --lz-home-columns-pad-bottom: clamp(3rem, 8vw, 6rem);
  background: var(--lz-ink, #0a0a0a);
  overflow: visible;
}

.lz-home-columns--lead .lz-home-columns__inner {
  padding: 0 0 var(--lz-home-columns-pad-bottom) var(--lz-left-pad);
}

.lz-lead {
  color: #fff;
  overflow: visible;
}

.lz-lead__panel {
  min-width: 0;
  overflow: visible;
}

.lz-marquee--lead {
  position: relative;
  z-index: 5;
  width: 100%;
  max-width: 100%;
  padding-block: var(--lz-lead-marquee-pad-y);
  padding-inline: var(--lz-left-pad) 0;
  box-sizing: border-box;
}

.lz-marquee--lead .lz-marquee__track {
  gap: 0;
}

.lz-marquee--lead .lz-marquee__item {
  margin-inline-end: 0.25em;
}

.lz-marquee--lead .lz-marquee__item-fill {
  color: var(--ladyzone-brand, #ea098d);
  -webkit-text-fill-color: var(--ladyzone-brand, #ea098d);
  -webkit-text-stroke: 0;
}

.lz-lead__form {
  margin: 0;
  width: 100%;
  font-size: var(--text-tpl-body-md);
  line-height: 1.45;
}

.lz-lead__form {
  font-family: var(--lz-font-body);
}

.lz-lead__subtitle,
.lz-lead__check,
.lz-lead__fields input,
.lz-lead__fields textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

.lz-lead__layout {
  display: grid;
  align-items: start;
  column-gap: clamp(1.5rem, 4vw, 2.5rem);
  row-gap: clamp(0.75rem, 2vw, 1.125rem);
  grid-template-columns: minmax(0, 1fr);
  grid-template-areas:
    "subtitle"
    "classes"
    "services"
    "form";
}

.lz-lead__subtitle {
  grid-area: subtitle;
  margin: 0 0 clamp(1.5rem, 4vw, 2.5rem);
  opacity: 0.8;
  line-height: 1.15;
}

.lz-lead__interests--classes {
  grid-area: classes;
  margin-top: 0;
}

.lz-lead__interests {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}

.lz-lead__interests--services {
  grid-area: services;
  margin-top: 0;
}

.lz-lead__interests-title {
  margin: 0 0 0.75rem;
  padding: 0;
  font-family: inherit;
  font-size: var(--text-tpl-eyebrow);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.lz-lead__form-panel {
  grid-area: form;
  min-width: 0;
  width: 100%;
  max-width: clamp(18rem, 92vw, 28rem);
  margin-top: 0;
  padding: clamp(1.25rem, 3vw, 1.75rem);
  box-sizing: border-box;
  background: #fff;
  color: var(--lz-ink, #121212);
  display: flex;
  flex-direction: column;
}

.lz-lead__check {
  display: flex;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 0.35rem;
  cursor: pointer;
}

.lz-lead__check input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  flex-shrink: 0;
  width: 1.05em;
  height: 1.05em;
  margin: 0;
  border: 1.5px solid var(--lz-ink, #121212);
  border-radius: 0.12em;
  background: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.62em;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease,
    box-shadow 0.2s ease;
}

.lz-lead__check input[type="checkbox"]:checked {
  background-color: var(--ladyzone-brand, #ea098d);
  border-color: var(--ladyzone-brand, #ea098d);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10' fill='none'%3E%3Cpath d='M1 5.2 4.2 8.4 11 1.4' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.lz-lead__check input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--ladyzone-brand, #ea098d);
  outline-offset: 2px;
}

.lz-lead__fields {
  display: grid;
  gap: 1.35rem;
  margin-bottom: 1.5rem;
}

.lz-lead__field {
  display: block;
}

.lz-lead__form-panel .lz-lead__fields input,
.lz-lead__form-panel .lz-lead__fields textarea {
  -webkit-appearance: none;
  appearance: none;
  display: block;
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  margin: 0;
  padding: 0 0 0.65rem;
  border: 0;
  border-bottom: 1px solid #000;
  border-radius: 0;
  background: transparent;
  color: #000;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  outline: none;
  resize: vertical;
}

.lz-lead__form-panel .lz-lead__fields input::placeholder,
.lz-lead__form-panel .lz-lead__fields textarea::placeholder {
  color: rgb(0 0 0 / 0.45);
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: normal;
  text-transform: none;
  opacity: 1;
}

.lz-lead__form-panel .lz-lead__fields input:focus,
.lz-lead__form-panel .lz-lead__fields textarea:focus {
  border-bottom-color: var(--ladyzone-brand, #ea098d);
}

.lz-lead__fields textarea {
  min-height: 4.5rem;
}

@media (min-width: 900px) {
  .lz-home-columns--lead {
    position: relative;
    isolation: isolate;
    container-type: inline-size;
    container-name: lz-lead-section;
    align-items: stretch;
  }

  .lz-home-columns--lead > .lz-lead__rail {
    padding-top: var(--lz-lead-marquee-pad-y);
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
  }

  .lz-home-columns--lead > .lz-lead__rail > .lz-lead__rail-sticky {
    flex: 1 1 auto;
    min-height: 0;
  }

  .lz-home-columns--lead > .lz-lead__panel.lz-home-columns__left {
    position: relative;
    z-index: 5;
    overflow: visible;
  }

  .lz-home-columns--lead .lz-home-columns__inner {
    overflow: visible;
  }

  .lz-marquee--lead {
    width: calc(100% / var(--lz-home-main-ratio));
    max-width: none;
  }

  .lz-lead__layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.25fr);
    grid-template-areas:
      "subtitle subtitle ."
      "classes services form";
    column-gap: clamp(2rem, 4vw, 3rem);
    row-gap: clamp(0.75rem, 2vw, 1.25rem);
  }

  .lz-lead__form-panel {
    position: relative;
    z-index: 3;
    width: min(calc(100% + 18cqi), 28rem);
    max-width: 28rem;
    margin-top: 0;
  }
}

.lz-honeypot {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.lz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--btn-min-h, 44px);
  padding: 0.65rem 1.35rem;
  font-weight: 700;
  text-decoration: none;
  border: none;
  cursor: pointer;
  font: inherit;
}

.lz-lead__form .lz-btn {
  font-family: inherit;
  line-height: inherit;
  font-weight: 700;
}

.lz-lead__form .lz-btn--outline {
  align-self: flex-end;
  font-size: var(--text-tpl-lead-submit);
  line-height: 1.1;
}

.lz-btn--primary {
  background: var(--lz-accent);
  color: #fff;
}

.lz-btn--primary:hover {
  filter: brightness(1.08);
}

/* Outline text button — same stroke + fill hover as services list links.
 * Stroke + fill recipe owned by components/outline-text.css. */
.lz-btn--outline {
  position: relative;
  overflow: hidden;
  min-height: 0;
  padding: 0;
  background: none;
  color: transparent;
  --lz-outline-stroke-c: var(--ladyzone-brand, #ea098d);
}

.lz-btn--outline:focus {
  outline: none;
}

.lz-btn--outline:focus-visible {
  outline: 2px solid var(--lz-accent);
  outline-offset: 0.15em;
}

/* Do not force #page-root visible — breaks preloader timing; hero reveal waits for .is-page-visible */
