/* A native-scroll story; content remains readable without JavaScript. */
.family-landing {
  --landing-paper: var(--brand-paper);
  --landing-surface: var(--brand-surface);
  --landing-ink: var(--brand-ink);
  --landing-muted: var(--brand-muted);
  --landing-rule: var(--brand-rule);
  --story-olive: var(--brand-olive);
  --action-fill: var(--brand-clay);
  --action-text: var(--brand-action-text);
  --action-link: var(--brand-clay);
  --story-header: 68px;
  color: var(--landing-ink);
  background: var(--landing-paper);
  padding: 0;
  max-width: none;
}
.family-landing :is(h1,h2,h3,p) { margin: 0; font-family: var(--camel); }
.family-landing :is(h1,h2,h3) { font-weight: 400; line-height: 1.35; }
.family-landing.site-v4 > .masthead-nav {
  position: sticky; top: 0; z-index: 20; min-height: var(--story-header);
  background: var(--landing-surface); color: var(--landing-ink); backdrop-filter: none;
}
.family-landing.site-v4 > .masthead-nav .sticky-brand { display: inline-flex; width: auto; min-height: 44px; gap: 8px; }
.family-landing.site-v4 > .masthead-nav .sticky-brand-wordmark { display: block; width: 165px; height: auto; }
.family-landing.site-v4 > .masthead-nav :is(.site-nav a,.language-switch button) {
  color: var(--landing-muted); font-size: var(--type-nav); min-height: 44px; display: inline-flex; align-items: center;
}
.friday-story { position: relative; background: var(--landing-paper); }
.story-stage { display: none; }
.story-chapter { background: var(--landing-paper); color: var(--landing-ink); }
.story-chapter.story-cafe { background: var(--landing-paper); color: var(--landing-ink); }
.chapter-copy { padding: 64px clamp(28px,5vw,80px); }
.family-landing .chapter-copy :is(h1,h2) { max-width: 13ch; font-size: var(--type-display); font-weight: 400; }
.family-landing .chapter-copy p { max-width: 480px; margin-top: 24px; font-size: var(--type-intro); line-height: 1.8; color: var(--landing-muted); }
.chapter-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.story-button, .family-landing .home-latest-link {
  display: inline-flex; align-items: center; justify-content: center; min-height: 52px;
  padding: 12px 28px; border: 1px solid transparent; border-radius: 999px;
  color: var(--action-link); background: transparent; text-decoration: none; font-size: 1.125rem; line-height: 1.5;
}
.story-button.primary { background: var(--action-fill); color: var(--action-text); border-color: var(--action-fill); }
.story-button.secondary { color: var(--action-link); border-color: var(--action-link); }
.story-button.secondary:hover { background: var(--landing-paper); text-decoration: none; }
.story-button.primary:hover { filter: brightness(1.08); }
.chapter-actions .story-button { min-width: 152px; }
.chapter-cta { margin-top: 28px; }
.story-cafe .story-button.primary { color: var(--action-text); background: var(--action-fill); border-color: var(--action-fill); }
.story-button:active { transform: translateY(1px); }
.chapter-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 12px 28px; margin-top: 20px; }
.chapter-meta :is(.story-about,.story-continue) { margin: 0; }
.chapter-meta { color: var(--landing-muted); }
.chapter-actions .story-button { min-width: 158px; }
.story-about { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px 20px; border-radius: 999px; background: var(--landing-paper); color: var(--landing-ink); border: 1px solid var(--landing-rule); font-size: 1rem; line-height: 1.5; text-decoration: none; }
.story-about:hover { border-color: var(--landing-muted); }
.story-inline, .story-continue {
  display: table; width: fit-content; min-height: 44px; padding-block: 12px;
  margin-top: 18px; color: inherit; text-decoration: underline; text-underline-offset: 7px;
  font-size: 1.125rem;
}
.story-continue { opacity: .85; text-decoration: none; font-size: 1rem; }
.story-continue::after { content: none; }
.chapter-photo { display: block; height: 420px; overflow: hidden; background: var(--landing-paper); }
.chapter-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.story-talk .chapter-photo img { object-position: center 24%; }
.story-chapter { scroll-margin-top: var(--story-header); }
.family-landing :is(.story-explore,.home-latest) { max-width: 1180px; padding: 56px 40px; margin: auto; }
.family-landing .story-explore h2, .family-landing .home-latest h2 { font-size: var(--type-section); }
.story-explore > div { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 28px; }
.explore-option { display: grid; grid-template-columns: minmax(0,1fr); align-items: stretch; gap: 24px; padding: 16px; border: 1px solid var(--landing-rule); border-radius: 24px; background: var(--landing-surface); color: inherit; text-decoration: none; }
.explore-option > img { display: block; width: 100%; height: auto; aspect-ratio: 16/9; object-fit: cover; object-position: center 55%; border-radius: 14px; }
.explore-option:first-child > img { object-position: center 40%; }
.explore-copy { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 10px; padding-block: 12px; }
.family-landing .explore-copy h3 { font-size: var(--type-card); }
.family-landing .explore-copy p { font-size: 1.125rem; color: var(--landing-muted); line-height: 1.6; }
.explore-cta { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 18px; margin-top: 8px; border-radius: 999px; border: 1px solid var(--action-link); color: var(--action-link); font-size: 1rem; line-height: 1.5; }
.explore-option:hover { border-color: var(--landing-muted); }
.explore-option:hover .explore-cta { color: var(--action-text); background: var(--action-fill); border-color: var(--action-fill); }
.family-landing .home-latest { border-top: 0; padding-top: 24px; }
.home-latest-heading { margin-bottom: 24px; }
.family-landing .home-latest-card { display: grid; grid-template-columns: .8fr 1.2fr; gap: 40px; color: inherit; text-decoration: none; }
.home-latest-media { display: block; height: 310px; background: var(--landing-surface); }
.home-latest-media img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; }
.home-latest-media.is-missing { background: var(--landing-surface) url('../brand-identity/assets/signature-mark.svg') center / 64px no-repeat; }
.home-latest-copy { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 16px; min-width: 0; }
.home-latest-meta { color: var(--landing-muted); font-size: .95rem; }
.family-landing .home-latest-copy h3 { font-size: var(--type-feature); }
.home-latest-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 28px; width: 100%; }
.home-latest-facts p { display: flex; flex-direction: column; gap: 4px; font-size: 1rem; line-height: 1.65; }
.home-latest-facts span { color: var(--landing-muted); font-size: .875rem; }
.home-latest-facts strong { font-weight: 400; text-align: start; }
.family-landing .home-latest-link { font-size: 1rem; color: var(--action-text); background: var(--action-fill); border-color: var(--action-fill); }
.family-landing .home-latest-card:hover .home-latest-link { color: var(--action-text); background: var(--action-fill); border-color: var(--action-fill); filter: brightness(1.08); }
.home-latest-media { border-radius: 24px; overflow: hidden; }
.family-landing.site-v4 > .site-footer {
  margin: 0; padding: 32px max(24px,calc((100vw - 1200px) / 2));
  background: var(--landing-surface); color: var(--landing-ink);
}
.family-landing.site-v4 > .site-footer :is(a,.footer-tagline-text),
.family-landing.site-v4 > .site-footer .footer-links a[aria-current="page"] { color: var(--landing-ink); }
.family-landing.site-v4 > .site-footer :is(.footer-mark,.footer-tagline) { filter: none; }
html[data-theme="dark"] .family-landing.site-v4 > .site-footer :is(.footer-mark,.footer-tagline) { filter: brightness(0) invert(1); }
.family-landing a { transition: background-color .2s ease, border-color .2s ease, filter .2s ease; }
.family-landing a:focus-visible { outline: 3px solid var(--action-link); outline-offset: 5px; }
@media (min-width: 761px) {
  .story-chapter { display: grid; grid-template-columns: 52% 48%; min-height: calc(100svh - var(--story-header)); }
  .chapter-copy { align-self: center; }
  .chapter-photo { height: 100%; min-height: 560px; }
  .friday-story.is-enhanced { display: grid; grid-template-columns: 52% 48%; align-items: start; }
  .is-enhanced .story-stage {
    display: block; position: sticky; top: var(--story-header); grid-column: 2; grid-row: 1;
    height: calc(100svh - var(--story-header)); overflow: hidden; background: var(--landing-surface);
  }
  .is-enhanced .story-stage .chapter-photo { position: absolute; inset: 0; height: auto; min-height: 0; border-radius: 0; opacity: 0; transition: opacity .6s ease; }
  .is-enhanced .story-stage .chapter-photo.is-current { opacity: 1; }
  .is-enhanced .story-stage img { transform: scale(1.04); }
  .is-enhanced .story-chapters { grid-column: 1; grid-row: 1; }
  .is-enhanced .story-chapter { display: flex; align-items: center; min-height: calc(110svh - var(--story-header)); }
  .is-enhanced .story-welcome { min-height: calc(100svh - var(--story-header)); }
  .is-enhanced .story-chapter > .chapter-photo { display: none; }
}
@media (max-width: 760px) {
  .family-landing { --story-header: 108px; }
  .family-landing.site-v4 > .masthead-nav { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 12px 20px 0; }
  .family-landing.site-v4 > .masthead-nav .sticky-brand { grid-column: 1; grid-row: 1; }
  .family-landing.site-v4 > .masthead-nav .sticky-brand-wordmark { width: 132px; }
  .family-landing.site-v4 > .masthead-nav .language-switch { grid-column: 2; grid-row: 1; }
  .family-landing.site-v4 > .masthead-nav .site-nav { grid-column: 1 / -1; grid-row: 2; width: 100%; justify-content: space-between; gap: 8px; }
  .family-landing.site-v4 > .masthead-nav :is(.site-nav a,.language-switch button) { font-size: .95rem; }
  .chapter-copy { padding: 40px 24px; }
  .chapter-actions { gap: 10px; }
  .chapter-actions .story-button { flex: 1 1 120px; min-width: 0; padding-inline: 16px; font-size: 1rem; }
  .family-landing .chapter-copy :is(h1,h2) { font-size: var(--type-display); }
  .family-landing .chapter-copy p { font-size: var(--type-intro); margin-top: 20px; }
  .chapter-photo { height: min(52svh,420px); }
  .story-chapter > .chapter-photo { margin: 0 0 24px; border-radius: 0; }
  .family-landing :is(.story-explore,.home-latest) { padding: 40px 24px; }
  .story-explore > div { grid-template-columns: 1fr; gap: 16px; }
  .explore-option { grid-template-columns: minmax(0,1fr); padding: 12px; gap: 16px; border-radius: 20px; }
  .explore-option > img { height: auto; }
  .family-landing .explore-copy h3 { font-size: var(--type-card); }
  .family-landing .explore-copy p { font-size: 1rem; }
  .explore-cta { padding-inline: 12px; }
  .family-landing .home-latest-card { grid-template-columns: 1fr; gap: 24px; }
  .home-latest-media { height: 240px; }
}
@media (max-width: 360px) {
  .chapter-actions .story-button { flex-basis: 100%; }
  .explore-option { grid-template-columns: minmax(0,1fr); gap: 12px; }
  .explore-option > img { height: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .family-landing *, .family-landing *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}

/* Content previews share a quiet, rounded edge; full-bleed story media stays square. */
.family-landing :is(.explore-option, .explore-option > img, .home-latest-media) { border-radius: 16px; }

.home-newsletter { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px; padding: 28px 8%; background: #30392e; color: #f4ecdd; }
.home-newsletter h2, .home-invitation h2 { margin: 0 0 20px; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.3; font-weight: 400; }
.home-newsletter p, .home-invitation p { line-height: 1.8; }
.home-newsletter h2 { margin: 0 0 6px; font-size: clamp(1.5rem, 2.2vw, 2rem); }
.home-newsletter p { margin: 0; }
.home-newsletter .home-mail-note { margin-top: 8px; }
.home-newsletter .story-button { color: #f4ecdd; border-color: #f4ecdd; background: transparent; }
.home-newsletter .story-button:is(:hover, :focus-visible) { background: #f4ecdd; color: #211c17; border-color: #f4ecdd; }
.home-mail-note { font-size: .9rem; }
.home-invitation { display: grid; grid-template-columns: 40% 60%; background: #ce694d; color: #211c17; }
.home-invitation > img { display: block; width: 100%; min-width: 0; height: 520px; object-fit: cover; object-position: center 48%; }
.home-invitation-copy { align-self: center; padding: clamp(32px, 6vw, 88px); }
.home-invitation .story-button { margin-top: 20px; background: #f4ecdd; color: #211c17; border-color: #211c17; }
.home-invitation .story-button:is(:hover, :focus-visible) { background: #211c17; color: #f4ecdd; border-color: #211c17; }
@media (max-width: 760px) {
  .home-newsletter, .home-invitation { grid-template-columns: 1fr; }
  .home-newsletter { gap: 20px; }
  .home-invitation > img { height: 280px; }
}