/* Blog only. Preserve the editorial design; reading never moves. */
html[data-motion-preferences="system"] { --nav-overlay-duration: 280ms; }

.site-header:not(.home-header-v3) {
  --blog-brand-slot: 112px;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(44px, 220px) minmax(0, 1fr);
  gap: 12px;
  transition: none;
}
.site-header .brand,
.site-header.site-header--full-wordmark .brand {
  position: relative;
  top: auto;
  left: auto;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  grid-column: 2;
  height: 44px;
  justify-self: center;
  transform: none;
}
.site-header .header-icon.header-icon--full-name,
.site-header .header-icon:not(.header-icon--full-name) {
  width: 220px;
  max-width: none;
  pointer-events: none;
  transition: none;
  filter: none;
}
.site-header .menu-toggle { grid-column: 1; justify-self: start; min-width: 0; }
.site-header:not(.home-header-v3) .inquire-link {
  min-height: 44px;
  min-width: 0;
  margin-left: 0;
  justify-self: end;
  white-space: normal;
}
/* The compact sunmark header keeps a quiet reading surface below the hero. */
html[data-motion-preferences="system"] .site-header:not(.nav-overlay-active) {
  color: var(--espresso);
  background: rgba(243, 237, 224, .94);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(35, 26, 16, .12);
  box-shadow: 0 8px 24px rgba(35, 26, 16, .08);
}
html[data-motion-preferences="system"] .site-header:not(.nav-overlay-active) .menu-toggle { color: var(--espresso); }

/* Let the full wordmark float over the opening photography. Keep this rule
   active while the drawer opens/closes, so no ivory bar flashes behind it. */
