/* ===================================================================
   landing.css — /for-clinics + /start-a-practice
   Audience landing pages. Everything here derives from shared.css
   tokens; no new colors, fonts, or radii. Loaded by both pages.
   =================================================================== */

body{background:var(--paper);overflow-x:hidden}

/* ============ Hero ============ */
.lp-hero{padding:88px 0 40px;text-align:center;position:relative}
.lp-hero .eyebrow{justify-content:center}
.lp-hero h1{font-family:var(--display);font-size:clamp(44px,5.6vw,76px);font-weight:600;line-height:1;letter-spacing:-.028em;color:var(--ink);margin:18px auto 20px;max-width:900px}
.lp-hero p{max-width:620px;margin:0 auto;font-size:18px;line-height:1.55;color:var(--ink-soft)}
.lp-ctas{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:34px}
.lp-btn-ink{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 28px;border-radius:999px;background:var(--ink);color:var(--mint);font-family:var(--font);font-size:14px;font-weight:600;line-height:1;letter-spacing:-.005em;transition:background .2s,transform .2s,box-shadow .2s}
.lp-btn-ink:hover{background:#143746;transform:translateY(-2px);box-shadow:0 10px 24px -10px rgba(11,38,51,.5)}
.lp-btn-ink:focus-visible,.btn:focus-visible{outline:2px solid var(--ink);outline-offset:3px}

/* ============ Sections ============ */
.lp-section{max-width:var(--max);margin:0 auto;padding:104px 28px}
.lp-section h2{font-family:var(--display);font-size:clamp(32px,3.8vw,48px);font-weight:600;line-height:1.05;letter-spacing:-.024em;color:var(--ink);margin:16px 0 0;max-width:680px}
.lp-body{margin-top:22px;max-width:620px}
.lp-body p{margin:0 0 16px;font-size:17px;line-height:1.6;color:var(--ink-soft)}
.lp-body p:last-child{margin-bottom:0}
.lp-body strong{color:var(--ink)}

/* ============ Signature: browser tab strip (for-clinics) ============ */
.lp-tabs-wrap{max-width:940px;margin:44px auto 0;padding:0 28px}
.lp-tabs-cap{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft);margin:0 0 12px;text-align:left}
.lp-browser{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden}
.lp-browser-top{display:flex;align-items:center;gap:6px;padding:12px 16px 0}
.lp-dot{width:10px;height:10px;border-radius:50%;background:var(--cream-2)}
.lp-tabstrip{display:flex;gap:6px;padding:10px 12px 12px;align-items:stretch;min-height:56px}
.lp-tab{display:flex;align-items:center;gap:8px;padding:0 14px;height:34px;background:var(--cream);border:1px solid var(--line);border-radius:9px 9px 0 0;font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.02em;color:var(--ink-soft);white-space:nowrap;overflow:hidden;flex:1 1 auto;min-width:0;transition:flex-grow .45s cubic-bezier(.6,0,.3,1),opacity .35s ease,padding .45s cubic-bezier(.6,0,.3,1),border-width .45s,min-width .45s}
.lp-tab .lp-x{margin-left:auto;color:var(--text-soft);font-size:10px;flex:none}
.lp-tab.is-folded{flex:0 0 0;min-width:0;padding:0;border-width:0;opacity:0;transition:flex-basis .45s cubic-bezier(.6,0,.3,1),flex-grow .45s cubic-bezier(.6,0,.3,1),opacity .35s ease,padding .45s cubic-bezier(.6,0,.3,1),border-width .45s}
.lp-tab-hz{background:var(--ink);border-color:var(--ink);color:var(--mint);font-family:var(--font);font-weight:700;font-size:13px;letter-spacing:-.005em;justify-content:center}
.lp-tab-hz .lp-aster{color:var(--mint);font-weight:400}
.lp-browser-page{border-top:1px solid var(--line);background:linear-gradient(180deg,var(--paper) 0%,#fff 100%);padding:22px 20px;display:flex;gap:10px;align-items:center;justify-content:center}
.lp-browser-page span{display:inline-flex;align-items:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-soft);border:1px dashed rgba(11,38,51,.25);border-radius:999px;padding:6px 12px}

/* ============ Signature: procurement manifest (start-a-practice) ==== */
.lp-manifest-wrap{max-width:760px;margin:44px auto 0;padding:0 28px}
.lp-manifest{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:10px 26px 14px;overflow:hidden}
/* inside a photo scene the manifest goes frosted, same as the price sheet */
.lp-sheet-scene .lp-manifest{position:relative;background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(16px) saturate(1.15);backdrop-filter:blur(16px) saturate(1.15);border:1px solid rgba(255,255,255,.55)}
.lp-mrow{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;padding:15px 2px;border-bottom:1px dashed rgba(11,38,51,.18)}
.lp-mrow:last-child{border-bottom:0}
.lp-mhead{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--text-soft);padding-top:18px}
.lp-mitem{font-size:16px;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:12px}
.lp-mcheck{width:20px;height:20px;flex:none;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;color:transparent;transition:background .3s ease,border-color .3s ease,color .3s ease}
.lp-mcheck svg{width:11px;height:11px}
.lp-mvendor{font-family:var(--mono);font-size:12.5px;letter-spacing:.02em;color:var(--ink-soft);position:relative;white-space:nowrap;transition:color .3s ease}
.lp-mvendor::after{content:"";position:absolute;left:0;top:50%;height:1.5px;width:0;background:var(--berry);transition:width .35s cubic-bezier(.6,0,.3,1)}
.lp-mrow.is-done .lp-mcheck{background:var(--mint);border-color:var(--mint);color:var(--ink)}
.lp-mrow.is-done .lp-mvendor{color:var(--text-soft)}
.lp-mrow.is-done .lp-mvendor::after{width:100%}
.lp-mrow-sum{border-top:1px solid var(--ink);border-bottom:0;margin-top:2px;padding-top:17px;opacity:0;transform:translateY(6px);transition:opacity .5s ease,transform .5s ease}
.lp-mrow-sum .lp-mitem{font-size:17px}
.lp-mrow-sum .lp-msum-hz{font-family:var(--font);font-weight:700;font-size:14px;color:var(--mint);background:var(--ink);border-radius:999px;padding:8px 18px}
.lp-mrow-sum.is-shown{opacity:1;transform:none}

