/* =====================================================================
   OptiBelly — main stylesheet (global + homepage + WooCommerce base)
   Tokens come from brand-tokens.css. Manrope = headings, Inter = body.
   ===================================================================== */

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  font-size:17px;line-height:1.6;color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:var(--color-link);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:Manrope,system-ui,sans-serif;color:var(--color-heading);line-height:1.15;margin:0 0 .5em}
h1{font-size:clamp(2rem,4.5vw,3.25rem);font-weight:800}
h2{font-size:clamp(1.6rem,3vw,2.1rem);font-weight:800}
h4{font-size:1.05rem;font-weight:700;margin:0 0 .35em}
p{margin:0 0 1em}
.ob-container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}
.ob-content-narrow{max-width:760px}
.ob-muted{color:var(--color-charcoal);opacity:.7}
.ob-eyebrow{font-family:Manrope;font-weight:800;letter-spacing:.08em;font-size:.8rem;color:var(--color-teal-dark);text-transform:uppercase;margin:0 0 .5em}
.ob-skip{position:absolute;left:-999px}.ob-skip:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:1000}
.ob-icon{display:inline-block;vertical-align:middle}

/* Buttons */
.ob-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--color-cta-bg);color:var(--color-cta-text);
  font-family:Manrope;font-weight:700;font-size:.95rem;border:0;border-radius:30px;padding:13px 28px;cursor:pointer;transition:background .15s;text-decoration:none}
