/* ---------- Tokens ---------- */
  :root {
    /* Core palette */
    --bg: #fff7f8;
    --bg-soft: #fff0f2;
    --bg-card: #ffffff;
    --line: #f1d6dc;
    --ink: #22151a;
    --ink-dim: #5a3f46;
    --ink-mute: #8b6c74;
    --accent: #e11d2e;
    --accent-2: #c61024;
    --ink-black: #0c0c0d;
    --good: #4ade80;
    --radius: 14px;
    --maxw: 1120px;
    --shadow: 0 12px 28px rgba(167, 44, 66, 0.10);
    /* Glass system (frosted Apple-style cards) */
    --glass-bg: rgba(255, 255, 255, 0.82);
    --glass-bg-soft: rgba(255, 255, 255, 0.68);
    --glass-border: rgba(212, 56, 83, 0.14);
    --glass-border-strong: rgba(212, 56, 83, 0.28);
    --glass-shadow: 0 10px 30px rgba(165, 47, 70, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.8);
    --glass-blur: saturate(140%) blur(8px);
    /* White-accent layer */
    --white-soft: rgba(255, 255, 255, 0.75);
    --white-line: rgba(212, 56, 83, 0.22);
  }
  * { box-sizing: border-box; }
  html { scroll-behavior: smooth; }
  body {
    margin: 0;
    background: var(--bg);
    color: var(--ink);
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
  }
  a { color: var(--accent-2); text-decoration: none; }
  a:hover { color: var(--accent); }
  img { max-width: 100%; display: block; }
  h1, h2, h3 { font-family: "Inter", "Helvetica Neue", sans-serif; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; margin: 0 0 .6em; }
  h1 { font-size: clamp(2.4rem, 5vw, 4rem); }
  h2 { font-size: clamp(1.8rem, 3.4vw, 2.6rem); }
  h3 { font-size: 1.2rem; }
  p { margin: 0 0 1em; color: var(--ink-dim); }
  .container { max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }
  .eyebrow {
    display: inline-block; font-size: .78rem; font-weight: 700; letter-spacing: .14em;
    text-transform: uppercase; color: var(--accent); margin-bottom: 14px;
  }
  .btn {
    display: inline-block; padding: 14px 22px; border-radius: 999px; font-weight: 700;
    background: var(--accent); color: #fff; border: 0; cursor: pointer; transition: transform .15s ease, background .2s;
    font-size: .95rem;
  }
  .btn:hover { background: #c01525; transform: translateY(-1px); color: #fff; }
  .btn.ghost { background: transparent; color: var(--ink); border: 1px solid var(--line); }
  .btn.ghost:hover { background: var(--bg-soft); }
  .btn.block { display: block; width: 100%; text-align: center; }

  /* ---------- Nav ---------- */
  header.nav {
    position: sticky; top: 0; z-index: 50;
    background: rgba(255, 250, 251, 0.92);
    backdrop-filter: saturate(160%) blur(10px);
    border-bottom: 1px solid var(--line);
  }
  .nav-inner { display: flex; align-items: center; justify-content: space-between; height: 68px; }
  .logo {
    font-weight: 900; letter-spacing: -.01em; font-size: 1.05rem;
    color: var(--ink); text-decoration: none;
    transition: opacity .15s ease;
  }
  a.logo:hover { color: var(--ink); opacity: .85; }
  .logo span { color: var(--accent); }
  .nav-links { display: flex; gap: 28px; align-items: center; }
  .nav-links a { color: var(--ink-dim); font-size: .92rem; font-weight: 500; }
  .nav-links a:hover { color: var(--ink); }
  .nav-links .btn { padding: 10px 18px; color: #fff; }
  .nav-links .btn:hover { color: #fff; }
  /* Mobile nav lives in the "Navigation" block at the end of this file. */

  /* ---------- Client utility bar ---------- */
  .client-bar {
    background: var(--bg-soft);
    border-bottom: 1px solid var(--line);
    padding: 10px 0;
  }
  .client-bar-inner {
    display: flex; align-items: center; gap: 12px; flex-wrap: nowrap;
    white-space: nowrap; overflow-x: auto;
  }
  .client-bar-label {
    font-size: .78rem; color: var(--accent); font-weight: 800;
    letter-spacing: .12em; text-transform: uppercase;
    flex-shrink: 0;
  }
  .client-bar-link {
    color: var(--ink-dim); font-weight: 600; font-size: .85rem;
    padding: 6px 14px; border: 1px solid var(--line); border-radius: 999px;
    transition: color .15s, background .15s, border-color .15s;
    display: inline-flex; align-items: center; gap: 6px;
  }
  .client-bar-link:hover {
    color: #fff; border-color: var(--accent); background: var(--accent);
  }
  .client-bar-link svg {
    width: 14px; height: 14px;
  }

  /* ---------- Hero ---------- */
  .hero {
    padding: 96px 0 80px;
    background:
      radial-gradient(900px 460px at 88% -10%, rgba(225, 29, 46, 0.17), transparent 60%),
      radial-gradient(700px 380px at 10% 22%, rgba(255, 128, 146, 0.20), transparent 64%),
      linear-gradient(180deg, #fff7f8 0%, #fff1f4 100%);
    border-bottom: 1px solid var(--line);
  }
  .hero-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 60px; align-items: center; }
  @media (max-width: 900px) { .hero-grid { grid-template-columns: 1fr; gap: 40px; } }
  .hero p.lead { font-size: 1.15rem; color: var(--ink-dim); max-width: 540px; }
  .hero-cta { display: flex; gap: 12px; margin-top: 28px; flex-wrap: wrap; align-items: center; }
  .trust-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
  }
  .trust-pill {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 6px 12px;
    font-size: .78rem;
    color: var(--ink-dim);
    background: rgba(255, 255, 255, 0.88);
  }
  .social-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 46px; height: 46px;
    border-radius: 50%; background: #fff; border: 1px solid var(--line);
    color: var(--ink-dim); transition: all .15s ease;
  }
  .social-btn:hover {
    color: #fff; background: var(--accent); border-color: var(--accent);
    transform: translateY(-1px);
  }
  .social-btn svg { width: 20px; height: 20px; }
  
  
  
  

  .hero-card {
    background: linear-gradient(180deg, #ffffff 0%, #fff6f8 100%);
    border: 1px solid var(--line); border-radius: 18px; padding: 28px;
    box-shadow: var(--shadow);
  }
  .hero-card h3 { font-size: 1rem; color: var(--accent-2); margin-bottom: 18px; }
  
  
  
  

  /* ---------- Sections ---------- */
  section { padding: 92px 0; border-bottom: 1px solid var(--line); }
  section.alt { background: linear-gradient(180deg, #fff7f8 0%, #fff1f4 100%); }
  .section-head { max-width: 720px; margin: 0 auto 56px; text-align: center; }
  .section-head p { color: var(--ink-dim); }
  .section-head h2 { margin-bottom: 10px; }
  #programs .section-head,
  #apply .section-head,
  #insights .section-head { text-align: left; margin-left: 0; margin-right: 0; }

  /* Lightweight layout polish */
  .nav-inner { max-width: var(--maxw); margin: 0 auto; }
  .hero p.lead,
  .section-head p,
  .testimonial .quote { text-wrap: balance; }

  /* Insights */
  
  
  .newsletter-card {
    background: var(--bg-card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 26px;
    position: sticky;
    top: 92px;
  }
  @media (max-width: 900px) {
    .newsletter-card { position: static; }
  }
  .newsletter-tag {
    display: inline-block;
    background: rgba(225, 29, 46, 0.14);
    color: var(--accent-2);
    border: 1px solid rgba(225, 29, 46, 0.32);
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    padding: 5px 10px;
    border-radius: 999px;
    margin-bottom: 14px;
  }
  .newsletter-card h3 { margin-bottom: 10px; }
  .newsletter-card p { font-size: .95rem; }
  .newsletter-fields {
    display: grid;
    gap: 10px;
    margin-bottom: 12px;
  }
  
  
  
  
  

  /* Collapsible packages section */
  .toggle-btn {
    display: inline-flex; align-items: center; gap: 10px;
    margin-top: 14px;
  }
  .toggle-btn .chevron {
    display: inline-block; transition: transform 0.25s ease;
    font-size: .85rem;
  }
  .toggle-btn.open .chevron { transform: rotate(180deg); }
  .programs-collapse {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.55s ease, opacity 0.35s ease, margin-top 0.3s ease;
    margin-top: 0;
  }
  .programs-collapse.open {
    max-height: 4000px;
    opacity: 1;
    margin-top: 32px;
  }

  .pricing { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
  /* 3 columns; slim the card padding so the price + checklist breathe */
  .pricing .price-card { padding: 22px 20px; }
  .pricing .price-card .price { font-size: 1.9rem; }
  @media (min-width: 1280px) {
    /* Wider viewports get a touch more room */
    .pricing { gap: 16px; }
    .pricing .price-card { padding: 26px 22px; }
    .pricing .price-card .price { font-size: 2.1rem; }
  }
  @media (max-width: 1100px) { .pricing { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 800px)  { .pricing { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 520px)  { .pricing { grid-template-columns: 1fr; } }
  .price-card {
    background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius);
    padding: 30px; display: flex; flex-direction: column; transition: border-color .2s, transform .2s;
  }
  .price-card:hover { border-color: var(--accent); transform: translateY(-2px); }
  .discount-banner {
    margin-bottom: 28px; padding: 22px 28px; border-radius: var(--radius);
    border: 1px solid var(--accent); background: rgba(225, 29, 46, .06);
    text-align: center; position: relative;
  }
  .discount-banner p { color: var(--ink-dim); font-size: .95rem; margin: 6px auto 0; max-width: 640px; }
  .discount-banner strong { color: var(--ink); }
  .discount-tag {
    display: inline-block; background: var(--accent); color: #fff;
    font-size: .7rem; font-weight: 700; letter-spacing: .12em;
    text-transform: uppercase; padding: 5px 12px; border-radius: 999px;
  }

  
  
  
  
  .price-card h3 { font-size: 1.15rem; margin-bottom: 4px; }
  .price-card .tier-sub { color: var(--ink-mute); font-size: .85rem; margin-bottom: 18px; }
  .price-card .price { font-size: 2.2rem; font-weight: 800; color: var(--ink); }
  .price-card .price small { font-size: .9rem; font-weight: 500; color: var(--ink-mute); }
  .price-card ul { list-style: none; padding: 0; margin: 22px 0; flex: 1; }
  .price-card li { padding: 8px 0 8px 24px; position: relative; font-size: .92rem; color: var(--ink-dim); }
  .price-card li::before {
    content: "✓"; position: absolute; left: 0; color: var(--accent); font-weight: 700;
  }

  /* Process */
  .process { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
  @media (max-width: 900px) { .process { grid-template-columns: 1fr; } }
  .step {
    background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius); padding: 26px;
  }
  .step .num {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border-radius: 50%; background: var(--accent); color: #fff;
    font-weight: 800; margin-bottom: 14px;
  }
  .step h3 { font-size: 1rem; margin-bottom: 6px; }
  .step p { font-size: .9rem; margin: 0; }

  /* ---------- Testimonials ---------- */
  .testimonials { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
  @media (max-width: 900px) { .testimonials { grid-template-columns: 1fr; } }
  .testimonial {
    background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius);
    padding: 28px; display: flex; flex-direction: column; position: relative;
  }
  .testimonial::before {
    content: "\201C"; position: absolute; top: 4px; left: 18px;
    font-family: Georgia, serif; font-size: 4rem; color: var(--accent); line-height: 1; opacity: .35;
  }
  .testimonial .quote {
    color: var(--ink); font-size: .98rem; line-height: 1.6; margin: 14px 0 22px; flex: 1; position: relative; z-index: 1;
  }
  .testimonial .who {
    display: flex; align-items: center; gap: 12px; padding-top: 18px; border-top: 1px solid var(--line);
  }
  .testimonial .avatar {
    width: 44px; height: 44px; border-radius: 50%;
    background: linear-gradient(135deg, var(--accent), var(--accent-2));
    display: inline-flex; align-items: center; justify-content: center;
    color: #fff; font-weight: 800; font-size: .95rem;
  }
  .testimonial .name { font-weight: 700; color: var(--ink); font-size: .92rem; }
  .testimonial .result { font-size: .8rem; color: var(--accent-2); font-weight: 600; }
  .stage-prep-tag { display: inline-block; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; background: var(--accent); color: #fff; border-radius: 4px; padding: 2px 7px; margin-top: 4px; }
  .ascendance-tag { display: inline-block; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; background: #0c0c0d; color: #fff; border-radius: 4px; padding: 2px 7px; margin-top: 4px; }
  .foundation-tag { display: inline-block; font-size: .7rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; background: #fff; color: var(--accent-2); border: 1px solid var(--accent); border-radius: 4px; padding: 1px 7px; margin-top: 4px; }
  

  /* Testimonial media slot (photo / video / before-after) */
  .testimonial-media {
    position: relative; aspect-ratio: 4 / 3;
    background: var(--bg-soft); border-radius: 10px; overflow: hidden;
    margin-bottom: 18px; border: 1px solid var(--line);
  }
  .testimonial-media img,
  .testimonial-media video {
    width: 100%; height: 100%; object-fit: cover; display: block;
  }
  .testimonial-media.split {
    display: grid; grid-template-columns: 1fr 1fr; gap: 2px; aspect-ratio: 4 / 3;
  }
  .testimonial-media.split > div {
    position: relative; background: var(--bg-soft); overflow: hidden;
  }
  .media-label {
    position: absolute; top: 8px; left: 8px; z-index: 2;
    background: rgba(0,0,0,.7); color: #fff; font-size: .7rem; font-weight: 700;
    letter-spacing: .08em; text-transform: uppercase; padding: 4px 9px; border-radius: 4px;
  }
  
  
  
  
  

  /* ---------- Transformations: one compare card at a time, centred ---------- */
  .transformations-grid {
    display: block; max-width: 620px; margin: 0 auto; position: relative;
  }
  .transformation-card {
    background: var(--bg-card); border: 1px solid var(--line);
    border-radius: var(--radius); padding: 22px;
    display: none;
  }
  
  .transformation-card .testimonial { margin: 0; }
  /* Duration captions, visible under each transformation. Centered + spaced
     so they read as a caption rather than a heading. */
  .transformation-card .result {
    display: block;
    text-align: center;
    color: var(--accent-2);
    font-weight: 600;
    font-size: .9rem;
    margin-top: 4px;
    padding: 6px 14px;
  }
  .transformation-card .name {
    text-align: center;
    margin: 0 auto;
  }
  .transformation-card .who {
    flex-direction: column;
    align-items: center;
    gap: 2px;
  }
  .transformation-card .avatar { margin: 0 auto 4px; }

  /* Mobile-only adjustments for transformation carousel */
  @media (max-width: 700px) {
    /* Bigger images: stack before/after vertically so each fills the width */
    .transformation-card .testimonial-media.split {
      grid-template-columns: 1fr;
      grid-auto-rows: auto;
      aspect-ratio: auto;
      gap: 28px;
    }
    /* Each photo container becomes a tall portrait shape (matches the source photos) */
    .transformation-card .testimonial-media.split > div {
      aspect-ratio: 3 / 4;
    }
    /* Move Before / After labels ABOVE the photo (out of the corner overlay) */
    .transformation-card .media-label {
      position: static;
      display: block;
      width: fit-content;
      background: transparent;
      color: var(--accent);
      font-size: .85rem;
      letter-spacing: .14em;
      padding: 0 0 8px;
      border-radius: 0;
    }
    .transformation-card {
      padding: 16px;
    }
    /* ---- Bigger, swipeable transformation photos on mobile ----
       The compare slider was only taking ~30% of the screen because the
       card, the inner .testimonial and the grid were each adding padding.
       Strip that back so the photo runs almost edge to edge, and switch
       the frame to the source photos' true 2:3 shape so it gets taller
       AND stops side-cropping. */
    .transformations-grid { gap: 10px; padding: 6px 0 10px; }
    .transformations-grid .transformation-card { flex: 0 0 94vw; padding: 0; }
    .transformations-grid .transformation-card .testimonial { padding: 10px 10px 14px; }
    /* Must out-specify ".transformation-card .testimonial-media.split > div"
       above, which also matches .ba-wrap (it IS a direct child div).
       Keep this at 3/4: every transformation photo in the carousel is a 3:4
       source (780x1040 and friends), so a taller 2/3 frame would silently
       crop ~11% off each side with object-fit: cover. The size win on mobile
       comes from the card width, not from squeezing the frame. */
    .transformations-grid .transformation-card .testimonial-media.split > .ba-wrap {
      aspect-ratio: 3 / 4;
    }
    /* PRE-EXISTING BUG: the "drag to compare" hint is also a direct child div,
       so it inherited the 3/4 aspect-ratio above and rendered as a ~440px tall
       invisible block, leaving a huge empty gap under every carousel photo on
       mobile. Reset it to its natural text height. */
    .transformations-grid .transformation-card .testimonial-media.split > .ba-hint {
      aspect-ratio: auto;
    }
    /* Bigger touch targets on the slider itself */
    .transformations-grid .ba-expand { width: 44px; height: 44px; font-size: 1.2rem; }
    .transformations-grid .ba-tag { font-size: .72rem; padding: 5px 12px; }
    .transformations-grid .ba-hint { font-size: .8rem; }
    /* Carousel arrows sit under a much wider card now */
    .tcar-controls { max-width: 94vw; }
  }

  
  
  
  
  
  
  

  /* ---------- "More transformations" strip below the main card ---------- */
  .carousel-section { margin-top: 72px; text-align: center; }
  .carousel-section h3 {
    font-size: 1.35rem; margin-bottom: 4px; letter-spacing: -.01em;
  }
  .carousel-section .sub {
    color: var(--ink-mute); font-size: .9rem; margin-bottom: 32px;
  }
  
  
  
  
  
  
  
  
  
  

  /* ---------- Forms ---------- */
  .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  @media (max-width: 700px) { .form-grid { grid-template-columns: 1fr; } }
  .field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
  .field.full { grid-column: 1 / -1; }
  .field label { font-size: .85rem; font-weight: 600; color: var(--ink); }
  .field label .req { color: var(--accent); }
  .field input, .field select, .field textarea {
    background: var(--bg-soft); border: 1px solid var(--line); border-radius: 10px;
    padding: 12px 14px; color: var(--ink); font-size: .95rem; font-family: inherit; transition: border-color .15s;
  }
  .field input:focus, .field select:focus, .field textarea:focus {
    outline: none; border-color: var(--accent);
  }
  .field textarea { min-height: 110px; resize: vertical; }
  .field .help { font-size: .78rem; color: var(--ink-mute); }
  .field .err { font-size: .78rem; color: #ff7a7a; display: none; }
  .field.has-error input, .field.has-error select, .field.has-error textarea { border-color: #ff7a7a; }
  .field.has-error .err { display: block; }

  .form-card {
    background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius);
    padding: 32px; max-width: 760px; margin: 0 auto;
  }

  /* multi-step */
  .stepper { display: flex; gap: 8px; margin-bottom: 28px; }
  .stepper .pip {
    flex: 1; height: 6px; background: var(--line); border-radius: 999px; transition: background .2s;
  }
  .stepper .pip.active { background: var(--accent); }
  .step-panel { display: none; }
  .step-panel.active { display: block; animation: fadeIn .25s ease; }
  @keyframes fadeIn { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
  .step-actions { display: flex; justify-content: space-between; gap: 10px; margin-top: 12px; }

  .form-success {
    text-align: center; padding: 30px 10px;
  }
  .form-success .check {
    width: 64px; height: 64px; border-radius: 50%; background: rgba(74,222,128,.15);
    color: var(--good); display: inline-flex; align-items: center; justify-content: center;
    font-size: 32px; margin-bottom: 14px;
  }

  /* Booking embed placeholder */
  .embed-box {
    background: var(--bg-card); border: 1px dashed var(--line); border-radius: var(--radius);
    padding: 28px; text-align: center; max-width: 760px; margin: 0 auto;
  }
  .embed-box code {
    background: var(--bg-soft); padding: 2px 8px; border-radius: 6px; font-size: .85rem; color: var(--accent-2);
  }

  
  
  

  /* Footer */
  footer {
    padding: 40px 0; text-align: center; color: var(--ink-mute); font-size: .85rem;
  }
  footer a { color: var(--ink-dim); margin: 0 10px; }

  /* Client-only sections (booking + check in): hidden until For Clients button is clicked */
  .client-section { display: none; }
  .client-section.revealed { display: block; }

  /* Client gate */
  .gate-card {
    background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius);
    padding: 40px 32px; max-width: 440px; margin: 0 auto; text-align: center;
  }
  .gate-icon {
    width: 56px; height: 56px; border-radius: 50%;
    background: rgba(225,29,46,.15); color: var(--accent);
    display: inline-flex; align-items: center; justify-content: center; margin-bottom: 16px;
  }
  .gate-icon svg { width: 26px; height: 26px; }
  .gate-card h3 { margin-bottom: 6px; }
  .gate-card .help { color: var(--ink-mute); font-size: .85rem; margin-top: 14px; }

  /* Reach out today mini-form */
  .reach-out-card {
    max-width: 640px; margin: 0 auto;
    background: var(--bg-card); border: 1px solid var(--line);
    border-radius: var(--radius); padding: 36px 32px;
  }
  .reach-out-form .field { margin-bottom: 14px; }
  @media (max-width: 700px) { .reach-out-card { padding: 28px 22px; } }

  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  

  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  

  .calc-faq { margin-top: 36px; padding-top: 28px; border-top: 1px solid var(--line); }
  /* Calculator FAQ (shared styling with tools.html) */
  .calc-faq h3 { font-size: 1.2rem; margin-bottom: 16px; }
  .calc-faq details { border-bottom: 1px solid var(--line); padding: 14px 0; }
  .calc-faq summary {
    cursor: pointer; font-weight: 600; color: var(--ink);
    font-size: .95rem; list-style: none; position: relative; padding-right: 24px;
  }
  .calc-faq summary::-webkit-details-marker { display: none; }
  .calc-faq summary::after {
    content: "+"; position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
    color: var(--accent); font-weight: 700; font-size: 1.2rem;
  }
  .calc-faq details[open] summary::after { content: "−"; }
  .calc-faq details p { margin-top: 10px; color: var(--ink-dim); font-size: .9rem; line-height: 1.6; }

  /* Enhanced check in block (revealed when athlete picks "Enhanced") */
  .enhanced-block {
    border: 1px solid var(--line); border-left: 3px solid var(--accent);
    border-radius: 12px; padding: 22px 22px 8px; margin-bottom: 20px;
    background: rgba(255, 255, 255, 0.02);
  }
  .enhanced-tag {
    display: inline-block; background: var(--accent); color: #fff;
    font-size: .65rem; font-weight: 700; letter-spacing: .14em;
    text-transform: uppercase; padding: 4px 10px; border-radius: 999px;
    margin-bottom: 14px;
  }

  /* Toast */
  .toast {
    position: fixed; bottom: 30px; left: 50%; transform: translateX(-50%) translateY(20px);
    background: var(--bg-card); border: 1px solid var(--line); padding: 14px 20px; border-radius: 10px;
    color: var(--ink); font-size: .9rem; opacity: 0; pointer-events: none; transition: all .25s; z-index: 100;
    box-shadow: var(--shadow);
  }
  .toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

  /* Skip link for keyboard / screen-reader users */
  .skip-link {
    position: absolute; left: -9999px; top: 0; padding: 10px 14px;
    background: var(--accent); color: #fff; font-weight: 700; border-radius: 0 0 8px 0;
    z-index: 999;
  }
  .skip-link:focus { left: 0; }

  /* Broken / missing image fallback (styled, not the ugly default icon) */
  img.broken {
    background: linear-gradient(135deg, #1a2128, #11151a);
    border: 1px dashed var(--line);
    color: transparent;
    position: relative;
  }
  img.broken::after {
    content: "Photo coming soon";
    position: absolute; inset: 0;
    display: flex; align-items: center; justify-content: center;
    color: var(--ink-mute); font-size: .8rem; font-weight: 600;
    background: var(--bg-card); border-radius: inherit;
  }

  /* Respect reduced-motion preference */
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
      animation-duration: .001ms !important;
      transition-duration: .001ms !important;
    }
    html { scroll-behavior: auto; }
  }

  /* Focus visibility */
  a:focus-visible, button:focus-visible, input:focus-visible,
  select:focus-visible, textarea:focus-visible {
    outline: 2px solid var(--accent-2); outline-offset: 2px;
  }

  /* ============================================================ */
  /* High-tech polish, frosted-glass / Apple-style overlay        */
  /* Appended at end so it overrides earlier rules via order.      */
  /* ============================================================ */
  /* Animated aurora behind everything */
  body { position: relative; }
  body::before {
    content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -2;
    background:
      radial-gradient(900px 600px at 12% 8%,  rgba(225, 29, 46, 0.12), transparent 60%),
      radial-gradient(800px 500px at 88% 22%, rgba(255, 90, 95, 0.07), transparent 60%),
      radial-gradient(700px 500px at 50% 100%, rgba(225, 29, 46, 0.08), transparent 60%);
    animation: aurora 26s ease-in-out infinite alternate;
  }
  /* Faint precision grid */
  body::after {
    content: ""; position: fixed; inset: 0; pointer-events: none; z-index: -1;
    background-image:
      linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
    background-size: 44px 44px;
    -webkit-mask-image: radial-gradient(circle at center, black, transparent 75%);
            mask-image: radial-gradient(circle at center, black, transparent 75%);
  }
  @keyframes aurora {
    0%   { transform: translate3d(0, 0, 0) scale(1);      opacity: .75; }
    50%  { transform: translate3d(2%, -1%, 0) scale(1.04); opacity: 1; }
    100% { transform: translate3d(-1%, 1.5%, 0) scale(.98); opacity: .85; }
  }
  /* Glassy nav */
  header.nav {
    background: rgba(255, 250, 251, 0.9);
    -webkit-backdrop-filter: var(--glass-blur);
            backdrop-filter: var(--glass-blur);
    border-bottom: 1px solid var(--glass-border);
  }
  /* Convert cards to frosted glass */
  .reach-out-card,
  .price-card,
  .testimonial,
  .transformation-card,
  .step,
  .hero-card,
  .form-card,
  .gate-card,
  .embed-box,
  .newsletter-card,
  .toast,
  .client-bar {
    background: var(--glass-bg);
    -webkit-backdrop-filter: var(--glass-blur);
            backdrop-filter: var(--glass-blur);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-shadow);
    position: relative;
  }
  /* Lighter glass for inputs */
  .field input,
  .field select,
  .field textarea {
    background: rgba(11, 13, 16, 0.35);
    -webkit-backdrop-filter: saturate(140%) blur(10px);
            backdrop-filter: saturate(140%) blur(10px);
    border: 1px solid rgba(255,255,255,0.06);
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
  }
  .field input:focus,
  .field select:focus,
  .field textarea:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(225, 29, 46, 0.18);
    background: rgba(11, 13, 16, 0.5);
  }
  /* Let the aurora show through */
  section { background: transparent; }
  section.alt {
    background: linear-gradient(180deg, #fff7f8 0%, #fff1f4 100%);
    -webkit-backdrop-filter: none;
            backdrop-filter: none;
  }
  /* Premium hover micro-animations */
  .btn {
    transition: transform .22s cubic-bezier(.2, .9, .3, 1.4),
                background .22s ease,
                box-shadow .22s ease;
  }
  .btn:hover {
    box-shadow: 0 10px 30px -8px rgba(225, 29, 46, 0.55),
                0 0 0 1px rgba(225, 29, 46, 0.20);
  }
  .btn:active { transform: scale(.97); }

  .price-card, .step, .testimonial, .transformation-card {
    transition: transform .25s cubic-bezier(.2, .9, .3, 1.2),
                border-color .25s ease,
                box-shadow .25s ease;
  }
  .price-card:hover, .step:hover, .testimonial:hover, .transformation-card:hover {
    transform: translateY(-3px);
    border-color: var(--glass-border-strong);
    box-shadow: 0 16px 44px rgba(0,0,0,0.45),
                0 0 0 1px rgba(225, 29, 46, 0.18),
                inset 0 1px 0 rgba(255,255,255,0.06);
  }
  
  
  
  
  /* (Removed leftover dark-theme eyebrow + logo red glows, created subtle
     halos on the light bg.) */
  
  
  /* Subtle gradient outline on the main cards (Apple-ish) */
  .reach-out-card::after,
  .hero-card::after,
  .form-card::after {
    content: "";
    position: absolute; inset: 0;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(135deg,
      rgba(225, 29, 46, 0.35),
      rgba(255, 255, 255, 0.05) 35%,
      transparent 60%,
      rgba(255, 90, 95, 0.18));
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
            mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
            mask-composite: exclude;
    pointer-events: none;
    opacity: .55;
  }
  /* Reduced motion: kill aurora */
  @media (prefers-reduced-motion: reduce) {
    body::before { animation: none; }
  }
  /* Tab hidden (Page Visibility API): pause animations to save battery */
  body.is-hidden::before,
  body.is-hidden .eyebrow::before { animation-play-state: paused !important; }

  /* ============================================================ */
  /* White accents, restrained, premium highlights                */
  /* ============================================================ */
  /* Two pricing toggles side-by-side (coaching + premade) */
  .pricing-toggles {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
    margin-top: 14px;
  }
  .pricing-toggles .toggle-btn { margin: 0; }
  @media (max-width: 540px) {
    .pricing-toggles { flex-direction: column; align-items: stretch; }
    .pricing-toggles .toggle-btn { justify-content: center; }
  }

    /* Apple-style top-edge "light hitting glass" highlight on cards */
  .reach-out-card,
  .price-card,
  .testimonial,
  .transformation-card,
  .step,
  .hero-card,
  .form-card,
  .gate-card,
  .embed-box,
  .newsletter-card,
  .toast {
    box-shadow:
      var(--glass-shadow),
      inset 0 1px 0 rgba(255, 255, 255, 0.12),
      inset 0 0 0 1px rgba(255, 255, 255, 0.025);
  }

  /* Pulsing white "live" dot before each eyebrow tag */
  .eyebrow {
    display: inline-flex; align-items: center; gap: 8px;
  }
  .eyebrow::before {
    content: ""; width: 6px; height: 6px;
    border-radius: 50%;
    background: var(--accent);
    box-shadow: 0 0 0 3px rgba(225, 29, 46, 0.14);
    animation: white-pulse 2.4s ease-in-out infinite;
    flex-shrink: 0;
  }
  @keyframes white-pulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0.50), 0 0 8px rgba(255,255,255,0.35); }
    50%      { box-shadow: 0 0 0 6px rgba(255,255,255,0.00), 0 0 14px rgba(255,255,255,0.60); }
  }

  /* (Removed leftover dark-theme white glow, was muddying dark text on the
     warm-white background.) */

  /* White sheen on button hover */
  .btn { position: relative; overflow: hidden; isolation: isolate; }
  .btn::after {
    content: "";
    position: absolute; inset: 0;
    background: linear-gradient(135deg,
      rgba(255, 255, 255, 0.20) 0%,
      rgba(255, 255, 255, 0.04) 35%,
      transparent 60%);
    opacity: 0;
    transition: opacity .25s ease;
    pointer-events: none;
    z-index: -1;
  }
  .btn:hover::after { opacity: 1; }

  /* Animated white underline on nav links hover (skip the red CTA btn) */
  .nav-links a:not(.btn) { position: relative; }
  .nav-links a:not(.btn)::after {
    content: "";
    position: absolute; left: 0; right: 0; bottom: -4px;
    height: 1px;
    background: rgba(255, 255, 255, 0.55);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .22s ease;
  }
  .nav-links a:not(.btn):hover::after { transform: scaleX(1); }

  /* Client utility bar links, subtle white underline hint */
  .client-bar-link {
    position: relative;
    border-color: rgba(255, 255, 255, 0.10);
  }

  /* White inner stroke on focused inputs (layered with the red ring) */
  .field input:focus,
  .field select:focus,
  .field textarea:focus {
    box-shadow:
      0 0 0 3px rgba(225, 29, 46, 0.18),
      inset 0 0 0 1px rgba(255, 255, 255, 0.10);
  }

  /* Stepper pips: subtle white outline on active state */
  .stepper .pip { box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06); }
  .stepper .pip.active { box-shadow: inset 0 0 0 1px rgba(255,255,255,0.18); }

  
  

  /* Footer dividers, a thin centered white line */
  footer { position: relative; }
  footer::before {
    content: "";
    position: absolute; top: 0; left: 50%;
    transform: translateX(-50%);
    width: min(420px, 60%); height: 1px;
    background: linear-gradient(to right,
      transparent,
      var(--white-line) 30%,
      var(--white-line) 70%,
      transparent);
  }

  /* Process step numbers (1, 2, 3) get a faint white ring */
  .step .num {
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.10),
                0 4px 12px rgba(225, 29, 46, 0.35);
  }

  /* ============================================================ */
  /* Light theme refresh overrides                                */
  /* ============================================================ */
  body {
    background:
      radial-gradient(900px 500px at 5% -10%, rgba(255, 142, 164, 0.22), transparent 62%),
      radial-gradient(840px 420px at 98% 0%, rgba(225, 29, 46, 0.14), transparent 60%),
      var(--bg);
  }
  .nav-links a { color: #603f47; }
  .nav-links a:hover { color: var(--accent); }
  .btn.ghost { background: #fff; border-color: #eac8cf; color: #442b32; }
  .btn.ghost:hover { background: #fff1f4; border-color: #dc8b9b; }

  .reach-out-card,
  .price-card,
  .testimonial,
  .transformation-card,
  .step,
  .hero-card,
  .form-card,
  .gate-card,
  .embed-box,
  .newsletter-card,
  .toast,
  .client-bar {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(214, 88, 110, 0.22);
    box-shadow: 0 10px 26px rgba(182, 71, 92, 0.12), inset 0 1px 0 rgba(255,255,255,0.95);
  }
  .field input,
  .field select,
  .field textarea {
    background: #fff;
    border-color: #e7c8cf;
    color: #2a1a20;
  }
  .field input::placeholder,
  .field textarea::placeholder { color: #9b7f86; }
  .field input:focus,
  .field select:focus,
  .field textarea:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(225, 29, 46, 0.12);
  }
  .media-label {
    background: rgba(255,255,255,.92);
    color: #7c2938;
    border: 1px solid #efc7cf;
  }
  img.broken {
    background: linear-gradient(135deg, #fff6f8, #ffecef);
    border: 1px dashed #e5bdc6;
  }
  img.broken::after { color: #8a5b66; }
  footer {
    color: #7d5d65;
    background: linear-gradient(180deg, rgba(255, 243, 246, 0.8), rgba(255, 255, 255, 0.95));
  }
  footer a { color: #5a3941; }
  footer a:hover { color: var(--accent); }

  /* ============================================================ */
  /* TYPOGRAPHY UPGRADE, Big Shoulders Display + Space Grotesk    */
  /* Appended at end so it overrides earlier font declarations.   */
  /* ============================================================ */
  body,
  p,
  li,
  button,
  input,
  select,
  textarea,
  .lead,
  .nav-links,
  .nav-links a,
  .btn,
  .trust-pill,
  .newsletter-card,
  .newsletter-card p {
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  }
  h1, h2 {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-weight: 900;
    letter-spacing: -0.005em;
    line-height: 0.96;
    text-transform: uppercase;
  }
  h1 { font-size: clamp(2.8rem, 6vw, 5rem); }
  h2 { font-size: clamp(2.2rem, 4.2vw, 3.4rem); }
  h3 {
    font-family: "Space Grotesk", system-ui, sans-serif;
    font-weight: 700; letter-spacing: -0.01em;
  }
  .logo {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-weight: 900; font-size: 1.4rem;
    letter-spacing: 0.01em; text-transform: uppercase;
  }
  
  .price-card h3,
  .testimonial .name,
  .step h3,
  .hero-card h3 {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-weight: 800; letter-spacing: 0;
    text-transform: none;
  }

  /* ============================================================ */
  /* 80s RETRO POLISH, offset shadows, hard-edge poster art       */
  /* ============================================================ */
  /* 1. No text shadow on dark-text headlines, caused muddy edges against the
     warm-white background. The 80s feel comes from Big Shoulders uppercase +
     card box-shadows + the stripe banner below. */
  /* 2. Magazine-style italic emphasis */
  em, strong em, em strong {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-style: italic;
    font-weight: 900;
    color: var(--accent);
    text-transform: uppercase;
    letter-spacing: 0.02em;
    font-size: 1.05em;
  }
  /* 3. Hard 80s sticker-shadow on key cards (overrides earlier glass shadows) */
  .price-card,
  .testimonial,
  .transformation-card,
  .step,
  .hero-card,
  .form-card,
  .gate-card,
  .embed-box,
  .newsletter-card,
  .reach-out-card {
    box-shadow:
      5px 5px 0 #0c0c0d,
      var(--shadow);
    transition: transform .22s cubic-bezier(.2,.9,.3,1.2), box-shadow .22s ease;
  }
  .price-card:hover, .testimonial:hover, .transformation-card:hover, .step:hover,
  .newsletter-card:hover, .reach-out-card:hover {
    transform: translate(-2px, -2px);
    box-shadow:
      8px 8px 0 var(--accent),
      var(--shadow);
  }
  /* 4. Red/black "marquee tape" runs across the very top of the hero,
     above all content, doesn't overlap any words. */
  .hero { position: relative; overflow: hidden; }
  .hero::after {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 10px;
    background: repeating-linear-gradient(
      -45deg,
      var(--accent) 0 10px,
      #0c0c0d 10px 20px
    );
    pointer-events: none;
    z-index: 2;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.08);
  }
  /* 5. Logo + eyebrow: no shadow on dark text. */

  /* ============================================================ */
  /* Collapsible Reach-out bar (sits as a slim band between        */
  /* the "Get to know our coach" hero and the testimonials)        */
  /* ============================================================ */
  /* ---------- TidyCal booking ---------- */
  .tidycal-wrap {
    background: var(--bg-card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 5px 5px 0 #0c0c0d, var(--shadow);
    padding: 10px;
    min-height: 620px;
  }
  .tidycal-wrap .tidycal-embed { min-height: 600px; }
  .tidycal-note {
    color: var(--ink-mute);
    font-size: .85rem;
    text-align: center;
    margin-top: 14px;
  }
  .booking-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    margin-top: 18px;
  }
  @media (max-width: 680px) {
    .booking-grid { grid-template-columns: 1fr; }
  }
  .booking-card {
    display: flex;
    flex-direction: column;
    gap: 4px;
    text-align: left;
    padding: 16px 18px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
  }
  .booking-card:hover {
    transform: translate(-2px, -2px);
    border-color: var(--accent);
    box-shadow: 5px 5px 0 var(--accent);
  }
  .booking-dur {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-weight: 900;
    font-size: 1.5rem;
    color: var(--accent-2);
    line-height: 1;
  }
  .booking-name { color: var(--ink); font-weight: 700; font-size: .95rem; }
  .booking-go { color: var(--ink-mute); font-size: .85rem; margin-top: 2px; }
  /* Extra transformations, shown inline on the dedicated results page. */
  .more-results { margin-top: 26px; }

  .height-row { display: flex; align-items: center; gap: 8px; }
  .height-row input { width: 92px; }
  .height-row span { color: var(--ink-mute); font-size: .9rem; font-weight: 600; }
  #applyForm[hidden] { display: none; }

  /* ---------- Follow band ---------- */
  .social-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
  @media (max-width: 760px) { .social-cards { grid-template-columns: 1fr; } }
  .social-card {
    display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
    padding: 22px 22px 20px;
    background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius);
    box-shadow: 5px 5px 0 #0c0c0d, var(--shadow);
    transition: transform .22s cubic-bezier(.2,.9,.3,1.2), box-shadow .22s ease;
  }
  .social-card:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 var(--accent), var(--shadow); }
  .social-card-icon { color: var(--accent-2); margin-bottom: 8px; }
  .social-card-icon svg { width: 30px; height: 30px; }
  .social-card-net {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-weight: 800; font-size: 1.15rem; color: var(--ink);
  }
  .social-card-handle { color: var(--accent-2); font-weight: 700; font-size: .92rem; }
  .social-card-note { color: var(--ink-dim); font-size: .88rem; margin-top: 6px; }

  /* Weekly 1-5 ratings on the check in */
  .rating-block {
    margin: 22px 0 4px; padding: 20px 20px 6px;
    background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius);
  }
  .rating-head { font-weight: 800; color: var(--ink); font-size: 1rem; }
  .rating-sub { color: var(--ink-mute); font-size: .86rem; margin: 4px 0 16px; }

  /* ---------- Mission band + coach section ---------- */
  .mission-band { background: var(--bg-soft); text-align: center; }
  .mission-band .container { max-width: 820px; }
  .mission-statement {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-weight: 800;
    font-size: clamp(1.5rem, 3.1vw, 2.3rem);
    line-height: 1.22;
    color: var(--ink);
    margin: 10px 0 18px;
    text-wrap: balance;
  }
  .mission-rest {
    color: var(--ink-dim);
    font-size: 1rem;
    line-height: 1.7;
    margin: 0 auto;
    max-width: 680px;
  }
  .coach-grid {
    display: grid;
    grid-template-columns: 1.25fr 1fr;
    gap: 34px;
    align-items: start;
  }
  @media (max-width: 860px) {
    .coach-grid { grid-template-columns: 1fr; gap: 24px; }
  }
  .coach-copy p { color: var(--ink); font-size: .96rem; line-height: 1.7; margin: 0; }
  .coach-cred {
    margin-top: 16px !important;
    padding-top: 16px;
    border-top: 1px solid var(--line);
  }
  .coach-photos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .coach-shot { margin-bottom: 0; aspect-ratio: 1/1; border-radius: 12px; }
  .hero-portrait { align-self: start; }
  
  
  
  .reach-out-details {
    background: var(--bg-card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 5px 5px 0 #0c0c0d, var(--shadow);
    overflow: hidden;
    transition: border-color .22s ease, box-shadow .22s ease;
  }
  .reach-out-details[open] {
    border-color: var(--accent);
    box-shadow: 7px 7px 0 var(--accent), var(--shadow);
  }
  .reach-out-summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 20px 26px;
    user-select: none;
  }
  .reach-out-summary::-webkit-details-marker { display: none; }
  .reach-out-summary:hover { background: var(--bg-soft); }
  .reach-out-summary:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
  .reach-out-summary-text {
    display: flex; flex-direction: column; gap: 4px;
    min-width: 0;
  }
  .reach-out-summary-title {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-weight: 900; letter-spacing: -0.005em;
    font-size: 1.65rem; line-height: 1.02;
    color: var(--ink);
    text-transform: uppercase;
  }
  .reach-out-summary-sub {
    color: var(--ink-dim);
    font-size: .9rem; line-height: 1.45;
  }
  .reach-out-chevron {
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px;
    border-radius: 999px;
    background: var(--accent); color: #fff;
    font-size: 1.6rem; font-weight: 800; line-height: 1;
    flex-shrink: 0;
    transition: transform .25s cubic-bezier(.2, .9, .3, 1.3);
    box-shadow: 0 8px 22px -8px rgba(225, 29, 46, 0.55);
  }
  .reach-out-details[open] .reach-out-chevron { transform: rotate(45deg); }
  .reach-out-details .reach-out-card {
    border: 0; border-top: 1px solid var(--line);
    border-radius: 0; box-shadow: none;
    margin: 0; padding: 24px 26px 28px;
  }
  .reach-out-details .reach-out-card::after { display: none; }
  @media (max-width: 600px) {
    .reach-out-summary { padding: 18px 20px; gap: 12px; }
    .reach-out-summary-title { font-size: 1.35rem; }
    .reach-out-summary-sub { font-size: .82rem; }
    .reach-out-chevron { width: 36px; height: 36px; font-size: 1.3rem; }
  }

  /* Standalone newsletter card on the homepage Insights section
     (article previews removed; newsletter is now the only thing in the row). */
  .newsletter-card.insights-solo {
    max-width: 560px;
    margin: 0 auto;
    position: static;
  }

  /* Small "(optional)" hint next to optional form labels */
  .field label .opt {
    color: var(--ink-mute);
    font-weight: 500;
    font-size: .75rem;
    margin-left: 4px;
  }
  /* Textareas should match input styling */
  .field textarea {
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 12px 14px;
    color: var(--ink);
    font-size: .95rem;
    font-family: inherit;
    line-height: 1.4;
    resize: vertical;
    min-height: 84px;
    transition: border-color .18s ease, box-shadow .18s ease;
  }
  .field textarea::placeholder { color: var(--ink-mute); }
  .field textarea:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(225, 29, 46, 0.15);
    background: #fff;
  }

  /* One time plans sub-section divider + grid */
  .onetime-divider {
    margin: 56px auto 22px;
    text-align: center;
    max-width: 640px;
    padding: 26px 16px 0;
    border-top: 1px solid var(--line);
  }
  .onetime-divider h3 {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-weight: 700;
    font-size: 1.7rem;
    line-height: 1.05;
    letter-spacing: -.005em;
    text-transform: uppercase;
    color: var(--ink);
    margin: 8px 0 8px;
  }
  .onetime-divider p { font-size: .95rem; color: var(--ink-dim); margin: 0; }
  .pricing-onetime {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
  }
  .pricing-onetime .price-card { padding: 22px 18px; }
  .pricing-onetime .price-card h3 { font-size: 1.05rem; }
  .pricing-onetime .price-card .tier-sub { font-size: .78rem; margin-bottom: 14px; }
  .pricing-onetime .price-card .price { font-size: 1.7rem; }
  .pricing-onetime .price-card ul { margin: 16px 0; }
  .pricing-onetime .price-card li { padding: 6px 0 6px 22px; font-size: .85rem; }
  .price-card.best-value {
    border-color: var(--accent);
    border-width: 2px;
    position: relative;
    box-shadow: 5px 5px 0 var(--ink-black), var(--shadow);
  }
  .best-value-badge {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--accent);
    color: #fff;
    font-size: .68rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: 4px 12px;
    border-radius: 999px;
    box-shadow: 0 8px 18px -6px rgba(225, 29, 46, 0.55);
  }

    /* ============================================================ */
  /* One time plan order forms                                     */
  /* ============================================================ */
  
  
  
  
  
  
  
  
  
  
  .onetime-form {
    padding: 0 24px 26px;
  }
  .onetime-form .field { margin-bottom: 14px; }
  .onetime-form .field textarea { min-height: 80px; }
  .onetime-form .help {
    font-size: .82rem;
    color: var(--ink-mute);
    margin-top: 6px;
    line-height: 1.45;
  }
  @media (max-width: 600px) {
    
    
    
    .onetime-form { padding: 0 18px 22px; }
  }

    /* "Coming soon" pill inline with the Newsletter eyebrow */
  .coming-soon-pill {
    display: inline-flex; align-items: center;
    background: var(--ink-black);
    color: #fff;
    font-size: .7rem; font-weight: 700;
    letter-spacing: .12em;
    padding: 3px 9px; border-radius: 999px;
    margin-left: 6px;
    text-shadow: none;
  }
  .coming-soon-pill::before {
    content: ""; width: 5px; height: 5px;
    border-radius: 50%; background: #4ade80;
    box-shadow: 0 0 6px rgba(74, 222, 128, 0.7);
    margin-right: 6px;
    animation: pulse-green 2.2s ease-in-out infinite;
  }
  @keyframes pulse-green {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
  }

  /* ============================================================ */
  /* Footer enhancements: CTA banner + brand tagline                */
  /* ============================================================ */
  .footer-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 22px;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
    text-decoration: none;
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 22px;
    box-shadow: 0 14px 32px -10px rgba(225, 29, 46, 0.45);
    transition: all .2s ease;
  }
  .footer-cta:hover {
    color: #fff;
    background: var(--accent-2);
    transform: translateY(-1px);
  }
  .footer-cta span { font-weight: 500; opacity: 0.9; }
  .footer-cta strong { font-weight: 700; }
  .footer-cta-arrow {
    font-weight: 800;
    transition: transform .2s ease;
  }
  .footer-cta:hover .footer-cta-arrow { transform: translateX(3px); }
  .footer-tagline {
    color: var(--ink-dim);
    font-size: .92rem;
    line-height: 1.5;
    margin: 0 0 22px;
    max-width: 360px;
    margin-left: auto;
    margin-right: auto;
  }
  @media (max-width: 600px) {
    .footer-cta { font-size: .95rem; padding: 11px 18px; gap: 8px; }
    .footer-tagline { font-size: .85rem; }
  }

  /* ============================================================ */
  /* Calculator promo strip at the very top of the page            */
  /* ============================================================ */
  .calc-promo-bar {
    display: block;
    background: linear-gradient(90deg, var(--accent) 0%, #c01525 100%);
    color: #fff;
    text-decoration: none;
    font-family: "Space Grotesk", system-ui, sans-serif;
    text-align: center;
    transition: filter .2s ease;
    position: relative;
    overflow: hidden;
  }
  .calc-promo-bar:hover { color: #fff; filter: brightness(1.08); }
  .calc-promo-bar:focus-visible {
    outline: 2px solid #fff; outline-offset: -3px;
  }
  /* Subtle diagonal stripe texture, very 80s warning tape */
  .calc-promo-bar::before {
    content: "";
    position: absolute; inset: 0;
    background-image: repeating-linear-gradient(
      -45deg,
      transparent 0 18px,
      rgba(0, 0, 0, 0.06) 18px 22px
    );
    pointer-events: none;
  }
  .calc-promo-inner {
    position: relative;
    display: inline-flex; align-items: center;
    gap: 14px; padding: 11px 22px;
    font-size: .88rem;
  }
  .calc-promo-flag {
    background: #fff; color: var(--accent);
    font-weight: 900; font-size: .7rem;
    letter-spacing: .14em; text-transform: uppercase;
    padding: 3px 9px; border-radius: 4px;
    flex-shrink: 0;
  }
  .calc-promo-text {
    font-weight: 500;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.10);
  }
  .calc-promo-cta {
    font-weight: 800; letter-spacing: .01em;
    display: inline-flex; align-items: center; gap: 4px;
    border-left: 1px solid rgba(255, 255, 255, 0.30);
    padding-left: 14px;
  }
  .calc-promo-arrow { transition: transform .2s ease; }
  .calc-promo-bar:hover .calc-promo-arrow { transform: translateX(3px); }
  @media (max-width: 760px) {
    .calc-promo-inner {
      gap: 8px; padding: 9px 14px;
      font-size: .78rem; flex-wrap: wrap; justify-content: center;
    }
    .calc-promo-cta { border-left: 0; padding-left: 0; }
    .calc-promo-text { max-width: 100%; }
  }

  /* ============================================================ */
  /* One time plan order modal                                     */
  /* ============================================================ */
  .order-modal {
    position: fixed; inset: 0; z-index: 1000;
    display: none;
    align-items: flex-start;
    justify-content: center;
    padding: 40px 20px;
  }
  .order-modal.open { display: flex; }
  .order-modal-backdrop {
    position: absolute; inset: 0;
    background: rgba(12, 12, 13, 0.55);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    cursor: pointer;
  }
  .order-modal-card {
    position: relative;
    background: var(--bg-card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: 0 24px 60px -10px rgba(12,12,13,0.45), var(--shadow);
    max-width: 640px;
    width: 100%;
    max-height: calc(100vh - 80px);
    overflow-y: auto;
    padding: 32px 32px 28px;
  }
  .order-modal-close {
    position: absolute;
    top: 10px; right: 10px;
    width: 36px; height: 36px;
    border-radius: 999px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    color: var(--ink-dim);
    font-size: 1.4rem; line-height: 1;
    cursor: pointer;
    transition: all .2s ease;
    z-index: 2;
  }
  .order-modal-close:hover {
    color: #fff; background: var(--accent); border-color: var(--accent);
  }
  .order-modal-form { display: none; }
  .order-modal-form.active { display: block; }
  .order-modal-title {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    font-weight: 700;
    font-size: 1.6rem;
    line-height: 1.1;
    text-transform: uppercase;
    color: var(--ink);
    margin: 0 0 22px;
    padding-right: 36px;
  }
  .order-modal-price {
    color: var(--accent);
    font-weight: 700;
    font-size: 1.15rem;
    margin-left: 6px;
  }
  .order-modal-form .field { margin-bottom: 14px; }
  .order-modal-form .field textarea { min-height: 80px; }
  .order-modal-form .help {
    font-size: .82rem; color: var(--ink-mute);
    margin-top: 6px; line-height: 1.45;
  }
  body.modal-open { overflow: hidden; }
  @media (max-width: 600px) {
    .order-modal { padding: 16px; align-items: flex-start; }
    .order-modal-card { padding: 24px 18px 22px; max-height: calc(100vh - 32px); }
    .order-modal-title { font-size: 1.3rem; padding-right: 32px; }
  }

  /* Compact newsletter section (no posts yet, keep it low-key for now) */
  #insights { padding: 48px 0; }
  #insights .section-head { margin-bottom: 24px; }
  #insights .section-head h2 { font-size: clamp(1.5rem, 2.6vw, 2rem); }
  #insights .section-head p { font-size: .9rem; max-width: 560px; margin-left: auto; margin-right: auto; }
  #insights .newsletter-card { padding: 24px 22px; max-width: 640px; margin: 0 auto; }
  #insights .newsletter-card h3 { font-size: 1.05rem; }

  /* Hero bullet list */
  .lead-list { list-style: none; padding: 0; margin: 0 0 6px; }
  .lead-list li {
    position: relative; padding-left: 26px; margin-bottom: 8px;
    color: var(--ink-dim); font-size: 1.02rem; line-height: 1.45;
  }
  .lead-list li::before {
    content: ""; position: absolute; left: 4px; top: .52em;
    width: 9px; height: 9px; border-radius: 2px;
    background: var(--accent); transform: rotate(45deg);
  }

  .lead-list .lead-bb { font-size: 1.14rem; color: var(--ink); }
  .lead-list .lead-bb::before { width: 11px; height: 11px; top: .48em; }
  .lead-list .lead-bb strong {
    font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
    text-transform: uppercase; letter-spacing: .02em;
    color: var(--accent); font-weight: 700; font-size: 1.15em;
  }

  /* ===== Transformations v2: interactive compare sliders + snap carousel ===== */
  .transformations-grid {
    display: flex; gap: 18px; max-width: none;
    overflow-x: auto; scroll-snap-type: x mandatory;
    padding: 8px 2px 12px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .transformations-grid::-webkit-scrollbar { display: none; }
  .transformations-grid .transformation-card {
    display: block; flex: 0 0 min(430px, 91vw);
    scroll-snap-align: center;
  }
  .tcar-controls { display: flex; align-items: center; gap: 16px; max-width: 430px; margin: 20px auto 0; }
  .tcar-arrow {
    width: 46px; height: 46px; border-radius: 50%; flex-shrink: 0;
    border: 1px solid var(--line); background: var(--bg-card); color: var(--ink);
    font-size: 1.05rem; cursor: pointer; transition: all .18s ease;
    display: inline-flex; align-items: center; justify-content: center; font-family: inherit;
  }
  .tcar-arrow:hover { background: var(--accent); border-color: var(--accent); color: #fff; transform: translateY(-1px); }
  .tcar-progress { flex: 1; height: 4px; border-radius: 999px; background: var(--bg-soft); border: 1px solid var(--line); overflow: hidden; }
  .tcar-bar { display: block; height: 100%; width: 8%; background: var(--accent); border-radius: 999px; transition: width .15s ease; }

  /* Real people, real results: 2x2 layout with bigger photos */
  .testimonials { grid-template-columns: repeat(2, 1fr); gap: 26px; }
  @media (max-width: 860px) { .testimonials { grid-template-columns: 1fr; } }
  /* Let each before/after panel match the photos' true 2:3 / 3:4 shape (no side-cropping) */
  .testimonials .testimonial-media.split { aspect-ratio: auto; height: auto; overflow: visible; background: transparent; border: 0; }
  .testimonials .testimonial-media.split > div { aspect-ratio: 2 / 3; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); }
  /* Stage-day strip (contest-day photos) */
  .stage-strip { max-width: 1120px; margin: 40px auto 0; text-align: center; }
  .stage-strip-title {
    font-size: .78rem; font-weight: 700; letter-spacing: .14em;
    text-transform: uppercase; color: var(--accent); margin-bottom: 14px;
  }
  .stage-strip-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
  @media (max-width: 640px) { .stage-strip-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; } }
  .stage-strip-grid picture { display: block; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); }
  .stage-strip-grid img { width: 100%; aspect-ratio: 2 / 3; object-fit: cover; display: block; }
  .stage-strip-cap { font-size: .82rem; color: var(--ink-mute); margin-top: 10px; }

  /* Photo lightbox: tap any before/after to expand */
  .testimonial-media.split img, .stage-strip picture img { cursor: zoom-in; }
  .lightbox {
    position: fixed; inset: 0; z-index: 200; display: none;
    align-items: center; justify-content: center; padding: 24px;
    background: rgba(12,12,13,.9);
    -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
    cursor: zoom-out;
  }
  .lightbox.open { display: flex; animation: fadeIn .18s ease; }
  .lightbox-pair {
    display: flex; gap: 14px; align-items: flex-start; justify-content: center;
    max-width: 96vw; cursor: default;
  }
  .lightbox-pair figure { margin: 0; text-align: center; }
  .lightbox-pair img {
    max-width: 45vw; max-height: 78vh; width: auto; height: auto;
    object-fit: contain; border-radius: 12px;
    box-shadow: 0 30px 80px rgba(0,0,0,.55);
  }
  .lightbox-pair figcaption {
    display: inline-block; margin-top: 10px; color: #fff;
    font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    background: rgba(0,0,0,.6); padding: 5px 14px; border-radius: 999px;
  }
  .lightbox-pair figure:last-child figcaption { background: var(--accent); }
  @media (max-width: 640px) {
    .lightbox-pair { gap: 8px; }
    .lightbox-pair img { max-width: 46vw; max-height: 62vh; }
  }
  .lightbox-cap {
    position: absolute; bottom: 22px; left: 50%; transform: translateX(-50%);
    color: #fff; font-size: .9rem; font-weight: 600; white-space: nowrap;
    background: rgba(0,0,0,.6); padding: 8px 18px; border-radius: 999px;
  }
  .lightbox-close {
    position: absolute; top: 16px; right: 16px; width: 46px; height: 46px;
    border-radius: 50%; border: 0; background: rgba(255,255,255,.14);
    color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer; font-family: inherit;
  }
  .lightbox-close:hover { background: var(--accent); }

  .stage-strip-grid2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; max-width: 860px; margin: 26px auto 0; }
  .stage-strip-grid2 picture { display: block; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); }
  .stage-strip-grid2 img { width: 100%; aspect-ratio: 21 / 20; object-fit: cover; display: block; }

  /* Carousel compare slider + expand-to-lightbox */
  .transformations-grid .testimonial-media.ba-ready {
    display: block; aspect-ratio: auto; height: auto;
    background: transparent; border: 0; overflow: visible;
  }
  .ba-wrap {
    position: relative; border-radius: 12px; overflow: hidden;
    aspect-ratio: 3 / 4; background: var(--bg-soft);
    border: 1px solid var(--line);
    user-select: none; -webkit-user-select: none;
  }
  .ba-wrap picture { position: absolute; inset: 0; }
  .ba-wrap picture img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; cursor: default; }
  .ba-before { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--pos, 50%)) 0 0); z-index: 1; }
  .ba-divider {
    position: absolute; top: 0; bottom: 0; left: var(--pos, 50%);
    width: 2px; background: #fff; transform: translateX(-1px);
    box-shadow: 0 0 12px rgba(0,0,0,.4); z-index: 2; pointer-events: none;
  }
  .ba-tag {
    position: absolute; top: 10px; z-index: 4; padding: 4px 11px; border-radius: 999px;
    font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
    pointer-events: none;
  }
  .ba-tag-b { left: 10px; background: rgba(12,12,13,.75); color: #fff; }
  .ba-tag-a { right: 10px; background: var(--accent); color: #fff; }
  .ba-expand {
    position: absolute; right: 10px; bottom: 10px; z-index: 6;
    width: 38px; height: 38px; border-radius: 10px; border: 0;
    background: rgba(12,12,13,.72); color: #fff; cursor: pointer;
    font-size: 1.05rem; line-height: 1; font-family: inherit;
    display: inline-flex; align-items: center; justify-content: center;
    transition: background .15s ease;
  }
  .ba-expand:hover { background: var(--accent); }
  /* The federation links sit inside body text, and the site's link colour is
     only 2.94:1 against it - too low to be the sole cue. Underline them. */
  .lead-list a { text-decoration: underline; text-underline-offset: 2px; }
  .lead-list a:hover { text-decoration-thickness: 2px; }

  /* Federation cards on the home page */
  .fed-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 8px; }
  @media (max-width: 900px) { .fed-cards { grid-template-columns: 1fr; } }
  .fed-card {
    display: flex; flex-direction: column; gap: 8px;
    padding: 26px 24px 24px;
    background: var(--bg-card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    text-decoration: none;
    box-shadow: var(--shadow);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
  }
  .fed-card:hover {
    transform: translateY(-4px);
    border-color: var(--accent);
    box-shadow: 0 18px 38px -18px rgba(167, 44, 66, 0.28);
  }
  .fed-card-k {
    font-size: .7rem; text-transform: uppercase; letter-spacing: .1em;
    font-weight: 700; color: var(--accent);
  }
  .fed-card h3 { margin: 0; font-size: 1.15rem; color: var(--ink); letter-spacing: -.01em; }
  .fed-card p { margin: 0; font-size: .9rem; line-height: 1.6; color: var(--ink-dim); flex: 1; }
  .fed-card-go { font-size: .86rem; font-weight: 700; color: var(--accent-2); margin-top: 4px; }
  .fed-card:hover .fed-card-go { color: var(--accent); }
  @media (prefers-reduced-motion: reduce) { .fed-card { transition: none; } .fed-card:hover { transform: none; } }

  /* Pose switcher on multi-pose transformation cards */
  
  
  
  
  
  
  
  

  .ba-hint {
    text-align: center;
    margin-top: 12px;
  }

  /* ---------- Payments (client bar → #payments) ---------- */
  .pay-intro-note { max-width: 720px; margin: 0 auto 26px; text-align: center; font-size: .88rem; color: var(--ink-mute); }
  .pay-intro-note strong { color: var(--ink-dim); }
  .pay-tabs { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin: 0 auto 10px; max-width: 640px; }
  .pay-tab {
    font-family: inherit; font-size: .85rem; font-weight: 700;
    color: var(--ink-dim); background: var(--white-soft);
    border: 1px solid var(--line); border-radius: 999px;
    padding: 9px 18px; cursor: pointer;
    transition: color .15s, background .15s, border-color .15s;
  }
  .pay-tab:hover { border-color: var(--glass-border-strong); color: var(--ink); }
  .pay-tab.active { color: #fff; background: var(--accent); border-color: var(--accent); }
  .pay-tab:focus-visible { outline: 2px solid var(--accent-2); outline-offset: 2px; }
  .pay-view { display: none; }
  .pay-view.active { display: block; }
  .pay-terms { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; margin: 22px auto 4px; }
  .pay-term {
    font-family: inherit; font-size: .8rem; font-weight: 700;
    color: var(--ink-mute); background: transparent;
    border: 1px solid var(--line); border-radius: 999px;
    padding: 7px 16px; cursor: pointer;
    transition: color .15s, background .15s, border-color .15s;
  }
  .pay-term:hover { color: var(--ink-dim); border-color: var(--glass-border-strong); }
  .pay-term.active { color: var(--accent-2); border-color: var(--accent); background: var(--bg-soft); }
  .pay-term:focus-visible { outline: 2px solid var(--accent-2); outline-offset: 2px; }
  .pay-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 22px; align-items: stretch; }
  @media (max-width: 900px) { .pay-grid { grid-template-columns: 1fr 1fr; } }
  @media (max-width: 560px) { .pay-grid { grid-template-columns: 1fr; } }
  .pay-card {
    background: var(--glass-bg); border: 1px solid var(--glass-border);
    border-radius: var(--radius); box-shadow: var(--glass-shadow);
    padding: 24px 22px; display: flex; flex-direction: column; position: relative;
  }
  
  .pay-card.featured { border-color: var(--glass-border-strong); }
  .pay-card h3 { font-size: 1.15rem; margin: 0 0 4px; }
  .pay-card .pay-sub {
    font-size: .78rem; color: var(--ink-mute); font-weight: 600;
    text-transform: uppercase; letter-spacing: .06em; margin-bottom: 14px;
  }
  .pay-card .pay-price {
    font-family: "Inter", sans-serif; font-weight: 800; font-size: 2.1rem;
    color: var(--ink); line-height: 1; letter-spacing: -0.03em;
  }
  .pay-card .pay-price small { font-size: .8rem; font-weight: 600; color: var(--ink-mute); letter-spacing: 0; }
  .pay-card .pay-equiv { font-size: .78rem; color: var(--ink-mute); margin-top: 6px; }
  .pay-card ul { list-style: none; padding: 0; margin: 16px 0 14px; }
  .pay-card ul li { font-size: .85rem; color: var(--ink-dim); padding-left: 20px; position: relative; margin-bottom: 7px; }
  .pay-card ul li::before { content: "✓"; position: absolute; left: 0; top: 0; color: var(--accent); font-weight: 800; font-size: .8rem; }
  .pay-card .pay-note {
    font-size: .74rem; color: var(--ink-mute); margin: 0 0 16px;
    padding-top: 12px; border-top: 1px solid var(--line);
  }
  .pay-card .pay-cta { margin-top: auto; }
  .pay-badge {
    position: absolute; top: -10px; left: 50%; transform: translateX(-50%);
    background: var(--accent); color: #fff; font-size: .66rem; font-weight: 800;
    letter-spacing: .09em; text-transform: uppercase;
    padding: 4px 12px; border-radius: 999px; white-space: nowrap;
  }
  .pay-soon {
    display: block; width: 100%; text-align: center;
    font-family: inherit; font-size: .85rem; font-weight: 700;
    padding: 12px 18px; border-radius: 999px;
    border: 1px dashed var(--line); background: transparent;
    color: var(--ink-mute); cursor: not-allowed;
  }
  .pay-secure {
    margin-top: 30px; text-align: center; font-size: .78rem; color: var(--ink-mute);
    display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap;
  }
  .pay-secure svg { width: 14px; height: 14px; flex-shrink: 0; }

  /* ---------- "Committed to getting results?" CTA (end of the application) ---------- */
  .commit-cta {
    margin-top: 26px; padding: 30px 26px; text-align: center;
    background: var(--bg-soft); border: 1px solid var(--glass-border-strong);
    border-radius: var(--radius); position: relative;
  }
  .commit-eyebrow {
    display: inline-block; font-size: .72rem; font-weight: 800;
    letter-spacing: .16em; text-transform: uppercase; color: var(--accent);
    margin-bottom: 10px;
  }
  .commit-title { font-size: clamp(1.3rem, 3vw, 1.75rem); margin: 0 0 10px; }
  .commit-sub {
    color: var(--ink-dim); font-size: .93rem; max-width: 520px;
    margin: 0 auto 20px; line-height: 1.6;
  }
  .commit-btn { font-size: .95rem; padding: 13px 30px; }
  .commit-fine { color: var(--ink-mute); font-size: .78rem; margin: 16px 0 0; }

/* ---------- Homepage pricing teaser + where-to-next cards ---------- */
.price-summary-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px;
}
@media (max-width: 860px) { .price-summary-grid { grid-template-columns: 1fr; } }
.price-summary {
  position: relative; display: flex; flex-direction: column;
  padding: 26px 24px 24px;
  background: var(--bg-card); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: 5px 5px 0 #0c0c0d, var(--shadow);
  transition: transform .22s cubic-bezier(.2,.9,.3,1.2), box-shadow .22s ease;
}
.price-summary:hover { transform: translate(-2px,-2px); box-shadow: 8px 8px 0 var(--accent), var(--shadow); }
.price-summary.featured-plan { border-color: var(--accent); }
.price-summary-badge {
  position: absolute; top: -11px; left: 24px;
  background: var(--accent); color: #fff; font-size: .68rem; font-weight: 800;
  letter-spacing: .08em; text-transform: uppercase; padding: 4px 10px; border-radius: 999px;
}
.price-summary-name {
  font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
  font-weight: 800; font-size: 1.2rem; color: var(--ink);
}
.price-summary-cost {
  font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
  font-weight: 900; font-size: 2.3rem; color: var(--accent-2); line-height: 1.05; margin: 2px 0 10px;
}
.price-summary-cost span { font-size: 1rem; color: var(--ink-mute); font-weight: 700; }
.price-summary p { color: var(--ink-dim); font-size: .92rem; margin: 0 0 16px; flex: 1; }
.price-summary-go { color: var(--accent-2); font-weight: 700; font-size: .9rem; }
.price-summary-note {
  text-align: center; color: var(--ink-mute); font-size: .88rem; margin-top: 22px;
}
.next-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
@media (max-width: 900px) { .next-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 520px) { .next-grid { grid-template-columns: 1fr; } }
.next-card {
  display: flex; flex-direction: column; gap: 4px;
  padding: 20px; background: var(--bg-soft);
  border: 1px solid var(--line); border-radius: var(--radius);
  transition: transform .2s ease, border-color .2s ease;
}
.next-card:hover { transform: translateY(-3px); border-color: var(--accent); }
.next-card strong {
  font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
  font-weight: 800; font-size: 1.05rem; color: var(--ink);
}
.next-card span { color: var(--ink-dim); font-size: .86rem; }

/* The hero's right column is short, so the standard section gap reads as a
   dead zone before the mission band. Pull the two together a little. */
.hero + .mission-band { padding-top: 64px; }
.hero { padding-bottom: 56px; }
.hero-portrait .coach-photos { max-width: 420px; margin-left: auto; }

/* ---------- Hero cut-out portrait ---------- */
.hero-cutout {
  display: block;
  width: 100%;
  max-width: 440px;
  height: auto;
  margin-left: auto;
  filter: drop-shadow(0 18px 34px rgba(0,0,0,.28));
}
@media (max-width: 860px) {
  .hero-cutout { max-width: 320px; margin: 0 auto; }
}

/* ---------- "Still competing" band ---------- */
.gym-band { background: var(--bg-soft); }
.gym-grid {
  display: grid;
  grid-template-columns: .85fr 1.15fr;
  gap: 44px;
  align-items: center;
}
@media (max-width: 860px) {
  .gym-grid { grid-template-columns: 1fr; gap: 26px; }
  .gym-photo img { height: 380px; }
}
.gym-photo img {
  width: 100%;
  /* The source is a tall portrait; cap it so the band does not tower over
     the copy beside it. Framed from the top to keep the pose in shot. */
  height: clamp(420px, 46vw, 600px);
  object-fit: cover;
  object-position: 50% 18%;
  border-radius: var(--radius);
  border: 1px solid var(--line);
  box-shadow: 6px 6px 0 #0c0c0d, var(--shadow);
}
.gym-copy h2 { margin: 6px 0 14px; }
.gym-copy p { color: var(--ink-dim); font-size: .98rem; line-height: 1.7; margin: 0 0 14px; }

/* ---------- Client area: made deliberately obvious ----------
   Clients were missing a thin grey strip, so the bar now reads as a real
   destination and the three tools are one tap each. */
.client-bar {
  background: linear-gradient(90deg, #2a1a20 0%, #3a1f27 100%);
  border-bottom: 2px solid var(--accent);
  padding: 12px 0;
}
.client-bar-inner { gap: 14px; }
.client-bar-label {
  color: #ffd9df;
  font-size: .8rem;
  letter-spacing: .1em;
}
.client-bar-link {
  color: #fff;
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.22);
  font-size: .86rem;
  font-weight: 700;
  padding: 7px 16px;
}
.client-bar-link:hover {
  color: #fff;
  background: var(--accent);
  border-color: var(--accent);
}
.client-bar-link svg { width: 15px; height: 15px; }
.nav-links .btn.ghost.nav-client {
  color: var(--accent-2);
  border: 1px solid var(--accent);
  background: transparent;
}
.nav-links .btn.ghost.nav-client:hover { background: var(--accent); color: #fff; }
@media (max-width: 760px) {
  .client-bar-inner { justify-content: flex-start; }
  .client-bar-label { font-size: .7rem; }
  .client-bar-link { font-size: .78rem; padding: 6px 12px; }
}

/* The full label eats the bar on a phone, leaving room for one button. */
.client-bar-label .cb-short { display: none; }
@media (max-width: 700px) {
  .client-bar-label .cb-long { display: none; }
  .client-bar-label .cb-short { display: inline; }
}

/* ---------- Before / after: one button sweeps the reveal ---------- */
.ba-toggle {
  font-family: "Oswald", Impact, "Arial Narrow", sans-serif;
  font-weight: 700;
  font-size: .9rem;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: #fff;
  background: var(--accent);
  border: 0;
  border-radius: 999px;
  padding: 11px 26px;
  cursor: pointer;
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
  box-shadow: 0 4px 14px rgba(225,29,46,.3);
  min-width: 210px;
}
.ba-toggle:hover { background: var(--accent-2); transform: translateY(-1px); }
.ba-toggle:active { transform: translateY(0); }
.ba-toggle:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
/* The divider only makes sense while the reveal is mid-sweep. */
.ba-wrap .ba-divider { transition: opacity .2s ease; }
.ba-wrap.is-after .ba-divider { opacity: 0; }
.ba-wrap picture img { cursor: default; }

/* Only one photo is on screen at a time now, so dim the badge that is not
   the one being shown rather than labelling the same image twice. */
.ba-tag { transition: opacity .25s ease; }
.ba-wrap:not(.is-after) .ba-tag-a { opacity: 0; }
.ba-wrap.is-after .ba-tag-b { opacity: 0; }

/* ==========================================================================
   Navigation
   Desktop: one row. Below 960px: logo, Apply and a menu button, with the
   links in a panel. The old wrapped layout made the sticky header 142px on a
   phone, a sixth of the screen gone for the whole visit.
   ========================================================================== */
.nav-toggle, .nav-apply-mobile { display: none; }

/* Where you are. aria-current was already set; now it is visible too. */
.nav-links a[aria-current="page"]:not(.btn) {
  color: var(--accent-2);
  font-weight: 700;
  position: relative;
}
.nav-links a[aria-current="page"]:not(.btn)::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: -6px;
  height: 2px; border-radius: 2px; background: var(--accent);
}

@media (max-width: 960px) {
  /* Without JavaScript the links just wrap, so nothing is ever unreachable. */
  .nav-inner { height: auto; padding-top: 10px; padding-bottom: 10px; flex-wrap: wrap; gap: 8px 14px; }
  .nav-links { flex-wrap: wrap; gap: 8px 14px; justify-content: center; }

  .js .nav-inner { flex-wrap: nowrap; height: 60px; padding-top: 0; padding-bottom: 0; gap: 10px; }
  .js .logo { font-size: 1rem; white-space: nowrap; }
  .js .nav-apply-mobile {
    display: inline-flex; align-items: center;
    margin-left: auto; padding: 9px 18px; font-size: .85rem; min-height: 40px;
  }
  .js .nav-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 44px; height: 44px; flex-shrink: 0;
    border: 1px solid var(--line); border-radius: 12px;
    background: var(--bg-card); cursor: pointer; padding: 0;
  }
  .js .nav-toggle:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
  .nav-toggle-bars,
  .nav-toggle-bars::before,
  .nav-toggle-bars::after {
    display: block; width: 20px; height: 2px; border-radius: 2px;
    background: var(--ink); transition: transform .22s ease, opacity .18s ease;
  }
  .nav-toggle-bars { position: relative; }
  .nav-toggle-bars::before, .nav-toggle-bars::after { content: ""; position: absolute; left: 0; }
  .nav-toggle-bars::before { top: -6px; }
  .nav-toggle-bars::after  { top: 6px; }
  header.nav.nav-open .nav-toggle-bars { background: transparent; }
  header.nav.nav-open .nav-toggle-bars::before { transform: translateY(6px) rotate(45deg); }
  header.nav.nav-open .nav-toggle-bars::after  { transform: translateY(-6px) rotate(-45deg); }

  .js .nav-links {
    display: none;
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: #fffafb;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 18px 30px rgba(20,10,14,.14);
    padding: 6px 0 16px;
    max-height: calc(100vh - 60px); overflow-y: auto;
  }
  .js header.nav.nav-open .nav-links { display: flex; }
  .js .nav-links a:not(.btn) {
    display: flex; align-items: center;
    min-height: 50px; padding: 0 24px;
    font-size: 1.02rem; font-weight: 600; color: var(--ink);
    border-bottom: 1px solid var(--line);
  }
  .js .nav-links a[aria-current="page"]:not(.btn) {
    color: var(--accent-2); box-shadow: inset 4px 0 0 var(--accent);
  }
  .js .nav-links a[aria-current="page"]:not(.btn)::after { display: none; }
  .js .nav-links .btn {
    margin: 12px 24px 0; justify-content: center; text-align: center;
    min-height: 48px; display: flex; align-items: center; font-size: .95rem;
  }
}
@media (max-width: 380px) {
  .js .logo { font-size: .88rem; }
  .js .nav-apply-mobile { padding: 8px 14px; }
}

