/* ===== HERO (Light) ===== */
/* NOTE: .hero-grid, .hero-text, .hero-subhead, .hero-product-mobile/.hero-product
   CORE rules live in critical.css (inlined) so they never race the async CSS.
   DO NOT duplicate .hero-grid/.hero-text/.hero-subhead here — it breaks the cascade
   and forces desktop overrides to lose to home.css defaults. Page-specific extras only. */
.hero-glow{position:absolute;top:-30%;right:-15%;width:70%;height:140%;background:radial-gradient(ellipse,rgba(13,148,136,0.06) 0%,transparent 60%);pointer-events:none}
.hero-benefits li{display:flex;align-items:center;gap:var(--space-3)}
.hero-trust span{display:flex;align-items:center;gap:4px}
.hero-trust svg{width:14px;height:14px;color:var(--color-accent)}
.hero-product-mobile img{width:100%;height:auto;filter:drop-shadow(0 12px 32px rgba(0,0,0,0.12))}
.hero-product>picture>img,.hero-product>img{position:relative;z-index:2;filter:drop-shadow(0 16px 48px rgba(0,0,0,0.12))}
.hero-product-glow{position:absolute;inset:5%;border-radius:50%;background:radial-gradient(circle,rgba(13,148,136,0.08) 0%,transparent 65%);filter:blur(50px);z-index:1}

/* Floating badges on the desktop product image (only visible at ≥1024px when .hero-product is shown) */
.hero-float{position:absolute;z-index:3}
.hero-float-badge{display:flex;align-items:center;gap:var(--space-2);background:var(--bg-white);border:1px solid var(--border);padding:8px 14px;border-radius:var(--radius);font-size:var(--text-xs);font-weight:600;color:var(--text-primary);white-space:nowrap;box-shadow:0 4px 16px rgba(0,0,0,0.08)}
.hero-float-1{top:5%;right:-5%}.hero-float-2{bottom:28%;left:-8%}.hero-float-3{bottom:0;right:8%}

/* Dark section (final CTA only) */
.hero-dark{background:var(--bg-dark);color:#F8FAFC;padding:clamp(5rem,10vw,8rem) 0}
.hero-dark h2{color:#F8FAFC}

/* ===== STATS ===== */
.stats-bar{padding:clamp(2.5rem,5vw,4rem) 0;border-bottom:1px solid var(--border)}
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-8);text-align:center}
.stats-grid-3{grid-template-columns:repeat(3,1fr)}
.stat-num{font-family:var(--font-display);font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700;color:var(--text-primary);line-height:1.1}
.stat-label{font-size:var(--text-sm);color:var(--text-faint);margin-top:var(--space-2)}

/* ===== PRESS ===== */
.press-logos{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(2rem,4vw,4rem);margin-top:var(--space-5)}
.press-logos span,.press-logos a{font-family:var(--font-display);font-size:clamp(1.125rem,2.5vw,1.5rem);font-weight:700;color:var(--text-primary);opacity:0.3;text-decoration:none;transition:opacity 0.2s ease}
.press-logos a:hover{opacity:0.6}

/* ===== THE PROBLEM ===== */
.problem-section{position:relative}
.compare-cards{display:grid;grid-template-columns:1fr;gap:0;margin-top:clamp(2.5rem,5vw,4rem);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,0.04)}
.compare-card{padding:clamp(2rem,4vw,3rem)}
.compare-card h3{font-family:var(--font-body);font-size:var(--text-lg);font-weight:700;margin-bottom:var(--space-5);display:flex;align-items:center;gap:var(--space-3)}
.compare-card ul{display:flex;flex-direction:column;gap:var(--space-4)}
.compare-card li{display:flex;align-items:flex-start;gap:var(--space-3);font-size:var(--text-base);line-height:1.5}
.x-mark{width:24px;height:24px;border-radius:50%;background:#FEE2E2;color:var(--color-red);font-weight:700;font-size:0.875rem;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.check-mark{width:24px;height:24px;border-radius:50%;background:var(--color-accent-light);color:var(--color-accent);font-weight:700;font-size:0.875rem;flex-shrink:0;display:flex;align-items:center;justify-content:center}

/* Bad side — muted, washed out */
.compare-bad{background:#F8F9FA;color:var(--text-muted)}
.compare-bad h3{color:var(--text-muted)}
.compare-bad h3::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:#EF4444;opacity:0.5}
.compare-bad li{color:var(--text-muted)}

/* Good side — vivid, confident */
.compare-good{background:var(--bg-white);border-left:4px solid var(--color-accent);color:var(--text-body)}
.compare-good h3{color:var(--color-accent)}
.compare-good h3::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--color-accent)}
.compare-good li{color:var(--text-body);font-weight:500}

