/* ═══════════════════════════════════════════════════════════════
   AIMT Supporting Pages — shared primitives
   ---------------------------------------------------------------
   Reusable, supporting-page-only components: public footer, CTA
   variants, eyebrow, section container, form baseline, product-proof
   frame, reduced motion. The public nav lives in the separate
   assets/css/aimt-public-nav.css instead (one canonical header
   component, not bundled in here).

   Consumed by: index.html, courses.html, terms.html, privacy.html,
   refunds.html, verify.html, and the public #landingPage surface of
   headspa-mastery.html (scoped under #landingPage there — see that
   file's own note).

   Does NOT own page-unique composition (heroes, curriculum explorer,
   Fit Check, dashboard layout, etc.) — those stay page-local per
   00-MASTER-DESIGN-SALES-SYSTEM.md §40.

   Depends on tokens in assets/css/aimt-design-system.css — load that
   file first.
   ═══════════════════════════════════════════════════════════════ */

/* ---------- Public nav ----------
   Moved to the shared assets/css/aimt-public-nav.css (Owner Correction
   Pass — "one AIMT nav" system fix). Every page that used to define its
   header here now renders .aimt-public-nav instead. */

/* ---------- CTA buttons ---------- */
.aimt-cta {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px;
  font-family: var(--aimt-font-mont);
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-radius: var(--aimt-radius-pill, 980px);
  min-height: 44px;
  padding: 0 1.35rem;
  text-decoration: none;
  cursor: pointer;
  border: none;
  transition: opacity 0.18s ease, background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
  white-space: nowrap;
}
.aimt-cta-primary-dark { background: #fff; color: #1a1814; }
.aimt-cta-primary-dark:hover, .aimt-cta-primary-dark:focus-visible { opacity: 0.9; }
.aimt-cta-primary-light { background: #262626; color: #fff; }
.aimt-cta-primary-light:hover, .aimt-cta-primary-light:focus-visible { opacity: 0.88; }
.aimt-cta-ghost { background: rgba(255,255,255,0.06); border: 0.5px solid rgba(255,255,255,0.14); color: rgba(255,255,255,0.72); }
.aimt-cta-ghost:hover, .aimt-cta-ghost:focus-visible { border-color: rgba(255,255,255,0.3); color: #fff; }
.aimt-cta-ghost-light { background: transparent; border: 0.5px solid rgba(38,38,38,0.22); color: #262626; }
.aimt-cta-ghost-light:hover, .aimt-cta-ghost-light:focus-visible { border-color: rgba(38,38,38,0.4); }

/* ---------- Eyebrow ---------- */
.aimt-sp-eyebrow {
  font-family: var(--aimt-font-mono);
  font-size: 0.58rem;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(163,150,141,0.7);
  display: block;
}

/* ---------- Section container ---------- */
.aimt-sp-container { max-width: var(--aimt-container-max, 1100px); margin-inline: auto; padding-inline: 2rem; }
@media (max-width: 700px) { .aimt-sp-container { padding-inline: 1.25rem; } }

/* ---------- Institutional footer ---------- */
.aimt-footer { background: #1a1814; border-top: var(--aimt-border-hairline, 0.5px) solid rgba(255,255,255,0.07); padding: 3.5rem 2rem 2.25rem; }
.aimt-footer-inner { max-width: var(--aimt-container-max, 1100px); margin: 0 auto; display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 2rem; }
.aimt-footer-brand { display: flex; flex-direction: column; gap: 0.6rem; }
.aimt-footer-mark { display: flex; align-items: center; gap: 8px; }
.aimt-footer-mark svg { width: 22px; height: 22px; color: rgba(255,255,255,0.4); }
.aimt-footer-mark span { font-family: var(--aimt-font-mont); font-size: 0.68rem; letter-spacing: 0.3em; text-transform: uppercase; font-weight: 700; color: rgba(255,255,255,0.55); }
.aimt-footer-tagline { font-family: var(--aimt-font-sans); font-size: 0.76rem; color: rgba(255,255,255,0.42); line-height: 1.6; max-width: 26ch; }
.aimt-footer-col-title { font-family: var(--aimt-font-mono); font-size: 0.54rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(163,150,141,0.5); margin-bottom: 0.9rem; display: block; }
.aimt-footer-col a { display: block; font-family: var(--aimt-font-sans); font-size: 0.8rem; color: rgba(255,255,255,0.56); text-decoration: none; margin-bottom: 0.65rem; transition: color 0.2s ease; }
.aimt-footer-col a:hover, .aimt-footer-col a:focus-visible { color: #fff; }
.aimt-footer-bottom { max-width: var(--aimt-container-max, 1100px); margin: 2.5rem auto 0; padding-top: 1.5rem; border-top: var(--aimt-border-hairline, 0.5px) solid rgba(255,255,255,0.06); font-family: var(--aimt-font-sans); font-size: 0.7rem; color: rgba(255,255,255,0.36); }
.aimt-footer-bottom a { color: rgba(255,255,255,0.4); text-decoration: none; transition: color 0.2s ease; }
.aimt-footer-bottom a:hover, .aimt-footer-bottom a:focus-visible { color: #fff; }
/* Standalone variant: used by pages that render only the bottom link row
   (no .aimt-footer-inner brand/columns grid above it) — terms, privacy,
   refunds, verify. Replaces a page-repeated inline style. */
.aimt-footer-bottom.is-standalone { text-align: center; border-top: none; margin-top: 0; }
@media (max-width: 860px) {
  .aimt-footer-inner { grid-template-columns: repeat(2, 1fr); gap: 2rem 1.5rem; }
  .aimt-footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .aimt-footer { padding: 3rem 1.25rem 2rem; }
  .aimt-footer-inner { grid-template-columns: 1fr; gap: 1.75rem; }
}

/* ---------- Legal / utility page template ---------- */
/* Header moved to the shared assets/css/aimt-public-nav.css (Owner
   Correction Pass — "one AIMT nav" system fix): every legal/utility page
   now renders .aimt-public-nav.aimt-public-nav--sticky instead of this
   file owning its own header rules. */
.aimt-legal-body { background: #1a1814; color: rgba(255,255,255,0.95); font-family: var(--aimt-font-sans); font-weight: 300; }

.aimt-legal-wrap { max-width: 1100px; margin: 0 auto; padding: 3.5rem 2rem 5rem; display: grid; grid-template-columns: 200px minmax(0,760px); gap: 3rem; }
.aimt-legal-toc { position: sticky; top: calc(var(--aimt-nav-height, 56px) + 2rem); align-self: start; }
.aimt-legal-toc-label { font-family: var(--aimt-font-mono); font-size: 0.52rem; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(163,150,141,0.5); margin-bottom: 0.9rem; display: block; }
.aimt-legal-toc a { display: block; font-family: var(--aimt-font-sans); font-size: 0.78rem; color: rgba(255,255,255,0.52); text-decoration: none; padding: 0.4rem 0; line-height: 1.4; transition: color 0.2s ease; }
.aimt-legal-toc a:hover, .aimt-legal-toc a:focus-visible { color: #fff; }
.aimt-legal-doc h1 { font-family: var(--aimt-font-serif); font-weight: 500; font-size: clamp(1.7rem, 4vw, 2.3rem); margin-bottom: 0.6rem; }
.aimt-legal-doc .aimt-legal-updated { color: rgba(255,255,255,0.34); font-size: 0.82rem; margin-bottom: 2.6rem; }
.aimt-legal-doc h2 { font-family: var(--aimt-font-serif); font-weight: 500; font-size: 1.25rem; margin: 2.4rem 0 0.8rem; scroll-margin-top: calc(var(--aimt-nav-height, 56px) + 1.5rem); }
.aimt-legal-doc p { color: rgba(255,255,255,0.62); font-size: 0.95rem; line-height: 1.75; margin-bottom: 1rem; }
.aimt-legal-doc a { color: var(--aimt-color-accent, #a3968d); }
.aimt-legal-flag {
  font-family: var(--aimt-font-sans);
  font-size: 0.78rem;
  line-height: 1.65;
  color: rgba(255,255,255,0.6);
  background: rgba(163,150,141,0.08);
  border: 0.5px solid rgba(163,150,141,0.22);
  border-radius: 12px;
  padding: 0.9rem 1.1rem;
  margin: 1.25rem 0;
}
.aimt-legal-flag strong { color: rgba(255,255,255,0.85); }
@media (max-width: 860px) {
  .aimt-legal-wrap { grid-template-columns: 1fr; padding-top: 2.5rem; }
  .aimt-legal-toc { position: static; padding-bottom: 1rem; border-bottom: 0.5px solid rgba(255,255,255,0.07); margin-bottom: 0.5rem; }
  .aimt-legal-toc-inner { display: flex; flex-wrap: wrap; gap: 0.4rem 1rem; }
  .aimt-legal-toc a { padding: 0.25rem 0; }
}
@media (max-width: 700px) {
  .aimt-legal-wrap { padding-inline: 1.25rem; }
}

/* ---------- Form baseline ---------- */
.aimt-sp-field { display: flex; flex-direction: column; gap: 0.4rem; margin-bottom: 1.1rem; }
.aimt-sp-field label { font-family: var(--aimt-font-sans); font-size: 0.78rem; color: rgba(255,255,255,0.56); }
.aimt-sp-field input {
  min-height: 44px;
  border-radius: var(--aimt-radius-sm, 10px);
  border: 0.5px solid var(--aimt-border-default, rgba(255,255,255,0.07));
  background: var(--aimt-surface-2, rgba(255,255,255,0.03));
  color: rgba(255,255,255,0.95);
  font-family: var(--aimt-font-sans);
  font-size: 16px;
  padding: 0 1rem;
  outline: none;
  transition: border-color 0.2s ease;
}
.aimt-sp-field input:focus-visible { border-color: rgba(163,150,141,0.5); outline: 2px solid #a3968d; outline-offset: 1px; }

/* ---------- Product-proof frame ---------- */
.aimt-sp-proof-frame {
  border-radius: var(--aimt-radius-panel, 16px);
  overflow: hidden;
  border: 0.5px solid rgba(255,255,255,0.1);
  box-shadow: var(--aimt-shadow-media, 0 18px 42px rgba(0,0,0,0.24));
  background: #1e1b17;
}
.aimt-sp-proof-frame img { display: block; width: 100%; height: auto; }
.aimt-sp-proof-caption {
  font-family: var(--aimt-font-mono);
  font-size: 0.62rem;
  letter-spacing: 0.06em;
  color: rgba(255,255,255,0.34);
  margin-top: 0.75rem;
}

/* ---------- Focus-visible baseline ---------- */
.aimt-sp-container a:focus-visible,
.aimt-legal-wrap a:focus-visible,
button:focus-visible {
  outline: 2px solid #a3968d;
  outline-offset: 2px;
}

/* ---------- Ambient depth (Student Access reference system) ----------
   "Dark does not mean flat": warm-black base, a restrained radial tonal
   lift behind the important content, foreground surfaces 1-2 luminance
   steps above background, hairline borders, soft falloff rather than
   drop shadows. Intensity follows content hierarchy:
   primary (product/action) > secondary (supporting) > minimal (legal). */
.aimt-sp-depth-primary {
  background:
    radial-gradient(circle at top left, rgba(163,150,141,0.09), transparent 36%),
    radial-gradient(circle at bottom right, rgba(163,150,141,0.05), transparent 42%),
    linear-gradient(180deg, #1a1814 0%, #14110d 100%);
}
.aimt-sp-depth-secondary {
  background:
    radial-gradient(circle at top left, rgba(163,150,141,0.055), transparent 38%),
    linear-gradient(180deg, #1a1814 0%, #16130f 100%);
}
.aimt-sp-depth-minimal { background: #1a1814; }

.aimt-sp-surface {
  background: rgba(255,255,255,0.035);
  border: var(--aimt-border-hairline, 0.5px) solid var(--aimt-border-default, rgba(255,255,255,0.08));
  border-radius: var(--aimt-radius-panel, 16px);
  box-shadow: 0 16px 42px rgba(0,0,0,0.18);
}
.aimt-sp-surface-2 { background: rgba(255,255,255,0.02); }
.aimt-sp-surface-quiet {
  background: rgba(255,255,255,0.02);
  border: var(--aimt-border-hairline, 0.5px) solid rgba(255,255,255,0.06);
  border-radius: var(--aimt-radius-md, 12px);
  box-shadow: none;
}

/* ---------- Higher-contrast secondary text (new tokens, additive only —
   do not repoint existing --aimt-color-text-* tokens, which the
   protected course/module/Cadence experience also reads) ---------- */
.aimt-sp-text-body { color: rgba(255,255,255,0.66); }
.aimt-sp-text-muted { color: rgba(255,255,255,0.56); }
.aimt-sp-text-subtle { color: rgba(255,255,255,0.44); }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .aimt-public-nav-mobile-menu,
  .aimt-public-nav-hamburger-line,
  .aimt-cta,
  .aimt-public-nav-link,
  .aimt-footer-col a {
    transition: none !important;
  }
  * { scroll-behavior: auto !important; }
}