/* The promo strip wrapped to three lines on a phone (96px). One line is plenty. */
.calc-promo-text .cp-short { display: none; }
@media (max-width: 700px) {
  .calc-promo-text .cp-long { display: none; }
  .calc-promo-text .cp-short { display: inline; }
  .calc-promo-inner { flex-wrap: nowrap; gap: 10px; white-space: nowrap; font-size: .8rem; }
  .calc-promo-bar { padding-top: 9px; padding-bottom: 9px; }
  .calc-promo-flag { display: none; }
}

/* ==========================================================================
   Mobile hero: get the face of the brand onto the first screen
   On a phone the photo used to arrive two screens down, under the headline,
   list, buttons, pills and contact card.
   ========================================================================== */
@media (max-width: 900px) {
  .hero { padding-top: 28px; padding-bottom: 44px; }
  .hero-portrait { order: -1; }
  .hero-cutout { max-width: 240px; margin: 0 auto -6px; }
  /* the pills restate the bullet list right above them */
  .hero .trust-row { display: none; }
  .hero-cta { flex-wrap: wrap; justify-content: flex-start; gap: 12px; }
  .hero-cta .btn { flex: 1 1 100%; justify-content: center; min-height: 52px; }
}

/* ==========================================================================
   Footer
   ========================================================================== */
