/* ==========================================================================
   R3 design system.

   Ported from the Polymarket Israel funnel (public/css/style.css), which is
   the house design reference: same fonts, same colour system, same hero,
   same shimmer CTA, same order bumps, same dark checkout.

   Structure of a page, top to bottom:
     .hero        black
     .body        white, 760px reading column
     .warn        black
     .faq-section white
     .checkout    near-black
   ========================================================================== */

:root{
  --neon:#22c55e;
  --neon-glow:#4ade80;
}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:hidden;scroll-behavior:smooth}
body{
  font-family:"Assistant","Arial Hebrew",Arial,sans-serif;
  background:#fff;color:#111;line-height:1.7;
  overflow-x:hidden;
}
h1,h2,.quote,.cta{
  font-family:"Open Sans","Assistant",Arial,sans-serif;
  font-weight:800;
}

/* ---- HERO (black) ---- */
.hero{
  background:#000;color:#fff;text-align:center;
  padding:34px 20px 80px;width:100%;
}
.hero-logo{display:block;margin:0 auto 16px;width:clamp(72px,8.5vw,98px);height:auto}
.badge{
  position:relative;
  display:inline-flex;align-items:center;gap:9px;
  background:rgba(255,255,255,.05);
  backdrop-filter:blur(12px) saturate(140%);
  -webkit-backdrop-filter:blur(12px) saturate(140%);
  color:#eaf2ff;font-weight:600;font-size:clamp(13px,2vw,16px);
  padding:9px 18px;border-radius:10px;margin-bottom:28px;
  border:1.5px dashed rgba(74,222,128,.7);
  box-shadow:0 4px 20px rgba(34,197,94,.15),inset 0 1px 0 rgba(255,255,255,.08);
}
.badge .dot{
  width:9px;height:9px;border-radius:50%;background:#56ffa0;
  box-shadow:0 0 9px #56ffa0;animation:pulse 1.8s ease-in-out infinite;
}
.badge-sep{width:1px;height:15px;flex:0 0 auto;background:rgba(255,255,255,.3)}
.badge b{font-weight:800}
.badge .tp-star{width:17px;height:17px;flex:0 0 auto}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}

.hero h1{
  font-size:clamp(18px,5.9vw,50px);font-weight:800;white-space:nowrap;
  line-height:1.25;max-width:900px;margin:0 auto;
}
.hero h1 .hl{color:var(--neon-glow)}
.hero .sub{
  font-size:clamp(19px,3vw,26px);opacity:.85;margin-top:24px;font-style:italic;
}

/* neon-framed image */
.neon-frame{
  margin:46px auto 0;max-width:760px;
  border:2px solid var(--neon);border-radius:14px;
  box-shadow:
    0 0 5px var(--neon),
    0 0 12px rgba(74,222,128,.55),
    0 0 24px rgba(34,197,94,.35),
    inset 0 0 10px rgba(74,222,128,.3);
  overflow:hidden;background:#05080f;line-height:0;
}
.neon-frame img,.neon-frame video{display:block;width:100%;height:auto}

.price-orig{
  margin-top:42px;font-size:20px;
  text-decoration:line-through;text-decoration-color:#ff5555;opacity:.85;
}

