/* ==========================================================================
   Amalfi Global: main stylesheet
   Layer order is declared in tokens.css:
   reset, tokens, base, astra, layout, components, patterns, utilities, motion
   Core block-library CSS is imported into `wp` (lowest) by functions.php.
   ========================================================================== */

/* -------------------------------------------------------------------------- */
@layer reset {
  *, *::before, *::after { box-sizing: border-box; }
  html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
  body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ul, ol { margin: 0; }
  ul[class], ol[class] { padding: 0; list-style: none; }
  img, picture, video, svg { display: block; max-width: 100%; height: auto; }
  input, button, textarea, select { font: inherit; color: inherit; }
  button { background: none; border: 0; padding: 0; cursor: pointer; }
  address { font-style: normal; }
  [hidden] { display: none !important; }
}

/* -------------------------------------------------------------------------- */
@layer base {
  html {
    scroll-behavior: smooth;
    scroll-padding-top: var(--header-h-min);
    overflow-x: clip;
    scrollbar-color: var(--c-stone) var(--bg);
    scrollbar-width: thin;
  }
  @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

  body {
    background: var(--bg);
    color: var(--fg);
    font: 400 var(--step-0) / var(--lh-body) var(--font-sans);
    font-feature-settings: "ss01", "cv11";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    overflow-x: clip;
  }
  body.menu-open { overflow: hidden; }

  ::selection { background: var(--selection-bg); color: var(--selection-fg); }
  ::-webkit-scrollbar { width: 10px; height: 10px; }
  ::-webkit-scrollbar-track { background: var(--bg); }
  ::-webkit-scrollbar-thumb { background: var(--c-limestone); border: 3px solid var(--bg); border-radius: 10px; }
  ::-webkit-scrollbar-thumb:hover { background: var(--c-stone); }

  h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: 400;
    line-height: var(--lh-heading);
    letter-spacing: var(--tracking-display);
    color: inherit;
    text-wrap: balance;
    font-variant-numeric: lining-nums;
  }
  h1 { font-size: var(--step-5); line-height: var(--lh-tight); }
  h2 { font-size: var(--step-4); }
  h3 { font-size: var(--step-3); }
  h4 { font-size: var(--step-2); }
  h5, h6 { font-size: var(--step-1); }
  h1 em, h2 em, h3 em { font-style: italic; }

  p { text-wrap: pretty; }
  strong, b { font-weight: 600; }

  a { color: inherit; text-decoration: none; }
  :where(p, li, dd, address) a:not([class]) {
    background: linear-gradient(currentColor, currentColor) 0 100% / 100% 1px no-repeat;
    transition: background-size var(--dur-2) var(--ease-out), color var(--dur-1);
  }
  :where(p, li, dd, address) a:not([class]):hover { background-size: 0 1px; background-position: 100% 100%; }

  :focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
  .section--dark :focus-visible, .site-footer :focus-visible, .amalfi-hero :focus-visible, .menu-overlay :focus-visible { outline-color: var(--c-gold-light); }

  hr { border: 0; border-top: var(--hairline); margin: var(--s-7) 0; }
}

/* -------------------------------------------------------------------------- */
/* Astra structure: neutralise the containers we don't use.                   */
@layer astra {
  #page, .site, .site-content { background: transparent; }
  .site-content > .ast-container,
  .ast-container { max-width: none; padding: 0; display: block; }
  #primary, .content-area { margin: 0 !important; padding: 0 !important; width: 100%; float: none; }
  .ast-article-single, .ast-article-post, article.page { margin: 0; padding: 0 !important; background: none; border: 0; }
  .entry-content > :first-child { margin-top: 0; }
  .entry-content > :last-child { margin-bottom: 0; }
  .entry-header, .ast-breadcrumbs-wrapper { display: none; }
  #main:focus { outline: none; }
  /* Single posts / archives (fallback templates) */
  body:not(.page) #primary { max-width: var(--w-content); margin-inline: auto !important; padding: calc(var(--header-h) + var(--s-9)) var(--gutter) var(--section-y) !important; }
  body:not(.page) .entry-header { display: block; }
}

/* -------------------------------------------------------------------------- */
@layer layout {
  .section {
    position: relative;
    padding-block: var(--section-y);
    padding-inline: var(--gutter);
  }
  .section + .section:not(.section--alt, .section--dark, .cta-band) { border-top: var(--hairline); }
  .section--alt { background: var(--bg-alt); }
  .section--dark { background: var(--bg-inverse); color: var(--fg-inverse); }
  .section--tight { padding-block: calc(var(--section-y) * .6); }
  .section--flush-top { padding-top: 0; }

  .wrap { max-width: var(--w-wide); margin-inline: auto; width: 100%; }
  .wrap--narrow { max-width: var(--w-content); }
  .wrap--max { max-width: var(--w-max); }

  /* 12-col asymmetric split: text 1–5, media 7–12 */
  .split {
    display: grid;
    gap: var(--s-8);
    align-items: center;
  }
  @media (min-width: 900px) {
    .split { grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s-6); }
    .split > .split__text { grid-column: 1 / span 5; }
    .split > .split__media { grid-column: 7 / -1; }
    .split--reverse > .split__text { grid-column: 8 / -1; grid-row: 1; }
    .split--reverse > .split__media { grid-column: 1 / span 6; grid-row: 1; }
    .split--top { align-items: start; }
  }

  .grid-2, .grid-3, .grid-4 { display: grid; gap: var(--s-7) var(--s-6); }
  @media (min-width: 700px) { .grid-2, .grid-3, .grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
  @media (min-width: 1024px) {
    .grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  }

  .stack > * + * { margin-top: var(--s-5); }
  .stack-lg > * + * { margin-top: var(--s-7); }
}

