/* Partner storefront (public page + builder preview). Theme, accent, font and corners come from the partner. */
.shop { --s-bg: #0b0c0f; --s-card: #15171c; --s-card2: #1b1e24; --s-text: #f3f4f6; --s-muted: #a1a7b3; --s-line: #262a32; --s-radius: 14px; --s-btn-radius: 10px;
  --s-tint: color-mix(in srgb, var(--s-accent) 14%, transparent); --s-shadow: 0 1px 2px rgba(0,0,0,.3), 0 12px 32px rgba(0,0,0,.25);
  background: var(--s-bg); color: var(--s-text); font: 16px/1.6 var(--s-font, Inter), -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; -webkit-font-smoothing: antialiased; }
.shop.theme-light { --s-bg: #ffffff; --s-card: #ffffff; --s-card2: #f6f7f9; --s-text: #111318; --s-muted: #5b6270; --s-line: #e4e7ec;
  --s-tint: color-mix(in srgb, var(--s-accent) 9%, transparent); --s-shadow: 0 1px 2px rgba(16,24,40,.05), 0 10px 28px rgba(16,24,40,.07); }
.shop section { max-width: 880px; margin: 0 auto; padding: 48px 20px; }
.shop section:has(> .s-wrap) { max-width: none; padding: 72px 20px; }
.s-wrap { max-width: 1080px; margin: 0 auto; }
.s-narrow { max-width: 760px; }
.shop h1 { font-size: calc(clamp(40px, 7vw, 72px) * var(--s-scale, 1)); line-height: 1.02; letter-spacing: -.035em; margin: 14px 0 20px; font-weight: 700; }
.shop h2 { font-size: calc(clamp(28px, 3.6vw, 40px) * var(--s-scale, 1)); line-height: 1.1; letter-spacing: -.025em; margin: 0 0 28px; font-weight: 700; }
.shop p { margin: 0 0 12px; color: var(--s-muted); }

/* header */
.s-header { position: sticky; top: 0; z-index: 20; background: color-mix(in srgb, var(--s-bg) 82%, transparent); backdrop-filter: saturate(1.6) blur(14px); -webkit-backdrop-filter: saturate(1.6) blur(14px); border-bottom: 1px solid var(--s-line); }
.s-header-in { max-width: 1080px; margin: 0 auto; padding: 12px 20px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.s-brand { display: flex; align-items: center; gap: 10px; color: inherit; text-decoration: none; font-weight: 700; font-size: 18px; letter-spacing: -.01em; }
.s-brand img { height: 34px; width: auto; max-width: 180px; object-fit: contain; }

/* buttons */
.s-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; background: var(--s-accent); color: #fff; font: inherit; font-weight: 700; border: 0; border-radius: var(--s-btn-radius);
  padding: 13px 22px; text-decoration: none; cursor: pointer; box-shadow: 0 6px 18px color-mix(in srgb, var(--s-accent) 32%, transparent); transition: transform .15s, box-shadow .15s, filter .15s; }