/* shimmer CTA */
.cta{
  display:inline-block;margin-top:20px;
  font-size:clamp(20px,3vw,28px);font-weight:800;color:#fff;
  padding:20px 88px;border:none;border-radius:50px;cursor:pointer;text-decoration:none;
  max-width:100%;box-sizing:border-box;
  background:linear-gradient(110deg,#15803d 25%,#22c55e 45%,#bbf7d0 50%,#22c55e 55%,#15803d 75%);
  background-size:200% 100%;
  box-shadow:0 8px 30px rgba(34,197,94,.55),0 0 0 0 rgba(74,222,128,.5);
  animation:shimmer 2.4s linear infinite;
  transition:transform .18s ease,box-shadow .18s ease;
  position:relative;
}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.cta:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 14px 40px rgba(34,197,94,.75)}
.cta:active{transform:translateY(0) scale(.99)}
.cta .cta-sub{
  display:block;font-size:11px;font-weight:600;opacity:.9;margin-top:4px;
  font-family:"Assistant",Arial,sans-serif;letter-spacing:.1px;white-space:nowrap;
}
.cta-note{display:block;margin-top:8px;font-size:11px;color:#ff8a8a}
/* the button label beats, so the eye keeps coming back to it */
.cta-beat{display:inline-block;font-size:.9em;white-space:nowrap;transform-origin:center;animation:ctaBeat 1.9s ease-in-out infinite}
.cta-arw{display:inline-block;width:.85em;height:.85em;vertical-align:-.1em;margin-inline-start:.4em;transition:transform .2s ease}
.cta:hover .cta-arw,.co-pay:hover .cta-arw{transform:translateX(4px)}
.co-pay .cta-arw{width:1em;height:1em;vertical-align:-.15em;margin-inline-start:.35em}
@keyframes ctaBeat{
  0%,55%,100%{transform:scale(1)}
  12%{transform:scale(1.065)}
  24%{transform:scale(.975)}
  36%{transform:scale(1.04)}
}

/* one-time-offer badge above the CTA */
.cta-timer{
  display:flex;align-items:center;justify-content:center;gap:8px;width:fit-content;max-width:94vw;
  margin:0 auto 12px;padding:8.5px 18px;border-radius:14px;
  background:rgba(255,107,107,.12);border:2px dashed rgba(255,107,107,.55);
  color:#ffc2c2;font-size:clamp(18px,3.31vw,21.2px);font-weight:700;line-height:1.35;
  font-family:"Assistant",Arial,sans-serif;letter-spacing:.1px;
}
.cta-timer b{color:#fff;font-weight:800}
.cta-timer b.t{font-variant-numeric:tabular-nums;direction:ltr;display:inline-block;min-width:66px}
.cta-timer .dot{width:8px;height:8px;flex:0 0 auto;border-radius:50%;background:#ff6b6b;animation:ctaDot 1.2s ease-in-out infinite}
/* on the white sections the pale hero colours vanish, so the badge reads in
   strong red there. The hero keeps its own. */
.body .cta-timer,.faq-section .cta-timer{
  color:#c81e1e;background:rgba(220,38,38,.08);border-color:#dc2626}
.body .cta-timer b,.faq-section .cta-timer b{color:#b91c1c}
.body .cta-timer .dot,.faq-section .cta-timer .dot{background:#dc2626}
@keyframes ctaDot{0%,100%{opacity:1}50%{opacity:.25}}

.cta-bonus{
  display:flex;align-items:center;justify-content:center;gap:6px;
  margin:16px auto 0;max-width:520px;text-align:center;
  font-size:clamp(14px,2.4vw,16px);font-weight:500;color:#eaf2ff;line-height:1.5;
}
@media (min-width:641px){ .hero .cta{min-width:460px} }
@media (max-width:640px){
  .cta-bonus{font-size:12.6px}
  .cta{display:block;width:100%;padding-left:20px;padding-right:20px}
}

/* hero trust chips */
.hero-quote{
  margin:30px auto 0;max-width:560px;padding:0 16px;
  font-size:clamp(16px,2.4vw,19px);font-style:italic;color:#eaf2ff;line-height:1.5;
}
.hero-quote .who{display:block;margin-top:7px;font-size:14px;font-style:normal;color:#9fb6dd}
.trust-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:20px auto 0;padding:0 12px}
.trust-chips span{
  display:inline-flex;align-items:center;gap:6px;
  background:rgba(255,255,255,.05);border:1px solid rgba(74,222,128,.35);
  color:#cfe0ff;font-size:13px;font-weight:600;
  padding:7px 14px;border-radius:50px;white-space:nowrap;
}
.trust-chips svg{width:13px;height:13px;flex:0 0 auto;color:#4ade80}
/* 15% smaller on a phone, and tight enough that all three share one line,
   the way the reference /ai hero keeps its trust chips on a single row */
@media(max-width:767px){
  .trust-chips{gap:6px;padding:0 4px;flex-wrap:nowrap}
  .trust-chips span{font-size:11px;padding:6px 9px;gap:4px}
  .trust-chips svg{width:11px;height:11px}
}
/* the narrowest phones get their wrap back rather than overflowing */
@media(max-width:350px){.trust-chips{flex-wrap:wrap}}
.paybadges{display:flex;justify-content:center;align-items:center;gap:10px;margin-top:16px;flex-wrap:wrap}
.paybadges span{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);
  color:#dfe9ff;font-size:12px;font-weight:700;border-radius:8px;padding:5px 12px;
}
.secure-line{margin-top:10px;font-size:12.5px;color:#9fb6dd}

/* ---- BODY (white) ---- */
.body{max-width:760px;margin:0 auto;padding:56px 22px 110px}
.body h2{text-align:center;font-size:clamp(24px,4vw,34px);font-weight:800;line-height:1.2;margin:72px 0 24px}
.body h3{text-align:center;font-size:clamp(20px,3.2vw,26px);font-weight:800;margin:40px 0 14px}
.body p{font-size:18px;margin:28px 0;line-height:1.7}
.center{text-align:center}
.italic{font-style:italic}
.quote{text-align:center;font-size:clamp(22px,4vw,30px);font-weight:800;font-style:italic;margin:84px 0 50px}
.body .market-q{text-align:center;font-style:italic;font-size:21.6px;font-weight:800;line-height:1.3;margin:18px 0 26px !important}
.big{font-weight:800}
.space-top{margin-top:52px !important}
.fun-line{font-size:clamp(22px,3.4vw,28px);font-weight:800}
.kicker{text-align:center;font-size:13px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#5b6675;margin:72px 0 10px !important}
.body h2.method-h{margin-top:0}
.h2-sub{margin:-14px 0 26px !important;text-align:center;font-size:15.5px;font-style:italic;color:#5b6675}

/* the short centred story paragraphs */
.story{max-width:640px;margin:0 auto;text-align:center}
.story p{margin:40px 0;line-height:1.7}
.story p:first-child{margin-top:14px}

/* ✅ list */
.checks{list-style:none;max-width:560px;margin:24px auto;font-size:19px}
.checks li{margin:12px 0}
.checks li::before{content:"✅ "}
.checks li.gift::before{content:"🎁 "}

/* the three R3 jobs, as cards on the white body */
.jobs{display:grid;gap:16px;margin:36px 0}
@media (min-width:720px){.jobs{grid-template-columns:repeat(3,1fr)}}
.job{border:1px solid #e3e6e3;border-radius:16px;padding:24px 22px;background:#fafbfa}
.job .jk{display:block;font-size:13px;font-weight:800;letter-spacing:1.4px;color:var(--neon);margin-bottom:6px}
.job h4{font-family:"Open Sans","Assistant",Arial,sans-serif;font-size:22px;font-weight:800;margin:0 0 8px}
.job p{font-size:16px;margin:0;line-height:1.6}

/* old way / new way */
.compare{border:2px solid #111;border-radius:14px;overflow:hidden;margin:30px 0}
.compare .row{display:grid;border-bottom:1px solid #ddd}
.compare .row:last-child{border-bottom:0}
@media (min-width:640px){.compare .row{grid-template-columns:1fr 1fr}}
.compare .c{padding:16px 18px;font-size:16.5px;line-height:1.6}
.compare .c.old{color:#777;background:#f6f6f6}
.compare .c.new{color:#111;font-weight:600}
.compare .c .lbl{display:block;font-size:11px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;margin-bottom:5px}
.compare .c.old .lbl{color:#aaa}
.compare .c.new .lbl{color:var(--neon)}

/* the plan day strip */
.weeks{display:grid;gap:14px;margin:30px 0}
@media (min-width:720px){.weeks{grid-template-columns:repeat(4,1fr)}}
.week{border:2px solid #111;border-radius:14px;padding:18px 16px;text-align:center}
.week .w{font-size:12px;font-weight:800;letter-spacing:1.2px;color:#999}
.week h4{font-family:"Open Sans",Arial,sans-serif;font-size:20px;font-weight:800;margin:6px 0}
.week p{font-size:15px;margin:0;line-height:1.55;color:#555}

/* value stack */
.stack{border:2px solid #111;border-radius:14px;overflow:hidden;margin:30px 0}
.stack .item{padding:16px 20px;border-bottom:1px solid #ddd}
.stack .item:last-child{border-bottom:0}
.stack .item b{display:block;font-size:17px;font-weight:800}
.stack .item span{display:block;font-size:15.5px;color:#666;margin-top:3px;line-height:1.55}
/* the price reveal under the stack: worth, hairline, today. One line each,
   centred, about 14px of air between them. */
.reveal{text-align:center;margin:30px auto 10px;max-width:420px}
.body .reveal p{margin:0;line-height:1.3}
.body .reveal-worth{font-size:19px;font-weight:600;color:#444}
.reveal-rule{width:120px;height:0;border:0;border-top:1px solid #cfcfcf;margin:14px auto}
.body .reveal-now{font-size:20px;font-weight:700;color:#111}
.reveal-now b{font-family:"Open Sans",Arial,sans-serif;font-size:44px;font-weight:800;line-height:1;vertical-align:-3px;margin-inline-start:2px}

/* two options fork */
.fork{display:grid;gap:16px;margin:30px 0}
@media (min-width:720px){.fork{grid-template-columns:1fr 1fr}}
.fork .opt{border:2px solid #ddd;border-radius:14px;padding:22px 20px}
.fork .opt.two{border-color:var(--neon);background:rgba(34,197,94,.05)}
.fork .opt .n{font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:#aaa}
.fork .opt.two .n{color:var(--neon)}
.fork .opt p{margin:8px 0 0;font-size:16.5px;line-height:1.6}

/* real images + placeholders */
.ev-img{display:block;margin:26px auto;max-width:560px;width:100%;height:auto;border-radius:14px}
.ev-img.rounded{border-radius:18px}
.img-ph{
  margin:26px auto;max-width:560px;border-radius:14px;
  border:1px dashed #bbb;background:#f6f6f6;color:#777;
  padding:26px 18px;text-align:center;font-size:13px;line-height:1.6;
}
.img-ph.rounded{border-radius:18px}
/* a placeholder sitting inside a neon frame fills it edge to edge */
.neon-frame .img-ph{
  margin:0;max-width:none;width:100%;border:0;border-radius:0;
  background:#05080f;color:#8ea6c8;padding:62px 26px;line-height:1.7;font-size:14px;
}
.neon-frame .img-ph b{color:var(--neon-glow);font-size:12px}
.img-ph b{display:block;font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:#999;margin-bottom:8px}
.carousel-label{text-align:center;font-size:13px;color:#888;margin-top:14px}

/* ---- WARNING section (black) ---- */
.warn{background:#000;color:#fff;text-align:center;padding:78px 24px;width:100%}
.warn h2{color:#fff;font-size:clamp(30px,5.5vw,46px);margin:0 auto 34px;font-family:"Open Sans",Arial,sans-serif;font-weight:800}
.warn p{font-size:clamp(17px,2.4vw,20px);max-width:720px;margin:18px auto;opacity:.92}

/* ---- FAQ ---- */
.faq-section{background:#fff;color:#111;padding:84px 24px 96px;width:100%}
.faq-section h2{text-align:center;font-size:clamp(26px,4.6vw,38px);font-weight:800;margin:0 0 14px;font-family:"Open Sans",Arial,sans-serif}
.faq-section .faq-sub{text-align:center;font-size:17px;color:#777;margin:0 auto 30px;max-width:560px}
.faq{max-width:680px;margin:26px auto 0}
.faq-item{border:1px solid #000;border-radius:10px;margin:14px 0;overflow:hidden;background:#fff}
.faq-q{
  font-weight:800;font-size:clamp(17px,3vw,21px);margin:0;
  padding:18px 20px;cursor:pointer;list-style:none;
  display:flex;justify-content:space-between;align-items:center;gap:14px;
}
.faq-q::-webkit-details-marker{display:none}
.faq-q::after{content:"+";font-size:26px;font-weight:400;line-height:1;color:#000;flex:0 0 auto}
.faq-item[open] .faq-q::after{content:"-"}
.faq-a{font-size:17px;color:#333;margin:0;line-height:1.75;padding:0 20px 20px}

/* ==========================================================================
   CHECKOUT (near-black)
   Markup and ids are identical to the reference funnel, so checkout.js,
   the Tranzila Hosted Fields mounts and the PayPal buttons are a straight port.
   ========================================================================== */

.checkout{background:#05070d;color:#fff;padding:80px 20px 90px;width:100%}
.checkout-inner{max-width:640px;margin:0 auto}
.checkout h2{text-align:center;font-size:clamp(26px,4.6vw,38px);font-weight:800;margin:0 0 8px;font-family:"Open Sans",Arial,sans-serif}
.checkout .co-sub{text-align:center;color:#9fb6dd;font-size:16px;margin:0 0 34px}
.co-card{
  background:rgba(255,255,255,.045);
  border:1px solid rgba(74,222,128,.35);
  border-radius:18px;padding:28px 24px;
  box-shadow:0 0 40px rgba(34,197,94,.12);
}
.p2-field{margin-bottom:14px}
.p2-field input{
  width:100%;padding:14px 16px;font-size:16px;border-radius:12px;
  border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.07);
  color:#fff;font-family:inherit;outline:none;transition:border-color .15s;
}
.p2-field input:focus{border-color:var(--neon-glow)}
.p2-field input::placeholder{color:#7788a8}
.p2-hint{display:block;font-size:12.5px;color:#9fb6dd;margin:6px 2px 0}
.p2-row{display:flex;gap:10px}
.p2-row .p2-field{flex:1;margin-bottom:0}

/* Tranzila Hosted Fields mount into these */
.hf-box{height:48px;border-radius:12px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.07);overflow:hidden}
.hf-box iframe{height:100%;width:100%;border:none}
.hf-box.mock{display:flex;align-items:center;padding:0 14px;color:#7788a8;font-size:16px}

/* ---- the wallet row -------------------------------------------------
   Apple Pay and PayPal side by side and equal height. The white border sits
   on a WRAPPER, never on the Apple Pay button: Safari draws that button as a
   system element and paints neither a border nor a shadow on it. When Apple
   Pay is unavailable the wrapper is hidden and PayPal takes the whole row. */
.wallets{display:flex;align-items:stretch;gap:8px;margin:18px 0 0;--wh:52px}
.wallet-ap{flex:1 1 62%;display:flex;height:var(--wh);background:#000;
  border:1px solid #fff;border-radius:12px;overflow:hidden}
.wallet-ap .apple-pay-btn{width:100%;height:100%;margin:0;border-radius:0;-apple-pay-button-style:black}
.wallet-pp{flex:1 1 38%;min-width:0;height:var(--wh);border-radius:12px;overflow:hidden;
  -webkit-mask-image:-webkit-radial-gradient(#fff,#000)}
.wallets.pp-only .wallet-pp{flex:1 1 100%}
.wallet-pp #paypalButtons{height:100%}
.wallet-note{margin:10px 0 0;text-align:center;font-size:12.5px;color:#93a9cf}

/* ---- the card, one click under the wallets ---- */
.card-link{display:block;width:100%;margin:14px 0 0;padding:14px 12px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.22);border-radius:12px;
  color:#dce7fb;font-family:"Assistant",Arial,sans-serif;font-size:15px;font-weight:700;
  cursor:pointer;transition:background .15s,border-color .15s}
.card-link:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.4)}
.card-link.open{background:none;border-color:transparent;color:#93a9cf;font-weight:600;padding-bottom:6px}
#cardPanel[hidden]{display:none}
#cardPanel .co-pay{margin-top:16px}
@keyframes hfshine{0%{background-position:-180px 0}100%{background-position:180px 0}}
.hf-box.loading{
  background-image:linear-gradient(90deg,rgba(255,255,255,.07) 0%,rgba(255,255,255,.18) 50%,rgba(255,255,255,.07) 100%);
  background-size:180px 100%;background-repeat:no-repeat;animation:hfshine 1.1s linear infinite;
}

/* order bumps: yellow dashed, green when ticked */
.bump{
  position:relative;display:flex;gap:12px;align-items:flex-start;
  border:2px dashed #ffcf5c;background:rgba(255,207,92,.07);
  border-radius:14px;padding:16px 16px 14px;margin:16px 0;cursor:pointer;
  transition:background .15s,border-color .15s;
}
.bump:hover{background:rgba(255,207,92,.12)}
.bump.checked{border-style:solid;background:rgba(86,255,160,.08);border-color:#56ffa0}
.bump input{margin-top:5px;width:20px;height:20px;accent-color:#56ffa0;flex:0 0 auto;cursor:pointer}
.bump .bump-title{font-weight:800;font-size:16px;line-height:1.45}
.bump .bump-rec{
  display:inline-block;background:#ffcf5c;color:#3a2a00;font-size:11px;font-weight:800;
  border-radius:6px;padding:2px 8px;margin-inline-start:6px;vertical-align:middle;
}
.bump .bump-price{font-size:14px;color:#ffd98a;font-weight:700;margin-top:4px}
.bump.checked .bump-price{color:#8dffbe}

.p2-total{
  border-top:1px solid rgba(255,255,255,.14);margin-top:20px;padding-top:16px;
  display:flex;justify-content:space-between;align-items:baseline;font-size:15px;color:#c9d8f5;
}
.p2-total #sumTotal{font-size:24px;font-weight:800;color:#fff;font-family:"Open Sans",Arial,sans-serif}

/* payment method segmented control */
.p2-seg{display:flex;gap:10px;margin:18px 0 14px}
.p2-m{
  flex:1;display:flex;align-items:center;justify-content:center;gap:6px;min-height:46px;padding:0 8px;
  border-radius:12px;cursor:pointer;text-align:center;
  font-weight:700;font-size:15px;color:#c9d8f5;font-family:inherit;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.18);
  transition:border-color .15s,background .15s,color .15s;
}
.p2-m.active{border-color:var(--neon-glow);background:rgba(74,222,128,.14);color:#fff}
.p2-m img{display:block}
.p2-cards{display:flex;gap:8px;justify-content:center;align-items:center;margin-top:12px;opacity:.9}
.p2-cards img{display:block;background:#fff;border-radius:4px;padding:3px 6px}

.co-pay{
  display:block;width:100%;margin-top:20px;border:none;cursor:pointer;
  font-family:"Open Sans","Assistant",Arial,sans-serif;font-weight:800;
  font-size:clamp(19px,3vw,24px);color:#fff;padding:19px 20px;border-radius:50px;
  background:linear-gradient(110deg,#15803d 25%,#22c55e 45%,#bbf7d0 50%,#22c55e 55%,#15803d 75%);
  background-size:200% 100%;animation:shimmer 2.4s linear infinite;
  box-shadow:0 8px 30px rgba(34,197,94,.55);
  transition:transform .18s ease;
}
.co-pay:hover{transform:translateY(-2px)}
.co-pay:disabled{opacity:.55;cursor:wait;transform:none}

/* NATIVE Apple Pay button, drawn by Safari in our own page */
.apple-pay-btn{
  display:block;width:100%;height:50px;border:none;border-radius:12px;cursor:pointer;
  -webkit-appearance:-apple-pay-button;appearance:-apple-pay-button;
  -apple-pay-button-type:buy;-apple-pay-button-style:white;
}
.apple-pay-btn:disabled{opacity:.55;cursor:default}
.or-div{display:flex;align-items:center;gap:10px;margin:16px 0 12px;color:#6f7d94;font-size:11.5px;letter-spacing:.06em;text-transform:uppercase}
.or-div::before,.or-div::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.12)}
.wallet-note{color:#7f8ba0;font-size:11.5px;text-align:center;margin-top:10px}
.wallet-hint{color:#ffb4b4;font-size:13px;text-align:center;margin:10px 0 0}

.co-error{
  display:none;background:rgba(255,80,80,.12);border:1px solid rgba(255,80,80,.5);
  color:#ffb4b4;border-radius:10px;padding:12px 14px;font-size:14px;margin-top:14px;text-align:center;
}
.co-error.show{display:block}
.pp-note{color:#9fb6dd;font-size:14px;text-align:center;padding:14px 0}
.pp-mock-btn{
  display:block;width:100%;padding:14px;border:none;border-radius:50px;cursor:pointer;
  font-family:inherit;font-weight:800;font-size:16px;color:#111;background:#ffc439;
}
#paypalPanel{margin-top:6px}

/* ---- footer disclaimer ---- */
.disclaimer{
  background:#f5f7fb;color:#5a6478;font-size:12.5px;line-height:1.6;
  text-align:center;padding:26px 18px;border-top:1px solid #e3e8f2;
}
.disclaimer strong{color:#3c4658}
.disclaimer nav{margin-top:12px;font-size:12px}
.disclaimer nav a{color:#c3ccda;color:#7c8798;text-decoration:none;margin:0 4px}
.disclaimer nav a:hover{text-decoration:underline}

@media (prefers-reduced-motion:reduce){
  .cta,.co-pay{animation:none}
  .cta-beat,.cta-timer .dot,.badge .dot{animation:none}
}


/* =====================================================================
   PAYMENT BLOCKS, ported from the reference funnel's /ai page.
   Replaces every CTA at runtime. Colours are the reference's, with the
   accent moved to green.
   ===================================================================== */
body.apay-mode .price-orig{display:none}      /* the block carries its own price */
.apay{max-width:400px;margin:0 auto;text-align:left;--pps:1;--apay-h:50px}
.apay-price{display:flex;align-items:baseline;justify-content:center;gap:11px;
  margin:0 0 12px;font-family:"Assistant",Arial,sans-serif;line-height:1}
.apay-price .ap-was{font-size:18px;font-weight:600;color:#8fa2c0;text-decoration:line-through;
  text-decoration-color:#ff6b6b;text-decoration-thickness:2px}
.apay-price .apay-total{font-size:28px;font-weight:800;color:#fff;letter-spacing:-.02em}
.apay .cta-timer{display:flex;width:max-content;max-width:100%;font-size:clamp(14.4px,2.65vw,17px);
  padding:6.8px 14.4px;border-radius:11px;border-width:1.6px;margin:0 auto 12px}
.apay .cta-timer b.t{min-width:53px}
.apay .cta-timer .dot{width:6.4px;height:6.4px}
.apay.on-light .cta-timer{color:#c81e1e;background:rgba(220,38,38,.08);border-color:#dc2626}
.apay.on-light .cta-timer b{color:#b91c1c}
.apay.on-light .cta-timer .dot{background:#dc2626}

/* the two add-ons, side by side in the hero */
.apay-bumps{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:11px 0 0}
.apay-bump{display:flex;flex-direction:column;gap:7px;margin:0;padding:9px 10px;
  border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);
  border-radius:11px;cursor:pointer;transition:border-color .15s,background .15s}
.apay-bump.checked{border-color:#4ade80;background:rgba(74,222,128,.1)}
.apay-bump .ab-top{display:flex;flex-wrap:nowrap;align-items:flex-start;gap:8px}
.apay-bump input{width:17px;height:17px;flex:0 0 auto;margin:1px 0 0;accent-color:#22c55e;cursor:pointer}
.apay-bump .ab-t{flex:1;min-width:0;font-size:11.5px;font-weight:600;line-height:1.32;color:#e8f0ff;overflow-wrap:anywhere}
.apay-bump .ab-p{align-self:flex-start;white-space:nowrap;font-size:13px;font-weight:800;color:#ffd98a}
.apay-bump.checked .ab-p{color:#86efac}

/* Apple Pay and PayPal on one row. The white border sits on a WRAPPER:
   Safari paints neither a border nor a shadow on the system button itself. */
.apay-row{display:flex;align-items:center;gap:8px}
.apay-ap-wrap{flex:1 1 auto;display:flex;height:var(--apay-h);background:#000;
  border:1px solid #fff;border-radius:11px;overflow:hidden}
.apay-row .apay-ap{width:100%;height:100%;margin:0;border-radius:0;-apple-pay-button-style:black}
.apay-pp{flex:0 0 35%;position:relative;height:var(--apay-h);overflow:hidden;border-radius:10px;
  -webkit-mask-image:-webkit-radial-gradient(#fff,#000)}
.apay-pp-in{position:absolute;top:0;left:0;width:150px;transform:scale(var(--pps));transform-origin:0 0}
.apay.no-pp .apay-pp{display:none}
/* no Apple Pay on this device: PayPal takes the row */
.apay.pp-only .apay-ap-wrap{display:none}
.apay.pp-only .apay-pp{flex:1 1 100%}
.apay.pp-only .apay-pp-in,.apay.pp-mock .apay-pp-in{position:static;width:100%;height:100%;transform:none}
/* the slot must carry the column's height down, or anything drawn in it
   (the mock button, a full-width PayPal) collapses to its own content */
.apay-pp-slot{height:100%}
.apay .pp-mock-btn{height:100%;padding:0;border-radius:10px}

.apay-card{display:block;margin:12px auto 0;padding:4px 6px;border:0;background:none;cursor:pointer;
  font-family:inherit;font-size:13.5px;font-weight:600;color:#86efac;
  text-decoration:underline;text-underline-offset:3px}
.apay-card:hover{color:#bbf7d0}
.apay.card-open .apay-card{display:none}
.apay.no-card .apay-card{display:none}
.apay-host{display:none}
.apay.card-open .apay-host{display:block}
.apay-err{display:none;margin-top:11px;padding:10px 12px;border-radius:10px;text-align:center;
  background:rgba(255,80,80,.12);border:1px solid rgba(255,80,80,.45);color:#ffb4b4;font-size:13px}
.apay-err.show{display:block}

/* every CTA that is NOT the hero: stacked, full-width buttons, bumps above */
.apay.stacked{--apay-h:52px;display:flex;flex-direction:column}
.apay.stacked .apay-price{order:1}
.apay.stacked .cta-timer{order:2}
.apay.stacked .apay-bumps{order:3}
.apay.stacked .apay-row{order:4}
.apay.stacked .apay-err{order:5}
.apay.stacked .apay-card{order:6}
.apay.stacked .apay-host{order:7}
.apay.stacked .apay-row{display:block}
.apay.stacked .apay-ap-wrap{display:flex;width:100%;height:var(--apay-h)}
.apay.stacked.pp-only .apay-ap-wrap{display:none}
.apay.stacked .apay-pp{flex:none;width:100%;height:var(--apay-h);margin-top:9px}
.apay.stacked.pp-only .apay-pp{margin-top:0}
.apay.stacked .apay-pp-in{position:static;width:100%;height:100%;transform:none}
.apay.stacked .apay-bumps{display:block;margin:0 0 13px}
.apay.stacked .apay-bump{flex-direction:row;align-items:center;gap:10px;margin:8px 0;padding:11px 13px}
.apay.stacked .apay-bump .ab-top{flex:1;min-width:0;align-items:center}
.apay.stacked .apay-bump input{margin:0}
.apay.stacked .apay-bump .ab-t{font-size:13px}
.apay.stacked .apay-bump .ab-p{align-self:center;font-size:13.5px}

/* the same block on the white sections */
.apay.on-light .apay-bump{border-color:#e2e7f0;background:#fff;box-shadow:0 1px 2px rgba(16,24,40,.05)}
.apay.on-light .apay-bump.checked{border-color:#16a34a;background:rgba(22,163,74,.07)}
.apay.on-light .apay-bump input{accent-color:#16a34a}
.apay.on-light .apay-bump .ab-t{color:#101828}
.apay.on-light .apay-bump .ab-p{color:#b45309}
.apay.on-light .apay-bump.checked .ab-p{color:#16a34a}
.apay.on-light .apay-card{color:#15803d}
.apay.on-light .apay-price .ap-was{color:#98a2b3}
.apay.on-light .apay-price .apay-total{color:#101828}
.apay.on-light .apay-err{background:rgba(220,38,38,.07);border-color:rgba(220,38,38,.4);color:#b91c1c}

/* the one card form, once moved into a block: compact, three fields on a line.
   It keeps a dark panel even on white sections because Tranzila's fields are
   mounted once with one text colour. */
.apay-host #checkoutForm{max-width:none;margin:13px 0 0;padding:13px;border-radius:14px;
  background:#0f1522;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 24px rgba(0,0,0,.22)}
.apay-host #bump1Label,.apay-host #bump2Label,.apay-host #wallets,.apay-host #walletNote,
.apay-host #walletHint,.apay-host #cardLink,.apay-host .p2-hint,.apay-host .p2-cards,
.apay-host .p2-total,.apay-host .secure-line{display:none !important}
.apay-host .p2-field{margin-bottom:7px}
.apay-host .p2-field input{padding:11px 13px;border-radius:11px}
.apay-host .hf-box{height:42px;border-radius:11px}
.apay-host #cardPanel{display:flex;flex-wrap:wrap;gap:7px}
.apay-host #cardPanel[hidden]{display:none}
.apay-host #cardPanel .p2-row{display:contents}
.apay-host #cardPanel .p2-field{margin:0}
.apay-host #cardPanel > .p2-field{flex:1 1 44%;min-width:122px}
.apay-host #cardPanel .p2-row .p2-field:nth-child(1){flex:1 1 25%;min-width:68px}
.apay-host #cardPanel .p2-row .p2-field:nth-child(2){flex:1 1 22%;min-width:58px}
@media(max-width:360px){
  .apay-host #cardPanel > .p2-field{flex:1 1 100%}
  .apay-host #cardPanel .p2-row .p2-field:nth-child(1),
  .apay-host #cardPanel .p2-row .p2-field:nth-child(2){flex:1 1 45%}
}
.apay-host .co-pay{flex:1 1 100%;margin-top:9px;padding:13px 16px;font-size:16.5px;border-radius:13px;
  box-shadow:0 6px 18px rgba(34,197,94,.35)}
.apay-host .co-error{margin-top:10px}

/* ---- "it went viral on TikTok": three posts, the middle one forward ----
   The side cards turn in toward the centre and tuck behind it, so the row
   reads as one object with depth rather than three flat pictures. */
.tt-lede{text-align:center;font-size:19px;font-weight:700;line-height:1.45;margin:26px auto 4px;max-width:560px}
.tt-trio{display:flex;justify-content:center;align-items:center;perspective:1200px;
  max-width:640px;margin:26px auto 10px;padding:18px 0 22px}
.tt-card{position:relative;margin:0;flex:0 0 auto;aspect-ratio:9/16;border-radius:18px;overflow:hidden;
  background:#000;border:3px solid #0d0d0d;box-shadow:0 18px 40px rgba(16,24,40,.26)}
.tt-card{aspect-ratio:10/16}
.tt-card img{display:block;width:100%;height:100%;object-fit:cover;object-position:center top}
.tt-card.side{width:31%;z-index:1;filter:saturate(.92)}
.tt-card.left{margin-right:-5%;transform:rotateY(24deg) scale(.9);transform-origin:right center}
.tt-card.right{margin-left:-5%;transform:rotateY(-24deg) scale(.9);transform-origin:left center}
/* the middle post is the widest, and its caption sits on the left: keep that edge */
.tt-card.center img{object-position:left top}
.tt-card.center{width:40%;z-index:2;transform:translateY(-16px);
  box-shadow:0 28px 60px rgba(16,24,40,.38),0 0 0 1px rgba(22,163,74,.25)}
@media(max-width:560px){
  .tt-lede{font-size:17px}
  .tt-trio{padding:14px 0 16px}
  .tt-card{border-radius:13px;border-width:2px}
  .tt-card.center{transform:translateY(-10px)}
}

/* ---- results: before/after photos in a masonry grid ----
   CSS columns keep each photo at its own shape, so a tall collage and a
   square one sit together without anything being cropped. */
.res-grid{column-count:2;column-gap:12px;margin:26px 0 8px}
@media(min-width:700px){.res-grid{column-count:3;column-gap:14px}}
.res-card{break-inside:avoid;margin:0 0 12px;border-radius:14px;overflow:hidden;background:#f2f4f7;
  box-shadow:0 6px 18px rgba(16,24,40,.12);border:1px solid #e6e9ee}
.res-card img{display:block;width:100%;height:auto}
.res-note{margin:6px auto 0;max-width:620px;text-align:center;font-size:12px;line-height:1.55;color:#6b7280}

/* ---- weight loss progress: the dashboard average, weeks 1 to 12 ----
   One card: the big 12.7 kg, then 12 bars (cumulative kg lost per week).
   Bars grow and the number counts up once the card is in view (.wl.on,
   set by the script under the section). --neon paints it, so the pink
   theme turns it rose on its own. */
.wl{margin:64px calc(50% - 50vw) 56px;padding:52px 22px 56px;background:#fff}
.wl-h{max-width:716px;margin-left:auto;margin-right:auto}
.body h2.wl-h{margin:0 auto 24px;max-width:600px}
.wl-card{margin:8px auto 0;max-width:716px;padding:26px 18px 20px;border-radius:22px;background:#fff;border:1px solid #e6e9ee;box-shadow:0 10px 30px rgba(16,24,40,.08)}
@media(min-width:560px){.wl-card{padding:30px 28px 24px}}
.wl-top{display:flex;align-items:flex-end;justify-content:center;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.wl-big{font-family:"Open Sans","Assistant",Arial,sans-serif;font-weight:800;line-height:1;color:var(--neon);letter-spacing:-.02em;display:flex;align-items:baseline;gap:6px}
.wl-num{font-size:clamp(56px,11vw,78px);font-variant-numeric:tabular-nums;min-width:2.6ch;text-align:right}
.wl-unit{font-size:clamp(22px,4vw,30px)}
.wl-meta{display:flex;flex-direction:column;gap:2px;padding-bottom:9px;text-align:left}
.wl-meta b{font-size:17px;font-weight:800;color:#111;line-height:1.3}
.wl-meta span{font-size:14px;color:#5b6675;line-height:1.3}
.wl-bars{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(12,1fr);gap:4px;height:190px;align-items:end}
@media(min-width:560px){.wl-bars{gap:9px;height:230px}}
.wl-bars li{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;min-width:0}
.wl-v{font-size:10px;font-weight:800;color:#111;line-height:1;margin-bottom:5px;letter-spacing:-.02em;white-space:nowrap;font-variant-numeric:tabular-nums;
  opacity:0;transform:translateY(5px);transition:opacity .45s ease,transform .45s ease;transition-delay:calc(var(--i) * 70ms + .5s)}
@media(min-width:560px){.wl-v{font-size:12px}}
.wl-bar{display:block;width:100%;height:var(--h);border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,var(--neon-glow),var(--neon));
  transform:scaleY(0);transform-origin:bottom;transition:transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:calc(var(--i) * 70ms)}
.wl-bars li:last-child .wl-bar{background:linear-gradient(180deg,var(--neon),#15803d)}
.wl-bars li:last-child .wl-v{font-size:11.5px}
@media(min-width:560px){.wl-bars li:last-child .wl-v{font-size:13.5px}}
.wl-w{font-size:10px;font-weight:700;letter-spacing:.02em;color:#8a8f98;margin-top:7px;line-height:1}
@media(min-width:560px){.wl-w{font-size:11.5px}}
.wl.on .wl-bar{transform:scaleY(1)}
.wl.on .wl-v{opacity:1;transform:none}
.body p.wl-note{margin:16px auto 0;max-width:520px;text-align:center;font-size:12px;line-height:1.55;color:#6b7280}
@media (prefers-reduced-motion:reduce){.wl-bar,.wl-v{transition:none;transform:none;opacity:1}}

/* ---- story GIF ---- */
.story-gif{margin:40px auto;max-width:280px}
.story-gif img{display:block;width:100%;height:auto;border-radius:14px}

/* ---- R1 to R3, plain ---- */
.body h3.step{margin:48px 0 10px}
.body h3.step span{color:var(--neon)}

/* ---- old way vs R3, a plain checklist ---- */
.checks{max-width:600px;margin:36px auto}
.checks p{margin:0 0 30px !important;line-height:1.7}
.checks p:last-child{margin-bottom:0 !important}

/* ---- R1 to R3 blocks: white, a thin line, a soft shadow ---- */
.rblocks{display:grid;gap:18px;margin:40px 0}
@media (min-width:720px){.rblocks{grid-template-columns:repeat(3,1fr)}}
.rblock{background:#fff;border:1px solid #e6e6e6;border-radius:18px;padding:26px 22px;box-shadow:0 6px 22px rgba(0,0,0,.06);text-align:center}
.rblock .rk{display:inline-block;background:var(--neon);color:#fff;font-weight:800;font-size:14px;letter-spacing:.5px;border-radius:999px;padding:4px 14px}
.rblock h4{font-family:"Open Sans",Arial,sans-serif;font-size:22px;font-weight:800;margin:12px 0 10px}
.rblock p{font-size:16.5px !important;line-height:1.65;margin:0 !important;color:#222}

/* "I'm proud to present..." then two lines of air before the method */
.body p.present{font-weight:800;margin-top:43px;margin-bottom:69px}

/* ---- before / after auto slider ---- */
.bslide-title{margin-top:40px !important}
.hl-green{color:var(--neon)}
.bslide{max-width:320px;margin:24px auto 40px}
.bslide-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;border-radius:18px;scrollbar-width:none;box-shadow:0 8px 26px rgba(0,0,0,.10)}
.bslide-track::-webkit-scrollbar{display:none}
.bslide-item{flex:0 0 100%;margin:0;scroll-snap-align:center;aspect-ratio:1/1;background:#fff}
.bslide-item img{width:100%;height:100%;object-fit:cover;display:block}
.bslide-dots{display:flex;justify-content:center;gap:7px;margin-top:14px}
.bslide-dots span{width:7px;height:7px;border-radius:50%;background:#d6d6d6;transition:background .2s,width .2s}
.bslide-dots span.on{background:var(--neon);width:18px;border-radius:4px}

/* ---- sizes and centering ---- */
.body .bslide-title{font-size:23.8px}
.body .tt-lede{margin:26px auto 4px}

/* ---- simple tables: white, thin lines, no grey fills ---- */
.ptable{width:100%;border-collapse:collapse;margin:32px 0;font-size:16.5px;line-height:1.55}
.ptable th{text-align:left;font-size:13px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;padding:0 12px 12px;border-bottom:2px solid #111}
.ptable td{padding:18px 12px;border-bottom:1px solid #e5e5e5;vertical-align:top}
.ptable td:first-child{font-weight:800;white-space:nowrap;width:1%}
.ptable .g{color:var(--neon)}
.vs-table td:first-child{white-space:normal;width:42%;font-weight:400;color:#666}
@media (max-width:480px){
  .ptable{font-size:15.5px}
  .ptable td{padding:16px 8px}
  .ptable th{padding:0 8px 10px}
}

/* ---- the method: 3 signals, one picture and a few words each ----
   A row is a 4:5 photo and a short centred text block. Hairlines between
   the rows, no cards. On a phone the photo sits above the text at 60% of
   the column; from 720px photo and text share the row and the photo
   changes side on every second row. */
.sigs{max-width:760px;margin:28px auto 0}
.sig{display:grid;gap:18px;justify-items:center;padding:34px 0;border-top:1px solid #e5e5e5}
.sig:last-child{border-bottom:1px solid #e5e5e5}
.sig-img{margin:0;width:60%;max-width:260px}
.sig-img img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:center 40%;border-radius:16px;border:1px solid #111}
.sig-img.sig-grid{width:76%;max-width:300px}
.sig-img.sig-grid img{aspect-ratio:1/1;object-position:center}
.sig-txt{text-align:center;max-width:340px}
.body .sig-txt p{margin:0}
.body .sig-told{font-size:17px;font-weight:600;color:#5b6675;line-height:1.5}
.sig-told s{text-decoration-color:#dc2626;text-decoration-thickness:2px}
.body .sig-does{font-family:"Open Sans","Assistant",Arial,sans-serif;font-weight:800;font-size:clamp(19px,2.8vw,22px);line-height:1.3;color:#111;margin:4px 0 8px}
.body .sig-why{font-size:16px;line-height:1.5;color:#444}
.body .sig-note{font-size:13px;color:#8a8f98;line-height:1.5;margin-top:10px}
@media (min-width:720px){
  .sig{grid-template-columns:1fr 1fr;align-items:center;gap:24px;padding:38px 0}
  .sig-img{width:auto;max-width:280px}
  .sig-img.sig-grid{max-width:300px}
  .sig:nth-child(even) .sig-img{order:2}
}
/* the closing heading of the method: 15% over the old closing line */
.body h3.switch-line{text-align:center;font-family:"Open Sans",Arial,sans-serif;font-weight:800;font-size:clamp(19.5px,3.15vw,23.5px);line-height:1.3;margin:64px auto 0;max-width:560px}

/* ---- old way vs R3: a closed table ---- */
.boxtable{width:100%;border-collapse:separate;border-spacing:0;border:2px solid #111;border-radius:16px;overflow:hidden;margin:32px 0;font-size:16.5px;line-height:1.5}
.boxtable th{padding:14px 16px;font-size:14px;font-weight:800;text-align:left;border-bottom:2px solid #111}
.boxtable th + th,.boxtable td + td{border-left:1px solid #d9d9d9}
.boxtable td{padding:16px;border-bottom:1px solid #e5e5e5;vertical-align:top}
.boxtable tr:last-child td{border-bottom:0}
.boxtable td:first-child{color:#777}
.boxtable td:last-child{font-weight:700;color:#111}
@media (max-width:480px){.boxtable{font-size:15px}.boxtable th,.boxtable td{padding:13px 11px}}

/* the hot mom line gets a line of air above */
.body .quote.hotmom{margin-top:112px}

/* ---- the plan days: a clean stepper ---- */
.wsteps{list-style:none;padding:0;margin:40px auto;max-width:560px}
.wsteps li{display:flex;gap:20px;align-items:flex-start;position:relative;padding-bottom:36px}
.wsteps li:last-child{padding-bottom:0}
.wsteps li:not(:last-child)::after{content:"";position:absolute;left:21px;top:48px;bottom:8px;width:2px;background:#e3e6e3}
.wsteps-n{flex:0 0 44px;height:44px;border-radius:50%;border:2px solid var(--neon);color:var(--neon);font-weight:800;font-size:17px;display:flex;align-items:center;justify-content:center;background:#fff}
.wsteps-w{display:block;font-size:13px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;margin:2px 0 6px}
.wsteps p{font-size:17.5px !important;margin:0 !important;line-height:1.6;font-weight:600}

/* ---- the plan day by day, with the progress photo beside each ---- */
.dsteps li{align-items:center;padding-bottom:30px}
.dsteps li:not(:last-child)::after{top:50%;bottom:-50%;height:auto}
.dsteps .wsteps-n{font-size:15px}
.dsteps-txt{flex:1;min-width:0}
.dsteps-img{flex:0 0 auto;width:112px;aspect-ratio:1/2;height:auto;object-fit:cover;object-position:center 38%;border-radius:14px;box-shadow:0 6px 18px rgba(0,0,0,.10)}
@media (min-width:640px){.dsteps-img{width:150px}}

/* ---- free gift: Bloomplate 500 (hero pill, the gift section, the stack row) ---- */
.gift-pill{
  display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;
  margin:26px auto 0;padding:8px 16px 8px 8px;border-radius:999px;
  background:rgba(34,197,94,.12);border:1.5px solid rgba(74,222,128,.55);
  color:#eafff1;font-size:clamp(14px,2.2vw,17px);font-weight:600;text-decoration:none;max-width:100%;
}
.gift-pill b{font-weight:800;color:#fff}
.gift-pill-k{
  background:var(--neon);color:#04210f;font-weight:800;font-size:12px;letter-spacing:.12em;
  text-transform:uppercase;padding:4px 10px;border-radius:999px;
}
.gift-pill:hover{background:rgba(34,197,94,.2)}

.gift{
  margin:72px -22px 0;padding:44px 22px 40px;
  background:#f3fbf5;border-top:2px solid var(--neon);border-bottom:2px solid var(--neon);
  text-align:center;
}
@media (min-width:804px){.gift{margin-inline:0;border:2px solid var(--neon);border-radius:18px;padding:48px 34px 44px}}
.gift-k{
  display:inline-block;background:#111;color:#fff;font-size:12.5px;font-weight:800;letter-spacing:.14em;
  text-transform:uppercase;padding:6px 14px;border-radius:999px;
}
.body .gift h2{margin:18px 0 14px}
.gift h2 .hl{color:#15803d}
.body .gift .gift-lede{max-width:600px;margin:0 auto 22px;font-size:18px}
.gift-points{list-style:none;max-width:560px;margin:0 auto;text-align:left}
.gift-points li{position:relative;padding-left:30px;margin:12px 0;font-size:17px;line-height:1.55}
.gift-points li::before{
  content:"";position:absolute;left:4px;top:.35em;width:14px;height:8px;
  border-left:3px solid #16a34a;border-bottom:3px solid #16a34a;transform:rotate(-45deg);
}
.body .gift .gift-taste{
  margin:34px 0 14px;font-family:"Open Sans","Assistant",Arial,sans-serif;
  font-size:clamp(20px,3.2vw,24px);font-weight:800;font-style:italic;
}
.taste-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (min-width:900px){
  .body .gift{margin-inline:calc((716px - min(1060px, 100vw - 44px)) / 2)}
  .taste-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
}
.taste-card{position:relative;margin:0;background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.taste-card img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}
.taste-card .kcal{
  position:absolute;left:8px;top:8px;background:rgba(0,0,0,.78);color:#fff;
  font-size:12px;font-weight:700;line-height:1.2;padding:5px 9px;border-radius:999px;max-width:calc(100% - 16px);
}
.taste-card figcaption{padding:9px 10px 11px;font-size:14.5px;font-weight:700;line-height:1.3;text-align:left}
.body .gift .gift-note{margin:18px auto 6px;max-width:600px;font-size:13.5px;color:#5b6675;line-height:1.55}
.gift-note a{color:inherit}
.stack .item.gift-item{background:#f3fbf5}
.stack .item.gift-item b{color:#15803d}
.checkout .co-gift{text-align:center;color:#86efac;font-size:15px;margin:-22px 0 28px}
.checkout .co-gift b{color:#fff}

/* =====================================================================
   2026-09 trim: the hero gift strip, the tighter body, the recipe gift
   ===================================================================== */

/* hero: one thin line under the trust pills. A glossy FREE ribbon across
   its top-left corner, five dishes, the label, then +495 on the right. */
.gift-strip{
  position:relative;overflow:hidden;
  display:inline-flex;align-items:center;gap:12px;flex-wrap:nowrap;max-width:100%;
  margin:14px auto 0;padding:6px 6px 6px 40px;border-radius:13px;
  background:rgba(34,197,94,.1);border:1px solid rgba(74,222,128,.45);
  color:#eafff1;font-size:14.5px;font-weight:600;line-height:1;text-decoration:none;white-space:nowrap;
}
.gift-strip:hover{background:rgba(34,197,94,.18)}
.gs-ribbon{
  position:absolute;top:10px;left:-22px;width:78px;transform:rotate(-45deg);overflow:hidden;
  padding:3px 0;text-align:center;font-size:8.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:#04210f;background:linear-gradient(180deg,#bbf7d0 0%,#4ade80 45%,#16a34a 100%);
  box-shadow:0 1px 3px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.7);
}
.gs-ribbon::after{
  content:"";position:absolute;top:0;bottom:0;left:-60%;width:45%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.85),transparent);
  transform:skewX(-20deg);animation:gsSheen 4.5s ease-in-out infinite;
}
@keyframes gsSheen{0%,70%{left:-60%}90%,100%{left:130%}}
.gs-thumbs{display:inline-flex;flex:0 0 auto}
.gs-thumbs img{width:29px;height:29px;border-radius:50%;object-fit:cover;border:2px solid #0b1a10;display:block}
.gs-thumbs img + img{margin-left:-8px}
.gs-txt b{color:#4ade80;font-weight:800}
/* the last thumb: a darkened recipe photo with the count on it, in white */
.gs-more{position:relative;display:block;flex:0 0 auto;width:29px;height:29px;margin-left:-8px;border-radius:50%;overflow:hidden;border:2px solid #0b1a10;background:#000}
.gs-more img{width:100%;height:100%;object-fit:cover;filter:brightness(.42);border:0;margin:0;border-radius:0}
.gs-more b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:800;font-size:9px;letter-spacing:0;line-height:1}
.gs-thumbs .gs-more img{margin-left:0}
@media (max-width:360px){.gift-strip{font-size:12px;gap:6px}.gs-thumbs img,.gs-more{width:22px;height:22px}.gs-more b{font-size:7px}}
@media (prefers-reduced-motion:reduce){.gs-ribbon::after{animation:none;display:none}}
.hero{padding-bottom:44px}

/* PayPal: the slot keeps its height and shows a soft placeholder until the
   SDK draws into it, so nothing moves when the button arrives */
.apay-pp:has(.apay-pp-slot:empty),#paypalButtons:empty{border-radius:10px;
  background:linear-gradient(90deg,rgba(255,196,57,.22) 0%,rgba(255,196,57,.42) 50%,rgba(255,196,57,.22) 100%);
  background-size:200% 100%;animation:ppWait 1.2s linear infinite}
#paypalButtons:empty{min-height:48px}
@keyframes ppWait{0%{background-position:100% 0}100%{background-position:-100% 0}}
@media (prefers-reduced-motion:reduce){.apay-pp:has(.apay-pp-slot:empty),#paypalButtons:empty{animation:none}}

/* hero bumps: the price sits on the title row, no line of its own */
.apay-bump{flex-direction:row;align-items:center;gap:8px;padding:8px 10px}
.apay-bump .ab-top{flex:1;min-width:0;align-items:center}
.apay-bump input{margin:0}
.apay-bump .ab-p{align-self:center}

/* classic checkout bumps: title left, +$9 right, one row */
.bump{align-items:center;padding:12px 14px;margin:12px 0}
.bump input{margin-top:0}
.bump .bump-title{flex:1;min-width:0;font-size:15px;line-height:1.4}
.bump .bump-price{flex:0 0 auto;margin:0;font-size:16px;font-weight:800;white-space:nowrap}

/* "You are not doing it wrong" sits closer to the hero */
.body{padding-top:30px}
.body h2.first-h{margin-top:0}

/* a little more air above the TikTok line */
.body .tt-lede{margin:48px auto 4px}

/* the hot mom quote wraps into a narrower block on a phone */
@media (max-width:640px){.body .quote.hotmom{max-width:300px;margin-left:auto;margin-right:auto}}

/* results: four photos, two columns everywhere */
.res-grid{column-count:2}
@media(min-width:700px){.res-grid{column-count:2}}

/* the recipe gift: one headline, the price, one line, the photos */
.body .gift h2{margin:0 0 10px}
.body .gift .gift-price{margin:0 0 10px;font-family:"Open Sans","Assistant",Arial,sans-serif;font-size:26px;line-height:1.2}
.gift-price s{color:#8a8f98;font-weight:700;text-decoration-color:#dc2626;text-decoration-thickness:2px;margin-inline-end:8px}
.gift-price b{color:#15803d;font-weight:800;letter-spacing:.02em}
.body .gift .gift-lede{margin:0 auto 24px;font-size:17px}
@media (min-width:900px){.taste-grid{grid-template-columns:repeat(7,minmax(0,1fr));gap:12px}
  .taste-card figcaption{font-size:13px}
  .taste-card .kcal{font-size:11px;padding:4px 7px}}

/* the FAQ lost its subtitle */
.faq-section{padding:64px 24px 72px}
.faq-section h2{margin-bottom:6px}

/* the recipe grid: three across on a phone, the kcal pill shortened there
   (the note under the grid says the figures are per serving) */
.taste-card .kcal .ps{font-style:normal}
@media (max-width:899px){
  .taste-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  .taste-card{border-radius:10px}
  .taste-card .kcal{left:5px;top:5px;font-size:10.5px;padding:3px 7px}
  .taste-card .kcal .ps{display:none}
  .taste-card figcaption{padding:6px 7px 8px;font-size:12px;line-height:1.25}
}
@media (min-width:600px) and (max-width:899px){.taste-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* less dead air between the story beats */
.body .quote{margin:56px 0 36px}
.body .quote.hotmom{margin-top:64px}
.body p.present{margin-top:32px;margin-bottom:40px}
.body .kicker{margin-top:48px !important}
@media (max-width:899px){
  .taste-grid{display:flex;flex-wrap:wrap;justify-content:center}
  .taste-card{flex:0 0 calc((100% - 16px) / 3)}
}
@media (min-width:600px) and (max-width:899px){.taste-card{flex-basis:calc((100% - 24px) / 4)}}
.taste-card .kcal .ps{display:none}

/* =====================================================================
   PINK PREVIEW THEME. Only on when the URL carries ?theme=pink: a head
   script puts .theme-pink on <html> before first paint. Without it none
   of this matches and the page is the live one, unchanged.
   Soft, muted rose from the pink hero. No neon, no hot pink, a faint glow
   on the hero frame only. PayPal and Apple Pay keep their own looks.
     --rose       #e8a0bf  accent on dark
     --rose-2     #d98bb0  borders, fills
     --rose-ink   #a3456d  accent text on light (5.3:1 on blush)
     --rose-deep  #9e4670  button base (white text 5.9:1)
     --plum       #1a0f16  hero
     --plum-2     #150b12  checkout
     --blush      #fdf3f7  light sections
   ===================================================================== */
.theme-pink{
  --neon:#d98bb0;--neon-glow:#e8a0bf;
  --rose:#e8a0bf;--rose-2:#d98bb0;--rose-ink:#a3456d;--rose-deep:#9e4670;--rose-mid:#b85c86;
  --plum:#1a0f16;--plum-2:#150b12;--plum-3:#241620;--blush:#fdf3f7;--blush-2:#fbe9f1;
  --mute-on-dark:#c9b3bf;
}
.theme-pink body{background:#fffafc}

/* hero */
.theme-pink .badge{color:#f7e6ee;border-color:rgba(232,160,191,.6);box-shadow:0 4px 18px rgba(217,139,176,.12),inset 0 1px 0 rgba(255,255,255,.08)}
.theme-pink .hero h1 .hl{color:var(--rose)}
.theme-pink .neon-frame{
  border:1.5px solid rgba(240,170,205,.95);background:#12090f;
  box-shadow:0 0 6px rgba(240,170,205,.55),0 0 18px rgba(232,140,190,.40),0 0 38px rgba(232,140,190,.22),0 10px 30px rgba(0,0,0,.35);
}
.theme-pink .trust-chips span{border-color:rgba(232,160,191,.35);color:#f1dde6}
.theme-pink .trust-chips svg{color:var(--rose)}
.theme-pink .secure-line{color:var(--mute-on-dark)}

/* buttons: a muted rose shimmer, soft shadow */
.theme-pink .cta,.theme-pink .co-pay{
  background:linear-gradient(110deg,var(--rose-deep) 25%,var(--rose-mid) 45%,#dfa3bf 50%,var(--rose-mid) 55%,var(--rose-deep) 75%);
  background-size:200% 100%;
  box-shadow:0 8px 24px rgba(158,70,112,.35);
}
.theme-pink .cta:hover{box-shadow:0 12px 30px rgba(158,70,112,.45)}
.theme-pink .cta .cta-beat,.theme-pink .co-pay{text-shadow:0 1px 2px rgba(60,10,35,.35)}
.theme-pink .apay-host .co-pay{box-shadow:0 6px 16px rgba(158,70,112,.3)}

/* hero gift strip */
.theme-pink .gift-strip{background:rgba(232,160,191,.1);border-color:rgba(232,160,191,.45);color:#f7e6ee}
.theme-pink .gift-strip:hover{background:rgba(232,160,191,.17)}
.theme-pink .gs-ribbon{color:#3a1328;background:linear-gradient(180deg,#f6d7e5 0%,#e8a0bf 50%,#c97a9f 100%);
  box-shadow:0 1px 3px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.55)}
.theme-pink .gs-ribbon::after{background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent)}
.theme-pink .gs-thumbs img{border-color:#000}
.theme-pink .gs-txt b{color:var(--rose)}
.theme-pink .gs-more{border-color:#000}

/* white body: accents in the deeper rose so they stay readable */
.theme-pink .hl-green,.theme-pink .gift h2 .hl,
.theme-pink .gift-price b,.theme-pink .stack .item.gift-item b,.theme-pink .body h3.step span,
.theme-pink .job .jk,.theme-pink .compare .c.new .lbl,.theme-pink .fork .opt.two .n,.theme-pink .ptable .g{color:var(--rose-ink)}
.theme-pink .wsteps-n{border-color:var(--rose-2);color:var(--rose-ink);background:#fff}
.theme-pink .wsteps li:not(:last-child)::after{background:#f1d9e4}
.theme-pink .bslide-dots span{background:#ecd3de}
.theme-pink .bslide-dots span.on{background:var(--rose-2)}
.theme-pink .sig,.theme-pink .sig:last-child{border-color:#f0d8e3}
.theme-pink .sig-img img{border-color:var(--rose)}
.theme-pink .reveal-rule{border-top-color:#e8c9d6}
.theme-pink .tt-card.center{box-shadow:0 28px 60px rgba(40,10,25,.32),0 0 0 1px rgba(217,139,176,.35)}
.theme-pink .rblock .rk{background:var(--rose-deep)}
.theme-pink .wl-big{color:var(--rose-ink)}
.theme-pink .wl-bar{background:linear-gradient(180deg,#f2c4d8,var(--rose-2))}
.theme-pink .wl-bars li:last-child .wl-bar{background:linear-gradient(180deg,var(--rose-2),var(--rose-deep))}
.theme-pink .wl-v{color:#3f2c37}

/* the recipe gift */
.theme-pink .gift{background:var(--blush);border-color:var(--rose-2)}
.theme-pink .gift-points li::before{border-color:var(--rose-ink)}
.theme-pink .stack .item.gift-item{background:var(--blush)}

/* FAQ and footer */
.theme-pink .faq-section{background:var(--blush)}
.theme-pink .faq-item{border-color:#3a1f2e}
.theme-pink .disclaimer{background:#fbf1f5;border-top-color:#f0dde6;color:#5e4a55}
.theme-pink .disclaimer strong{color:#3f2c37}
.theme-pink .disclaimer nav a{color:#7d6571}

/* checkout (deep plum) */
.theme-pink .checkout .co-sub,.theme-pink .p2-hint{color:var(--mute-on-dark)}
.theme-pink .checkout .co-gift{color:var(--rose)}
.theme-pink .co-card{border-color:rgba(232,160,191,.3);box-shadow:0 0 30px rgba(217,139,176,.08)}
.theme-pink .p2-field input::placeholder{color:#a58c99}
.theme-pink .p2-total{color:#ecd9e2}
.theme-pink .card-link{color:#f1dde6}
.theme-pink .card-link.open,.theme-pink .wallet-note{color:#b59aa8}
.theme-pink .bump.checked{background:rgba(232,160,191,.09);border-color:var(--rose)}
.theme-pink .bump input{accent-color:var(--rose-2)}
.theme-pink .bump.checked .bump-price{color:var(--rose)}
.theme-pink .p2-m.active{background:rgba(232,160,191,.14)}

/* the payment blocks that replace every CTA */
.theme-pink .apay-price .ap-was{color:#b59aa8}
.theme-pink .apay-bump.checked{border-color:var(--rose);background:rgba(232,160,191,.1)}
.theme-pink .apay-bump input{accent-color:var(--rose-2)}
.theme-pink .apay-bump .ab-t{color:#f7e6ee}
.theme-pink .apay-bump.checked .ab-p{color:var(--rose)}
.theme-pink .apay-card{color:var(--rose)}
.theme-pink .apay-card:hover{color:#f6d7e5}
.theme-pink .apay.on-light .apay-bump{border-color:#efd9e3}
.theme-pink .apay.on-light .apay-bump.checked{border-color:var(--rose-ink);background:rgba(163,69,109,.06)}
.theme-pink .apay.on-light .apay-bump input{accent-color:var(--rose-ink)}
.theme-pink .apay.on-light .apay-bump .ab-t{color:#101828}
.theme-pink .apay.on-light .apay-bump.checked .ab-p,.theme-pink .apay.on-light .apay-card{color:var(--rose-ink)}
.theme-pink .apay-host #checkoutForm{border-color:rgba(232,160,191,.14)}

/* R3 Coach AI: the kit thinking orb beside a short spec list (shared with the other packs' short pages) */
/* the AI: the thinking orb beside a short spec list */
.ln-ai{display:flex;gap:16px;align-items:center;border:1.5px solid #111;border-radius:16px;padding:16px 14px}
.ln-orb{flex:0 0 auto;width:110px;height:110px;display:flex;align-items:center;justify-content:center}
.ln-orb:empty::before{content:"";width:74px;height:74px;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--neon-glow) 0,var(--neon) 55%,#111 100%);opacity:.8;animation:lnPulse 1.6s ease-in-out infinite}
@keyframes lnPulse{0%,100%{transform:scale(.86);opacity:.55}50%{transform:scale(1);opacity:.9}}
@media (prefers-reduced-motion:reduce){.ln-orb:empty::before{animation:none}}
.ln-ai h3{text-align:left !important;font-size:18px !important;margin:0 0 6px !important;line-height:1.25}
.ln-ai ul{list-style:none;margin:0;padding:0}
.ln-ai li{font-size:14px;line-height:1.4;margin:0 0 5px;padding-left:16px;position:relative}
.ln-ai li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;border-radius:50%;background:var(--neon)}
.ln-ai .fine{font-size:12px;color:#666;margin:6px 0 0;line-height:1.4}
@media (max-width:370px){.ln-orb{width:88px;height:88px}}
.body .r3-ai{margin:56px 0 0}
.body .r3-ai p.fine{font-size:12px;margin:6px 0 0;text-align:left}

/* Amy, before and after */
.amy{margin:56px auto 0;max-width:560px;text-align:center}
.body .amy-k{font-family:"Open Sans","Assistant",Arial,sans-serif;font-weight:800;font-size:clamp(22px,3.4vw,26px);line-height:1.2;margin:0 0 4px}
.body .amy-sub{font-size:15px;color:#5b6675;margin:0 0 16px}
.amy-pair{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.amy-pair figure{margin:0}
.amy-pair img{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover;border-radius:12px;border:1.5px solid #111}
.amy-pair figcaption{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-top:6px;color:#5b6675}
.body .amy-line{font-size:16px;font-weight:400;color:#5b6675;margin:14px 0 0}
.theme-pink .amy-pair img{border-color:var(--rose,#e8a0bf)}

/* the TikTok line, a quarter bigger; "I'm proud to present..." now sits
   under the three posts and leads straight into the method kicker */
.body .tt-lede{font-size:23.75px;max-width:600px;margin:80px auto 40px}
@media(max-width:560px){.body .tt-lede{font-size:21.25px}}
.body p.present{margin-top:44px;margin-bottom:40px}
.body p.present + .kicker{margin-top:40px !important}

/* hero: the small note under the headline */
.hero .h1-note{font-size:15.5px;font-style:italic;font-weight:400;color:#aab4c3;margin:8px 0 0;line-height:1.4}
.hero .h1-note + .sub{margin-top:16px}
.theme-pink .hero .h1-note{color:var(--rose)}

/* the four story beats: a bold line, one or two short lines, air */
.beats{max-width:600px;margin:0 auto;text-align:center}
.body .beat h2{margin:60px 0 14px}
.body .beat:first-child h2{margin-top:0}
.body .beat p{margin:0;font-size:18px;line-height:1.65}
.beat .story-gif{margin:28px auto 0}

/* the big plus: results, +, recipes, +, AI */
.plus{text-align:center;font-family:"Open Sans","Assistant",Arial,sans-serif;font-size:40px;font-weight:800;line-height:1;color:#111;margin:44px 0 0}
.body .plus + .gift{margin-top:24px}
.body .plus + .r3-ai{margin-top:24px}

/* =====================================================================
   THE DOC BODY. The owner's copy laid out like a centred Google Doc:
   pure white, black ink, one font (Assistant), short lines broken where
   he broke them, big gaps between beats. No cards, no tints. The reused
   blocks (TikTok posts, results slider, method, kg stats) keep their own
   styles inside it.
   ===================================================================== */
.body.doc{background:#fff;box-shadow:0 0 0 100vmax #fff;clip-path:inset(0 -100vmax)}
.body.doc{max-width:760px;padding:64px 16px 104px;color:#000;text-align:center;
  font-family:"Assistant","Arial Hebrew",Arial,sans-serif}
.body.doc p.dl{max-width:560px;margin:0 auto 52px;font-size:19px;line-height:1.55;font-weight:400;color:#000;text-wrap:balance}
.body.doc p.dl b{font-weight:800}
/* the lines the owner made bold and larger in his doc */
.body.doc p.dl.dl-lead{font-size:24px;font-weight:800;line-height:1.35}
.body.doc p.dl.dl-bold{font-size:21px;font-weight:800;line-height:1.4}
.body.doc h2.dh{text-wrap:balance;max-width:560px;margin:96px auto 12px;font-family:inherit;font-weight:800;
  font-size:26px;line-height:1.25;color:#000;letter-spacing:-.005em}
.body.doc h2.dh-tight{margin-top:0;margin-bottom:52px}
.body.doc .dl-tight{margin-top:0}
.body.doc p.dl-plus{font-size:26px;font-weight:800;line-height:1;margin-bottom:40px}
.body.doc p.dl + p.dl-plus{margin-top:-12px}
.body.doc p.dprice{max-width:560px;margin:0 auto 52px;font-family:inherit;font-weight:800;
  font-size:48px;line-height:1.05;color:#000;letter-spacing:-.01em}
.body.doc > p.dl:first-child{margin-top:0}
.doc .doc-gif{margin:0 auto 52px;max-width:264px}
.doc .doc-gif img{border-radius:0}

/* Amy's photos, each with a hand-drawn curved arrow pointing at it */
.amy-shot{position:relative;margin:-24px auto 64px;width:62%;max-width:280px}
.amy-shot img{display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:cover}
.amy-arw{position:absolute;top:-6px;right:100%;width:52px;height:auto;margin-right:4px}
.amy-shot.flip .amy-arw{right:auto;left:100%;margin-right:0;margin-left:4px;transform:scaleX(-1)}

/* the reused blocks, sitting in the doc */
.body.doc .tt-trio{margin:-20px auto 56px}
.body.doc .bslide{margin:0 auto 56px}
.body.doc .kicker{margin-top:8px !important}
.body.doc .sigs{text-align:left}
.body.doc .sig-txt{text-align:center}
.body.doc .wl{margin-top:0;margin-bottom:24px;padding-top:12px;padding-bottom:8px}
.body.doc .doc-cta{margin-top:8px}

@media (min-width:720px){
  .body.doc{padding-top:88px}
  .body.doc p.dl{font-size:21px;margin-bottom:60px}
  .body.doc p.dl.dl-lead{font-size:29px}
  .body.doc p.dl.dl-bold{font-size:24px}
  .body.doc h2.dh{font-size:31px;margin-top:112px}
  .body.doc h2.dh-tight{margin-top:0;margin-bottom:60px}
  .body.doc p.dl-plus{font-size:30px}
  .body.doc p.dprice{font-size:58px;margin-bottom:60px}
  .amy-arw{width:64px;margin-right:10px}
  .amy-shot.flip .amy-arw{margin-left:10px}
}

/* =====================================================================
   THE DOC BONUSES. Under "500 special recipes": the Bloomplate recipe
   cards drifting in one row. Under "24/7 AI chat": the R3 Coach AI card
   with its orb, unboxed. The original price: one thin red diagonal line.
   ===================================================================== */
.body.doc p.dl.dl-lead-in{margin-bottom:26px}
.doc-recipes{margin:0 calc(50% - 50vw);overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0,#000 7%,#000 93%,transparent 100%)}
.doc-recipes-track{display:flex;gap:10px;width:max-content;padding:4px 0 6px;animation:docMarq 70s linear infinite}
.doc-recipes:hover .doc-recipes-track{animation-play-state:paused}
@keyframes docMarq{to{transform:translateX(calc(-50% - 5px))}}
.body.doc .doc-recipes .taste-card{flex:0 0 132px;width:132px;border-radius:12px;box-shadow:none;border:1px solid #e6e6e6}
.body.doc .doc-recipes .taste-card img{aspect-ratio:3/4}
.body.doc .doc-recipes .taste-card .kcal{left:6px;top:6px;font-size:10.5px;padding:3px 7px}
.body.doc .doc-recipes .taste-card .kcal .ps{display:none}
.body.doc .doc-recipes .taste-card figcaption{padding:7px 8px 9px;font-size:12.5px;line-height:1.25;text-align:left;color:#000}
@media (min-width:720px){.body.doc .doc-recipes .taste-card{flex-basis:168px;width:168px}
  .body.doc .doc-recipes .taste-card figcaption{font-size:13.5px}}
@media (prefers-reduced-motion:reduce){
  .doc-recipes{overflow-x:auto;-webkit-mask-image:none;mask-image:none}
  .doc-recipes-track{animation:none;padding-inline:16px}
  .doc-recipes-track .taste-card[aria-hidden="true"]{display:none}}
.body.doc p.doc-fine{max-width:560px;margin:12px auto 52px;font-size:13px;line-height:1.5;color:#6b7280}

.body.doc .doc-ai{display:block;border:0;border-radius:0;padding:0;margin:-8px auto 60px;max-width:420px;text-align:center}
.body.doc .doc-ai .ln-orb{margin:0 auto 10px}
.body.doc .doc-ai h3{text-align:center !important;font-family:inherit;font-weight:800;font-size:19px !important;margin:0 0 12px !important;color:#000}
.body.doc .doc-ai ul{display:inline-block;text-align:left;max-width:360px}
.body.doc .doc-ai li{font-size:16px;line-height:1.45;margin:0 0 7px;padding-left:18px;color:#000}
.body.doc .doc-ai li::before{background:#000;width:6px;height:6px;top:.6em}
.body.doc .doc-ai p.fine{text-align:center;font-size:13px;margin:8px 0 0;color:#6b7280}
.body.doc .doc-ai p.fine a{color:inherit}

.dprice-was{position:relative;display:inline-block}
.dprice-was::after{content:"";position:absolute;left:-6%;right:-6%;top:52%;height:2px;background:#dc2626;
  transform:rotate(-19deg);transform-origin:center;pointer-events:none}

/* =====================================================================
   NO APPLE PAY ON THIS DEVICE (Android, Windows): the card leads.
   A big "Pay with card" button opens the card form in place; PayPal sits
   behind the underlined "Pay with PayPal" link, and its own buttons are
   revealed (already drawn) when she taps it. Apple Pay devices never get
   .card-first, so their block is exactly as before.
   ===================================================================== */
.apay .apay-pplink{display:none}
.apay.card-first{display:flex;flex-direction:column}
.apay.card-first .apay-price{order:1}
.apay.card-first .cta-timer{order:2}
.apay.card-first .apay-bumps{order:3;margin:0 0 12px}
.apay.card-first .apay-card{order:4}
.apay.card-first .apay-host{order:5}
.apay.card-first .apay-pplink{order:6}
.apay.card-first .apay-row{order:7}
.apay.card-first .apay-err{order:8}
.apay.card-first .apay-card:not(.apay-pplink){display:flex;align-items:center;justify-content:center;gap:.35em;
  width:100%;height:var(--apay-h);margin:0;padding:0 16px;border:0;border-radius:11px;
  background:#fff;color:#0b0b0b;font-size:17px;font-weight:800;letter-spacing:-.01em;text-decoration:none;
  box-shadow:0 6px 18px rgba(0,0,0,.3);transition:transform .15s}
.apay.card-first .apay-card:not(.apay-pplink):hover{color:#0b0b0b;transform:translateY(-1px)}
.apay.card-first.on-light .apay-card:not(.apay-pplink){background:#0b0b0b;color:#fff;box-shadow:0 6px 16px rgba(16,24,40,.22)}
.apay.card-first.on-light .apay-card:not(.apay-pplink):hover{color:#fff}
.apay.card-first .apay-card .cta-arw{width:1em;height:1em;flex:0 0 auto}
.apay.card-first.card-open .apay-card:not(.apay-pplink){display:none}
.apay.card-first:not(.pp-open):not(.no-pp) .apay-pplink{display:block}
.apay.card-first:not(.pp-open) .apay-row{height:0;overflow:hidden;visibility:hidden}
.apay.card-first.pp-open .apay-row{margin-top:12px}
/* the classic form, same rule */
#ppLink{display:none}
.apay-host #ppLink{display:none !important}
#checkoutForm.card-first .card-link:not(.open){display:flex;align-items:center;justify-content:center;gap:.35em;
  height:52px;padding:0 16px;background:#fff;border:0;color:#0b0b0b;font-size:17px;font-weight:800}
#checkoutForm.card-first .card-link:not(.open):hover{background:#f1f1f1}
#checkoutForm.card-first .card-link .cta-arw{width:1em;height:1em}
#checkoutForm.card-first #ppLink{display:block;margin:14px auto 0;padding:4px 6px;border:0;background:none;cursor:pointer;
  font:inherit;font-size:14px;font-weight:600;color:inherit;text-decoration:underline;text-underline-offset:3px}
#checkoutForm.card-first.pp-open #ppLink{display:none}
#checkoutForm.card-first:not(.pp-open) #wallets,
#checkoutForm.card-first:not(.pp-open) #walletNote{height:0;margin:0;overflow:hidden;visibility:hidden}

/* Order bumps from config.offers.bumps (the engine's /api/config): a real
   thumbnail, the outcome line and where it shows up in her plan. */
.bump .bump-th{flex:0 0 auto;width:56px;height:56px;border-radius:10px;object-fit:cover;background:rgba(255,255,255,.06)}
.bump.has-copy .bump-title{flex:1;min-width:0}
.bump.has-copy .bump-title small{display:block;font-weight:600;font-size:13px;opacity:.8;line-height:1.4;margin-top:3px}
.bump .bump-where{display:block;font-weight:700;opacity:.9;margin-top:3px}
.apay-bump .ab-th{flex:0 0 auto;width:44px;height:44px;border-radius:8px;object-fit:cover;background:rgba(255,255,255,.06)}
.apay-bump.has-copy .ab-t b{display:block;font-weight:800}
.apay-bump .ab-l{display:block;font-weight:500;opacity:.85;margin-top:2px}
.apay-bump .ab-w{display:block;font-weight:700;opacity:.9;margin-top:2px}
.apay-bump .ab-tag{display:inline-block;background:#ffcf5c;color:#3a2a00;font-size:10px;font-weight:800;border-radius:5px;padding:1px 6px;margin:0 0 3px}
.bump.has-copy .bump-rec{display:inline-block;background:#ffcf5c;color:#3a2a00;font-size:11px;font-weight:800;border-radius:6px;padding:2px 8px;margin-inline-start:6px;vertical-align:middle}

/* With the offer copy (a thumbnail, a line and where it shows up) two bumps
   side by side leave a column a few words wide on a phone: stack them. */
.apay-bumps:has(.has-copy){display:block}
.apay-bump.has-copy{flex-direction:row;align-items:center;gap:10px;margin:8px 0;padding:11px 12px}
.apay-bump.has-copy .ab-top{flex:1;min-width:0}
.apay-bump.has-copy .ab-t{font-size:12.5px}
.apay-bump.has-copy .ab-w{font-weight:600;opacity:.75}
.apay-bump.has-copy .ab-p{align-self:center}

/* "All you need is 3 days": the big statement, repeated through the page. */
.big3{max-width:720px;margin:10px auto 92px;text-align:center}
.big3 .b3-k{display:block;font-family:"Open Sans",Arial,sans-serif;font-weight:800;font-size:clamp(32px,8.9vw,69px);line-height:1.02;letter-spacing:-.02em;color:#000}
.big3 .b3-k em{font-style:normal;color:var(--rose-ink,#a3456d)}
.big3 .b3-s{display:block;margin-top:14px;font-size:clamp(17px,4.6vw,21px);line-height:1.5;color:#222}
.hero .h1-note b{font-style:normal;color:#fff}
@media(max-width:600px){.hero h1{font-size:5.15vw}}

.body.doc p.big3{margin:10px auto 110px}