/* Generic layout for IOP sections */
  /* Tighter vertical rhythm than the global --section-py (Maya, July 24:
     adjacent IOP sections stacked up to 224px of dead space lower down the
     page). */
  .iop-section { padding: clamp(40px, 5.5vw, 76px) 0; }
  .iop-section--alt { background: var(--cream-2); }
  .iop-head {
    display: grid;
    grid-template-columns: 1fr;
    gap: 24px;
    margin-bottom: 56px;
    align-items: end;
  }
  @media (min-width: 900px) { .iop-head { grid-template-columns: 1.1fr 1fr; gap: 64px; } }
  .iop-head--dark .eyebrow { color: var(--butter); }
  .iop-head--dark .eyebrow .dot { background: var(--butter); }

  /* ──── HERO ──── */
  .iop-hero {
    padding: clamp(56px, 8vw, 96px) 0 clamp(48px, 7vw, 80px);
    background: var(--cream);
    position: relative;
    overflow: hidden;
  }
  .iop-hero::before {
    content: "";
    position: absolute;
    right: -200px; top: -100px;
    width: 540px; height: 540px;
    background: radial-gradient(circle, var(--sand) 0%, transparent 60%);
    opacity: .4;
    border-radius: 50%;
    filter: blur(40px);
    pointer-events: none;
  }
  .iop-hero-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: start;
    position: relative;
  }
  @media (min-width: 900px) { .iop-hero-grid { grid-template-columns: 1.4fr 1fr; gap: 64px; } }
  .iop-hero-actions {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin: 32px 0 40px;
  }
  .iop-trust {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 16px 24px;
    padding-top: 28px;
    border-top: 1px solid color-mix(in oklab, var(--ink) 14%, transparent);
    max-width: 600px;
  }
  .iop-trust li {
    font-size: 13px;
    font-weight: 500;
    color: var(--ink);
    display: inline-flex;
    align-items: center;
    gap: 10px;
  }
  .iop-trust li::before {
    content: "";
    width: 18px; height: 18px;
    border-radius: 50%;
    background: var(--butter) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B1714' stroke-width='2.8' stroke-linecap='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") no-repeat center / 11px;
  }

  .iop-clinical-card {
    background: var(--moss);
    color: var(--cream);
    padding: 36px 32px;
    border-radius: 18px;
    position: relative;
    overflow: hidden;
  }
  .iop-clinical-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 24px;
  }
  .iop-clinical-list li {
    display: flex;
    gap: 14px;
    align-items: flex-start;
    background: color-mix(in oklab, var(--cream) 8%, transparent);
    border: 1px solid color-mix(in oklab, var(--cream) 16%, transparent);
    padding: 14px 16px;
    border-radius: 10px;
  }
  .iop-clinical-num {
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 18px;
    color: var(--butter);
    line-height: 1;
    margin-top: 2px;
    flex-shrink: 0;
  }
  .iop-clinical-list strong { display: block; font-size: 14px; font-weight: 600; color: var(--cream); margin-bottom: 3px; }
  .iop-clinical-list span { font-size: 12.5px; color: color-mix(in oklab, var(--cream) 78%, transparent); line-height: 1.5; }

  /* ──── STEP-UP/DOWN BAND ──── */
  .iop-band {
    background: var(--cream-2);
    padding: clamp(60px, 8vw, 100px) 0;
  }
  .iop-band-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: center;
  }
  @media (min-width: 900px) { .iop-band-grid { grid-template-columns: 1.1fr 1fr; gap: 72px; } }
  .iop-band-cards { display: flex; flex-direction: column; gap: 12px; }
  .iop-band-card {
    background: var(--cream);
    padding: 22px 26px;
    border-radius: 14px;
    border-left: 3px solid var(--butter);
    transition: transform .25s ease;
  }
  .iop-band-card:hover { transform: translateX(4px); }
  .iop-band-card h3 { margin-bottom: 6px; }

  /* ──── WHO IT'S FOR ──── */
  .iop-who-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    border-top: 1px solid color-mix(in oklab, var(--ink) 12%, transparent);
    border-left: 1px solid color-mix(in oklab, var(--ink) 12%, transparent);
    border-radius: 14px;
    overflow: hidden;
  }
  @media (min-width: 600px) { .iop-who-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (min-width: 1024px) { .iop-who-grid { grid-template-columns: repeat(4, 1fr); } }
  .iop-who-card {
    padding: 32px 26px;
    border-right: 1px solid color-mix(in oklab, var(--ink) 12%, transparent);
    border-bottom: 1px solid color-mix(in oklab, var(--ink) 12%, transparent);
    background: var(--cream);
    transition: background .25s ease;
    min-height: 180px;
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .iop-who-card:hover { background: var(--cream-2); }
  .iop-who-card .sym-tile {
    width: 42px; height: 42px;
    background: var(--butter);
    border-color: transparent;
    color: var(--ink);
  }
  .iop-who-card .sym-tile .sym { width: 22px; height: 22px; }
  .iop-who-card h3 { margin: 0; }

  /* Eyebrow on dark cards (clinical + insurance) */
  .iop-card-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--butter);
  }
  .iop-card-eyebrow .sym { color: var(--butter); }
  .iop-card-eyebrow .micro { color: var(--butter); font-family: var(--font-mono); }

  /* ──── WHAT'S INCLUDED ──── */
  .iop-feature-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
  }
  @media (min-width: 700px) { .iop-feature-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (min-width: 1024px) { .iop-feature-grid { grid-template-columns: repeat(3, 1fr); } }
  .iop-feature {
    background: var(--cream);
    border: 1px solid color-mix(in oklab, var(--ink) 12%, transparent);
    border-radius: 14px;
    padding: 32px 28px;
    transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
  }
  .iop-feature:hover {
    transform: translateY(-2px);
    border-color: color-mix(in oklab, var(--ink) 22%, transparent);
    box-shadow: 0 8px 24px -16px rgba(27, 23, 20, .18);
  }
  .iop-feature-num {
    font-family: var(--font-serif);
    font-size: 36px;
    color: var(--ink);
    line-height: 1;
    margin-bottom: 18px;
    letter-spacing: -.02em;
    display: flex;
    align-items: baseline;
    gap: 8px;
  }
  .iop-feature-num::before {
    content: "";
    width: 24px;
    height: 1px;
    background: var(--butter);
  }
  .iop-feature-num span { display: inline; }
  .iop-feature h3 { margin-bottom: 10px; }

  /* ──── STATEMENT ──── */
  .iop-statement {
    background: var(--butter);
    padding: clamp(80px, 12vw, 140px) 0;
    position: relative;
    overflow: hidden;
  }
  .iop-statement::before {
    content: "";
    position: absolute;
    top: -120px; right: -120px;
    width: 400px; height: 400px;
    border-radius: 50%;
    background: color-mix(in oklab, var(--ink) 18%, transparent);
    opacity: .12;
  }
  .iop-statement blockquote {
    position: relative;
    z-index: 1;
    color: var(--ink);
  }

  /* ──── INSURANCE ──── */
  .iop-insurance-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: center;
  }
  @media (min-width: 900px) { .iop-insurance-grid { grid-template-columns: .9fr 1.1fr; gap: 72px; } }
  .iop-insurance-points {
    list-style: none;
    margin: 32px 0;
  }
  .iop-insurance-points li {
    padding: 16px 0;
    border-top: 1px solid color-mix(in oklab, var(--ink) 12%, transparent);
    display: flex;
    align-items: center;
    gap: 14px;
    font-size: 15px;
    font-weight: 500;
    color: var(--ink);
  }
  .iop-insurance-points li:last-child { border-bottom: 1px solid color-mix(in oklab, var(--ink) 12%, transparent); }
  .iop-insurance-points li::before {
    content: "";
    width: 22px; height: 22px;
    background: var(--butter) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231B1714' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") no-repeat center / 13px;
    border-radius: 50%;
    flex-shrink: 0;
  }
  .iop-insurance-card {
    background: var(--moss);
    color: var(--cream);
    padding: clamp(32px, 4vw, 48px);
    border-radius: 18px;
    position: relative;
    overflow: hidden;
  }
  .iop-insurance-card::before {
    content: "01";
    position: absolute;
    top: 18px; right: 28px;
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 160px;
    color: color-mix(in oklab, var(--butter) 25%, transparent);
    font-weight: 300;
    letter-spacing: -.05em;
    line-height: 1;
    pointer-events: none;
  }
  .iop-insurance-card > * { position: relative; z-index: 1; }
  .iop-logo-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
  }
  .iop-logo-row span {
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 17px;
    color: color-mix(in oklab, var(--cream) 75%, transparent);
    padding: 8px 14px;
    background: color-mix(in oklab, var(--cream) 6%, transparent);
    border: 1px solid color-mix(in oklab, var(--cream) 14%, transparent);
    border-radius: 8px;
  }

  /* ──── PROCESS ──── */
  .iop-process {
    background: var(--ink);
    color: var(--cream);
    padding: var(--section-py) 0;
  }
  .iop-process-grid {
    list-style: none;
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    border-top: 1px solid color-mix(in oklab, var(--cream) 16%, transparent);
    border-left: 1px solid color-mix(in oklab, var(--cream) 16%, transparent);
    border-radius: 14px;
    overflow: hidden;
  }
  @media (min-width: 600px) { .iop-process-grid { grid-template-columns: repeat(2, 1fr); } }
  @media (min-width: 1024px) { .iop-process-grid { grid-template-columns: repeat(4, 1fr); } }
  .iop-step {
    padding: 36px 26px;
    border-right: 1px solid color-mix(in oklab, var(--cream) 16%, transparent);
    border-bottom: 1px solid color-mix(in oklab, var(--cream) 16%, transparent);
    min-height: 220px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 18px;
  }
  .iop-step-num {
    font-family: var(--font-serif);
    font-style: italic;
    font-size: 12px;
    color: var(--butter);
    letter-spacing: .04em;
    margin-bottom: 10px;
  }
  .iop-step-num span {
    display: block;
    font-style: normal;
    font-size: 44px;
    color: var(--cream);
    line-height: 1;
    margin-top: 4px;
  }

  /* ──── FAQ ──── */
  .iop-faq-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: start;
  }
  @media (min-width: 900px) { .iop-faq-grid { grid-template-columns: 1fr 1.4fr; gap: 72px; } }
  /* Reuse .faq styles from service.njk pattern — defined locally here */
  .iop-page .faqs { display: flex; flex-direction: column; gap: 12px; }
  .iop-page .faq {
    background: var(--cream-2);
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid color-mix(in oklab, var(--ink) 8%, transparent);
  }
  .iop-page .faq summary {
    list-style: none;
    cursor: pointer;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-family: var(--font-serif);
    font-size: clamp(17px, 1.8vw, 20px);
    line-height: 1.3;
    color: var(--ink);
    user-select: none;
  }
  .iop-page .faq summary::-webkit-details-marker { display: none; }
  .iop-page .faq-mark {
    font-family: var(--font-sans);
    font-size: 22px;
    font-weight: 300;
    color: var(--ink-2);
    transition: transform .2s ease;
    flex-shrink: 0;
  }
  .iop-page .faq[open] .faq-mark { transform: rotate(45deg); }
  .iop-page .faq-a {
    padding: 0 24px 22px;
    color: var(--ink-2);
    line-height: 1.6;
    font-size: clamp(15px, 1.5vw, 17px);
  }

  /* ──── INTAKE ──── */
  .iop-intake-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 48px;
    align-items: start;
  }
  @media (min-width: 900px) { .iop-intake-grid { grid-template-columns: 1fr 1.2fr; gap: 64px; } }
  .iop-crisis {
    background: var(--cream);
    border-left: 3px solid var(--moss);
    padding: 18px 20px;
    font-size: 13px;
    line-height: 1.6;
    color: var(--ink);
    margin-top: 28px;
    border-radius: 0 10px 10px 0;
  }
  .iop-crisis strong {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
  }

  /* "Three safe ways to get started" route cards */
  .iop-routes {
    background: var(--cream);
    border: 1px solid color-mix(in oklab, var(--ink) 10%, transparent);
    border-radius: 18px;
    padding: clamp(24px, 3vw, 32px);
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .iop-route {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 20px 22px;
    background: var(--cream-2);
    border: 1px solid transparent;
    border-radius: 12px;
    color: var(--ink);
    transition: border-color .2s ease, transform .2s ease, background .2s ease;
  }
  .iop-route:hover {
    border-color: var(--ink);
    transform: translateX(2px);
    background: color-mix(in oklab, var(--butter) 25%, var(--cream-2));
  }
  .iop-route-icon {
    width: 44px; height: 44px;
    border-radius: 50%;
    background: var(--butter);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: var(--ink);
  }
  .iop-route-body { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
  .iop-route-body strong {
    font-family: var(--font-serif);
    font-weight: 500;
    font-size: clamp(17px, 1.7vw, 19px);
    line-height: 1.25;
    color: var(--ink);
  }
  .iop-route-body span {
    font-size: 13.5px;
    line-height: 1.5;
    color: var(--ink-2);
  }
  .iop-route .arrow { font-size: 18px; flex-shrink: 0; transition: transform .2s ease; }
  .iop-route:hover .arrow { transform: translateX(4px); }

  /* ──── FINAL CTA ──── */
  .iop-final-cta {
    background: var(--ink);
    color: var(--cream);
    padding: clamp(80px, 12vw, 140px) 0;
    position: relative;
    overflow: hidden;
  }
  /* (The decorative butter radial glow that used to sit behind this band was
     removed July 2026 at the client's request: it read as an opaque yellow
     haze over the CTA text.) */

/* ════════════════════════════════════════════════════════════════════════
   Additions for the block-built program microsite pages (July 2026).
   Everything above is the extraction of the hand-built IOP page styles;
   everything below supports the microsite header and the new blocks
   (evidence band, carrier list, intake form with inline Calendly step).
   ════════════════════════════════════════════════════════════════════════ */

/* ──── Microsite header ──── */
.ms-back { background: var(--ink); }
.ms-back .wrap { display: flex; justify-content: flex-end; }
.ms-back a { color: var(--cream); font-size: 12px; letter-spacing: .04em; padding: 7px 0; display: inline-flex; align-items: center; gap: 6px; opacity: .88; }
.ms-back a:hover { opacity: 1; text-decoration: underline; text-underline-offset: 3px; }
.ms-nav { position: sticky; top: 0; z-index: 60; background: color-mix(in oklab, var(--cream) 94%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid color-mix(in oklab, var(--ink) 10%, transparent); }
.ms-nav-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 0; }
.ms-nav-menu { display: none; gap: 26px; font-size: 14px; font-weight: 500; }
.ms-nav-menu a:hover { text-decoration: underline; text-underline-offset: 4px; }
.ms-nav-right { display: flex; align-items: center; gap: 16px; }
.ms-nav-phone { font-size: 13.5px; font-weight: 600; display: none; white-space: nowrap; }
@media (min-width: 900px) { .ms-nav-menu { display: flex; } }
@media (min-width: 640px) { .ms-nav-phone { display: inline; } }

/* ──── Evidence / research band ──── */
.iop-evidence-grid { display: grid; grid-template-columns: 1fr; gap: 40px; align-items: center; }
@media (min-width: 900px) { .iop-evidence-grid { grid-template-columns: 1fr 1.1fr; gap: 64px; } }
.iop-evidence-copy p { margin-top: 20px; max-width: 520px; }
.iop-evidence-source { display: block; padding: 14px 18px; background: var(--cream-2); border-left: 3px solid var(--butter); font-size: 13.5px; line-height: 1.55; font-style: italic; margin-top: 24px; max-width: 500px; }
.iop-evidence-stat { background: var(--ink); color: var(--cream); padding: clamp(32px, 5vw, 56px) clamp(28px, 4vw, 48px); border-radius: 22px; position: relative; overflow: hidden; }
.iop-evidence-stat::before { content: attr(data-stat); position: absolute; top: -40px; right: -20px; font-family: var(--font-serif); font-style: italic; font-size: clamp(160px, 24vw, 300px); line-height: 1; color: color-mix(in oklab, var(--butter) 12%, transparent); pointer-events: none; }
.iop-evidence-num { font-family: var(--font-serif); font-size: clamp(72px, 10vw, 116px); line-height: 1; letter-spacing: -.04em; color: var(--butter); position: relative; }
.iop-evidence-label { font-family: var(--font-serif); font-size: clamp(19px, 2.2vw, 24px); line-height: 1.25; margin-top: 14px; position: relative; max-width: 420px; }
.iop-evidence-outcomes { margin: 28px 0 0; padding: 24px 0 0; border-top: 1px solid color-mix(in oklab, var(--cream) 18%, transparent); list-style: none; display: flex; flex-direction: column; gap: 11px; position: relative; }
.iop-evidence-outcomes li { font-size: 13.5px; line-height: 1.5; color: color-mix(in oklab, var(--cream) 90%, transparent); display: flex; gap: 12px; }
.iop-evidence-outcomes li::before { content: "\2192"; color: var(--butter); flex: none; }

/* ──── Insurance carrier list card ──── */
.iop-carrier-card { background: var(--ink); color: var(--cream); padding: clamp(28px, 4vw, 44px); border-radius: 22px; }
.iop-carrier-card .micro { color: var(--butter); }
.iop-carrier-card h3 { color: var(--cream); margin-top: 12px; }
.iop-carrier-list { list-style: none; margin: 24px 0 0; padding: 0; display: grid; grid-template-columns: 1fr; border-top: 1px solid color-mix(in oklab, var(--cream) 16%, transparent); }
@media (min-width: 560px) { .iop-carrier-list { grid-template-columns: 1fr 1fr; column-gap: 28px; } }
.iop-carrier-list li { font-size: 13.5px; padding: 10px 0; color: color-mix(in oklab, var(--cream) 90%, transparent); border-bottom: 1px solid color-mix(in oklab, var(--cream) 10%, transparent); }
.iop-carrier-foot { margin-top: 24px; padding-top: 20px; border-top: 1px solid color-mix(in oklab, var(--cream) 16%, transparent); }
.iop-carrier-foot a { color: var(--butter); text-decoration: underline; text-underline-offset: 3px; font-size: 13.5px; font-weight: 500; }

/* ──── Intake form block ──── */
.iop-intake-form { background: var(--cream-2); border: 1px solid color-mix(in oklab, var(--ink) 10%, transparent); border-radius: 22px; padding: clamp(28px, 4vw, 44px); }
.iop-intake-form .form-grid { display: grid; grid-template-columns: 1fr; gap: 16px; margin-top: 24px; }
@media (min-width: 640px) { .iop-intake-form .form-grid { grid-template-columns: 1fr 1fr; } .iop-intake-form .field-full { grid-column: 1 / -1; } }
.iop-intake-form .field { display: flex; flex-direction: column; gap: 6px; }
.iop-intake-form label { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); }
.iop-intake-form label .opt { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--ink-2); }
.iop-intake-form input, .iop-intake-form select, .iop-intake-form textarea { background: var(--cream); border: 1px solid color-mix(in oklab, var(--ink) 16%, transparent); border-radius: 10px; padding: 13px 14px; font: inherit; font-size: 15px; color: var(--ink); width: 100%; }
.iop-intake-form input:focus, .iop-intake-form select:focus, .iop-intake-form textarea:focus { outline: 2px solid var(--butter); outline-offset: 1px; }
.iop-intake-form textarea { min-height: 96px; resize: vertical; }
.iop-choice-row { display: flex; flex-wrap: wrap; gap: 10px; }
.iop-choice { position: relative; }
.iop-choice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; cursor: pointer; }
.iop-choice span { display: inline-flex; align-items: center; padding: 10px 16px; border-radius: 999px; border: 1px solid color-mix(in oklab, var(--ink) 20%, transparent); background: var(--cream); font-size: 14px; font-weight: 500; cursor: pointer; user-select: none; }
.iop-choice input:checked + span { background: var(--butter); border-color: var(--butter); }
.iop-choice input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 2px; }
.iop-support-fieldset { border: 0; padding: 0; margin: 0; }
.iop-support-fieldset[hidden] { display: none; }
.iop-intake-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; line-height: 1.5; color: var(--ink-2); cursor: pointer; }
.iop-intake-consent input { width: auto; margin-top: 3px; flex: none; }
.iop-intake-error { background: color-mix(in oklab, #c0392b 12%, var(--cream)); border: 1px solid #c0392b; color: #7c221a; border-radius: 10px; padding: 12px 14px; font-size: 14px; }
.iop-intake-privacy { font-size: 12.5px; color: var(--ink-2); line-height: 1.55; }
.iop-calendly-step h3 { margin-bottom: 6px; }
.iop-calendly-embed { min-height: 680px; border-radius: 14px; overflow: hidden; background: var(--cream); }
.em-butter { color: var(--butter); }
.iop-phone-box { background: var(--cream-2); border-left: 3px solid var(--butter); padding: 18px 22px; border-radius: 0 12px 12px 0; }
.iop-phone-box .h-3 a { text-decoration: none; }
.iop-phone-box .h-3 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.iop-page .content-blocks > * + * { margin-top: 0; }
.ms-nav-home { background: transparent; color: var(--ink); border: 1px solid color-mix(in oklab, var(--ink) 25%, transparent); display: none; }
.ms-nav-home:hover { background: var(--cream-2); color: var(--ink); }
@media (min-width: 760px) { .ms-nav-home { display: inline-flex; } }

/* ──── Sample schedule grid ──── */
.iop-schedule-head { text-align: center; margin-bottom: 48px; }
.iop-schedule-meta { list-style: none; margin: 18px 0 0; padding: 0; display: flex; justify-content: center; flex-wrap: wrap; gap: 10px 28px; font-size: 13.5px; color: var(--ink-2); }
.iop-schedule-meta li { display: inline-flex; align-items: center; gap: 8px; }
.iop-schedule-meta li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--butter); }
.iop-schedule-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 14px; border: 1px solid color-mix(in oklab, var(--ink) 10%, transparent); }
.iop-schedule-scroll:focus-visible { outline: 2px solid var(--butter); outline-offset: 2px; }
.iop-schedule { width: 100%; min-width: 760px; border-collapse: collapse; background: var(--cream); }
.iop-schedule th, .iop-schedule td { border: 1px solid color-mix(in oklab, var(--ink) 8%, transparent); }
.iop-schedule thead th { background: var(--ink); color: var(--cream); font-family: var(--font-mono); font-size: 11px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; padding: 16px 12px; text-align: center; }
.iop-schedule thead th:first-child { background: var(--ink); width: 72px; }
.iop-schedule tbody th { background: var(--cream-2); font-family: var(--font-serif); font-style: italic; font-size: 15px; font-weight: 500; color: var(--ink); padding: 18px 12px; text-align: center; white-space: nowrap; }
.iop-schedule td { padding: 18px 14px; text-align: center; vertical-align: middle; min-height: 96px; }
.iop-schedule-session { display: inline-flex; flex-direction: column; align-items: center; gap: 10px; font-size: 13.5px; font-weight: 500; line-height: 1.3; color: var(--ink); max-width: 140px; }
.iop-schedule-session .sym-tile { width: 38px; height: 38px; background: var(--butter); border-color: transparent; color: var(--ink); border-radius: 50%; }
.iop-schedule-session .sym-tile .sym { width: 19px; height: 19px; }
.iop-schedule .visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ──── Pre-screening process ──── */
.iop-prescreen-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 14px; counter-reset: prescreen; }
@media (min-width: 640px) { .iop-prescreen-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .iop-prescreen-grid { grid-template-columns: repeat(4, 1fr); } }
.iop-prescreen-step { background: var(--cream-2); border: 1px solid color-mix(in oklab, var(--ink) 8%, transparent); border-top: 3px solid var(--butter); border-radius: 14px; padding: 30px 24px; display: flex; flex-direction: column; gap: 12px; }
.iop-prescreen-step h3 { margin: 0; }
.iop-prescreen-num { font-family: var(--font-serif); font-style: italic; font-size: 12px; color: color-mix(in oklab, var(--ink) 55%, transparent); letter-spacing: .04em; }
.iop-prescreen-num span { display: block; font-style: normal; font-size: 40px; line-height: 1; letter-spacing: -.03em; color: var(--ink); margin-top: 4px; }
.iop-prescreen-meta { list-style: none; margin: auto 0 0; padding: 14px 0 0; border-top: 1px solid color-mix(in oklab, var(--ink) 10%, transparent); display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; color: var(--ink-2); }
.iop-prescreen-meta li { display: flex; align-items: center; gap: 8px; }
.iop-prescreen-meta li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--butter); flex: none; }
.iop-prescreen-band { margin-top: 40px; background: var(--ink); color: var(--cream); border-radius: 14px; padding: 26px 32px; display: flex; flex-direction: column; gap: 8px; }
.iop-prescreen-band p { margin: 0; font-family: var(--font-serif); font-style: italic; font-size: clamp(17px, 2vw, 20px); line-height: 1.45; color: color-mix(in oklab, var(--cream) 92%, transparent); }
@media (min-width: 760px) { .iop-prescreen-band { flex-direction: row; align-items: center; gap: 32px; } .iop-prescreen-band .micro { flex: none; } }

