/* File: /assets/css/pages/home.css
   Owner: EC
   Purpose: Page-scoped styles unique to the homepage hero & layout
   Version: 1.0
   Updated: 2025-11-09
   Notes (ALCOA-C):
     - Token-driven, zero magic colors
     - Keeps component CSS generic; home-only details live here
*/

/* Hero */
.home-hero { padding-block: calc(var(--space-section-y) * 1.25); }
.home-hero .hero__inner {
  display: grid;
  gap: var(--grid-gap);
  justify-items: center;
  text-align: center;
}

/* Logo showcase */
.home-hero .logo-box {
  position: relative;
  display: inline-grid;
  place-items: center;
}
.home-hero .logo-box .trademark {
  position: absolute;
  top: -0.25rem; right: -0.5rem;
  font-size: 0.8rem;
  color: var(--color-heading);
  opacity: 0.85;
}
.home-hero .logo {
  width: clamp(140px, 32vw, 280px);
  height: auto;
  color: currentColor; /* if inline SVG uses currentColor */
}

/* Tagline */
.home-hero .tagline {
  font-family: var(--font-display);
  font-weight: var(--weight-extrabold);
  font-size: var(--text-h2-size);
  line-height: var(--lh-heading);
  color: var(--color-heading);
}
.home-hero .tagline .service-mark {
  font-size: 0.75em; opacity: 0.9; margin-left: 0.15em;
}

/* Quick actions row */
.home-hero .actions { display: inline-flex; gap: 0.5rem; }

/* Decorative chevrons (subtle hint) */
.home-hero .chevrons { display: inline-flex; gap: 0.35rem; color: var(--color-link); opacity: 0.9; }

/* Section tone helpers for home */
.section--muted  { background: var(--color-surface); border-block: var(--border-width) solid var(--color-border); }
.section--invert { background: var(--color-bg); color: var(--color-body); }

/* Cards inside home sections */
.home-cards .card { height: 100%; } /* equal-height grid cards */