/* Home page specific styles (built on top of base.css) */

/* Hero */
.hero {
  position: relative;
  min-height: 78vh;
  display: grid;
  align-items: end;
  background: var(--color-charcoal);
  color: var(--color-text-inverse);
}
.hero-media { position: absolute; inset: 0; overflow: hidden; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; opacity: 0.75; filter: saturate(0.95) contrast(1.05); }
.hero-content { position: relative; padding-top: var(--space-24); padding-bottom: var(--space-20); color: var(--color-text-inverse); }
.hero .eyebrow { display: inline-block; margin-bottom: var(--space-3); font-size: var(--text-sm); letter-spacing: var(--tracking-widest); text-transform: uppercase; color: var(--color-primary-light); }
.hero h1 { color: var(--color-champagne); text-shadow: 0 2px 16px rgba(0,0,0,0.35); }
.hero p { color: var(--color-champagne); max-width: 60ch; }

/* Sections */
.section { padding: var(--space-16) 0; }
.section:nth-of-type(even) { background: var(--color-champagne-light); }

/* Media frame ensures gentle rounded corners and shadow */
.media-frame img { border-radius: var(--radius-sm); box-shadow: var(--shadow-xl); }

/* Utility margin top for CTAs when needed */
.mt-6 { margin-top: var(--space-6); }

/* Recommendations cards without images */
.reco-card .card-body { display: grid; gap: var(--space-3); }
.reco-card h3 { margin: 0; }
.reco-meta { font-size: var(--text-sm); color: var(--color-text-muted); }