.footer-links {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 6px 22px; max-width: 760px; margin: 0 auto;
}
.footer-links a { color: var(--ink-dim); font-size: .9rem; padding: 6px 2px; }
.footer-links a:hover { color: var(--accent-2); }
@media (max-width: 600px) {
  .footer-links {
    display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; text-align: left;
    max-width: 360px;
  }
  .footer-links a {
    display: flex; align-items: center; min-height: 44px; padding: 0 8px;
    border-bottom: 1px solid var(--line); font-size: .95rem;
  }
  /* stop the big CTA splitting into three columns of wrapped words */
  .footer-cta { flex-direction: column; gap: 2px; padding: 16px 24px; text-align: center; }
  .footer-cta span:first-child { font-size: .78rem; opacity: .85; }
  .footer-cta strong { font-size: 1.05rem; }
  .footer-cta .footer-cta-arrow { display: none; }
}

/* ============================================================ */
/* Polish pass: alignment, readability                           */
/* ============================================================ */
#programs .pricing-toggles { justify-content: flex-start; }
#insights .section-head { text-align: center; margin-left: auto; margin-right: auto; }
#insights .section-head .eyebrow { justify-content: center; }
@media (max-width: 600px) {
  .tier-sub, .pay-sub, .pay-equiv, .pay-note, .calc-card .help { font-size: .875rem; }
  .discount-banner p { font-size: .95rem; }
}
/* The collapse clips overflow for its animation; leave room for the 5px offset card shadows */
.programs-collapse { padding: 0 8px 8px 0; }
/* Make the recommended plan's button the obvious next click */
.price-card.best-value .pkg-btn { background: var(--accent); border-color: var(--accent); color: #fff; }
.price-card.best-value .pkg-btn:hover { background: var(--accent-2); color: #fff; }
/* Client page: the check in points back to the single password box */
.gate-note {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  max-width: 520px; margin: 0 auto; padding: 16px 20px;
  border: 1px dashed var(--glass-border-strong); border-radius: var(--radius);
  background: var(--glass-bg-soft); color: var(--ink-dim); font-size: .95rem; text-align: left;
}
.gate-note svg { flex-shrink: 0; color: var(--accent); }
/* Anchor jumps land below the sticky header instead of underneath it */
html { scroll-padding-top: 84px; }
@media (max-width: 960px) { html { scroll-padding-top: 72px; } }
/* Prices first, then the discount details, then prepay options */
#programsContent { display: flex; flex-direction: column; }
#programsContent > .pricing:not(.pricing-onetime) { order: 1; }
#programsContent > .discount-banner { order: 2; margin: 28px 0 0; }
#programsContent > .onetime-divider { order: 3; }
#programsContent > .pricing-onetime { order: 4; }
@media (max-width: 760px) {
  .pricing { gap: 26px; }  /* room for the "Best value" badge between stacked cards */
}
.programs-collapse { padding-top: 16px; }
.programs-collapse.open { margin-top: 18px; }
/* Long centred paragraphs are hard to read on a phone */
@media (max-width: 600px) {
  .mission-rest { text-align: left; }
}

/* ============================================================ */
/* Single before/after cards outside the results carousel        */
/* ============================================================ */
.ba-solo { padding: 14px 14px 16px; }
.ba-solo .testimonial-media.ba-ready {
  display: block; aspect-ratio: auto; height: auto;
  background: transparent; border: 0; overflow: visible;
}
.ba-solo .ba-expand { display: none; }   /* the side by side viewer lives on Results */
.ba-solo .who { margin-top: 14px; }
.solo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; max-width: 1000px; margin: 0 auto; }
.solo-more { text-align: center; margin: 28px 0 0; }
.solo-split { display: grid; grid-template-columns: minmax(0, 380px) 1fr; gap: 48px; align-items: center; }
.solo-split-copy h2 { margin-bottom: 12px; }
@media (max-width: 860px) {
  .solo-grid {
    display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px;
    margin: 0 -24px; padding: 4px 24px 12px; -webkit-overflow-scrolling: touch;
  }
  .solo-grid > .ba-solo { flex: 0 0 82%; scroll-snap-align: center; }
  .solo-split { grid-template-columns: 1fr; gap: 26px; }
  .solo-split-card { max-width: 420px; margin: 0 auto; width: 100%; }
}
.gym-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }

