/*
  Shared styling for the homepage sections below the hero.

  No computed-style evidence exists for these sections (the forensic
  project scoped its capture to the hero mechanism only — see
  projects/terminal-industries/analysis/hero-forensic-report.md's
  "scope" front-matter). Section presence, order, and purpose come from
  a lightweight structural read of the live reference homepage
  (necessary to satisfy "do not stop after the hero" / "trace the
  homepage top to bottom" — not a re-run of the forensic pipeline).
  Spacing/type/color values here are an original BRIGHTIRIS design
  decision built on the tokens in tokens.css, not measured from the
  reference. Documented as a limitation, not presented as recovered.
*/

/* :not(.hero) — the hero manages its own 300vh scroll-distance height
   precisely (css/hero.css); this rule adding padding to it too pushed
   the sticky stage 96px past its own top, which overflowed the
   sticky stage past the viewport bottom while unstuck (verified live:
   caused the scroll-hint and, transiently, the captions to render
   outside the visible viewport at scroll-top). */
section:not(.hero) { padding-block: var(--space-9); }

/* Logo strip */
.logo-strip { padding-block: var(--space-7); border-bottom: 1px solid var(--color-border); }
.logo-strip__heading {
  text-align: center;
  color: var(--color-text-faint);
  font-size: var(--fs-small);
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  margin-bottom: var(--space-6);
}
.logo-strip__track {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-6) var(--space-7);
}
.logo-strip__item {
  color: var(--color-text-faint);
  font-family: var(--font-display);
  font-weight: 600;
  font-size: 1.05rem;
  opacity: 0.7;
  transition: opacity var(--dur-fast) var(--ease-out);
}
.logo-strip__item:hover { opacity: 1; color: var(--color-text-dim); }

/* Quick start */
.quick-start__grid {
  display: grid;
  gap: var(--space-5);
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 900px) { .quick-start__grid { grid-template-columns: 1fr; } }

.quick-start__card {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}
.quick-start__eyebrow {
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-caps);
  color: var(--color-accent);
}
.quick-start__card h3 { font-size: var(--fs-h3); }
.quick-start__card p { color: var(--color-text-dim); flex-grow: 1; }

/* Calculator */
.calculator { background: var(--color-bg-raised); }
.calculator__inner {
  display: grid;
  gap: var(--space-7);
  grid-template-columns: 1fr 1.15fr;
  align-items: start;
}
@media (max-width: 900px) { .calculator__inner { grid-template-columns: 1fr; } }

.calculator__form {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
}
.calculator__fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
}
@media (max-width: 560px) { .calculator__fields { grid-template-columns: 1fr; } }

.field { display: flex; flex-direction: column; gap: var(--space-2); }
.field label { font-size: var(--fs-small); color: var(--color-text-dim); }
.field input, .field select {
  background: var(--color-surface-2);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: 0.6rem 0.75rem;
  color: var(--color-text);
}
.field input:focus, .field select:focus { border-color: var(--color-accent); }

.calculator__result {
  border-top: 1px solid var(--color-border);
  padding-top: var(--space-5);
}
.calculator__result-label {
  display: block;
  font-size: var(--fs-small);
  color: var(--color-text-dim);
  margin-bottom: var(--space-2);
}
.calculator__result-value {
  font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 700;
  background: var(--gradient-iris);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.calculator__breakdown {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-5);
  margin-top: var(--space-4);
  font-size: var(--fs-small);
  color: var(--color-text-dim);
}
.calculator__breakdown strong { color: var(--color-text); }
.calculator__note {
  font-size: var(--fs-micro);
  color: var(--color-text-faint);
  margin-top: var(--space-4);
}

/* Benefits */
.benefits__layout {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: var(--space-7);
}
@media (max-width: 860px) { .benefits__layout { grid-template-columns: 1fr; } }

.benefits__nav { display: flex; flex-direction: column; }
.benefits__nav-item {
  display: flex;
  align-items: baseline;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  border-bottom: 1px solid var(--color-border);
  cursor: pointer;
  background: none;
  width: 100%;
  text-align: left;
}
.benefits__nav-item .num { font-family: var(--font-display); color: var(--color-text-faint); }
.benefits__nav-item[aria-selected="true"] .num { color: var(--color-accent); }
.benefits__nav-item[aria-selected="true"] .label { color: var(--color-text); }
.benefits__nav-item .label { color: var(--color-text-dim); font-weight: 500; }

.benefits__detail {
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-7);
  display: flex;
  align-items: center;
  min-height: 220px;
}
.benefits__detail h3 { font-size: var(--fs-h3); margin-bottom: var(--space-3); }
.benefits__detail p { color: var(--color-text-dim); }