/* ============ Feature blocks (dashed grid, house pattern) ========== */
.lp-grid{display:grid;grid-template-columns:repeat(2,1fr);margin:48px -28px 0;border-top:1px dashed rgba(11,38,51,.22)}
.lp-grid.cols-3{grid-template-columns:repeat(3,1fr)}
.lp-cell{border-right:1px dashed rgba(11,38,51,.22);border-bottom:1px dashed rgba(11,38,51,.22);padding:34px 32px 30px}
.lp-grid:not(.cols-3) .lp-cell:nth-child(2n){border-right:0}
.lp-grid.cols-3 .lp-cell:nth-child(3n){border-right:0}
.lp-grid .lp-cell:last-child{border-right:0}
.lp-cell .lp-label{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--text-soft);display:block;margin-bottom:14px}
.lp-cell h3{font-family:var(--display);font-size:24px;font-weight:600;letter-spacing:-.015em;color:var(--ink);margin:0 0 10px}
.lp-cell p{margin:0;font-size:15.5px;line-height:1.6;color:var(--ink-soft)}

/* ============ Inverted band (retention / where-the-line-is) ======== */
.lp-band{background:var(--cream-2);color:var(--ink);padding:116px 0}
.lp-band-inner{max-width:var(--max);margin:0 auto;padding:0 28px}
.lp-band h2{font-family:var(--display);font-size:clamp(32px,3.8vw,48px);font-weight:600;line-height:1.05;letter-spacing:-.024em;color:var(--ink);margin:16px 0 0;max-width:680px}
.lp-band .lp-body p{color:var(--ink-soft)}
.lp-band .lp-body strong{color:var(--ink)}
/* the band markup uses .on-dark eyebrows from the old ink version —
   restyle them for the beige ground without touching four pages */
.lp-band .eyebrow.on-dark{color:var(--ink-soft)}
.lp-band .eyebrow.on-dark::before{background:var(--ink)}

/* Right-staggered band variant — the section above is left-aligned,
   so this one sits right for rhythm (Matt). Text stays left-ragged. */
@media (min-width:861px){
  .lp-band--right .lp-band-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,600px);gap:72px;align-items:center}
  .lp-band--right .lp-band-copy .eyebrow{display:flex}
}
@media (max-width:860px){
  .lp-band-art{display:none}
}
.lp-band-art{position:relative}

