/**
 * AIIMN Redesign Layer — Premium elevation (2026-06)
 *
 * Loaded LAST, after components.css / layouts.css, so these rules refine the
 * existing token-driven system without rewriting it. Goal: a calmer, more
 * premium, more credible surface on the same navy/orange brand — lighter
 * display type, a signature underline accent, refined cards, proof/founder
 * blocks, and conversion scaffolding (mid-page newsletter, sticky mobile CTA).
 *
 * Architecture unchanged: light base + dark navy hero/CTA bands.
 *
 * @package AIIMN
 * @since 3.0.0
 */

/* ========================================================================
   1. TYPOGRAPHY — premium display feel
   ======================================================================== */

/* Tighten display headings: less "bold blast", more confident restraint. */
.section-aiimn h2,
.aiimn-display {
  font-weight: var(--font-weight-semibold);
  letter-spacing: -0.018em;
  line-height: 1.08;
}

.hero-home h1 {
  font-weight: var(--font-weight-semibold) !important;
  letter-spacing: -0.022em !important;
  line-height: 1.06 !important;
  color: var(--aiimn-white) !important;
}

/* Larger, calmer section intros */
.aiimn-section-intro {
  max-width: 680px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.aiimn-section-intro--left {
  margin-left: 0;
  text-align: left;
}

.aiimn-section-intro h2 {
  margin-bottom: var(--space-5);
}

.aiimn-section-intro p {
  font-size: var(--text-lg);
  color: var(--aiimn-muted);
  line-height: var(--line-height-relaxed);
  margin: 0;
}

/* ========================================================================
   2. SIGNATURE ACCENTS
   ======================================================================== */

/* Hand-stroke orange underline beneath a hero/heading word. */
.aiimn-underline {
  position: relative;
  white-space: nowrap;
  color: var(--aiimn-orange);
}

.aiimn-underline::after {
  content: '';
  position: absolute;
  left: -2%;
  right: -2%;
  bottom: -0.12em;
  height: 0.42em;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 24' preserveAspectRatio='none'><path d='M4 16 C 70 6, 150 6, 218 12 C 260 15, 296 12, 316 8' stroke='%23ff7357' stroke-width='5' fill='none' stroke-linecap='round'/></svg>");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

/* Keep the underlined word readable on dark hero: text stays white, stroke orange. */
.hero-home .aiimn-underline,
.aiimn-page-hero .aiimn-underline,
.section-aiimn--deep .aiimn-underline,
.section-aiimn--navy .aiimn-underline {
  color: var(--aiimn-white);
}

/* Monospace kicker — technical bona fides per brief. */
.aiimn-kicker {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--aiimn-orange);
  margin-bottom: var(--space-4);
}

.aiimn-kicker::before {
  content: '';
  width: 18px;
  height: 1px;
  background: currentColor;
  opacity: 0.7;
}

.section-aiimn--deep .aiimn-kicker,
.section-aiimn--navy .aiimn-kicker,
.hero-home .aiimn-kicker { color: var(--aiimn-orange); }

/* Auto-upgrade every existing eyebrow to the mono kicker look so kept
   sections match the redesigned ones without per-file edits. */
.aiimn-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.aiimn-eyebrow::before {
  content: '';
  width: 18px;
  height: 1px;
  background: currentColor;
  opacity: 0.7;
}

/* ========================================================================
   3. HERO refinements
   ======================================================================== */

.hero-home {
  background: radial-gradient(120% 140% at 78% 8%, #103452 0%, #081f33 45%, var(--aiimn-deep-navy) 100%) !important;
  padding: clamp(4.5rem, 9vw, 8rem) 0 clamp(4rem, 7vw, 7rem) !important;
}

.hero-home h1 {
  font-size: clamp(2.3rem, 5vw, 4rem) !important;
  max-width: 16ch;
}

.hero-home__sub {
  font-size: var(--text-lg);
  color: rgba(255,255,255,0.72);
  line-height: var(--line-height-relaxed);
  max-width: 54ch;
}

/* Trust line under the CTAs */
.aiimn-trustline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-2) var(--space-4);
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.04em;
  color: rgba(255,255,255,0.55);
}

.aiimn-trustline span { display: inline-flex; align-items: center; gap: var(--space-2); }
.aiimn-trustline span::before {
  content: '';
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--aiimn-orange);
}

/* ========================================================================
   4. CARDS — softer, more premium
   ======================================================================== */

.aiimn-feature-card,
.aiimn-comparison__col,
.aiimn-pricing-card,
.aiimn-week-card,
.aiimn-join-card {
  border-color: rgba(22,63,104,0.10);
  border-radius: var(--aiimn-radius-lg);
}

