/* ==========================================================================
   Home page (views/pages/home.erb). Tokens only — no hex here.
   ========================================================================== */

/* ---- 1. Hero -------------------------------------------------------------- */
.page-home .hero__title { max-width: 20ch; font-size: clamp(2.375rem, 5vw, 4.5rem); }
.page-home .hero__title .accent { white-space: normal; }
.page-home .hero__glass { max-width: 400px; padding: 1.25rem 1.5rem; }
.home-hero-badge { display: flex; align-items: center; gap: 1rem; }
.home-hero-badge__kicker {
  display: block; font-size: .75rem; text-transform: uppercase; letter-spacing: var(--ls-eyebrow);
  color: var(--brand-lime); font-weight: var(--fw-medium); margin-bottom: .15rem;
}
.glass-card .home-hero-badge__title {
  margin: 0 0 .2rem; font-size: 1.0625rem; font-weight: var(--fw-bold); text-transform: uppercase; line-height: 1.2;
}
.glass-card .home-hero-badge__text { margin: 0; font-size: .875rem; line-height: 1.45; color: var(--color-text-on-dark-muted); }

/* ---- 2. Intro: two overlapping photos ------------------------------------- */
.home-intro__media { position: relative; padding: 0 12% 14% 0; }
.home-intro__photo { border-radius: var(--radius-lg); overflow: hidden; background: var(--gradient-green); }
.home-intro__photo--main { aspect-ratio: 5 / 4; box-shadow: var(--shadow-soft); }
.home-intro__photo--inset {
  position: absolute; right: 0; bottom: 0; width: 48%; aspect-ratio: 4 / 3;
  border: 8px solid var(--surface-page); box-shadow: var(--shadow-soft);
}
.home-intro__photo img { display: block; }
.home-intro__seal {
  position: absolute; left: -12px; bottom: 6%; width: 124px; height: 124px; border-radius: 50%;
  display: grid; place-content: center; justify-items: center; gap: .35rem; text-align: center;
  background: var(--gradient-green-band); color: var(--white); box-shadow: var(--shadow-glow);
  font-size: .6875rem; line-height: 1.2; font-weight: var(--fw-medium); text-transform: uppercase; letter-spacing: var(--ls-eyebrow);
}
.home-intro__seal img { width: 46px; height: auto; }
.home-intro__title { font-size: clamp(2rem, 3.2vw, 2.875rem); }
.home-intro__copy p:not(.lead-text) { color: var(--color-text-muted); }
.home-intro__copy .lead-text { color: var(--color-text); }
.home-intro__list { margin: 1.75rem 0 2.25rem; }
.home-intro__list li { font-weight: var(--fw-medium); color: var(--color-heading); }
.home-intro__call { display: inline-flex; align-items: center; gap: .85rem; text-decoration: none; color: var(--color-heading); font-weight: var(--fw-bold); font-size: 1.125rem; }
.home-intro__call small { display: block; font-size: .75rem; font-weight: var(--fw-medium); text-transform: uppercase; letter-spacing: var(--ls-eyebrow); color: var(--color-text-muted); }
.home-intro__call .icon-badge { width: 48px; height: 48px; font-size: 1.15rem; transition: background-color var(--dur-fast), color var(--dur-fast); }
.home-intro__call:hover { color: var(--color-primary); }
.home-intro__call:hover .icon-badge { background: var(--color-primary); color: var(--white); }
@media (max-width: 575.98px) {
  .home-intro__seal { width: 96px; height: 96px; font-size: .5625rem; left: -4px; }
  .home-intro__seal img { width: 34px; }
}

/* ---- 3. Divisions ---------------------------------------------------------- */
.home-divisions__intro { height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: 1rem 1rem 1rem 0; }
.home-divisions__intro h2 { font-size: clamp(2rem, 3vw, 2.75rem); }
.home-divisions__intro .lead-text { color: var(--color-text-muted); margin-bottom: 1.75rem; }