html[data-motion-preferences="system"] .site-header.site-header--full-wordmark {
  color: var(--warm-ivory);
  background: transparent;
  border-bottom-color: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
html[data-motion-preferences="system"] .site-header.site-header--full-wordmark .menu-toggle {
  color: var(--warm-ivory);
  text-shadow: 0 1px 3px rgba(18, 12, 7, .85);
}
html[data-motion-preferences="system"] .site-header.site-header--full-wordmark .menu-toggle svg {
  filter: drop-shadow(0 1px 2px rgba(18, 12, 7, .65));
}
html[data-motion-preferences="system"] .site-header.site-header--full-wordmark .header-icon {
  filter: brightness(0) invert(1) drop-shadow(0 1px 3px rgba(18, 12, 7, .6));
}

/* Use the existing reversible navigation controller and easing token. */
.zuvani-nav-overlay.is-visible { transition-delay: 0s; }
.zuvani-nav-link { transition-duration: 160ms, 200ms; transition-delay: calc(var(--nav-index) * 30ms); }
.zuvani-nav-meta { transition-duration: 160ms, 200ms; transition-delay: 60ms; }
.zuvani-nav-backdrop, .zuvani-nav-backdrop.is-open { transition-duration: 160ms, 0s; }
.zuvani-nav-link-text, .zuvani-nav-close-icon { transition-duration: 160ms; }
.zuvani-nav-link-text { position: relative; }
.zuvani-nav-link .zuvani-nav-link-text::after {
  position: absolute;
  left: calc(100% + 14px);
  width: 24px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 160ms var(--ease-out);
}
.zuvani-nav-link[aria-current="page"] .zuvani-nav-link-text::after { transform: scaleX(1); }
@media (hover: hover) and (pointer: fine) {
  .zuvani-nav-link:hover .zuvani-nav-link-text::after { transform: scaleX(1); }
}
.nav-motion-instant :is(.zuvani-nav-overlay, .zuvani-nav-overlay *, .zuvani-nav-backdrop),
html.blog-keyboard-input :is(a, button, a::after, a span, button svg) { transition: none !important; }
html.blog-keyboard-input { scroll-behavior: auto; }
html[data-motion-preferences="system"] .footer-legal-v2 .legal-footer__fora-profile .legal-footer__fora-lockup { transform: none; transition: none; }
html[data-motion-preferences="system"] .footer-legal-v2 .legal-footer__contact .legal-footer__contact-arrow { transform: none; transition: transform 160ms var(--ease-out); }
@media (hover: hover) and (pointer: fine) {
  html[data-motion-preferences="system"] .footer-legal-v2 .legal-footer__contact:hover .legal-footer__contact-arrow { transform: translateX(4px); }
}
html.blog-keyboard-input .footer-legal-v2 .legal-footer__contact .legal-footer__contact-arrow { transform: none; transition: none; }
html.blog-keyboard-input .zuvani-nav-link:focus-visible .zuvani-nav-link-text::after { transform: scaleX(1); }


/* Photos provide depth; the letters and reading copy do not track scroll. */
.hero { height: auto; min-height: max(100svh, var(--blog-hero-min-height, 32rem)); }
.hero-panel, .hero-copy, .hero-copy__depth { will-change: auto; }
.hero-panel__depth { transition: none; }
.hero-panel img, .hero-panel:hover img {
  transform: scale(1.045); filter: saturate(.92) contrast(1.03); transition: none; will-change: auto;
}
.hero-panel__letter, .hero-panel:hover .hero-panel__letter { transform: translate(-50%, -50%); transition: none; }
.hero-copy__depth { transform: none; flex-wrap: wrap; gap: 16px 32px; }
.hero-copy__text { min-width: 0; flex: 1 1 220px; overflow-wrap: anywhere; }
.hero-link, .hero-link:hover {
  min-width: 0; max-width: 100%; min-height: 44px; flex: 0 1 auto;
  gap: 14px; padding-block: 8px; overflow-wrap: anywhere; transition: none;
}
.hero-link span { flex-shrink: 0; }
.category-nav button { min-height: 44px; overflow-wrap: anywhere; }
.articles { scroll-margin-top: calc(var(--blog-header-height, 84px) + 16px); }
.articles:is(.is-all-stories, .is-experiences) .article-card.featured-story-card {
  width: min(760px, 100%); animation: none; opacity: 1; transform: none;
  transition: opacity 180ms var(--ease-out);
}
.articles:is(.is-all-stories, .is-experiences) .article-card.featured-story-card.is-filter-pending { opacity: .85; }
.articles:is(.is-all-stories, .is-experiences) .featured-story-card:hover { transform: none; }
.articles:is(.is-all-stories, .is-experiences) .featured-story-card .featured-story-card__image,
.articles:is(.is-all-stories, .is-experiences) .featured-story-card:hover .featured-story-card__image { transform: none; transition: none; }
.featured-story-card__arrow, .hero-link span { transition: transform 160ms var(--ease-out); }
.featured-story-card:hover .featured-story-card__arrow { transform: none; }
@media (hover: hover) and (pointer: fine) {
  .featured-story-card:hover .featured-story-card__arrow, .hero-link:hover span { transform: translateX(4px); }
}
html.blog-page :is(a, button, input, [tabindex]):focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
html.blog-keyboard-input :is(.article-card, .featured-story-card__arrow) { transition: none !important; }
html.blog-page .footer-legal-v2 .legal-footer__reveal { opacity: 1; transform: none; transition: none; }

/* Static copy/native email survive blocked scripts and provider outages. */
.blog-newsletter__feedback { max-width: 760px; margin-inline: auto; }
#blog-signup-status { margin: 16px 0 0; font-size: var(--text-caption); line-height: var(--leading-caption); }
#blog-signup-status:empty { margin: 0; }
.blog-newsletter__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; margin-top: 8px; }
.blog-newsletter__actions[hidden], .blog-newsletter__actions [hidden] { display: none; }
.blog-newsletter__actions :is(a, button) {
  display: inline-flex; align-items: center; justify-content: center; min-height: 44px;
  padding: 8px 12px; color: var(--espresso); font: inherit; font-size: var(--text-caption);
  border: 1px solid var(--bronze); background: transparent; cursor: pointer;
}
.blog-newsletter__actions button:disabled { cursor: wait; opacity: .6; }
/* Legacy provider presentation, retained for any remaining embedded form. */
html .blog-newsletter [data-ff-el="root"].ff-6a9d2727fb641b4bf319cf58 :is([class$="__title"], [class$="__subtitle"]) { display: none; }
html .blog-newsletter [data-ff-el="root"].ff-6a9d2727fb641b4bf319cf58 form { padding: 0; background: transparent; }
html .blog-newsletter [data-ff-el="root"].ff-6a9d2727fb641b4bf319cf58 .fd-form-control {
  height: auto; min-height: 44px; font-size: var(--text-body-sm); line-height: var(--leading-body-sm);
}
html .blog-newsletter [data-ff-el="root"].ff-6a9d2727fb641b4bf319cf58 .fd-form-label { font-size: var(--text-body-sm); line-height: var(--leading-body-sm); }
html .blog-newsletter [data-ff-el="root"].ff-6a9d2727fb641b4bf319cf58 form :is(.fd-form-check__label, .fd-form-feedback) {
  font-size: var(--text-caption); line-height: var(--leading-caption); overflow-wrap: anywhere;
}
html .blog-newsletter [data-ff-el="root"].ff-6a9d2727fb641b4bf319cf58 .fd-btn {
  height: auto; min-height: 44px; white-space: normal; font-size: var(--text-label); line-height: var(--leading-label);
}
html .blog-newsletter [data-ff-el="root"].ff-6a9d2727fb641b4bf319cf58 [class$="__success-message"] { font-size: var(--text-body); line-height: var(--leading-body); }
/* Flodesk centres the Subscribe button on the whole field block, labels
   included, and gives it a 10px top margin, which left it 16px above the
   middle of the inputs. Bottom-align it to the row instead, then lift it by
   half the difference between the 58px inputs and the 46px button so the two
   are centred on each other. On phones the button drops to its own row below
   the consent line, where this rule is not applied. */
