/* Opt-in motion refinements. Card dimensions remain defined by About.html. */
.zuvani-pillars[data-pillar-motion] .zuvani-pillar-card {
  transform-origin: top left;
  transition: none;
}

.zuvani-pillars[data-pillar-motion] .zuvani-pillar-card__title {
  transition: none;
}

/* A side card can retain keyboard focus after becoming the active card. */
.zuvani-pillars[data-pillar-motion] .zuvani-pillar-card--active {
  transform: translate3d(-50%, 0, 0);
  filter: none;
}

.zuvani-pillars[data-pillar-motion] .zuvani-pillar-card__content {
  transform-origin: left bottom;
}

.zuvani-pillars[data-pillar-motion] .zuvani-pillar-card__number {
  transform-origin: left top;
}

/* A stable photographic canvas is revealed by the card's changing crop. */
.zuvani-pillars[data-pillar-motion] .zuvani-pillar-card__image {
  inset: auto;
  top: 50%;
  left: 50%;
  width: max(var(--pillar-active-w), var(--pillar-side-w));
  height: max(var(--pillar-h), var(--pillar-side-h));
  max-width: none;
  transform: translate3d(-50%, -50%, 0);
  transition: none;
  user-select: none;
  -webkit-user-drag: none;
}

.zuvani-pillars[data-pillar-motion] .pillar-copy-snapshot {
  pointer-events: none;
  user-select: none;
}

.zuvani-pillars.is-dragging [data-pillar-carousel] {
  cursor: grabbing;
  user-select: none;
  -webkit-user-select: none;
}

/* No hover-position shifts competing with the live gesture transform. */
.zuvani-pillars[data-pillar-motion] .zuvani-pillar-card:not(.zuvani-pillar-card--active) {
  transform: translate3d(calc(-50% + var(--pillar-shift)), 18px, 0);
}
.zuvani-pillars[data-pillar-motion] .zuvani-pillar-card[data-side="left"] {
  transform: translate3d(calc(-50% - var(--pillar-shift)), 18px, 0);
}

/* The fluid menu timing that used to live here is shared by every page now:
   see navigation-overlay.css. */

/* Pause remains first in keyboard order. Visually, group previous / Pause /
   next below the cards, with the counter and clock on their own quiet row. */
.zuvani-pillars__gallery {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 44px max-content 44px minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 12px;
  min-width: 0;
  width: 100%;
}
.zuvani-pillars__gallery > .zuvani-pillars__carousel {
  grid-area: 1 / 1 / 2 / -1;
  margin-bottom: clamp(8px, 1.5vw, 20px);
}
.zuvani-pillars__gallery > .zuvani-pillars__controls {
  /* This div has no semantic role. Its native buttons join the gallery grid
     without changing DOM order or duplicating any accessible controls. */
  display: contents;
}
.zuvani-pillars__gallery > .zuvani-pillars__rotation {
  grid-area: 2 / 3;
  justify-self: center;
  align-self: center;
}
.zuvani-pillars__controls > [data-pillar-prev] { grid-area: 2 / 2; }
.zuvani-pillars__controls > [data-pillar-next] { grid-area: 2 / 4; }
.zuvani-pillars__controls > .zuvani-pillars__status {
  grid-area: 3 / 1 / 4 / -1;
  justify-self: center;
}
.zuvani-pillars__counter { font-variant-numeric: tabular-nums; }
/* Keep the complete review group within ordinary desktop viewports before
   considering any change to card geometry. Tablet/phone spacing stays intact. */
@media (min-width: 941px) {
  .zuvani-pillars { --pillar-h: var(--pillar-review-height, clamp(590px, 68svh, 780px)); }
}
@media (min-width: 941px) and (max-height: 1100px) {
  .zuvani-pillars__inner { gap: 16px; }
  .zuvani-pillars__eyebrow { margin-bottom: 12px; }
  .zuvani-pillars__gallery { row-gap: 8px; }
  .zuvani-pillars__gallery > .zuvani-pillars__carousel { margin-bottom: 0; }
}
@media (max-width: 480px) {
  .zuvani-pillars__gallery :is(.zuvani-pillars__status, .zuvani-pillars__counter) { min-width: 56px; }
}