/* VS divider */
.compare-vs{display:flex;align-items:center;justify-content:center;padding:var(--space-3) 0;background:var(--border);font-family:var(--font-body);font-size:var(--text-xs);font-weight:800;color:var(--text-faint);letter-spacing:0.15em;text-transform:uppercase}

/* ===== STEPS ===== */
.steps-grid{display:grid;grid-template-columns:1fr;gap:var(--space-5)}
.step-card{background:var(--bg-white);border-radius:var(--radius-lg);padding:clamp(2rem,4vw,3rem);text-align:center;box-shadow:0 1px 3px rgba(0,0,0,0.04);transition:transform 0.3s,box-shadow 0.3s}
.step-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.08)}
.step-num-circle{width:56px;height:56px;border-radius:50%;background:var(--color-accent);color:#fff;font-size:1.5rem;font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto clamp(1.25rem,2.5vw,2rem)}
.step-card h3{margin-bottom:var(--space-3);color:var(--text-primary)}
.step-card p{color:var(--text-muted);margin-bottom:var(--space-5);line-height:1.65}
.step-pill{display:inline-flex;font-size:var(--text-xs);font-weight:600;color:var(--color-accent);background:var(--color-accent-light);padding:6px 14px;border-radius:var(--radius-full)}

/* ===== INGREDIENTS ===== */
.ingredient-grid{display:grid;grid-template-columns:1fr;gap:var(--space-4)}
.ingredient-card{background:var(--bg-white);border-left:3px solid var(--color-accent);border-radius:var(--radius);padding:clamp(1.5rem,3vw,2rem);box-shadow:0 1px 3px rgba(0,0,0,0.04);transition:box-shadow 0.3s;display:flex;gap:var(--space-4);align-items:flex-start}
.ingredient-card:hover{box-shadow:0 8px 24px rgba(0,0,0,0.06)}
.ing-img{width:60px;height:60px;border-radius:var(--radius);object-fit:contain;flex-shrink:0;background:var(--bg-cream);padding:var(--space-1)}
.ingredient-card h4{margin-bottom:var(--space-2);color:var(--text-primary)}
.ingredient-card p{color:var(--text-muted);line-height:1.65}

/* ===== DOCTOR ===== */
.doctor-quote{max-width:720px;margin:0 auto;background:var(--bg-white);border-radius:var(--radius-lg);padding:clamp(2.5rem,5vw,4rem);text-align:center;box-shadow:0 1px 3px rgba(0,0,0,0.04)}
.doctor-avatar{width:80px;height:80px;border-radius:50%;overflow:hidden;margin:0 auto clamp(1.25rem,2.5vw,2rem);border:3px solid var(--color-accent-light)}
.doctor-avatar img{width:100%;height:100%;object-fit:cover}
.doctor-quote blockquote{font-family:var(--font-display);font-size:clamp(1.0625rem,2.2vw,1.375rem);font-style:italic;color:var(--text-body);line-height:1.65;margin-bottom:var(--space-5)}
.doctor-quote cite{font-style:normal;font-size:var(--text-sm);font-weight:600;color:var(--color-accent)}

/* ===== VERTICAL TIMELINE (interactive) ===== */
.vtimeline{position:relative;margin-top:clamp(2.5rem,5vw,4rem);padding-left:clamp(3rem,6vw,5rem)}
.vtimeline-line{position:absolute;left:clamp(1.1rem,2.2vw,1.8rem);top:0;bottom:0;width:3px;background:var(--border);border-radius:2px}
.vtimeline-progress{width:100%;height:0;background:var(--color-accent);border-radius:2px;transition:height 0.3s ease}

.vtimeline-item{position:relative;padding:clamp(1.5rem,3vw,2.5rem) 0 clamp(1.5rem,3vw,2.5rem) clamp(1.5rem,3vw,2rem);border-left:none;transition:opacity 0.4s ease}
.vtimeline-item+.vtimeline-item{border-top:none}

/* Marker */
.vtimeline-marker{position:absolute;left:calc(-1 * clamp(3rem,6vw,5rem));top:clamp(1.5rem,3vw,2.5rem);width:clamp(2.5rem,5vw,3.5rem);display:flex;align-items:center;justify-content:center}
.vtimeline-marker span{display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:var(--bg-cream);border:2px solid var(--border);font-family:var(--font-body);font-size:var(--text-xs);font-weight:800;color:var(--text-faint);transition:all 0.4s ease;text-transform:uppercase;letter-spacing:0.04em}

/* Content */
.vtimeline-content{background:var(--bg-cream);border-radius:var(--radius-lg);padding:clamp(1.25rem,2.5vw,2rem);transition:all 0.4s ease;border:1px solid transparent}
.vtimeline-content h4{font-family:var(--font-body);font-weight:700;color:var(--text-primary);margin-bottom:var(--space-2);font-size:var(--text-lg);transition:color 0.4s ease}
.vtimeline-content p{color:var(--text-muted);line-height:1.65;transition:color 0.4s ease}

/* Active / highlighted state */
.vtimeline-item.active .vtimeline-marker span{background:var(--color-accent);border-color:var(--color-accent);color:#fff;box-shadow:0 0 0 6px rgba(13,148,136,0.12)}
.vtimeline-item.active .vtimeline-content{background:var(--bg-white);border-color:var(--color-accent);box-shadow:0 8px 24px rgba(0,0,0,0.06)}
.vtimeline-item.active .vtimeline-content h4{color:var(--color-accent)}

/* Dim non-active items slightly */
.vtimeline.has-active .vtimeline-item:not(.active){opacity:0.55}
.vtimeline.has-active .vtimeline-item:not(.active):hover{opacity:0.85}

/* ===== TESTIMONIALS ===== */
.testimonial-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 calc(-1 * var(--pad));padding:0 var(--pad);scroll-snap-type:x mandatory}
.testimonial-scroll::-webkit-scrollbar{display:none}
.testimonial-track{display:flex;gap:var(--space-5);padding:var(--space-2) 0}
.testimonial-card{flex:0 0 320px;scroll-snap-align:start;background:var(--bg-white);border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2rem);box-shadow:0 1px 3px rgba(0,0,0,0.04);transition:transform 0.3s,box-shadow 0.3s}
.testimonial-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,0.06)}
.testimonial-card .stars{margin-bottom:var(--space-4)}
.testimonial-card h4{font-family:var(--font-display);font-size:var(--text-base);color:var(--text-primary);margin-bottom:var(--space-3);font-weight:600;line-height:1.3}
.testimonial-card p{font-size:var(--text-sm);color:var(--text-muted);line-height:1.65;margin-bottom:var(--space-5)}
.tc-footer{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2);font-size:var(--text-sm)}
.tc-footer strong{color:var(--text-primary)}
.verified{color:var(--color-green);font-size:var(--text-xs);font-weight:600}
.relief-badge{font-size:var(--text-xs);color:var(--color-accent);font-weight:600;background:var(--color-accent-light);padding:3px 10px;border-radius:var(--radius-full)}