/* ──── Program at a glance ──── */
.iop-glance { background: var(--ink); color: var(--cream); padding: clamp(36px, 5vw, 56px) 0; }
.iop-glance-inner { display: grid; grid-template-columns: 1fr; gap: 28px; align-items: center; }
@media (min-width: 900px) { .iop-glance-inner { grid-template-columns: 260px 1fr; gap: 48px; } }
.iop-glance-title h2 { color: var(--butter); margin: 0; }
.iop-glance-title p { margin: 8px 0 0; color: color-mix(in oklab, var(--cream) 75%, transparent); }
.iop-glance-items { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px 24px; }
@media (min-width: 640px) { .iop-glance-items { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1100px) { .iop-glance-items { grid-template-columns: repeat(6, 1fr); } }
.iop-glance-items li { border-left: 1px solid color-mix(in oklab, var(--cream) 20%, transparent); padding-left: 16px; }
.iop-glance-items strong { display: block; font-family: var(--font-serif); font-size: clamp(19px, 2vw, 23px); line-height: 1.15; letter-spacing: -.01em; color: var(--cream); }
.iop-glance-items span { display: block; margin-top: 4px; font-size: 12.5px; color: color-mix(in oklab, var(--cream) 70%, transparent); }

/* ──── Client journey strip ──── */
.iop-journey { background: var(--ink); color: var(--cream); padding: var(--section-py) 0; }
.iop-journey-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 8px; }
.iop-journey-scroll:focus-visible { outline: 2px solid var(--butter); outline-offset: 2px; }
.iop-journey-track { list-style: none; margin: 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); gap: 14px; }
.iop-journey-step { background: color-mix(in oklab, var(--cream) 6%, transparent); border: 1px solid color-mix(in oklab, var(--cream) 14%, transparent); border-radius: 14px; padding: 26px 22px; display: flex; flex-direction: column; gap: 10px; position: relative; }
.iop-journey-step h3 { margin: 0; }
.iop-journey-num { display: flex; align-items: center; gap: 10px; }
.iop-journey-num span { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 50%; background: var(--butter); color: var(--ink); font-family: var(--font-serif); font-size: 16px; }
.iop-journey-num::after { content: ""; flex: 1; height: 1px; background: color-mix(in oklab, var(--cream) 20%, transparent); }
.iop-journey-step:last-child .iop-journey-num::after { display: none; }