/* -------------------------------------------------------------------------- */
@layer components {

  /* ---- Skip link ---- */
  .skip-link {
    position: fixed; z-index: 1000; inset-inline-start: var(--s-4); inset-block-start: var(--s-4);
    padding: var(--s-3) var(--s-5); background: var(--c-ink); color: var(--c-ivory);
    font: 600 var(--step--1) / 1 var(--font-sans); letter-spacing: var(--tracking-ui); text-transform: uppercase;
    transform: translateY(-200%); transition: transform var(--dur-1) var(--ease-out);
  }
  .skip-link:focus { transform: none; }

  /* ---- Eyebrow: 01 —— Label ---- */
  .eyebrow {
    display: flex; align-items: center; gap: var(--s-4);
    font: 600 var(--step--1) / 1.4 var(--font-sans);
    letter-spacing: var(--tracking-eyebrow);
    text-transform: uppercase;
    color: var(--accent-text);
    margin-bottom: var(--s-6);
  }
  .eyebrow .n { color: var(--fg-muted); font-variant-numeric: tabular-nums; }
  .eyebrow .n::after {
    content: ""; display: inline-block; width: 2.5rem; height: 1px; background: currentColor;
    opacity: .5; vertical-align: middle; margin-inline-start: var(--s-4);
  }
  .eyebrow--inverse, .section--dark .eyebrow, .amalfi-hero .eyebrow, .cta-band .eyebrow { color: var(--c-gold-light); }
  .section--dark .eyebrow .n, .amalfi-hero .eyebrow .n, .cta-band .eyebrow .n { color: var(--fg-inverse-muted); }

  .lead { font-size: var(--step-1); line-height: 1.6; color: var(--fg-muted); max-width: var(--measure); }
  .section--dark .lead, .section--dark .muted { color: var(--fg-inverse-muted); }
  .muted { color: var(--fg-muted); }
  .measure { max-width: var(--measure); }

  .section-head { display: grid; gap: var(--s-5); margin-bottom: var(--s-9); }
  @media (min-width: 1024px) {
    .section-head--split { grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: end; }
    .section-head--split > h2 { grid-column: 1 / span 6; }
    .section-head--split > .lead { grid-column: 8 / -1; }
    .section-head--split > .eyebrow { grid-column: 1 / -1; margin-bottom: 0; }
  }

  /* ---- Buttons: hairline, fill sweeps in ---- */
  .btn,
  .wp-block-button.btn > .wp-block-button__link,
  .wp-block-button .wp-block-button__link {
    position: relative; isolation: isolate; overflow: hidden;
    display: inline-flex; align-items: center; justify-content: center; gap: var(--s-3);
    min-height: 52px; padding: 0 var(--s-6);
    border: 1px solid currentColor; border-radius: 0;
    background: transparent; color: var(--fg);
    font: 600 var(--step--1) / 1 var(--font-sans);
    letter-spacing: var(--tracking-ui); text-transform: uppercase; white-space: nowrap;
    transition: color var(--dur-2) var(--ease-out), border-color var(--dur-2) var(--ease-out);
  }
  .btn::before,
  .wp-block-button .wp-block-button__link::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background: var(--fg); transform: scaleX(0); transform-origin: right;
    transition: transform var(--dur-2) var(--ease-out);
  }
  .btn:hover::before, .btn:focus-visible::before,
  .wp-block-button .wp-block-button__link:hover::before,
  .wp-block-button .wp-block-button__link:focus-visible::before { transform: scaleX(1); transform-origin: left; }
  .btn:hover, .wp-block-button .wp-block-button__link:hover { color: var(--bg); border-color: var(--fg); }

  .is-style-primary .wp-block-button__link, .btn--primary { background: var(--c-sea); border-color: var(--c-sea); color: var(--c-ivory); }
  .is-style-primary .wp-block-button__link::before, .btn--primary::before { background: var(--c-ink); }
  .is-style-primary .wp-block-button__link:hover, .btn--primary:hover { color: var(--c-ivory); border-color: var(--c-ink); }

  .section--dark .wp-block-button__link, .amalfi-hero .wp-block-button__link, .cta-band .wp-block-button__link, .btn--inverse { color: var(--c-ivory); border-color: color-mix(in srgb, var(--c-ivory) 60%, transparent); }
  .section--dark .wp-block-button__link::before, .amalfi-hero .wp-block-button__link::before, .cta-band .wp-block-button__link::before, .btn--inverse::before { background: var(--c-ivory); }
  .section--dark .wp-block-button__link:hover, .amalfi-hero .wp-block-button__link:hover, .cta-band .wp-block-button__link:hover, .btn--inverse:hover { color: var(--c-ink); border-color: var(--c-ivory); }
  .amalfi-hero .is-style-primary .wp-block-button__link, .cta-band .is-style-primary .wp-block-button__link { background: var(--c-ivory); border-color: var(--c-ivory); color: var(--c-ink); }
  .amalfi-hero .is-style-primary .wp-block-button__link::before, .cta-band .is-style-primary .wp-block-button__link::before { background: var(--c-gold); }
  .amalfi-hero .is-style-primary .wp-block-button__link:hover, .cta-band .is-style-primary .wp-block-button__link:hover { color: var(--c-ink); border-color: var(--c-gold); }

  .wp-block-buttons { display: flex; flex-wrap: wrap; gap: var(--s-4); margin-top: var(--s-7); }
  .wp-block-buttons > .wp-block-button { margin: 0; }

  /* Text link with arrow */
  .link-arrow, .link-arrow a {
    display: inline-flex; align-items: center; gap: var(--s-3);
    font: 600 var(--step--1) / 1 var(--font-sans); letter-spacing: var(--tracking-ui); text-transform: uppercase;
    min-height: 44px; background: none !important;
  }
  .link-arrow a::after {
    content: ""; width: 1.75rem; height: 1px; background: currentColor;
    transition: width var(--dur-2) var(--ease-out);
  }
  .link-arrow a:hover::after { width: 3rem; }

  /* ---- Header ---- */
  .site-header {
    position: fixed; inset: 0 0 auto; z-index: 100;
    height: var(--header-h);
    color: var(--fg);
    transition:
      height var(--dur-2) var(--ease-out),
      transform var(--dur-2) var(--ease-out),
      background-color var(--dur-2) var(--ease-out),
      color var(--dur-2) var(--ease-out),
      border-color var(--dur-2) var(--ease-out);
    border-bottom: 1px solid transparent;
  }
  .has-hero .site-header:not(.is-solid) { color: var(--c-ivory); }
  .site-header.is-solid {
    height: var(--header-h-min);
    background: color-mix(in srgb, var(--c-ivory) 85%, transparent);
    -webkit-backdrop-filter: blur(14px) saturate(1.2);
    backdrop-filter: blur(14px) saturate(1.2);
    border-bottom-color: var(--line);
    color: var(--fg);
  }
  body:not(.has-hero) .site-header { background: color-mix(in srgb, var(--c-ivory) 85%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
  .site-header.is-hidden:not(:focus-within) { transform: translateY(-100%); }
  .admin-bar .site-header { top: var(--wp-admin--admin-bar--height, 32px); }

  .site-header__inner {
    height: 100%; max-width: var(--w-max); margin-inline: auto; padding-inline: var(--gutter);
    display: flex; align-items: center; gap: var(--s-6);
  }
  .brand {
    display: inline-flex; align-items: baseline; gap: .45em; margin-inline-end: auto;
    transform-origin: left center; transition: transform var(--dur-2) var(--ease-out);
    min-height: 44px; align-items: center;
  }
  .is-solid .brand { transform: scale(.86); }
  .brand__word { font: 400 1.875rem / 1 var(--font-display); letter-spacing: .01em; }
  .brand__sub { font: 600 .6875rem / 1 var(--font-sans); letter-spacing: .32em; text-transform: uppercase; opacity: .8; }

  .primary-nav { display: none; }
  @media (min-width: 1100px) { .primary-nav { display: block; } }
  .primary-nav__list { display: flex; gap: clamp(1.25rem, 2vw, 2.25rem); }
  .primary-nav__list a {
    position: relative; display: inline-flex; align-items: center; min-height: 44px;
    font: 500 .875rem / 1 var(--font-sans); letter-spacing: .04em;
  }
  .primary-nav__list a::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 10px; height: 1px;
    background: currentColor; transform: scaleX(0); transform-origin: center;
    transition: transform var(--dur-2) var(--ease-out);
  }
  .primary-nav__list a:hover::after,
  .primary-nav__list .current-menu-item > a::after,
  .primary-nav__list .current-menu-ancestor > a::after,
  .primary-nav__list .current-page-ancestor > a::after { transform: scaleX(1); }
  .primary-nav__list .current-menu-item > a::before,
  .primary-nav__list .current-menu-ancestor > a::before,
  .primary-nav__list .current-page-ancestor > a::before {
    content: ""; position: absolute; left: 50%; bottom: 3px; width: 3px; height: 3px; border-radius: 50%;
    background: var(--c-gold); transform: translateX(-50%);
  }

  .btn--header { display: none; min-height: 44px; padding: 0 var(--s-5); color: inherit; }
  @media (min-width: 1100px) { .btn--header { display: inline-flex; } }
  .btn--header::before { background: currentColor; }
  .has-hero .site-header:not(.is-solid) .btn--header:hover { color: var(--c-ink); }
  .site-header.is-solid .btn--header:hover, body:not(.has-hero) .btn--header:hover { color: var(--c-ivory); }

  .menu-toggle {
    display: inline-flex; align-items: center; gap: var(--s-3); min-height: 44px; min-width: 44px;
    font: 600 .75rem / 1 var(--font-sans); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase;
  }
  @media (min-width: 1100px) { .menu-toggle { display: none; } }
  .menu-toggle__icon { position: relative; width: 28px; height: 10px; }
  .menu-toggle__icon i {
    position: absolute; left: 0; right: 0; height: 1px; background: currentColor;
    transition: transform var(--dur-2) var(--ease-out), top var(--dur-2) var(--ease-out);
  }
  .menu-toggle__icon i:first-child { top: 0; }
  .menu-toggle__icon i:last-child { top: 9px; }
  .menu-toggle[aria-expanded="true"] .menu-toggle__icon i:first-child { top: 5px; transform: rotate(45deg); }
  .menu-toggle[aria-expanded="true"] .menu-toggle__icon i:last-child { top: 5px; transform: rotate(-45deg); }
  .menu-open .site-header { color: var(--c-ivory) !important; background: transparent !important; backdrop-filter: none !important; border-color: transparent !important; transform: none !important; }

  /* ---- Full-screen mobile menu ---- */
  .menu-overlay {
    position: fixed; inset: 0; z-index: 90;
    background: var(--c-ink); color: var(--c-ivory);
    overflow-y: auto; overscroll-behavior: contain;
    clip-path: inset(0 0 100% 0);
    transition: clip-path var(--dur-3) var(--ease-in-out);
  }
  .menu-overlay.is-open { clip-path: inset(0 0 0 0); }
  .menu-overlay__inner {
    min-height: 100%; padding: calc(var(--header-h) + var(--s-6)) var(--gutter) var(--s-8);
    display: flex; flex-direction: column; justify-content: space-between; gap: var(--s-8);
  }
  .menu-overlay__list li { overflow: hidden; border-bottom: var(--hairline-inverse); }
  .menu-overlay__list a {
    display: flex; align-items: baseline; justify-content: space-between; padding-block: var(--s-4);
    font: 400 clamp(2.25rem, 9vw, 3.5rem) / 1.05 var(--font-display);
    transform: translateY(110%);
    transition: transform var(--dur-3) var(--ease-out), color var(--dur-1);
    transition-delay: calc(var(--i, 0) * var(--stagger) + 150ms);
  }
  .menu-overlay__list .current-menu-item > a, .menu-overlay__list .current-menu-ancestor > a { color: var(--c-gold-light); }
  .menu-overlay__list a::after { content: "→"; font: 400 1.25rem / 1 var(--font-sans); opacity: .5; }
  .menu-overlay.is-open .menu-overlay__list a { transform: none; }
  .menu-overlay__meta { display: grid; gap: var(--s-5); color: var(--fg-inverse-muted); opacity: 0; transition: opacity var(--dur-3) var(--ease-out) .5s; }
  .menu-overlay.is-open .menu-overlay__meta { opacity: 1; }
  .menu-overlay__meta .btn { justify-self: start; }

  /* ---- Pictures / media frames ---- */
  .amalfi-picture, .amalfi-picture img { width: 100%; }
  .amalfi-picture img { height: 100%; object-fit: cover; }
  .media-frame { position: relative; overflow: hidden; background: var(--c-limestone); }
  .media-frame .amalfi-picture { aspect-ratio: var(--ratio, 4 / 5); height: auto; }
  .media-frame--landscape { --ratio: 3 / 2; }
  .media-frame--wide { --ratio: 16 / 9; }
  .media-frame--cinema { --ratio: 21 / 9; }
  .media-frame .amalfi-picture img { transition: transform 1.6s var(--ease-out); }
  .media-frame:hover .amalfi-picture img, a:hover .media-frame .amalfi-picture img { transform: scale(1.04); }
  .media-frame figcaption, .media-frame .caption {
    position: absolute; inset: auto 0 0; padding: var(--s-5);
    color: var(--c-ivory); font-size: var(--step--1); letter-spacing: .02em;
    background: linear-gradient(to top, rgb(14 14 12 / .55), transparent);
    transform: translateY(100%); transition: transform var(--dur-2) var(--ease-out);
  }
  .media-frame:hover figcaption, .media-frame:focus-within figcaption { transform: none; }

  /* ---- Home hero ---- */
  .amalfi-hero {
    position: relative; isolation: isolate; overflow: hidden;
    min-height: 100svh; display: grid; align-items: end;
    padding: calc(var(--header-h) + var(--s-8)) var(--gutter) clamp(4.5rem, 10vh, 8rem);
    background: var(--c-ink); color: var(--c-ivory);
  }
  .amalfi-hero--page { min-height: min(78svh, 52rem); }
  .amalfi-hero > .amalfi-picture {
    position: absolute; inset: -6% 0; z-index: -2; height: 112%;
    will-change: transform;
  }
  .amalfi-hero > .amalfi-picture img { animation: kenburns var(--dur-kenburns) var(--ease-in-out) infinite alternate; }
  .amalfi-hero::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    background:
      linear-gradient(to right, rgb(14 14 12 / .72) 0%, rgb(14 14 12 / .35) 45%, rgb(14 14 12 / 0) 75%),
      linear-gradient(to top, rgb(14 14 12 / .55) 0%, rgb(14 14 12 / 0) 50%);
  }
  @media (max-width: 767px) {
    .amalfi-hero::before { background: linear-gradient(to top, rgb(14 14 12 / .82) 0%, rgb(14 14 12 / .3) 55%, rgb(14 14 12 / .15) 100%); }
  }
  .amalfi-hero__content { max-width: var(--w-max); margin-inline: auto; width: 100%; }
  .amalfi-hero__content > * { max-width: 58rem; }
  .amalfi-hero h1 { font-size: var(--step-6); line-height: var(--lh-tight); max-width: 12ch; }
  .amalfi-hero--page h1 { max-width: 16ch; }
  .amalfi-hero--page h1 { font-size: var(--step-5); }
  .amalfi-hero .lead { color: color-mix(in srgb, var(--c-ivory) 82%, transparent); margin-top: var(--s-6); max-width: 40rem; }
  .scroll-cue {
    position: absolute; right: var(--gutter); bottom: clamp(2rem, 6vh, 4rem);
    display: none; align-items: center; gap: var(--s-4);
    font: 600 .6875rem / 1 var(--font-sans); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase;
    writing-mode: vertical-rl; color: color-mix(in srgb, var(--c-ivory) 75%, transparent);
  }
  @media (min-width: 900px) { .scroll-cue { display: flex; } }
  .scroll-cue::after {
    content: ""; width: 1px; height: 4rem; background: currentColor;
    transform-origin: top; animation: cue 2.4s var(--ease-in-out) infinite;
  }

  /* Headline line-by-line reveal (JS wraps lines in .line > .line__inner) */
  .js .reveal-lines .line { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }
  .js .reveal-lines .line__inner { display: block; transform: translateY(105%); transition: transform var(--dur-4) var(--ease-out); transition-delay: calc(var(--i) * 120ms + 200ms); }
  .js .reveal-lines.is-in .line__inner { transform: none; }

  /* ---- Page head (text-only, legal/utility pages) ---- */
  .page-head { padding: calc(var(--header-h) + var(--s-10)) var(--gutter) var(--s-9); border-bottom: var(--hairline); }
  .page-head h1 { max-width: 20ch; }

  /* ---- Cards / services index ---- */
  .card { position: relative; display: flex; flex-direction: column; gap: var(--s-5); }
  .card .media-frame { margin-bottom: var(--s-2); }
  .card h3 { font-size: var(--step-2); }
  .card p { color: var(--fg-muted); }
  .card .card__num { font: 600 var(--step--1) / 1 var(--font-sans); letter-spacing: var(--tracking-eyebrow); color: var(--accent-text); }
  .card a.card__link::after { content: ""; position: absolute; inset: 0; } /* whole card clickable */
  .card:focus-within { outline: 2px solid var(--focus); outline-offset: 6px; }
  .card:focus-within a:focus-visible { outline: none; }

  /* ---- Numbered rows (features / process) ---- */
  .rows { border-top: var(--hairline); }
  .section--dark .rows, .section--dark .row { border-color: var(--line-inverse); }
  .row {
    display: grid; gap: var(--s-4) var(--s-6); padding-block: var(--s-7);
    border-bottom: var(--hairline);
  }
  @media (min-width: 900px) {
    .row { grid-template-columns: 5rem minmax(0, 5fr) minmax(0, 6fr); align-items: baseline; }
  }
  @media (min-width: 900px) {
    .split__text .row { grid-template-columns: 3.5rem minmax(0, 1fr); }
    .split__text .row > p:not(.row__num) { grid-column: 2; }
  }
  .row__num { font: 400 var(--step-2) / 1 var(--font-display); color: var(--c-stone); font-variant-numeric: lining-nums; }
  .section--dark .row__num { color: var(--c-gold); }
  .row h3 { font-size: var(--step-3); }
  .row p { color: var(--fg-muted); max-width: var(--measure); }
  .section--dark .row p { color: var(--fg-inverse-muted); }

  /* ---- Stats ---- */
  .stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: var(--hairline-inverse); }
  @media (min-width: 1024px) { .stats { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
  .stat { padding: var(--s-7) var(--s-5) 0 0; }
  @media (min-width: 1024px) { .stat + .stat { border-inline-start: var(--hairline-inverse); padding-inline-start: var(--s-6); } }
  .stat__num { font: 400 var(--step-5) / 1 var(--font-display); color: var(--c-gold); font-variant-numeric: lining-nums tabular-nums; }
  .stat__label { margin-top: var(--s-4); font: 600 var(--step--1) / 1.4 var(--font-sans); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--fg-inverse-muted); }
  .section:not(.section--dark) .stats { border-color: var(--line); }
  .section:not(.section--dark) .stat__num { color: var(--fg); }
  .section:not(.section--dark) .stat__label { color: var(--fg-muted); }

  /* ---- Checklist (inclusions, bullet lists) ---- */
  .checklist { display: grid; gap: 0; }
  .checklist li { position: relative; padding: var(--s-4) 0 var(--s-4) var(--s-6); border-bottom: var(--hairline); }
  .checklist li::before { content: ""; position: absolute; left: 0; top: 1.45em; width: .75rem; height: 1px; background: var(--c-gold); }
  .section--dark .checklist li { border-color: var(--line-inverse); }

  .inclusion { padding: var(--s-7) 0 0; border-top: 1px solid var(--fg); }
  .inclusion h3 { font-size: var(--step-2); margin-bottom: var(--s-5); }

  /* ---- Marquee ---- */
  .marquee { overflow: hidden; border-block: var(--hairline); padding-block: var(--s-6); -webkit-mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
  .section--dark .marquee { border-color: var(--line-inverse); }
  .marquee__track { display: flex; width: max-content; animation: marquee 50s linear infinite; }
  .marquee:hover .marquee__track, .marquee:focus-within .marquee__track { animation-play-state: paused; }
  .marquee__item { display: inline-flex; align-items: center; gap: var(--s-7); padding-inline-end: var(--s-7); font: 400 var(--step-3) / 1 var(--font-display); white-space: nowrap; }
  .marquee__item::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--c-gold); }
  @media (prefers-reduced-motion: reduce) { .marquee__track { animation: none; flex-wrap: wrap; width: auto; } }

  /* ---- CTA band ---- */
  .cta-band { position: relative; isolation: isolate; overflow: hidden; color: var(--c-ivory); background: var(--c-ink); padding: clamp(6rem, 4rem + 10vw, 13rem) var(--gutter); }
  .cta-band > .amalfi-picture { position: absolute; inset: 0; z-index: -2; height: 100%; }
  .cta-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgb(14 14 12 / .55); }
  .cta-band h2 { font-size: var(--step-5); max-width: 18ch; }
  .cta-band .lead { color: color-mix(in srgb, var(--c-ivory) 80%, transparent); margin-top: var(--s-5); }
  .cta-band--light { color: var(--fg); background: var(--c-linen); }
  .cta-band--light::before { background: linear-gradient(90deg, rgb(246 242 234 / .94) 0%, rgb(246 242 234 / .86) 50%, rgb(246 242 234 / .55) 100%); }
  .cta-band--light .lead { color: var(--fg-muted); }

  /* ---- Quote / testimonial pattern ---- */
  .quote { max-width: 56rem; }
  .quote blockquote p { font: 400 var(--step-4) / 1.2 var(--font-display); font-style: italic; }
  .quote cite { display: block; margin-top: var(--s-6); font: 600 var(--step--1) / 1.4 var(--font-sans); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; font-style: normal; color: var(--fg-muted); }

  /* ---- Team ---- */
  .team { display: grid; border-top: var(--hairline); }
  @media (min-width: 700px) { .team { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s-7); } }
  @media (min-width: 1100px) { .team { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  .person { padding-block: var(--s-6); border-bottom: var(--hairline); }
  .person__name { font: 400 var(--step-2) / 1.15 var(--font-display); }
  .person__role { margin-top: var(--s-2); font: 600 var(--step--1) / 1.4 var(--font-sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent-text); }
  .person__bio { margin-top: var(--s-4); color: var(--fg-muted); font-size: .9375rem; }
  .team--lead .person__name { font-size: var(--step-3); }

  /* ---- FAQ (details/summary) ---- */
  .faq-group + .faq-group { margin-top: var(--s-9); }
  .faq { border-top: var(--hairline); }
  .faq details { border-bottom: var(--hairline); }
  .faq summary {
    display: flex; justify-content: space-between; gap: var(--s-6); align-items: baseline;
    padding-block: var(--s-6); cursor: pointer; list-style: none;
    font: 400 var(--step-2) / 1.25 var(--font-display);
  }
  .faq summary::-webkit-details-marker { display: none; }
  .faq summary::after { content: "+"; font: 300 1.75rem / 1 var(--font-sans); color: var(--accent-text); transition: transform var(--dur-2) var(--ease-out); flex: none; }
  .faq details[open] summary::after { transform: rotate(45deg); }
  .faq details > :not(summary) { max-width: var(--measure); color: var(--fg-muted); }
  .faq details > :last-child:not(summary) { padding-bottom: var(--s-7); }
  .faq details > * + :not(summary) { margin-top: var(--s-4); }
  .faq details::details-content { block-size: 0; overflow: clip; transition: block-size var(--dur-2) var(--ease-out), content-visibility var(--dur-2) allow-discrete; }
  .faq details[open]::details-content { block-size: auto; }
  @supports (interpolate-size: allow-keywords) { :root { interpolate-size: allow-keywords; } }

  /* ---- Prose (legal, long-form) ---- */
  .prose { max-width: var(--w-content); }
  .prose > * + * { margin-top: var(--s-5); }
  .prose h2 { font-size: var(--step-3); margin-top: var(--s-9); }
  .prose h3 { font-size: var(--step-2); margin-top: var(--s-7); }
  .prose ul { padding-inline-start: 1.25em; }
  .prose li + li { margin-top: var(--s-2); }

  /* ---- Contact ---- */
  .contact-grid { display: grid; gap: var(--s-9); }
  @media (min-width: 1024px) { .contact-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--s-10); } }
  .contact-details dt { font: 600 var(--step--1) / 1.4 var(--font-sans); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--accent-text); margin-top: var(--s-7); }
  .contact-details dd { font: 400 var(--step-2) / 1.3 var(--font-display); margin-top: var(--s-3); }

  /* ---- Footer ---- */
  .site-footer { background: var(--c-ink); color: var(--fg-inverse); border-top: 1px solid var(--c-gold); position: relative; }
  .site-footer__inner { max-width: var(--w-max); margin-inline: auto; padding: var(--s-10) var(--gutter) var(--s-6); }
  .site-footer__top { display: grid; gap: var(--s-9); }
  @media (min-width: 1024px) { .site-footer__top { grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: var(--s-8); } }
  .site-footer__lede { font: 400 var(--step-3) / 1.15 var(--font-display); max-width: 18ch; }
  .site-footer__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-8) var(--s-6); }
  @media (min-width: 1024px) { .site-footer__cols { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
  .footer-menu { display: contents; }
  .footer-menu > li > a, .footer-contact__title {
    display: block; margin-bottom: var(--s-5); pointer-events: none;
    font: 600 var(--step--1) / 1.4 var(--font-sans); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--c-gold-light);
  }
  .footer-menu .sub-menu { padding: 0; list-style: none; display: grid; gap: 0; }
  .footer-menu .sub-menu a, .footer-contact a { color: var(--fg-inverse-muted); display: inline-flex; min-height: 44px; align-items: center; transition: color var(--dur-1); background: none !important; }
  .footer-menu .sub-menu a:hover, .footer-contact a:hover { color: var(--c-ivory); }
  .footer-contact address { color: var(--fg-inverse-muted); line-height: 1.9; }
  .site-footer__wordmark {
    margin-top: var(--s-10); font: 300 var(--step-7) / .8 var(--font-display); letter-spacing: -.03em;
    color: transparent; -webkit-text-stroke: 1px color-mix(in srgb, var(--c-gold) 70%, transparent);
    white-space: nowrap; overflow: hidden; user-select: none;
  }
  .site-footer__bottom {
    display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-4);
    margin-top: var(--s-7); padding-top: var(--s-5); border-top: var(--hairline-inverse);
    font-size: var(--step--1); color: var(--fg-inverse-muted);
  }
  .legal-menu { display: flex; flex-wrap: wrap; gap: var(--s-5); }
  .legal-menu a { display: inline-flex; min-height: 44px; align-items: center; }
  .legal-menu a:hover { color: var(--c-ivory); }

  /* ---- Newsletter / forms (Fluent Forms) ---- */
  .newsletter { margin-top: var(--s-7); max-width: 28rem; }
  .newsletter__label { color: var(--fg-inverse-muted); margin-bottom: var(--s-4); font-size: .9375rem; }

  /* ---- Grain + cursor ---- */
  .grain {
    position: fixed; inset: -50%; z-index: 200; pointer-events: none; opacity: var(--grain-opacity);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  .cursor { display: none; }
  @media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .has-cursor .cursor { display: block; position: fixed; inset: 0; z-index: 300; pointer-events: none; mix-blend-mode: difference; }
    .cursor__dot, .cursor__ring { position: absolute; top: 0; left: 0; border-radius: 50%; will-change: transform; }
    .cursor__dot { width: 6px; height: 6px; margin: -3px 0 0 -3px; background: var(--c-ivory); }
    .cursor__ring { width: 36px; height: 36px; margin: -18px 0 0 -18px; border: 1px solid var(--c-ivory); transition: width var(--dur-2) var(--ease-out), height var(--dur-2) var(--ease-out), margin var(--dur-2) var(--ease-out), opacity var(--dur-2); }
    .cursor.is-link .cursor__ring { width: 64px; height: 64px; margin: -32px 0 0 -32px; }
    .cursor.is-hidden { opacity: 0; }
  }

  /* ---- 404 ---- */
  .not-found .amalfi-hero h1 { font-size: var(--step-6); }
}