.s-btn:hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: 0 10px 24px color-mix(in srgb, var(--s-accent) 38%, transparent); }
.s-btn:disabled { opacity: .6; cursor: default; transform: none; }
.s-btn-lg { padding: 17px 30px; font-size: 17px; }
.s-btn-sm { padding: 9px 16px; font-size: 14px; box-shadow: none; }
.s-btn-invert { background: #fff; color: #111318; box-shadow: 0 8px 24px rgba(0,0,0,.18); }
.s-arrow { transition: transform .15s; }
.s-btn:hover .s-arrow { transform: translateX(3px); }

/* hero */
.s-eyebrow { display: inline-block; color: var(--s-accent); font-weight: 700; font-size: 13px; letter-spacing: .1em; text-transform: uppercase; }
.s-hero .s-eyebrow { background: var(--s-tint); border: 1px solid color-mix(in srgb, var(--s-accent) 28%, transparent); padding: 7px 14px; border-radius: 999px; letter-spacing: .08em; font-size: 12px; }
.shop .s-hero { text-align: center; padding: 110px 20px 96px; position: relative; overflow: hidden;
  background: radial-gradient(60% 70% at 50% 0%, color-mix(in srgb, var(--s-accent) 22%, transparent), transparent 70%), var(--s-bg); }
.s-hero::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: linear-gradient(var(--s-line) 1px, transparent 1px), linear-gradient(90deg, var(--s-line) 1px, transparent 1px); background-size: 56px 56px;
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 20%, #000 20%, transparent 75%); mask-image: radial-gradient(ellipse 70% 60% at 50% 20%, #000 20%, transparent 75%); }
.s-hero .s-wrap { position: relative; max-width: 860px; }
.s-lead { font-size: calc(clamp(18px, 2.2vw, 21px) * var(--s-pscale, 1)); max-width: 640px; margin: 0 auto 34px !important; line-height: 1.55; }

/* products */
.s-products { background: var(--s-card2); border-top: 1px solid var(--s-line); border-bottom: 1px solid var(--s-line); }
.s-products h2 { text-align: center; }
.s-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.s-product { position: relative; display: flex; flex-direction: column; gap: 8px; background: var(--s-card); border: 1.5px solid var(--s-line); border-radius: var(--s-radius);
  padding: 24px 24px 22px; cursor: pointer; box-shadow: var(--s-shadow); transition: border-color .15s, transform .15s, box-shadow .15s, background .15s; }
.s-product:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--s-accent) 45%, var(--s-line)); }
.s-product input { position: absolute; opacity: 0; pointer-events: none; }
.s-product:has(input:focus-visible) { outline: 2px solid var(--s-accent); outline-offset: 2px; }
.s-check { position: absolute; top: 22px; right: 22px; width: 24px; height: 24px; border-radius: 50%; border: 2px solid var(--s-line); background: var(--s-bg); transition: all .15s; }
.s-product:has(input:checked) { border-color: var(--s-accent); background: linear-gradient(var(--s-tint), var(--s-tint)), var(--s-card); }
.s-product:has(input:checked) .s-check { background: var(--s-accent); border-color: var(--s-accent); }
.s-product:has(input:checked) .s-check::after { content: ''; position: absolute; left: 7px; top: 3px; width: 5px; height: 10px; border: solid #fff; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.s-pname { font-weight: 700; font-size: 19px; letter-spacing: -.01em; padding-right: 36px; line-height: 1.25; }
.s-price { font-weight: 700; font-size: 28px; letter-spacing: -.03em; line-height: 1.1; }
.s-price small { font-size: 15px; font-weight: 600; color: var(--s-muted); letter-spacing: 0; margin-left: 2px; }
.s-pdesc { color: var(--s-muted); font-size: 15px; line-height: 1.5; }
.s-featured { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr auto; grid-template-areas: "badge badge" "name price" "desc price"; column-gap: 32px; padding: 30px 32px;
  border-color: color-mix(in srgb, var(--s-accent) 50%, var(--s-line)); }
.s-featured .s-badge { grid-area: badge; }
.s-featured .s-pname { grid-area: name; font-size: 26px; }
.s-featured .s-price { grid-area: price; align-self: center; font-size: 40px; padding-right: 40px; }
.s-featured .s-pdesc { grid-area: desc; font-size: 16px; max-width: 60ch; }
.s-featured .s-tag { display: none !important; }
.s-featured .s-check { top: 50%; margin-top: -12px; }
.s-badge { justify-self: start; background: var(--s-accent); color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; padding: 5px 10px; border-radius: 999px; margin-bottom: 4px; }
.s-tag { display: none; color: #1f9d55; font-size: 13px; font-weight: 600; }
.s-product.covered { opacity: .55; cursor: default; transform: none; }
.s-product.covered .s-tag { display: block; }
.s-bar { position: sticky; bottom: 16px; z-index: 10; margin-top: 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  background: var(--s-card); border: 1px solid var(--s-line); border-radius: var(--s-radius); padding: 14px 14px 14px 22px; box-shadow: 0 12px 40px rgba(0,0,0,.18); }
.s-sum { display: grid; gap: 2px; }
.s-sum-main { font-size: 17px; }
.s-sum-sub { font-size: 13px; color: var(--s-muted); }
.s-bar .s-btn { padding: 14px 26px; }
.s-error { color: #e5484d; margin-top: 10px; text-align: center; }
.s-fine { font-size: 13px; margin-top: 14px !important; text-align: center; }
.s-empty { color: var(--s-muted); text-align: center; padding: 24px; }

/* text, testimonial, about, faq, cta */
.s-text p { font-size: 18px; line-height: 1.7; }
.s-quote figure { margin: 0; text-align: center; }
.s-qmark { display: block; font-size: 96px; line-height: .6; height: 44px; color: var(--s-accent); font-family: Georgia, serif; }
.s-quote blockquote { font-size: clamp(24px, 3.4vw, 34px); line-height: 1.3; letter-spacing: -.02em; margin: 0 auto 28px; font-weight: 600; }
.s-quote figcaption { display: inline-flex; align-items: center; gap: 12px; text-align: left; color: var(--s-muted); font-size: 15px; line-height: 1.35; }
.s-quote figcaption b { color: var(--s-text); }
.s-initial { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--s-tint); color: var(--s-accent); font-weight: 800; font-size: 18px; }
.s-about-card { display: flex; gap: 28px; align-items: flex-start; background: var(--s-card2); border: 1px solid var(--s-line); border-radius: var(--s-radius); padding: 32px; }
.s-about h2 { margin: 6px 0 10px; font-size: calc(26px * var(--s-scale, 1)); }
.s-about p { font-size: 17px; }
.s-about img, .s-avatar { width: 104px; height: 104px; border-radius: 50%; object-fit: cover; flex: none; }
.s-avatar { display: grid; place-items: center; background: var(--s-accent); color: #fff; font-size: 42px; font-weight: 700; }
.s-faq h2 { text-align: center; }
.s-faq-list { border-top: 1px solid var(--s-line); }
.s-faq details { border-bottom: 1px solid var(--s-line); padding: 20px 4px; }
.s-faq summary { cursor: pointer; font-weight: 600; font-size: 18px; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.s-faq summary::-webkit-details-marker { display: none; }
.s-faq summary::after { content: '+'; color: var(--s-accent); font-size: 24px; line-height: 1; font-weight: 400; transition: transform .2s; }
.s-faq details[open] summary::after { transform: rotate(45deg); }
.s-faq details p { margin-top: 10px; font-size: 16px; }
.s-cta-card { text-align: center; border-radius: calc(var(--s-radius) + 6px); padding: 72px 28px; color: #fff; position: relative; overflow: hidden;
  background: radial-gradient(80% 120% at 100% 0%, rgba(255,255,255,.22), transparent 60%), var(--s-accent); }
.s-cta-card h2 { color: #fff; margin-bottom: 28px; }
.s-footer { text-align: center; color: var(--s-muted); font-size: 13px; padding: 28px 20px 48px; }
.s-footer a { color: inherit; }
/* hero with an image beside it */
.s-hero-split .s-wrap { max-width: 1080px; display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center; text-align: left; }
.s-hero-split h1 { font-size: calc(clamp(36px, 5vw, 60px) * var(--s-scale, 1)); }
.s-hero-img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--s-radius); border: 1px solid var(--s-line); box-shadow: var(--s-shadow); display: block; }
/* how it works */
.s-steps h2, .s-stats h2, .s-video h2 { text-align: center; }
.s-step-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; counter-reset: s; }
.s-step-list li { background: var(--s-card); border: 1px solid var(--s-line); border-radius: var(--s-radius); padding: 26px; display: flex; flex-direction: column; gap: 8px; }
.s-step-list b { font-size: 19px; letter-spacing: -.01em; }
.s-step-list p { margin: 0; }
.s-step-n { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--s-tint); color: var(--s-accent); font-weight: 800; margin-bottom: 6px; }
/* numbers */
.s-stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0; border-block: 1px solid var(--s-line); }
.s-stat { padding: 30px 20px; text-align: center; display: flex; flex-direction: column; gap: 6px; }
.s-stat + .s-stat { border-left: 1px solid var(--s-line); }
.s-stat b { font-size: calc(clamp(30px, 4vw, 44px) * var(--s-scale, 1)); line-height: 1.05; letter-spacing: -.03em; color: var(--s-accent); }
.s-stat span { color: var(--s-muted); }
/* video + image */
.s-video-frame { position: relative; aspect-ratio: 16 / 9; max-width: 100%; border-radius: var(--s-radius); overflow: hidden; border: 1px solid var(--s-line); background: #000; box-shadow: var(--s-shadow); }
.s-video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.s-image figure { margin: 0; }
.s-image img { width: 100%; border-radius: var(--s-radius); border: 1px solid var(--s-line); display: block; }
.s-image figcaption { text-align: center; color: var(--s-muted); font-size: 14px; margin-top: 12px; }
.s-placeholder { border: 2px dashed var(--s-line); border-radius: var(--s-radius); padding: 48px 20px; text-align: center; color: var(--s-muted); }
/* guarantee */
.s-guarantee-card { display: flex; gap: 22px; align-items: flex-start; border: 1px solid color-mix(in srgb, var(--s-accent) 35%, var(--s-line)); background: var(--s-tint); border-radius: var(--s-radius); padding: 30px; }
.s-guarantee h2 { font-size: calc(24px * var(--s-scale, 1)); margin-bottom: 8px; }
.s-guarantee p { margin: 0; color: var(--s-text); opacity: .85; }
.s-shield { flex: none; width: 46px; height: 46px; border-radius: 50%; background: var(--s-accent); color: #fff; display: grid; place-items: center; }
.s-shield svg { width: 24px; height: 24px; }
/* per-section text size and screen visibility (set in the builder) */
.s-sz-s { --s-scale: .8; --s-pscale: .92; }
.s-sz-l { --s-scale: 1.2; --s-pscale: 1.1; }
.s-sized.s-sz-s p, .s-block.s-sz-s p { font-size: .94em; }
.s-sized.s-sz-l p, .s-block.s-sz-l p { font-size: 1.08em; }
@media (min-width: 621px) { .s-show-phone { display: none; } }
@media (max-width: 900px) { .s-grid { grid-template-columns: 1fr 1fr; } .s-hero-split .s-wrap { grid-template-columns: 1fr; text-align: center; gap: 32px; } }
@media (max-width: 620px) {
  .s-grid { grid-template-columns: 1fr; }
  .shop section:has(> .s-wrap) { padding: 56px 16px; }
  .shop .s-hero { padding: 72px 16px 64px; }
  .s-featured { grid-template-columns: 1fr; grid-template-areas: "badge" "name" "price" "desc"; padding: 24px; }
  .s-featured .s-price { font-size: 32px; padding-right: 0; }
  .s-featured .s-check { top: 22px; margin-top: 0; }
  .s-about-card { flex-direction: column; padding: 24px; }
  .s-bar { bottom: 10px; padding: 10px 10px 10px 16px; }
  .s-sum-sub { display: none; }
  .s-bar .s-btn { flex: 1 1 100%; }
  .s-cta-card { padding: 52px 20px; }
  .s-stat + .s-stat { border-left: 0; border-top: 1px solid var(--s-line); }
  .s-guarantee-card { flex-direction: column; padding: 24px; }
  .s-show-desktop { display: none; }
  .s-sz-l { --s-scale: 1.08; } /* large headlines stay on screen on phones */
  /* a separate text size for phones, when set */
  .s-psz-s { --s-scale: .8; --s-pscale: .92; }
  .s-psz-m { --s-scale: 1; --s-pscale: 1; }
  .s-psz-l { --s-scale: 1.08; --s-pscale: 1.06; }
  .s-sized.s-psz-s p, .s-block.s-psz-s p { font-size: .94em; }
  .s-sized.s-psz-m p, .s-block.s-psz-m p { font-size: 1em; }
  .s-sized.s-psz-l p, .s-block.s-psz-l p { font-size: 1.04em; }
}
/* long-form pages (refund policy, onboarding) inside a branded shell */
.s-doc { max-width: 680px !important; }
.s-doc h1 { font-size: clamp(28px, 5vw, 40px); }
.s-doc h2 { font-size: 18px; margin: 28px 0 8px; }
.s-card { background: var(--s-card); border: 1px solid var(--s-line); border-radius: var(--s-radius); padding: 20px; margin-bottom: 16px; }
.s-muted { color: var(--s-muted); }
/* onboarding booking page */
.ob [hidden] { display: none !important; }
.ob h2 { margin-top: 0; }
.ob-ok { color: #1f9d44; font-weight: 600; font-size: 14px; }
.ob-days { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 20px; }
.ob-days button, .ob-times button, .ob-ghost { font: inherit; background: var(--s-bg); color: var(--s-text); border: 1px solid var(--s-line);
  border-radius: var(--s-btn-radius); cursor: pointer; font-weight: 600; }
.ob-days button { flex: none; width: 76px; padding: 8px 0; }
.ob-days small { display: block; color: var(--s-muted); font-weight: 500; font-size: 12px; }
.ob-days [aria-pressed=true] { border-color: var(--s-accent); box-shadow: 0 0 0 1px var(--s-accent); }
.ob-times { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; margin-bottom: 20px; }
.ob-times button { padding: 10px; }
.ob-times [aria-pressed=true] { background: var(--s-accent); border-color: var(--s-accent); color: #fff; }
.ob-label { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--s-muted); }
.ob-when { font-size: 22px; font-weight: 700; margin: 4px 0 6px; }
.ob-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.ob-ghost { padding: 12px 20px; }
.ob-note { border-left: 3px solid var(--s-accent); }
.ob-note a { color: var(--s-text); }

.ob-intake h2 { margin: 0 0 4px; font-size: 18px; }
.ob-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 14px 0 16px; }
.ob-grid label { display: grid; gap: 5px; font-size: 13px; font-weight: 600; }
.ob-grid .wide { grid-column: 1 / -1; }
/* Fields follow the shop's corner style but never go fully round (pill), so text never
   runs into the curve; the notes box stays gently rounded. */
.ob-grid input, .ob-grid textarea { font: inherit; font-size: 15px; font-weight: 400; padding: 11px 14px; border: 1px solid var(--s-line); border-radius: min(var(--s-btn-radius), 12px); background: var(--s-bg); color: var(--s-text); width: 100%; box-sizing: border-box; }
.ob-grid textarea { border-radius: min(var(--s-btn-radius), 10px); padding: 12px 14px; line-height: 1.5; resize: vertical; min-height: 96px; }
.ob-grid input:focus, .ob-grid textarea:focus { outline: none; border-color: var(--s-accent); box-shadow: 0 0 0 1px var(--s-accent); }
@media (max-width: 560px) { .ob-grid { grid-template-columns: 1fr 1fr; } .ob-grid label:not(.half) { grid-column: 1 / -1; } }
body.embedded .s-header { display: none; }
/* checkout panel placed under the tools instead of floating */
.s-bar.s-bar-inline { position: static; box-shadow: none; }
/* buttons never underline (the admin/portal stylesheet underlines links on hover) */
.shop a.s-btn, .shop a.s-btn:hover, .shop a.s-btn:focus { text-decoration: none; }
/* onboarding: days wrap instead of clipping; info boxes without the side bar */
.ob-days { flex-wrap: wrap; overflow: visible; }
.ob-note { border-left: 1px solid var(--s-line); }