/* ===== CUSTOMER PHOTOS ===== */
.customer-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-4);margin-top:clamp(2.5rem,5vw,4rem)}
.customer-photo{border-radius:var(--radius-lg);overflow:hidden;position:relative;aspect-ratio:3/2}
.customer-photo img{width:100%;height:100%;object-fit:cover}
.customer-photo .stars{position:absolute;bottom:var(--space-2);left:var(--space-2);background:rgba(255,255,255,0.9);backdrop-filter:blur(4px);padding:4px 8px;border-radius:var(--radius)}

/* ===== BEFORE & AFTER ===== */
.ba-list{display:flex;flex-direction:column;gap:clamp(2rem,4vw,3rem);margin-top:clamp(2.5rem,5vw,4rem)}

.ba-story{display:flex;gap:clamp(1rem,2vw,1.5rem);align-items:flex-start}
.ba-avatar{width:56px;height:56px;border-radius:50%;background:var(--color-accent-light);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--color-accent)}
.ba-body{flex:1;background:var(--bg-white);border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2.5rem);box-shadow:0 1px 3px rgba(0,0,0,0.04);transition:box-shadow 0.3s}
.ba-body:hover{box-shadow:0 8px 24px rgba(0,0,0,0.06)}

.ba-phase{margin-bottom:var(--space-4)}
.ba-phase p{font-family:var(--font-display);font-style:italic;font-size:clamp(0.9375rem,1.8vw,1.0625rem);line-height:1.65;margin-top:var(--space-3)}
.ba-phase-before p{color:var(--text-muted)}
.ba-phase-after p{color:var(--text-primary)}