/* ---- Storefront mock, lifted verbatim from the homepage (zs-*) ---- */
/* ===== Marketplace storefront replica (supplier tab) ===== */
.zs-shop{position:relative;display:flex;gap:10px;width:min(600px,100%);background:#FBFAF3;border-radius:20px;box-shadow:0 24px 60px -18px rgba(11,38,51,.3);padding:12px;font-family:var(--font)}
.zs-side{width:132px;flex:none}
.zs-side-title{font-family:var(--display);font-size:16px;font-weight:700;color:#0B2633;margin:2px 0 7px}
.zs-filter{background:#F2F1E6;border-radius:10px;padding:10px;margin-bottom:10px}
.zs-filter b{display:block;font-size:9.5px;font-weight:700;color:#0B2633;margin-bottom:8px}
.zs-track{position:relative;height:5px;background:#E3E1D4;border-radius:99px;margin:4px 2px 6px}
.zs-fill{position:absolute;left:22%;right:12%;top:0;bottom:0;background:linear-gradient(90deg,#1D6A5E,#2E9C8E);border-radius:99px;transition:left .8s ease,right .8s ease}
.zs-dot{position:absolute;top:50%;width:11px;height:11px;border-radius:50%;background:#fff;border:2.5px solid #1D6A5E;transform:translate(-50%,-50%);transition:left .8s ease}
.zs-dot-a{left:22%}
.zs-dot-b{left:88%}
.zs-s2 .zs-fill,.zs-s3 .zs-fill{left:8%;right:30%}
.zs-s2 .zs-dot-a,.zs-s3 .zs-dot-a{left:8%}
.zs-s2 .zs-dot-b,.zs-s3 .zs-dot-b{left:70%}
.zs-range{display:flex;justify-content:space-between;font-size:8.5px;font-weight:600;color:#5F6B6E}
.zs-cats{background:#F2F1E6;border-radius:10px;padding:10px}
.zs-cats b{display:block;font-size:9.5px;font-weight:700;color:#0B2633;margin-bottom:8px}
.zs-cat{display:block;font-size:10px;font-weight:600;color:#3D5259;padding:5px 8px;border-radius:99px;margin-bottom:2px}
.zs-cat.is-active{background:#E4E3D6;color:#0B2633;position:relative;padding-left:16px}
.zs-cat.is-active::before{content:"";position:absolute;left:7px;top:50%;transform:translateY(-50%);width:4px;height:4px;border-radius:50%;background:#1D6A5E}
.zs-main{flex:1;min-width:0}
.zs-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}
.zs-tb{font-size:9px;font-weight:600;color:#5F6B6E;background:#F2F1E6;border-radius:99px;padding:4px 9px}
/* Segmented Product/Service switch — matches the real e-commerce pill */
.zs-tb-toggle{display:inline-flex;align-items:center;gap:0;padding:2px;background:#fff;border:1px solid rgba(11,38,51,.14)}
.zs-tb-toggle i,.zs-tb-toggle em{font-style:normal;padding:4px 11px;border-radius:99px;line-height:1;transition:background .2s,color .2s}
.zs-tb-toggle i{color:#5F6B6E}
.zs-tb-toggle em{background:#D6E0D7;color:#1C423D}
.zs-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.zs-card{background:#fff;border-radius:12px;padding:9px 10px;box-shadow:0 2px 8px rgba(11,38,51,.05);transition:transform .3s,box-shadow .3s}
.zs-card>b{display:block;font-size:11.5px;font-weight:700;color:#0B2633}
.zs-card>span{display:block;font-size:8.5px;color:#5F6B6E;margin-bottom:6px}
.zs-img{position:relative;height:74px;border-radius:9px;display:grid;place-items:center}
.zs-g1{background:linear-gradient(180deg,#D6E7FC,#FFEEDC)}
.zs-g2{background:linear-gradient(180deg,#E9EDBC,#FFEEDC)}
.zs-g3{background:linear-gradient(180deg,#DFE1F3,#FFEEDC)}
.zs-g4{background:linear-gradient(180deg,#D6E7FC,#F3F1D6)}
.zs-vial{width:26px;height:auto;display:block;filter:drop-shadow(0 3px 5px rgba(11,38,51,.22))}
.zs-foot{display:flex;align-items:center;justify-content:space-between;margin-top:7px}
.zs-foot b{font-size:12px;font-weight:700;color:#0B2633}
.zs-heart{width:14px;height:14px;fill:none;stroke:#B9C0BD;stroke-width:1.8;transition:fill .25s,stroke .25s,transform .25s}
/* favourited states */
.zs-s1 .zs-fav1 .zs-heart,.zs-s2 .zs-fav1 .zs-heart,.zs-s3 .zs-fav1 .zs-heart{fill:#CE2472;stroke:#CE2472;transform:scale(1.15)}
.zs-s3 .zs-fav2 .zs-heart{fill:#CE2472;stroke:#CE2472;transform:scale(1.15)}
.zs-s1 .zs-fav1,.zs-s2 .zs-fav1{transform:translateY(-2px);box-shadow:0 8px 18px rgba(11,38,51,.12)}
.zs-s3 .zs-fav2{transform:translateY(-2px);box-shadow:0 8px 18px rgba(11,38,51,.12)}
/* cursor states */
.zs-cursor{position:absolute;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.45);border:1.5px solid rgba(11,38,51,.45);box-shadow:0 3px 10px rgba(11,38,51,.25);left:90%;top:88%;transition:left 1s cubic-bezier(.4,0,.2,1),top 1s cubic-bezier(.4,0,.2,1);pointer-events:none;z-index:3}
.zs-cursor.zb-click{animation:zbClick .32s ease}
.zs-s1 .zs-cursor{left:93%;top:44%}
.zs-s2 .zs-cursor{left:16%;top:24%}
.zs-s3 .zs-cursor{left:60%;top:78%}
.zb-cursor.zb-click{animation:zbClick .32s ease}

.zb-click{animation:zbClick .32s ease}
@keyframes zbClick{40%{transform:scale(.72)}100%{transform:scale(1)}}

/* ============ Ruled list (multi-location) ============ */
.lp-rules{margin-top:40px;max-width:680px;border-top:1px dashed rgba(11,38,51,.22)}
.lp-rule{display:flex;gap:22px;align-items:baseline;padding:22px 2px;border-bottom:1px dashed rgba(11,38,51,.22);font-size:17px;font-weight:500;color:var(--ink)}
.lp-rule i{font-style:normal;font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.06em;color:#215C79;flex:none}

/* ============ Roadmap ============ */
.lp-roadmap{background:var(--cream);border-radius:24px;max-width:calc(var(--max) - 0px);margin:0 auto;padding:64px 48px}
.lp-roadmap-wrap{padding:36px 28px 72px;max-width:calc(var(--max) + 56px);margin:0 auto}
.lp-roadmap h2{font-family:var(--display);font-size:clamp(30px,3.4vw,42px);font-weight:600;line-height:1.05;letter-spacing:-.022em;color:var(--ink);margin:16px 0 0}
.lp-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}
.lp-tag{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);border:1px dashed rgba(11,38,51,.3);border-radius:999px;padding:8px 16px}

/* ============ Close (grass CTA, house pattern) ============ */
.lp-close-wrap{max-width:calc(var(--max) + 56px);margin:0 auto;padding:0 28px 88px}
.lp-close{position:relative;overflow:hidden;padding:64px 32px;text-align:center;background:#3B6B2E url(assets/faq-cta-grass.jpg) center/cover no-repeat;border-radius:24px}
.lp-close::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,38,51,.45) 0%,rgba(11,38,51,.18) 100%)}
.lp-close>*{position:relative;z-index:1}
.lp-close .eyebrow{justify-content:center;color:#fff}
.lp-close .eyebrow::before{background:#fff}
.lp-close h2{font-family:var(--display);font-weight:600;font-size:clamp(30px,3.4vw,42px);line-height:1.05;letter-spacing:-.022em;margin:12px auto 22px;color:#fff;max-width:640px}
.lp-close .lp-ctas{margin-top:0}
.lp-close .btn{background:rgba(255,255,255,.14);-webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);border:1px solid rgba(255,255,255,.38);color:#fff;text-shadow:0 1px 2px rgba(11,38,51,.25)}
.lp-close .btn:hover{background:rgba(255,255,255,.26);border-color:rgba(255,255,255,.55);color:#fff}

/* ============ Reduced motion ============ */
@media (prefers-reduced-motion:reduce){
  .lp-tab,.lp-mvendor::after,.lp-mrow-sum,.lp-mcheck{transition:none}
  .lp-sspark,.lp-sspark polyline,.lp-sspark circle{transition:none !important}
  .lp-sspark polyline{stroke-dasharray:none;stroke-dashoffset:0}
}

/* ============ Mobile ============ */
@media (max-width:720px){
  .lp-hero{padding:56px 0 28px}
  .lp-section{padding:68px 22px}
  .lp-grid,.lp-grid.cols-3{grid-template-columns:1fr;margin:36px -22px 0}
  .lp-cell{border-right:0 !important;padding:26px 24px}
  .lp-band{padding:76px 0}
  .lp-roadmap{padding:44px 26px}
  /* Tab strip: the seven scrappy tabs go away entirely — the single
     HeyZoe tab is the story on a phone (per brief). */
  .lp-tab:not(.lp-tab-hz){display:none}
  .lp-tab-hz{flex:1 1 auto}
  /* Manifest: vendor column drops, item + check remain. */
  .lp-mrow{grid-template-columns:1fr}
  .lp-mvendor{display:none}
  .lp-mrow-sum .lp-msum-hz{display:inline-flex;justify-self:start}
  .lp-close{padding:44px 22px}
}

/* ============ Signature: price sheet (for-suppliers) ============ */
.lp-sheet-wrap{max-width:820px;margin:44px auto 0;padding:0 28px}
.lp-sheet-cap{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft);margin:0 0 12px;transition:opacity .3s ease}
.lp-sheet-scene{position:relative;border-radius:24px;padding:38px;overflow:hidden}
.lp-sheet-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:24px}
.lp-sheet{position:relative;background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(16px) saturate(1.15);backdrop-filter:blur(16px) saturate(1.15);border:1px solid rgba(255,255,255,.55);border-radius:16px;box-shadow:var(--shadow);padding:10px 26px 14px;overflow:hidden}
.lp-srow{display:grid;grid-template-columns:1.4fr .6fr .8fr 1fr;gap:16px;align-items:center;padding:14px 2px;border-bottom:1px dashed rgba(11,38,51,.18)}
.lp-srow:last-child{border-bottom:0}
.lp-shead{font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft);padding-top:18px}
.lp-sacct{font-size:15.5px;font-weight:600;color:var(--ink)}
.lp-slist{font-family:var(--mono);font-size:12.5px;color:var(--text-soft)}
.lp-sactual{font-family:var(--mono);font-size:13px;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:8px;white-space:nowrap}
.lp-sold{color:var(--text-soft);font-weight:400;text-decoration:line-through;text-decoration-color:var(--berry)}
.lp-smaybe{color:var(--berry);font-weight:500}
.lp-snote{font-family:var(--mono);font-size:11px;font-style:italic;color:var(--berry);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .4s ease}
.lp-scheck{width:18px;height:18px;flex:none;border-radius:50%;background:var(--mint);display:none;place-items:center;color:var(--ink)}
.lp-scheck svg{width:10px;height:10px}
.lp-sclean{display:none;align-items:center;gap:8px}
.lp-sheet.is-resolved .lp-smess{display:none}
.lp-ssales{display:none;align-items:center;justify-content:flex-end}
.lp-sheet.is-resolved .lp-ssales{display:flex}
/* Row sparklines stay rendered (opacity 0) so the draw-in transition
   can run when is-resolved lands — display:none would skip it. */
.lp-srow .lp-snote{position:relative;overflow:visible}
.lp-sspark{position:absolute;right:0;top:50%;transform:translateY(-50%);height:26px;display:flex;align-items:center;justify-content:flex-end;opacity:0;transition:opacity .4s ease;pointer-events:none}
.lp-sheet.is-resolved .lp-sspark{opacity:1}
.lp-sspark svg{width:170px;height:26px;display:block}
.lp-sspark polyline{stroke:var(--mint-deep);stroke-width:1.8;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:280;stroke-dashoffset:280}
.lp-sheet.is-resolved .lp-sspark polyline{stroke-dashoffset:0;transition:stroke-dashoffset 1.1s cubic-bezier(.5,0,.3,1) .25s}
.lp-sspark circle{fill:var(--mint-deep);opacity:0}
.lp-sheet.is-resolved .lp-sspark circle{opacity:1;transition:opacity .3s ease 1.3s}
.lp-sheet.is-resolved .lp-srow:nth-child(3) .lp-sspark polyline{transition-delay:.4s}
.lp-sheet.is-resolved .lp-srow:nth-child(4) .lp-sspark polyline{transition-delay:.55s}
.lp-sheet.is-resolved .lp-srow:nth-child(5) .lp-sspark polyline{transition-delay:.7s}
.lp-sheet.is-resolved .lp-srow:nth-child(6) .lp-sspark polyline{transition-delay:.85s}
.lp-sheet.is-resolved .lp-srow:nth-child(3) .lp-sspark circle{transition-delay:1.45s}
.lp-sheet.is-resolved .lp-srow:nth-child(4) .lp-sspark circle{transition-delay:1.6s}
.lp-sheet.is-resolved .lp-srow:nth-child(5) .lp-sspark circle{transition-delay:1.75s}
.lp-sheet.is-resolved .lp-srow:nth-child(6) .lp-sspark circle{transition-delay:1.9s}
.lp-sheet.is-resolved .lp-scheck{display:grid}
.lp-sheet.is-resolved .lp-sclean{display:flex}
.lp-sheet .lp-srow{transition:background .4s ease}
.lp-sheet.is-resolved .lp-srow[data-row]{background:transparent}
.lp-sfoot{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-soft);padding:14px 2px 4px;display:none}
.lp-sheet.is-resolved .lp-sfoot{display:block}
@media (max-width:720px){
  .lp-sheet-scene{padding:16px}
  /* Price sheet: account + actual price only, per brief. */
  .lp-srow{grid-template-columns:1fr auto}
  .lp-slist,.lp-snote{display:none}
}

/* ============ Signature: the loop (for-clinics v2) ============ */
/* Pharmacy phase flag: body[data-pharmacy-phase] shows one copy set.
   Flip = change the attribute value, no re-edit. Default markup runs
   in both phases; .ph-p1 / .ph-p2 are phase-specific. */
body[data-pharmacy-phase="1"] .ph-p2{display:none !important}
body[data-pharmacy-phase="2"] .ph-p1{display:none !important}
.lp-loop-wrap{max-width:1020px;margin:44px auto 0;padding:0 28px}
.lp-loop-caps{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin:0 0 12px}
.lp-loop-cap{font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft);margin:0}
.lp-loop-ill{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-soft);border:1px dashed rgba(11,38,51,.3);border-radius:999px;padding:4px 10px;white-space:nowrap}
.lp-loop{position:relative;display:grid;grid-template-columns:1fr 1fr 1.3fr;gap:22px}
.lp-loop::before{content:"";position:absolute;top:50%;left:4%;right:4%;border-top:1.5px dashed rgba(11,38,51,.25);z-index:0}
.lp-moment{position:relative;z-index:1;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);padding:20px 22px;opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease}
.lp-moment.is-on{opacity:1;transform:none}
.lp-moment-tag{font-family:var(--mono);font-size:10px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft);display:flex;align-items:center;gap:8px;margin-bottom:12px}
.lp-moment-dot{width:8px;height:8px;border-radius:2px;background:var(--mint);flex:none}
.lp-moment b{display:block;font-size:15.5px;font-weight:600;color:var(--ink);line-height:1.3}
.lp-moment span{display:block;font-family:var(--mono);font-size:11.5px;color:var(--text-soft);margin-top:6px}
.lp-loop-chart{width:100%;height:auto;display:block;margin-top:10px}
.lp-loop-chart .axis{stroke:rgba(11,38,51,.18);stroke-width:1}
.lp-loop-chart .line{stroke:#215C79;stroke-width:1.8;fill:none}
.lp-loop-chart .pt{fill:#215C79}
.lp-loop-chart text{font-family:var(--mono);font-size:8.5px;fill:var(--text-soft);letter-spacing:.04em}
@media (max-width:860px){
  .lp-loop{grid-template-columns:1fr}
  .lp-loop::before{left:50%;right:auto;top:6%;bottom:6%;border-top:0;border-left:1.5px dashed rgba(11,38,51,.25)}
}
@media (prefers-reduced-motion:reduce){
  .lp-moment{transition:none}
}

/* ---- Market-icon eyebrow (borrowed from the homepage Products band) ---- */
.eyebrow-market::before{display:none}
.eyebrow-market .eyebrow-ico{flex:none;width:11px;height:12px;color:var(--ink)}

/* ---- Unhappy-face eyebrow (homepage problem-section language) ---- */
.eyebrow-sad::before{display:none}
.eyebrow-sad .eyebrow-sq{width:26px;height:26px;border-radius:5px;background:var(--ink);color:#F4F4EB;display:grid;place-items:center;flex:none}
.eyebrow-sad .eyebrow-sq svg{width:16px;height:16px;display:block}

/* ---- Problem section: copy left, order-desk pile right ---- */
.lp-cols{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.lp-pile{width:100%;height:auto;mix-blend-mode:multiply}
@media (max-width:860px){
  .lp-cols{grid-template-columns:1fr;gap:28px}
  .lp-pile{max-width:420px;margin:0 auto}
}

/* ---- Noise toasts over the order-desk pile ---- */
.lp-pile-box{position:relative}
.lp-toast{position:absolute;display:flex;gap:10px;align-items:center;max-width:300px;padding:11px 15px;border-radius:14px;background:rgba(255,255,255,.62);-webkit-backdrop-filter:blur(12px) saturate(1.25);backdrop-filter:blur(12px) saturate(1.25);border:1px solid rgba(255,255,255,.75);box-shadow:0 14px 34px -14px rgba(11,38,51,.4);opacity:0;transform:translateY(10px) scale(.95);transition:opacity .45s ease,transform .45s ease;pointer-events:none;z-index:2}
.lp-toast.is-in{opacity:1;transform:none}
/* .lp-toast span (the text column) outranks a bare class — pin the
   icon square with higher specificity or it goes block + ink-soft. */
.lp-toast .lp-toast-ico{flex:none;width:30px;height:30px;margin-top:0;border-radius:8px;background:var(--berry);color:#fff;display:flex;align-items:center;justify-content:center}
.lp-toast .lp-toast-ico svg{width:15px;height:15px;display:block;stroke-width:2}
.lp-toast b{display:block;font-size:12.5px;font-weight:700;color:var(--ink);line-height:1.25;letter-spacing:-.005em}
.lp-toast span{display:block;font-size:11.5px;color:var(--ink-soft);line-height:1.3;margin-top:1px}
@media (max-width:860px){
  .lp-toast{max-width:230px;padding:9px 12px}
}
@media (prefers-reduced-motion:reduce){
  .lp-toast{transition:none}
}

/* ============ Three-phone showcase (for-telehealth) ============ */
.lp-phones-wrap{max-width:1080px;margin:52px auto 0;padding:0 28px}
.lp-phones{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;align-items:end}
.lp-phone-col{display:flex;flex-direction:column;gap:16px}
.lp-phone-col:nth-child(2){margin-bottom:34px}
.lp-phone-cap{font-family:var(--mono);font-size:11px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--text-soft);text-align:center}
.lp-phone-cap b{color:var(--ink);font-weight:600;margin-right:6px}
.lp-phone{position:relative;border-radius:38px;background:#101D24;padding:10px;box-shadow:0 30px 70px -25px rgba(11,38,51,.45)}
.lp-phone::before{content:"";position:absolute;top:18px;left:50%;transform:translateX(-50%);width:74px;height:20px;border-radius:999px;background:#101D24;z-index:3}
.lp-screen{position:relative;border-radius:30px;background:var(--cream);overflow:hidden;padding:40px 14px 14px;min-height:430px;display:flex;flex-direction:column;gap:10px}
.lp-scr-h{font-family:var(--display);font-size:19px;font-weight:600;color:var(--ink);letter-spacing:-.015em;line-height:1.05}
.lp-scr-sub{font-size:10.5px;color:var(--text-soft);line-height:1.4;margin-top:-4px}
.lp-scr-note{font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-soft)}
/* form screen */
.lp-scr-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:9px}
.lp-scr-field{border:1px solid var(--line);border-radius:10px;padding:9px 11px;font-size:11px;color:var(--ink);display:flex;justify-content:space-between;align-items:center}
.lp-scr-field span{color:var(--text-soft);font-size:9px}
.lp-scr-btns{display:flex;justify-content:space-between;align-items:center;margin-top:4px}
.lp-scr-back{font-size:10px;color:var(--text-soft)}
.lp-scr-cta{background:var(--ink);color:var(--mint);border-radius:999px;padding:8px 18px;font-size:10.5px;font-weight:600}
.lp-scr-brand{margin-top:auto;align-self:flex-end;background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 11px;font-size:9px;color:var(--ink-soft)}
.lp-scr-brand b{color:var(--ink)}
.lp-scr-brand .aster{color:var(--mint-deep)}
/* market screen */
.lp-scr-chips{display:flex;gap:6px}
.lp-scr-chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 12px;font-size:9.5px;font-weight:600;color:var(--ink)}
.lp-scr-chip.is-on{background:var(--ink);color:#fff;border-color:var(--ink)}
.lp-scr-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lp-scr-prod{background:#fff;border-radius:12px;overflow:hidden;border:1px solid var(--line)}
.lp-scr-prod-img{height:74px;display:grid;place-items:center}
.lp-scr-prod-img img{width:26px;height:auto}
.lp-scr-prod-b{padding:8px 9px 9px}
.lp-scr-prod-b b{display:block;font-size:10px;color:var(--ink);line-height:1.25}
.lp-scr-prod-b span{display:block;font-size:8.5px;color:var(--text-soft);margin-top:2px}
.lp-scr-more{margin-top:7px;border:1px solid var(--line);border-radius:999px;text-align:center;padding:5px 0;font-size:9px;font-weight:600;color:var(--ink);background:var(--paper)}
.lp-scr-tabbar{margin-top:auto;background:#fff;border:1px solid var(--line);border-radius:999px;display:flex;justify-content:space-around;padding:9px 12px}
.lp-scr-tabbar svg{width:14px;height:14px;color:var(--ink-soft)}
.lp-scr-tabbar .is-on{color:var(--ink)}
/* orders screen */
.lp-scr-status{display:inline-flex;font-family:var(--mono);font-size:8px;letter-spacing:.08em;border-radius:999px;padding:3px 8px}
.lp-scr-status--del{background:var(--mint-soft);color:#1E6B47}
.lp-scr-status--ship{background:#E7E4F6;color:#4A3D8F}
.lp-scr-steps{display:flex;flex-direction:column;gap:0;margin:2px 0 0 4px}
.lp-scr-step{display:flex;gap:10px;align-items:flex-start;position:relative;padding-bottom:14px}
.lp-scr-step::before{content:"";position:absolute;left:8px;top:18px;bottom:-2px;width:2px;background:var(--mint-deep);opacity:.5}
.lp-scr-step:last-child::before{display:none}
.lp-scr-dot{width:18px;height:18px;border-radius:50%;background:var(--mint-deep);color:#fff;display:grid;place-items:center;flex:none}
.lp-scr-dot svg{width:9px;height:9px}
.lp-scr-step b{font-size:10.5px;color:var(--ink);line-height:1.3}
.lp-scr-step span{display:block;font-size:8.5px;color:var(--text-soft)}
.lp-scr-item{display:flex;justify-content:space-between;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;font-size:10.5px;color:var(--ink)}
.lp-scr-item b{font-weight:600}
@media (max-width:860px){
  .lp-phones{grid-template-columns:1fr;gap:26px}
  .lp-phone-col:nth-child(2){margin-bottom:0}
  .lp-screen{min-height:380px}
}

/* ============ See-it-in-action tabbed showcase ============ */
.lp-cell-flag{font-style:normal;font-family:var(--mono);font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);border:1px dashed rgba(11,38,51,.3);border-radius:999px;padding:2px 8px;margin-left:8px;vertical-align:1px}
.lp-tabsec-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-top:30px}
.lp-tabsec-tab{border:1px solid var(--line);background:#fff;border-radius:999px;padding:10px 20px;font-family:var(--font);font-size:13.5px;font-weight:600;color:var(--ink);transition:background .15s,color .15s,border-color .15s}
.lp-tabsec-tab.is-on{background:var(--ink);border-color:var(--ink);color:#fff}
.lp-tabsec-tab:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.lp-tabsec-panel{display:none;margin-top:44px}
.lp-tabsec-panel.is-on{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:64px;align-items:center}
.lp-tabsec-copy h3{font-family:var(--display);font-size:clamp(26px,2.8vw,36px);font-weight:600;letter-spacing:-.02em;color:var(--ink);margin:0 0 14px;line-height:1.05}
.lp-tabsec-copy p{margin:0;font-size:16.5px;line-height:1.6;color:var(--ink-soft);max-width:520px}
.lp-tabsec-mock .lp-phone{max-width:300px;margin:0 auto}
@media (max-width:860px){
  .lp-tabsec-panel.is-on{grid-template-columns:1fr;gap:30px}
}
