/* What to expect (9/29/2026). Loaded after site.css; only what this page needs.
   Built on Avada Health's department page (templates/page-help-what-happens.php), measured
   at 1440 and 390 on avada.website/health/portfolio-items/general-practice/:
     department body   the shared .dept (main card 40px, fact card 30px, 47px apart)
     "Meet Our Doctors" 100px above, 130px below; 80px icon, 20px to a 46px capital heading;
                        a 280 x 2px rule, 30px below; three 359px white cards 47px apart in a
                        1170px frame; card text 40px in, 18px capital title with 1px tracking,
                        17px text on a 38px line
     "Our Patients Say" 140px above, 100px below, dark; the 22px lede, weight 600, 1.1px
                        tracking, a 48px line, 764px wide
     "Make An Appointment" 150px above, 110px below, dark
   Where our layout gate needs it, the band paddings scale down toward 1050 (limit 220px of
   empty run there) and never exceed Health's.
   Pairings: blue #183660 on white 12.3 · white on blue 12.3 · white on teal-deep #347890 5.0 ·
   blue on gold 6.2. */

/* ---- the fact card: Health's one card, the height of the main card. Its words sit in one
   wrapper that stays in view on a laptop while the long main card scrolls past, so the card
   never shows a screen of empty white. Only where the words fit the screen with room to spare. */
.dept__side > .wte-side > .sidecard { background: none; border: 0; padding: 0; }
.wte-side > .sidecard + .sidecard { margin-top: 40px; }
/* The card's buttons are full width; a narrow column (298px at 1050) needs less side padding to
   hold "Call 1-800-770-1650" on one line. The number itself never breaks. */
.wte-side .btn { padding-inline: 14px; }
/* No sticky card: Health's fact card stays in place (9/29 ruling, the same on every page). */

/* ---- the film sits in the title band (safe_new_title_band 'play'), as the approved words pair it with the heading. */

/* ---- the visit, step by step: Get help now's numbered list, each step with its title */
.dept__main .wte-steps { gap: 26px; }
.dept__main .wte-steps h3 { font-size: 1.1875rem; font-weight: 600; line-height: 1.55; letter-spacing: .01em; }
.dept__main .wte-steps h3 + p { margin-top: 4px; }

/* ---- what we provide: Health's checklist, 17px on a 28.9px line (site.css sets 2.25 here) */
.dept__main .checks li { line-height: 1.7; }

/* ---- the three bands after the department body share Health's band anatomy */
.wte-band .frame { max-width: calc(1200px + 2 * var(--pad)); }
.wte-band .wte-icon { width: 80px; height: 80px; margin: 0 auto 20px; }
.wte-band h2 {
  font-size: clamp(2.2rem, 1.8rem + 1.64vw, 2.875rem);
  font-weight: 600; line-height: 1.25; letter-spacing: 0; text-transform: uppercase; max-width: none;
}
.wte-band .band__rule { width: 280px; height: 2px; margin: 20px auto 30px; opacity: 1; background: #d5dade; }
.wte-band.on-dark .band__rule { background: rgba(255, 253, 252, .85); }

/* "Meet Our Doctors": Your choices, three white cards in a row */
.wte-choices { background: var(--blush); padding-block: clamp(72px, 7vw, 100px) clamp(72px, 7vw, 110px); }
.wte-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 47px; margin-top: 0; text-align: left; }
.wte-cards .card-w { padding: 40px; }
.wte-cards .card-w h3 { font-size: 1.125rem; font-weight: 600; line-height: 1.5; letter-spacing: 1px; text-transform: uppercase; }
.wte-cards .card-w p { margin-top: 18px; line-height: 2.25; }

/* "Our Patients Say": Free and confidential, on the site's blue */
.wte-cost { padding-block: clamp(88px, 8.4vw, 120px) clamp(72px, 7vw, 100px); }
.wte-cost .band__lede {
  max-width: 764px; margin-top: 0;
  font-size: clamp(1.1875rem, 1rem + .6vw, 1.375rem); font-weight: 600; letter-spacing: .05em; line-height: 2.2;
}

/* "Make An Appointment": Ready to come in?, on the site's teal */
.wte-come { background: var(--teal-deep); color: var(--paper); padding-block: clamp(100px, 10.4vw, 150px) clamp(80px, 7.6vw, 110px); }
.wte-come .band-icon { color: var(--gold); }
.wte-come .band__actions { margin-top: 0; }
.wte-come .btn { min-height: 60px; font-size: 1rem; }

/* ---- tablet and phone: the cards stack, as Health's do */
@media (max-width: 960px) {
  .wte-cards { grid-template-columns: 1fr; gap: 24px; }
  .wte-cards .card-w { padding: 30px; }
}

/* Free and confidential, Ready to come in: Health's two closing photo bands, a flat shade over a
   picture that drifts inside the band (9/29 review). The words sit above the picture. */
.wte-photo { position: relative; overflow: hidden; isolation: isolate; }
.wte-photo > .frame { position: relative; z-index: 1; }
.wte-photo .formband__bg { z-index: -2; }
.wte-photo .formband__shade { z-index: -1; }
.wte-come { background: var(--teal-deep); }
.wte-come__shade { background: rgba(52, 120, 144, .93); }
.wte-photo .title__credit { z-index: 1; }
.wte-photo, .wte-photo h2, .wte-photo .band__lede { color: var(--paper); }
.wte-cost .band-icon { color: var(--gold); }

/* ---- laptop review (9/29): the body and "Your choices" share the blush ground, so the
   body's 100px bottom and the band's 100px top read as one 200px dead run. One band's
   rhythm between them, as Health has between two bands on one ground. */
.dept-wrap + .wte-choices { padding-top: 12px; }

/* The three headings share one row, so the three texts start level even where "Police and
   legal options" takes two lines (every laptop width). Stacked on a phone, no shared row. */
@media (min-width: 901px) {
  .wte-cards { row-gap: 0; }
  .wte-cards .card-w { display: grid; grid-row: span 2; grid-template-rows: subgrid; align-content: start; }
  .wte-cards .card-w h3 { align-self: end; }
}

/* "Free and confidential" on flat blue (laptop review, 9/29): the team photograph has too
   little height for its faces to clear the shield and the heading at any framing, and type is
   never set on a face. The nurses carry the title bands elsewhere. */
.wte-cost { background: var(--blue); }
.wte-cost .formband__bg, .wte-cost .formband__shade { display: none; }

/* ---- 10/2, Health's answers for the three inventions (owner's list): "Your choices" is Health's
   icon columns (icon, title, two lines, no card); "Free and confidential" is Health's centred band
   on the light ground; "Ready to come in?" is Health's closing photo band, the photograph showing
   through a flat blue shade (the 9/29 teal at .93 had hidden it), drifting right. */
.wte-features { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 0; }
.wte-features .feature h3 { font-size: 1.375rem; }
.wte-cost { background: var(--paper); color: var(--blue); padding-block: clamp(80px, 7vw, 110px); }
.wte-cost .band-icon { color: var(--teal-deep); }
.wte-cost h2, .wte-cost .band__lede { color: var(--blue); }
.wte-cost .band__rule { background: #d5dade; }
.wte-come__shade { background: rgba(18, 42, 75, .7); }
@media (max-width: 900px) { .wte-features { grid-template-columns: 1fr; } }