/* =====================================================================
   brandmkt.css  (4 Nov 2026)
   Page-level additions for the rebranded DB landers, /vs/ pages and the
   Accelerator offer. Loaded after brand.css and realui.css. Tokens only,
   nothing here redefines a brand component.

   1. small helpers the brandmkt partials use
   2. the /vs/ comparison table
   3. .bm-kept: SEO prose stored in the Lander table (inline styles from the
      old design), brought onto the brand type scale without touching the row
   4. /vs/ index cards
   5. Accelerator offer: one plan, guarantee, purchase modal
   ===================================================================== */

/* ---------- 1. helpers ---------- */
.bm-cap{display:grid;margin-top:24px}
.bm-cap .res-cap{grid-area:1/1;margin:0;opacity:0;transition:opacity .4s}
.bm-cap .res-cap.on{opacity:1}
.bm-promo{margin-top:14px}
.bm-promo b{color:var(--red-2);font-weight:600}
.bm-tour .stepcopy{min-height:118px}
.hero .bm-sub{max-width:720px;margin:14px auto 0}

/* ---------- 2. /vs/ comparison table ---------- */
.bm-cmp{max-width:980px;margin:56px auto 0}
.bm-cmp .tbl-m th:first-child,.bm-cmp .tbl-m td:first-child{width:44%}
.bm-cmp .tbl-m thead th.us{color:var(--ink)}
.bm-cmp .tbl-m thead th.us .logo{font-size:17px;gap:7px}
.bm-cmp .tbl-m thead th.us .dot{width:12px;height:12px}
.bm-cmp .tbl-m tbody th .tag{margin-left:8px;vertical-align:1px}
.bm-cmp .mk{display:inline-flex;align-items:center;gap:10px;font-weight:500;color:var(--ink)}
.bm-cmp .mk.no{color:var(--muted);font-weight:400}
.bm-cmp .ql{display:block;margin-top:4px;font-size:13px;line-height:1.4;color:var(--muted)}
.bm-cmp .nt{font-size:14.5px;line-height:1.45;color:var(--ink-2)}
.bm-cmp .ds{color:var(--faint)}
.bm-cmp-note{max-width:760px;margin:18px auto 0;text-align:center}
.tag.sm{height:20px;font-size:11px;padding:0 7px;border-radius:6px}
.bm-kept .bm-faq-mail{margin-top:30px!important;font-size:15px!important;color:var(--muted)!important}
.bm-bl{margin-top:26px!important}