/* Editorial hierarchy, not an edit: every heading word and paragraph stays.
   Intro, portrait and remaining biography follow the same DOM reading order. */
.founder-hero {
  grid-template-areas: "intro media" "body media";
  align-content: center;
  align-items: start;
  row-gap: 20px;
  transform: none;
  opacity: 1;
  will-change: auto;
}
.founder-hero .founder-intro { grid-area: intro; }
.founder-hero .founder-body { grid-area: body; }
.founder-hero .founder-hero__media { align-self: center; }
.scroll-enhanced .founder-hero .founder-copy {
  align-self: start;
  transform: none;
  opacity: 1;
  transition: none;
  will-change: auto;
}
.founder-hero .founder-copy p:last-child { margin-bottom: 0; }
.founder-hero .founder-heading-line + .founder-heading-line {
  margin-top: 18px;
  font-size: clamp(1.6rem, 2.4vw, 2.2rem);
  line-height: 1.18;
  font-weight: var(--weight-heading);
  letter-spacing: -0.01em;
}

/* The media frame reserves the photograph's space before lazy loading completes.
   Only newly loaded pixels fade; the reading surface never moves or hides. */
.home-vision__image {
  display: block;
  opacity: 1;
  transition: opacity 240ms var(--ease-out);
}
.home-vision__image.is-vision-pending { opacity: 0; }

@media (min-width: 701px) and (max-width: 940px) {
  .founder-hero {
    grid-template-columns: minmax(0, 1fr) minmax(230px, 0.85fr);
    grid-template-areas: "intro media" "body body";
    gap: 32px;
    padding: 104px clamp(32px, 6vw, 56px) 64px;
  }
  .founder-hero .founder-copy { max-width: none; }
}
@media (max-width: 700px) {
  /* Match the two editorial chapters: equal breathing room before and after
     their content, without changing the portrait gaps or larger layouts. */
  .home-vision__content { padding-block: 72px; }
  .founder-hero {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "intro" "media" "body";
    row-gap: 28px;
    padding: 72px clamp(22px, 5vw, 34px);
  }
  .founder-hero .founder-copy h2 { font-size: clamp(2.4rem, 10.8vw, 3.2rem); }
  .founder-hero .founder-heading-line + .founder-heading-line {
    margin-top: 14px;
    font-size: clamp(1.5rem, 6vw, 1.8rem);
  }
  .founder-hero .rule { margin-block: 24px; }
}

/* Share the mobile button's centre line; keep the larger editorial layout. */
@media (max-width: 640px) {
  .home-vision__closing { text-align: center; }
}

/* Theme the Menu itself to the surface under it; the rest of the header keeps
   its existing section theme and the vision Enquire rule stays unchanged. */