/* Women's and men's transformation groups */
.tcar-controls[hidden] { display: none; }
@media (min-width: 900px) { .transformations-grid.is-short { justify-content: center; } }
.carousel-section + .carousel-section { margin-top: 56px; }

/* Client area: calendar opens under the session cards */
.client-cal { margin-top: 18px; box-shadow: none; padding: 6px; }
.client-cal[hidden] { display: none; }
.booking-card.is-active { border-color: var(--accent); background: #fff; box-shadow: 5px 5px 0 var(--accent); }
.booking-card.is-active .booking-go { color: var(--accent-2); font-weight: 700; }

/* 30 minute coaching consultation: short form, then the calendar */
.consult-card {
  background: var(--bg-card); border: 2px solid var(--accent); border-radius: var(--radius);
  box-shadow: 5px 5px 0 var(--ink-black), var(--shadow);
  padding: 26px 28px; margin: 0 0 44px; text-align: left; scroll-margin-top: 90px;
}
.consult-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.consult-head h3 { font-size: 1.45rem; margin: 2px 0 8px; }
.consult-head p { margin: 0; color: var(--ink-dim); max-width: 620px; }
.consult-head .btn { flex-shrink: 0; white-space: nowrap; }
.consult-head .btn[hidden] { display: none; }
#consultBody { margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--line); }
#consultBody[hidden], #consultForm[hidden], #consultCal[hidden] { display: none; }
#consultForm .btn.block { margin-top: 18px; }
.consult-privacy { margin: 10px 0 0; text-align: center; font-size: .85rem; color: var(--ink-mute); }
#consultDone { margin-bottom: 14px; }
.sessions-sub { text-align: center; font-size: 1.15rem; margin: 0 0 16px; color: var(--ink); }
@media (max-width: 760px) {
  .consult-card { padding: 20px 18px; }
  .consult-head { flex-direction: column; align-items: stretch; gap: 16px; }
  .consult-head .btn { text-align: center; min-height: 50px; }
}
/* consultation: follow-up states */
.consult-note { display: block; text-align: left; padding: 14px 18px; border-radius: var(--radius);
  background: var(--bg-soft); border: 1px solid var(--line); color: var(--ink-dim); margin-bottom: 14px; }
.consult-note strong { color: var(--ink); }
.consult-note[hidden], #consultRepeat[hidden], #noTimeForm[hidden], #reinquiryForm[hidden], .consult-alt .btn[hidden] { display: none; }
.consult-repeat { border-color: var(--accent); }
.consult-repeat p { margin: 6px 0 0; }
.consult-repeat a { text-decoration: underline; text-underline-offset: 2px; }
.consult-alt { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--line); text-align: center; }
.consult-alt form { text-align: left; margin-top: 4px; }
.consult-alt .btn.block, #reinquiryForm .btn.block { margin-top: 16px; }