/* ──── Imagery band ──── */
.iop-imagery-grid { display: grid; grid-template-columns: 1fr; }
@media (min-width: 640px) { .iop-imagery-grid { grid-template-columns: repeat(3, 1fr); } .iop-imagery-grid[data-count="2"] { grid-template-columns: repeat(2, 1fr); } }
.iop-imagery-grid img { width: 100%; height: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block; }
.iop-imagery-ph { aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; background: var(--cream-2); }
.iop-imagery-ph:nth-child(2) { background: color-mix(in oklab, var(--butter) 30%, var(--cream)); }
.iop-imagery-ph:nth-child(3) { background: color-mix(in oklab, var(--ink) 8%, var(--cream)); }
.iop-imagery-ph span { font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-2); }

/* Scroll-spy rail clearance (July 24 review follow-up): at the widths where
   the fixed left rail renders (>=1440px), the content column narrows so the
   rail floats in the left margin instead of covering copy, matching how the
   homepage content sits inward of its rail. Scoped to the rail's OWN
   sections only (evidence through FAQ): the rail is hidden over the hero,
   intake, and closing banner, so those keep the full-width layout (Maya). */
@media (min-width: 1440px) {
  .iop-page #evidence .wrap,
  .iop-page #schedule .wrap,
  .iop-page #who .wrap,
  .iop-page #process .wrap,
  .iop-page #included .wrap,
  .iop-page #glance .wrap,
  .iop-page .iop-imagery .wrap,
  .iop-page .iop-statement .wrap,
  .iop-page #start .wrap,
  .iop-page #insurance .wrap,
  .iop-page #faq .wrap { max-width: 1160px; }
}