/* L1 draft, War Patches. This file is the ABL L1 stylesheet (americanbiolabs-cpk draft/l1-round14, 429b6d0) with only the
   brand swapped (owner 2026-10-29: ABL's layout and sizes, our colours and font): ink #171717 for navy, gold #FBDC30 /
   deep gold #A5830B for the blues, warm bone neutrals for the blue-greys, and 'WP Sans' (DM Sans scaled to take the
   same space as ABL's fonts, abl-fonts.css) for Cabinet Grotesk / General Sans. Keep it in step with the ABL file.
   Phone first; desktop from 900px. */
:root { --l1-navy:#171717; --l1-navy-2:#000; --l1-blue:#171717; --l1-blue-h:#A5830B; --l1-blue-b:#FBDC30; --l1-blue-l:#faf6e1; --l1-blue-d:#A5830B; --l1-ink:#2B2A27; --l1-muted:#6B6660; --l1-line:#E7E4DC; --l1-card:#E4E1DA; --l1-tint:#F5F4F0; --l1-cream:#FAF9F6; --l1-green:#1A7F4E; --l1-gold:#E8A33D; }
* { box-sizing:border-box; }
/* manipulation = no double-tap zoom and no 300ms tap delay; pinch zoom still works. */
html { scroll-behavior:smooth; touch-action:manipulation; -webkit-text-size-adjust:100%; }
body { margin:0; background:#fff; color:var(--l1-ink); font:400 17px/1.55 'WP Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; -webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:transparent; }
img { display:block; max-width:100%; height:auto; }
button { font:inherit; color:inherit; }
.l1 h1, .l1 h2, .l1 h3, .l1-title { text-wrap:balance; }
.l1 h1, .l1 h2, .l1 h3 { margin:0; color:var(--l1-navy); font-family:'WP Sans',sans-serif; letter-spacing:-.01em; }
.l1 a { color:inherit; }
.l1-stars { display:inline-flex; gap:1px; vertical-align:-2px; }
.l1-stars svg { width:16px; height:16px; fill:var(--l1-gold); }
.l1-verified { display:inline-flex; align-items:center; gap:4px; color:var(--l1-green); font-size:13px; font-weight:600; }
.l1-verified svg, .l1-why li > svg, .l1-pull cite svg { flex:none; width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }

/* ---------- Header: the logo bar, then Ledisa's deal bar with the ticking clock (ink, gold title) ---------- */
.l1-topbar { display:flex; justify-content:center; align-items:center; gap:14px; padding:9px 12px; background:var(--l1-navy); color:#fff; }
.l1-topbar-text { display:flex; flex-direction:column; align-items:center; min-width:0; margin:0; text-align:center; text-transform:uppercase; }
.l1-topbar-text b { color:var(--l1-blue-b); font:800 15px/1.3 'WP Sans',sans-serif; letter-spacing:.04em; }
.l1-topbar-text span { font-size:11px; font-weight:700; line-height:14px; letter-spacing:-.01em; }
.l1-clock { flex:none; display:flex; align-items:flex-start; gap:3px; padding:5px 8px; border:1px solid #a0a0a0; border-radius:8px; background:#fff; color:#000; }
.l1-clock span { display:flex; flex-direction:column; align-items:center; gap:2px; }
.l1-clock b { width:26px; font:800 17px/21px ui-monospace,'SF Mono',Menlo,monospace; text-align:center; font-variant-numeric:tabular-nums; }
.l1-clock small { font-size:10px; line-height:10px; }
.l1-clock i { font-style:normal; font-weight:800; line-height:21px; }
.l1-header { display:flex; justify-content:center; align-items:center; height:60px; background:#fff; }
.l1-header img { width:100px; height:52px; object-fit:contain; }

/* ---------- Buy box ---------- */
.l1-buy { display:grid; gap:20px; max-width:1180px; margin:0 auto; padding:18px 16px 28px; }
.l1-mtitle { text-align:center; }
.l1-rating { margin:0 0 6px; color:var(--l1-muted); font-size:14px; }
.l1-rating strong { color:var(--l1-navy); }
.l1-title { margin:0; color:var(--l1-navy); font:700 28px/1.15 'WP Sans',sans-serif; letter-spacing:-.01em; }
.l1-title span { color:var(--l1-blue-d); }
.l1-sub { margin:8px 0 0; color:#4a4741; font-size:16px; line-height:1.45; }

/* Gallery: one native swipe track; thumbnails and arrows scroll it (abl-l1.js). */
.l1-gallery-track { display:flex; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; border-radius:16px; background:var(--l1-tint); aspect-ratio:1; }
.l1-gallery-track::-webkit-scrollbar { display:none; }
.l1-gallery-track img { flex:0 0 100%; width:100%; height:100%; object-fit:contain; scroll-snap-align:center; scroll-snap-stop:always; }
.l1-thumbs { display:flex; align-items:center; gap:6px; margin-top:10px; }
.l1-thumb { flex:1; min-width:0; padding:0; border:2px solid transparent; border-radius:8px; background:none; overflow:hidden; aspect-ratio:1; cursor:pointer; }
.l1-thumb img { width:100%; height:100%; object-fit:cover; }
.l1-thumb.is-on { border-color:var(--l1-blue); }
.l1-arrow { flex:none; display:grid; place-items:center; width:32px; height:32px; padding:0; border:1px solid var(--l1-line); border-radius:50%; background:#fff; cursor:pointer; }
.l1-arrow svg { width:14px; height:14px; fill:none; stroke:var(--l1-navy); stroke-width:2; }
.l1-quote-card { gap:12px; margin-top:16px; padding:14px; border:1px solid var(--l1-line); border-radius:14px; background:var(--l1-cream); }
.l1-quote-card img { width:56px; height:56px; border-radius:50%; object-fit:cover; }
.l1-quote-card p { margin:4px 0; font-size:15px; font-style:italic; }
.l1-quote-card strong { font-size:14px; }
.l1-quote-card .l1-verified { margin-left:8px; }

.l1-orderby { display:flex; align-items:center; gap:10px; margin:16px 0 0; padding:11px 14px; border:1.5px dashed var(--l1-blue-d); border-radius:10px; background:#faf8f1; font-size:16px; }
.l1-orderby svg { flex:none; width:22px; height:22px; fill:none; stroke:var(--l1-blue-d); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.l1-divider { display:flex; align-items:center; gap:12px; margin:22px 0; color:var(--l1-navy); font-weight:700; }
.l1-divider::before, .l1-divider::after { content:""; flex:1; height:1px; background:var(--l1-line); }

/* Offer cards in the live PDP's look: white cards; the chosen one = navy outline on warm grey, with Ledisa's
   "click here" rows and the gift line inside it as one closed block. The supply line shows on the chosen card. */
.l1-offers { display:grid; gap:14px; }
/* WP: abl-l1.js keeps the tapped card in place itself, so the browser's own scroll anchoring stays out of the ladder. */
.l1-offers, .l1-offers * { overflow-anchor:none; }
.l1-offer { position:relative; display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:4px 12px; padding:16px 14px 14px; border:1.5px solid var(--l1-card); border-radius:14px; background:#fff; cursor:pointer; }
.l1-offer:has(> input[type=radio]:checked) { border:2px solid var(--l1-navy); background:#f6f6f5; }
.l1-offer input { width:20px; height:20px; margin:0; accent-color:var(--l1-navy); }
.l1-offer-name { display:flex; flex-direction:column; color:var(--l1-navy); font-size:17px; font-weight:600; line-height:1.3; }
.l1-offer-name em { color:var(--l1-muted); font-size:13.5px; font-style:normal; font-weight:500; }
.l1-offer:not(:has(> input[type=radio]:checked)) .l1-offer-name em { display:none; }
.l1-ends { color:#c8302f; font-size:13px; font-style:normal; font-weight:700; font-variant-numeric:tabular-nums; }
.l1-offer-price { display:flex; flex-direction:column; align-items:flex-end; }
.l1-offer-price strong { color:var(--l1-navy); font:700 21px/1.05 'WP Sans',sans-serif; }
.l1-offer:not(:has(> input[type=radio]:checked)) .l1-offer-price strong { color:#4a4741; }
.l1-per { color:var(--l1-muted); font-size:12px; font-weight:600; }
.l1-offer-price s { color:#9b978e; font-size:13px; line-height:1.3; }
.l1-offer-price small { color:var(--l1-green); font-size:12.5px; font-weight:700; line-height:1.3; }
.l1-badge { position:absolute; top:-12px; left:50%; padding:3px 12px; border-radius:6px; background:var(--l1-navy); color:#fff; font-size:12.5px; font-weight:600; white-space:nowrap; transform:translateX(-50%); }
.l1-badge--soft { background:#FBDC30; color:var(--l1-navy); }
.l1-offer:has(> .l1-badge) { padding-top:20px; }
.l1-offer-extras { grid-column:1 / -1; display:none; margin:10px -14px -14px; border-top:1px solid var(--l1-card); border-radius:0 0 12px 12px; overflow:hidden; }
.l1-offer:has(> input[type=radio]:checked) .l1-offer-extras { display:block; }
.l1-extra { display:flex; align-items:center; gap:10px; padding:10px 14px; border-bottom:1px solid #E7E4DC; font-size:15px; cursor:pointer; }
.l1-extra input { flex:none; width:18px; height:18px; margin:0; accent-color:var(--l1-navy); }
.l1-extra > span { flex:1; color:var(--l1-navy); font-weight:600; }
.l1-extra > b { display:flex; flex-direction:column; align-items:flex-end; font-size:15px; }
.l1-extra > b s { color:#9b978e; font-size:12.5px; font-weight:400; }
.l1-band { margin:0; padding:8px 14px 10px; list-style:none; }
.l1-band li { display:flex; align-items:center; gap:8px; padding:1px 0; color:var(--l1-navy); font-size:15px; font-weight:600; }
.l1-band svg { flex:none; width:16px; height:16px; fill:none; stroke:var(--l1-green); stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }
.l1-lose { margin:10px 0 0; padding:10px 12px; border:1px solid #f1c3c3; border-radius:10px; background:#fdecec; color:#8a1f1f; font-size:15px; }
.l1-lose[hidden], .l1-band[hidden], .l1-band li[hidden], .l1-draft-note[hidden] { display:none; }

.l1-cta { display:flex; align-items:center; justify-content:center; gap:10px; margin-top:14px; padding:18px 20px; border:0; border-radius:12px; background:var(--l1-navy); color:#fff !important; font:700 20px/1 'WP Sans',sans-serif; text-decoration:none; box-shadow:0 10px 22px rgba(23,23,23,.18); }
.l1-cta:active { background:var(--l1-navy-2); }
.l1-cta svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.l1-cta--inline { max-width:420px !important; margin-top:28px; }
.l1-refill { display:flex; justify-content:center; align-items:center; gap:clamp(6px,2vw,12px); margin:6px 0 0; color:#858585; font:400 clamp(11px,3vw,13px)/27px 'WP Sans',sans-serif; white-space:nowrap; }
.l1-refill > span { display:inline-flex; align-items:center; gap:6px; }
.l1-refill > i { flex:none; font-size:18px; font-style:normal; line-height:27px; opacity:.6; }
.l1-refill b { font-weight:400; }
.l1-refill svg { flex:none; width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.l1-draft-note { margin:8px 0 0; padding:8px 10px; border-radius:8px; background:#fff3cd; color:#7a5b00; font-size:13px; text-align:center; }

/* Ledisa's guarantee box in ABL colours: the 120-day seal, a bold promise, the terms (owner round 14). */
.l1-guarantee { display:flex; align-items:center; gap:16px; margin:16px 0 0; padding:16px; border:1.5px solid var(--l1-blue); border-radius:14px; background:linear-gradient(135deg,#fbf3cf,#fdfaf0 70%); box-shadow:0 8px 22px rgba(165,131,11,.16); }
.l1-seal { flex:none; width:88px; height:88px; filter:drop-shadow(0 4px 8px rgba(23,23,23,.22)); }
.l1-guarantee__title { margin:0 0 6px; color:var(--l1-navy); font:800 19px/1.2 'WP Sans',sans-serif; }
.l1-guarantee__desc { margin:0; color:var(--l1-ink); font-size:14px; line-height:1.45; }

/* Live PDP service card (round 8), from american-biolabs.com computed styles; radius/border as the offer cards. */
.l1-service { margin:14px 0 0; padding:22px 22px 24px; border:1px solid var(--l1-card); border-radius:14px; background:#fff; color:var(--l1-navy); }
.l1-service__eyebrow { display:inline-block; margin:0 0 12px; padding:5px 9px; border-radius:7px; background:#f1efe8; font-size:12px; font-weight:500; line-height:18px; letter-spacing:.065em; text-transform:uppercase; }
.l1-service__heading { margin:0 0 12px; font:500 24px/1.15 'WP Sans',Arial,sans-serif; letter-spacing:-.025em; }
.l1-service__body { margin:0; font-size:16px; font-weight:500; line-height:1.55; }
.l1-service__lines { display:grid; gap:12px; margin:20px 0 0; padding:18px 0 0; border-top:1px solid #E7E4DC; list-style:none; }
.l1-service__lines li { display:grid; grid-template-columns:17px 1fr; gap:10px; align-items:start; font-size:16px; font-weight:500; line-height:1.45; }
.l1-service__lines svg { width:17px; height:17px; margin-top:3px; fill:none; stroke:var(--l1-navy); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

/* Dropdowns (buy-box answers and the FAQ): one style, open and close without animation. */
.l1-acc { display:grid; gap:10px; margin-top:18px; }
.l1-faq-list { display:grid; gap:10px; margin-top:22px; }
.l1-acc details, .l1-faq-list details { border:1px solid var(--l1-card); border-radius:12px; background:#fff; }
.l1-acc details[open], .l1-faq-list details[open] { border-color:#cfcabf; }
.l1-acc summary, .l1-faq-list summary { display:flex; justify-content:space-between; align-items:center; gap:14px; padding:16px 18px; color:var(--l1-navy); font-size:17px; font-weight:600; line-height:1.35; list-style:none; cursor:pointer; user-select:none; }
.l1-acc summary::-webkit-details-marker, .l1-faq-list summary::-webkit-details-marker { display:none; }
.l1-acc summary::after, .l1-faq-list summary::after { content:""; flex:none; width:9px; height:9px; margin-top:-4px; border-right:2px solid var(--l1-navy); border-bottom:2px solid var(--l1-navy); transform:rotate(45deg); }
.l1-acc details[open] summary::after, .l1-faq-list details[open] summary::after { margin-top:4px; transform:rotate(225deg); }
.l1-acc p, .l1-faq-list p { margin:-4px 0 0; padding:0 18px 18px; font-size:16px; line-height:1.6; }

/* ---------- Sections ---------- */
.l1-press { padding:20px 16px; background:var(--l1-navy); color:#fff; text-align:center; }
.l1-press p { display:flex; flex-direction:column; gap:4px; max-width:900px; margin:0 auto; }
.l1-press strong { font:700 23px/1.2 'WP Sans',sans-serif; }
.l1-press span { color:#d9d4c7; font-size:16px; }
.l1-sec { padding:44px 16px; }
.l1-sec > * { max-width:1080px; margin-left:auto; margin-right:auto; }
.l1-cream { background:var(--l1-cream); }
.l1-tint { background:var(--l1-tint); }
.l1-h2 { font-size:29px; line-height:1.18; text-align:center; }
.l1-lead { margin-top:10px; color:var(--l1-muted); text-align:center; }
.l1-kicker { margin-bottom:8px; color:var(--l1-muted); font-size:16px; text-align:center; }

.l1-icons { display:grid; grid-template-columns:repeat(2,1fr); margin-top:24px; padding:0; list-style:none; }
.l1-icons li { display:flex; flex-direction:column; align-items:center; gap:8px; padding:16px 8px; border-bottom:1px dashed #cfcabf; color:var(--l1-navy); font-size:16px; font-weight:600; text-align:center; }
.l1-icons li:nth-child(odd) { border-right:1px dashed #cfcabf; }
.l1-icons svg { width:44px; height:44px; fill:none; stroke:var(--l1-navy); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }

/* Photo cards with a caption under each */
.l1-cards2 { display:grid; gap:28px; margin-top:28px; }
.l1-cards2 figure { margin:0; text-align:center; }
.l1-cards2 img { width:100%; aspect-ratio:6/5; object-fit:cover; border-radius:16px; }
.l1-cards2 figcaption { margin-top:12px; font-size:16px; }
.l1-cards2 figcaption strong { display:block; margin-bottom:4px; color:var(--l1-navy); font:700 21px/1.25 'WP Sans',sans-serif; }

/* Steps: identical cards, one image size, the step number sitting on the image's bottom edge. */
.l1-steps { display:grid; gap:18px; margin-top:28px; padding:0; list-style:none; }
.l1-steps li { overflow:hidden; border:1px solid var(--l1-line); border-radius:18px; background:#fff; box-shadow:0 6px 18px rgba(23,23,23,.06); }
.l1-steps figure { position:relative; margin:0; }
.l1-steps img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.l1-steps figure span { position:absolute; left:18px; bottom:-22px; display:grid; place-items:center; width:44px; height:44px; border:3px solid #fff; border-radius:50%; background:var(--l1-navy); color:#fff; font:800 19px/1 'WP Sans',sans-serif; }
.l1-steps h3 { padding:30px 20px 4px; font-size:21px; }
.l1-steps p { margin:0; padding:0 20px 22px; color:var(--l1-muted); font-size:16px; }

/* Week-by-week: a vertical line of milestones; ink dot, the last one filled. */
.l1-timeline { display:grid; gap:0; max-width:640px !important; margin-top:28px; padding:0; list-style:none; }
.l1-timeline li { position:relative; padding:0 0 26px 34px; }
.l1-timeline li::before { content:""; position:absolute; left:6px; top:6px; width:12px; height:12px; border:2px solid var(--l1-blue); border-radius:50%; background:#fff; }
.l1-timeline li::after { content:""; position:absolute; left:12px; top:22px; bottom:2px; width:2px; background:var(--l1-line); }
.l1-timeline li:last-child { padding-bottom:0; }
.l1-timeline li:last-child::before { background:var(--l1-blue); }
.l1-timeline li:last-child::after { display:none; }
.l1-timeline b { color:var(--l1-blue-h); font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.l1-timeline h3 { margin-top:2px; font-size:21px; }
.l1-timeline p { margin:2px 0 0; color:var(--l1-muted); font-size:16px; }

/* Results: before/after pairs, then the review cards. */
.l1-h3 { margin-top:44px !important; font-size:24px; text-align:center; }
.l1-ba-grid, .l1-reviews { display:grid; gap:16px; margin-top:26px; }
.l1-ba-grid article, .l1-reviews article { overflow:hidden; border:1px solid var(--l1-card); border-radius:16px; background:#fff; }
.l1-ba { display:grid; grid-template-columns:1fr 1fr; gap:2px; }
.l1-ba--one { grid-template-columns:1fr; }
.l1-ba figure { position:relative; margin:0; }
.l1-ba img { width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:center top; }
.l1-ba--one img { aspect-ratio:8/5; }
.l1-ba figcaption { position:absolute; right:8px; bottom:8px; padding:3px 8px; border-radius:6px; background:var(--l1-blue); color:#fff; font-size:12px; font-weight:700; }
.l1-ba figure:first-child:not(:only-child) figcaption, .l1-ba .l1-ba-l { background:var(--l1-navy); }
.l1-ba .l1-ba-l { right:auto; left:8px; }
.l1-ba-text { padding:16px 18px 18px; }
.l1-ba-text h3 { margin:6px 0 4px; font-size:19px; line-height:1.25; }
.l1-ba-text p, .l1-reviews p { margin:0; font-size:15.5px; line-height:1.55; }
.l1-reviews article { padding:18px; }
.l1-reviews h4 { margin:6px 0 4px; color:var(--l1-navy); font:700 18px/1.3 'WP Sans',sans-serif; }
.l1-ba-text cite, .l1-reviews cite { display:flex; flex-wrap:wrap; align-items:center; gap:4px 10px; margin-top:10px; color:var(--l1-navy); font-size:14.5px; font-style:normal; font-weight:700; }
.l1-ba-text cite span, .l1-reviews cite span { display:inline-flex; align-items:center; gap:4px; color:var(--l1-green); font-size:13px; font-weight:600; }
.l1-ba-text cite svg, .l1-reviews cite svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }

.l1-pull { max-width:640px !important; margin-top:34px; margin-bottom:0; font-size:16px; text-align:center; }
.l1-pull strong { display:block; margin:8px 0; color:var(--l1-navy); font:700 23px/1.25 'WP Sans',sans-serif; }
.l1-pull cite { display:flex; justify-content:center; align-items:center; gap:10px; margin-top:10px; color:var(--l1-navy); font-style:normal; font-weight:700; }
.l1-pull cite span { display:inline-flex; align-items:center; gap:4px; color:var(--l1-green); font-size:13px; font-weight:600; }

.l1-ingr { display:grid; gap:24px; }
.l1-ingr-card { overflow:hidden; border-radius:18px; background:#fff; box-shadow:0 10px 30px rgba(23,23,23,.08); text-align:center; }
.l1-ingr-card img { width:100%; }
.l1-ingr-card h3 { padding:16px 18px 6px; font-size:23px; line-height:1.2; }
.l1-zero { display:flex; flex-wrap:wrap; justify-content:center; gap:6px 16px; margin:0; padding:4px 18px 20px; color:var(--l1-navy); font-weight:600; }
.l1-zero span::first-letter { color:var(--l1-blue-h); }
.l1-ingr-list { margin:0; padding:0; list-style:none; }
.l1-ingr-list li { display:flex; align-items:center; gap:14px; padding:14px 0; border-bottom:1px solid var(--l1-line); }
.l1-ingr-list img { flex:none; width:60px; height:60px; border-radius:50%; object-fit:cover; }
.l1-ingr-list h3 { font-size:19px; }
.l1-ingr-list p { margin:2px 0 0; color:var(--l1-muted); font-size:15px; }

.l1-why { display:grid; gap:24px; margin-top:24px; }
.l1-why figure { margin:0; }
.l1-why img { width:100%; border-radius:16px; }
.l1-why ul { display:grid; gap:18px; margin:0; padding:0; list-style:none; }
.l1-why li { display:flex; gap:12px; }
.l1-why li > svg { width:26px; height:26px; padding:5px; border-radius:50%; background:var(--l1-blue); stroke:#fff; }
.l1-why h3 { font-size:21px; }
.l1-why p { margin:4px 0 0; color:var(--l1-muted); font-size:16px; }

/* Objections (built from the post-purchase survey: 54% doubted it would work, 48% bought for the guarantee,
   24% worried about the subscription, upsell confusion about "needing" more products). */
.l1-reasons { display:grid; gap:14px; margin-top:28px; }
.l1-reasons article { display:grid; grid-template-columns:44px 1fr; gap:4px 14px; padding:20px; border:1px solid var(--l1-card); border-radius:14px; background:#fff; }
.l1-reasons svg { grid-row:span 2; width:44px; height:44px; fill:none; stroke:var(--l1-blue-h); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.l1-reasons h3 { font-size:21px; line-height:1.2; }
.l1-reasons p { margin:0; font-size:16px; }

.l1-faq .l1-h2 { text-align:left; }
.l1-fine-inline { margin-top:18px !important; color:var(--l1-muted); font-size:13px; text-align:center; }
/* WP: the live PDP's four buy-box bullets, in the gift-line style. */
.l1-points { display:grid; gap:6px; margin:14px 0 0; padding:0; list-style:none; }
.l1-points li { display:flex; align-items:center; gap:8px; color:var(--l1-navy); font-size:15.5px; font-weight:600; }
.l1-points svg { flex:none; width:16px; height:16px; fill:none; stroke:var(--l1-green); stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round; }
.l1-fine { max-width:1080px; margin:0 auto; padding:0 16px 30px; color:var(--l1-muted); font-size:13px; }

/* ---------- Footer (the funnel footer's base rules live in the PDP stylesheet, which L1 does not load) ---------- */
.abl-funnel-footer { padding:48px 20px 40px; text-align:center; font:13px/1.6 'WP Sans',sans-serif; }
.abl-funnel-footer img { margin:0 auto; object-fit:contain; }
.abl-funnel-footer p { margin:10px 0; }
.abl-funnel-footer nav a { text-decoration:underline; text-underline-offset:2px; }
body:has(.l1-sticky.is-on) .abl-funnel-footer { padding-bottom:130px; }

/* ---------- Sticky bar (phones) ---------- */
.l1-sticky { position:fixed; left:0; right:0; bottom:0; z-index:45; padding:8px 12px calc(10px + env(safe-area-inset-bottom)); background:#fff; box-shadow:0 -6px 20px rgba(23,23,23,.12); transform:translateY(110%); transition:transform .25s; }
.l1-sticky.is-on { transform:none; }
.l1-sticky p { display:flex; justify-content:space-between; margin:0 0 6px; color:var(--l1-navy); font-size:14px; font-weight:600; }
.l1-sticky .l1-cta { margin:0; padding:15px; font-size:18px; }

/* ---------- Motion: short, transform/opacity only, off for Reduce Motion ---------- */
.l1-offer { transition:border-color .18s ease, background-color .18s ease; }
.l1-offer:has(> input[type=radio]:checked) .l1-offer-extras { animation:l1-in .22s ease-out; }
.l1-cta { transition:transform .12s ease, background-color .15s ease; }
.l1-cta:active { transform:scale(.98); }
.l1-acc summary::after, .l1-faq-list summary::after { transition:transform .2s ease, margin-top .2s ease; }
.l1-acc details[open] > p, .l1-faq-list details[open] > p { animation:l1-in .2s ease-out; }
@keyframes l1-in { from { opacity:0; transform:translateY(-4px); } to { opacity:1; transform:none; } }
/* Sections fade up once as they scroll in; only once abl-l1.js has marked the page (no JS = no hiding). */
.l1-reveal-on [data-l1-reveal] { opacity:0; transform:translateY(14px); transition:opacity .45s ease, transform .45s ease; }
.l1-reveal-on [data-l1-reveal].is-in { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  .l1 *, .l1 *::after { animation:none !important; transition:none !important; }
  .l1-reveal-on [data-l1-reveal] { opacity:1; transform:none; }
}

/* Small text links get a thumb-sized tap area. */
.l1-fine a { display:inline-block; padding-top:8px; padding-bottom:8px; }

/* ---------- Phones vs desktop ---------- */
.l1-desktop-only { display:none !important; }
@media (max-width:899px) { .l1-dtitle { display:none !important; } }
@media (max-width:420px) {
  .l1-title { font-size:27px; }
  .l1-guarantee { gap:12px; padding:14px; }
  .l1-seal { width:76px; height:76px; }
  .l1-guarantee__title { font-size:17.5px; }
}
@media (min-width:900px) {
  .l1-desktop-only { display:flex !important; }
  .l1-mtitle { display:none; }
  .l1-buy { grid-template-columns:1fr 1fr; gap:48px; padding-top:28px; align-items:start; }
  .l1-gallery { position:sticky; top:24px; }
  .l1-title { font-size:34px; }
  .l1-h2 { font-size:38px; }
  .l1-sec { padding:64px 24px; }
  .l1-icons { grid-template-columns:repeat(6,1fr); }
  .l1-icons li { border-bottom:0; }
  .l1-icons li:not(:last-child) { border-right:1px dashed #cfcabf; }
  .l1-cards2 { grid-template-columns:1fr 1fr; }
  .l1-steps, .l1-reasons { grid-template-columns:repeat(3,1fr); }
  .l1-ba-grid { grid-template-columns:1fr 1fr; gap:20px; }
  .l1-reviews { grid-template-columns:repeat(3,1fr); gap:20px; }
  .l1-reasons article { grid-template-columns:1fr; }
  .l1-reasons svg { grid-row:auto; }
  .l1-ingr, .l1-why { grid-template-columns:1fr 1.2fr; align-items:center; gap:40px; }
  .l1-faq-list, .l1-faq .l1-h2 { max-width:820px; }
  .l1-sticky { display:none; }
}
@media (min-width:990px) {
  .l1-topbar { gap:40px; padding:12px 24px; }
  .l1-topbar-text b { font-size:20px; }
  .l1-topbar-text span { font-size:14px; line-height:18px; }
  .l1-clock b { width:34px; font-size:24px; line-height:26px; }
  .l1-clock small { font-size:12px; line-height:14px; }
  .l1-header { height:84px; }
  .l1-header img { width:120px; height:64px; }
}