/* ---- 5. Why Encore band ------------------------------------------------------ */
.home-why .lead-text { color: var(--color-text-on-dark-muted); }
.home-why__card { height: 100%; padding: 1.75rem; }
.home-why__card .stat-tile { padding: 0 0 1rem; margin-bottom: 1rem; border-bottom: 1px solid var(--surface-glass-border); }
.home-why__card .stat-tile__value { color: var(--white); }
.home-why__card .stat-tile__label { color: var(--brand-lime); }
.home-why__card p { font-size: .9375rem; line-height: 1.55; color: var(--color-text-on-dark-muted); }

/* ---- 6. Featured work mosaic ---------------------------------------------- */
.home-work__head { margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.home-work__grid { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
.home-work__grid .photo-card { height: 100%; }
@media (min-width: 768px) {
  .home-work__grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 280px; }
  .home-work__grid .photo-card { aspect-ratio: auto; }
  .home-work__item--1 { grid-column: span 2; }
}
@media (min-width: 992px) {
  .home-work__grid { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 300px; }
  .home-work__item--1 { grid-column: auto; grid-row: span 2; }
}

/* ---- 7. Recognition --------------------------------------------------------- */
.home-awards__title { font-size: clamp(1.75rem, 2.6vw, 2.375rem); max-width: 22ch; }
.home-awards__row { display: grid; gap: 1.5rem; grid-template-columns: 1fr; align-items: stretch; }
.home-awards__badges { display: grid; gap: 1rem; grid-template-columns: 1fr; margin: 0; }
@media (min-width: 768px) { .home-awards__badges { grid-template-columns: repeat(3, 1fr); } }
.home-awards__badge {
  display: flex; align-items: center; gap: .9rem; padding: 1.1rem 1.25rem; height: 100%;
  background: var(--surface-card); border-radius: var(--radius); box-shadow: var(--shadow-soft);
}
.home-awards__badge .bi {
  flex: none; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center;
  background: var(--surface-green-tint); color: var(--color-primary); font-size: 1.25rem;
}
.home-awards__badge strong { display: block; color: var(--color-heading); font-weight: var(--fw-bold); line-height: 1.25; font-size: .9688rem; text-transform: uppercase; }
.home-awards__badge small { display: block; color: var(--color-text-muted); font-size: .8125rem; margin-top: .2rem; }
.home-awards__logos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 0; }
.home-awards__logos li {
  background: var(--surface-card); border-radius: var(--radius); padding: .75rem;
  display: grid; place-items: center; min-height: 104px; box-shadow: var(--shadow-soft);
}
.home-awards__logos img { height: 80px; width: auto; max-width: 100%; object-fit: contain; }
@media (min-width: 768px) {
  .home-awards__logos { display: flex; flex-wrap: wrap; justify-content: center; }
  .home-awards__logos li { padding: .75rem 2rem; }
}

/* ---- 8. Careers teaser ----------------------------------------------------- */
.home-careers { overflow: hidden; }
.home-careers__agave {
  position: absolute; left: -6%; bottom: -14%; width: min(560px, 60vw); height: auto;
  opacity: .07; pointer-events: none;
}
.home-careers__lockup { display: block; width: min(300px, 70%); height: auto; margin-bottom: 1.75rem; }
.home-careers .lead-text { color: var(--color-text-on-dark-muted); }
.home-careers__photo { position: relative; border-radius: var(--radius-lg); overflow: hidden; aspect-ratio: 4 / 3; box-shadow: var(--shadow-soft); }
.home-careers__badge {
  position: absolute; left: 1rem; bottom: 1rem; right: auto; max-width: calc(100% - 2rem);
  display: flex; align-items: center; gap: .9rem; padding: .75rem 1.1rem .75rem .75rem;
  background: var(--surface-navy-glass);
}
.home-careers__badge img { width: 56px; height: 56px; border-radius: 6px; background: var(--white); flex: none; }
.home-careers__badge p { margin: 0; font-size: .8125rem; line-height: 1.35; color: var(--color-text-on-dark-muted); }
.home-careers__badge strong { display: block; color: var(--white); text-transform: uppercase; letter-spacing: .02em; font-size: .875rem; }