.aiimn-feature-card {
  padding: var(--space-8);
  box-shadow: 0 1px 2px rgba(6,25,43,0.04);
}

/* Numbered/icon chip atop feature cards */
.aiimn-feature-card__icon {
  width: 46px; height: 46px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 13px;
  background: rgba(255,115,87,0.12);
  color: var(--aiimn-orange);
  font-weight: var(--font-weight-bold);
  margin-bottom: var(--space-2);
}
.aiimn-feature-card__icon svg { width: 24px; height: 24px; }

/* ========================================================================
   5. COMPARISON CENTERPIECE (content vs operations)
   Distinct, larger treatment so it doesn't read like the other lists.
   ======================================================================== */

.aiimn-compare2 {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-5);
  max-width: 980px;
  margin: 0 auto;
  position: relative;
}
@media (min-width: 768px) {
  .aiimn-compare2 { grid-template-columns: 1fr 1fr; gap: var(--space-6); }
}

.aiimn-compare2__col {
  border-radius: var(--aiimn-radius-lg);
  padding: var(--space-8);
  background: var(--aiimn-white);
  border: 1px solid rgba(22,63,104,0.10);
}
.aiimn-compare2__col--muted { background: #f6f9fc; }
.aiimn-compare2__col--ops {
  background: linear-gradient(180deg, #ffffff 0%, #fff7f4 100%);
  border: 1.5px solid rgba(255,115,87,0.45);
  box-shadow: 0 24px 60px rgba(255,115,87,0.10);
}

.aiimn-compare2__head {
  display: flex; align-items: center; gap: var(--space-3);
  font-size: var(--text-sm);
  font-weight: var(--font-weight-semibold);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--aiimn-muted);
  margin: 0 0 var(--space-5);
  padding-bottom: var(--space-4);
  border-bottom: 1px solid rgba(22,63,104,0.08);
}
.aiimn-compare2__col--ops .aiimn-compare2__head { color: var(--aiimn-orange-dark); }

.aiimn-compare2__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-4); }
.aiimn-compare2__list li {
  display: flex; align-items: flex-start; gap: var(--space-3);
  font-size: var(--text-lg);
  color: var(--aiimn-ink);
  line-height: 1.35;
}
.aiimn-compare2__list li svg { width: 22px; height: 22px; flex-shrink: 0; margin-top: 1px; }
.aiimn-compare2__col--muted .aiimn-compare2__list li { color: var(--aiimn-muted); }

/* ========================================================================
   6. IS / ISN'T — compact two-tone strip (different from comparison)
   ======================================================================== */

.aiimn-isnt {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-3);
  max-width: 900px;
  margin: 0 auto;
}
@media (min-width: 700px) { .aiimn-isnt { grid-template-columns: 1fr 1fr; gap: var(--space-3) var(--space-8); } }

.aiimn-isnt__row {
  display: flex; align-items: flex-start; gap: var(--space-3);
  padding: var(--space-3) 0;
  font-size: var(--text-base);
  border-bottom: 1px solid rgba(22,63,104,0.08);
}
.aiimn-isnt__row svg { width: 20px; height: 20px; flex-shrink: 0; margin-top: 2px; }
.aiimn-isnt__row--is { color: var(--aiimn-ink); }
.aiimn-isnt__row--isnt { color: var(--aiimn-muted); }
.aiimn-isnt__legend {
  font-family: var(--font-mono);
  font-size: var(--text-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: var(--space-2);
}

/* ========================================================================
   7. PROOF — founder quote + artifact
   ======================================================================== */

.aiimn-proof-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-10);
  align-items: center;
}
@media (min-width: 900px) { .aiimn-proof-grid { grid-template-columns: 1.05fr 0.95fr; gap: var(--space-12); } }

.aiimn-quote {
  font-size: clamp(1.5rem, 2.6vw, 2.05rem);
  font-weight: var(--font-weight-medium);
  line-height: 1.32;
  letter-spacing: -0.01em;
  color: var(--aiimn-white);
  margin: 0 0 var(--space-8);
  position: relative;
  border-left: none;
  padding-left: 0;
}
.section-aiimn--white .aiimn-quote,
.section-aiimn--sky .aiimn-quote { color: var(--aiimn-ink); }

.aiimn-quote__mark {
  display: block;
  font-family: Georgia, serif;
  font-size: 4rem;
  line-height: 0.4;
  color: var(--aiimn-orange);
  margin-bottom: var(--space-4);
  height: 1.6rem;
}

