/*
 * Offer landing page + on-page checkout (includes/offer-lp/template.php).
 * Phones first (one column, sticky pay button from Payment down);
 * from 1024px: offer on the left, checkout card on the right.
 */

@font-face {
	font-family: 'Outfit';
	font-style: normal;
	font-weight: 600 800;
	font-display: swap;
	src: url(../fonts/offer-lp/outfit-latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: 'Public Sans';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url(../fonts/offer-lp/public-sans-latin.woff2) format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Base ─────────────────────────────────────────────────────────────── */

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body.olp { margin: 0; background: #F7F4F2; font-family: 'Public Sans', sans-serif; color: #1E1A16; line-height: normal; }
.olp *, .olp *::before, .olp *::after { -webkit-tap-highlight-color: transparent; }
.olp a { color: #C46A0A; }
.olp [hidden] { display: none !important; }
.olp img { max-width: 100%; }
.olp summary::-webkit-details-marker { display: none; }
.olp-i { display: block; flex: none; }
.olp-nowrap { white-space: nowrap; }

.olp-page { max-width: 480px; margin: 0 auto; background: #F7F4F2; overflow-x: clip; padding-bottom: env(safe-area-inset-bottom); }

/* ── Top bar + header ─────────────────────────────────────────────────── */

.olp-top { background: #FBF4E8; }
.olp-topbar { display: flex; align-items: center; justify-content: center; gap: 7px; padding: 6px 10px; background: #FFFFFF; border-bottom: 1px solid #EADFCB; font-size: 11.5px; font-weight: 500; }
.olp-topbar .olp-i { width: 58px; height: 11px; }
.olp-topbar span { white-space: nowrap; }
.olp-header { display: flex; justify-content: space-between; align-items: center; padding: 8px; background: #FFFFFF; border-bottom: 1px solid #EADFCB; }
.olp .olp-logo { font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 20px; color: #1E1A16; text-decoration: none; }
.olp .olp-support { display: inline-flex; align-items: center; min-height: 44px; margin: -8px; padding: 0 8px; font-size: 14px; font-weight: 600; color: #1E1A16; }

/* ── Layout (phones: one column in this order) ────────────────────────── */

.olp-main { display: flex; flex-direction: column; }
.olp-left { display: contents; }
.olp-hero { order: 1; }
.olp-right { order: 2; }
.olp-trust { order: 3; }
.olp-strains { order: 4; }
.olp-faq { order: 5; }

/* ── Hero ─────────────────────────────────────────────────────────────── */

.olp-hero { background: #FBF4E8; padding: 10px 8px 8px; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; }
.olp-eyebrow { font-size: 11px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: #1E1A16; }
.olp-h1 { margin: 0; font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 28px; line-height: 1.1; white-space: nowrap; color: #1E1A16; }

.olp-stats { width: 100%; display: grid; align-items: stretch; background: #FFFFFF; border: 1.5px solid #1E1A16; border-radius: 10px; overflow: hidden; box-sizing: border-box; }
.olp-stat { padding: 6px 0; border-right: 1px solid #EADFCB; display: flex; flex-direction: column; justify-content: center; gap: 4px; text-align: center; }
.olp-stat:last-child { border-right: 0; }
.olp-stat-value { font-family: 'Outfit', sans-serif; font-weight: 800; font-size: 22px; line-height: 1; letter-spacing: -0.02em; }
.olp-stat-label { font-size: 13px; font-weight: 700; color: #1E1A16; }
.olp-stat.is-price { background: #FFF3EC; }
.olp-stat.is-price .olp-stat-value { color: #C0471C; }
.olp-stat.is-small .olp-stat-value { font-size: 17px; line-height: 1.05; }
.olp-stat.is-small .olp-stat-label { font-size: 11.5px; line-height: 1.1; }
.olp-stat.is-green .olp-stat-value,
.olp-stat.is-green .olp-stat-label { color: #1F6B3A; }

.olp-grid { width: 100%; background: #FFFFFF; border: 1px solid #EADFCB; border-radius: 12px; padding: 8px; box-sizing: border-box; text-align: left; }
.olp-grid-inner { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 5px; }
.olp-tile { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.olp-tile-media { position: relative; }
.olp-tile-img { width: 100%; height: 76px; object-fit: cover; border-radius: 8px; display: block; background: #F0E8DA; }
.olp-type { position: absolute; left: 5px; bottom: 5px; padding: 2px 7px; border-radius: 999px; background: rgba(30, 26, 22, 0.78); color: #FFFFFF; font-size: 11px; font-weight: 700; line-height: normal; }
.olp-type--inline { position: static; align-self: flex-start; padding: 2px 8px; }
.olp-tile-name { font-size: 13px; font-weight: 700; line-height: 1.1; color: #1E1A16; }
.olp-qty { font-weight: 800; }

/* Mega Bundle layout: sub-line under the headline, strains in rows of five. */
.olp-subline { margin-top: -2px; font-size: 14px; font-weight: 500; color: #4A433B; }
.olp-mega .olp-grid { padding: 7px; }
.olp-mega .olp-grid-inner { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px 5px; }
.olp-mega .olp-tile-img { height: auto; aspect-ratio: 1; border-radius: 7px; }
.olp-mega .olp-tile .olp-type { left: 3px; bottom: 3px; padding: 1px 5px; font-size: 9px; }
/* Tiles are ~50–62px wide on phones: names shrink a little on narrow ones. A long word sits in
   its own box, so it moves to the next line whole and breaks at its soft hyphen ("Water-melon")
   only when wider than the tile (mvb_olp_tile_name_html). */
.olp-mega .olp-tile-name { font-size: clamp(10px, 2.9vw, 11.5px); line-height: 1.1; text-align: center; -webkit-hyphens: manual; hyphens: manual; overflow-wrap: break-word; }
.olp-word { display: inline-block; max-width: 100%; }

/* BOGO bundle: two sets of ten, each with a Swap button (design "20 Strains E Swap").
   A tile: the photo fills it, "5×" in its corner, the name (two lines at most) on
   a dark see-through band at the bottom. */
.olp-sets { width: calc(100% + 8px); margin: 2px -4px 0; display: flex; flex-direction: column; gap: 4px; text-align: left; }
.olp-set { box-sizing: border-box; border: 2px solid #1E1A16; border-radius: 10px; padding: 4px; display: flex; flex-direction: column; gap: 4px; background: #FFFFFF; }
.olp-set.is-alt { background: #F4EFE4; }
.olp-set-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 40px; padding: 0 2px 0 6px; }
.olp-set-name { flex: 1; min-width: 0; font-family: 'Outfit', sans-serif; font-weight: 800; line-height: 1.1; color: #1E1A16; overflow-wrap: break-word; }
.olp-set-name.is-lg { font-size: 23px; }
.olp-set-name.is-md { font-size: 20px; }
.olp-set-name.is-sm { font-size: 17px; }
.olp-swap-btn { flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 12px; border: 1.5px solid #1E1A16; border-radius: 8px; background: #B35A1B; color: #FFFFFF; font: 700 15px 'Public Sans', sans-serif; cursor: pointer; }
.olp-swap-btn:hover { background: #9E4F17; }
.olp-swap-btn:active { transform: scale(.97); }
.olp-swap-btn:focus-visible { outline: 3px solid #1E1A16; outline-offset: 2px; }
.olp-swap-btn .olp-i { width: 15px; height: 15px; stroke: currentColor; stroke-width: 2.4; }
.olp-set-tiles,
.olp-opt-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; }
.olp-stile { position: relative; height: 78px; min-width: 0; box-sizing: border-box; border: 1.5px solid #1E1A16; border-radius: 6px; overflow: hidden; background: #F0E8DA; }
.olp-stile-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; color: transparent; }
.olp-stile-name { position: absolute; left: 0; right: 0; bottom: 0; padding: 2px 1px 3px; background: rgba(15, 12, 9, 0.58); color: #FFFFFF; font-family: 'Outfit', sans-serif; font-size: clamp(8.5px, 2.55vw, 11px); font-weight: 700; letter-spacing: -0.01em; line-height: 1.08; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); -webkit-hyphens: manual; hyphens: manual; overflow-wrap: break-word; }
/* Up to 3 lines: "5×" before the name pushes a long one onto a third on phones. */
.olp-stile-name > span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
/* "5×" right before the name, in a light orange so it stands apart from it (client). */
.olp-stile .olp-qty { font-weight: 800; color: #FFC79E; }

/* Swap pop-up: the whole screen on phones, a dialog from 1024px. */
html.olp-modal-open,
html.olp-modal-open body { overflow: hidden; }
.olp-modal { position: fixed; inset: 0; z-index: 200; display: flex; background: #FFFFFF; }
.olp-modal-box { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; background: #FFFFFF; }
.olp-modal-head { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: calc(8px + env(safe-area-inset-top)) 10px 8px 16px; border-bottom: 2px solid #1E1A16; }
.olp-modal-title { margin: 0; font-family: 'Outfit', sans-serif; font-size: 21px; font-weight: 800; line-height: 1.15; color: #1E1A16; }
.olp-modal-x { flex: none; width: 40px; height: 40px; padding: 0; border: 1.5px solid #1E1A16; border-radius: 50%; background: #FFFFFF; color: #1E1A16; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.olp-modal-x .olp-i { width: 16px; height: 16px; stroke: currentColor; stroke-width: 2.6; }
.olp-modal-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 12px 12px calc(24px + env(safe-area-inset-bottom)); display: flex; flex-direction: column; gap: 12px; }
.olp-opt { flex: none; box-sizing: border-box; border: 2px solid #1E1A16; border-radius: 10px; padding: 8px; display: flex; flex-direction: column; gap: 8px; background: #FFFFFF; }
.olp-opt.is-on { border: 3px solid #B35A1B; padding: 7px; background: #FBF1E8; }
.olp-opt-name { padding: 0 2px; font-family: 'Outfit', sans-serif; font-size: 19px; font-weight: 800; line-height: 1.15; color: #1E1A16; }
.olp-opt-tiles .olp-stile { height: 66px; }
.olp-opt-tiles .olp-stile-name { font-size: clamp(8px, 2.3vw, 10px); }
.olp-opt-btn { min-height: 46px; border: 2px solid #1E1A16; border-radius: 10px; background: #B35A1B; color: #FFFFFF; font: 700 17px 'Public Sans', sans-serif; cursor: pointer; }
.olp-opt-btn:hover { background: #9E4F17; }
.olp-opt-btn:focus-visible,
.olp-modal-x:focus-visible { outline: 3px solid #1E1A16; outline-offset: 2px; }
.olp-opt-on { display: none; }
.olp-opt.is-on .olp-opt-btn { border-color: #B35A1B; background: #FFFFFF; color: #B35A1B; cursor: default; }
.olp-opt.is-on .olp-opt-use { display: none; }
.olp-opt.is-on .olp-opt-on { display: inline; }
.olp-toast { position: fixed; top: calc(12px + env(safe-area-inset-top)); left: 50%; z-index: 300; width: calc(100% - 32px); max-width: 360px; box-sizing: border-box; transform: translateX(-50%); padding: 10px 14px; border: 2px solid #1E1A16; border-radius: 12px; background: #1F5F35; color: #FFFFFF; font-size: 15px; font-weight: 700; }
/* Each pack's strains in "Explore the included strains" (offer-lp.js shows the picked two). */
.olp-pack-strains { display: contents; }

.olp-bullets { width: 100%; display: flex; flex-direction: column; gap: 4px; text-align: left; }
.olp-bullet { display: flex; align-items: center; gap: 10px; font-size: 14px; }
.olp-bullet .olp-i { width: 17px; height: 17px; stroke: #1F6B3A; stroke-width: 2.4; }
.olp-bullet-d { display: none; }

.olp-ctarow { width: 100%; display: flex; flex-direction: column; gap: 4px; }
.olp .olp-cta { width: 100%; display: flex; align-items: center; justify-content: center; min-height: 56px; box-sizing: border-box; border-radius: 12px; background: #B35A1B; color: #FFFFFF; font-family: 'Outfit', sans-serif; font-size: 19px; font-weight: 700; text-decoration: none; }
.olp .olp-cta:hover { background: #9E4F17; }
.olp-secure { display: flex; align-items: center; justify-content: center; gap: 7px; white-space: nowrap; font-size: 14px; color: #1E1A16; }
.olp-secure .olp-i { width: 14px; height: 14px; stroke: #4A433B; stroke-width: 2.2; }
.olp-secure img,
.olp-cardbox-head img { display: block; height: 30px; width: auto; mix-blend-mode: multiply; }

.olp-review { position: relative; width: 100%; }
.olp-rev-btn { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.olp-rev-prev { left: -10px; }
.olp-rev-next { right: -10px; }
.olp-rev-btn > span { width: 32px; height: 32px; box-sizing: border-box; border: 1px solid rgba(30, 26, 22, 0.10); border-radius: 50%; background: rgba(255, 255, 255, 0.92); box-shadow: 0 1px 4px rgba(30, 26, 22, 0.12); display: flex; align-items: center; justify-content: center; }
.olp-rev-btn .olp-i { width: 12px; height: 12px; stroke: #6B5F4F; stroke-width: 2.4; }
/* Review card in Google's style: photo, name, when, Google "G", stars, review (3 lines, "More" opens it). */
.olp-review-card { box-sizing: border-box; background: #FFFFFF; border: 1px solid #DADCE0; border-radius: 12px; padding: 12px 30px 10px; display: flex; flex-direction: column; gap: 6px; text-align: left; font-family: Roboto, Arial, sans-serif; color: #202124; box-shadow: 0 1px 2px rgba(60, 64, 67, 0.12); }
.olp-review-top { display: flex; align-items: center; gap: 10px; min-width: 0; }
.olp-review-avatar { position: relative; flex: none; width: 36px; height: 36px; border-radius: 50%; overflow: hidden; background: #1A73E8; color: #FFFFFF; display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 500; }
.olp-review-avatar::before { content: attr(data-initial); }
.olp-review-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.olp-review-who { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.25; }
.olp-review-name { font-size: 14px; font-weight: 700; color: #202124; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.olp-review-time { font-size: 12px; color: #70757A; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.olp-review-g { flex: none; display: flex; }
.olp-review-g .olp-i { width: 20px; height: 20px; }
.olp-review-stars { flex: none; display: flex; margin-right: -4px; }
.olp-review-stars .olp-i { width: 76px; height: 14px; }
@media (max-width: 360px) {
	.olp-review-top { gap: 8px; }
	.olp-review-stars .olp-i { width: 62px; height: 12px; }
}
.is-google .olp-review-stars g { fill: #FBBC04; }
.olp-review-text { margin: 0; min-height: 4.2em; font-size: 14px; line-height: 1.4; color: #202124; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.olp-review-card.is-open .olp-review-text { display: block; -webkit-line-clamp: unset; }
.olp-review-foot { display: flex; align-items: center; justify-content: space-between; min-height: 18px; }
.olp-review-more { padding: 0; border: 0; background: none; font: 500 13px Roboto, Arial, sans-serif; color: #1A73E8; cursor: pointer; }
.olp-review-foot .olp-dots { margin-left: auto; }
.olp-dots { display: flex; gap: 5px; }
.olp-dots span { width: 7px; height: 7px; border-radius: 50%; background: #D5C7AE; }
.olp-dots span.is-on { background: #1E1A16; }

/* ── Checkout ───────────────────────────────────────────────────────────
   The client's design "MVB Mega Checkout - Above the Fold": labels inside the
   boxes, City | State | ZIP in a row, one card box, no terms checkbox (the line
   above the button), pay button in the page (not stuck to the bottom). */

.olp-card { margin: 0; background: #F7F4F2; }
.olp-checkout { padding: 10px 8px 0; border-top: 1px solid #EADFCB; display: flex; flex-direction: column; gap: 8px; scroll-margin-top: 8px; }
.olp-co-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 26px; }
.olp-h2 { margin: 0; font-family: 'Outfit', sans-serif; font-size: 21px; font-weight: 800; line-height: 1; color: #1E1A16; }
.olp-co-secure { display: inline-flex; align-items: center; gap: 5px; font-size: 14px; font-weight: 600; white-space: nowrap; }
.olp-co-secure .olp-i { width: 15px; height: 15px; stroke: #1E1A16; stroke-width: 2.4; }

.olp-summary { background: #FFFFFF; border: 1px solid #E3DED8; border-radius: 10px; padding: 7px 12px; display: flex; flex-direction: column; gap: 4px; }
.olp-summary-line { font-size: 14px; font-weight: 700; line-height: 1.2; }
.olp-summary-per { font-size: 13px; font-weight: 500; color: #4A433B; }
.olp-summary-ship { margin-top: 2px; padding-top: 6px; border-top: 1px dashed #E3DED8; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.olp-summary-when { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.olp-summary-days { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 800; line-height: 1.2; }
.olp-summary-days .olp-i { width: 17px; height: 17px; stroke: #1F6B3A; stroke-width: 2.2; }
.olp-summary-usps { padding-left: 23px; font-size: 12px; font-weight: 500; line-height: 1.2; }
.olp-ship { flex: none; font-size: 13px; font-weight: 800; line-height: 1.2; white-space: nowrap; color: #1E1A16; }
.olp-ship.is-free { color: #1F6B3A; }
.olp-line { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; }
.olp-line--tax { color: #4A433B; }

/* A field: its label inside the box, above what's typed. */
.olp-f { position: relative; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; height: 48px; min-width: 0; margin: 0; padding: 4px 12px; background: #FFFFFF; border: 1px solid #C9C4BE; border-radius: 8px; cursor: text; }
.olp-f > span { font-size: 11.5px; font-weight: 600; line-height: 1.25; color: #4A433B; }
.olp-f:focus-within { border-color: #B35A1B; box-shadow: 0 0 0 3px rgba(179, 90, 27, 0.18); }
.olp-f.is-invalid { border-color: #B42318; }
.olp .olp-fld { box-sizing: border-box; display: block; width: 100%; min-width: 0; height: 22px; margin: 0; padding: 0; border: 0; border-radius: 0; outline: 0; background: transparent; box-shadow: none; font: 16px 'Public Sans', sans-serif; color: #1E1A16; }
.olp-fld::placeholder { color: #9A928A; opacity: 1; }
select.olp-fld { -webkit-appearance: none; appearance: none; cursor: pointer; }
.olp-f--sel { padding: 4px 22px 4px 11px; cursor: pointer; }
.olp-f--sel .olp-i { position: absolute; right: 9px; top: 25px; width: 13px; height: 13px; stroke: #4A433B; stroke-width: 2.4; pointer-events: none; }
.olp-stack { display: flex; flex-direction: column; gap: 8px; }
.olp-csz { display: grid; grid-template-columns: minmax(0, 1.6fr) 78px minmax(0, 1fr); gap: 8px; }
.olp .olp-addline { align-self: flex-start; height: 16px; box-sizing: content-box; margin: -16px 0 -14px 2px; padding: 14px 0; border: 0; background: transparent; font: 600 13px/16px 'Public Sans', sans-serif; color: #1E1A16; text-decoration: underline; cursor: pointer; }
.olp-check { display: flex; align-items: center; gap: 10px; align-self: flex-start; min-height: 36px; margin-top: -4px; font-size: 14px; cursor: pointer; }
.olp-check input { width: 20px; height: 20px; accent-color: #B35A1B; margin: 0; flex: none; }
.olp-billwrap { margin: -6px 0 4px; }
.olp-ferrs { display: flex; flex-direction: column; gap: 2px; margin-top: -4px; }
.olp-ferrs:empty { display: none; }
.olp-ferr { margin-left: 2px; font-size: 13px; font-weight: 600; color: #B42318; }

.olp-pay { padding: 8px 8px 16px; display: flex; flex-direction: column; }
/* Woo's order-attribution fields: hidden inputs only (still sent), no gap. */
.olp-pay wc-order-attribution-inputs { display: none; }
.olp-pay-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 18px; }
.olp-sec { margin: 0; font-family: 'Public Sans', sans-serif; font-size: 13px; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: #1E1A16; }
.olp-pay-cards { font-size: 11.5px; font-weight: 600; color: #4A433B; white-space: nowrap; }
.olp-cardbox { margin-top: 6px; background: #FFFFFF; border: 1px solid #C9C4BE; border-radius: 8px; overflow: hidden; }
.olp-cardbox .olp-f { border: 0; border-radius: 0; background: transparent; }
.olp-cardbox .olp-f:focus-within { box-shadow: inset 0 0 0 2px #B35A1B; }
.olp-cardbox .olp-f.is-invalid { box-shadow: inset 0 0 0 2px #B42318; }
.olp-cardbox .olp-f--cc { padding-right: 48px; border-bottom: 1px solid #DAD5CF; }
.olp-f--cc .olp-i { position: absolute; right: 12px; top: 15px; width: 26px; height: 18px; stroke: #8A8178; stroke-width: 1.5; }
.olp-cardbox-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.olp-cardbox-row .olp-f + .olp-f { border-left: 1px solid #DAD5CF; }
.olp-pay .olp-ferrs { margin-top: 4px; }
.olp-legal { margin: 10px 0 0 2px; font-size: 12px; font-weight: 500; line-height: 1.45; letter-spacing: -0.015em; }
.olp .olp-legal a { color: #C46A0A; text-decoration: underline; text-underline-offset: 2px; }

.olp-guard { margin-top: 8px; }
.olp-guard:empty { display: none; }
.olp-guard .mvbcfs-challenge { margin: 0 !important; }
.olp-guard input[type="text"] { height: 44px; font-size: 16px !important; box-sizing: border-box; }
.olp-notice { margin-top: 8px; border: 1.5px solid #B42318; background: #FEF3F2; color: #B42318; border-radius: 8px; padding: 10px 12px; font-size: 14px; font-weight: 600; line-height: 1.4; }
.olp-notice p { margin: 0; }
.olp-notice p + p { margin-top: 6px; }
.olp-notice a { color: inherit; }

/* No sign-up pop-ups or teaser bubbles on the offer page. Klaviyo's script isn't
   loaded here (offer-lp.php); if anything still loads it (or Wisepops), its forms
   stay hidden and the scroll lock it puts on <body> is undone, so the page can
   never get stuck behind an invisible pop-up. */
body.olp [class*="kl-private-reset-css"],
body.olp [class*="kl-teaser"],
body.olp .klaviyo-form,
body.olp .wisepops-root,
body.olp #wisepops-root { display: none !important; }
body.olp.klaviyo-prevent-body-scrolling,
body.olp.kl_reviews__modal_open { overflow: visible !important; }

/* Google address suggestions (added to <body> by the Places script). */
.pac-container { z-index: 1000; margin-top: 4px; border: 1px solid #C9C4BE; border-radius: 8px; box-shadow: 0 8px 24px rgba(30, 26, 22, 0.12); font-family: 'Public Sans', sans-serif; }
.pac-item { padding: 8px 12px; font-size: 14px; line-height: 1.4; cursor: pointer; }
.pac-item-query { font-size: 14px; color: #1E1A16; }

.olp-paybtn { margin-top: 8px; width: 100%; min-height: 54px; border: 0; border-radius: 10px; background: #B35A1B; color: #FFFFFF; padding: 0 18px; display: flex; align-items: center; justify-content: center; gap: 9px; font: 700 18px 'Public Sans', sans-serif; cursor: pointer; }
.olp-paybtn .olp-i { width: 17px; height: 17px; stroke: #FFFFFF; stroke-width: 2.4; }
.olp-paybtn-total [data-total] { font-size: 16px; font-weight: 600; }
.olp-paybtn:hover { background: #9E4F17; }
.olp-paybtn:focus-visible { outline: 3px solid #1E1A16; outline-offset: 2px; }
.olp-paybtn[disabled] { opacity: .7; cursor: default; }
.olp-paybtn.is-busy { cursor: progress; }
.olp-paybtn.is-busy .olp-paybtn-label::after { content: ''; display: inline-block; width: 14px; height: 14px; margin-left: 10px; vertical-align: -2px; border: 2px solid rgba(255, 255, 255, .45); border-top-color: #FFFFFF; border-radius: 50%; animation: olp-spin .7s linear infinite; }
@keyframes olp-spin { to { transform: rotate(360deg); } }
.olp-secure-note { margin: 8px 0 0; font-size: 12.5px; font-weight: 500; line-height: 1.4; text-align: center; color: #1E1A16; }
.olp-secure-note .olp-i { display: inline-block; width: 13px; height: 13px; margin-right: 6px; vertical-align: -2px; stroke: #1E1A16; stroke-width: 2.4; }
/* Small phones (320-360px): heading, delivery time and the note under the button stay on one line. */
@media (max-width: 360px) {
	.olp-h2 { font-size: 18px; }
	.olp-co-secure { font-size: 12.5px; }
	.olp-summary-usps { font-size: 11.5px; }
	.olp-secure-note { font-size: 11px; letter-spacing: -0.01em; }
}

/* ── Trust ────────────────────────────────────────────────────────────── */

.olp-trust { margin: 0 8px; padding: 12px 0; border-top: 1px solid #DAD5CF; display: flex; flex-direction: column; gap: 8px; }
.olp-trust-title { font-size: 15px; font-weight: 800; }
.olp-trust-sub { font-size: 12px; color: #4A433B; }
.olp-gold { color: #D99A1C; }
.olp-trust-item { display: flex; flex-direction: column; gap: 4px; }
.olp-trust-item-head { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 400; }
.olp-trust-item-head b { font-weight: 700; }
.olp-trust-item-head .olp-i { width: 20px; height: 20px; stroke: #2D5BA8; stroke-width: 2; }
.olp-trust-d { display: none; }
.olp-trust ul { list-style: none; margin: 0; padding: 0; display: none; flex-direction: column; gap: 2px; font-size: 13px; line-height: 1.4; color: #1E1A16; }
.olp-trust li { display: flex; align-items: baseline; gap: 12px; }
.olp-trust li::before { content: '•'; flex: none; width: 22px; text-align: center; color: #2D5BA8; font-weight: 800; }

/* ── Strains ──────────────────────────────────────────────────────────── */

.olp-strains { padding: 10px 8px; background: #EAF5EC; border-top: 1px solid #CFE5D4; }
.olp-strains-box { background: #FFFFFF; border: 1px solid #EADFCB; border-radius: 12px; overflow: hidden; }
.olp-strains-btn { width: 100%; border: 0; background: transparent; text-align: left; font-family: 'Public Sans', sans-serif; color: #1E1A16; display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 52px; padding: 10px 14px; cursor: pointer; }
.olp-strains-btn-text { display: flex; flex-direction: column; gap: 1px; }
.olp-strains-title { font-family: 'Outfit', sans-serif; font-size: 17px; font-weight: 800; }
.olp-strains-sub { font-size: 12px; color: #4A433B; }
.olp-strains-arrow { width: 18px; height: 18px; stroke: #B35A1B; stroke-width: 2.6; transition: transform .2s; }
.olp-strains-btn[aria-expanded="true"] .olp-strains-arrow { transform: rotate(180deg); }
.olp-strains-list { border-top: 1px solid #EADFCB; padding: 4px 14px 8px; }
.olp-strain { padding: 12px 0; border-bottom: 1px solid #F0E8DA; display: flex; flex-direction: column; gap: 8px; }
.olp-strain-head { display: flex; align-items: center; gap: 10px; }
.olp-strain-img { width: 52px; height: 52px; object-fit: cover; border-radius: 8px; flex: none; }
.olp-strain-id { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.olp-strain-name { font-size: 16px; font-weight: 800; line-height: 1.15; }
.olp-specs { display: flex; flex-direction: column; gap: 5px; font-size: 13px; line-height: 1.35; }
.olp-spec { display: flex; gap: 8px; align-items: flex-start; }
.olp-spec-label { flex: none; width: 70px; font-size: 10.5px; font-weight: 700; letter-spacing: 0.06em; color: #1E1A16; padding-top: 2px; }
.olp-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.olp-chip { padding: 2px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; color: #1E1A16; }
.olp-chip--flavor { background: #FFF3EC; border: 1px solid #F1D9C8; }
.olp-chip--traits { background: #EEF5F0; border: 1px solid #CFE3D6; }

/* ── FAQ + footer ─────────────────────────────────────────────────────── */

.olp-faq { padding: 10px 8px 6px; border-top: 1px solid #DAD5CF; display: flex; flex-direction: column; }
.olp-faq h2 { margin: 0 0 2px; font-family: 'Outfit', sans-serif; font-size: 20px; font-weight: 800; color: #1E1A16; }
.olp-faq details { border-bottom: 1px solid #DAD5CF; padding: 0; }
.olp-faq summary { min-height: 44px; display: flex; align-items: center; font-size: 15px; font-weight: 600; cursor: pointer; list-style: none; }
.olp-faq p { margin: 0 0 10px; font-size: 14px; line-height: 1.5; color: #4A433B; }

.olp-footer { padding: 0 8px 4px; border-top: 1px solid #DAD5CF; display: flex; flex-wrap: wrap; gap: 4px; justify-content: center; font-size: 13px; }
.olp .olp-footer a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 6px; color: #4A433B; }

/* ── Desktop: two columns ─────────────────────────────────────────────── */

@media (min-width: 1024px) {
	body.olp { background: #FBF4E8; }
	.olp-page { max-width: none; background: transparent; overflow-x: visible; padding-bottom: 0; }

	.olp-topbar { font-size: 13px; }
	.olp-headerwrap { background: #FFFFFF; border-bottom: 1px solid #EADFCB; }
	.olp-header { max-width: 1360px; margin: 0 auto; padding: 12px 32px; border: 0; box-sizing: border-box; }
	.olp .olp-logo { font-size: 24px; }

	.olp-main { max-width: 1360px; margin: 0 auto; padding: 28px 40px 40px; box-sizing: border-box; display: grid; grid-template-columns: minmax(0, 1fr) clamp(390px, 34vw, 480px); gap: clamp(28px, 3vw, 48px); align-items: start; }
	.olp-left { display: flex; flex-direction: column; gap: 22px; min-width: 0; }

	.olp-hero { background: transparent; padding: 0; align-items: flex-start; gap: 12px; text-align: left; }
	.olp-eyebrow { font-size: 13px; }
	.olp-h1 { font-size: 46px; line-height: 1.05; }
	.olp-stats { border-radius: 12px; }
	.olp-stat { padding: 12px 0; }
	.olp-stat-value { font-size: 30px; }
	.olp-stat.is-small .olp-stat-value { font-size: 24px; }
	.olp-stat-label,
	.olp-stat.is-small .olp-stat-label { font-size: 14px; }

	.olp-grid { padding: 12px; }
	.olp-grid-inner { gap: 10px; }
	.olp-tile-img { height: 150px; border-radius: 10px; }
	.olp-tile-name { font-size: 16px; margin-top: 2px; }
	.olp-tile .olp-type { font-size: 12px; padding: 3px 9px; left: 8px; bottom: 8px; }

	.olp-subline { margin-top: -4px; font-size: 18px; }
	.olp-mega .olp-grid { padding: 12px; }
	.olp-mega .olp-grid-inner { gap: 12px 10px; }
	.olp-mega .olp-tile-img { height: auto; border-radius: 9px; }
	.olp-mega .olp-tile .olp-type { left: 6px; bottom: 6px; padding: 2px 7px; font-size: 11px; }
	.olp-mega .olp-tile-name { font-size: 14px; }

	.olp-sets { width: 100%; margin: 0; gap: 10px; }
	.olp-set { border-radius: 12px; padding: 10px; gap: 8px; }
	.olp-set-head { gap: 12px; padding: 0 4px; }
	.olp-set-name.is-lg { font-size: 28px; }
	.olp-set-name.is-md { font-size: 26px; }
	.olp-set-name.is-sm { font-size: 23px; }
	.olp-swap-btn { min-height: 40px; padding: 0 18px; font-size: 17px; }
	.olp-set-tiles { gap: 6px; }
	.olp-set-tiles .olp-stile { height: 104px; border-radius: 7px; }
	.olp-stile-name { padding: 3px 4px 4px; font-size: 13px; }

	.olp-modal { align-items: center; justify-content: center; padding: 32px; box-sizing: border-box; background: rgba(0, 0, 0, 0.45); }
	.olp-modal-box { flex: none; width: 100%; max-width: 1160px; max-height: 100%; box-sizing: border-box; border: 2px solid #1E1A16; border-radius: 16px; overflow: hidden; }
	.olp-modal-head { padding: 16px 20px 14px 28px; }
	.olp-modal-title { font-size: 34px; }
	.olp-modal-x { width: 48px; height: 48px; }
	.olp-modal-x .olp-i { width: 20px; height: 20px; }
	.olp-modal-body { padding: 24px; gap: 20px; }
	.olp-opt { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "name btn" "tiles tiles"; align-items: center; gap: 14px 12px; border-radius: 14px; padding: 16px; }
	.olp-opt.is-on { padding: 15px; }
	.olp-opt-name { grid-area: name; padding: 0 4px; font-size: 30px; }
	.olp-opt-btn { grid-area: btn; min-height: 54px; padding: 0 28px; font-size: 19px; }
	.olp-opt-tiles { grid-area: tiles; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 8px; }
	.olp-opt-tiles .olp-stile { height: 120px; }
	.olp-opt-tiles .olp-stile-name { font-size: 13px; }
	.olp-toast { top: 20px; }

	.olp-bullets { display: grid; grid-template-columns: repeat(3, max-content); justify-content: space-between; gap: 10px; }
	.olp-bullet { font-size: 15px; background: #FFFFFF; border: 1px solid #EADFCB; border-radius: 10px; padding: 12px 14px; align-items: flex-start; line-height: 1.35; }
	.olp-bullet .olp-i { width: 20px; height: 20px; margin-top: 2px; }
	.olp-bullet-m { display: none; }
	.olp-bullet-d { display: flex; flex-direction: column; gap: 1px; }
	.olp-bullet-d b { font-weight: 800; white-space: nowrap; }

	.olp-ctarow { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 18px; align-items: center; }
	.olp .olp-cta { min-height: 60px; font-size: 21px; }

	.olp-review-card { padding: 16px 56px 12px; gap: 8px; }
	.olp-rev-prev { left: 6px; }
	.olp-rev-next { right: 6px; }
	.olp-review-avatar { width: 40px; height: 40px; font-size: 18px; }
	.olp-review-name { font-size: 15px; }
	.olp-review-time { font-size: 13px; }
	.olp-review-g .olp-i { width: 22px; height: 22px; }
	.olp-review-text { font-size: 15px; }

	.olp-trust { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 16px 24px; background: #FFFFFF; border: 1px solid #EADFCB; border-radius: 12px; padding: 18px 20px; }
	.olp-trust-head { grid-column: 1 / -1; }
	.olp-trust-title { font-size: 20px; font-family: 'Outfit', sans-serif; }
	.olp-trust-item { align-self: start; }
	.olp-trust-item-head { gap: 12px; font-size: 14px; font-weight: 700; }
	.olp-trust-item-head .olp-i { width: 22px; height: 22px; }
	.olp-trust-m { display: none; }
	.olp-trust-d { display: inline; }
	.olp-trust ul { display: flex; }
	.olp-trust li { font-size: 14px; }

	.olp-strains { padding: 0; background: transparent; border: 0; }
	.olp-strains-list:not([hidden]) { display: grid; grid-template-columns: 1fr 1fr; column-gap: 24px; }

	.olp-faq { padding: 0; border: 0; }
	.olp-faq h2 { font-size: 24px; margin-bottom: 6px; }
	.olp-faq summary { font-size: 16px; min-height: 48px; }
	.olp-faq p { font-size: 15px; }

	/* Checkout card stays on screen; offer-lp.js moves `top` when it's taller than the window. */
	.olp-right { position: sticky; top: calc(var(--wp-admin--admin-bar--height, 0px) + 20px); }
	.olp-card { background: #F7F4F2; border: 1px solid #E3DED8; border-radius: 16px; box-shadow: 0 10px 30px rgba(30, 26, 22, 0.08); overflow: hidden; }
	.olp-checkout { padding: 20px 24px 0; border-top: 0; }
	.olp-checkout .olp-h2 { font-size: 24px; }
	.olp-pay { padding: 8px 24px 20px; }
	.olp-paybtn { min-height: 56px; }

	.olp-footer { max-width: none; padding: 8px 32px; background: #F7F4F2; justify-content: center; }
}

/* Trust cards stack below 1380px so their lines never wrap. */
@media (min-width: 1024px) and (max-width: 1379px) {
	.olp-bullets { grid-template-columns: 1fr; }
	.olp-trust { grid-template-columns: 1fr; }
}