@media (min-width: 641px) {
  html .blog-newsletter [data-ff-el="root"].ff-6a9d2727fb641b4bf319cf58 [class$="__footer"] { align-self: flex-end; margin-bottom: 6px; }
}

/* Newsletter section and raw form: see 04_js/blog-newsletter.css (shared with articles). */
@media (max-width: 1000px) {
  .footer-legal-v2 .legal-footer__identity { grid-template-columns: minmax(0, 1fr); }
  .footer-legal-v2 :is(.legal-footer__brand-link, .legal-footer__zuvani-name, .legal-footer__credentials) { min-width: 0; }
}
@media (max-width: 640px) {
  .site-header:not(.home-header-v3) { grid-template-columns: auto minmax(var(--blog-brand-slot), 1fr) auto; gap: 8px; padding-inline: 16px; }
  .site-header:not(.home-header-v3) .inquire-link { padding-inline: 12px; }
  .site-header.header-is-crowded { grid-template-columns: minmax(0, 1fr) auto; padding-block: 10px; }
  .site-header.header-is-crowded .brand { grid-column: 1 / -1; grid-row: 1; width: 120px; height: 64px; }
  .site-header.header-is-crowded .menu-toggle, .site-header.header-is-crowded .inquire-link { grid-row: 2; }
  .site-header.header-is-crowded .inquire-link { grid-column: 2; }
  .site-header.header-is-crowded .menu-toggle { flex-direction: column; gap: 2px; align-items: start; }
  .hero-copy__text { flex-basis: 140px; }
  .footer-legal-v2 :is(.legal-footer__closing, .legal-footer__brand-line, .legal-footer__affiliation-copy, .legal-footer__protection-copy) { overflow-wrap: anywhere; }
  .footer-legal-v2 .legal-footer__zuvani-word { font-size: min(clamp(2.7rem, 14vw, 3.5rem), 17vw); }
  .footer-legal-v2 .legal-footer__collective-word { letter-spacing: .24em; text-indent: .24em; }
}
@media (prefers-reduced-motion: reduce) {
  html.blog-page { scroll-behavior: auto; }
  html.blog-page :is(.hero-panel__depth, .hero-copy__depth, .zuvani-nav-overlay, .zuvani-nav-link, .zuvani-nav-meta) { transform: none !important; transition: none !important; }
  html.blog-page :is(.article-card, a, button, a span, .featured-story-card__arrow, .zuvani-nav-backdrop) { animation: none !important; transition: none !important; }
  html.blog-page :is(.hero-link span, .featured-story-card__arrow) { transform: none !important; }
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
  /* Accessibility preferences retain a solid surface and dark controls. */
  html[data-motion-preferences="system"] .site-header.site-header--full-wordmark {
    background: #f3ede0; color: #231a10; border-bottom-color: rgba(35, 26, 16, .12);
  }
  html[data-motion-preferences="system"] .site-header.site-header--full-wordmark .menu-toggle {
    color: #231a10; text-shadow: none;
  }
  html[data-motion-preferences="system"] .site-header.site-header--full-wordmark :is(.header-icon, .menu-toggle svg) { filter: none; }
  html.blog-page .site-header:not(.nav-overlay-active), html.blog-page .zuvani-nav-overlay { background: #f3ede0; color: #231a10; backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; }
  .zuvani-nav-backdrop { backdrop-filter: none; -webkit-backdrop-filter: none; }
}