/* Homepage composition; other public pages keep their existing layouts. */
@layer components {
  .home-page .section { padding-block: clamp(4rem, 7vw, 7rem); }
  .home-page .home-hero {
    min-block-size: clamp(34rem, 81svh, 48rem);
    padding-block: 5rem clamp(3rem, 6vw, 6rem);
  }
  .home-hero::before {
    background: linear-gradient(90deg, rgb(33 28 24 / .79), rgb(33 28 24 / .27) 55%, rgb(33 28 24 / .06)), linear-gradient(0deg, rgb(33 28 24 / .25), transparent 55%);
  }
  .home-hero h1 { font-size: clamp(3.4rem, 6.5vw, 6.3rem); line-height: 1.02; letter-spacing: -.035em; max-inline-size: 11ch; }
  .home-hero .hero__actions { gap: 1.5rem 2rem; align-items: center; margin-block-start: 2rem; }
  .home-hero .home-link { color: var(--color-cream); }
  .home-link { display: inline-flex; align-items: center; gap: 1rem; min-block-size: 44px; color: inherit; text-decoration: none; font-size: var(--fs--1); font-weight: 500; }
  .home-link:hover { text-decoration: underline; text-underline-offset: .3em; }
  .home-arrow { flex: 0 0 auto; transition: transform var(--dur-mid) var(--ease); }
  .home-link:hover .home-arrow { transform: translateX(4px); }
  .home-intro { display: grid; gap: .5rem; padding-block-end: clamp(2.5rem, 5vw, 5rem); }
  .home-intro h2 { font-family: var(--font-body); font-size: var(--fs--1); font-weight: 500; }
  .home-intro .lede { font-family: var(--font-heading); font-size: clamp(1.8rem, 3.2vw, 3rem); font-weight: 600; letter-spacing: -.025em; line-height: 1.25; max-inline-size: 29ch; }
  .home-kinds { display: grid; gap: 3rem; }
  .home-kind { min-inline-size: 0; }
  .home-kind__photo { display: block; overflow: hidden; background: var(--color-surface); }
  .home-kind__photo img { inline-size: 100%; block-size: 100%; aspect-ratio: 1.12; object-fit: cover; object-position: 50% 43%; transition: transform var(--dur-slow) var(--ease); }
  .home-kind__photo:hover img { transform: scale(1.025); }
  .home-kind--connect .home-kind__photo img { object-position: 50% 65%; }
  /* M34 rider: no static picture ships; the empty frame keeps the card's shape and shows the mark, as the portraits do */
  .home-kind__photo--empty { display: grid; place-items: center; aspect-ratio: 1.12; color: var(--color-text-muted); }
  .home-kind__photo--empty .logo-mark { inline-size: 4rem; block-size: auto; }
  .home-kind__copy { padding-block-start: 1.5rem; display: grid; gap: .65rem; }
  .home-kind h3 { font-size: clamp(2.2rem, 3.8vw, 3.6rem); letter-spacing: -.03em; }
  .home-kind p { max-inline-size: 33ch; color: var(--color-text-muted); }
  .home-kind .home-link { justify-self: start; margin-block-start: .25rem; border-block-end: var(--border); }
  .home-page .home-upcoming { padding-block-start: 0; }
  .home-section-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; border-block-start: var(--border); padding-block: 2rem; }
  .home-section-heading h2 { font-size: clamp(2rem, 3.5vw, 3.3rem); letter-spacing: -.03em; }
  .home-section-heading > a { flex-shrink: 0; }
  .home-event { color: inherit; text-decoration: none; display: grid; gap: 2rem; padding-block-end: 2rem; }
  .home-event__media { overflow: hidden; background: var(--color-surface); aspect-ratio: 1.15; }
  .home-event__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; transition: transform var(--dur-slow) var(--ease); }
  .home-event__media--empty { display: grid; place-items: center; }
  .home-event__media--empty .logo-mark { width: 5rem; height: auto; color: var(--color-accent); }
  .home-event__copy { display: grid; align-content: center; justify-items: start; gap: 1.25rem; }
  .home-event__eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; font-size: .75rem; font-weight: 500; text-transform: uppercase; letter-spacing: .1em; color: var(--color-text-muted); }
  .home-event__eyebrow span { border-inline-start: var(--border); padding-inline-start: 1rem; }
  .home-event h3 { font-size: clamp(2.8rem, 4.8vw, 4.5rem); line-height: 1.04; letter-spacing: -.035em; }
  .home-event__summary { font-size: var(--fs-1); color: var(--color-text-muted); }
  .home-event__when { margin-block-start: .5rem; font-size: var(--fs-0); }
  .home-event__arrow { width: 3.25rem; height: 3.25rem; display: grid; place-items: center; border: 1px solid var(--color-control-border); border-radius: 50%; margin-block-start: .5rem; transition: color var(--dur-mid), background var(--dur-mid); }
  .home-event:hover .home-event__arrow { color: var(--color-cream); background: var(--color-accent); border-color: var(--color-accent); }
  .home-event:hover img { transform: scale(1.025); }
  .home-events > .event-row:not(:first-child) .event-row__link { padding-block: 1.5rem; }
  @media (min-width: 760px) {
    .home-kinds { grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); }
    .home-event { grid-template-columns: 1.12fr 1fr; gap: clamp(2rem, 6vw, 6rem); padding-block-end: 3rem; }
    .home-event__media { aspect-ratio: 1.12; }
  }
  @media (max-width: 759px) {
    .home-page .home-hero { min-block-size: 36rem; padding-block: 3rem; }
    .home-hero h1 { font-size: clamp(3.4rem, 10vw, 4.5rem); }
    .home-hero::before { background: linear-gradient(0deg, rgb(33 28 24 / .83), rgb(33 28 24 / .25) 70%, rgb(33 28 24 / .12)); }
    .home-hero .hero__image { object-position: var(--fx, 58%) var(--fy, 50%); }
    .home-section-heading { align-items: start; flex-wrap: wrap; }
    .home-section-heading h2 { max-inline-size: 100%; }
    .home-section-heading .home-link { gap: .5rem; }
  }
  /* M-next: spacing pass from the 390px review (visual-editor session, 2026-09-13).
     Values derived from the reviewed render, expressed against the existing gaps. */
  @media (max-width: 759px) {
    /* uniform 71px visual gap from each block's call to action to the next section */
    .home-kinds { gap: 4.3125rem; }
    .home-page .home-experiences { padding-block-end: 4.3125rem; }
    .home-event { padding-block-end: 4.3125rem; }
    .home-page .site-footer { margin-block-start: 4rem; }
    .home-kind__copy { padding-block-start: .85rem; gap: .3rem; }
    .home-kind .home-link { margin-block-start: 0; }
    .home-section-heading { padding-block: .5rem .8125rem; }  /* + the flow gap (1rem) ≈ the image-to-copy gap */
    .home-event__copy { gap: .65rem; }
    .home-event__summary { line-height: 1.3; }
    .home-event .event-row__meta { margin-block-start: -.6rem; }
    .home-page .section:has(.insta-grid) { padding-block: .35rem; }
  }
  @media (prefers-reduced-motion: reduce) {
    .home-page .home-arrow, .home-page .home-kind__photo img, .home-page .home-event__media img, .home-page .home-event__arrow { transition: none; transform: none; }
  }
}