/* ============================================================
   Landing page (sticky CTA, single-focus pages)
   ============================================================ */

@layer components {
  .lp-hero { padding-block: var(--space-2xl) var(--space-xl); }
  .lp-hero h1 { color: var(--color-primary); }

  /* Slightly more breathing room for LP content sections */
  .lp main section { padding-block: var(--space-2xl); }

  /* Spacer at the bottom so the sticky CTA never covers the final content */
  body.lp { padding-block-end: 0; }
  @media (max-width: 768px) {
    body.lp { padding-block-end: 80px; }
  }

  .gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-md);
  }
  .gallery-grid img {
    border-radius: var(--radius-lg);
    aspect-ratio: 4 / 3;
    object-fit: cover;
    inline-size: 100%;
  }
  @media (max-width: 768px) {
    .gallery-grid { grid-template-columns: repeat(2, 1fr); }
  }

  .map-embed {
    aspect-ratio: 16 / 9;
    border: 0;
    inline-size: 100%;
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-card);
  }

  .hours-list {
    list-style: none;
    max-inline-size: 480px;
    margin-inline: auto;
    background: var(--color-surface);
    border-radius: var(--radius-lg);
    padding: var(--space-lg);
    box-shadow: var(--shadow-card);
  }
  .hours-list li {
    display: flex;
    justify-content: space-between;
    padding-block: var(--space-xs);
    border-block-end: 1px solid var(--color-border);
  }
  .hours-list li:last-child { border-block-end: 0; }
  .hours-list strong { color: var(--color-primary); }
}