.ba-tag{display:inline-flex;font-family:var(--font-body);font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:0.08em;padding:4px 12px;border-radius:var(--radius-full)}
.ba-tag-before{background:#FEE2E2;color:#B91C1C}
.ba-tag-after{background:var(--color-accent-light);color:var(--color-accent)}

.ba-arrow{display:flex;justify-content:center;padding:var(--space-2) 0;color:var(--color-accent);opacity:0.4}

.ba-attribution{display:flex;align-items:center;gap:var(--space-3);padding-top:var(--space-4);border-top:1px solid var(--border);font-size:var(--text-sm)}
.ba-attribution strong{color:var(--text-primary)}
.ba-attribution span{color:var(--text-faint)}
.ba-verified{color:var(--color-green);font-weight:600;font-size:var(--text-xs)}

/* ===== PERSONAS ===== */
.persona-grid{display:grid;grid-template-columns:1fr;gap:var(--space-5);margin-top:clamp(2.5rem,5vw,4rem)}
.persona-card{background:var(--bg-white);border-radius:var(--radius-lg);padding:clamp(2rem,4vw,3rem);text-align:center;box-shadow:0 1px 3px rgba(0,0,0,0.04);transition:transform 0.3s,box-shadow 0.3s}
.persona-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,0.08)}
.persona-icon{width:64px;height:64px;border-radius:var(--radius-lg);background:var(--color-accent-light);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-5);flex-shrink:0}
.persona-icon svg{flex-shrink:0;display:block}
.persona-card h4{margin-bottom:var(--space-3);color:var(--text-primary);font-size:var(--text-lg)}
.persona-card p{font-size:var(--text-sm);color:var(--text-muted);line-height:1.7}

/* ===== COMPARISON (Premium) ===== */
.cmp{max-width:800px;margin:clamp(2.5rem,5vw,4rem) auto 0;background:var(--bg-white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,0.04)}
.cmp-header{display:grid;grid-template-columns:1.4fr repeat(3,1fr);border-bottom:2px solid var(--border);padding:clamp(1rem,2vw,1.5rem) 0}
.cmp-feature-label{padding:0 clamp(1rem,2vw,1.5rem)}
.cmp-col{text-align:center;padding:var(--space-3) var(--space-2);font-size:var(--text-sm);color:var(--text-muted);display:flex;flex-direction:column;align-items:center;justify-content:center}
.cmp-col strong{font-size:var(--text-sm);color:var(--text-primary);font-family:var(--font-body)}
.cmp-col-hero{position:relative}
.cmp-col-hero::before{content:'';position:absolute;inset:-4px -8px;background:var(--color-accent-light);border-radius:var(--radius);z-index:0}
.cmp-col-hero>*{position:relative;z-index:1}
.cmp-badge{font-size:0.6875rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--color-accent);background:var(--bg-white);border:1px solid rgba(13,148,136,0.2);padding:2px 8px;border-radius:var(--radius-full);margin-top:var(--space-1)}
.cmp-row{display:grid;grid-template-columns:1.4fr repeat(3,1fr);border-bottom:1px solid var(--border);transition:background 0.2s}
.cmp-row:last-child{border-bottom:none}
.cmp-row:hover{background:var(--bg-cream)}
.cmp-feature{padding:clamp(0.875rem,1.8vw,1.25rem) clamp(1rem,2vw,1.5rem);font-size:var(--text-sm);font-weight:500;color:var(--text-body);display:flex;align-items:center}
.cmp-row .cmp-col{padding:clamp(0.875rem,1.8vw,1.25rem) var(--space-2);display:flex;align-items:center;justify-content:center;font-size:var(--text-sm);color:var(--text-muted)}
.cmp-row .cmp-col svg{flex-shrink:0}
.cmp-row .cmp-col-hero::before{border-radius:0;inset:0 -8px}