.aiimn-attrib { display: flex; align-items: center; gap: var(--space-4); }
.aiimn-attrib__avatar {
  width: 52px; height: 52px; border-radius: 50%;
  background: linear-gradient(135deg, var(--aiimn-orange), var(--aiimn-orange-dark));
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-weight: var(--font-weight-bold); font-size: var(--text-lg);
  flex-shrink: 0; overflow: hidden;
}
.aiimn-attrib__avatar img { width: 100%; height: 100%; object-fit: cover; }
.aiimn-attrib__name { font-weight: var(--font-weight-semibold); color: inherit; margin: 0; line-height: 1.2; }
.aiimn-attrib__role { font-size: var(--text-sm); color: var(--aiimn-muted); margin: 0; }
.section-aiimn--deep .aiimn-attrib__role,
.section-aiimn--navy .aiimn-attrib__role { color: rgba(255,255,255,0.6); }

/* Terminal/artifact card */
.aiimn-artifact {
  background: #08182a;
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: var(--aiimn-radius-md);
  box-shadow: 0 30px 70px rgba(0,0,0,0.4);
  overflow: hidden;
  font-family: var(--font-mono);
}
.aiimn-artifact__bar {
  display: flex; align-items: center; gap: 7px;
  padding: var(--space-3) var(--space-4);
  background: rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.08);
}
.aiimn-artifact__bar span { width: 10px; height: 10px; border-radius: 50%; background: rgba(255,255,255,0.18); }
.aiimn-artifact__bar span:first-child { background: rgba(255,115,87,0.8); }
.aiimn-artifact__title {
  margin-left: var(--space-3);
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.5);
  letter-spacing: 0.05em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.aiimn-artifact__body { padding: var(--space-5) var(--space-5) var(--space-6); font-size: 0.82rem; line-height: 1.85; color: rgba(255,255,255,0.82); overflow-x: auto; }