/* -------------------------------------------------------------------------- */
@layer patterns {
  /* Container queries: cards adapt to their column, not the viewport. */
  .services-grid { container-type: inline-size; }
  @container (min-width: 1000px) {
    .services-grid .grid-3 > .card:nth-child(3n + 2) { margin-top: var(--s-9); }
  }

  /* :has() – split sections with a dark media frame get a darker background tone */
  .section:has(.split__media .media-frame--dark) { background: var(--c-linen); }

  /* Security band: text over image on wide screens */
  .feature-band { display: grid; gap: var(--s-8); }
  @media (min-width: 1024px) {
    .feature-band { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: center; gap: var(--s-9); }
  }
}

/* -------------------------------------------------------------------------- */
@layer utilities {
  .visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  .mt-0 { margin-top: 0 !important; }
  .mt-l { margin-top: var(--s-8) !important; }
  .text-center { text-align: center; }
  .inverse { color: var(--fg-inverse); }
}

/* -------------------------------------------------------------------------- */
@layer motion {
  @keyframes kenburns { from { transform: scale(1); } to { transform: scale(1.08); } }
  @keyframes cue { 0% { transform: scaleY(0); transform-origin: top; } 45% { transform: scaleY(1); transform-origin: top; } 55% { transform: scaleY(1); transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
  @keyframes marquee { to { transform: translateX(-50%); } }

  /* Scroll reveals (JS adds .js to <html> and .is-in when visible) */
  .js .reveal { opacity: 0; transform: translateY(28px); transition: opacity var(--dur-3) var(--ease-out), transform var(--dur-3) var(--ease-out); transition-delay: calc(var(--i, 0) * var(--stagger)); }
  .js .reveal.is-in { opacity: 1; transform: none; }
  .js .reveal-mask { opacity: 1; transform: none; clip-path: inset(100% 0 0 0); transition: clip-path var(--dur-4) var(--ease-out); }
  .js .reveal-mask.is-in { clip-path: inset(0 0 0 0); }
  .js .reveal-mask .amalfi-picture img { transform: scale(1.12); transition: transform 1.8s var(--ease-out); }
  .js .reveal-mask.is-in .amalfi-picture img { transform: scale(1); }
  .js .reveal-mask.is-in:hover .amalfi-picture img { transform: scale(1.04); }

  @media (prefers-reduced-motion: reduce) {
    .js .reveal, .js .reveal-mask { opacity: 1; transform: none; clip-path: none; }
    .js .reveal-mask .amalfi-picture img { transform: none; }
    .js .reveal-lines .line__inner { transform: none; }
    .amalfi-hero > .amalfi-picture img, .scroll-cue::after { animation: none; }
    .menu-overlay__list a { transform: none; }
  }
}

/* -------------------------------------------------------------------------- */
/* Unlayered on purpose: Fluent Forms ships unlayered CSS, so these must be    */
/* unlayered to win. Scoped tightly to form markup.                            */
.amalfi .fluentform .ff-el-group { margin-bottom: var(--s-6); }
.amalfi .fluentform .ff-el-input--label label { font: 600 var(--step--1)/1.4 var(--font-sans); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--fg-muted); }
.amalfi .fluentform .ff-el-form-control {
  border: 0; border-bottom: 1px solid var(--fg); border-radius: 0; background: transparent;
  padding: var(--s-3) 0; min-height: 48px; font: 400 var(--step-1)/1.4 var(--font-sans); color: var(--fg);
  box-shadow: none; transition: border-color var(--dur-1);
}
.amalfi .fluentform textarea.ff-el-form-control { min-height: 8rem; resize: vertical; }
.amalfi .fluentform .ff-el-form-control:focus { border-bottom-color: var(--c-sea); outline: 2px solid transparent; box-shadow: 0 1px 0 0 var(--c-sea); }
.amalfi .fluentform .ff-btn-submit {
  min-height: 52px; padding: 0 var(--s-7); border-radius: 0 !important; border: 1px solid var(--c-sea) !important;
  background: var(--c-sea) !important; color: var(--c-ivory) !important;
  font: 600 var(--step--1)/1 var(--font-sans); letter-spacing: var(--tracking-ui); text-transform: uppercase;
  transition: background-color var(--dur-2) var(--ease-out), border-color var(--dur-2) var(--ease-out);
}
.amalfi .fluentform .ff-btn-submit:hover { background: var(--c-ink) !important; border-color: var(--c-ink) !important; opacity: 1; }
.amalfi .site-footer .fluentform { display: flex; }
.amalfi .site-footer .fluentform form { display: flex; gap: 0; width: 100%; align-items: flex-end; }
.amalfi .site-footer .fluentform .ff-el-group { flex: 1; margin: 0; }
.amalfi .site-footer .fluentform .ff-el-input--label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.amalfi .site-footer .fluentform .ff-el-form-control { border-bottom-color: color-mix(in srgb, var(--c-ivory) 45%, transparent); color: var(--c-ivory); font-size: var(--step-0); }
.amalfi .site-footer .fluentform .ff-el-form-control::placeholder { color: var(--fg-inverse-muted); opacity: 1; }
.amalfi .site-footer .fluentform .ff_submit_btn_wrapper { margin: 0; }
.amalfi .site-footer .fluentform .ff-btn-submit { background: transparent !important; border: 0 !important; border-bottom: 1px solid color-mix(in srgb, var(--c-ivory) 45%, transparent) !important; color: var(--c-gold-light) !important; padding: 0 0 0 var(--s-4); min-height: 48px; }
.amalfi .site-footer .fluentform .ff-btn-submit:hover { color: var(--c-ivory) !important; }
.amalfi .site-footer .ff-message-success { color: var(--c-gold-light); border: 0; padding: 0; box-shadow: none; background: none; }
.amalfi .fluentform .error.text-danger { color: #9E2A1E; font-size: var(--step--1); }
.amalfi .site-footer .fluentform .error.text-danger { color: #F2A28F; }