/* ===== PRODUCTS (grid moved to components.css for use on collections too) ===== */

/* ===== GUARANTEE ===== */
.guarantee-grid{display:grid;grid-template-columns:1fr;gap:var(--space-5);margin-top:clamp(2.5rem,5vw,4rem)}
.guarantee-card{background:var(--bg-white);border-radius:var(--radius-lg);padding:clamp(2rem,4vw,2.5rem);text-align:center;box-shadow:0 1px 3px rgba(0,0,0,0.04)}
.guarantee-icon{width:64px;height:64px;border-radius:50%;background:var(--color-accent-light);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-5);flex-shrink:0}
.guarantee-icon svg{flex-shrink:0;display:block}
.guarantee-card h4{margin-bottom:var(--space-2);color:var(--text-primary)}
.guarantee-card p{color:var(--text-muted);line-height:1.6}

/* ===== CROSS-SELL ===== */
.cross-sell-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-5);margin-top:clamp(2.5rem,5vw,4rem)}
.cs-card{background:var(--bg-white);border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2rem);text-align:center;box-shadow:0 1px 3px rgba(0,0,0,0.04);transition:transform 0.3s;position:relative}
.cs-card:hover{transform:translateY(-2px)}
.cs-card img{margin:0 auto var(--space-4)}
.cs-card h4{font-family:var(--font-body);font-weight:600;color:var(--text-primary);margin-bottom:var(--space-1)}
.cs-card p{font-size:var(--text-sm);color:var(--text-muted)}
.cs-badge{display:inline-flex;font-size:var(--text-xs);font-weight:700;padding:4px 14px;border-radius:var(--radius-full);margin-bottom:var(--space-4);background:var(--color-accent-light);color:var(--color-accent)}
.cs-add{background:var(--color-accent);color:#fff}
.cs-current{box-shadow:0 0 0 2px var(--color-accent),0 1px 3px rgba(0,0,0,0.04)}

/* ===== STICKY MOBILE CTA ===== */
.sticky-cta{position:fixed;bottom:0;left:0;right:0;z-index:var(--z-sticky,90);background:var(--bg-white);border-top:1px solid var(--border);padding:var(--space-3) 0;box-shadow:0 -4px 16px rgba(0,0,0,0.08);transform:translateY(100%);transition:transform 0.3s ease;will-change:transform}
.sticky-cta.visible{transform:translateY(0)}

/* ===== INGREDIENT ACCORDION (mobile) ===== */
.ingredient-card .ing-detail{display:block}
.ingredient-card.ing-collapsible .ing-detail{display:none}
.ingredient-card.ing-collapsible.ing-open .ing-detail{display:block}
.ing-summary{display:none;font-size:var(--text-sm);color:var(--text-muted);line-height:1.5;margin-top:var(--space-1)}
.ingredient-card.ing-collapsible .ing-summary{display:block}
.ingredient-card.ing-collapsible.ing-open .ing-summary{display:none}
.ing-toggle{display:none;font-size:var(--text-xs);font-weight:600;color:var(--color-accent);margin-top:var(--space-2);cursor:pointer;background:none;border:none;padding:0;font-family:var(--font-body)}
.ingredient-card.ing-collapsible .ing-toggle{display:inline-block}

/* ===== FINAL CTA (Dark) — Desktop redesign ===== */
/* Mobile defaults: single column, centered (kept simple for now — mobile will be
   addressed in a later pass). Desktop gets the full 2-col premium treatment at ≥1024px. */
.final-cta{position:relative;background:linear-gradient(180deg,#0A1628 0%,#0F1D35 100%);color:#F8FAFC;padding:clamp(4rem,8vw,7rem) 0;overflow:hidden}
.final-cta-bg{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 30% 40%,rgba(37,99,235,0.12) 0%,transparent 60%),radial-gradient(ellipse 60% 50% at 80% 70%,rgba(22,163,74,0.08) 0%,transparent 60%);pointer-events:none}
.final-cta-grid{position:relative;z-index:1;display:grid;grid-template-columns:1fr;gap:clamp(2rem,4vw,3rem);align-items:center;max-width:1100px;margin:0 auto}
.final-cta-media{position:relative;text-align:center;display:none}
.final-cta-glow{position:absolute;inset:10%;border-radius:50%;background:radial-gradient(circle,rgba(37,99,235,0.25) 0%,transparent 65%);filter:blur(60px);z-index:0;pointer-events:none}
.final-cta-media picture,.final-cta-media img{position:relative;z-index:1;display:block;margin:0 auto;max-width:100%;height:auto;filter:drop-shadow(0 24px 48px rgba(0,0,0,0.4))}
.final-cta-badge{position:absolute;top:8%;right:10%;z-index:2;display:inline-flex;align-items:center;gap:var(--space-2);background:rgba(255,255,255,0.08);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(251,191,36,0.3);color:#FBBF24;padding:8px 14px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:0.06em;white-space:nowrap;box-shadow:0 8px 24px rgba(0,0,0,0.3)}

.final-cta-content{display:flex;flex-direction:column;gap:var(--space-5)}
.final-cta-rating{display:flex;align-items:center;gap:var(--space-3);color:#CBD5E1;font-size:var(--text-sm)}
.final-cta-rating .stars{display:inline-flex;gap:2px}
.final-cta-rating-text strong{color:#fff;font-weight:700}
.final-cta-headline{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.25rem);font-weight:700;line-height:1.05;letter-spacing:-0.02em;color:#fff;margin:0}
.final-cta-sub{font-size:clamp(1rem,2vw,1.1875rem);line-height:1.65;color:#CBD5E1;margin:0;max-width:520px}
.final-cta-sub em{color:#fff;font-style:italic;font-weight:500}

/* Price card — premium glass-morphism treatment */
.final-cta-price-card{background:linear-gradient(135deg,rgba(255,255,255,0.06) 0%,rgba(255,255,255,0.02) 100%);border:1px solid rgba(255,255,255,0.08);border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2rem);box-shadow:0 12px 40px rgba(0,0,0,0.3);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:flex;flex-direction:column;gap:var(--space-4)}
.final-cta-price-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--space-3)}
.final-cta-price-old{font-size:var(--text-lg);color:#64748B;text-decoration:line-through;font-weight:500}
.final-cta-price-new{font-family:var(--font-display);font-size:clamp(2rem,4vw,2.75rem);font-weight:700;color:#fff;line-height:1}
.final-cta-price-unit{font-size:var(--text-lg);font-weight:500;color:#94A3B8;margin-left:2px}
.final-cta-save{display:inline-flex;align-items:center;background:rgba(22,163,74,0.15);color:#4ADE80;border:1px solid rgba(22,163,74,0.3);padding:6px 14px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:0.06em;white-space:nowrap;margin-left:auto}
.final-cta-btn{width:100%;font-size:var(--text-lg);padding:var(--space-5) var(--space-8);min-height:60px}
.final-cta-micro{text-align:center;font-size:var(--text-xs);color:#94A3B8;margin:0}

/* Trust badge grid */
.final-cta-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-3);padding-top:var(--space-5);border-top:1px solid rgba(255,255,255,0.08)}
.final-cta-trust-item{display:flex;align-items:center;gap:var(--space-2);color:#CBD5E1;font-size:var(--text-xs);font-weight:600;line-height:1.25}
.final-cta-trust-item svg{flex-shrink:0;color:#60A5FA}

/* Desktop: 2-column grid, product image visible, content pushed right */
@media(min-width:1024px){
  .final-cta-grid{grid-template-columns:45fr 55fr;gap:clamp(3rem,6vw,5rem);max-width:1160px}
  .final-cta-media{display:block}
  .final-cta-media img{max-width:480px}
  .final-cta-content{gap:var(--space-6)}
  .final-cta-trust-item{font-size:var(--text-sm)}
}