/* Able Gecko content sections — "desert after dark" section system */

.section-band {
  position: relative;
}

.section-dark {
  background: var(--bg);
  color: var(--text);
  border-top: 1px solid var(--line);
}

.section-band > .container {
  position: relative;
  z-index: 1;
}

/* ---------- Body sections ---------- */

.gecko-section p,
.gecko-section li {
  max-width: 900px;
  font-family: Inter, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: clamp(1rem, 1.4vw, 1.08rem);
  color: var(--muted);
}

.gecko-bullets {
  margin: 1.4rem 0 0;
  padding-left: 1.1rem;
  max-width: 900px;
}

.gecko-bullets li {
  margin-bottom: .6rem;
  color: var(--muted);
}

.gecko-bullets li::marker { color: var(--accent); }
.gecko-bullets li b { color: var(--text); font-weight: 600; }

/* ---------- Final CTA ---------- */

.section-cta {
  background: linear-gradient(150deg, var(--copper) 0%, var(--earth) 78%);
  color: #fbf3e6;
  border-top: 1px solid rgba(242,236,221,.14);
}

.section-cta h2,
.section-cta p { color: #fbf3e6; }

.section-cta .gecko-email,
.section-cta .gecko-email:visited {
  color: #fbf3e6;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: .22rem;
}

.gecko-email,
.gecko-email:visited {
  display: inline-block;
  color: var(--sand);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: .22rem;
}

#gecko-contact p { max-width: 720px; }

@media (max-width: 640px) {
  .section-band { padding: 3.25rem 0; }
}

/* ---------- Section-specific font override ---------- */
/* Content sections below the hero, plus "Start a Conversation" — sizes,
   weights, spacing, colors, and layout are untouched; only the typeface
   changes. */

.gecko-content-section,
.gecko-content-section h2,
.gecko-content-section p,
.gecko-content-section li,
.gecko-content-section b,
.start-conversation-section,
.start-conversation-section h2,
.start-conversation-section p,
.start-conversation-section a {
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display",
    "SF Pro Text", "Helvetica Neue", Arial, sans-serif;
}

/* ---------- Content-section spacing & readability ---------- */
/* Applies only to the introductory statement, "How it works",
   "What it monitors", and "Who it is for" — never the hero,
   "Start a conversation", or the footer. */

.gecko-content-section {
  padding: clamp(56px, 6vw, 72px) 0 0;
}

.gecko-content-section p {
  line-height: 1.75;
  margin: 0 0 1.3em;
}

.gecko-content-section p:last-child {
  margin-bottom: 0;
}

.gecko-content-section .gecko-bullets li {
  line-height: 1.75;
  margin-bottom: .8rem;
}

.gecko-content-section p.gecko-intro-statement {
  max-width: 900px;
  font-weight: 400;
  font-size: clamp(1.55rem, 2vw, 2rem);
  line-height: 1.45;
  color: var(--text);
  margin: 0;
}

.gecko-content-section.who-it-is-for-section {
  padding-bottom: clamp(80px, 8vw, 96px);
}

@media (max-width: 640px) {
  .gecko-content-section {
    padding: clamp(50px, 10vw, 64px) 0 0;
  }

  .gecko-content-section.who-it-is-for-section {
    padding-bottom: clamp(50px, 10vw, 64px);
  }

  .gecko-content-section p.gecko-intro-statement {
    font-family: var(--font-heading);
    font-weight: 300;
    font-size: 1.4rem;
    line-height: 1.5;
  }
}
