/* GD Dentistry of Brooklyn: Full Arch V4 (mobile-first offer page).
 * Part 1 is V2's stylesheet copied as the tested base (tokens, survey card, video player, buttons).
 * Part 2 (bottom) is the V4 layout. V4 markup uses tt-* classes only, so V2's section rules never apply. */

/* ==========================================================================
   GD Dentistry of Brooklyn — Full Arch / All-on-X, V2 "agency design" (campaign fullarch-en-v2)
   Same sections, order and copy as V1; design system borrowed from the Pontifex template library
   (Hale implants: light washes, pill buttons, review cards, accordion FAQ, sticky bar, CTA bands;
   Clock: trust strip, numbered/iconed cards). GD palette: navy / blue / cyan, Inter + Poppins.
   Scoped to body.esg-lp so it never leaks into the site.
   ========================================================================== */

body.esg-lp {
  --blue: #51169B; --blue-d: #3D1073; --cyan: #BFA0F5; --ink: #311849; --navy: #311849; --dark: #311849;
  --body: #55606b; --muted: #7b8794; --bg: #f7f5fb; --bg2: #efe9f6; --line: #e3dcec; --white: #fff;
  --gold: #fbbc04; --green: #1a7f37;
  --head: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --sans: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --r-pill: 72px; --r-lg: 20px; --r-md: 16px; --r-sm: 12px;
  --shadow: 0 10px 30px rgba(17, 33, 63, .08); --shadow-lg: 0 24px 60px rgba(17, 33, 63, .16);
  --content: 1180px; --gutter: 40px;
}

body.esg-lp *, body.esg-lp *::before, body.esg-lp *::after { box-sizing: border-box; }
body.esg-lp { margin: 0; font-family: var(--sans); color: var(--body); background: var(--white); font-size: 16px; line-height: 1.55; -webkit-font-smoothing: antialiased; overflow-x: clip; scroll-behavior: smooth; }
body.esg-lp img { display: block; max-width: 100%; }
body.esg-lp img.emoji { display: inline !important; width: 1em !important; height: 1em !important; vertical-align: -.1em; margin: 0 .05em; }
body.esg-lp p, body.esg-lp figure { margin: 0; }
body.esg-lp h1, body.esg-lp h2, body.esg-lp h3, body.esg-lp h4 { margin: 0; font-family: var(--head); color: var(--ink); line-height: 1.15; font-weight: 600; }
body.esg-lp a { color: inherit; text-decoration: none; }
body.esg-lp button { font-family: inherit; cursor: pointer; border: 0; background: none; }
body.esg-lp .hc { width: min(var(--content), 100% - 2 * var(--gutter)); margin-inline: auto; position: relative; z-index: 1; }
body.esg-lp .section { position: relative; }
body.esg-lp .bg { background: var(--bg); } body.esg-lp .bg2 { background: var(--bg2); }
body.esg-lp .wash { position: absolute; border-radius: 50%; background: var(--cyan); opacity: .12; filter: blur(60px); pointer-events: none; z-index: 0; }
body.esg-lp .eyebrow { display: inline-block; color: var(--blue-d); font-weight: 700; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; }
body.esg-lp .h2 { font-size: 38px; font-weight: 600; letter-spacing: -.01em; }
body.esg-lp .sub { font-size: 17px; color: var(--body); line-height: 1.55; }
body.esg-lp .hl { color: var(--blue); font-weight: 700; }
body.esg-lp .head { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 12px; max-width: 760px; margin: 0 auto; }