/* Platform tabs */
.platform__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin-bottom: var(--space-6);
}
.platform__tab {
  padding: 0.55rem 1.1rem;
  border-radius: var(--radius-pill);
  border: 1px solid var(--color-border);
  color: var(--color-text-dim);
  font-size: var(--fs-small);
}
.platform__tab[aria-selected="true"] {
  border-color: var(--color-accent);
  color: var(--color-text);
  background: rgba(110, 231, 255, 0.08);
}
.platform__panel {
  display: none;
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-7);
  gap: var(--space-6);
  grid-template-columns: 1fr 1fr;
  align-items: center;
}
.platform__panel[data-active="true"] { display: grid; }
@media (max-width: 760px) { .platform__panel { grid-template-columns: 1fr; } }
.platform__panel h3 { font-size: var(--fs-h3); margin-bottom: var(--space-3); }
.platform__panel p { color: var(--color-text-dim); margin-bottom: var(--space-4); }
.platform__visual {
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-md);
  background:
    radial-gradient(circle at 30% 20%, rgba(110,231,255,0.25), transparent 55%),
    radial-gradient(circle at 75% 75%, rgba(155,140,255,0.22), transparent 55%),
    var(--color-surface-2);
  border: 1px solid var(--color-border);
}

/* Investors */
.investors { padding-block: var(--space-7); }
.investors__heading {
  text-align: center;
  color: var(--color-text-faint);
  font-size: var(--fs-small);
  margin-bottom: var(--space-6);
}
.investors__row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--space-6) var(--space-7);
}
.investors__item {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--color-text-dim);
}

/* Testimonial */
.testimonial {
  background: var(--color-surface);
  border-block: 1px solid var(--color-border);
}
.testimonial__inner { max-width: 760px; text-align: center; }
.testimonial__quote {
  font-family: var(--font-display);
  font-size: clamp(1.35rem, 2.6vw, 2rem);
  line-height: var(--lh-snug);
  margin-bottom: var(--space-5);
}
.testimonial__quote::before { content: "\201C"; }
.testimonial__quote::after { content: "\201D"; }
.testimonial__attribution { color: var(--color-text-dim); font-size: var(--fs-small); }

/* Contact */
.contact__inner {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: var(--space-7);
}
@media (max-width: 860px) { .contact__inner { grid-template-columns: 1fr; } }
.contact__trust { color: var(--color-text-faint); font-size: var(--fs-small); margin-top: var(--space-5); }
.contact__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-4);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  align-content: start;
}
.contact__form .field--full { grid-column: 1 / -1; }
.contact__form .btn { grid-column: 1 / -1; margin-top: var(--space-2); }
@media (max-width: 560px) { .contact__form { grid-template-columns: 1fr; } }

/* FAQ */
.faq__tabs { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-6); }
.faq__tab {
  padding: 0.5rem 1rem;
  border-radius: var(--radius-pill);
  border: 1px solid var(--color-border);
  color: var(--color-text-dim);
  font-size: var(--fs-small);
}
.faq__tab[aria-selected="true"] { border-color: var(--color-accent); color: var(--color-text); }
.faq__item {
  border-bottom: 1px solid var(--color-border);
}
.faq__question {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-4);
  padding: var(--space-5) 0;
  text-align: left;
  font-weight: 600;
}
.faq__question .icon {
  flex-shrink: 0;
  width: 20px; height: 20px;
  position: relative;
}
.faq__question .icon::before, .faq__question .icon::after {
  content: "";
  position: absolute;
  background: var(--color-text-dim);
  transition: transform var(--dur-normal) var(--ease-out);
}
.faq__question .icon::before { left: 0; top: 50%; width: 100%; height: 1.5px; transform: translateY(-50%); }
.faq__question .icon::after { top: 0; left: 50%; height: 100%; width: 1.5px; transform: translateX(-50%); }
.faq__item[data-open="true"] .icon::after { transform: translateX(-50%) rotate(90deg); opacity: 0; }
.faq__answer {
  overflow: hidden;
  max-height: 0;
  transition: max-height var(--dur-normal) var(--ease-out);
  color: var(--color-text-dim);
}
.faq__item[data-open="true"] .faq__answer { max-height: 240px; }
.faq__answer p { padding-bottom: var(--space-5); }

/* Final CTA */
.final-cta {
  text-align: center;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(110,231,255,0.12), transparent 60%),
    var(--color-bg-raised);
}
.final-cta__inner { display: flex; flex-direction: column; align-items: center; gap: var(--space-6); }
.final-cta h2 { font-size: var(--fs-h1); max-width: 20ch; }

@media (prefers-reduced-motion: reduce) {
  .faq__answer, .site-header { transition: none; }
}