/* ---------- 3. kept SEO prose from the Lander table ---------- */
.bm-kept section{background:transparent!important;padding:0!important;margin:0!important;text-align:left!important}
.bm-kept section+section{margin-top:var(--sec)!important}
.bm-kept section>div{max-width:none!important;margin:0!important;padding:0!important}
.bm-kept h2{font:500 clamp(30px,3.2vw,44px)/1.08 var(--f)!important;letter-spacing:-.03em!important;color:var(--ink)!important;margin:0 0 30px!important;text-align:left!important;text-wrap:balance}
.bm-kept h3{font:500 var(--fs-t2,19px)/1.3 var(--f)!important;letter-spacing:-.015em!important;color:var(--ink)!important;margin:36px 0 10px!important}
.bm-kept h2+h3{margin-top:0!important}
.bm-kept p,.bm-kept li{font-family:var(--f)!important;font-size:17px!important;line-height:1.62!important;color:var(--ink-2)!important;text-align:left!important}
.bm-kept p{margin:0 0 18px!important}
.bm-kept strong,.bm-kept b{color:var(--ink)!important;font-weight:600!important}
.bm-kept a:not(.btn){color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--red);text-decoration-thickness:1.5px}
.bm-kept a:not(.btn):hover{color:var(--red-2)}
.bm-kept ul,.bm-kept ol{list-style:none!important;padding:0!important;margin:0!important}
/* the FAQ: one question per row, rules like the brand FAQ, answers always shown */
.bm-faq section>div>div{margin:0!important;padding:22px 0 6px!important;border-top:1px solid var(--line)}
.bm-faq section>div>div:last-child{border-bottom:1px solid var(--line)}
.bm-faq section>div>div>p:first-child,.bm-faq section>div>div>h3:first-child{font:500 19px/1.35 var(--f)!important;letter-spacing:-.012em!important;color:var(--ink)!important;margin:0 0 10px!important}
.bm-faq section>div>div>p+p{font-size:16.5px!important}
/* the pricing comparison: our Pro card next to the competitor's stored card */
.bm-price section>div>div[style*="grid"]{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px!important;margin-top:8px}
.bm-price section>div>div[style*="grid"]>div{border:0!important;border-radius:var(--r-m)!important;background:var(--paper)!important;box-shadow:var(--sh-1);padding:32px 34px 34px!important}
.bm-price section>div>div[style*="grid"]>div h3{font-size:22px!important;margin:0 0 6px!important}
.bm-price section>div>div[style*="grid"]>div:not(.bm-us)>p:first-of-type{font:500 52px/1.1 var(--f)!important;letter-spacing:-.04em!important;color:var(--ink)!important;margin:14px 0 18px!important}
.bm-price section>div>div[style*="grid"]>div:not(.bm-us)>p:first-of-type span{font-size:16px!important;letter-spacing:0!important;color:var(--muted)!important;font-weight:400!important}
.bm-price section>div>div[style*="grid"]>div li{display:flex;gap:11px;font-size:15.5px!important;line-height:1.45!important;padding:6px 0}
.bm-price section>div>div[style*="grid"]>div li::before{content:"";flex:none;width:20px;height:20px;margin-top:1px;border-radius:50%;background:var(--sand) no-repeat center/10px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238C8A84' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.bm-price section>div>div[style*="grid"]>div.bm-us{box-shadow:0 0 0 1.5px var(--red),0 30px 70px -30px rgba(225,29,42,.35)}
.bm-price section>div>div[style*="grid"]>div.bm-us li::before{background-color:var(--red-wash);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E11D2A' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.bm-us .bm-us-h{display:flex;align-items:center;gap:10px}
.bm-us .bm-us-p{display:flex;align-items:baseline;gap:8px;margin:14px 0 4px}
.bm-us .bm-us-p b{font:500 52px/1.1 var(--f);letter-spacing:-.04em;color:var(--ink)}
.bm-us .bm-us-p span{font-size:16px;color:var(--muted)}
.bm-kept .bm-us p.fine{font-size:14px!important;color:var(--muted)!important;margin:0 0 18px!important}
.bm-us .btn{margin-top:22px}
.bm-kept .bm-us p.fine2{font-size:13.5px!important;line-height:1.5!important;color:var(--muted)!important;margin:12px 0 0!important;text-align:center!important}
.bm-us .avs img{width:28px;height:28px;box-shadow:0 0 0 2px #fff}
.bm-us .avs img+img{margin-left:-8px}
.bm-us li.fd{align-items:center}
.bm-us li.fd::before{display:none!important}
.bm-price section>div>p:last-child{max-width:760px;margin:28px auto 0!important;text-align:center!important;font-size:16px!important}

/* ---------- 4. /vs/ index ---------- */
.bm-vs-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:64px}
.bm-vs-c{display:flex;flex-direction:column;gap:14px;padding:28px 30px 30px;border-radius:var(--r-m);background:var(--paper);box-shadow:var(--sh-1);transition:transform var(--t-ui) var(--ease),box-shadow var(--t-ui)}
.bm-vs-c:hover{transform:translateY(-4px);box-shadow:0 1px 2px rgba(30,20,10,.05),0 24px 50px -20px rgba(30,20,10,.25)}
.bm-vs-c .pair{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.bm-vs-c .pair .logo{font-size:15px;gap:6px}
.bm-vs-c .pair .dot{width:10px;height:10px}
.bm-vs-c h3{font-size:var(--fs-t1,24px);font-weight:500;letter-spacing:-.02em;line-height:1.2}
.bm-vs-c p{font-size:15px;line-height:1.55;color:var(--ink-2);flex:1}
.bm-vs-c .lnk{font-size:14.5px}

/* ---------- 5. Accelerator offer ---------- */
.bm-one{max-width:520px;margin:48px auto 0}
.bm-one .plan{padding:38px 38px 40px}
.bm-guar{max-width:620px;margin:28px auto 0;text-align:center;font-size:15px;line-height:1.55;color:var(--ink-2)}
.bm-guar b{color:var(--ink);font-weight:600}
.bm-modal{align-items:center;justify-content:center;background:rgba(12,12,13,.45);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.bm-modal .exm-body{padding:34px 36px 30px}
.bm-modal h3{font-size:var(--fs-t1,24px);font-weight:500;letter-spacing:-.02em;line-height:1.2;color:var(--ink)}
.bm-modal p{margin-top:10px;font-size:16px;line-height:1.55;color:var(--ink-2)}
.bm-modal .go{margin-top:26px;justify-content:flex-end}

/* ---------- 6. DB landers (templates/lander.html) ----------
   The stored bodies are written by the admin landers API and were styled by
   the old global styles.css. Restyling them here, scoped to main.lb, rebrands
   them without a production write. Three families, set by lander.html:
     .lb-ah    clinic pages: own scoped .ah styles. Only the brand classes they
               share by name are reset (0,2,0, so the body's own .ah rules win).
     .lb-cs    practice-software setup pages: own scoped .cs styles.
     .lb-prose everything else: inline-styled sections, video + prompt pages. */
main.lb{padding-top:calc(var(--nav-h) + 12px)}
.lb .lander-container{overflow-wrap:break-word}

/* clinic pages: reset what brand.css adds to class names the .ah markup also uses */
.lb-ah{--ah-off:calc(var(--nav-h) + 12px)}
.lb-ah .faq{display:block;gap:0}
.lb-ah .plans{max-width:none;margin:0}
.lb-ah .plan{box-shadow:none;padding:28px}
.lb-ah .price{height:auto;margin-top:0}
.lb-ah .billed{min-height:0;margin-top:0;font-size:inherit}
.lb-ah .logos{padding:0;text-align:inherit}
.lb-ah .btn{height:auto}
.lb-ah .dot::after{display:none}
.lb-ah .hero{overflow:visible}

/* clinic pages on the brand type and colours, render time only (the stored .ah body
   is unchanged; main.lb-ah .ah outranks the body's own .ah rules). Instrument Sans
   500 headings, warm page, ink buttons, sentence-case labels. The scroll-following
   orb (#aorb) and the hero glow (.band::before) are the blurred blobs the brand
   does not use, so they go. */
main.lb-ah .ah{--sans:var(--f);--bg:var(--page);--bg2:#F7F5F0;--fg:var(--ink);--fg2:var(--ink-2);--fg3:var(--muted);--line:#ECE8E1;--line2:#E2DDD4;--black:var(--ink);background:var(--page)}
main.lb-ah .ah #aorb,main.lb-ah .ah .band::before{display:none!important}
main.lb-ah .ah .band{background:transparent}
main.lb-ah .ah h1,main.lb-ah .ah h2,main.lb-ah .ah h3,main.lb-ah .ah h1 em,main.lb-ah .ah .h1b,main.lb-ah .ah h4{font-weight:500!important;font-style:normal!important}
main.lb-ah .ah h1{letter-spacing:-.035em!important}
main.lb-ah .ah h2{letter-spacing:-.03em!important;color:var(--ink)}
main.lb-ah .ah h3{letter-spacing:-.015em!important}
main.lb-ah .ah .btn{font-weight:500;border-radius:var(--r-s)}
main.lb-ah .ah .btn.primary{background:var(--ink)}
main.lb-ah .ah .eyebrow,main.lb-ah .ah .vt-eyebrow,main.lb-ah .ah .rl-h,main.lb-ah .ah .also-l,main.lb-ah .ah .vs-ha,main.lb-ah .ah .vs-l,main.lb-ah .ah .wd-tag,main.lb-ah .ah .ax-tag,main.lb-ah .ah .pv-k,main.lb-ah .ah .cmp thead th,main.lb-ah .ah .cmp-card .lbl,main.lb-ah .ah .works .wl{text-transform:none!important;letter-spacing:0!important;font-weight:500!important}
main.lb-ah .ah .eyebrow{font-size:14px;color:var(--red-2)}
main.lb-ah .ah .trusted .lbl{text-transform:lowercase;letter-spacing:.01em;font-size:13px;font-weight:400;color:var(--muted)}
main.lb-ah .ah .trusted .lbl::first-letter{text-transform:uppercase}
main.lb-ah .ah .card,main.lb-ah .ah .ev{border-color:var(--line)}

/* clinic and setup bodies carry their own footer (.ah-foot, with the clinic and
   practice-software links). lander.html leaves the brand footer out on those pages,
   so there is one footer, restyled here like the brand footer. */
main.lb footer.ah-foot{background:var(--page)!important;color:var(--ink-2)!important;border-top:1px solid var(--line);padding:72px 0 48px!important;font-family:var(--f)!important}
main.lb footer.ah-foot h4{color:var(--ink)!important;font-size:13px!important;font-weight:600!important;letter-spacing:.01em!important;text-transform:none!important}
main.lb footer.ah-foot a{color:var(--ink-2)!important}
main.lb footer.ah-foot a:hover{color:var(--red-2)!important}
main.lb footer.ah-foot .brand .logo{color:var(--ink)!important;font:700 23px/1 var(--f)!important;letter-spacing:-.045em!important}
main.lb footer.ah-foot .brand p,main.lb footer.ah-foot .copy{color:var(--muted)!important}
main.lb footer.ah-foot .copy{border-top-color:var(--line)!important}

/* practice-software setup pages (.cs bodies): same treatment as the clinic pages.
   Their step screens are rebuilt Cliniko / Nookal / Splose UIs and stay. */
main.lb-cs .cs{--ink:#0C0C0D;--line:#ECE8E1;font-family:var(--f)}
main.lb-cs .cs .cs-glow,main.lb-cs .cs .cs-glow2{display:none!important}
main.lb-cs .cs h1,main.lb-cs .cs h2,main.lb-cs .cs h3,main.lb-cs .cs h4{font-weight:500!important}
main.lb-cs .cs h1{letter-spacing:-.035em!important}
main.lb-cs .cs h2{letter-spacing:-.03em!important}
main.lb-cs .cs .cs-kick,main.lb-cs .cs .cs-where{text-transform:none!important;letter-spacing:0!important;font-weight:500!important}
main.lb-cs .cs .cs-kick{font-size:14px}
main.lb-cs .cs .cs-where{font-size:12px}
main.lb-cs .cs .cs-num{background:var(--ink);box-shadow:none;font-weight:500}
main.lb-cs .cs .cs-step,main.lb-cs .cs .cs-card,main.lb-cs .cs .cs-end{background:#fff}

/* the listing visual in Google Maps' own UI (components/brandmkt/_clinic_gbp.html).
   Same rules as realui.css .gm / .gpost / .by-d, scoped: realui.css itself is not
   loaded here because its .pill, .cal, .vs, .yes and .no would restyle the body. */
main.lb-ah .ah .sp-v.sp-real{background:var(--sand);border:0;box-shadow:none;overflow:visible}
.lb-ah .gm-wrap{display:flex;flex-direction:column;align-items:center;width:100%;max-width:420px}
.lb-ah .gm{width:100%;border-radius:16px;background:#fff;box-shadow:var(--sh-2);overflow:hidden;font-family:Roboto,Arial,sans-serif;color:#1f1f1f;text-align:left}
.lb-ah .gm-tabs{display:flex;padding:0 16px;border-bottom:1px solid #e8eaed;font:500 13.5px "Google Sans",Roboto,Arial,sans-serif;color:#5e5e5e}
.lb-ah .gm-tabs span{flex:1;text-align:center;padding:13px 0 12px}
.lb-ah .gm-tabs .on{color:#0b57d0;box-shadow:inset 0 -3px 0 #0b57d0}
.lb-ah .gm-b{padding:16px 18px 18px}
.lb-ah .gm-u{display:flex;gap:12px;align-items:center}
.lb-ah .gm-av{width:36px;height:36px;border-radius:50%;background:#7b1fa2;color:#fff;display:grid;place-items:center;font:500 16px "Google Sans",Roboto,Arial,sans-serif}
.lb-ah .gm-u b{display:block;font:500 14px "Google Sans",Roboto,Arial,sans-serif}
.lb-ah .gm-u small{display:block;font-size:12px;color:#70757a}
.lb-ah .gm-st{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:12px;color:#70757a}
.lb-ah .gm-st .stars{display:flex;gap:1px;font-size:inherit}
.lb-ah .gm-st .stars svg{width:13px;height:13px;color:#fbbc04}
.lb-ah .gm-t{font-size:14px;line-height:20px;margin-top:6px;color:#1f1f1f}
.lb-ah .gm-r{margin-top:14px;padding:12px 14px;border-radius:10px;background:#f6f8fc;transition:opacity .45s,transform .45s}
.lb-ah .gm-r .h{display:flex;align-items:baseline;gap:8px;font:500 13.5px "Google Sans",Roboto,Arial,sans-serif;color:#1f1f1f}
.lb-ah .gm-r .h small{font:400 12px Roboto,Arial,sans-serif;color:#70757a}
.lb-ah .gm-r p{font-size:13.5px;line-height:20px;margin-top:4px;color:#3c4043;min-height:40px}
.lb-ah .by-d{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font:600 10.5px var(--f-ui);letter-spacing:.06em;color:var(--red);transition:opacity .4s,transform .4s}
.lb-ah .by-d .dot{width:10px;height:10px}
.lb-ah .gpost{position:relative;align-self:flex-end;margin:-22px -6px 0 0;width:260px;padding:12px 14px;border-radius:14px;background:#fff;box-shadow:var(--sh-2);font-family:var(--f-ui);text-align:left;transition:opacity .5s,transform .5s}
.lb-ah .gpost .hd{display:flex;align-items:center;gap:8px;font-size:11px;color:#888}
.lb-ah .gpost .hd svg{width:14px;height:14px;color:var(--red)}
.lb-ah .gpost b{display:block;font-size:12.5px;font-weight:600;margin-top:6px;line-height:1.35;color:#111}
.lb-ah .gpost .vw{display:flex;justify-content:space-between;margin-top:8px;font-size:11px;color:#888}
.lb-ah .gpost .vw em{font-style:normal;color:var(--ok);font-weight:700}
main.lb-ah .ah .sp-real .ex{color:var(--muted);text-shadow:none}
@media (max-width:640px){.lb-ah .gpost{margin-right:0;width:min(260px,92%)}}

/* prose landers: sections from the old inline styles, on the brand scale */
.lb-prose .lander-container section{background:transparent!important;padding:clamp(56px,7vw,104px) var(--gut)!important;text-align:left}
.lb-prose .lander-container:not(.lc-rest) section:first-child{padding-top:clamp(40px,6vw,88px)!important}
.lb-prose .lander-container section>div{max-width:760px!important;margin:0 auto!important}
.lb-prose .lander-container h1{font:500 clamp(38px,5vw,60px)/1.04 var(--f)!important;letter-spacing:-.035em!important;color:var(--ink)!important;margin:0 0 22px!important;text-wrap:balance}
.lb-prose .lander-container h2{font:500 clamp(30px,3.2vw,44px)/1.08 var(--f)!important;letter-spacing:-.03em!important;color:var(--ink)!important;margin:0 0 24px!important;text-wrap:balance}
.lb-prose .lander-container h3{font:500 var(--fs-t2,19px)/1.3 var(--f)!important;letter-spacing:-.015em!important;color:var(--ink)!important;margin:30px 0 8px!important}
.lb-prose .lander-container h2+h3,.lb-prose .lander-container h1+h3{margin-top:0!important}
.lb-prose .lander-container p,.lb-prose .lander-container li{font-family:var(--f)!important;font-size:17px!important;line-height:1.62!important;color:var(--ink-2)!important}
.lb-prose .lander-container p{margin:0 0 16px!important}
.lb-prose .lander-container p[style*="0.85rem"],.lb-prose .lander-container p[style*=".85rem"]{font-size:14px!important;color:var(--muted)!important}
.lb-prose .lander-container strong,.lb-prose .lander-container b{color:var(--ink)!important;font-weight:600!important}
.lb-prose .lander-container a:not(.hero-cta):not(.cta-button-new){color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--red);text-decoration-thickness:1.5px}
.lb-prose .lander-container ul{display:grid;gap:12px;margin:18px 0 22px!important;padding:0!important}
.lb-prose .lander-container ul li{position:relative;padding-left:34px;list-style:none}
.lb-prose .lander-container ul li::before{content:"";position:absolute;left:0;top:3px;width:22px;height:22px;border-radius:50%;background:var(--red-wash) no-repeat center/12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E11D2A' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}
.lb-prose .lander-container ol{list-style:decimal;padding-left:1.3em!important;margin:16px 0 20px!important}
.lb-prose .lander-container ol li+li{margin-top:8px}
/* the first section is the page's hero: centred */
.lb-prose .lander-container:not(.lc-rest)>section:first-child,.lb-prose .lander-container:not(.lc-rest)>section:first-child>div{text-align:center!important}
.lb-prose .lander-container:not(.lc-rest)>section:first-child p{font-size:clamp(17px,1.4vw,20px)!important;max-width:640px;margin-left:auto!important;margin-right:auto!important}
.lb-prose .lander-container:not(.lc-rest)>section:first-child p[style*="0.85rem"]{font-size:14px!important;color:var(--muted)!important;margin-top:14px!important}
/* cards: the old bordered boxes */
.lb-prose .lander-container div[style*="border: 1px solid"],.lb-prose .lander-container div[style*="border:1px solid"]{border:0!important;border-radius:var(--r-m)!important;background:var(--paper)!important;box-shadow:var(--sh-1);padding:28px 30px!important}
/* numbered steps: the orange discs become the brand number */
.lb-prose .lander-container div[style*="border-radius: 50%"]{min-width:28px!important;width:28px;height:28px!important;background:var(--ink)!important;color:#fff!important;font:600 13px/1 var(--f)!important;margin:2px 16px 0 0!important}
/* quotes: the red rule of the brand */
.lb-prose .lander-container div[style*="border-left"],.lb-prose .lander-container blockquote{border-left:0!important;box-shadow:inset 2px 0 0 var(--red);padding-left:22px!important}
/* buttons stored as .hero-cta / .cta-button-new become the brand black button */
.lb-prose .lander-container .hero-cta-buttons{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.lb-prose .lander-container:not(.lc-rest)>section:first-child .hero-cta-buttons{justify-content:center}
.lb-prose .lander-container a.hero-cta,.lb-prose .lander-container a.cta-button-new,.lb-prose .lander-container .yt-cta-inner a{display:inline-flex;align-items:center;justify-content:center;height:52px;padding:0 26px;border-radius:var(--r-s);background:var(--ink);color:#fff!important;font:500 16px/1 var(--f);text-decoration:none!important;box-shadow:0 1px 2px rgba(12,12,13,.2),0 10px 22px -12px rgba(12,12,13,.5);transition:transform var(--t-fast),box-shadow var(--t-fast)}
.lb-prose .lander-container a.hero-cta:hover,.lb-prose .lander-container a.cta-button-new:hover,.lb-prose .lander-container .yt-cta-inner a:hover{transform:translateY(-1px)}
/* the checklist page hero (.hero > .hero-container ...) */
.lb-prose .lander-container section.hero{position:static;overflow:visible;isolation:auto}
.lb-prose .lander-container .hero-container{max-width:760px;margin:0 auto}
.lb-prose .lander-container .hero-content>h3{display:inline-flex;height:26px;align-items:center;padding:0 10px;border-radius:8px;background:var(--red-wash);color:var(--red-2)!important;font:600 12px/1 var(--f)!important;letter-spacing:.01em!important;margin:0 0 18px!important}
.lb-prose .lander-container:not(.lc-rest)>section:first-child ul{text-align:left;max-width:620px;margin-left:auto!important;margin-right:auto!important}
.lb-prose .lander-container .hero-flex ul{text-align:left;max-width:620px;margin:28px auto 0!important}

/* video + prompt pages (.yt-prompt-page) and the short video page (.lander-lp-video-section) */
.lb-prose .lander-container .yt-prompt-page{max-width:calc(var(--max) + 2*var(--gut));margin:0 auto}
.lb-prose .lander-container .yt-video-section{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,72px);align-items:center;max-width:none!important}
.lb-prose .lander-container .yt-video-section>*{max-width:none!important;margin:0!important}
.lb-prose .lander-container .yt-video-meta h1{font-size:clamp(34px,4vw,52px)!important}
.lb-prose .lander-container .yt-video-wrapper{position:relative;aspect-ratio:16/9;border-radius:var(--r-m);overflow:hidden;background:#111;box-shadow:0 0 0 1px rgba(20,16,10,.06),0 50px 100px -48px rgba(110,30,6,.5);margin:28px 0}
.lb-prose .lander-container .yt-video-section .yt-video-wrapper{margin:0!important}
.lb-prose .lander-container .yt-video-wrapper iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lb-prose .lander-container .yt-prompt-inner{max-width:820px!important}
.lb-prose .lander-container .yt-prompt-eyebrow{display:inline-flex;height:26px;align-items:center;padding:0 10px;border-radius:8px;background:var(--red-wash);color:var(--red-2);font-size:12px;font-weight:600;margin-bottom:16px}
.lb-prose .lander-container .yt-prompt-block-wrapper{position:relative;margin:28px 0 36px}
.lb-prose .lander-container .yt-prompt-block{margin:0;max-height:560px;overflow:auto;white-space:pre-wrap;font:400 13.5px/1.65 var(--f-mono);background:#141413;color:#f3efe9;padding:64px 26px 26px;border-radius:var(--r-win);box-shadow:var(--sh-2)}
.lb-prose .lander-container .yt-prompt-copy-btn{position:absolute;top:14px;right:14px;z-index:1;height:36px;padding:0 14px;border-radius:10px;background:#fff;color:var(--ink);font:500 14px/1 var(--f);box-shadow:0 1px 2px rgba(0,0,0,.2)}
.lb-prose .lander-container .yt-prompt-copy-btn.copied{background:var(--ok-wash);color:var(--ok)}
.lb-prose .lander-container .yt-cta-inner{border-radius:var(--r-m);background:var(--paper);box-shadow:var(--sh-1);padding:32px 34px 34px;margin-top:36px!important}
.lb-prose .lander-container .yt-cta-inner h3{font-size:var(--fs-t1,24px)!important;margin:0 0 10px!important}
.lb-prose .lander-container .yt-cta-inner a{margin-top:10px}
.lb-prose .lander-container .lander-lp-video-section{max-width:820px;margin:0 auto}
.lb-prose .lander-container .lander-lp-cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px;margin-top:8px}
.lb-prose .lander-container .lander-lp-cta-row p{margin:0!important;font-size:14px!important;color:var(--muted)!important;flex:1;min-width:220px}

@media (max-width:900px){
  .lb-prose .lander-container .yt-video-section{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .lb-prose .lander-container section{padding-left:var(--gut)!important;padding-right:var(--gut)!important}
  .lb-prose .lander-container p,.lb-prose .lander-container li{font-size:16.5px!important}
  .lb-prose .lander-container div[style*="border: 1px solid"],.lb-prose .lander-container div[style*="border:1px solid"]{padding:22px 20px!important}
  .lb-prose .lander-container a.hero-cta,.lb-prose .lander-container a.cta-button-new,.lb-prose .lander-container .yt-cta-inner a{width:100%;max-width:360px}
  .lb-prose .lander-container .yt-prompt-block{padding:60px 16px 18px;font-size:12.5px}
  .lb-prose .lander-container .yt-cta-inner{padding:24px 20px 26px}
}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .bm-vs-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bm-price section>div>div[style*="grid"]{grid-template-columns:minmax(0,1fr)!important}
}
@media (max-width:640px){
  .bm-vs-grid{grid-template-columns:minmax(0,1fr);margin-top:40px}
  .bm-cmp{margin-top:40px}
  /* Phone: all three columns fit, so both brands are visible without scrolling. */
  .bm-cmp .tbl-m{table-layout:fixed;font-size:14px}
  .bm-cmp .tbl-m th,.bm-cmp .tbl-m td{padding:13px 8px;overflow-wrap:break-word}
  .bm-cmp .tbl-m th:first-child,.bm-cmp .tbl-m td:first-child{width:46%;padding-left:14px}
  .bm-cmp .tbl-m thead th:not(:first-child){width:27%}
  .bm-cmp .tbl-m td:last-child,.bm-cmp .tbl-m thead th:last-child{padding-right:12px}
  .bm-cmp .tbl-m thead th{font-size:12.5px;padding-top:16px;padding-bottom:12px}
  .bm-cmp .tbl-m thead th.us .logo{font-size:14px;gap:5px}
  .bm-cmp .tbl-m thead th.us .dot{width:9px;height:9px}
  .bm-cmp .tbl-m tbody th{font-size:14px;line-height:1.35}
  .bm-cmp .tbl-m tbody th .tag{display:table;margin:5px 0 0}
  .bm-cmp .mk{gap:0}
  .bm-cmp .ql{font-size:12px;line-height:1.35}
  .bm-cmp .nt,.bm-cmp .ds{display:block;font-size:12.5px;line-height:1.4}
  .bm-kept p,.bm-kept li{font-size:16.5px!important}
  .bm-price section>div>div[style*="grid"]>div{padding:26px 24px 28px!important}
  .bm-modal .go{flex-direction:column-reverse}
  .bm-modal .go .btn{width:100%}
}