.ob-btn:hover,.ob-btn:focus{background:var(--color-cta-bg-hover);color:#fff;text-decoration:none}
.ob-btn--lg{padding:15px 34px;font-size:1.05rem}
.ob-btn--ghost{background:transparent;color:var(--color-heading);border:2px solid var(--color-heading)}
.ob-btn--ghost:hover{background:var(--color-heading);color:#fff}
/* Ghost buttons sitting on navy/dark bands need light treatment (else invisible) */
.ob-section--navy .ob-btn--ghost,.ob-hp-hiw .ob-btn--ghost,.ob-phero--navy .ob-btn--ghost{color:#fff;border-color:#fff}
.ob-section--navy .ob-btn--ghost:hover,.ob-hp-hiw .ob-btn--ghost:hover,.ob-phero--navy .ob-btn--ghost:hover{background:#fff;color:var(--color-navy)}

/* Announcement */
.ob-announcement{background:var(--color-cta-bg);color:#fff;text-align:center;font-size:.9rem;font-weight:600;padding:11px 16px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.ob-announcement a{color:#fff;font-weight:700;text-decoration:underline}

/* Header */
.ob-header{background:#fff;border-bottom:1px solid #E3EBEF;position:sticky;top:0;z-index:50}
.ob-header__inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:14px;padding-bottom:14px}
.ob-logo img{height:46px;width:auto}
.ob-menu{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.ob-menu a{color:var(--color-charcoal);font-weight:500;font-size:.95rem}
.ob-menu a:hover{color:var(--color-navy);text-decoration:none}
.ob-header__actions{display:flex;align-items:center;gap:18px}
.ob-account{color:var(--color-charcoal);font-weight:500;font-size:.95rem}
.ob-cart{display:inline-flex;align-items:center;gap:8px;background:var(--color-navy);color:#fff;border-radius:24px;padding:10px 18px;font-weight:700;font-size:.875rem;line-height:1}
.ob-cart:hover{background:var(--color-cta-bg-hover,#163A5F);filter:brightness(1.12)}
.ob-cart:hover{text-decoration:none;color:#fff}
.ob-cart .ob-icon{filter:brightness(0) invert(1)}
.ob-navtoggle{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:42px;
  background:none;border:0;cursor:pointer;padding:9px}
.ob-navtoggle span{display:block;height:2px;width:100%;background:var(--color-navy);border-radius:2px;transition:transform .25s var(--ob-ease,ease),opacity .2s}
.ob-header.is-nav-open .ob-navtoggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.ob-header.is-nav-open .ob-navtoggle span:nth-child(2){opacity:0}
.ob-header.is-nav-open .ob-navtoggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ---- Mega menu ------------------------------------------------------- */
.ob-has-mega{position:relative}
.ob-has-mega>a{display:inline-flex;align-items:center;gap:5px}
.ob-has-mega>a::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg) translate(-1px,-1px);opacity:.6;transition:transform .2s var(--ob-ease,ease)}
.ob-has-mega:hover>a::after,.ob-has-mega:focus-within>a::after{transform:rotate(225deg) translate(-2px,-2px)}
.ob-mega-toggle{display:none}
.ob-mega{position:absolute;top:calc(100% + 10px);left:0;z-index:60;width:min(680px,92vw);
  background:#fff;border:1px solid #E6EEF1;border-radius:18px;box-shadow:0 26px 60px rgba(22,58,95,.16);
  padding:24px;opacity:0;visibility:hidden;transform:translateY(10px);pointer-events:none;
  transition:opacity .22s var(--ob-ease-out,ease),transform .22s var(--ob-ease-out,ease),visibility .22s}
.ob-mega::before{content:"";position:absolute;top:-18px;left:0;right:0;height:18px} /* hover bridge */
.ob-has-mega:hover .ob-mega,.ob-has-mega:focus-within .ob-mega{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.ob-mega__inner{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:14px 22px;padding:0}
.ob-mega__head{display:block;font-family:Manrope;font-weight:800;font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--color-teal-dark);margin:0 0 10px}
.ob-mega__col>a{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:12px;
  color:var(--color-charcoal);transition:background .15s}
.ob-mega__col>a:hover{background:var(--color-mint);text-decoration:none}
.ob-mega__col>a span{display:flex;flex-direction:column;line-height:1.25}
.ob-mega__col>a strong{font-family:Manrope;font-weight:700;color:var(--color-navy);font-size:.92rem}
.ob-mega__col>a em{font-style:normal;font-size:.78rem;color:var(--color-charcoal);opacity:.72}
.ob-mega__col>a .ob-icon{flex:0 0 22px}
.ob-mega__feature{display:flex;flex-direction:column;border-radius:14px;overflow:hidden;
  background:var(--color-mint);color:var(--color-navy)}
.ob-mega__feature:hover{text-decoration:none}
.ob-mega__feature .ob-photo{border-radius:0}
.ob-mega__feature-body{padding:14px 16px;display:flex;flex-direction:column;gap:3px}
.ob-mega__feature-body strong{font-family:Manrope;font-weight:800;font-size:.95rem;color:var(--color-navy)}
.ob-mega__feature-body em{font-style:normal;font-size:.78rem;color:var(--color-charcoal);opacity:.8}
.ob-mega__feature-cta{font-family:Manrope;font-weight:700;font-size:.82rem;color:var(--color-teal-dark);margin-top:4px}
.ob-mega__feature:hover .ob-mega__feature-cta{color:var(--color-navy)}

/* Sections */
.ob-section{padding:72px 0}
.ob-section--alt{background:var(--color-bg-alt)}
.ob-section--navy{background:var(--color-navy);color:#fff}
.ob-section--navy h2{color:#fff}
.ob-section__title{text-align:center;margin-bottom:40px}
.ob-grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.ob-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}

/* Hero */
.ob-hero{background:linear-gradient(180deg,var(--color-mint) 0%,#fff 100%);padding:56px 0}
.ob-hero__inner{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.ob-lead{font-size:1.15rem;max-width:46ch}
.ob-hero__cta{display:flex;gap:14px;flex-wrap:wrap;margin:24px 0 18px}
.ob-hero__trust{display:flex;gap:22px;list-style:none;margin:0;padding:0;flex-wrap:wrap;font-size:.9rem;font-weight:600;color:var(--color-charcoal)}
.ob-hero__trust li{display:flex;align-items:center;gap:8px}
.ob-hero__media{display:flex;justify-content:center}
.ob-hero__media img{max-width:380px;filter:drop-shadow(0 20px 40px rgba(22,58,95,.12))}

/* Trust badges + steps */
.ob-trustbar{padding:48px 0}
.ob-badge{text-align:center}
.ob-badge__ic,.ob-step__ic{display:inline-flex;align-items:center;justify-content:center;width:60px;height:60px;border-radius:50%;background:var(--color-mint);margin-bottom:12px}
.ob-section--alt .ob-step__ic{background:#fff}
.ob-badge p,.ob-step p{font-size:.92rem;color:var(--color-charcoal);margin:0}
.ob-step{position:relative;text-align:center}
.ob-step__num{position:absolute;top:-6px;left:50%;transform:translateX(-50%);font-family:Manrope;font-weight:800;color:var(--color-teal);font-size:.85rem}

/* CTA band */
.ob-cta__inner{text-align:center;max-width:620px;margin:0 auto}
.ob-cta__ic{display:inline-flex;width:88px;height:88px;border-radius:50%;background:rgba(255,255,255,.12);align-items:center;justify-content:center;margin-bottom:14px}
.ob-cta p{color:rgba(255,255,255,.85);font-size:1.05rem;margin-bottom:24px}

/* FDA */
.ob-fda{padding:28px 0;background:#F7FBFA}
.ob-fda p{max-width:840px;margin:0 auto;text-align:center;font-size:.8rem;color:var(--color-charcoal);opacity:.85}

/* Footer */
.ob-footer{background:var(--color-navy);color:#fff;padding:64px 0 28px}
.ob-footer a{color:rgba(255,255,255,.8)}
.ob-footer a:hover{color:#fff}
.ob-footer__top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:48px}
.ob-footer__brand img{height:52px;width:auto;margin-bottom:14px}
.ob-footer__brand p{color:rgba(255,255,255,.8);font-size:.92rem}
.ob-footer__news-label{font-weight:600;color:#fff}
.ob-footer__news{display:flex;gap:8px}
.ob-footer__news input{flex:1;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;border-radius:24px;padding:10px 16px}
.ob-footer__news input::placeholder{color:rgba(255,255,255,.6)}
.ob-footer__col h4{color:#fff}
.ob-footer__col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;font-size:.92rem}
.ob-footer__bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid rgba(255,255,255,.15);margin-top:40px;padding-top:24px;font-size:.85rem;color:rgba(255,255,255,.7)}
.ob-footer__social{display:flex;gap:14px}
.ob-social{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,.08);color:#fff;transition:background .2s var(--ob-ease,ease),transform .2s var(--ob-ease,ease)}
.ob-social:hover{background:var(--color-teal-dark);color:#fff;transform:translateY(-2px);text-decoration:none}
.ob-footer__disclaimer{font-size:.72rem;color:rgba(255,255,255,.55);line-height:1.5;margin-top:18px}

/* WooCommerce base alignment with brand */
.woocommerce ul.products{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:0;padding:0;list-style:none}
.woocommerce ul.products li.product{width:auto;float:none;margin:0;text-align:left;background:var(--color-mint);border:1px solid #E3EBEF;border-radius:18px;padding:20px;display:flex;flex-direction:column}
.woocommerce ul.products li.product img{width:100%;border-radius:10px;margin:0 0 12px}
.woocommerce ul.products li.product .button{white-space:nowrap;align-self:flex-start;margin-top:auto}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:Manrope;font-weight:700;color:var(--color-navy);font-size:1.1rem;padding:.5em 0 .25em}
.woocommerce ul.products li.product .price{color:var(--color-navy);font-weight:800}
.woocommerce ul.products li.product a.button,
.woocommerce a.button,.woocommerce button.button,.woocommerce #respond input#submit,
.woocommerce .single_add_to_cart_button{background:var(--color-cta-bg)!important;color:#fff!important;border-radius:26px!important;font-family:Manrope;font-weight:700;padding:11px 22px!important}
.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .single_add_to_cart_button:hover{background:var(--color-cta-bg-hover)!important}
.ob-main{padding:48px 0}

/* PDP */
.woocommerce div.product .product_title{font-family:Manrope;font-weight:800;color:var(--color-navy)}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--color-navy);font-weight:800;font-size:1.6rem}
.ob-pdp-express{font-size:.82rem;color:var(--color-charcoal);opacity:.7;margin:10px 0 0}
.ob-pdp-trust{list-style:none;display:flex;gap:18px;flex-wrap:wrap;margin:18px 0 0;padding:16px 0 0;border-top:1px solid #E3EBEF}
.ob-pdp-trust li{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.78rem;font-weight:600;color:var(--color-charcoal);text-align:center;flex:1;min-width:80px}
.ob-pdp-fda{margin-top:18px;font-size:.78rem;color:var(--color-charcoal);opacity:.75;line-height:1.5}
.woocommerce div.product form.cart .button{padding:14px 30px!important;font-size:1rem}

/* Responsive */
@media(max-width:900px){
  .ob-hero__inner{grid-template-columns:1fr;text-align:center}
  .ob-hero__media{order:-1}
  .ob-hero__cta,.ob-hero__trust{justify-content:center}
  .ob-grid-4{grid-template-columns:repeat(2,1fr)}
  .ob-grid-3{grid-template-columns:1fr}
  .ob-footer__top{grid-template-columns:1fr 1fr}
  .woocommerce ul.products{grid-template-columns:repeat(2,1fr)}
  .ob-navtoggle{display:flex}
  .ob-account{display:none}
  .ob-nav{position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:1px solid #E3EBEF;
    box-shadow:0 18px 40px rgba(22,58,95,.12);max-height:0;overflow:hidden;transition:max-height .3s var(--ob-ease,ease)}
  .ob-header.is-nav-open .ob-nav{max-height:80vh}
  .ob-menu{flex-direction:column;gap:0;padding:8px 0}
  .ob-menu li{border-bottom:1px solid #F0F4F6}
  .ob-menu a{display:block;padding:15px 24px;font-size:1rem}
  .ob-menu a::after{display:none}
  /* Mega → mobile accordion */
  .ob-has-mega{position:static}
  .ob-has-mega>a{display:flex;justify-content:space-between}
  .ob-has-mega>a::after{display:none}
  .ob-mega-toggle{display:flex;align-items:center;justify-content:center;position:absolute;right:8px;
    width:54px;height:54px;margin-top:-54px;background:none;border:0;cursor:pointer}
  .ob-mega-toggle::after{content:"";width:9px;height:9px;border-right:2px solid var(--color-navy);
    border-bottom:2px solid var(--color-navy);transform:rotate(45deg);transition:transform .2s ease}
  .ob-has-mega.is-open .ob-mega-toggle::after{transform:rotate(225deg)}
  .ob-menu li.ob-has-mega{position:relative}
  .ob-mega{position:static;width:auto;opacity:1;visibility:visible;transform:none;pointer-events:auto;
    box-shadow:none;border:0;border-radius:0;background:#F7FBFA;padding:0;display:none}
  .ob-has-mega.is-open .ob-mega{display:block}
  .ob-mega__inner{grid-template-columns:1fr;gap:6px;padding:6px 12px 16px}
  .ob-mega__feature{flex-direction:row;align-items:center}
  .ob-mega__feature .ob-photo{width:84px;flex:0 0 84px}
}
@media(max-width:560px){
  .ob-grid-4{grid-template-columns:1fr}
  .ob-footer__top{grid-template-columns:1fr}
  .woocommerce ul.products{grid-template-columns:1fr}
}

/* =====================================================================
   PAGE KIT — reusable components used across all built-out templates.
   Keep every new page on these classes (no per-page CSS sprawl).
   ===================================================================== */

/* --- Image placeholder + photo ratios --------------------------------- */
.ob-photo{display:block;width:100%;border-radius:16px;object-fit:cover}
.ob-imgph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  background:linear-gradient(135deg,var(--color-mint),#EAF7F4);color:var(--color-teal-dark);
  border:1px dashed rgba(31,122,112,.35);text-align:center;padding:18px;min-height:120px}
.ob-imgph__ic{font-size:1.8rem;line-height:1;opacity:.7}
.ob-imgph__label{font-family:Manrope;font-weight:700;font-size:.8rem;letter-spacing:.02em;opacity:.85;max-width:90%}
.ob-ratio-1x1{aspect-ratio:1/1}
.ob-ratio-4x3{aspect-ratio:4/3}
.ob-ratio-3x2{aspect-ratio:3/2}
.ob-ratio-16x9{aspect-ratio:16/9}
.ob-ratio-3x4{aspect-ratio:3/4}
.ob-ratio-21x9{aspect-ratio:21/9}

/* --- Page hero (interior pages) --------------------------------------- */
.ob-phero{background:linear-gradient(180deg,var(--color-mint) 0%,#fff 100%);padding:60px 0 48px;text-align:center}
.ob-phero__inner{max-width:760px;margin:0 auto}
.ob-phero p.ob-lead{margin-left:auto;margin-right:auto}
.ob-phero--split{text-align:left}
.ob-phero--split .ob-phero__inner{max-width:none}

/* --- Generic split section (text + media) ----------------------------- */
.ob-split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.ob-split--media-right .ob-split__media{order:2}
.ob-split__media .ob-photo{box-shadow:0 18px 40px rgba(22,58,95,.10)}
.ob-split__copy p:last-child{margin-bottom:0}

/* --- Prose / rich text ------------------------------------------------ */
.ob-prose{max-width:720px;margin:0 auto}
.ob-prose h2{margin-top:1.6em}
.ob-prose h3{font-family:Manrope;color:var(--color-navy);font-size:1.25rem;font-weight:700;margin:1.4em 0 .4em}
.ob-prose ul,.ob-prose ol{padding-left:1.2em;margin:0 0 1em}
.ob-prose li{margin:.3em 0}
.ob-prose blockquote{border-left:4px solid var(--color-teal);background:var(--color-mint);
  margin:1.4em 0;padding:16px 22px;border-radius:0 12px 12px 0;font-size:1.05rem;color:var(--color-navy)}
.ob-prose img,.ob-prose .ob-photo{margin:1.4em 0}
/* Emphasis callout card used in legal/prose pages */
.ob-emphasis{background:var(--color-mint);border:1px solid #CFEAE6;border-radius:14px;
  padding:18px 22px;margin:1.6em 0}
.ob-emphasis>:last-child{margin-bottom:0}

/* Sticky add-to-cart bar (base — PDP variants in pdp.css) */
.ob-sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;
  border-top:1px solid #E3EBEF;box-shadow:0 -8px 24px rgba(22,58,95,.10);
  transform:translateY(110%);transition:transform .3s var(--ob-ease,ease);padding:12px 0}
.ob-sticky-cta.is-visible{transform:translateY(0)}
.ob-sticky-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:16px}
.ob-sticky-cta__info{display:flex;align-items:center;gap:12px;font-family:Manrope;font-weight:700;color:var(--color-navy)}
.ob-sticky-cta__btn{white-space:nowrap}

/* --- Cards ------------------------------------------------------------ */
.ob-card{background:#fff;border:1px solid #E3EBEF;border-radius:18px;padding:26px;height:100%}
.ob-card--mint{background:var(--color-mint);border-color:#CFEAE6}
.ob-card__ic{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;
  border-radius:14px;background:var(--color-mint);margin-bottom:14px}
.ob-card--mint .ob-card__ic{background:#fff}
.ob-card h3,.ob-card h4{color:var(--color-navy)}
.ob-card p:last-child{margin-bottom:0}

/* --- Accordion / FAQ -------------------------------------------------- */
.ob-accordion{max-width:760px;margin:0 auto;border-top:1px solid #E3EBEF}
.ob-acc{border-bottom:1px solid #E3EBEF}
.ob-acc__q{width:100%;text-align:left;background:none;border:0;cursor:pointer;
  font-family:Manrope;font-weight:700;font-size:1.05rem;color:var(--color-navy);
  padding:20px 40px 20px 0;position:relative}
.ob-acc__q::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-50%);
  font-size:1.4rem;color:var(--color-teal-dark);transition:transform .2s}
.ob-acc[open] .ob-acc__q::after{content:"\2212"}
.ob-acc__a{padding:0 0 20px;color:var(--color-charcoal)}
.ob-acc__a p:last-child{margin-bottom:0}

/* --- Review / testimonial cards --------------------------------------- */
.ob-reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ob-review{background:#fff;border:1px solid #E3EBEF;border-radius:18px;padding:24px;display:flex;flex-direction:column;gap:12px}
.ob-stars{color:#E8A23B;font-size:1rem;letter-spacing:2px}
.ob-review__body{color:var(--color-charcoal);margin:0}
.ob-review__who{display:flex;align-items:center;gap:12px;margin-top:auto}
.ob-review__who .ob-photo{width:44px;height:44px;min-height:0;border-radius:50%;flex:0 0 44px;overflow:hidden;padding:0}
.ob-review__who .ob-imgph__label{display:none}
.ob-review__who .ob-imgph__ic{font-size:.9rem;margin:0}
.ob-review__name{font-family:Manrope;font-weight:700;color:var(--color-navy);font-size:.92rem;margin:0;line-height:1.2}
.ob-review__verified{font-size:.75rem;color:var(--color-teal-dark);font-weight:600}
.ob-rating-summary{display:flex;flex-direction:column;align-items:center;gap:6px;margin-bottom:36px}
.ob-rating-summary .ob-stars{font-size:1.5rem}
.ob-rating-summary strong{font-family:Manrope;font-size:2.4rem;color:var(--color-navy)}

/* --- Stat band -------------------------------------------------------- */
.ob-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;text-align:center}
.ob-stat strong{display:block;font-family:Manrope;font-weight:800;font-size:2.4rem;color:var(--color-teal-dark);line-height:1}
.ob-stat span{font-size:.92rem;color:var(--color-charcoal)}
.ob-section--navy .ob-stat strong{color:#fff}
.ob-section--navy .ob-stat span{color:rgba(255,255,255,.8)}

/* --- Blog cards ------------------------------------------------------- */
.ob-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.ob-postcard{background:#fff;border:1px solid #E3EBEF;border-radius:18px;overflow:hidden;display:flex;flex-direction:column}
.ob-postcard .ob-photo{border-radius:0}
.ob-postcard__body{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.ob-postcard__cat{font-family:Manrope;font-weight:700;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--color-teal-dark)}
.ob-postcard h3{font-size:1.15rem;margin:0}
.ob-postcard h3 a{color:var(--color-navy)}
.ob-postcard__meta{margin-top:auto;font-size:.82rem;color:var(--color-charcoal);opacity:.7}

/* --- Breadcrumb ------------------------------------------------------- */
.ob-crumbs{font-size:.82rem;color:var(--color-charcoal);opacity:.75;margin:0 0 18px}
.ob-crumbs a{color:var(--color-teal-dark)}

/* --- Advertorial ------------------------------------------------------ */
.ob-adv{max-width:720px;margin:0 auto}
.ob-adv__kicker{font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;color:var(--color-charcoal);opacity:.7;margin-bottom:10px}
.ob-adv__byline{font-size:.88rem;color:var(--color-charcoal);opacity:.75;border-bottom:1px solid #E3EBEF;padding-bottom:18px;margin-bottom:24px}
.ob-adv__cta{background:var(--color-mint);border-radius:18px;padding:28px;text-align:center;margin:32px 0}
.ob-adv__disclaimer{font-size:.75rem;color:var(--color-charcoal);opacity:.65;border-top:1px solid #E3EBEF;margin-top:32px;padding-top:18px}

/* --- Quiz ------------------------------------------------------------- */
.ob-quiz{max-width:640px;margin:0 auto;text-align:center}
.ob-quiz__progress{height:6px;background:#E3EBEF;border-radius:3px;overflow:hidden;margin-bottom:28px}
.ob-quiz__bar{height:100%;background:var(--color-teal-dark);transition:width .3s}
.ob-quiz__step{display:none}
.ob-quiz__step.is-active{display:block;animation:obFade .3s ease}
@keyframes obFade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.ob-quiz__opts{display:flex;flex-direction:column;gap:12px;margin:24px 0;text-align:left}
.ob-quiz__opt{display:flex;align-items:center;gap:14px;border:2px solid #E3EBEF;border-radius:14px;
  padding:16px 20px;cursor:pointer;font-weight:600;color:var(--color-navy);background:#fff;transition:border-color .15s,background .15s}
.ob-quiz__opt:hover{border-color:var(--color-teal)}
.ob-quiz__opt.is-sel{border-color:var(--color-teal-dark);background:var(--color-mint)}
.ob-quiz__form{display:flex;flex-direction:column;gap:14px;max-width:420px;margin:24px auto 0}
.ob-field{display:flex;flex-direction:column;gap:6px;text-align:left}
.ob-field label{font-weight:600;font-size:.9rem;color:var(--color-navy)}
.ob-input{border:1px solid #CBD7DF;border-radius:12px;padding:13px 16px;font-size:1rem;font-family:inherit;width:100%}
.ob-input:focus{outline:2px solid var(--color-teal);border-color:var(--color-teal)}

/* --- Offer page ------------------------------------------------------- */
.ob-offer__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:8px 0 28px}
.ob-plan{border:2px solid #E3EBEF;border-radius:18px;padding:24px;text-align:center;background:#fff;position:relative}
.ob-plan--best{border-color:var(--color-teal-dark);box-shadow:0 14px 34px rgba(31,122,112,.12)}
.ob-plan__tag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--color-teal-dark);
  color:#fff;font-family:Manrope;font-weight:700;font-size:.72rem;padding:5px 14px;border-radius:20px;white-space:nowrap}
.ob-plan__price{font-family:Manrope;font-weight:800;font-size:2rem;color:var(--color-navy);margin:8px 0 2px}
.ob-plan__per{font-size:.85rem;color:var(--color-charcoal);opacity:.7}
.ob-plan__save{display:inline-block;margin-top:8px;font-size:.8rem;font-weight:700;color:var(--color-teal-dark);background:var(--color-mint);padding:4px 12px;border-radius:20px}

/* --- Contact ---------------------------------------------------------- */
.ob-contact{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.ob-contact__methods{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:16px}
.ob-contact__methods li{display:flex;gap:12px;align-items:flex-start}
.ob-form{display:flex;flex-direction:column;gap:16px}
.ob-form textarea.ob-input{min-height:140px;resize:vertical}

/* --- Section helpers -------------------------------------------------- */
.ob-center{text-align:center}
.ob-section__lead{max-width:640px;margin:-24px auto 40px;text-align:center;color:var(--color-charcoal)}
.ob-cta-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:8px}

/* --- Page-kit responsive --------------------------------------------- */
@media(max-width:900px){
  .ob-split{grid-template-columns:1fr;gap:32px}
  .ob-split--media-right .ob-split__media{order:-1}
  .ob-reviews-grid,.ob-posts{grid-template-columns:1fr 1fr}
  .ob-stats{grid-template-columns:1fr 1fr}
  .ob-offer__grid{grid-template-columns:1fr}
  .ob-contact{grid-template-columns:1fr}
}
@media(max-width:560px){
  .ob-reviews-grid,.ob-posts,.ob-stats{grid-template-columns:1fr}
}

/* =====================================================================
   MOTION KIT — premium, restrained animation. GPU-only props
   (opacity/transform). Everything degrades to instant under reduced-motion.
   Apply data-ob-reveal on elements; data-ob-delay="120" to stagger.
   ===================================================================== */
:root{--ob-ease:cubic-bezier(.22,.61,.36,1);--ob-ease-out:cubic-bezier(.16,1,.3,1)}

/* Base reveal — fade + rise */
[data-ob-reveal]{opacity:0;transform:translateY(26px);
  transition:opacity .7s var(--ob-ease-out),transform .7s var(--ob-ease-out);will-change:opacity,transform}
[data-ob-reveal].is-in{opacity:1;transform:none}
/* Reveal variants */
[data-ob-reveal="left"]{transform:translateX(-32px)}
[data-ob-reveal="right"]{transform:translateX(32px)}
[data-ob-reveal="zoom"]{transform:scale(.94)}
[data-ob-reveal="left"].is-in,[data-ob-reveal="right"].is-in,[data-ob-reveal="zoom"].is-in{transform:none}

/* Choreographed stagger: children of a [data-ob-stagger] reveal in sequence */
[data-ob-stagger]>*{opacity:0;transform:translateY(22px);
  transition:opacity .6s var(--ob-ease-out),transform .6s var(--ob-ease-out)}
[data-ob-stagger].is-in>*{opacity:1;transform:none}
[data-ob-stagger].is-in>*:nth-child(1){transition-delay:.04s}
[data-ob-stagger].is-in>*:nth-child(2){transition-delay:.12s}
[data-ob-stagger].is-in>*:nth-child(3){transition-delay:.20s}
[data-ob-stagger].is-in>*:nth-child(4){transition-delay:.28s}
[data-ob-stagger].is-in>*:nth-child(5){transition-delay:.36s}
[data-ob-stagger].is-in>*:nth-child(6){transition-delay:.44s}

/* Hero entrance on load (no observer needed — above the fold) */
.ob-hero__copy>*{opacity:0;transform:translateY(20px);animation:obRise .8s var(--ob-ease-out) forwards}
.ob-hero__copy>*:nth-child(1){animation-delay:.05s}
.ob-hero__copy>*:nth-child(2){animation-delay:.14s}
.ob-hero__copy>*:nth-child(3){animation-delay:.23s}
.ob-hero__copy>*:nth-child(4){animation-delay:.32s}
.ob-hero__copy>*:nth-child(5){animation-delay:.41s}
.ob-hero__media{opacity:0;animation:obFloatIn 1s var(--ob-ease-out) .25s forwards}
@keyframes obRise{to{opacity:1;transform:none}}
@keyframes obFloatIn{from{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:none}}

/* Gentle continuous float on hero product/media */
@media(min-width:901px){
  .ob-hero__media img,.ob-hero__media .ob-photo{animation:obFloat 6s ease-in-out 1.2s infinite}
}
@keyframes obFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

/* Premium micro-interactions */
.ob-btn{transition:background .2s var(--ob-ease),transform .2s var(--ob-ease),box-shadow .2s var(--ob-ease);will-change:transform}
.ob-btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(31,122,112,.28)}
.ob-btn:active{transform:translateY(0)}
.ob-card,.ob-postcard,.ob-review,.ob-plan,.woocommerce ul.products li.product{
  transition:transform .28s var(--ob-ease),box-shadow .28s var(--ob-ease),border-color .2s var(--ob-ease)}
.ob-card:hover,.ob-postcard:hover,.ob-review:hover,.woocommerce ul.products li.product:hover{
  transform:translateY(-4px);box-shadow:0 16px 38px rgba(22,58,95,.12)}
.ob-plan:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(22,58,95,.14)}
.ob-postcard .ob-photo{overflow:hidden}
.ob-postcard img.ob-photo{transition:transform .5s var(--ob-ease)}
.ob-postcard:hover img.ob-photo{transform:scale(1.05)}
.ob-menu a{position:relative}
.ob-menu li:not(.ob-has-mega)>a::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:2px;
  background:var(--color-teal-dark);transition:right .25s var(--ob-ease)}
.ob-menu li:not(.ob-has-mega)>a:hover::after{right:0}
.ob-acc__q{transition:color .2s var(--ob-ease)}
.ob-acc__q:hover{color:var(--color-teal-dark)}

/* Sticky header subtle shadow on scroll (class toggled would need JS; use shadow always-soft) */
.ob-header{transition:box-shadow .3s var(--ob-ease)}
.ob-header.is-stuck{box-shadow:0 6px 24px rgba(22,58,95,.08)}

/* PAGE: faq — category jump-pills + group headers (tokens only) */
.ob-faqnav{padding:24px 0 8px}
.ob-faqnav__row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:760px;margin:0 auto}
.ob-faqnav__pill{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:24px;
  border:1.5px solid var(--color-teal-dark);color:var(--color-teal-dark);background:#fff;
  font-family:Manrope;font-weight:700;font-size:.9rem;line-height:1;
  transition:background .2s var(--ob-ease),color .2s var(--ob-ease)}
.ob-faqnav__pill:hover{background:var(--color-mint);text-decoration:none}
.ob-faqgroup{max-width:760px;margin:0 auto 40px;scroll-margin-top:88px}
.ob-faqgroup:last-child{margin-bottom:0}
.ob-faqgroup__title{display:flex;align-items:center;gap:12px;font-size:1.4rem;color:var(--color-navy);margin:0 0 8px}
.ob-faqgroup__ic{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border-radius:50%;background:var(--color-mint);flex:0 0 auto}
.ob-faq-fda{margin-top:10px}

/* Respect user preference — kill all motion, show everything */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  [data-ob-reveal],[data-ob-stagger]>*,.ob-hero__copy>*,.ob-hero__media{opacity:1!important;transform:none!important}
}

/* PAGE: advertorial — self-contained editorial landing page (no store chrome).
   Tokens only; mirrors the ~700px editorial column from the spec. */
.ob-advbar{background:var(--color-mint);color:var(--color-charcoal);text-align:center;
  font-size:.81rem;line-height:1.4;padding:9px 16px}
.ob-advbar strong{font-family:Manrope;font-weight:800;letter-spacing:.04em}
.ob-advhead{background:#fff;border-bottom:1px solid #E2E8F0}
.ob-advhead__inner{max-width:980px;margin:0 auto;padding:0 20px;height:56px;
  display:flex;align-items:center;justify-content:space-between}
.ob-advhead__brand{display:inline-flex;align-items:center;gap:9px;color:var(--color-navy)}
.ob-advhead__brand:hover{text-decoration:none}
.ob-advhead__dot{width:14px;height:14px;border-radius:50%;
  background:var(--color-teal);box-shadow:0 0 0 4px var(--color-mint)}
.ob-advhead__word{font-family:Manrope;font-weight:800;font-size:1.1rem;letter-spacing:-.01em}
.ob-advhead__cat{font-size:.85rem;color:var(--color-charcoal);opacity:.6}
.ob-advmain{max-width:720px;padding:36px 20px 8px}
.ob-advmain__h1{font-size:clamp(1.85rem,5vw,2.4rem);margin:.1em 0 .35em}
.ob-advmain__subhead{font-size:1.18rem;color:var(--color-charcoal);line-height:1.5;margin:0 0 4px}
.ob-advmain__hero{margin:0 0 28px}
.ob-advmain__hero figcaption,.ob-advmain__sciimg figcaption{
  font-size:.82rem;font-style:italic;color:var(--color-charcoal);opacity:.7;
  text-align:center;margin-top:10px}
.ob-advmain__body{margin:0}
.ob-advmain__body p{margin:0 0 1.1em}
.ob-advmain__body h2{font-family:Manrope;color:var(--color-navy);
  font-size:clamp(1.4rem,3.6vw,1.7rem);font-weight:800;margin:1.6em 0 .5em}
.ob-advmain__pull{font-family:Manrope;font-weight:700;color:var(--color-navy);
  font-size:1.4rem;line-height:1.35;border-left:4px solid var(--color-teal-dark);
  background:transparent;border-radius:0;margin:1.6em 0;padding:6px 0 6px 22px}
.ob-advmain__sciimg{margin:1.8em 0}
.ob-advmain__routine{margin:1.6em 0}
.ob-advmain__study{display:flex;gap:16px;align-items:flex-start;background:var(--color-mint);
  border-radius:18px;padding:22px 24px;margin:1.8em 0}
.ob-advmain__study-ic{flex:0 0 auto;display:inline-flex}
.ob-advmain__study-body h3{font-family:Manrope;color:var(--color-navy);
  font-size:1.05rem;font-weight:800;margin:0 0 .35em}
.ob-advmain__study-body p{margin:0;color:var(--color-charcoal);font-size:.96rem;line-height:1.55}
.ob-advmain__inlinecta{margin:1.4em 0;font-family:Manrope;font-weight:700;font-size:1.02rem}
.ob-advmain__inlinecta a{color:var(--color-teal-dark)}
.ob-advmain__cards{margin:1.8em 0}
.ob-advmain__cards .ob-card p{font-size:.92rem}
.ob-advmain__proof{margin:2em 0 0}
.ob-advmain__h2{font-family:Manrope;color:var(--color-navy);
  font-size:clamp(1.4rem,3.6vw,1.7rem);font-weight:800;margin:0 0 .4em}
.ob-advmain__disclosure{font-size:.82rem;color:var(--color-charcoal);opacity:.75;
  line-height:1.5;margin:0 0 22px}
.ob-review__sample{align-self:flex-start;font-size:.68rem;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;color:var(--color-teal-dark);
  background:var(--color-mint);border-radius:20px;padding:3px 10px}
.ob-advmain__cta{margin:2.4em 0 1.6em}
.ob-advmain__cta h2{font-family:Manrope;color:var(--color-navy);font-size:1.55rem;margin:0 0 .4em}
.ob-advmain__cta p{color:var(--color-charcoal);margin:0 0 18px}
.ob-advmain__cta .ob-btn{min-height:48px}
.ob-advmain__cta-alt{margin:18px 0 0!important}
.ob-advmain__cta-alt a{color:var(--color-teal-dark);font-weight:600}
.ob-advmain__fda{border-top:1px solid #E2E8F0;margin-top:30px;padding-top:20px}
.ob-advmain__fda-main{font-size:.88rem;color:var(--color-charcoal);line-height:1.55;margin:0 0 .6em}
.ob-advmain__fda-sub{font-size:.8rem;color:var(--color-charcoal);opacity:.7;line-height:1.55;margin:0}
.ob-advfoot{background:#fff;border-top:1px solid #E2E8F0;margin-top:24px}
.ob-advfoot__inner{max-width:720px;margin:0 auto;padding:24px 20px;text-align:center}
.ob-advfoot__links{font-size:.84rem;color:var(--color-charcoal);opacity:.8;margin:0 0 6px}
.ob-advfoot__links a{color:var(--color-teal-dark)}
.ob-advfoot__note{font-size:.76rem;color:var(--color-charcoal);opacity:.55;margin:0}
@media(max-width:560px){
  .ob-advmain__study{flex-direction:column;gap:12px}
}

/* PAGE: quiz — landing-only bits not in the shared kit (minimal header/footer,
   intro card, reassurance row, selected-check, recap/results). Tokens only. */
.ob-lp{background:var(--color-mint)}
.ob-lp__head{text-align:center;padding:20px 16px;background:#fff;border-bottom:1px solid #E2E8F0}
.ob-lp__head .ob-logo{display:inline-block}
.ob-lp__main{background:var(--color-mint)}
.ob-lp .ob-content-narrow{max-width:600px}
.ob-quiz .ob-quiz__step:not(.ob-lp__results){background:#fff;border-radius:18px;padding:32px 28px;box-shadow:0 14px 34px rgba(22,58,95,.06)}
.ob-quiz .ob-quiz__step.is-active{display:block}
.ob-lp__intro h1{font-size:clamp(1.7rem,5vw,2.1rem);color:var(--color-navy);margin:.2em 0 .4em}
.ob-lp__reassure{list-style:none;margin:18px 0;padding:0;display:flex;flex-wrap:wrap;gap:18px;justify-content:center;font-size:.82rem;font-weight:600;color:var(--color-charcoal)}
.ob-lp__reassure li{display:inline-flex;align-items:center;gap:7px}
.ob-lp__introimg{margin:18px 0 22px}
.ob-lp__full{width:100%}
.ob-lp__micro{font-size:.78rem;margin:10px 0 0}
.ob-lp__count{font-size:.8rem;font-weight:700;letter-spacing:.04em;color:var(--color-teal-dark);text-transform:uppercase;margin:0 0 4px;display:inline-flex;align-items:center;gap:6px}
.ob-lp__q{font-size:clamp(1.3rem,4vw,1.6rem);color:var(--color-navy);margin:0 0 4px}
.ob-quiz__opt svg,.ob-quiz__opt img{flex:0 0 auto}
/* selected state: never color-only — add a check glyph + weight (a11y) */
.ob-quiz__opt.is-sel::after{content:"\2713";margin-left:auto;color:var(--color-teal-dark);font-weight:800}
.ob-lp__back{background:none;border:0;color:var(--color-charcoal);font-weight:600;font-size:.9rem;cursor:pointer;padding:14px 0 0;display:inline-block}
.ob-lp__back:hover{color:var(--color-navy)}
.ob-lp__skip{background:none;border:0;color:var(--color-charcoal);opacity:.75;text-decoration:underline;font-size:.85rem;cursor:pointer;margin:8px 0;display:inline-block}
.ob-lp__consent{font-size:.72rem;margin:2px 0 0;line-height:1.5}
.ob-lp__results{text-align:left}
.ob-lp__results .ob-eyebrow,.ob-lp__results .ob-lp__q{text-align:center}
.ob-lp__recap,.ob-lp__rec,.ob-lp__science{margin:18px 0;text-align:left}
.ob-lp__rec .ob-photo{margin:14px 0 8px}
.ob-lp__subh{color:var(--color-navy);margin:26px 0 12px;text-align:center}
.ob-lp__proof{margin:18px 0}
.ob-lp__cta{margin:24px 0 8px;justify-content:center}
.ob-lp__fda{background:transparent;padding:18px 0 0;border-top:1px solid #CFEAE6;margin-top:22px}
.ob-lp__fda p{text-align:left}
.ob-lp__foot{text-align:center;padding:32px 16px;background:#fff;border-top:1px solid #E2E8F0}
.ob-lp__foot p{margin:0;font-size:.82rem}

/* PAGE: the-science --------------------------------------------------- */
/* Pillar/E-E-A-T page only. Tokens only — navy hero variant, reading-
   progress bar, sticky in-page TOC, byline chip, references, captions. */
.ob-phero--navy{background:var(--color-navy);color:#fff;padding:64px 0 52px}
.ob-phero--navy h1{color:#fff}
.ob-phero--navy .ob-lead{color:rgba(255,255,255,.88)}
.ob-phero--navy .ob-eyebrow{color:var(--color-teal)}
.ob-phero__byline{font-size:.88rem;color:rgba(255,255,255,.85);margin:18px 0 0;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px}
.ob-phero__byline strong{color:#fff;font-weight:700}
.ob-chip{display:inline-flex;align-items:center;gap:6px;background:rgba(42,161,152,.18);
  color:#fff;border:1px solid rgba(42,161,152,.5);border-radius:20px;
  padding:4px 12px;font-size:.74rem;font-weight:700;letter-spacing:.02em}

/* Reading-progress bar — fixed strip under the sticky header */
.ob-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:60;
  background:transparent;pointer-events:none}
.ob-progress__bar{display:block;height:100%;width:0;background:var(--color-teal);
  transition:width .08s linear}

/* In-page table of contents (sticky on desktop) */
.ob-toc{padding:14px 0}
.ob-toc__list{display:flex;flex-wrap:wrap;gap:10px 22px;list-style:none;margin:0;
  padding:0;justify-content:center}
.ob-toc__list a{display:inline-flex;align-items:center;min-height:44px;
  color:var(--color-teal-dark);font-weight:600;font-size:.92rem}
@media(min-width:900px){.ob-toc{position:sticky;top:64px;z-index:30}}

/* Figure caption under split media */
.ob-figcaption{font-size:.82rem;margin:10px 0 0;text-align:center}

/* Superscript citation links */
.ob-prose sup a,.ob-card sup a{color:var(--color-teal-dark);font-weight:700;text-decoration:none}

/* Reference / source list */
.ob-refs{padding-left:1.4em;margin:0;font-size:.92rem;color:var(--color-charcoal)}
.ob-refs li{margin:.5em 0}
.ob-refs li:target{background:var(--color-mint);border-radius:6px;padding:2px 6px}

/* Inline product-CTA FDA note */
.ob-fda-note{font-size:.78rem;color:var(--color-charcoal);opacity:.8;
  text-align:center;margin:14px auto 0;max-width:620px}

/* Author / reviewer bio block */
.ob-author-bio{margin-top:36px;align-items:center}
.ob-author-bio .ob-split__media .ob-photo{border-radius:18px}

/* PAGE: offer — landing-only chrome the page-kit doesn't already cover.
   Tokens only, transform-only sticky bar (no CLS). Reuses ob-plan / ob-card /
   ob-review / ob-rating-summary / ob-grid-* / ob-split from the kit above.
   Header/footer use hyphenated names (ob-lp-head / ob-lp-foot) so they don't
   collide with the quiz's centered .ob-lp__head / .ob-lp__foot. */
.ob-lp-head{border-bottom:1px solid #E3EBEF;background:#fff}
.ob-lp-head__inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.ob-lp-head__logo{display:inline-flex;align-items:center;gap:10px;font-family:Manrope;font-weight:800;color:var(--color-navy)}
.ob-lp-head__logo:hover{text-decoration:none}
.ob-lp-head__links{display:flex;align-items:center;gap:18px;font-weight:600;font-size:.9rem}
.ob-lp-head__links a{color:var(--color-charcoal)}
.ob-lp-head__cart{display:inline-flex;align-items:center;gap:6px;color:var(--color-navy)}
.ob-offer-hero{display:grid;grid-template-columns:1.05fr 1fr;gap:36px;align-items:start}
.ob-offer-gallery__thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:10px}
.ob-offer-box__rating{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.ob-offer-box__rating:hover{text-decoration:none}
.ob-offer-box__h1{font-size:clamp(1.7rem,4vw,2rem);margin:0 0 .35em}
.ob-offer-box__desc{margin:0 0 18px}
.ob-offer__select{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 0 12px}
.ob-offer__select .ob-plan{cursor:pointer;display:block}
.ob-offer__radio{position:absolute;opacity:0;pointer-events:none}
.ob-plan.is-selected{border-color:var(--color-teal-dark);box-shadow:0 14px 34px rgba(31,122,112,.12)}
.ob-plan__name{display:block;font-family:Manrope;font-weight:700;color:var(--color-navy)}
.ob-plan__cycle{font-size:.9rem;font-weight:600;opacity:.7}
.ob-offer__reassure{display:flex;align-items:center;gap:8px;font-size:.88rem;font-weight:600;color:var(--color-teal-dark);margin:0 0 16px}
.ob-offer__cta{width:100%;margin:6px 0 8px}
.ob-offer__wallets{text-align:center;font-size:.8rem;margin:0 0 14px}
.ob-offer__microtrust{display:flex;flex-wrap:wrap;gap:14px;list-style:none;margin:0 0 14px;padding:0;font-size:.82rem;font-weight:600;color:var(--color-charcoal)}
.ob-offer__microtrust li{display:inline-flex;align-items:center;gap:6px}
.ob-offer__bonus{display:flex;align-items:flex-start;gap:8px;font-size:.86rem;background:var(--color-mint);border-radius:12px;padding:12px 14px;margin:0}
.ob-offer-trust__inner{display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:center}
.ob-offer-trust__list{list-style:none;margin:0;padding:0;display:grid;gap:14px;font-weight:600;color:var(--color-charcoal)}
.ob-offer-trust__list li{display:flex;align-items:center;gap:10px}
.ob-offer-trust__list strong{font-family:Manrope;color:var(--color-navy)}
.ob-offer-guarantee__ic{display:inline-flex;align-items:center;justify-content:center;width:96px;height:96px;border-radius:50%;background:var(--color-mint);margin-bottom:14px}
.ob-review__avatar{width:48px;height:48px;border-radius:50%}
.ob-review__disc{display:block;font-size:.72rem;font-style:italic}
.ob-sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:50;background:#fff;border-top:1px solid #E3EBEF;box-shadow:0 -8px 24px rgba(22,58,95,.10);transform:translateY(110%);transition:transform .3s var(--ob-ease,ease)}
.ob-sticky-cta.is-visible{transform:translateY(0)}
.ob-sticky-cta__inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:10px 0}
.ob-sticky-cta__info{display:inline-flex;align-items:center;gap:10px;font-size:.9rem;color:var(--color-charcoal)}
.ob-sticky-cta__info strong{color:var(--color-navy)}
.ob-sticky-cta__btn{white-space:nowrap;min-height:44px}
.ob-lp-foot{background:var(--color-navy);color:#fff;padding:40px 0 90px}
.ob-lp-foot a{color:#fff}
.ob-lp-foot__links{display:flex;flex-wrap:wrap;gap:6px 18px;justify-content:center;font-size:.85rem;font-weight:600;margin-bottom:14px}
.ob-lp-foot .ob-muted{color:#fff;opacity:.7}
.ob-lp-foot__fda{max-width:760px;margin:0 auto 8px;font-size:.76rem}
@media(max-width:860px){
  .ob-offer-hero,.ob-offer-trust__inner{grid-template-columns:1fr}
}
@media(max-width:560px){
  .ob-offer__select{grid-template-columns:1fr}
}

/* PAGE: reviews — bright-teal star/bar accents, distribution, filter pills,
   sample-notice banner, photo strip, helpful row. Tokens only, on-brand. */
.ob-stars--teal{color:var(--color-teal);letter-spacing:1px;white-space:nowrap}
.ob-stars--teal .ob-star{color:#CFE6E3}              /* outline remainder (non-text accent) */
.ob-stars--teal .ob-star.is-on{color:var(--color-teal)}

/* SAMPLE / FTC notice banner */
.ob-rev-notice{padding:18px 0;background:#FFF8E8}
.ob-rev-notice__inner{max-width:880px;margin:0 auto;font-size:.92rem;color:var(--color-charcoal);
  line-height:1.55;text-align:center}
.ob-rev-notice__tag{display:inline-block;background:var(--color-navy);color:#fff;font-family:Manrope;
  font-weight:700;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;
  border-radius:999px;padding:4px 12px;margin-right:8px;vertical-align:middle}

/* Rating summary 2-col */
.ob-rev-summary{display:grid;grid-template-columns:minmax(220px,1fr) 1.4fr;gap:40px;align-items:center;
  margin-bottom:18px}
.ob-rev-summary__score{text-align:center}
.ob-rev-summary__num{display:flex;align-items:baseline;justify-content:center;gap:8px}
.ob-rev-summary__num strong{font-family:Manrope;font-weight:800;font-size:3.4rem;color:var(--color-navy);line-height:1}
.ob-rev-summary__outof{font-size:.95rem;color:var(--color-charcoal)}
.ob-rev-summary .ob-stars--teal{font-size:1.5rem;display:inline-block;margin:8px 0}
.ob-rev-summary__count{margin:.3em 0;color:var(--color-charcoal)}
.ob-rev-summary__count strong{color:var(--color-navy);font-family:Manrope}
.ob-rev-summary__vbadge{font-size:.84rem;color:var(--color-charcoal);margin:.4em 0 0}
.ob-rev-chip{display:inline-flex;align-items:center;gap:5px;background:var(--color-mint);
  color:var(--color-teal-dark);font-weight:700;font-size:.76rem;border-radius:999px;
  padding:4px 10px;margin-right:8px}
.ob-rev-chip img{width:14px;height:14px}

/* Distribution bars */
.ob-rev-distro{display:flex;flex-direction:column;gap:10px}
.ob-rev-distro__row{display:grid;grid-template-columns:36px 1fr 44px;align-items:center;gap:12px}
.ob-rev-distro__label{font-size:.9rem;color:var(--color-charcoal);font-weight:600;white-space:nowrap}
.ob-rev-distro__track{height:12px;background:var(--color-mint);border-radius:999px;overflow:hidden}
.ob-rev-distro__fill{display:block;height:100%;background:var(--color-teal);border-radius:999px}
.ob-rev-distro__pct{font-size:.85rem;color:var(--color-charcoal);text-align:right}

/* Disclosures */
.ob-rev-disclosure{font-size:.82rem;line-height:1.5;max-width:760px;margin:12px auto 0}

/* Toolbar + filter pills */
.ob-rev-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.ob-rev-filters{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.ob-rev-filters__label{font-size:.8rem;font-weight:700;color:var(--color-navy);
  text-transform:uppercase;letter-spacing:.05em;margin-right:2px}
.ob-rev-pill{min-height:44px;display:inline-flex;align-items:center;background:#fff;
  border:1.5px solid #D7E2E7;color:var(--color-charcoal);border-radius:999px;
  padding:0 16px;font-size:.85rem;font-weight:600;cursor:pointer;
  transition:border-color .2s var(--ob-ease),background .2s var(--ob-ease),color .2s var(--ob-ease)}
.ob-rev-pill:hover{border-color:var(--color-teal-dark)}
.ob-rev-pill.is-active{background:var(--color-teal-dark);border-color:var(--color-teal-dark);color:#fff}
.ob-rev-pill:focus-visible{outline:2px solid var(--color-navy);outline-offset:2px}

/* Review card extras */
.ob-reviews-grid--2{grid-template-columns:1fr 1fr}
.ob-review__top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ob-rev-card__title{font-size:1.05rem;color:var(--color-navy);margin:2px 0 0}
.ob-rev-card__disclose{font-size:.8rem;color:var(--color-charcoal);opacity:.85;margin:0}
.ob-rev-card__helpful{display:flex;align-items:center;gap:16px;border-top:1px solid #EDF2F4;padding-top:12px}
.ob-rev-helpful{min-height:44px;display:inline-flex;align-items:center;background:none;border:none;
  color:var(--color-teal-dark);font-weight:600;font-size:.85rem;cursor:pointer;padding:0}
.ob-rev-helpful:hover{text-decoration:underline}
.ob-rev-report{min-height:44px;display:inline-flex;align-items:center;font-size:.82rem;color:var(--color-charcoal);opacity:.7}

/* Photo strip */
.ob-rev-photos{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.ob-rev-photo{position:relative;margin:0;border-radius:16px;overflow:hidden}
.ob-rev-photo .ob-photo{border-radius:16px}
.ob-rev-photo__cap{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;gap:8px;
  padding:8px 10px;font-size:.78rem;font-weight:600;color:#fff;
  background:linear-gradient(180deg,rgba(22,58,95,0) 0%,rgba(22,58,95,.78) 100%)}
.ob-rev-photo__cap .ob-stars--teal{font-size:.8rem}
.ob-rev-photo__cap .ob-stars--teal .ob-star{color:rgba(255,255,255,.5)}
.ob-rev-photo__cap .ob-stars--teal .ob-star.is-on{color:#fff}

/* Ghost button on navy band */
.ob-section--navy .ob-btn--on-navy{color:#fff;border-color:#fff}
.ob-section--navy .ob-btn--on-navy:hover{background:#fff;color:var(--color-navy)}

@media(max-width:860px){
  .ob-rev-summary{grid-template-columns:1fr;gap:24px}
  .ob-rev-photos{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:560px){
  .ob-rev-photos{grid-template-columns:repeat(2,1fr)}
}

/* =====================================================================
   MOBILE POLISH — global safety net (applies to every page incl. landing).
   No global overflow:hidden (would break position:sticky); instead guard
   the common blowout sources directly.
   ===================================================================== */
/* Grid/flex children with long content shouldn't force horizontal scroll */
.ob-grid-3>*,.ob-grid-4>*,.ob-split>*,.ob-stats>*,.ob-reviews-grid>*,
.ob-posts>*,.ob-offer__grid>*,.ob-mega__inner>*{min-width:0}
/* Long words / URLs (legal pages, prose) wrap instead of overflowing */
.ob-prose,.ob-review__body,.ob-card p,.ob-postcard p{overflow-wrap:break-word;word-wrap:break-word}
/* Media never exceeds its column */
img,video,iframe,.ob-photo{max-width:100%}
iframe{width:100%}

@media(max-width:600px){
  .ob-container{padding-left:18px;padding-right:18px}
  .ob-section{padding:48px 0}
  .ob-hero{padding:36px 0}
  .ob-phero{padding:44px 0 32px}
  h1{font-size:clamp(1.7rem,7vw,2.4rem)}
  h2{font-size:clamp(1.4rem,5.5vw,1.9rem)}
  /* Stack any CTA rows full-width for big tap targets */
  .ob-hero__cta .ob-btn,.ob-cta-row .ob-btn{width:100%}
  .ob-hero__cta{width:100%}
  /* Comfortable tap targets on footer + menus */
  .ob-footer__col a,.ob-menu a{padding-top:12px;padding-bottom:12px}
}
/* Very small phones */
@media(max-width:380px){
  body{font-size:16px}
  .ob-container{padding-left:14px;padding-right:14px}
}