/* ============================================================ */
/* Ask Trenton prompts, one time plans band, social strip        */
/* ============================================================ */
.ask-card {
  display: flex; align-items: center; justify-content: space-between; gap: 22px;
  max-width: 860px; margin: 40px auto 0; padding: 22px 26px; text-align: left;
  background: var(--ink-black); color: #fff; border-radius: var(--radius);
  border-left: 6px solid var(--accent); box-shadow: var(--shadow);
}
.ask-card .ask-q { margin: 0; font-weight: 800; font-size: 1.15rem; line-height: 1.3; color: #fff; }
.ask-card .ask-q span { color: #ff6b78; white-space: nowrap; }
.ask-card .ask-sub { margin: 6px 0 0; font-size: .92rem; color: rgba(255,255,255,.72); }
.ask-card .btn { flex-shrink: 0; white-space: nowrap; }
.band-wrap { padding-top: 0; padding-bottom: 56px; }
.band-wrap .ask-card { margin-top: 0; }
section + .band-wrap { margin-top: 44px; }
.carousel-section + .ask-card, .tcar-controls + .ask-card { margin-bottom: 8px; }

.plans-band { background: var(--bg-card); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 34px 0; }
.plans-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.plans-title { margin: 2px 0 4px; font-weight: 800; font-size: 1.3rem; color: var(--ink); }
.plans-sub { margin: 0; color: var(--ink-dim); }
.plans-band .btn { flex-shrink: 0; white-space: nowrap; }

.social-strip { background: var(--ink-black); padding: 30px 0; }
.social-strip-inner { display: flex; align-items: center; justify-content: space-between; gap: 22px; flex-wrap: wrap; }
.social-strip-title { margin: 0; color: #fff; font-weight: 800; font-size: 1.2rem; }
.social-strip-title span { display: block; font-weight: 400; font-size: .92rem; color: rgba(255,255,255,.7); margin-top: 2px; }
.social-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.social-chip {
  display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 9px 18px 9px 14px;
  border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.26); color: #fff;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.social-chip:hover { background: var(--accent); border-color: var(--accent); color: #fff; transform: translateY(-1px); }
.social-chip .social-card-icon { display: inline-flex; margin: 0; color: #fff; }
.social-chip .social-card-icon svg { width: 22px; height: 22px; }
.social-chip .social-card-net { font-weight: 700; font-size: .95rem; color: #fff; margin: 0; letter-spacing: 0; text-transform: none; font-family: inherit; }
.social-chip .social-card-handle { font-size: .9rem; color: rgba(255,255,255,.75); margin: 0; }

@media (max-width: 760px) {
  .ask-card { flex-direction: column; align-items: stretch; padding: 20px; }
  .ask-card .btn { text-align: center; }
  .plans-inner { flex-direction: column; align-items: stretch; }
  .plans-band .btn { text-align: center; }
  .social-strip-inner { flex-direction: column; align-items: stretch; }
  .social-chip { justify-content: flex-start; }
}

/* small TikTok link at the top of every page */
.top-tt { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; color: #fff; font-size: .8rem; font-weight: 700;
  padding: 6px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.22); white-space: nowrap; }
.top-tt:hover { background: var(--accent); border-color: var(--accent); color: #fff; }
.top-tt svg { width: 15px; height: 15px; }
@media (max-width: 760px) { .top-tt span { display: none; } .top-tt { padding: 0; width: 40px; height: 40px; justify-content: center; order: -1; margin-left: 0; flex-shrink: 0; } }

/* ============================================================ */
/* Usability sweep: tap targets, small print, jump menu          */
/* ============================================================ */
.jump-menu { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.jump-menu a {
  display: inline-flex; align-items: center; min-height: 44px; padding: 8px 16px; border-radius: 999px;
  border: 1px solid var(--glass-border-strong); background: #fff; color: var(--ink); font-weight: 700; font-size: .9rem;
}
.jump-menu a:hover { border-color: var(--accent); color: var(--accent-2); }
#programsContent, #one-time-plans, #proof { scroll-margin-top: 84px; }

/* nothing tappable under 44px */
.client-bar-link { min-height: 40px; display: inline-flex; align-items: center; }
.ba-toggle { min-height: 44px; }
.pay-tab { min-height: 44px; }
details > summary { min-height: 44px; display: flex; align-items: center; }
details > summary::-webkit-details-marker { display: none; }
input[type="checkbox"], input[type="radio"] { width: 20px; height: 20px; accent-color: var(--accent); }

/* nothing readable under 12px */
.ba-tag, .transformations-grid .ba-tag, .media-label, .ascendance-tag, .stage-prep-tag, .foundation-tag,
.best-value-badge, .price-summary-badge, .pay-badge, .discount-tag, .coming-soon-pill, .newsletter-tag,
.client-bar-label, .pay-note, .opt { font-size: .75rem; }

/* Top bar: keep every nav label on one line now that Home is in the row */
.nav-links a, .logo { white-space: nowrap; }
.nav-toggle { font: inherit; }
@media (min-width: 961px) {
  .nav-links { gap: 22px; }
}
@media (min-width: 961px) and (max-width: 1140px) {
  .nav-links { gap: 14px; }
  .nav-links a { font-size: .86rem; }
  .nav-links .btn { padding: 9px 14px; }
}
@media (min-width: 961px) and (max-width: 1020px) {
  .nav-links { gap: 10px; }
}

/* Before/after cards spread around the site */
.solo-grid.two { grid-template-columns: repeat(2, minmax(0, 340px)); justify-content: center; }
.solo-aside-photo { display: flex; align-items: center; gap: 14px; margin: 26px 0 0; }
.solo-aside-photo img { width: 150px; height: auto; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 12px; border: 1px solid var(--line); display: block; }
.solo-aside-photo figcaption { font-size: .85rem; color: var(--ink-mute); }
@media (max-width: 860px) {
  .solo-grid.two { display: grid; grid-template-columns: minmax(0, 360px); overflow: visible; padding: 0; margin: 0 auto; gap: 18px; }
  .solo-grid.two > .ba-solo { flex: none; }
}

/* Hero cut-out: larger, with a caption near the bottom of the photo */
.hero-grid { grid-template-columns: 1.05fr .95fr; gap: 40px; }
.hero-portrait { position: relative; }
.hero-cutout { max-width: 560px; }
.hero-wins {
  position: absolute; left: 50%; bottom: 7%; transform: translateX(-50%) rotate(-3deg);
  font-family: "Oswald", Impact, "Arial Narrow", sans-serif; font-weight: 700; text-transform: uppercase;
  font-size: clamp(1.5rem, 3.4vw, 2.7rem); line-height: 1; letter-spacing: .04em; white-space: nowrap;
  color: #fff; background: var(--accent); padding: .32em .7em .36em; border-radius: 6px;
  box-shadow: 6px 6px 0 #0c0c0d; pointer-events: none;
}
@media (max-width: 900px) {
  .hero-grid { grid-template-columns: 1fr; }
  .hero-cutout { max-width: 340px; margin: 0 auto -6px; }
  .hero-wins { font-size: 1.5rem; bottom: 6%; }
}
.price-summary-plans { margin-bottom: 6px; }

/* Hero: caption sits on the photo, reach-out form tucks in underneath it */
.hero-shot { position: relative; }
.hero-reach { max-width: 420px; margin: 18px 0 0 auto; }
.hero-reach .reach-out-summary { padding: 12px 16px; }
.hero-reach .reach-out-summary-title { font-size: 1.05rem; }
.hero-reach .reach-out-summary-sub { font-size: .8rem; }
.hero-reach .reach-out-card { padding: 16px; }
.hero-reach .form-grid { grid-template-columns: 1fr; gap: 10px; }
@media (max-width: 900px) { .hero-reach { margin: 16px auto 0; } }
/* Results: three across for Brandon's row */
.stage-strip-grid2.three { grid-template-columns: repeat(3, 1fr); max-width: 1120px; }
.stage-strip { margin-bottom: 8px; }
@media (max-width: 640px) { .stage-strip-grid2.three { gap: 8px; } }

/* Slim social row */
.social-strip.slim { padding: 10px 0; }
.social-strip.slim .social-strip-inner { gap: 10px 18px; justify-content: flex-start; }
.social-strip.slim .social-strip-title { font-size: .82rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.social-strip.slim .social-strip-title span { display: none; }
.social-strip.slim .social-chips { gap: 8px; }
.social-strip.slim .social-chip { padding: 6px 12px; min-height: 40px; gap: 7px; }
.social-strip.slim .social-chip .social-card-icon svg { width: 16px; height: 16px; }
.social-strip.slim .social-chip .social-card-net { font-size: .8rem; }
.social-strip.slim .social-chip .social-card-handle { font-size: .78rem; }
@media (max-width: 760px) {
  .social-strip.slim .social-strip-inner { flex-direction: row; align-items: center; flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .social-strip.slim .social-strip-title { flex-shrink: 0; }
  .social-strip.slim .social-chips { flex-wrap: nowrap; }
  .social-strip.slim .social-chip { flex-shrink: 0; }
  .social-strip.slim .social-chip .social-card-handle { display: none; }
}
/* Call options */
.calls-band { padding: 64px 0; }
.calls-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; max-width: 1000px; margin: 0 auto; }
.call-card { display: flex; flex-direction: column; gap: 6px; padding: 20px 22px; background: var(--bg-card); border: 1px solid var(--line); border-radius: 16px;
  color: var(--ink-dim); text-decoration: none; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.call-card:hover { transform: translateY(-3px); border-color: var(--accent); color: var(--ink-dim); box-shadow: 0 14px 30px -18px rgba(198,16,36,.5); }
.call-card.featured { border: 2px solid var(--accent); }
.call-card strong { color: var(--ink); font-size: 1.12rem; line-height: 1.25; }
.call-price { align-self: flex-start; font-size: .75rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: #fff; background: var(--accent-2); padding: 3px 10px; border-radius: 999px; }
.call-go { margin-top: auto; padding-top: 10px; font-weight: 700; color: var(--accent-2); }
@media (max-width: 860px) { .calls-grid { grid-template-columns: 1fr; max-width: 460px; } .calls-band { padding: 48px 0; } }
.top-tt span { white-space: nowrap; }
@media (max-width: 760px) {
  .top-tt span { display: inline; font-size: .78rem; }
  .top-tt { width: auto; padding: 0 12px; gap: 6px; }
}

/* ---- top strip: client area (phones), DM Trenton, socials ---- */
.top-strip { background: #fff; border-bottom: 1px solid #f1d6dc; padding: 8px 0; }
.top-strip .top-strip-inner { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.top-strip .ts-dm, .top-strip .ts-chip, .top-strip .ts-client { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; padding: 6px 14px; border-radius: 999px;
  font-size: .82rem; font-weight: 700; line-height: 1; text-decoration: none; white-space: nowrap; transition: background .2s ease, border-color .2s ease, color .2s ease; }
.top-strip svg { width: 16px; height: 16px; flex-shrink: 0; }
.top-strip .ts-dm { background: #e11d2e; color: #fff; border: 1px solid #e11d2e; }
.top-strip .ts-dm:hover { background: #c01525; border-color: #c01525; color: #fff; }
.top-strip .ts-client { display: none; background: #0c0c0d; color: #fff; border: 1px solid #0c0c0d; font-weight: 800; }
.top-strip .ts-client:hover { background: #e11d2e; border-color: #e11d2e; color: #fff; }
.top-strip .ts-label { margin: 0 4px 0 auto; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #6f525a; white-space: nowrap; }
.top-strip .ts-chip { background: #fff; color: #22151a; border: 1px solid #e3bcc5; }
.top-strip .ts-chip b { font-weight: 500; color: #6f525a; }
.top-strip .ts-chip:hover { background: #fff0f2; border-color: #e11d2e; color: #c61024; }
@media (max-width: 960px) {
  .top-strip .ts-client { display: inline-flex; }
  .top-strip .top-strip-inner { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .top-strip .top-strip-inner::-webkit-scrollbar { display: none; }
  .top-strip .ts-label { margin-left: 4px; }
  .top-strip .ts-chip b { display: none; }
}
/* ---- client area button in the nav: bold and obvious ---- */
.nav-links .btn.ghost.nav-client { background: #0c0c0d; color: #fff; border: 2px solid #0c0c0d; font-weight: 800; display: inline-flex; align-items: center; gap: 7px; }
.nav-links .btn.ghost.nav-client svg { width: 15px; height: 15px; }
.nav-links .btn.ghost.nav-client:hover { background: #e11d2e; border-color: #e11d2e; color: #fff; }
.nav-links .btn.ghost.nav-client[aria-current] { background: #e11d2e; border-color: #e11d2e; }
/* mission as the first thing on the homepage */
main > .mission-band:first-child { padding-top: 44px; padding-bottom: 12px; }
/* call topics */
.call-topics { max-width: 760px; margin: 0 auto 26px; text-align: center; }
.call-topics-title { font-weight: 700; color: var(--ink); margin: 0 0 12px; }
.call-topics ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.call-topics li { padding: 8px 16px; border-radius: 999px; border: 1px solid var(--line); background: var(--bg-card); font-weight: 700; font-size: .9rem; color: var(--ink); }
.calls-grid.two { grid-template-columns: repeat(2, 1fr); max-width: 760px; }
.call-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.call-tags span { font-size: .78rem; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--bg-soft); border: 1px solid var(--line); color: var(--ink); }
@media (max-width: 860px) { .calls-grid.two { grid-template-columns: 1fr; max-width: 460px; } }
/* nav fit with the bolder client area button */
.nav-inner { gap: 18px; }
@media (min-width: 961px) { .nav-links { gap: 18px; } .nav-links .btn.ghost.nav-client { padding: 9px 15px; } }
@media (min-width: 961px) and (max-width: 1180px) { .nav-links { gap: 11px; } .nav-links a { font-size: .84rem; } .nav-links .btn { padding: 8px 12px; } .logo { font-size: 1.2rem; } }
@media (min-width: 961px) and (max-width: 1040px) { .nav-links { gap: 8px; } .nav-links a { font-size: .8rem; } .logo { font-size: 1.05rem; } .nav-links .btn.ghost.nav-client svg { display: none; } }
.coach-copy p + p { margin-top: 14px; }

/* About: the story reads as one column, with photos between paragraphs */
.coach-grid { display: block; }
.coach-copy { max-width: 720px; margin: 0 auto; }
.coach-copy p { font-size: 1.02rem; }
.coach-photos { max-width: 720px; margin: 34px auto 0; grid-template-columns: repeat(4, 1fr); }
.story-photos { margin: 26px 0; display: grid; gap: 10px; }
.story-photos.two { grid-template-columns: repeat(2, 1fr); max-width: 480px; margin-left: auto; margin-right: auto; }
.story-photos.four { grid-template-columns: repeat(4, 1fr); }
.story-photos picture { display: block; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); }
.story-photos img { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; display: block; }
.story-photos figcaption { grid-column: 1 / -1; text-align: center; font-size: .82rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ink-mute); }
.story-photos + p { margin-top: 0 !important; }
@media (max-width: 640px) {
  .story-photos.four { grid-template-columns: repeat(2, 1fr); }
  .coach-photos { grid-template-columns: repeat(2, 1fr); }
}
/* About story photos: date tag on each photo */
.story-photos.three { grid-template-columns: repeat(3, 1fr); max-width: 600px; margin-left: auto; margin-right: auto; }
.story-photos.two { max-width: 400px; }
.story-photos .sp { position: relative; }
.story-photos .sp-tag { position: absolute; left: 8px; top: 8px; padding: 3px 9px; border-radius: 999px; background: rgba(12,12,13,.78); color: #fff;
  font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.story-photos figcaption { text-transform: none; letter-spacing: 0; font-size: .92rem; font-style: italic; color: var(--ink-dim); }
.story-photos + .story-photos { margin-top: -6px; }
@media (max-width: 640px) { .story-photos .sp-tag { font-size: .75rem; padding: 2px 7px; left: 5px; top: 5px; } .story-photos.three { gap: 6px; } }
.story-now { max-width: 720px; margin: 34px auto 0; }

/* main menu: bigger and easier to read */
.nav-links a:not(.btn) { font-size: 1rem; font-weight: 600; color: #22151a; }
.nav-links a:not(.btn):hover { color: var(--accent-2); }
.nav-links a[aria-current]:not(.btn) { font-weight: 800; }
.nav-links .btn { font-size: .98rem; }
@media (min-width: 961px) { .nav-links { gap: 13px; } .logo { font-size: 1.12rem; } .nav-links .btn { padding: 9px 14px; font-size: .92rem; } .nav-inner { gap: 12px; } }
@media (min-width: 961px) and (max-width: 1180px) { .nav-links { gap: 10px; } .nav-links a:not(.btn) { font-size: .9rem; } .nav-links .btn { font-size: .86rem; padding: 8px 11px; } .logo { font-size: 1.1rem; } }
@media (min-width: 961px) and (max-width: 1040px) { .nav-links { gap: 7px; } .nav-links a:not(.btn) { font-size: .84rem; } .logo { font-size: 1rem; } }

.top-strip .ts-chip em { font-style: normal; font-size: .75rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: #fff; background: #c61024; padding: 3px 8px; border-radius: 999px; }

@media (max-width: 480px) { #coach h1 { font-size: clamp(1.7rem, 10vw, 2.5rem); } }
.apply-next { max-width: 640px; margin: 12px auto 0; font-size: .95rem; color: var(--ink); }
/* ---- About page on phones ---- */
@media (max-width: 640px) {
  #coach { padding-top: 34px; }
  #coach .section-head { margin-bottom: 18px; }
  .coach-copy p { font-size: 1rem; line-height: 1.6; }
  .coach-copy p + p { margin-top: 12px; }
  .story-photos { margin: 18px -24px; padding: 0 24px 6px; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 8px; -webkit-overflow-scrolling: touch; scrollbar-width: none; max-width: none !important; }
  .story-photos::-webkit-scrollbar { display: none; }
  .story-photos .sp { flex: 0 0 46%; scroll-snap-align: start; }
  .story-photos.two .sp { flex: 0 0 calc(50% - 4px); }
  .story-photos figcaption { flex: 0 0 100%; order: 99; position: sticky; left: 0; }
  .story-photos + .story-photos { margin-top: 0; }
  .story-now { margin-top: 22px !important; }
  .mission-band { padding: 30px 0 8px; }
  .mission-statement { font-size: 1.35rem; line-height: 1.25; }
}
@media (max-width: 640px) {
  .story-photos { display: grid; grid-auto-flow: column; grid-auto-columns: 46%; grid-template-columns: none !important; grid-template-rows: auto auto; }
  .story-photos.two { grid-auto-columns: calc(50% - 4px); }
  .story-photos .sp { grid-row: 1; flex: none; }
  .story-photos figcaption { grid-row: 2; grid-column: 1 / span 2; text-align: left; position: static; }
}
/* Featured testimonial */
.big-quote { background: #0c0c0d; padding: 54px 0; }
.big-quote figure { margin: 0 auto; max-width: 820px; text-align: center; }
.big-quote blockquote { margin: 0; color: #fff; font-size: clamp(1.25rem, 2.6vw, 1.75rem); line-height: 1.4; font-weight: 700; }
.big-quote figcaption { margin-top: 16px; color: rgba(255,255,255,.75); font-size: .9rem; letter-spacing: .06em; text-transform: uppercase; }
.big-quote figcaption strong { color: #ff5c6a; }
@media (max-width: 640px) { .big-quote { padding: 38px 0; } }

/* quote band at the very top of the home page */
.big-quote.top { padding: 22px 0; }
.big-quote.top figure { max-width: 900px; }
.big-quote.top blockquote { font-size: clamp(1rem, 1.9vw, 1.3rem); line-height: 1.35; }
.big-quote.top figcaption { margin-top: 8px; font-size: .78rem; }
@media (max-width: 640px) { .big-quote.top { padding: 16px 0; } }

/* light variant of the quote band (Milton) */
.big-quote.light { background: #fff; border-top: 1px solid #f1d6da; border-bottom: 1px solid #f1d6da; }
.big-quote.light blockquote { color: #1c1416; font-size: clamp(1.1rem, 2.1vw, 1.45rem); }
.big-quote.light figcaption { color: #6b5a5e; }
.big-quote.light figcaption strong { color: #e11d2e; }
/* three client quotes at the top of Results */
.quote-trio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin: 0 0 40px; }
.quote-trio figure { margin: 0; background: #0c0c0d; border-radius: 16px; padding: 26px 24px; display: flex; flex-direction: column; justify-content: space-between; box-shadow: 6px 6px 0 #e11d2e; }
.quote-trio blockquote { margin: 0; color: #fff; font-weight: 700; font-size: 1.08rem; line-height: 1.45; }
.quote-trio figcaption { margin-top: 18px; color: rgba(255,255,255,.75); font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; }
.quote-trio figcaption strong { color: #ff5c6a; }
@media (max-width: 860px) { .quote-trio { grid-template-columns: 1fr; gap: 16px; margin-bottom: 30px; } .quote-trio figure { padding: 20px 18px; box-shadow: 4px 4px 0 #e11d2e; } .quote-trio blockquote { font-size: 1rem; } }

/* single photo row in the About story */
.story-photos.one { grid-template-columns: 1fr; max-width: 196px; margin-left: auto; margin-right: auto; }
@media (max-width: 640px) { .story-photos.one { grid-auto-columns: calc(50% - 4px); justify-content: center; } }

/* menu fit with the Consultations link added */
@media (min-width: 1181px) and (max-width: 1360px) { .nav-links { gap: 9px; } .nav-links a:not(.btn) { font-size: .93rem; } .nav-links .btn { font-size: .86rem; padding: 9px 12px; } .logo { font-size: 1.06rem; } }
@media (min-width: 1041px) and (max-width: 1180px) { .nav-links { gap: 8px; } .nav-links a:not(.btn) { font-size: .86rem; } .nav-links .btn { font-size: .82rem; padding: 8px 10px; } .logo { font-size: 1rem; } }
@media (min-width: 961px) and (max-width: 1040px) { .nav-links { gap: 5px; } .nav-links a:not(.btn) { font-size: .77rem; } .nav-links .btn { font-size: .76rem; padding: 7px 9px; } .logo { font-size: .9rem; } .nav-inner { gap: 8px; } }

/* TikTok DM option inside the home page reach-out box */
.reach-dm { text-align: center; margin: 0 0 14px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.reach-dm p { margin: 0 0 10px; font-size: .92rem; color: var(--ink-dim); }
.reach-dm-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 12px 16px; border-radius: 999px; background: #0c0c0d; color: #fff; font-weight: 800; text-decoration: none; }
.reach-dm-btn:hover { background: #e11d2e; color: #fff; }
.reach-dm-btn svg { width: 17px; height: 17px; }
.reach-dm-or { display: block; margin-top: 12px; font-size: .74rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-mute); }

/* Consultations page: long one-word heading on small phones */
@media (max-width: 480px) { #sessions .section-head h1 { font-size: 9.4vw; letter-spacing: -.01em; } }

.quote-trio.in-pricing { margin: 38px 0 6px; }

#programsContent > .quote-trio.in-pricing { order: 1; margin: 34px 0 6px; }
.plans-band.enhance-band.in-pricing { margin: 34px 0 6px; padding: 24px 26px; border: 1px solid var(--line); border-radius: 16px; }

/* compact "Pick a call" band */
.calls-band.compact { padding: 34px 0; }
.calls-band.compact .calls-head { text-align: center; margin: 0 0 16px; }
.calls-band.compact .calls-head .eyebrow { margin-bottom: 4px; }
.calls-band.compact .calls-head h2 { font-size: clamp(1.35rem, 2.6vw, 1.8rem); margin: 0; line-height: 1.1; }
.calls-band.compact .calls-grid { max-width: 820px; margin: 0 auto; gap: 14px; }
.calls-band.compact .call-card { padding: 14px 18px; gap: 5px; font-size: .92rem; }
.calls-band.compact .call-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.calls-band.compact .call-card strong { font-size: 1.05rem; }
.calls-band.compact .call-go { font-weight: 800; color: var(--accent-2); font-size: .9rem; }
@media (max-width: 860px) { .calls-band.compact { padding: 28px 0; } .calls-band.compact .calls-grid { max-width: 460px; gap: 10px; } }

/* Terms, refunds and privacy page */
.legal .legal-wrap { max-width: 820px; }
.legal .section-head h1 { font-size: clamp(2rem, 5.4vw, 3.4rem); }
.legal-updated { font-size: .85rem; color: var(--ink-mute); margin-top: 8px; }
.legal-alert { background: #0c0c0d; color: #fff; border-radius: 18px; padding: 28px 28px 24px; margin: 8px 0 26px; border-left: 8px solid #e11d2e; box-shadow: 6px 6px 0 #e11d2e; }
.legal-alert h2 { color: #fff; margin: 10px 0 12px; font-size: clamp(1.5rem, 3.6vw, 2.2rem); line-height: 1.1; }
.legal-alert p { color: rgba(255,255,255,.9); margin: 0 0 12px; line-height: 1.6; }
.legal-alert p:last-child { margin-bottom: 0; }
.legal-alert strong { color: #fff; }
.legal-alert-tag { display: inline-block; background: #e11d2e; color: #fff; font-size: .74rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; padding: 4px 12px; border-radius: 999px; }
.legal-alert.small { margin: 34px 0 0; padding: 18px 22px; }
.legal-toc { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 30px; }
.legal-toc a { font-size: .86rem; font-weight: 700; padding: 7px 13px; border-radius: 999px; background: var(--bg-card); border: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.legal-toc a:hover { border-color: var(--accent); color: var(--accent-2); }
.legal-body h2 { font-size: clamp(1.25rem, 2.6vw, 1.6rem); margin: 38px 0 12px; padding-top: 22px; border-top: 1px solid var(--line); scroll-margin-top: 90px; text-align: left; }
.legal-body h3 { font-size: 1.05rem; margin: 20px 0 8px; color: var(--ink); }
.legal-body p, .legal-body li { color: var(--ink-dim); line-height: 1.65; font-size: 1rem; }
.legal-body ul { margin: 0 0 14px; padding-left: 20px; }
.legal-body li { margin-bottom: 8px; }
.legal-body strong { color: var(--ink); }
.legal-body a { color: var(--accent-2); text-decoration: underline; }
.legal-key { background: var(--bg-card); border: 2px solid var(--accent); border-radius: 14px; padding: 16px 20px; margin: 0 0 16px; }
.legal-key p { margin: 0; color: var(--ink); }
#medical, #refunds, #privacy, #enhancement { scroll-margin-top: 90px; }
@media (max-width: 640px) { .legal-alert { padding: 22px 18px 18px; box-shadow: 4px 4px 0 #e11d2e; } }
/* short legal and medical notes around the site */
.legal-note { font-size: .82rem; line-height: 1.5; color: var(--ink-mute); text-align: center; margin: 12px 0; flex-basis: 100%; }
.legal-note a, .med-note a { color: var(--accent-2); text-decoration: underline; }
.med-note { font-size: .86rem; line-height: 1.5; color: var(--ink-dim); margin: 10px 0 0; }
.med-note.center { text-align: center; max-width: 640px; margin: 14px auto 22px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg-card); }

/* client agreement */
.legal-sign { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; background: var(--bg-card); border: 2px solid var(--accent); border-radius: 14px; padding: 16px 20px; margin: 0 0 22px; }
.legal-sign p { margin: 0; color: var(--ink); flex: 1 1 280px; }
.agree-form { background: var(--bg-card); border: 1px solid var(--line); border-radius: 18px; padding: 26px 26px 28px; }
.agree-form h2 { font-size: 1.3rem; margin: 26px 0 12px; text-align: left; }
.agree-form h2:first-child { margin-top: 0; }
.agree-hint { color: var(--ink-mute); font-size: .9rem; margin: 0 0 12px; }
.agree-check { display: flex; gap: 12px; align-items: flex-start; padding: 13px 14px; border: 1px solid var(--line); border-radius: 12px; margin: 0 0 10px; cursor: pointer; background: var(--bg-soft); }
.agree-check input { flex: 0 0 auto; width: 22px; height: 22px; margin: 2px 0 0; accent-color: #e11d2e; }
.agree-check span { color: var(--ink-dim); line-height: 1.55; font-size: .95rem; }
.agree-check span strong { color: var(--ink); }
.agree-check a { color: var(--accent-2); text-decoration: underline; }
.agree-check.invalid { border-color: #e11d2e; box-shadow: 0 0 0 2px rgba(225,29,46,.18); }
.agree-optout { margin-top: 16px; padding-top: 16px; border-top: 1px dashed var(--line); }
.agree-optout .agree-check { background: transparent; }
.agree-sign { font-family: 'Snell Roundhand', 'Brush Script MT', 'Segoe Script', cursive; font-size: 1.4rem !important; }
.agree-form input.invalid, .agree-form select.invalid { border-color: #e11d2e !important; }
.agree-error { color: #b3121f; font-weight: 700; margin: 12px 0; }
.agree-copy { text-align: left; max-width: 460px; margin: 14px auto 18px; padding: 14px 18px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg-soft); }
.agree-copy p { margin: 0 0 6px; color: var(--ink); }
@media (max-width: 640px) { .agree-form { padding: 20px 16px 22px; } }
@media print { .site-top, header.nav, .top-strip, footer, .site-foot, .to-top, .promo { display: none !important; } }

.agree-form .form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.agree-form .field { min-width: 0; }
.agree-form .field input, .agree-form .field select { width: 100%; max-width: 100%; box-sizing: border-box; }
@media (max-width: 640px) { .agree-form .form-grid { grid-template-columns: minmax(0, 1fr); } }

/* weekly check in: numbered sections instead of one long list */
.ck-section { border: 1px solid var(--line); border-radius: 14px; padding: 18px 18px 6px; margin: 0 0 18px; background: var(--bg-soft); }
.ck-title { display: flex; align-items: center; gap: 10px; font-size: 1.08rem; margin: 0 0 14px; color: var(--ink); text-align: left; }
.ck-title span { flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; background: #e11d2e; color: #fff; font-size: .85rem; font-weight: 800; display: inline-flex; align-items: center; justify-content: center; }
.ck-sub { font-size: .88rem; color: var(--ink-mute); margin: -8px 0 12px; }
.rating-block .ck-title { margin-bottom: 6px; }
#checkinForm .rating-block, #checkinForm #enhancedFields { margin-bottom: 18px; }
@media (max-width: 640px) { .ck-section { padding: 14px 12px 2px; } }

/* link from stage shots to that person's transformation */
.stage-link { text-align: center; margin: 12px 0 30px; }
.stage-link .btn { font-size: .9rem; padding: 10px 18px; }
.transformation-card[id] { scroll-margin-top: 110px; }

/* keep the price card badge on one line so it never covers the heading */
.best-value-badge { white-space: nowrap; }