html[data-page-experience="direct"] .site-header.menu-on-light:not(.nav-overlay-active) .menu-toggle {
  color: var(--espresso, #231a10);
}

/* Give the enquiry icon real room on narrow/enlarged headers. The regular
   layout is unchanged whenever all three controls fit. */
.site-header.enquire-header-crowded {
  width: 100vw;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  padding: 10px 16px;
}
.site-header.enquire-header-crowded .brand {
  position: relative; top: auto; left: auto; transform: none;
  grid-column: 1 / -1; grid-row: 1;
  width: 120px; min-width: 0; height: 64px; justify-self: center;
}
.site-header.enquire-header-crowded .header-icon { pointer-events: none; }
.site-header.enquire-header-crowded .menu-toggle {
  grid-column: 1; grid-row: 2; min-width: 0;
  flex-direction: column; align-items: start; gap: 2px;
}
.site-header.enquire-header-crowded .menu-toggle span { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
.site-header.enquire-header-crowded .inquire-link {
  grid-column: 2; grid-row: 2; min-height: 44px; margin: 0; justify-self: end;
}

/* Frequent press feedback: 160ms press, snappier 100ms release.
   Keyboard actions stay instant; touch never inherits a mouse-only lift. */
html[data-page-experience="direct"] :is(.menu-toggle, .inquire-link, .zuvani-pillars__control, .home-vision__cta, .zuvani-nav-close, .zuvani-pillar-card__link, .about-hero__scroll-cue, .zuvani-nav-social-link) {
  transition:
    transform 100ms var(--ease-out),
    color 160ms ease,
    background 160ms ease,
    border-color 160ms ease,
    box-shadow 160ms ease,
    opacity 160ms ease;
}
html[data-page-experience="direct"] .site-header.inquire-hidden .inquire-link {
  transition: opacity 300ms ease, transform 300ms ease, visibility 0s linear 300ms;
}
html[data-page-experience="direct"] .site-header:not(.inquire-hidden):not(.nav-overlay-active) .inquire-link,
html[data-page-experience="direct"] .home-vision__cta,
html[data-page-experience="direct"] .zuvani-nav-social-link,
html[data-page-experience="direct"] .zuvani-nav-close-icon,
html[data-page-experience="direct"] .zuvani-pillar-card__link span,
html[data-page-experience="direct"] .about-hero__scroll-cue span {
  transform: none;
}
/* Keep the current-page marker's static indent; other link motion is hover-only. */
html[data-page-experience="direct"] .zuvani-nav-list .zuvani-nav-link:not([aria-current="page"]) .zuvani-nav-link-text {
  transform: none;
}
@media (hover: hover) and (pointer: fine) {
  html[data-page-experience="direct"] .site-header:not(.inquire-hidden):not(.nav-overlay-active) .inquire-link:hover { transform: translateY(-2px); }
  html[data-page-experience="direct"] .home-vision__cta:hover { transform: translateY(-3px); }
  html[data-page-experience="direct"] .zuvani-nav-social-link:hover { transform: translateY(-2px); }
  html[data-page-experience="direct"] .zuvani-nav-close:hover .zuvani-nav-close-icon { transform: rotate(90deg); }
  html[data-page-experience="direct"] .zuvani-pillar-card__link:hover span { transform: translateX(5px); }
  html[data-page-experience="direct"] .about-hero__scroll-cue:hover span { transform: translateY(3px); }
  html[data-page-experience="direct"] .zuvani-nav-list .zuvani-nav-link:not([aria-current="page"]):hover .zuvani-nav-link-text { transform: translateX(8px); }
}
html[data-page-experience="direct"] :is(.menu-toggle, .inquire-link, .zuvani-pillars__control, .home-vision__cta, .zuvani-nav-close, .zuvani-pillar-card__link, .about-hero__scroll-cue, .zuvani-nav-social-link):focus-visible {
  transition: none;
  transform: none !important;
  outline: 2px solid currentColor;
  outline-offset: 4px;
}
html[data-page-experience="direct"] .is-pointer-pressed {
  /* Touch :active can be deferred until release. Pointer state gives immediate
     feedback and wins over shared header hover, without changing tap behaviour. */
  transform: scale(0.97) !important;
  transition-duration: 160ms;
}

/* Native keyboard/assistive anchor activation must not animate the viewport. */
html[data-page-experience="direct"].about-keyboard-input {
  scroll-behavior: auto;
}

/* Reserve the indicator's final width; only its pixels grow, never its layout. */
html[data-page-experience="direct"] .zuvani-nav-list .zuvani-nav-link .zuvani-nav-link-text::after {
  width: 34px;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 200ms var(--ease-out);
}
html[data-page-experience="direct"] .zuvani-nav-list .zuvani-nav-link:is(:focus-visible, [aria-current="page"]) .zuvani-nav-link-text::after {
  transform: scaleX(1);
}
@media (max-width: 420px) {
  html[data-page-experience="direct"] .zuvani-nav-list .zuvani-nav-link .zuvani-nav-link-text::after {
    width: 24px;
  }
}

/* Shared footer hovers are opt-in for About: touch and keyboard stay still. */
html[data-page-experience="direct"] .footer-legal-v2 .legal-footer__contact .legal-footer__contact-arrow {
  transform: none;
  transition: transform 200ms var(--ease-out);
}
html[data-page-experience="direct"] .footer-legal-v2 .legal-footer__fora-profile .legal-footer__fora-lockup {
  opacity: 1;
  transform: none;
  transition: opacity 200ms ease, transform 200ms var(--ease-out);
}
@media (hover: hover) and (pointer: fine) {
  html[data-page-experience="direct"] .zuvani-nav-list .zuvani-nav-link:hover .zuvani-nav-link-text::after {
    transform: scaleX(1);
  }
  html[data-page-experience="direct"] .footer-legal-v2 .legal-footer__contact:hover .legal-footer__contact-arrow {
    transform: translateX(4px);
  }
  html[data-page-experience="direct"] .footer-legal-v2 .legal-footer__fora-profile:hover .legal-footer__fora-lockup {
    opacity: 0.72;
    transform: translateY(-2px);
  }
}
html[data-page-experience="direct"] .footer-legal-v2 .legal-footer__contact:focus-visible .legal-footer__contact-arrow,
html[data-page-experience="direct"] .footer-legal-v2 .legal-footer__fora-profile:focus-visible .legal-footer__fora-lockup,
html[data-page-experience="direct"].about-keyboard-input .footer-legal-v2 .legal-footer__contact .legal-footer__contact-arrow,
html[data-page-experience="direct"].about-keyboard-input .footer-legal-v2 .legal-footer__fora-profile .legal-footer__fora-lockup {
  transform: none;
  opacity: 1;
  transition: none;
}
/* Also suppress the release/dimming transitions when tabbing from a menu
   opened by mouse. No delayed indicator collapse follows keyboard focus. */
html[data-page-experience="direct"].about-keyboard-input .zuvani-nav-list .zuvani-nav-link,
html[data-page-experience="direct"].about-keyboard-input .zuvani-nav-list .zuvani-nav-link .zuvani-nav-link-text,
html[data-page-experience="direct"].about-keyboard-input .zuvani-nav-list .zuvani-nav-link .zuvani-nav-link-text::after {
  transition: none;
}
html[data-page-experience="direct"].about-keyboard-input .zuvani-nav-list .zuvani-nav-link:not([aria-current="page"]) .zuvani-nav-link-text {
  transform: none;
}

/* Playback icons and labels now use playback-controls.css. */

/* New additions honour Reduce Motion locally. This deliberately does not
   revise the pre-existing site-wide policy or the earlier carousel spring. */
@media (prefers-reduced-motion: reduce) {
  html[data-page-experience="direct"] :is(.zuvani-pillar-card__link, .about-hero__scroll-cue, .zuvani-nav-social-link) {
    transform: none !important;
    transition: opacity 100ms var(--ease-out);
  }
  html[data-page-experience="direct"] :is(.zuvani-pillar-card__link, .about-hero__scroll-cue, .zuvani-nav-social-link).is-pointer-pressed {
    opacity: 0.72;
  }
}
/* Keyboard and assistive activation are instant, also while the pointer
   happens to rest on the focused link. No motion is added to focus changes. */
html[data-page-experience="direct"] :is(.zuvani-pillar-card__link, .about-hero__scroll-cue, .zuvani-nav-social-link):focus-visible {
  transition: none;
}
html[data-page-experience="direct"].about-keyboard-input :is(.zuvani-pillar-card__link, .about-hero__scroll-cue, .zuvani-nav-social-link),
html[data-page-experience="direct"] :is(.zuvani-pillar-card__link, .about-hero__scroll-cue):focus-visible span {
  transform: none !important;
  transition: none;
}