/* Buttons */
body.esg-lp .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: var(--r-pill); font-family: var(--head); font-weight: 600; font-size: 16px; line-height: 1; white-space: nowrap; transition: background .15s, transform .05s, box-shadow .15s, border-color .15s; }
body.esg-lp .btn:active { transform: translateY(1px); }
body.esg-lp .btn-primary { background: var(--blue); color: #fff; padding: 17px 30px; box-shadow: 0 8px 22px rgba(81, 22, 155, .28); }
body.esg-lp .btn-primary:hover { background: var(--blue-d); }
body.esg-lp .btn-primary small { display: block; font-family: var(--sans); font-weight: 500; font-size: 12px; opacity: .85; margin-top: 4px; }
body.esg-lp .btn-primary.has-sub { flex-direction: column; gap: 0; padding: 14px 34px; }
body.esg-lp .btn-ghost { background: #fff; color: var(--ink); border: 1px solid var(--line); padding: 14px 26px; }
body.esg-lp .btn-ghost:hover { border-color: var(--blue); color: var(--blue-d); }
body.esg-lp .btn-ghost svg { width: 16px; height: 16px; }
body.esg-lp .btn-white { background: #fff; color: var(--blue-d); padding: 17px 30px; }
body.esg-lp .btn-white:hover { background: var(--bg2); }

/* ===== Top bar (sticky) ===== */
body.esg-lp .topbar { position: sticky; top: 0; z-index: 200; background: rgba(255, 255, 255, .92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
body.esg-lp .topbar .hc { height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
body.esg-lp .topbar__logo { display: flex; align-items: center; gap: 10px; }
body.esg-lp .topbar__logo img { height: 46px; width: auto; }
body.esg-lp .topbar__brand { font-family: var(--head); font-weight: 700; font-size: 17px; color: var(--ink); line-height: 1.1; }
body.esg-lp .topbar__brand small { display: block; font-family: var(--sans); font-weight: 500; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-top: 2px; }
body.esg-lp .topbar__actions { display: flex; align-items: center; gap: 10px; }
body.esg-lp .topbar__actions .btn-ghost { padding: 11px 20px; font-size: 15px; }
body.esg-lp .topbar__actions .btn-primary { padding: 12px 24px; font-size: 15px; box-shadow: none; }

/* ===== Trust strip ===== */
body.esg-lp .trust { background: var(--navy); color: #fff; }
body.esg-lp .trust .hc { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 12px 0; font-size: 14px; }
body.esg-lp .trust__item { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
body.esg-lp .trust__item b { font-family: var(--head); font-weight: 700; font-size: 17px; }
body.esg-lp .trust__item .stars { color: var(--gold); letter-spacing: 1px; }

/* ===== 1 · Hero ===== */
body.esg-lp .hero { background: var(--bg); overflow: hidden; }
body.esg-lp .hero .wash--a { width: 520px; height: 520px; left: -160px; top: -120px; }
body.esg-lp .hero .wash--b { width: 420px; height: 420px; right: -120px; bottom: -160px; opacity: .1; }
body.esg-lp .hero > .hc { display: grid; grid-template-columns: 1.05fr .95fr; gap: 64px; align-items: start; padding: 72px 0 84px; }
body.esg-lp .hero__copy { display: flex; flex-direction: column; gap: 18px; padding-top: 8px; }
body.esg-lp .hero__title { font-size: 54px; font-weight: 600; line-height: 1.05; letter-spacing: -.02em; }
body.esg-lp .hero__title b { color: var(--blue); font-weight: 800; }
body.esg-lp .hero__claim { font-family: var(--head); font-size: 21px; color: var(--ink); line-height: 1.35; }
body.esg-lp .hero__claim b { color: var(--blue); font-weight: 700; }
body.esg-lp .hero__lead { font-size: 18px; line-height: 1.55; color: var(--body); }
body.esg-lp .hero__value { display: inline-block; margin-left: 6px; background: rgba(81, 22, 155, .1); color: var(--blue-d); font-family: var(--head); font-weight: 700; font-size: 15px; padding: 4px 12px; border-radius: var(--r-pill); }
body.esg-lp .hero__proof { display: flex; align-items: center; gap: 12px; margin-top: 4px; }
body.esg-lp .hero__faces { display: flex; }
body.esg-lp .hero__faces img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; border: 2px solid #fff; margin-left: -10px; box-shadow: 0 2px 6px rgba(0, 0, 0, .12); }
body.esg-lp .hero__faces img:first-child { margin-left: 0; }
body.esg-lp .hero__proof-txt { font-size: 14px; color: var(--body); line-height: 1.35; }
body.esg-lp .hero__proof-txt b { color: var(--ink); }
body.esg-lp .hero__proof-txt .stars { color: var(--gold); letter-spacing: 1px; }
body.esg-lp .hero__note { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; font-weight: 600; color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: var(--r-sm); padding: 12px 14px; }
body.esg-lp .hero__note span:first-child { color: var(--blue); font-style: normal; }
body.esg-lp .finbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; border: 1px solid var(--line); border-left: 4px solid var(--cyan); border-radius: var(--r-sm); padding: 14px 18px; transition: box-shadow .15s, border-color .15s; }
body.esg-lp .finbar:hover { box-shadow: var(--shadow); border-color: var(--cyan); }
body.esg-lp .finbar b { display: block; font-family: var(--head); font-size: 15px; color: var(--ink); text-transform: uppercase; letter-spacing: .02em; }
body.esg-lp .finbar small { display: block; font-size: 13px; color: var(--body); margin-top: 2px; }
body.esg-lp .finbar .arrow { color: var(--blue); font-size: 22px; flex: none; }

body.esg-lp .hero__form { position: relative; }
body.esg-lp .hero__form-title { font-size: 24px; font-weight: 600; text-align: center; line-height: 1.3; }
body.esg-lp .hero__form-sub { margin-top: 8px; text-align: center; font-size: 15px; color: var(--body); }

/* Survey card (markup shared with V1, restyled) */
body.esg-lp .survey { margin: 22px 0 0; background: #fff; border-radius: var(--r-lg); box-shadow: var(--shadow-lg); border: 1px solid var(--line); overflow: hidden; }
body.esg-lp .survey__head { display: flex; justify-content: space-between; align-items: center; padding: 16px 28px 0; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--blue-d); }
body.esg-lp .survey__secure { color: var(--muted); font-weight: 600; text-transform: none; letter-spacing: 0; }
body.esg-lp .survey__steps { padding: 16px 28px 20px; min-height: 270px; }
body.esg-lp .survey__step { border: 0; margin: 0; padding: 0; }
body.esg-lp .survey__q { display: block; font-family: var(--head); font-size: 18px; font-weight: 600; color: var(--ink); margin-bottom: 14px; line-height: 1.35; padding: 0; }
body.esg-lp .survey__q .req { color: var(--blue); }
body.esg-lp .survey__note { display: block; font-family: var(--sans); font-size: 13px; font-weight: 400; color: var(--muted); margin-top: 4px; }
body.esg-lp .survey__opt { display: flex; align-items: center; gap: 12px; margin: 0 0 8px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--bg); cursor: pointer; font-size: 15px; color: var(--ink); line-height: 1.35; transition: border-color .12s, background .12s, box-shadow .12s; }
body.esg-lp .survey__opt:hover { border-color: var(--cyan); background: #fff; }
body.esg-lp .survey__opt:has(input:checked) { border-color: var(--blue); background: #fff; box-shadow: 0 0 0 3px rgba(81, 22, 155, .14); }
body.esg-lp .survey__opt input { margin: 0; width: 18px; height: 18px; accent-color: var(--blue); flex: 0 0 auto; }
body.esg-lp .survey__field { display: block; margin-bottom: 12px; }
body.esg-lp .survey__field span { display: block; font-size: 13px; font-weight: 600; color: var(--ink); margin-bottom: 5px; }
body.esg-lp .survey__field .req { color: var(--blue); }
body.esg-lp .survey__field input { width: 100%; height: 48px; border: 1px solid var(--line); border-radius: 10px; padding: 0 14px; font: inherit; font-size: 15px; color: var(--ink); background: #fff; outline: 0; transition: border-color .15s, box-shadow .15s; }
body.esg-lp .survey__field input:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(81, 22, 155, .15); }
body.esg-lp .survey__consent { display: flex; gap: 10px; align-items: flex-start; font-size: 12px; color: var(--body); line-height: 1.45; margin-top: 4px; }
body.esg-lp .survey__consent input { margin-top: 2px; accent-color: var(--blue); flex: 0 0 auto; }
body.esg-lp .survey__legal { font-size: 12px; color: var(--muted); margin-top: 10px; }
body.esg-lp .survey__legal a { color: var(--blue); text-decoration: underline; }
body.esg-lp .form-msg { margin: 0 28px 10px; font-size: 14px; color: #c0392b; font-weight: 500; }
body.esg-lp .survey__bar { display: flex; align-items: center; gap: 10px; padding: 14px 20px 18px; border-top: 1px solid var(--line); background: var(--bg); }
body.esg-lp .survey__progress { flex: 1; position: relative; height: 8px; border-radius: 8px; background: var(--line); overflow: visible; }
body.esg-lp .survey__progress-fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 8px; background: linear-gradient(90deg, var(--cyan), var(--blue)); transition: width .3s ease; }
body.esg-lp .survey__progress-txt { position: absolute; right: 0; top: -22px; font-size: 11px; font-weight: 700; color: var(--blue-d); }
body.esg-lp .survey__back { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line); background: #fff; color: var(--ink); font-size: 18px; }
body.esg-lp .survey__next, body.esg-lp .survey__submit { border-radius: var(--r-pill); background: var(--blue); color: #fff; font-family: var(--head); font-weight: 600; font-size: 15px; padding: 13px 26px; box-shadow: 0 6px 16px rgba(81, 22, 155, .25); transition: background .15s; }
body.esg-lp .survey__next:hover, body.esg-lp .survey__submit:hover { background: var(--blue-d); }
body.esg-lp .survey__submit[disabled] { opacity: .7; cursor: wait; }
body.esg-lp .survey--ghl, body.esg-lp .survey--placeholder { padding: 12px; }
body.esg-lp .survey--placeholder p { padding: 30px 20px; text-align: center; color: var(--muted); font-size: 14px; }

/* ===== 2 · Breakthrough + video ===== */
body.esg-lp .vsl .hc { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; padding: 96px 0; }
body.esg-lp .vsl__copy { display: flex; flex-direction: column; gap: 18px; }
body.esg-lp .vsl__title { font-size: 36px; line-height: 1.15; }
body.esg-lp .vsl__sub { font-size: 19px; color: var(--body); }
body.esg-lp .vsl__strong { font-family: var(--head); font-size: 18px; font-weight: 600; color: var(--ink); }
body.esg-lp .vsl__ctas { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; margin-top: 6px; }
body.esg-lp .vsl__media { display: flex; justify-content: center; }
body.esg-lp .esg-player { position: relative; background: #000; border-radius: var(--r-lg); overflow: hidden; box-shadow: var(--shadow-lg); aspect-ratio: 16 / 9; width: 100%; }
body.esg-lp .esg-player.is-portrait { aspect-ratio: 9 / 16; }
body.esg-lp .esg-player--single.is-portrait { width: 360px; height: 640px; max-width: 100%; aspect-ratio: auto; margin: 0 auto; border-radius: 28px; border: 6px solid #fff; }
body.esg-lp .esg-player video, body.esg-lp .esg-player img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
body.esg-lp .esg-player.is-playing video { object-fit: contain; }
body.esg-lp .esg-player__play { position: absolute; left: 50%; top: 50%; width: 76px; height: 76px; margin: -38px 0 0 -38px; border-radius: 50%; background: rgba(255, 255, 255, .94); box-shadow: 0 10px 30px rgba(0, 0, 0, .35); transition: transform .15s; }
body.esg-lp .esg-player__play span { position: absolute; left: 31px; top: 23px; border-style: solid; border-width: 15px 0 15px 24px; border-color: transparent transparent transparent var(--blue); }
body.esg-lp .esg-player__play:hover { transform: scale(1.06); }
body.esg-lp .esg-player__sound { position: absolute; left: 14px; top: 14px; border-radius: var(--r-pill); background: rgba(0, 0, 0, .7); color: #fff; font-size: 12px; font-weight: 600; padding: 7px 14px; }
body.esg-lp .esg-player.is-playing .esg-player__play, body.esg-lp .esg-player.is-playing .esg-player__sound { display: none; }
body.esg-lp .esg-player--empty .esg-player__note { position: absolute; left: 12px; right: 12px; bottom: 12px; font-size: 12px; color: #fff; background: rgba(0, 0, 0, .6); padding: 6px 10px; border-radius: 6px; }

/* ===== 3 · How it works (4 cards) ===== */
body.esg-lp .hiw .hc { padding: 96px 0; display: flex; flex-direction: column; gap: 40px; }
body.esg-lp .hiw__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
body.esg-lp .hiwcard { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 26px 26px 28px; display: grid; grid-template-columns: 150px 1fr; gap: 22px; align-items: start; transition: box-shadow .15s, transform .15s; }
body.esg-lp .hiwcard:hover { box-shadow: var(--shadow); transform: translateY(-2px); }
body.esg-lp .hiwcard__img { background: var(--bg2); border-radius: var(--r-md); overflow: hidden; }
body.esg-lp .hiwcard__img img { width: 100%; aspect-ratio: 1; object-fit: cover; }
body.esg-lp .hiwcard__q { font-size: 20px; }
body.esg-lp .hiwcard__lead { margin-top: 6px; font-size: 15px; color: var(--body); line-height: 1.5; }
body.esg-lp .checks { list-style: none; margin: 12px 0 0; padding: 0; }
body.esg-lp .checks li { position: relative; padding-left: 26px; font-size: 15px; line-height: 1.4; margin: 7px 0; color: var(--ink); }
body.esg-lp .checks li::before { content: ""; position: absolute; left: 0; top: 3px; width: 16px; height: 16px; border-radius: 50%; background: rgba(81, 22, 155, .12); }
body.esg-lp .checks li::after { content: "\2713"; position: absolute; left: 3px; top: 1px; font-size: 12px; font-weight: 800; color: var(--blue-d); }

/* ===== CTA band ===== */
body.esg-lp .ctaband { background: rgba(81, 22, 155, .06); }
body.esg-lp .ctaband .hc { padding: 48px 0; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px; }
body.esg-lp .ctaband__t { font-family: var(--head); font-size: 26px; font-weight: 600; color: var(--ink); max-width: 680px; line-height: 1.25; }
body.esg-lp .ctaband__s { font-size: 16px; color: var(--body); margin-top: -8px; }
body.esg-lp .ctaband__btns { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
body.esg-lp .ctaband--dark { background: var(--dark); }
body.esg-lp .ctaband--dark .ctaband__t { color: #fff; } body.esg-lp .ctaband--dark .ctaband__s { color: rgba(255, 255, 255, .8); }

/* ===== 4 · Experts (dark split) ===== */
body.esg-lp .experts { background: var(--dark); color: #fff; overflow: hidden; }
body.esg-lp .experts .wash { width: 560px; height: 560px; right: -200px; top: -200px; opacity: .18; }
body.esg-lp .experts .hc { display: grid; grid-template-columns: 440px 1fr; gap: 64px; align-items: center; padding: 96px 0; }
body.esg-lp .experts__photo img { width: 100%; height: 480px; object-fit: cover; border-radius: var(--r-lg); box-shadow: var(--shadow-lg); }
body.esg-lp .experts__copy { display: flex; flex-direction: column; gap: 18px; }
body.esg-lp .experts__copy .eyebrow { color: var(--cyan); }
body.esg-lp .experts__title { font-size: 36px; color: #fff; }
body.esg-lp .experts__p { font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, .84); }
body.esg-lp .experts__doc { display: flex; align-items: center; gap: 12px; font-size: 14px; color: rgba(255, 255, 255, .75); }
body.esg-lp .experts__doc b { display: block; color: #fff; font-family: var(--head); }
body.esg-lp .experts .btn-white { align-self: flex-start; }

/* ===== 5 · Who / cost / next step (three rows) ===== */
body.esg-lp .about .hc { padding: 88px 0; }
body.esg-lp .aboutrow { display: grid; grid-template-columns: 340px 1fr; gap: 40px; padding: 34px 0; border-top: 1px solid var(--line); align-items: start; }
body.esg-lp .aboutrow:first-of-type { border-top: 0; padding-top: 0; }
body.esg-lp .aboutrow__t { display: flex; align-items: center; gap: 14px; font-size: 26px; }
body.esg-lp .aboutrow__ico { width: 46px; height: 46px; border-radius: 12px; background: rgba(81, 22, 155, .1); color: var(--blue-d); display: flex; align-items: center; justify-content: center; font-size: 20px; flex: none; }
body.esg-lp .aboutrow__p { font-size: 16px; line-height: 1.65; color: var(--body); }

/* ===== 6 · Testimonials (review cards) ===== */
body.esg-lp .reviews .hc { padding: 96px 0; display: flex; flex-direction: column; gap: 14px; align-items: center; }
body.esg-lp .reviews__rating { display: flex; align-items: center; gap: 10px; font-size: 15px; color: var(--body); }
body.esg-lp .reviews__rating b { font-family: var(--head); font-size: 22px; color: var(--ink); }
body.esg-lp .reviews__rating .stars { color: var(--gold); font-size: 18px; letter-spacing: 1px; }
body.esg-lp .reviewgrid { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 28px; align-items: start; }
body.esg-lp .reviewcard { background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); padding: 26px; display: flex; flex-direction: column; gap: 12px; }
body.esg-lp .reviewcard__stars { color: var(--gold); font-size: 16px; letter-spacing: 2px; }
body.esg-lp .reviewcard__quote { font-family: var(--head); font-size: 19px; font-weight: 600; color: var(--ink); line-height: 1.3; }
body.esg-lp .reviewcard__body { font-size: 15px; line-height: 1.55; color: var(--body); }
body.esg-lp .reviewcard__who { display: flex; align-items: center; gap: 10px; margin-top: auto; padding-top: 6px; font-size: 14px; color: var(--body); }
body.esg-lp .reviewcard__avatar { width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 700; font-size: 15px; flex: none; }
body.esg-lp .reviewcard__who b { color: var(--ink); display: block; }
body.esg-lp .glogo { font-family: 'Product Sans', 'Poppins', sans-serif; font-weight: 700; font-size: 14px; }
body.esg-lp .glogo span:nth-child(1) { color: #4285f4; } body.esg-lp .glogo span:nth-child(2) { color: #ea4335; } body.esg-lp .glogo span:nth-child(3) { color: #fbbc05; } body.esg-lp .glogo span:nth-child(4) { color: #4285f4; } body.esg-lp .glogo span:nth-child(5) { color: #34a853; } body.esg-lp .glogo span:nth-child(6) { color: #ea4335; }

/* ===== 7 · Transformed smiles ===== */
body.esg-lp .smiles .hc { padding: 96px 0; display: flex; flex-direction: column; gap: 36px; }
body.esg-lp .video-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
body.esg-lp .video-card { position: relative; }
body.esg-lp .video-card .esg-player { aspect-ratio: 9 / 16; border-radius: var(--r-lg); box-shadow: var(--shadow); }
body.esg-lp .video-card .esg-player.is-landscape { aspect-ratio: 16 / 9; }
body.esg-lp .video-card__tag { position: absolute; right: 12px; top: 12px; background: #fff; color: var(--blue-d); font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 5px 10px; border-radius: var(--r-pill); pointer-events: none; box-shadow: 0 2px 8px rgba(0, 0, 0, .15); }
body.esg-lp .video-row__empty { text-align: center; color: var(--muted); font-size: 14px; }
body.esg-lp .smiles__cap { text-align: center; font-size: 13px; color: var(--muted); }

/* ===== 8 · Top-rated ===== */
body.esg-lp .community .hc { padding: 96px 0; display: flex; flex-direction: column; gap: 40px; }
body.esg-lp .community__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: stretch; }
body.esg-lp .community__photo img { width: 100%; height: 100%; min-height: 380px; object-fit: cover; border-radius: var(--r-lg); box-shadow: var(--shadow); }
body.esg-lp .gbp { background: #fff; border: 1px solid var(--line); border-radius: var(--r-lg); padding: 24px; display: flex; flex-direction: column; gap: 14px; box-shadow: var(--shadow); }
body.esg-lp .gbp__photos { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
body.esg-lp .gbp__photos img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r-sm); }
body.esg-lp .gbp__name { font-size: 22px; line-height: 1.25; }
body.esg-lp .gbp__rating { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 15px; color: var(--body); }
body.esg-lp .gbp__rating b { font-family: var(--head); color: var(--ink); font-size: 18px; }
body.esg-lp .gbp__rating .stars { color: var(--gold); letter-spacing: 1px; }
body.esg-lp .gbp__rating a { color: var(--blue); font-weight: 600; }
body.esg-lp .gbp__meta { display: grid; gap: 8px; font-size: 14px; color: var(--body); }
body.esg-lp .gbp__meta span { display: flex; gap: 10px; align-items: flex-start; }
body.esg-lp .gbp__meta i { font-style: normal; color: var(--blue); flex: none; }
body.esg-lp .gbp .btn-ghost { align-self: flex-start; margin-top: 4px; }
body.esg-lp .community__cta { display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
body.esg-lp .community__cta .ctaband__t { font-size: 24px; }

/* ===== 9 · FAQ (accordion) ===== */
body.esg-lp .faq .hc { padding: 96px 0; display: flex; flex-direction: column; align-items: center; gap: 36px; }
body.esg-lp .faqlist { width: min(820px, 100%); display: flex; flex-direction: column; gap: 10px; }
body.esg-lp .faqitem { background: #fff; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
body.esg-lp .faqitem__q { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 24px; text-align: left; }
body.esg-lp .faqitem__q h3 { font-size: 17px; font-weight: 600; line-height: 1.3; }
body.esg-lp .faqitem__ico { width: 30px; height: 30px; border-radius: 50%; background: rgba(81, 22, 155, .1); color: var(--blue-d); display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 700; flex: none; }
body.esg-lp .faqitem__a { display: none; padding: 0 24px 22px; font-size: 15px; line-height: 1.6; color: var(--body); }
body.esg-lp .faqitem.is-open { border-color: rgba(81, 22, 155, .35); box-shadow: var(--shadow); }
body.esg-lp .faqitem.is-open .faqitem__a { display: block; }
body.esg-lp .faqitem.is-open .faqitem__ico { background: var(--blue); color: #fff; }

/* ===== Final CTA + footer + sticky bar ===== */
body.esg-lp .finalcta { background: var(--dark); color: #fff; overflow: hidden; }
body.esg-lp .finalcta .wash { width: 600px; height: 600px; left: 50%; top: -300px; margin-left: -300px; opacity: .16; }
body.esg-lp .finalcta .hc { padding: 96px 0; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 18px; }
body.esg-lp .finalcta .eyebrow { color: var(--cyan); }
body.esg-lp .finalcta__t { font-size: 38px; color: #fff; max-width: 760px; }
body.esg-lp .finalcta__s { font-size: 17px; color: rgba(255, 255, 255, .8); max-width: 620px; }
body.esg-lp .footer { background: var(--bg); border-top: 1px solid var(--line); }
body.esg-lp .footer .hc { padding: 30px 0 36px; text-align: center; font-size: 13px; color: var(--muted); display: flex; flex-direction: column; gap: 6px; }
body.esg-lp .footer a { color: var(--blue-d); }
body.esg-lp .stickybar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 190; background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -8px 30px rgba(17, 33, 63, .1); transform: translateY(110%); transition: transform .25s ease; }
body.esg-lp .stickybar.is-visible { transform: translateY(0); }
body.esg-lp .stickybar .hc { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 0; }
body.esg-lp .stickybar__txt { font-size: 15px; color: var(--body); }
body.esg-lp .stickybar__txt b { font-family: var(--head); color: var(--ink); font-size: 17px; }
body.esg-lp .stickybar .btn-primary { padding: 13px 24px; font-size: 15px; box-shadow: none; }

/* ===== Responsive ===== */
@media (max-width: 1024px) {
  body.esg-lp .hero > .hc, body.esg-lp .vsl .hc, body.esg-lp .experts .hc, body.esg-lp .community__grid { grid-template-columns: 1fr; }
  body.esg-lp .hero__title { font-size: 44px; }
  body.esg-lp .reviewgrid { grid-template-columns: 1fr 1fr; }
  body.esg-lp .video-row { grid-template-columns: 1fr 1fr; }
  body.esg-lp .trust .hc { flex-wrap: wrap; justify-content: center; gap: 12px 24px; }
  body.esg-lp .aboutrow { grid-template-columns: 1fr; gap: 14px; }
}
@media (max-width: 720px) {
  body.esg-lp { --gutter: 20px; }
  body.esg-lp .topbar .hc { height: 66px; }
  body.esg-lp .topbar__logo img { height: 38px; }
  body.esg-lp .topbar__brand small, body.esg-lp .topbar__actions .btn-ghost { display: none; }
  body.esg-lp .trust .hc { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 12px; font-size: 13px; }
  body.esg-lp .trust__item { white-space: normal; }
  body.esg-lp .hero > .hc { padding: 40px 0 56px; gap: 36px; }
  body.esg-lp .hero__title { font-size: 38px; }
  body.esg-lp .hero__claim { font-size: 18px; } body.esg-lp .hero__lead { font-size: 16px; }
  body.esg-lp .h2, body.esg-lp .vsl__title, body.esg-lp .experts__title, body.esg-lp .finalcta__t { font-size: 29px; }
  body.esg-lp .survey__steps { padding: 14px 18px 16px; } body.esg-lp .survey__head { padding: 14px 18px 0; } body.esg-lp .form-msg { margin: 0 18px 10px; }
  body.esg-lp .vsl .hc, body.esg-lp .hiw .hc, body.esg-lp .experts .hc, body.esg-lp .reviews .hc, body.esg-lp .smiles .hc, body.esg-lp .community .hc, body.esg-lp .faq .hc, body.esg-lp .finalcta .hc, body.esg-lp .about .hc { padding: 60px 0; }
  body.esg-lp .esg-player--single.is-portrait { width: 100%; max-width: 320px; height: auto; aspect-ratio: 9 / 16; }
  body.esg-lp .hiw__grid { grid-template-columns: 1fr; }
  body.esg-lp .hiwcard { grid-template-columns: 110px 1fr; gap: 16px; padding: 18px; }
  body.esg-lp .experts__photo img { height: 320px; }
  body.esg-lp .reviewgrid, body.esg-lp .video-row { grid-template-columns: 1fr; }
  body.esg-lp .video-card { max-width: 340px; margin: 0 auto; width: 100%; }
  body.esg-lp .ctaband__t { font-size: 22px; }
  body.esg-lp .btn-primary, body.esg-lp .btn-ghost, body.esg-lp .btn-white { width: 100%; }
  body.esg-lp .stickybar__txt { display: none; }
  body.esg-lp .stickybar .btn-primary { width: 100%; }
}

/* 1.3.0: scan-copy disclaimer under the survey card (small print, per client) */
body.esg-lp .hero__fine{margin:12px 0 0;font-size:12px;line-height:1.5;color:#64748b;text-align:center;text-wrap:pretty}
/* 1.3.0: no orphaned last word in review headlines */
body.esg-lp .reviewcard__quote{text-wrap:balance}
/* 1.3.0: full arch leads How It Works; the smaller treatments sit in one line under it */
body.esg-lp .hiwcard--feature { grid-column: 1 / -1; grid-template-columns: 280px 1fr; gap: 32px; align-items: center; }
body.esg-lp .hiwcard--feature .hiwcard__q { font-size: 24px; }
body.esg-lp .hiw__more { grid-column: 1 / -1; margin: 0; font-size: 16px; line-height: 1.6; color: var(--body); text-align: center; text-wrap: pretty; }
body.esg-lp .hiw__more b { color: var(--ink); }
@media (max-width: 720px) {
  body.esg-lp .hiwcard--feature { grid-template-columns: 1fr; gap: 18px; }
  body.esg-lp .hiwcard--feature .hiwcard__img img { aspect-ratio: 16 / 10; }
  body.esg-lp .hiw__more { text-align: left; }
}
/* 1.3.0: no orphaned last word in section subtitles and CTA band headings */
body.esg-lp .head .sub, body.esg-lp .ctaband__t { text-wrap: balance; }

/* 1.4.0: the whole video is clickable before it starts; the 'Real patient' tag never blocks a click */
body.esg-lp .esg-player:not(.is-playing) { cursor: pointer; }
body.esg-lp .video-card__tag { pointer-events: none; }

/* ---------- 1.4.0: above the fold (13 Oct review) ---------- */
/* Eyebrow keeps its size; the lead-in goes charcoal so the offer (blue) carries the emphasis */
body.esg-lp .eyebrow--split .eyebrow__lead { color: var(--ink); }
/* The $550 badge is the offer, so it is the prominent element (about double its old size) */
body.esg-lp .hero__offer { margin: 2px 0 0; }
body.esg-lp .hero__offer .hero__value { margin: 0; font-size: 28px; line-height: 1.2; padding: 10px 22px; letter-spacing: -.01em; }
/* What the offer includes, shown right by the form */
body.esg-lp .hero__includes { margin: 18px 0 16px; text-align: center; }
body.esg-lp .hero__includes-t { display: block; font-family: var(--head); font-weight: 600; font-size: 13px; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); margin-bottom: 8px; }
body.esg-lp .hero__includes ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; }
body.esg-lp .hero__includes li { position: relative; padding-left: 22px; font-size: 15px; font-weight: 600; color: var(--ink); }
body.esg-lp .hero__includes li::before { content: ""; position: absolute; left: 0; top: 50%; width: 15px; height: 15px; margin-top: -7.5px; border-radius: 50%; background: var(--blue) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.2l2.6 2.6L12 5.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px no-repeat; }

@media (max-width: 1024px) {
  /* Single column: the form comes straight after the offer, the longer copy follows it */
  body.esg-lp .hero > .hc { display: flex; flex-direction: column; align-items: stretch; gap: 16px; }
  body.esg-lp .hero__copy { display: contents; }
  body.esg-lp .hero .eyebrow { order: 1; }
  body.esg-lp .hero__title { order: 2; }
  body.esg-lp .hero__offer { order: 3; }
  body.esg-lp .hero__claim { order: 4; }
  body.esg-lp .hero__form { order: 5; margin-top: 8px; }
  body.esg-lp .hero__lead { order: 6; margin-top: 12px; }
  body.esg-lp .hero__proof { order: 7; }
}
@media (max-width: 720px) {
  /* Header: one clean line, brand never wraps */
  body.esg-lp .topbar .hc { height: 62px; }
  body.esg-lp .topbar__brand { font-size: 16px; white-space: nowrap; }
  body.esg-lp .topbar__actions .btn-primary { width: auto; padding: 11px 18px; font-size: 15px; white-space: nowrap; }
  /* Trust bar: three stats in one row, number over label, thin dividers (house pattern) */
  body.esg-lp .trust .hc { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; padding: 10px 0; }
  body.esg-lp .trust__item--wide { display: none; }
  body.esg-lp .trust__item { flex-direction: column; justify-content: center; gap: 2px; text-align: center; font-size: 11px; line-height: 1.25; color: rgba(255, 255, 255, .78); white-space: normal; }
  body.esg-lp .trust__item + .trust__item { border-left: 1px solid rgba(255, 255, 255, .18); }
  body.esg-lp .trust__item b { font-size: 18px; color: #fff; line-height: 1.1; }
  body.esg-lp .trust__item .stars { font-size: 10px; letter-spacing: 0; }
  /* Hero spacing and the badge at phone width */
  body.esg-lp .hero > .hc { padding: 26px 0 48px; gap: 14px; }
  body.esg-lp .hero__title { font-size: 36px; }
  body.esg-lp .hero__offer .hero__value { font-size: 21px; padding: 9px 16px; }
  body.esg-lp .hero__form-title { font-size: 20px; }
  body.esg-lp .hero__includes li { font-size: 14px; }
}
body.esg-lp .eyebrow__offer { white-space: nowrap; }
@media (max-width: 720px) {
  /* The badge fits on one line at phone width */
  body.esg-lp .hero__offer .hero__value { font-size: 19px; padding: 9px 16px; white-space: nowrap; }
  /* Phones: "Claim your free consultation voucher..." already introduces the form and the card says
     "100% secure & private", so the form's own title and subline are hidden to lift the survey above the fold */
  body.esg-lp .hero__form-title, body.esg-lp .hero__form-sub { display: none; }
  body.esg-lp .hero__includes { margin: 4px 0 14px; }
  body.esg-lp .hero__claim { font-size: 17px; }
}

/* 1.4.0: phone-only hero (13 Oct): no eyebrow, centred two-line headline, centred badge and claim, three included items side by side */
@media (max-width: 720px) {
  body.esg-lp .hero .eyebrow--split { display: none; }
  /* "Confidence Again" is about 9 em wide, so size it to the text column (screen minus the 20px gutters) */
  body.esg-lp .hero__title { text-align: center; font-size: clamp(28px, calc((100vw - 40px) / 9.3), 52px); line-height: 1.04; }
  body.esg-lp .hero__title-a, body.esg-lp .hero__title b { display: block; white-space: nowrap; }
  body.esg-lp .hero__offer { align-self: center; }
  body.esg-lp .hero__claim { text-align: center; font-size: clamp(15px, 4.5vw, 19px); line-height: 1.35; }
  body.esg-lp .hero__claim b, body.esg-lp .hero__claim-b { display: block; white-space: nowrap; }
  body.esg-lp .hero__includes ul { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 8px; }
  body.esg-lp .hero__includes li { padding: 22px 0 0; text-align: center; font-size: 13px; line-height: 1.3; }
  body.esg-lp .hero__includes li::before { left: 50%; top: 0; margin: 0 0 0 -8px; width: 16px; height: 16px; }
}
@media (max-width: 359px) { body.esg-lp .hero__claim b { white-space: normal; text-wrap: balance; } }
@media (max-width: 720px) { body.esg-lp .hero__includes li { text-wrap: balance; } }
/* 1.4.0: video section intro is one paragraph of normal body copy (same as the about rows) */
body.esg-lp .vsl__p { font-size: 16px; line-height: 1.65; color: var(--body); text-wrap: pretty; }
/* 1.4.0: community section without images; the Google card keeps its old width (one column of the 2-col grid) and sits centred */
body.esg-lp .community__grid--solo { grid-template-columns: minmax(0, calc((100% - 40px) / 2)); justify-content: center; }
@media (max-width: 1024px) { body.esg-lp .community__grid--solo { grid-template-columns: 1fr; } }
body.esg-lp .gbp__meta span { text-wrap: balance; }
/* 1.4.0: reviews and community are both white, so their paddings stacked into a 192px gap; close it to one section gap */
body.esg-lp .reviews .hc { padding-bottom: 40px; }
body.esg-lp .community .hc { padding-top: 56px; }
@media (max-width: 720px) { body.esg-lp .reviews .hc { padding-bottom: 28px; } body.esg-lp .community .hc { padding-top: 32px; } }

/* =====================================================================================
   Part 2 · V4 layout. Mobile first: phone styles are the default, wider screens adjust.
   ===================================================================================== */
body.esg-lp { background: var(--dark); color: #fff; }
body.esg-lp .tt-bar { background: #51169B; color: #fff; text-align: center; font-family: var(--head); font-weight: 700; font-size: 13px; letter-spacing: .04em; text-transform: uppercase; padding: 9px 16px; line-height: 1.35; text-wrap: balance; }
body.esg-lp .tt { max-width: 760px; margin: 0 auto; padding: 16px 20px 40px; }

/* 2 · Banner: logo panel + three real before/after smiles */
body.esg-lp .tt-banner { display: grid; grid-template-columns: 1fr 2.4fr; gap: 6px; background: #fff; border-radius: 5px; padding: 6px; overflow: hidden; }
body.esg-lp .tt-banner__logo { display: flex; align-items: center; justify-content: center; padding: 8px; }
body.esg-lp .tt-banner__logo img { width: 100%; max-width: 120px; height: auto; }
body.esg-lp .tt-banner__ba { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
body.esg-lp .tt-banner__ba img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 3px; }

/* 3 · Headline offer */
body.esg-lp .tt-h1 { margin: 18px 0 0; font-family: var(--head); font-weight: 600; font-size: 22px; line-height: 1.3; text-align: center; color: #fff; text-wrap: balance; }
body.esg-lp .tt-h1 b { font-weight: 800; color: var(--cyan); }
body.esg-lp .tt-h1 .tt-value { font-weight: 800; white-space: nowrap; }
body.esg-lp .tt-h1 .tt-free { color: #fff; font-size: 1.12em; white-space: nowrap; }

/* 4 · Dashed rule + "See If YOU Qualify" */
body.esg-lp .tt-rule { border: 0; border-top: 2px dashed rgba(255, 255, 255, .45); margin: 22px 0; }
body.esg-lp .tt-h2 { font-family: var(--head); font-weight: 800; font-size: 32px; line-height: 1.15; text-align: center; color: #fff; margin: 0 0 16px; }
body.esg-lp .tt-h2 b { color: var(--cyan); }

/* 5 · Survey card (V2's survey styles, on white) */
body.esg-lp .tt-form .survey { background: #fff; color: var(--body); border-radius: 5px; box-shadow: 0 18px 40px rgba(0, 0, 0, .35); }

/* 6-9 · Offer copy */
body.esg-lp .tt-offer { margin-top: 30px; text-align: center; }
body.esg-lp .tt-h3 { font-family: var(--head); font-weight: 700; font-size: 24px; line-height: 1.25; color: #fff; margin: 0; text-wrap: balance; }
body.esg-lp .tt-lead { margin-top: 16px; font-size: 18px; line-height: 1.45; font-weight: 600; color: #fff; text-wrap: balance; }
body.esg-lp .tt-lead b { color: var(--cyan); }
body.esg-lp .tt-includes-t { margin-top: 22px; font-family: var(--head); font-weight: 700; font-size: 22px; color: #fff; }
body.esg-lp .tt-includes { list-style: none; margin: 12px auto 0; padding: 0; display: inline-flex; flex-direction: column; gap: 9px; text-align: left; }
body.esg-lp .tt-includes li { position: relative; padding-left: 30px; font-size: 16px; line-height: 1.4; font-weight: 600; color: #fff; }
body.esg-lp .tt-includes li::before { content: ""; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 3px; background: #1a9b4b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.6 8.3l2.9 2.9 5.9-6.1' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
body.esg-lp .tt-nocost { margin-top: 24px; font-family: var(--head); font-weight: 700; font-size: 21px; line-height: 1.3; color: #fff; }
body.esg-lp .tt-nocost span { display: block; font-size: 16px; font-weight: 600; color: var(--cyan); margin-top: 4px; }
body.esg-lp .tt-why { margin-top: 22px; font-size: 18px; line-height: 1.45; font-weight: 600; color: #fff; text-wrap: balance; }
body.esg-lp .tt-btn { display: block; width: 100%; max-width: 560px; margin: 22px auto 0; padding: 16px 18px; border-radius: 3px; background: var(--blue); color: #fff; text-align: center; font-family: var(--head); font-weight: 700; font-size: 17px; line-height: 1.3; box-shadow: 0 10px 26px rgba(81, 22, 155, .35); transition: background .15s; text-wrap: balance; }
body.esg-lp .tt-btn:hover { background: var(--blue-d); }
body.esg-lp .tt-fine { margin-top: 14px; font-size: 12px; line-height: 1.5; color: rgba(255, 255, 255, .62); text-wrap: pretty; }

/* 10 · Map */
body.esg-lp .tt-map { margin-top: 32px; }
body.esg-lp .tt-map iframe { display: block; width: 100%; height: 240px; border: 0; border-radius: 5px; background: #e9eef3; }
body.esg-lp .tt-map__addr { margin-top: 10px; text-align: center; font-size: 14px; color: rgba(255, 255, 255, .78); text-wrap: balance; }

/* 11 · Real patients (videos in place of the reference's doctor photo) */
body.esg-lp .tt-patients { margin-top: 32px; }
body.esg-lp .tt-label { text-align: center; font-family: var(--head); font-weight: 700; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--cyan); margin-bottom: 14px; }
body.esg-lp .tt-patients .video-row { grid-template-columns: 1fr 1fr; gap: 10px; }
body.esg-lp .tt-patients .video-card { max-width: none; margin: 0; }
body.esg-lp .tt-patients .video-card .esg-player { border-radius: 5px; box-shadow: none; }
body.esg-lp .tt-patients .esg-player__play { width: 56px; height: 56px; margin: -28px 0 0 -28px; }
body.esg-lp .tt-patients .esg-player__play span { left: 23px; top: 17px; border-width: 11px 0 11px 17px; }
/* Small cards: clicking anywhere already starts the video with sound, so the sound pill is not needed */
body.esg-lp .tt-patients .esg-player__sound { display: none; }
body.esg-lp .tt-patients .video-card__tag { font-size: 9px; right: 8px; top: 8px; padding: 4px 7px; }

/* 12 · Awards on a white panel (the badges come on white) */
body.esg-lp .tt-awards { margin-top: 28px; background: #fff; border-radius: 5px; padding: 10px; }
body.esg-lp .tt-awards img { width: 100%; max-width: 520px; height: auto; margin: 0 auto; }

/* 13 · Reviews */
body.esg-lp .tt-reviews { margin-top: 32px; text-align: center; }
body.esg-lp .tt-reviews__rating { margin: 6px 0 14px; font-size: 15px; color: rgba(255, 255, 255, .85); }
body.esg-lp .tt-reviews__rating b { font-family: var(--head); font-size: 20px; color: #fff; }
body.esg-lp .tt-stars { color: var(--gold); letter-spacing: 1px; }
body.esg-lp .tt-review { background: #fff; color: var(--body); text-align: left; border-radius: 5px; padding: 16px 18px; margin-top: 10px; }
body.esg-lp .tt-review__who { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
body.esg-lp .tt-review__who b { font-family: var(--sans); font-weight: 600; font-size: 15px; color: var(--ink); }
body.esg-lp .tt-review__av { width: 32px; height: 32px; border-radius: 50%; color: #fff; font-weight: 700; font-size: 14px; display: flex; align-items: center; justify-content: center; flex: none; }
body.esg-lp .tt-review p { margin-top: 6px; font-size: 15px; line-height: 1.55; }

/* 14-15 · Closing urgency + final CTA */
body.esg-lp .tt-limited { margin-top: 30px; text-align: center; font-family: var(--head); font-weight: 800; font-size: 21px; letter-spacing: .02em; text-transform: uppercase; color: #fff; text-wrap: balance; }
body.esg-lp .tt-btn--final { margin-top: 16px; }

/* 16 · Footer */
body.esg-lp .tt-footer { text-align: center; font-size: 12px; line-height: 1.55; color: rgba(255, 255, 255, .6); display: flex; flex-direction: column; gap: 8px; align-items: center; }
body.esg-lp .tt-footer__logo { width: 72px; height: auto; background: #fff; border-radius: 5px; padding: 6px; margin-bottom: 6px; }
body.esg-lp .tt-footer a { color: rgba(255, 255, 255, .85); text-decoration: underline; }

/* Wider screens: same single column and order, more breathing room, never a narrow strip */
@media (min-width: 721px) {
  body.esg-lp .tt-bar { font-size: 14px; padding: 11px 16px; }
  body.esg-lp .tt { padding: 28px 24px 56px; }
  body.esg-lp .tt-banner { padding: 8px; gap: 8px; }
  body.esg-lp .tt-banner__logo img { max-width: 170px; }
  body.esg-lp .tt-banner__ba img { aspect-ratio: 450 / 700; object-position: 50% 35%; }
  body.esg-lp .tt-h1 { font-size: 36px; margin-top: 28px; }
  body.esg-lp .tt-h2 { font-size: 42px; }
  body.esg-lp .tt-form { max-width: 600px; margin: 0 auto; }
  body.esg-lp .tt-h3 { font-size: 30px; }
  body.esg-lp .tt-lead, body.esg-lp .tt-why { font-size: 20px; }
  body.esg-lp .tt-includes li { font-size: 17px; }
  body.esg-lp .tt-nocost { font-size: 24px; }
  body.esg-lp .tt-btn { font-size: 18px; padding: 18px 22px; }
  body.esg-lp .tt-map iframe { height: 320px; }
  body.esg-lp .tt-patients .video-row { grid-template-columns: repeat(4, 1fr); gap: 12px; }
  body.esg-lp .tt-reviews .tt-review { padding: 18px 22px; }
  body.esg-lp .tt-limited { font-size: 26px; }
}

/* 1.5.0: urgency bar text fills the bar, measured against the bar itself (container units), not the window.
   The full line is about 32.6em wide, the longer half-line about 16.7em.
   Phones: two lines, each sized to the bar width. Wider: one line sized to the bar, capped at 22px. */
body.esg-lp .tt-bar { container-type: inline-size; line-height: 1.2; padding: 10px 16px; }
body.esg-lp .tt-bar__a, body.esg-lp .tt-bar__b { white-space: nowrap; }
@media (max-width: 480px) {
  body.esg-lp .tt-bar__a, body.esg-lp .tt-bar__b { display: block; font-size: calc(100cqw / 16.45); }
}
@media (min-width: 481px) {
  body.esg-lp .tt-bar__a, body.esg-lp .tt-bar__b { font-size: min(calc(100cqw / 32.0), 23px); }
}

/* 1.5.0 review: no italics anywhere on V4; body text is upright everywhere */
body.esg-lp, body.esg-lp * { font-style: normal; }
/* Headline sits on three lines on desktop/tablet */
@media (min-width: 721px) { body.esg-lp .tt-h1 { font-size: 31px; line-height: 1.28; } }
/* Phones: patient videos stack, one per row */
@media (max-width: 720px) {
  body.esg-lp .tt-patients .video-row { grid-template-columns: 1fr; gap: 14px; }
  body.esg-lp .tt-patients .video-card { max-width: 360px; margin: 0 auto; width: 100%; }
  body.esg-lp .tt-patients .esg-player__play { width: 68px; height: 68px; margin: -34px 0 0 -34px; }
  body.esg-lp .tt-patients .esg-player__play span { left: 28px; top: 21px; border-width: 13px 0 13px 20px; }
  body.esg-lp .tt-patients .esg-player__sound { display: inline-block; font-size: 12px; padding: 6px 12px; left: 12px; top: 12px; }
  body.esg-lp .tt-patients .video-card__tag { font-size: 11px; right: 12px; top: 12px; padding: 5px 10px; }
}

/* ---------- 1.5.0 review: the whole first survey step (question, answers, Next + progress) above the fold ---------- */
/* Tighter run-in to the form */
body.esg-lp .tt { padding-top: 12px; }
body.esg-lp .tt-h1 { margin-top: 14px; }
body.esg-lp .tt-rule { margin: 14px 0; }
body.esg-lp .tt-h2 { font-size: 28px; margin-bottom: 10px; }
/* Compact survey card: no reserved height, slimmer answers */
body.esg-lp .tt-form .survey { margin-top: 0; }
body.esg-lp .tt-form .survey__head { padding: 12px 18px 0; }
body.esg-lp .tt-form .survey__steps { min-height: 0; padding: 10px 18px 12px; }
body.esg-lp .tt-form .survey__q { font-size: 17px; margin-bottom: 10px; }
body.esg-lp .tt-form .survey__opt { padding: 10px 12px; margin-bottom: 7px; font-size: 15px; }
body.esg-lp .tt-form .survey__bar { padding: 22px 16px 12px; }
body.esg-lp .tt-form .survey__progress-txt { top: -18px; }
body.esg-lp .tt-form .survey__next, body.esg-lp .tt-form .survey__submit { padding: 11px 22px; }
/* Short-answer questions sit 2 x 2 (teeth missing, age, how long) */
body.esg-lp .tt-form .survey__step[data-id="teeth_missing"]:not([hidden]),
body.esg-lp .tt-form .survey__step[data-id="age"]:not([hidden]),
body.esg-lp .tt-form .survey__step[data-id="missing_duration"]:not([hidden]) { display: grid; grid-template-columns: 1fr 1fr; column-gap: 8px; }
body.esg-lp .tt-form .survey__step[data-id] > .survey__q { grid-column: 1 / -1; }
/* Phones: smaller headline so the first step fits a phone browser (about 664px visible) */
@media (max-width: 720px) {
  body.esg-lp .tt { padding: 10px 16px 36px; }
  body.esg-lp .tt-h1 { font-size: 20px; line-height: 1.25; margin-top: 12px; }
  body.esg-lp .tt-rule { margin: 12px 0; }
  body.esg-lp .tt-h2 { font-size: 26px; margin-bottom: 8px; }
  body.esg-lp .tt-form .survey__head { padding: 10px 14px 0; }
  body.esg-lp .tt-form .survey__steps { padding: 8px 14px 10px; }
  body.esg-lp .tt-form .survey__q { font-size: 16px; margin-bottom: 8px; }
  body.esg-lp .tt-form .survey__opt { padding: 9px 10px; gap: 9px; font-size: 14px; }
}
/* Desktop */
@media (min-width: 721px) {
  body.esg-lp .tt-h1 { margin-top: 16px; }
  body.esg-lp .tt-h2 { font-size: 32px; }
}
/* second squeeze (banner kept at its original size) */
@media (max-width: 720px) {
  body.esg-lp .tt-bar { padding-top: 8px; padding-bottom: 8px; }
  body.esg-lp .tt-h1 { font-size: 19px; margin-top: 10px; }
  body.esg-lp .tt-rule { margin: 10px 0; }
}
@media (min-width: 721px) {
  body.esg-lp .tt { padding-top: 10px; }
}

/* 1.5.0 review: offer section in three clear blocks (centred intro / framed offer panel, left-aligned inside / centred close) */
body.esg-lp .tt-offer { margin-top: 40px; }
body.esg-lp .tt-lead { margin-top: 12px; }
body.esg-lp .tt-panel { margin: 28px auto 0; max-width: 560px; text-align: left; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .14); border-radius: 5px; padding: 20px 20px 18px; }
body.esg-lp .tt-panel .tt-includes-t { margin: 0; font-size: 20px; }
body.esg-lp .tt-panel .tt-includes { display: flex; margin: 12px 0 0; }
body.esg-lp .tt-panel .tt-includes li { text-wrap: pretty; }
body.esg-lp .tt-panel .tt-nocost { margin: 18px 0 0; padding-top: 16px; border-top: 1px solid rgba(255, 255, 255, .14); font-size: 19px; text-wrap: balance; }
body.esg-lp .tt-panel .tt-nocost span { font-size: 15px; }
body.esg-lp .tt-why { margin-top: 32px; }
body.esg-lp .tt-offer .tt-btn { margin-top: 18px; }
@media (min-width: 721px) {
  body.esg-lp .tt-panel { padding: 24px 28px 22px; }
  body.esg-lp .tt-panel .tt-includes-t { font-size: 22px; }
  body.esg-lp .tt-panel .tt-nocost { font-size: 22px; }
}
body.esg-lp .tt-panel .tt-includes-t { text-wrap: balance; }

/* 1.5.0 review: shorter banner on SHORT screens only, every before/after photo shown whole (no cropping) */
body.esg-lp .tt-banner__extra { display: none; }
@media (min-width: 721px) and (max-height: 800px) {
  /* six uncropped pairs side by side: narrower tiles = a shorter banner that still fills the width */
  body.esg-lp .tt-banner { grid-template-columns: 1fr 4.6fr; }
  body.esg-lp .tt-banner__ba { grid-template-columns: repeat(6, 1fr); }
  body.esg-lp .tt-banner__extra { display: block; }
  body.esg-lp .tt-banner__ba img { aspect-ratio: 450 / 905; object-position: 50% 50%; }
  body.esg-lp .tt-banner__logo img { max-width: 120px; }
}
@media (max-width: 720px) and (max-height: 700px) {
  /* short phones: the logo panel takes more width, so the three uncropped tiles are narrower and shorter */
  body.esg-lp .tt-banner { grid-template-columns: 1.55fr 2.4fr; }
  body.esg-lp .tt-rule { margin: 8px 0; }
  body.esg-lp .tt-h2 { font-size: 24px; margin-bottom: 6px; }
  body.esg-lp .tt-h1 { margin-top: 8px; }
}

/* 1.5.0 review: the closing paragraph wraps naturally (no line balancing), lighter weight like body copy */
body.esg-lp .tt-why { text-wrap: pretty; font-weight: 500; max-width: 36em; margin-left: auto; margin-right: auto; }

/* 1.5.0 review: desktop videos in a 2 x 2 grid, kept to a sensible width */
@media (min-width: 721px) {
  body.esg-lp .tt-patients .video-row { grid-template-columns: repeat(2, 1fr); gap: 16px; max-width: 560px; margin: 0 auto; }
}
/* very short screens only (1280x720 laptops, 360x640 phones) */
@media (min-width: 721px) and (max-height: 740px) {
  body.esg-lp .tt-h1 { font-size: 28px; margin-top: 12px; }
  body.esg-lp .tt-rule { margin: 10px 0; }
  body.esg-lp .tt-h2 { font-size: 28px; }
}
@media (max-width: 720px) and (max-height: 650px) {
  body.esg-lp .tt-bar { padding-top: 6px; padding-bottom: 6px; }
  body.esg-lp .tt-h1 { font-size: 18px; }
  body.esg-lp .tt { padding-top: 8px; }
}

/* 1.5.0 review: headline = the giveaway sentence, then the value on its own line, bigger, bold, blue */
body.esg-lp .tt-h1 b, body.esg-lp .tt-h1 .tt-free, body.esg-lp .tt-h1 .tt-value { color: inherit; font-weight: inherit; font-size: inherit; }
body.esg-lp .tt-h1__lead { display: block; }
body.esg-lp .tt-h1__value { display: block; margin-top: 4px; color: var(--cyan); font-weight: 800; font-size: 1.5em; line-height: 1.12; white-space: nowrap; }
/* "See If YOU Qualify" a step smaller so the value carries the attention */
body.esg-lp .tt-h2 { font-size: 23px; }
@media (min-width: 721px) {
  body.esg-lp .tt-h1 { font-size: 26px; }
  body.esg-lp .tt-h1__value { font-size: 1.55em; }
  body.esg-lp .tt-h2 { font-size: 27px; }
}
@media (min-width: 721px) and (max-height: 740px) { body.esg-lp .tt-h1 { font-size: 24px; } body.esg-lp .tt-h2 { font-size: 25px; } }
@media (max-width: 720px) and (max-height: 700px) { body.esg-lp .tt-h2 { font-size: 21px; } }

/* 1.5.0 review: sticky top bar with one button */
body.esg-lp .tt-sticky { position: fixed; left: 0; right: 0; top: 0; z-index: 300; background: rgba(11, 23, 48, .96); backdrop-filter: blur(8px); border-bottom: 1px solid rgba(255, 255, 255, .12); padding: 10px 16px; transform: translateY(-110%); transition: transform .25s ease; }
body.esg-lp .tt-sticky.is-visible { transform: translateY(0); }
body.esg-lp .tt-sticky .tt-sticky__btn { margin: 0 auto; max-width: 420px; padding: 12px 18px; font-size: 16px; box-shadow: none; }
@media (max-width: 345px) { body.esg-lp .tt-h1__value { font-size: 1.22em; } }
/* buttons scroll to the form: land it just below the sticky bar */
body.esg-lp #survey { scroll-margin-top: 72px; }

/* Trusted systems strip (replaces the GD awards block) — heading above the card, logos fill it */
body.esg-lp .tt-systems-sec { margin-top: 34px; }
body.esg-lp .tt-systems { background: #fff; border-radius: 5px; padding: 30px 28px; text-align: center; }
body.esg-lp .tt-systems__row { display: flex; align-items: center; justify-content: center; gap: 28px; flex-wrap: nowrap; }
body.esg-lp .tt-systems__row img { flex: 1 1 0; min-width: 0; height: 56px; width: auto; object-fit: contain; }
@media (max-width: 560px) {
  body.esg-lp .tt-systems { padding: 22px 16px; }
  body.esg-lp .tt-systems__row { gap: 14px; }
  body.esg-lp .tt-systems__row img { height: 40px; }
}
/* V4 testimonial grid: 2 x 2 (zigzag clinician/patient), one per row on phones */
body.esg-lp .tt-patients .video-row { grid-template-columns: 1fr 1fr; max-width: 560px; margin: 0 auto; gap: 14px; }
@media (max-width: 720px) { body.esg-lp .tt-patients .video-row { grid-template-columns: 1fr; max-width: 360px; } }