.aiimn-artifact__body .c-key { color: #7fb2e0; }
.aiimn-artifact__body .c-str { color: #ff9b85; }
.aiimn-artifact__body .c-com { color: rgba(255,255,255,0.4); }
.aiimn-artifact__body .c-ok { color: #5bd6a0; }

/* ========================================================================
   8. FOUNDER NOTE (home)
   ======================================================================== */

.aiimn-founder {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-8);
  align-items: center;
  max-width: 900px;
  margin: 0 auto;
}
@media (min-width: 768px) { .aiimn-founder { grid-template-columns: auto 1fr; gap: var(--space-10); } }
.aiimn-founder__photo {
  width: 132px; height: 132px; border-radius: var(--aiimn-radius-lg);
  background: linear-gradient(135deg, var(--aiimn-navy), var(--aiimn-deep-navy));
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-weight: var(--font-weight-bold); font-size: 2.2rem;
  overflow: hidden; flex-shrink: 0; margin: 0 auto;
}
.aiimn-founder__photo img { width: 100%; height: 100%; object-fit: cover; }

/* ========================================================================
   9. NEWSLETTER BAND (mid-page warm-up capture)
   ======================================================================== */

.aiimn-news-band {
  background: var(--aiimn-sky);
  border: 1px solid rgba(22,63,104,0.10);
  border-radius: var(--aiimn-radius-lg);
  padding: clamp(var(--space-8), 4vw, var(--space-12));
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  align-items: center;
}
@media (min-width: 820px) { .aiimn-news-band { grid-template-columns: 1.1fr 0.9fr; gap: var(--space-10); } }
.aiimn-news-band__form { display: flex; flex-direction: column; gap: var(--space-2); }
.aiimn-news-band__row { display: flex; gap: var(--space-3); flex-wrap: wrap; }
.aiimn-news-band__row input[type="email"] { flex: 1 1 220px; min-height: 52px; }
.aiimn-news-band__row .btn { min-height: 52px; }

/* ========================================================================
   10. STICKY MOBILE CTA
   ======================================================================== */

.aiimn-sticky-cta {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: var(--z-fixed);
  display: none;
  gap: var(--space-3);
  padding: var(--space-3) var(--space-4);
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(10px);
  border-top: 1px solid var(--aiimn-border);
  box-shadow: 0 -8px 24px rgba(6,25,43,0.10);
}
.aiimn-sticky-cta .btn { flex: 1; min-height: 50px; }
.aiimn-sticky-cta__meta { display: none; }
@media (max-width: 767px) {
  .aiimn-sticky-cta { display: flex; align-items: center; }
  body { padding-bottom: 76px; }
}

/* ========================================================================
   11. PROOF BAR (thin credibility strip under hero)
   ======================================================================== */

.aiimn-proofbar {
  border-bottom: 1px solid var(--aiimn-border);
  background: var(--aiimn-white);
}
.aiimn-proofbar__inner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: var(--space-4) var(--space-8);
  padding: var(--space-5) 0;
}
.aiimn-proofbar__item {
  display: inline-flex; align-items: center; gap: var(--space-2);
  font-size: var(--text-sm); color: var(--aiimn-muted);
}
.aiimn-proofbar__item strong { color: var(--aiimn-ink); font-weight: var(--font-weight-semibold); }
.aiimn-proofbar__item svg { width: 18px; height: 18px; color: var(--aiimn-orange); flex-shrink: 0; }

/* ========================================================================
   12. CTA PAIR (stacked, reused site-wide)
   ======================================================================== */

.aiimn-cta-pair {
  display: flex; flex-direction: column; align-items: center; gap: var(--space-3);
}
.aiimn-cta-pair .btn { min-width: 260px; }
.aiimn-cta-pair__note { font-size: var(--text-sm); color: var(--aiimn-muted); margin: var(--space-1) 0 0; }
.section-aiimn--deep .aiimn-cta-pair__note,
.section-aiimn--navy .aiimn-cta-pair__note { color: rgba(255,255,255,0.55); }

/* ========================================================================
   13. SECTION RHYTHM — tighter, less scroll
   The original 7.5rem read as a cold gallery with long gaps between blocks.
   Pull it in so the page feels denser and warmer without crowding.
   ======================================================================== */
@media (min-width: 768px) {
  .section-aiimn { padding-top: 4.25rem; padding-bottom: 4.25rem; }
}
@media (min-width: 1024px) {
  .section-aiimn { padding-top: 5rem; padding-bottom: 5rem; }
}
/* Trim the big intro gaps inside sections too. */
.aiimn-section-intro { margin-bottom: var(--space-10) !important; }

/* ========================================================================
   14. WARMTH — warm the light surfaces off the cold blue
   Brand stays navy/orange; the neutrals shift from cool (#edf4fa) toward a
   warm paper so the page feels human, not clinical. No new accent hues.
   ======================================================================== */
:root {
  --aiimn-warm-white: #fdfaf7;  /* warm paper for "white" sections */
  --aiimn-cream:      #f8f1ea;  /* warm sand for "sky" sections */
  --aiimn-peach:      #fff5f0;  /* faint warm tint for ops/highlight cards */
}
body { background: var(--aiimn-warm-white); }
.section-aiimn--white { background: var(--aiimn-warm-white) !important; }
.section-aiimn--sky   { background: var(--aiimn-cream) !important; }

/* Re-warm cards that previously sat on cool surfaces. */
.aiimn-compare2__col--muted { background: #faf4ee !important; }
.aiimn-compare2__col--ops {
  background: linear-gradient(180deg, #ffffff 0%, var(--aiimn-peach) 100%) !important;
}

/* ========================================================================
   15. NEW COMPONENT BITS for the "get the week back" build
   ======================================================================== */

/* Step-number chip variant on the "how" cards (reuses feature-card icon box) */
.aiimn-feature-card__icon--step {
  font-family: var(--font-mono);
  font-size: var(--text-lg);
  letter-spacing: 0.02em;
}

/* Founder lead-in line above the proof quote (deep navy section) */
.aiimn-proof-lead {
  font-size: clamp(1.15rem, 1.8vw, 1.4rem);
  font-weight: var(--font-weight-medium);
  line-height: 1.5;
  color: rgba(255,255,255,0.92);
  margin: 0 0 var(--space-6);
  max-width: 46ch;
}

/* By-the-numbers strip (honest WindRider proof) */
.aiimn-stats {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-6);
  margin-top: var(--space-12);
  padding-top: var(--space-10);
  border-top: 1px solid rgba(255,255,255,0.12);
}
@media (min-width: 700px) { .aiimn-stats { grid-template-columns: repeat(3, 1fr); gap: var(--space-10); } }
.aiimn-stat__num {
  font-size: clamp(2rem, 3.4vw, 2.8rem);
  font-weight: var(--font-weight-bold);
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--aiimn-orange);
  margin: 0 0 var(--space-3);
}
.aiimn-stat__label {
  font-size: var(--text-sm);
  line-height: var(--line-height-relaxed);
  color: rgba(255,255,255,0.66);
  margin: 0;
  max-width: 30ch;
}