/* Bogso — design system (dark "night clinic" + light "Xamar Cad")
   Theme lives on <html data-theme="dark|light">. Every color below is a token. */
:root{
  --sky:#2F7FD8; --sky-deep:#1E62B0; --sky-glow:#7CC0FF;
  --lamp:#FFB84D; --lamp-soft:#FFE2B0;
  --ok:#127A52; --ok-bg:#E3F5EC; --bad:#B42318; --bad-bg:#FEECEB; --warn:#8A5A00; --warn-bg:#FFF1DA;
  --display:'Bricolage Grotesque', system-ui, sans-serif;
  --body:'Figtree', system-ui, sans-serif;
  --r-sm:12px; --r-md:20px; --r-lg:32px;
  --gutter:clamp(20px,4vw,56px);
  --max:1240px;
  --nav-h:76px;
}
html,html[data-theme="light"]{
  color-scheme:light;
  --bg:#F2F5F3; --bg-2:#E8EEEC; --surface:#FFFFFF; --surface-2:#F2F5F3; --surface-3:#E6F0FB;
  --text:#0E2A33; --text-soft:#40585F; --muted:#5E7378; --line:#D8E1DE; --line-strong:#0E2A33;
  --field:#FFFFFF; --field-line:#C5D2CF;
  --accent-text:#1E62B0; --chip:#E6F0FB; --chip-text:#1E62B0;
  --stage-bg:#E9F1F6; --stage-text:#0B2630; --stage-soft:#3D5960;
  --glass:rgba(255,255,255,.72); --glass-line:rgba(14,42,51,.10);
  --shade:linear-gradient(90deg,rgba(233,241,246,.92) 0%,rgba(233,241,246,.6) 34%,rgba(233,241,246,0) 60%);
  --shade-m:linear-gradient(180deg,rgba(233,241,246,0) 0%,rgba(233,241,246,0) 40%,rgba(233,241,246,.78) 62%,rgba(233,241,246,.92) 100%);
  --nav-solid:rgba(242,245,243,.86);
  --feature:#06171D; --feature-text:#FFFFFF; --feature-soft:#C9D8DB;
  --deep:#06171D; --deep-text:#FFFFFF; --deep-soft:#C9D8DB;
  --shadow:0 30px 60px -30px rgba(6,23,29,.35);
}
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#071A20; --bg-2:#0A2128; --surface:#0E2730; --surface-2:#12313B; --surface-3:#163A47;
  --text:#EEF4F5; --text-soft:#B3C6CA; --muted:#8FA6AB; --line:rgba(255,255,255,.11); --line-strong:rgba(255,255,255,.55);
  --field:#0A2128; --field-line:rgba(255,255,255,.2);
  --accent-text:#8CC6FF; --chip:rgba(124,192,255,.14); --chip-text:#A9D4FF;
  --ok:#5FD3A0; --ok-bg:rgba(95,211,160,.14); --bad:#FF8A7A; --bad-bg:rgba(255,138,122,.13); --warn:#FFC978; --warn-bg:rgba(255,184,77,.14);
  --stage-bg:#06171D; --stage-text:#FFFFFF; --stage-soft:#C9D8DB;
  --glass:rgba(8,30,38,.62); --glass-line:rgba(255,255,255,.12);
  --shade:linear-gradient(90deg,rgba(6,22,28,.88) 0%,rgba(6,22,28,.6) 34%,rgba(6,22,28,0) 60%);
  --shade-m:linear-gradient(180deg,rgba(6,23,29,0) 0%,rgba(6,23,29,0) 40%,rgba(6,23,29,.72) 62%,rgba(6,23,29,.9) 100%);
  --nav-solid:rgba(7,26,32,.82);
  --feature:linear-gradient(150deg,#1A4F8F,#0E2E55); --feature-text:#FFFFFF; --feature-soft:#D2E4F7;
  --deep:#0E2730; --deep-text:#FFFFFF; --deep-soft:#B3C6CA;
  --shadow:0 30px 60px -30px rgba(0,0,0,.7);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;font-family:var(--body);font-size:18px;line-height:1.6;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;transition:background-color .4s,color .4s}
body.home{background:var(--stage-bg)}
img,svg,canvas{display:block}
a{color:inherit}
p{margin:0}
h1,h2,h3{font-family:var(--display);margin:0;font-weight:700;letter-spacing:-.025em;line-height:1.05}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--sky-glow);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
section{scroll-margin-top:84px}
.ic-sun,.ic-moon{width:20px;height:20px}
html[data-theme="dark"] .ic-moon,html[data-theme="light"] .ic-sun,html:not([data-theme]) .ic-sun{display:none}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 28px;border-radius:999px;font-weight:600;font-size:18px;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:background .25s,color .25s,border-color .25s,transform .25s;will-change:transform;white-space:nowrap}
.btn-sky{background:var(--sky);color:#fff}
.btn-sky:hover{background:var(--sky-deep)}
.btn-glass{background:var(--glass);color:var(--stage-text);border-color:var(--glass-line);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn-glass:hover{border-color:var(--stage-text)}
.btn-line{background:transparent;color:var(--text);border-color:var(--line-strong)}
.btn-line:hover{background:var(--text);color:var(--bg)}
.btn-sm{min-height:44px;padding:0 18px;font-size:16px}
.icon-btn{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;border:1.5px solid currentColor;background:transparent;cursor:pointer;opacity:.9;flex:none}
.icon-btn:hover{opacity:1}

/* ---------- nav ---------- */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .35s,box-shadow .35s,color .35s;color:var(--stage-text)}
.nav.is-solid{background:var(--nav-solid);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:var(--text);box-shadow:0 1px 0 var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;height:var(--nav-h)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none}
.logo-mark{width:42px;height:42px}
.logo-word{font-family:var(--display);font-weight:800;font-size:27px;letter-spacing:-.03em}
.nav-links{display:flex;align-items:center;gap:26px;font-size:16px;font-weight:500;white-space:nowrap}
.nav-links a{text-decoration:none;opacity:.86}
.nav-links a:hover,.nav-links a[aria-current]{opacity:1}
.nav-links a[aria-current]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
.nav-right{display:flex;align-items:center;gap:10px}
.lang{display:inline-flex;border:1.5px solid currentColor;border-radius:999px;padding:3px;opacity:.9}
.lang button{border:0;background:transparent;min-width:42px;min-height:36px;border-radius:999px;font-size:14px;font-weight:700;cursor:pointer;letter-spacing:.02em}
.lang button[aria-pressed="true"]{background:currentColor}
.lang button[aria-pressed="true"] span{color:var(--stage-bg)}
.nav.is-solid .lang button[aria-pressed="true"] span{color:var(--bg)}
.nav .btn{min-height:46px;padding:0 20px;font-size:16px}
.nav .btn-login{background:transparent;border-color:currentColor;color:inherit}
.nav .btn-login:hover{background:currentColor}
.nav .btn-login:hover span{color:var(--stage-bg)}
.nav.is-solid .btn-login:hover span{color:var(--bg)}
.menu-btn{display:none}
.menu-btn i{display:block;width:20px;height:2px;background:currentColor;border-radius:2px;position:relative}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0;width:20px;height:2px;background:currentColor;border-radius:2px;transition:transform .3s}
.menu-btn i::before{top:-6px}.menu-btn i::after{top:6px}
@media (max-width:1340px){.nav-links{gap:18px}.nav .btn-cta{display:none}}
@media (max-width:980px){.nav-links,.nav .lang,.nav .btn-login{display:none}.menu-btn{display:inline-grid}}

/* drawer (mobile menu) */
.drawer{position:fixed;inset:0;z-index:70;visibility:hidden;pointer-events:none}
.drawer.open{visibility:visible;pointer-events:auto}
.drawer-bg{position:absolute;inset:0;background:rgba(3,12,16,.55);opacity:0;transition:opacity .35s}
.drawer.open .drawer-bg{opacity:1}
.drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(420px,100%);background:var(--bg);color:var(--text);display:flex;flex-direction:column;padding:18px var(--gutter) 28px;transform:translateX(100%);transition:transform .45s cubic-bezier(.2,.8,.2,1);overflow-y:auto}
.drawer.open .drawer-panel{transform:none}
.drawer-top{display:flex;align-items:center;justify-content:space-between;height:58px}
.drawer-links{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-direction:column}
.drawer-links a{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);font-family:var(--display);font-weight:700;font-size:26px;letter-spacing:-.02em;text-decoration:none}
.drawer-links a svg{opacity:.5}
.drawer-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:26px}
.drawer-actions{margin-top:auto;padding-top:28px;display:grid;gap:12px}
.drawer-actions .btn{width:100%}
.close-x{font-size:28px;line-height:1}

/* ---------- 3D stage ---------- */
#stage{position:fixed;inset:0;z-index:0;pointer-events:none}
#stage canvas{width:100%;height:100%}
.stage-fallback{position:fixed;inset:0;z-index:0;display:none;background:
  radial-gradient(900px 600px at 72% 42%,rgba(47,127,216,.35),transparent 60%),
  radial-gradient(700px 500px at 30% 85%,rgba(255,184,77,.16),transparent 60%),var(--stage-bg)}
.stage-fallback svg{position:absolute;right:6%;top:50%;transform:translateY(-50%);width:min(44vw,520px);height:auto}
.no-webgl .stage-fallback{display:block}
.no-webgl #stage{display:none}
.stage-shade{position:fixed;inset:0;z-index:1;pointer-events:none;background:var(--shade)}
@media (max-width:820px){.stage-shade{background:var(--shade-m)}.stage-fallback svg{right:50%;top:30%;transform:translate(50%,-50%);width:70vw}}

main{position:relative;z-index:2}

/* ---------- hero ---------- */
.hero{min-height:100vh;min-height:100svh;display:flex;align-items:center;color:var(--stage-text);padding:120px 0 80px}
.hero-inner{max-width:720px}
.hero-kicker{display:inline-flex;align-items:center;gap:10px;font-size:16px;font-weight:600;color:var(--accent-text);margin-bottom:26px}
html[data-theme="dark"] .hero-kicker{color:var(--lamp-soft)}
.hero-kicker i{width:8px;height:8px;border-radius:50%;background:var(--lamp);box-shadow:0 0 0 0 rgba(255,184,77,.7);animation:beacon 2.4s infinite}
@keyframes beacon{70%{box-shadow:0 0 0 12px rgba(255,184,77,0)}100%{box-shadow:0 0 0 0 rgba(255,184,77,0)}}
.hero h1{font-size:clamp(44px,6.2vw,90px);font-weight:800;letter-spacing:-.045em;line-height:.96}
.hero h1 .ln{display:block;overflow:hidden;padding-bottom:.06em}
.hero h1 .ln>span{display:inline-block}
.hero-lead{margin-top:28px;font-size:clamp(19px,1.6vw,22px);line-height:1.6;color:var(--stage-soft);max-width:540px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
.hero-trust{display:flex;flex-wrap:wrap;gap:12px 28px;margin:44px 0 0;padding:0;list-style:none;font-size:16px;color:var(--stage-soft)}
.hero-trust li{display:flex;align-items:center;gap:10px}
.hero-trust svg{flex:none;stroke:var(--accent-text)}
.scroll-cue{position:absolute;left:50%;bottom:28px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--stage-soft);font-size:14px;text-decoration:none}
.scroll-cue span{width:2px;height:44px;background:linear-gradient(var(--sky),transparent);animation:cue 2s infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media (max-width:820px){.hero{align-items:flex-start;padding:max(46svh,330px) 0 48px}.hero h1{font-size:clamp(40px,11vw,60px)}.hero-lead{font-size:18px;margin-top:20px}.hero-actions{margin-top:28px}.hero-trust{margin-top:30px}.scroll-cue{display:none}}

/* ---------- story (scroll-driven 3D) ---------- */
.story{position:relative;color:var(--stage-text)}
.story-head{padding-top:4vh}
.story-head h2{font-size:clamp(34px,4.6vw,64px);max-width:12ch}
.story-head p{margin-top:18px;color:var(--stage-soft);max-width:46ch;font-size:19px}
.step{min-height:40vh;min-height:40svh;display:flex;align-items:center;padding:2vh 0}
.step-card{max-width:480px;padding:34px 34px 36px;border-radius:var(--r-lg);background:var(--glass);border:1px solid var(--glass-line);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);opacity:.35;transform:translateY(24px);transition:opacity .6s,transform .6s}
.step.is-active .step-card{opacity:1;transform:none}
.step-num{display:flex;align-items:center;gap:14px;font-family:var(--display);font-weight:700;font-size:18px;color:var(--accent-text)}
.step-num b{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1.5px solid currentColor;font-size:19px}
.step h3{margin-top:20px;font-size:clamp(28px,3vw,40px)}
.step p{margin-top:14px;color:var(--stage-soft);font-size:19px}
.step-progress{position:fixed;right:var(--gutter);top:50%;transform:translateY(-50%);z-index:3;display:flex;flex-direction:column;gap:12px;opacity:0;transition:opacity .4s;pointer-events:none}
.step-progress.is-on{opacity:1}
.step-progress i{width:4px;height:34px;border-radius:4px;background:var(--glass-line);transition:background .3s,height .3s}
.step-progress i.on{background:var(--sky);height:52px}
@media (max-width:820px){.story-head{padding-top:2vh}.story-head h2{max-width:none}.story-head p{font-size:17px}.step{min-height:36svh;align-items:center;padding:1.5vh 0}.story-record{min-height:auto;padding:3vh 0 6vh}.step-progress{display:none}.step-card{padding:26px}}

/* sample record */
.record{position:relative;width:100%;max-width:420px;background:#FFFFFF;color:#0E2A33;border-radius:26px;padding:26px;box-shadow:0 40px 80px -30px rgba(0,0,0,.55),0 0 0 1px rgba(14,42,51,.06);transform-style:preserve-3d;will-change:transform}
.record-top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.record-tag{font-size:13px;font-weight:700;color:#1E62B0;background:#E6F0FB;padding:5px 11px;border-radius:999px}
.record-name{font-family:var(--display);font-weight:700;font-size:24px;margin-top:8px}
.record-id{font-size:13px;font-weight:700;background:#FFF1DA;color:#7A4B00;padding:6px 11px;border-radius:999px;white-space:nowrap}
.vitals{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.vital{background:#F2F5F3;border-radius:16px;padding:14px 16px}
.vital small{display:block;font-size:14px;color:#5E7378}
.vital b{font-family:var(--display);font-size:28px;letter-spacing:-.02em}
.vital b span{font-size:15px;font-weight:600}
.vital em{display:block;font-style:normal;font-size:14px;font-weight:600;color:#127A52}
.record-rows{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid #D8E1DE;display:flex;flex-direction:column;gap:12px;font-size:16px}
.record-rows li{display:flex;align-items:center;gap:12px}
.record-rows i{width:34px;height:34px;border-radius:50%;background:#E6F0FB;display:grid;place-items:center;flex:none}
.record-cta{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:16px;background:#0E2A33;color:#fff;font-weight:600;font-size:16px;text-decoration:none}
.story-record{display:flex;justify-content:flex-start}
@media (max-width:820px){.story-record{justify-content:center}}

/* ---------- content world ---------- */
.light{position:relative;z-index:2;background:var(--bg);color:var(--text);border-radius:40px 40px 0 0;box-shadow:0 -30px 60px rgba(0,0,0,.18);transition:background-color .4s,color .4s}
.sec{padding:clamp(56px,7vw,104px) 0}
.sec-title{font-size:clamp(36px,5vw,68px);font-weight:800;letter-spacing:-.04em;max-width:16ch}
.sec-lead{margin-top:20px;font-size:20px;color:var(--text-soft);max-width:52ch}
.ic-stroke{stroke:var(--accent-text)}

/* problem */
.problem-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:start}
.problem-story{margin-top:28px;font-size:20px;color:var(--text-soft);max-width:48ch}
.problem-story strong{color:var(--text)}
.promises{list-style:none;margin:0;padding:0;border-top:1.5px solid var(--line-strong)}
.promises li{display:grid;grid-template-columns:56px 1fr;gap:18px;padding:28px 0;border-bottom:1px solid var(--line)}
.promises svg{width:44px;height:44px;stroke:var(--accent-text)}
.promises h3{font-size:24px;letter-spacing:-.02em}
.promises p{margin-top:6px;color:var(--text-soft)}
@media (max-width:900px){.problem-grid{grid-template-columns:1fr}}

/* platform band (portal + shop teaser) */
.platform{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.pcard{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:clamp(28px,4vw,44px);background:var(--surface);border:1px solid var(--line);display:flex;flex-direction:column;gap:16px;min-height:360px;text-decoration:none;transition:transform .35s,box-shadow .35s}
.pcard:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.pcard h3{font-size:clamp(28px,3vw,38px)}
.pcard p{color:var(--text-soft);max-width:40ch}
.pcard .go{margin-top:auto;display:inline-flex;align-items:center;gap:10px;font-weight:700;color:var(--accent-text)}
.pcard .art{position:absolute;right:-30px;bottom:-30px;width:220px;height:220px;opacity:.95}
.pcard ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;color:var(--text-soft);font-size:16px;max-width:30ch;position:relative}
.pcard ul li{display:flex;gap:10px;align-items:center}
.pcard ul li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--sky);flex:none}
.pcard-portal{background:var(--feature);color:var(--feature-text);border-color:transparent}
.pcard-portal p,.pcard-portal ul{color:var(--feature-soft)}
.pcard-portal .go{color:var(--lamp)}
@media (max-width:900px){.platform{grid-template-columns:1fr}.pcard .art{width:160px;height:160px}}

/* pricing */
.pricing{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:28px;margin-top:56px;align-items:stretch}
.plan-feature{position:relative;overflow:hidden;background:var(--feature);color:var(--feature-text);border-radius:var(--r-lg);padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;gap:22px}
.plan-feature::after{content:"";position:absolute;right:-120px;top:-120px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(47,127,216,.55),transparent 65%)}
.plan-badge{align-self:flex-start;font-size:14px;font-weight:700;background:var(--lamp);color:#3A2400;padding:6px 14px;border-radius:999px;position:relative;z-index:1}
.plan-feature h3{font-size:clamp(28px,3vw,38px);position:relative;z-index:1}
.price-big{display:flex;align-items:baseline;gap:10px;position:relative;z-index:1}
.price-big b{font-family:var(--display);font-size:clamp(72px,8vw,108px);font-weight:800;letter-spacing:-.05em;line-height:.9}
.price-big span{font-size:19px;color:var(--feature-soft)}
.plan-feature ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;position:relative;z-index:1}
.plan-feature li{display:flex;gap:12px;align-items:flex-start;color:var(--feature-soft)}
.plan-feature li svg{flex:none;margin-top:4px}
.plan-feature .btn{align-self:flex-start;margin-top:auto;position:relative;z-index:1}
.price-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.price-list li{display:grid;grid-template-columns:1fr auto;gap:6px 24px;padding:30px 0;border-bottom:1px solid var(--line)}
.price-list li:first-child{border-top:1.5px solid var(--line-strong)}
.price-list h3{font-size:26px;letter-spacing:-.02em}
.price-list .amt{font-family:var(--display);font-weight:800;font-size:44px;letter-spacing:-.04em;line-height:1;text-align:right}
.price-list .amt small{display:block;font-family:var(--body);font-size:14px;font-weight:500;color:var(--muted);letter-spacing:0}
.price-list p{grid-column:1/-1;color:var(--text-soft);font-size:17px}
.fineprint{margin-top:22px;font-size:15px;color:var(--muted)}
@media (max-width:900px){.pricing{grid-template-columns:1fr}}

/* estimator */
.estimator{margin-top:clamp(40px,5vw,72px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(26px,4vw,52px);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(28px,5vw,72px)}
.estimator h3{font-size:clamp(28px,3vw,38px)}
.estimator > div > p{margin-top:10px;color:var(--text-soft)}
.est-tabs{display:inline-flex;margin-top:26px;background:var(--surface-2);border-radius:999px;padding:5px}
.est-tabs button{border:0;background:transparent;min-height:48px;padding:0 20px;border-radius:999px;font-weight:600;font-size:16px;cursor:pointer}
.est-tabs button[aria-pressed="true"]{background:var(--text);color:var(--bg)}
.est-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
.est-row label{font-weight:600}
.est-row small{display:block;font-weight:400;color:var(--muted);font-size:15px}
.stepper{display:inline-flex;align-items:center;gap:6px}
.stepper button{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--line);background:var(--surface-2);font-size:24px;line-height:1;cursor:pointer}
.stepper button:hover{border-color:var(--text)}
.stepper output{min-width:40px;text-align:center;font-family:var(--display);font-size:26px;font-weight:700}
.est-panel[hidden]{display:none}
.est-result{background:var(--deep);color:var(--deep-text);border-radius:var(--r-md);padding:30px;display:flex;flex-direction:column;justify-content:space-between;gap:26px;border:1px solid var(--line)}
.est-result small{color:var(--deep-soft);font-size:16px}
.est-total{font-family:var(--display);font-size:clamp(64px,7vw,92px);font-weight:800;letter-spacing:-.05em;line-height:1}
.est-break{list-style:none;margin:0;padding:0;font-size:16px;color:var(--deep-soft);display:flex;flex-direction:column;gap:8px}
.est-break li{display:flex;justify-content:space-between;gap:16px}
@media (max-width:900px){.estimator{grid-template-columns:1fr}}

/* diaspora */
.diaspora{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:center}
.diaspora-points{list-style:none;margin:36px 0 0;padding:0;display:flex;flex-direction:column;gap:22px}
.diaspora-points li{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start}
.diaspora-points .ic{width:52px;height:52px;border-radius:16px;background:var(--chip);display:grid;place-items:center}
.diaspora-points .ic svg{stroke:var(--chip-text)}
.diaspora-points b{display:block;font-size:20px}
.diaspora-points span{color:var(--text-soft)}
.phone{position:relative;max-width:380px;margin-left:auto;background:#0B141A;border-radius:44px;padding:16px;box-shadow:0 50px 100px -40px rgba(6,23,29,.6)}
.phone-screen{background:#ECE5DD;border-radius:30px;overflow:hidden}
.chat-head{background:#075E54;color:#fff;padding:16px 18px;display:flex;align-items:center;gap:12px}
.chat-head .av{width:40px;height:40px;border-radius:50%;background:#fff;display:grid;place-items:center}
.chat-head b{display:block;font-size:17px}
.chat-head small{font-size:13px;opacity:.85}
.chat{padding:18px 14px 22px;display:flex;flex-direction:column;gap:10px;min-height:380px}
.bubble{max-width:86%;background:#fff;border-radius:14px 14px 14px 4px;padding:10px 13px 6px;font-size:15px;line-height:1.45;color:#111B21;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.bubble.me{align-self:flex-end;background:#D9FDD3;border-radius:14px 14px 4px 14px}
.bubble time{display:block;text-align:right;font-size:11px;color:#667781;margin-top:2px}
.bubble .mini{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0 4px}
.bubble .mini span{background:#F0F2F5;border-radius:8px;padding:6px 8px;font-size:13px}
.bubble .mini b{display:block;font-size:16px}
.phone-note{margin-top:14px;text-align:center;font-size:14px;color:var(--muted)}
@media (max-width:900px){.diaspora{grid-template-columns:1fr}.phone{margin:0 auto}}

/* recruit */
.recruit{position:relative;overflow:hidden;background:var(--sky);color:#fff;border-radius:var(--r-lg);padding:clamp(34px,6vw,72px);display:grid;grid-template-columns:minmax(0,1.4fr) auto;gap:32px;align-items:end}
.recruit::before{content:"";position:absolute;inset:auto -10% -60% auto;width:520px;height:520px;border-radius:50%;border:1.5px solid rgba(255,255,255,.25);box-shadow:0 0 0 60px rgba(255,255,255,.06),0 0 0 120px rgba(255,255,255,.04)}
.recruit h2{font-size:clamp(34px,4.4vw,58px);font-weight:800;letter-spacing:-.04em;position:relative}
.recruit p{margin-top:16px;font-size:20px;color:#E6F0FB;max-width:44ch;position:relative}
.recruit .btn{position:relative;background:#fff;color:var(--sky-deep)}
.recruit .btn:hover{background:#06171D;color:#fff}
@media (max-width:820px){.recruit{grid-template-columns:1fr}}

/* waitlist */
.join{background:var(--deep);color:var(--deep-text);border-radius:40px;margin:0 clamp(8px,1.5vw,20px);border:1px solid var(--line)}
.join-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(40px,6vw,96px);align-items:start}
.join .sec-title{color:var(--deep-text)}
.join .sec-lead{color:var(--deep-soft)}
.join-note{margin-top:30px;display:flex;gap:14px;align-items:flex-start;color:var(--deep-soft);font-size:17px;max-width:46ch}
.form-card{background:var(--surface);color:var(--text);border-radius:var(--r-lg);padding:clamp(24px,3.5vw,44px);border:1px solid var(--line)}
.form{display:flex;flex-direction:column;gap:22px}
.field{display:flex;flex-direction:column;gap:9px}
.field label,.field legend{font-weight:700;font-size:17px;padding:0}
.field input:not([type=radio]):not([type=checkbox]),.field select,.field textarea{font:inherit;font-size:18px;min-height:58px;padding:0 18px;border-radius:16px;border:1.5px solid var(--field-line);background:var(--field);color:var(--text);width:100%}
.field textarea{padding:14px 18px;min-height:120px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--sky);box-shadow:0 0 0 4px rgba(47,127,216,.22)}
.field .hint{font-size:15px;color:var(--muted)}
.field.has-err input{border-color:var(--bad)}
.field .msg{display:none;color:var(--bad);font-size:15px;font-weight:600}
.field.has-err .msg{display:block}
fieldset{border:0;margin:0;padding:0;min-width:0}
.roles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:4px}
.role input{position:absolute;opacity:0;pointer-events:none}
.role > span{display:flex;flex-direction:column;gap:6px;height:100%;min-height:96px;padding:16px;border-radius:18px;border:1.5px solid var(--field-line);cursor:pointer;font-weight:700;font-size:16px;line-height:1.3;transition:border-color .2s,background .2s}
.role > span svg{width:26px;height:26px}
.role input:checked+span{border-color:var(--sky);background:var(--chip);box-shadow:inset 0 0 0 1.5px var(--sky)}
.role input:focus-visible+span{outline:3px solid var(--sky);outline-offset:2px}
@media (max-width:560px){.roles{grid-template-columns:1fr}.role > span{min-height:0;flex-direction:row;align-items:center}}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form .btn{width:100%;min-height:62px;font-size:19px}
.form-err{display:none;background:var(--bad-bg);color:var(--bad);border-radius:14px;padding:14px 16px;font-size:16px}
.has-error .form-err{display:block}
.done{display:none;flex-direction:column;align-items:flex-start;gap:16px;padding:10px 0}
.done .tick{width:68px;height:68px;border-radius:50%;background:var(--ok-bg);display:grid;place-items:center}
.done .tick svg{stroke:var(--ok)}
.done h3{font-size:36px}
.done p{font-size:19px;color:var(--text-soft)}
.joined .form{display:none}
.joined .done{display:flex}
@media (max-width:900px){.join-grid{grid-template-columns:1fr}}

/* faq */
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,6vw,96px)}
.faq-list{border-top:1.5px solid var(--line-strong)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0;font-family:var(--display);font-weight:700;font-size:clamp(20px,2vw,24px);letter-spacing:-.015em;min-height:48px}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary .pm{flex:none;width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;transition:transform .3s,background .3s}
.faq-list details[open] summary .pm{transform:rotate(45deg);background:var(--text);border-color:var(--text);color:var(--bg)}
.faq-list details p{padding:0 0 26px;color:var(--text-soft);max-width:62ch}
.faq-list details.urgent summary{color:var(--bad)}
@media (max-width:900px){.faq-grid{grid-template-columns:1fr}}

/* footer */
.foot{padding:72px 0 48px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;align-items:start}
.foot-brand{display:flex;flex-direction:column;gap:14px}
.foot-brand p{color:var(--text-soft);max-width:34ch}
.foot h4{margin:0 0 12px;font-size:16px;color:var(--muted);font-weight:600}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.foot a{text-decoration:none}
.foot a:hover{text-decoration:underline}
.foot-bottom{margin-top:56px;padding-top:24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:15px;color:var(--muted)}
@media (max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.foot-grid{grid-template-columns:1fr}}

/* floating whatsapp */
.wa{position:fixed;right:20px;bottom:20px;z-index:60;width:62px;height:62px;border-radius:50%;background:#1FA855;display:grid;place-items:center;box-shadow:0 14px 30px rgba(0,0,0,.28);transition:transform .25s}
.wa:hover{transform:scale(1.06)}

/* reveal */
.reveal{opacity:0;transform:translateY(30px)}
.no-js .reveal,.reduced .reveal{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .reveal{opacity:1;transform:none}
}

/* ===================== FARMASI (homepage shelf) ===================== */
[hidden]{display:none!important}
html,html[data-theme="light"]{--rx:#0E9F6E;--rx-deep:#0A7A54;--rx-ink:#0A5A3E;--rx-band:linear-gradient(155deg,#E5F6EC 0%,#F5FBF7 48%,#E8F1FA 100%);--rx-line:rgba(14,159,110,.18);--rx-tile:#FFFFFF;--plank-top:#FFFFFF;--plank:#DCE8E2;--rx-pattern:rgba(14,159,110,.07)}
html[data-theme="dark"]{--rx:#34D399;--rx-deep:#10B981;--rx-ink:#A7F3D0;--rx-band:linear-gradient(155deg,#0B3A2D 0%,#0B2A31 55%,#0E2730 100%);--rx-line:rgba(52,211,153,.2);--rx-tile:rgba(255,255,255,.05);--plank-top:#2A5A50;--plank:#173F38;--rx-pattern:rgba(52,211,153,.06)}

/* hero badge */
.hero-rx{display:inline-flex;align-items:center;gap:10px;margin-bottom:24px;padding:7px 14px 7px 7px;border-radius:999px;background:var(--glass);border:1px solid var(--glass-line);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:var(--stage-text);text-decoration:none;font-size:15px;font-weight:600;line-height:1.25;max-width:100%;transition:border-color .3s,transform .3s}
.hero-rx .rx-cross{flex:none;width:30px;height:30px;padding:6px;border-radius:50%;background:var(--plus)}
.hero-rx .rx-cross .ql-plus{fill:#fff;stroke:#fff}
.hero-rx > svg:last-child{flex:none;transition:transform .3s}
.hero-rx:hover{border-color:var(--rx)}
.hero-rx:hover > svg:last-child{transform:translateX(4px)}

/* nav bag */
.nav-bag{position:relative;color:inherit;text-decoration:none}
.nav-bag svg{width:21px;height:21px}
.bag-n{position:absolute;top:-5px;right:-5px;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--lamp);color:#3A2400;font-size:12px;font-weight:800;display:grid;place-items:center;line-height:1}

/* band */
.rx-band{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:clamp(24px,4.4vw,60px);background:var(--rx-band);border:1px solid var(--rx-line);isolation:isolate}
.rx-glow{position:absolute;z-index:-1;width:560px;height:560px;right:-160px;top:-220px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--rx) 26%,transparent),transparent 65%);pointer-events:none}
.rx-head{display:flex;justify-content:space-between;align-items:flex-end;gap:28px}
.rx-copy{max-width:640px}
.rx-eyebrow{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:16px;color:var(--text);letter-spacing:.01em}
.rx-eyebrow .rx-cross{width:24px;height:24px}
.rx-eyebrow .ql-plus{fill:var(--plus);stroke:var(--plus)}
.rx-head h2{margin-top:14px;font-size:clamp(36px,5vw,66px);font-weight:800;letter-spacing:-.04em;line-height:1}
.rx-head p{margin-top:16px;font-size:19px;color:var(--text-soft);max-width:54ch}
.rx-trust{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.rx-trust li{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:var(--rx-tile);border:1px solid var(--rx-line);font-size:15px;font-weight:600}
.rx-trust svg{width:18px;height:18px;color:var(--rx)}
.rx-btn{flex:none;background:var(--rx);color:#fff;gap:10px}
.rx-btn:hover{background:var(--rx-deep)}
html[data-theme="dark"] .rx-btn{color:#05261B}

/* categories */
.rx-cats{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(28px,4vw,44px)}
.rx-cat{display:inline-flex;align-items:center;gap:12px;padding:8px 18px 8px 8px;border-radius:999px;background:var(--rx-tile);border:1px solid var(--rx-line);text-decoration:none;color:inherit;transition:transform .25s,border-color .25s,box-shadow .25s}
.rx-cat:hover{transform:translateY(-2px);border-color:var(--c);box-shadow:0 14px 26px -18px var(--c)}
.rx-cat-art{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--c) 15%,transparent)}
.rx-cat-art svg{width:36px;height:36px}
.rx-cat-t{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.rx-cat-t b{font-size:15px;white-space:nowrap}
.rx-cat-t small{font-size:13px;color:var(--muted);margin-top:2px}

/* shelf */
.rx-shelf-wrap{margin-top:clamp(30px,4vw,46px)}
.rx-shelf-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:6px}
.rx-shelf-top h3{font-size:22px;letter-spacing:-.02em}
.rx-arrows{display:flex;gap:8px}
.rx-arrow{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--rx-line);background:var(--rx-tile);color:var(--text);display:grid;place-items:center;cursor:pointer;transition:border-color .2s,background .2s}
.rx-arrow:hover{border-color:var(--rx)}
.rx-arrow svg{width:20px;height:20px}
.rx-shelf{--art:156px;display:grid;grid-auto-flow:column;grid-auto-columns:clamp(150px,19%,206px);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:10px 2px 6px;margin:0 -2px}
.rx-shelf::-webkit-scrollbar{display:none}
.rx-shelf:focus-visible{outline:2px solid var(--rx);outline-offset:4px;border-radius:12px}
.rx-item{position:relative;scroll-snap-align:start;padding:0 10px;display:flex;flex-direction:column;align-items:flex-start}
/* the plank: continuous because items touch */
.rx-item::before{content:"";position:absolute;left:0;right:0;top:var(--art);height:14px;background:linear-gradient(var(--plank-top) 0 3px,var(--plank) 3px);box-shadow:0 12px 18px -12px rgba(6,23,29,.45)}
.rx-item:first-child::before{border-radius:8px 0 0 8px}
.rx-item:last-child::before{border-radius:0 8px 8px 0}
.rx-art{position:relative;width:100%;height:var(--art);display:flex;align-items:flex-end;justify-content:center;padding-bottom:2px}
.rx-art svg{width:min(132px,92%);height:auto;transform-origin:50% 100%;transition:transform .35s cubic-bezier(.3,1.5,.5,1);filter:drop-shadow(0 10px 8px rgba(6,23,29,.12))}
.rx-item:hover .rx-art svg{transform:translateY(-6px)}
.rx-add{position:absolute;top:4px;right:12px;width:42px;height:42px;border-radius:50%;border:0;background:var(--rx);color:#fff;display:grid;place-items:center;cursor:pointer;box-shadow:0 10px 18px -10px var(--rx-deep);transition:transform .2s,background .2s}
html[data-theme="dark"] .rx-add{color:#05261B}
.rx-add:hover{transform:scale(1.08);background:var(--rx-deep)}
.rx-add:active{transform:scale(.94)}
.rx-add svg{width:20px;height:20px}
.rx-q{position:absolute;top:-6px;right:-6px;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--lamp);color:#3A2400;font-size:12px;font-weight:800;display:none;place-items:center;border:2px solid var(--surface)}
.rx-add.in .rx-q{display:grid}
/* shelf price label */
.rx-tag{position:relative;margin-top:26px;display:inline-flex;align-items:baseline;gap:8px;white-space:nowrap;padding:6px 12px 6px 20px;background:var(--lamp);color:#3A2400;border-radius:4px;clip-path:polygon(10px 0,100% 0,100% 100%,10px 100%,0 50%)}
.rx-tag::before{content:"";position:absolute;left:8px;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:rgba(58,36,0,.45)}
.rx-tag b{font-family:var(--display);font-size:19px;letter-spacing:-.02em}
.rx-size{display:block;margin-top:3px;font-size:13px;color:var(--muted)}
.rx-item h4{margin:10px 0 0;font-size:15px;font-weight:600;line-height:1.3;letter-spacing:0;font-family:inherit;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rx-more{align-items:center;text-decoration:none;color:var(--rx-ink)}
.rx-more span{width:100%;height:var(--art);display:grid;place-items:center}
.rx-more span svg{width:54px;height:54px;padding:14px;border-radius:50%;border:2px dashed var(--rx);color:var(--rx);transition:transform .3s}
.rx-more:hover span svg{transform:rotate(90deg)}
.rx-more b{margin-top:26px;font-size:15px;text-align:center}

/* footer of band */
.rx-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px;margin-top:22px}
.rx-free{font-size:15px;color:var(--text-soft);margin:0}
.rx-cart{display:inline-flex;align-items:center;gap:12px;white-space:nowrap;min-height:54px;padding:0 10px 0 18px;border-radius:999px;background:var(--text);color:var(--bg);text-decoration:none;font-weight:700;font-size:16px;box-shadow:0 18px 34px -18px rgba(6,23,29,.6)}
.rx-cart > svg:first-child{width:22px;height:22px}
.rx-cart-t{background:var(--lamp);color:#3A2400;padding:5px 11px;border-radius:999px}
.rx-cart-go{display:inline-flex;align-items:center;padding:0 4px 0 6px}
.rx-cart > svg:last-child{margin-right:6px}

/* patient portal now stands alone */
.platform-one{grid-template-columns:1fr}
.platform-one .pcard{min-height:300px}
.platform-one .pcard .art{width:300px;height:300px;right:-20px;bottom:-60px}

@media (max-width:900px){
  .rx-head{flex-direction:column;align-items:flex-start}
  .rx-cats{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-left:calc(-1 * clamp(24px,4.4vw,60px));margin-right:calc(-1 * clamp(24px,4.4vw,60px));padding:0 clamp(24px,4.4vw,60px)}
  .rx-cats::-webkit-scrollbar{display:none}
  .rx-cat{flex:none}
  .rx-arrows{display:none}
  .rx-shelf{--art:132px;grid-auto-columns:146px;margin-right:calc(-1 * clamp(24px,4.4vw,60px));padding-right:clamp(24px,4.4vw,60px)}
  .platform-one .pcard .art{width:170px;height:170px;bottom:-30px}
}
@media (max-width:560px){
  .rx-band{border-radius:26px;padding:26px 20px 22px}
  .rx-cats{margin-left:-20px;margin-right:-20px;padding:0 20px}
  .rx-shelf{margin-right:-20px;padding-right:20px}
  .rx-head p{font-size:17px}
  .rx-trust li{font-size:14px;padding:7px 12px}
  .rx-btn{width:100%}
  .rx-foot{flex-direction:column;align-items:stretch}
  .rx-cart{justify-content:space-between;gap:8px;font-size:15px;padding:0 8px 0 14px}
  .hero-rx{font-size:14px}
}

/* ===================== QUICK LINKS under the header ===================== */
html,html[data-theme="light"]{--plus:#E5383B;--ql-user:#2F7FD8;--ql-heart:#F29A1F}
html[data-theme="dark"]{--plus:#FF5A5F;--ql-user:#6CB4FF;--ql-heart:#FFB84D}
.ql-plus{stroke-width:2.2;stroke-linejoin:round}
.nav-sub{overflow:hidden;max-height:96px;transition:max-height .4s cubic-bezier(.2,.8,.2,1),opacity .3s}
.nav.sub-off .nav-sub{max-height:0;opacity:0}
.nav .quick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;height:auto;padding-bottom:12px;max-width:820px;margin-left:auto;margin-right:auto}
.hero{padding-top:200px}
.ql{--ic:var(--plus);display:flex;align-items:center;gap:12px;min-height:58px;padding:8px 14px 8px 8px;border-radius:18px;text-decoration:none;color:inherit;background:var(--glass);border:1px solid var(--glass-line);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:transform .25s,border-color .25s,background .25s}
.nav.is-solid .ql{background:var(--surface);border-color:var(--line)}
.ql:hover{transform:translateY(-2px);border-color:var(--ic)}
.ql i{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:color-mix(in srgb,var(--ic) 15%,transparent);transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.ql:hover i{transform:rotate(-8deg) scale(1.06)}
.ql i svg{width:24px;height:24px;fill:var(--ic)}
.ql .ql-plus{fill:var(--plus);stroke:var(--plus)}
.ql-portal{--ic:var(--ql-user)}
.ql-plans{--ic:var(--ql-heart)}
.ql span{display:flex;flex-direction:column;min-width:0;line-height:1.15}
.ql b{font-size:16px;font-weight:700;white-space:nowrap}
.ql small{font-size:13px;opacity:.72;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* the 3D stage starts lower, so the kit is not hidden by the extra row */
@media (max-width:820px){.hero{padding-top:max(52svh,380px)}}
@media (max-width:640px){
  .nav .quick{gap:8px;padding-bottom:10px}
  .ql{flex-direction:column;justify-content:center;gap:5px;min-height:0;padding:9px 4px 8px;border-radius:16px;text-align:center}
  .ql i{width:34px;height:34px;border-radius:11px}
  .ql i svg{width:20px;height:20px}
  .ql b{font-size:13.5px}
  .ql small{display:none}
}
.ql b{max-width:100%;overflow:hidden;text-overflow:ellipsis}
@media (max-width:380px){.ql b{font-size:12.5px}.nav .quick{gap:6px}}

/* ===================== PRICING: four matching cards ===================== */
.pricing-4{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:44px}
.pricing-4 .plan-feature{padding:clamp(24px,3vw,40px);gap:18px}
.pricing-4 .plan-feature h3{font-size:clamp(24px,2.4vw,32px);line-height:1.1}
.pricing-4 .price-big b{font-size:clamp(60px,6vw,88px)}
.pricing-4 .price-big span{font-size:16px}
.pricing-4 .plan-feature li{font-size:16px}
.pricing-4 .plan-feature .btn{align-self:stretch;margin-top:auto;white-space:normal;text-align:center}
.pf-plan{box-shadow:0 0 0 2px var(--lamp),0 30px 60px -30px rgba(6,23,29,.5)}
.pf-visit::after{background:radial-gradient(circle,rgba(31,163,154,.5),transparent 65%)}
.pf-lab::after{background:radial-gradient(circle,rgba(142,107,216,.5),transparent 65%)}
.pf-review::after{background:radial-gradient(circle,rgba(255,184,77,.38),transparent 65%)}
.pf-visit .plan-badge,.pf-lab .plan-badge,.pf-review .plan-badge{background:rgba(255,255,255,.14);color:var(--feature-text);border:1px solid rgba(255,255,255,.22)}
.btn-glass-light{background:rgba(255,255,255,.1);color:var(--feature-text);border-color:rgba(255,255,255,.3)}
.btn-glass-light:hover{background:#fff;color:#06171D;border-color:#fff}
@media (max-width:700px){
  .pricing-4{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:86%;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;gap:14px;margin:32px calc(-1 * var(--gutter)) 0;padding:6px var(--gutter) 10px;scroll-padding:0 var(--gutter)}
  .pricing-4::-webkit-scrollbar{display:none}
  .pricing-4 .plan-feature{scroll-snap-align:start}
}

/* ===================== WHO WE HELP ===================== */
.who-eyebrow{display:inline-block;font-weight:700;font-size:16px;color:var(--accent-text);margin-bottom:10px}
.who-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:36px}
.wh-card{--ic:var(--sky);position:relative;overflow:hidden;padding:24px 22px 26px;border-radius:var(--r-md);background:var(--surface);border:1px solid var(--line);transition:transform .3s,box-shadow .3s,border-color .3s}
.wh-card::after{content:"";position:absolute;right:-50px;top:-50px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--ic) 22%,transparent),transparent 70%);pointer-events:none}
.wh-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:color-mix(in srgb,var(--ic) 45%,var(--line))}
.wh-card i{width:56px;height:56px;border-radius:17px;display:grid;place-items:center;background:color-mix(in srgb,var(--ic) 15%,transparent);color:var(--ic);transition:transform .4s cubic-bezier(.3,1.6,.5,1)}
.wh-card:hover i{transform:rotate(-8deg) scale(1.06)}
.wh-card i svg{width:32px;height:32px;fill:var(--ic)}
.wh-card .cut{fill:var(--surface)}
.wh-card .cut-s{stroke:var(--surface)}
.wh-card h3{margin-top:18px;font-size:22px;letter-spacing:-.02em}
.wh-card p{margin-top:8px;font-size:16px;color:var(--text-soft);line-height:1.5}
.wh-kid{--ic:var(--sky)}
.wh-women{--ic:#E5609A}
.wh-wound{--ic:var(--plus)}
.wh-elder{--ic:var(--ql-heart)}
html[data-theme="dark"] .wh-women{--ic:#FF7DB4}
.who-note{display:flex;align-items:center;gap:10px;margin-top:22px;font-size:15px;color:var(--muted)}
.who-note svg{flex:none;color:var(--plus)}
@media (max-width:1000px){.who-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.who-grid{gap:10px;margin-top:26px}.wh-card{padding:18px 16px 18px}.wh-card i{width:46px;height:46px;border-radius:14px}.wh-card i svg{width:26px;height:26px}.wh-card h3{font-size:19px;margin-top:14px}.wh-card p{font-size:14.5px}}

/* ===================== LOGO (red heart + heartline under the ink wordmark, animated) ===================== */
html,html[data-theme="light"]{--logo-ink:#0E2A33;--logo-red:#E5383B;--logo-glow:rgba(229,56,59,.30)}
html[data-theme="dark"]{--logo-ink:#FFFFFF;--logo-red:#FF4D55;--logo-glow:rgba(255,77,85,.62)}
.bogso-logo{display:block;height:46px;width:auto;overflow:visible}
.bl-l{fill:var(--logo-ink);transition:fill .35s;transform-box:fill-box;transform-origin:50% 100%;animation:bl-rise .7s cubic-bezier(.2,.9,.25,1.15) calc(.18s + var(--i) * .07s) both}
.bl-heart{transform-box:fill-box;transform-origin:50% 62%;animation:bl-pop .75s cubic-bezier(.3,1.6,.5,1) both,bl-beat 3.2s ease-in-out 1.9s infinite}
.bl-hfill{fill:var(--logo-red);transition:fill .35s;filter:drop-shadow(0 26px 34px var(--logo-glow));animation:bl-glow 3.2s ease-in-out 1.9s infinite}
.bl-ecg,.bl-blip,.bl-under,.bl-blip2{fill:none;stroke-linejoin:round}
.bl-ecg{stroke:#fff;stroke-width:10.3;stroke-linecap:round;stroke-dasharray:1 1;animation:bl-draw .7s cubic-bezier(.5,0,.5,1) .35s both}
.bl-under{stroke:var(--logo-red);stroke-width:15;stroke-linecap:round;stroke-dasharray:1 1;animation:bl-draw 1s cubic-bezier(.3,0,.2,1) 1.0s both}
.bl-blip,.bl-blip2{stroke:#FFE2A8;stroke-linecap:round;stroke-width:15;opacity:0;filter:drop-shadow(0 0 6px #FFC56B)}
.bl-blip{stroke-dasharray:.16 1.3;stroke-dashoffset:.16;animation:bl-run 3.2s linear 1.9s infinite}
.bl-blip2{stroke-width:20;stroke-dasharray:.06 1.3;stroke-dashoffset:.06;animation:bl-run2 3.2s linear 1.9s infinite}
.logo:hover .bl-heart{animation:bl-beat .9s ease-in-out}
@keyframes bl-rise{from{opacity:0;transform:translateY(26%)}to{opacity:1;transform:none}}
@keyframes bl-pop{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:none}}
@keyframes bl-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes bl-beat{0%,40%,100%{transform:none}8%{transform:scale(1.1)}15%{transform:scale(.98)}23%{transform:scale(1.06)}32%{transform:none}}
@keyframes bl-glow{0%,40%,100%{filter:drop-shadow(0 26px 34px var(--logo-glow))}8%,23%{filter:drop-shadow(0 30px 80px var(--logo-glow))}}
@keyframes bl-run{0%{stroke-dashoffset:.16;opacity:0}3%{opacity:1}20%{stroke-dashoffset:-1;opacity:1}22%,100%{stroke-dashoffset:-1;opacity:0}}
@keyframes bl-run2{0%,19%{stroke-dashoffset:.06;opacity:0}21%{opacity:1}52%{stroke-dashoffset:-1;opacity:1}55%,100%{stroke-dashoffset:-1;opacity:0}}
.foot .bogso-logo{height:53px}
.drawer .bogso-logo{height:38px}
@media (max-width:560px){.bogso-logo{height:36px}}
@media (prefers-reduced-motion:reduce){.bl-l,.bl-heart,.bl-ecg,.bl-hfill,.bl-under{animation:none}.bl-blip,.bl-blip2{display:none}}

/* hero copy sits left; the 3D street gets the right half (desktop) */
.hero>.wrap{width:100%}
@media (min-width:821px){.hero-inner{max-width:600px}.hero h1{font-size:clamp(44px,5.2vw,78px)}}

/* ===================== 📞 ADEEGYADA: visit request ===================== */
html,html[data-theme="light"]{--call:#1F9D57;--call-bg:#E3F5EC}
html[data-theme="dark"]{--call:#3CC98A;--call-bg:rgba(60,201,138,.14)}
.ql-call{--ic:var(--call)}
.ql-call i{position:relative}
.ql-ping{position:absolute;inset:0;border-radius:inherit;border:2px solid var(--call);opacity:0;animation:ql-ping 2.6s ease-out 1.5s infinite}
@keyframes ql-ping{0%{transform:scale(.9);opacity:.7}70%,100%{transform:scale(1.35);opacity:0}}
.ql-call i svg{animation:ql-ring 2.6s ease-in-out 1.5s infinite;transform-origin:50% 50%}
@keyframes ql-ring{0%,20%,100%{transform:none}4%,12%{transform:rotate(-14deg)}8%,16%{transform:rotate(14deg)}}
.hero-call{display:inline-flex;align-items:center;gap:10px}
.hc-ic{display:grid;place-items:center;width:30px;height:30px;margin-left:-8px;border-radius:50%;background:rgba(255,255,255,.22)}
.hc-ic svg{width:17px;height:17px;fill:#fff}
html.cm-open{overflow:hidden}
.cm{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:16px}
.cm-bg{position:absolute;inset:0;background:rgba(4,16,21,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .22s}
.cm-panel{position:relative;width:min(560px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:var(--surface);color:var(--text);border:1px solid var(--line);border-radius:28px;padding:28px 28px 24px;box-shadow:var(--shadow);transform:translateY(18px) scale(.98);opacity:0;transition:transform .26s cubic-bezier(.2,.9,.3,1.1),opacity .22s}
.cm.is-on .cm-bg{opacity:1}
.cm.is-on .cm-panel{transform:none;opacity:1}
.cm-x{position:absolute;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--surface-2);color:var(--text);font-size:26px;line-height:1;cursor:pointer}
.cm-head{display:flex;gap:14px;align-items:flex-start;padding-right:46px;margin-bottom:20px}
.cm-ic{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:var(--call-bg)}
.cm-ic svg{width:24px;height:24px;fill:var(--call)}
.cm-head h2{font-size:clamp(22px,3vw,28px);line-height:1.15}
.cm-head p{margin-top:6px;color:var(--text-soft);font-size:15.5px}
.cm-form{display:flex;flex-direction:column;gap:18px}
.cm-form fieldset{border:0;padding:0;margin:0;min-width:0}
.cm-form legend,.cm-label{font-weight:700;font-size:15px;margin-bottom:8px;padding:0}
.cm-form .field input:not([type=radio]),.cm-form select{min-height:52px;font-size:17px}
.cm-row{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:12px}
.cm-chips{display:grid;gap:8px}
.cm-chips.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.cm-chips.svc{grid-template-columns:repeat(2,minmax(0,1fr))}
.cm-chip{position:relative}
.cm-chip input{position:absolute;opacity:0;pointer-events:none}
.cm-chip>span{display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:52px;height:100%;padding:10px 14px;border-radius:14px;border:1.5px solid var(--field-line);cursor:pointer;font-weight:700;font-size:15.5px;transition:border-color .2s,background .2s}
.cm-chips.two .cm-chip>span{align-items:center}
.cm-chip small{font-weight:600;font-size:13px;color:var(--text-soft)}
.cm-chip input:checked+span{border-color:var(--sky);background:var(--chip);box-shadow:inset 0 0 0 1.5px var(--sky)}
.cm-chip input:focus-visible+span{outline:3px solid var(--sky);outline-offset:2px}
.cm-loc-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px}
.cm-gps{min-height:52px;gap:8px;color:var(--call);border-color:var(--call)}
.cm-gps svg{flex:none}
.cm-loc-row select{width:100%;font:inherit;padding:0 14px;border-radius:14px;border:1.5px solid var(--field-line);background:var(--field);color:var(--text)}
.cm-place{display:flex;gap:10px;align-items:flex-start;margin-top:4px;padding:12px 14px;border-radius:14px;background:var(--call-bg);font-size:14.5px;line-height:1.4;color:var(--text)}
.cm-place b{display:block;font-weight:700}
.cm-place small{display:block;margin-top:2px;color:var(--text-soft);font-weight:600}
.cm-pin{flex:none;width:10px;height:10px;margin-top:5px;border-radius:50%;background:var(--call);box-shadow:0 0 0 4px color-mix(in srgb,var(--call) 25%,transparent)}
.cm-total{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;border-radius:14px;background:var(--surface-2);font-size:15px;color:var(--text-soft)}
.cm-total b{color:var(--text)}
.cm-err{margin:0;padding:10px 14px;border-radius:12px;background:var(--bad-bg);color:var(--bad);font-weight:600;font-size:15px}
.cm-send{width:100%;justify-content:center;min-height:56px;font-size:17px}
.cm-fine{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}
.cm-form .field .msg{display:none;color:var(--bad);font-size:14px;font-weight:600}
.cm-form .has-err .msg{display:block}
.cm-form .has-err input,.cm-form .has-err .cm-chip>span{border-color:var(--bad)}
.cm-done{display:flex;flex-direction:column;gap:14px;text-align:left}
.cm-tick{display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--ok-bg);color:var(--ok)}
.cm-done h3{font-size:24px}
.cm-done p{margin:0;color:var(--text-soft)}
.cm-code{display:inline-block;padding:3px 10px;border-radius:999px;background:var(--warn-bg);color:var(--warn);font-weight:800;letter-spacing:.03em}
.cm-saved{color:var(--ok)!important;font-weight:700}
@media (max-width:560px){
  .cm{align-items:flex-end;padding:0}
  .cm-panel{border-radius:24px 24px 0 0;max-height:94dvh;padding:22px 18px calc(18px + env(safe-area-inset-bottom,0px))}
  .cm-row,.cm-loc-row{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){.ql-ping,.ql-call i svg{animation:none}.cm-panel,.cm-bg{transition:none}}

/* ===================== Hooyo & Dhallaan (mother & newborn, after birth) ===================== */
html,html[data-theme="light"]{--mama:#E5609A}
html[data-theme="dark"]{--mama:#FF7DB4}
.ql-mama{--ic:var(--mama)}
.ql-mama i svg{fill:none;stroke:var(--ic);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ql-mama i svg circle:first-child{fill:var(--ic);stroke:none}
.ql-mama .ql-baby{fill:color-mix(in srgb,var(--ic) 30%,transparent)}
.ql-mama .ql-baby-face{fill:var(--ic);stroke:none}
.pn-band{margin-top:20px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(22px,4vw,48px);align-items:start;box-shadow:0 0 0 2px var(--mama),0 30px 60px -30px rgba(6,23,29,.5)}
.pn-band::after{background:radial-gradient(circle,rgba(229,96,154,.5),transparent 65%)}
.pn-band .plan-badge{background:var(--mama);color:#fff}
.pn-main,.pn-side{display:flex;flex-direction:column;gap:18px;position:relative;z-index:1;min-width:0}
.pn-lead{color:var(--feature-soft);font-size:17px;max-width:52ch}
.pn-lists{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px}
.pn-band li{font-size:16px}
.pn-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.pn-steps li{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;padding:14px 18px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14)}
.pn-steps b{font-family:var(--display);font-size:clamp(34px,3.6vw,46px);font-weight:800;letter-spacing:-.04em;line-height:1;min-width:2.6ch}
.pn-steps span{display:flex;flex-direction:column;gap:2px}
.pn-steps strong{font-size:17px}
.pn-steps small{font-size:14px;color:var(--feature-soft)}
.pn-note{font-size:14.5px;color:var(--feature-soft);line-height:1.5}
.pn-band .btn{align-self:stretch;text-align:center;margin-top:0}
@media (max-width:900px){.pn-band{grid-template-columns:1fr}}
@media (max-width:560px){.pn-lists{grid-template-columns:1fr}}
@media (max-width:640px){.nav .quick{align-items:stretch}.ql-mama b{white-space:normal;line-height:1.1;font-size:12.5px}}

/* ===================== Services first: content panel right after the hero ===================== */
.light-a{border-radius:40px;margin-bottom:8vh;padding-bottom:8px}
.light-a #qiimaha{padding-top:clamp(56px,7vw,96px)}
.light-a #farmasi{padding-top:0}
@media (max-width:640px){.light-a{border-radius:28px;margin-bottom:5vh}.light-a #qiimaha{padding-top:44px}}

/* ===================== Farmasi hero: the capsule ===================== */
.rx-head{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);align-items:center;gap:clamp(20px,3vw,40px)}
.rx-copy .rx-btn{margin-top:28px}
.rx-stage{--px:0;--py:0;--k:1;position:relative;height:470px;perspective:1000px;user-select:none;-webkit-user-select:none}
.rx-cap{position:absolute;left:50%;top:50%;width:300px;height:92px;margin:-46px 0 0 -150px;
  transform:translate(calc(var(--px) * 18px),calc(var(--py) * 14px)) rotate(calc(-24deg + var(--px) * 6deg));transition:transform .5s cubic-bezier(.2,.8,.3,1)}
.rx-cap>i{position:absolute;top:0;height:100%;display:block}
.rx-cap-a,.rx-cap-b{width:53%;transition:transform 1s cubic-bezier(.2,1.45,.35,1)}
.rx-cap-a{left:0;z-index:2;border-radius:46px 10px 10px 46px;
  background:radial-gradient(ellipse 34% 26% at 32% 26%,rgba(255,255,255,.85),transparent 70%),linear-gradient(180deg,#FF7477,#E5383B 46%,#A81F27);
  box-shadow:inset -8px -12px 20px rgba(0,0,0,.22),inset 4px 6px 10px rgba(255,255,255,.18),0 26px 40px -18px rgba(168,31,39,.65)}
.rx-cap-b{right:0;z-index:1;border-radius:10px 46px 46px 10px;
  background:radial-gradient(ellipse 34% 26% at 60% 26%,#fff,transparent 70%),linear-gradient(180deg,#FFFFFF,#EEF3F1 48%,#BFCBC7);
  box-shadow:inset -8px -12px 20px rgba(0,0,0,.14),0 26px 40px -18px rgba(6,23,29,.45)}
.rx-cap-a::after{content:"";position:absolute;right:-1px;top:6%;bottom:6%;width:3px;border-radius:2px;background:rgba(0,0,0,.18)}
.rx-cap>.rx-cap-light{left:50%;top:50%;width:280px;height:280px;margin:-140px 0 0 -140px;border-radius:50%;z-index:0;opacity:0;transform:scale(.3);
  background:radial-gradient(circle,color-mix(in srgb,var(--rx) 55%,transparent),transparent 62%);transition:opacity .8s .15s,transform 1.1s .1s cubic-bezier(.2,1.2,.3,1)}
.rx-stage:not(.is-open) .rx-cap{animation:rx-bob 3.6s ease-in-out infinite}
@keyframes rx-bob{0%,100%{translate:0 -6px}50%{translate:0 8px}}
.rx-stage.is-open .rx-cap-a{transform:translate(-62px,-6px) rotate(-7deg)}
.rx-stage.is-open .rx-cap-b{transform:translate(62px,6px) rotate(6deg)}
.rx-stage.is-open .rx-cap-light{opacity:1;transform:scale(1)}

.rx-pops{position:absolute;inset:0;z-index:3;transform:translate(calc(var(--px) * -16px),calc(var(--py) * -16px));transition:transform .5s cubic-bezier(.2,.8,.3,1)}
.rx-pop{position:absolute;left:50%;top:50%;width:104px;height:104px;margin:-52px 0 0 -52px;padding:0;border:0;background:none;color:inherit;cursor:pointer;opacity:0;
  transform:translate(0,0) scale(.2);transition:transform .95s cubic-bezier(.2,1.5,.35,1) calc(.3s + var(--i) * .08s),opacity .3s calc(.3s + var(--i) * .08s)}
.rx-stage.is-open .rx-pop{opacity:1;transform:translate(calc(var(--x) * var(--k) * 1px),calc(var(--y) * var(--k) * 1px)) rotate(calc(var(--r) * 1deg))}
.rx-pop-in{position:relative;display:grid;place-items:center;width:100%;height:100%;border-radius:50%;background:var(--rx-tile);border:1px solid var(--rx-line);
  box-shadow:0 18px 30px -18px rgba(6,23,29,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);animation:rx-float 4.2s ease-in-out calc(var(--i) * -.7s) infinite;transition:scale .25s cubic-bezier(.3,1.6,.5,1),border-color .2s}
html[data-theme="light"] .rx-pop-in{background:#fff}
@keyframes rx-float{0%,100%{translate:0 -5px}50%{translate:0 6px}}
.rx-pop-art svg{width:74px;height:74px;display:block;filter:drop-shadow(0 6px 6px rgba(6,23,29,.14))}
.rx-pop b{position:absolute;bottom:-10px;left:50%;translate:-50% 0;padding:3px 9px;border-radius:999px;background:var(--lamp);color:#3A2400;font-family:var(--display);font-size:14px;letter-spacing:-.01em;white-space:nowrap;box-shadow:0 6px 12px -6px rgba(58,36,0,.5)}
.rx-pop i{position:absolute;top:-4px;right:-4px;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--rx);color:#fff;opacity:0;scale:.6;transition:opacity .2s,scale .25s cubic-bezier(.3,1.6,.5,1)}
html[data-theme="dark"] .rx-pop i{color:#05261B}
.rx-pop i svg{width:16px;height:16px}
.rx-pop:hover .rx-pop-in{scale:1.08;border-color:var(--rx)}
.rx-pop:hover i,.rx-pop.hit i{opacity:1;scale:1}
.rx-pop.hit .rx-pop-in{animation:rx-hit .45s cubic-bezier(.3,1.6,.5,1)}
@keyframes rx-hit{0%{scale:1}40%{scale:.88}100%{scale:1.06}}
.rx-plus1{position:absolute;left:50%;top:0;translate:-50% 0;font-weight:800;font-size:18px;color:var(--rx);pointer-events:none;animation:rx-up .9s ease-out forwards}
@keyframes rx-up{to{translate:-50% -46px;opacity:0}}

.rx-badge{position:absolute;right:0;bottom:26px;z-index:4;width:122px;height:122px;display:grid;place-items:center;border-radius:50%;background:var(--text);color:var(--bg);box-shadow:0 20px 34px -20px rgba(6,23,29,.6)}
.rx-badge svg{position:absolute;inset:0;width:100%;height:100%;animation:rx-spin 22s linear infinite}
.rx-badge text{font-size:9.6px;font-weight:800;fill:currentColor}
.rx-badge span{display:flex;flex-direction:column;align-items:center;line-height:1}
.rx-badge b{font-family:var(--display);font-size:30px;letter-spacing:-.04em;color:var(--rx)}
html[data-theme="light"] .rx-badge b{color:#6EE7B7}
.rx-badge small{font-size:12px;font-weight:700;margin-top:2px}
@keyframes rx-spin{to{rotate:360deg}}
.rx-hint{position:absolute;left:0;bottom:0;font-size:13.5px;font-weight:600;color:var(--muted);opacity:0;transition:opacity .5s 1.2s}
.rx-stage.is-open .rx-hint{opacity:1}

.rx-sparks i{position:absolute;width:14px;height:14px;opacity:.0;background:var(--c,var(--plus));clip-path:polygon(35% 0,65% 0,65% 35%,100% 35%,100% 65%,65% 65%,65% 100%,35% 100%,35% 65%,0 65%,0 35%,35% 35%);transition:opacity .6s .6s}
.rx-stage.is-open .rx-sparks i{opacity:.75;animation:rx-twinkle 3s ease-in-out infinite}
.rx-sparks i:nth-child(1){left:12%;top:16%;--c:var(--plus)}
.rx-sparks i:nth-child(2){left:78%;top:8%;--c:var(--rx);width:10px;height:10px;animation-delay:-.8s}
.rx-sparks i:nth-child(3){left:90%;top:46%;width:9px;height:9px;animation-delay:-1.6s}
.rx-sparks i:nth-child(4){left:6%;top:72%;--c:var(--rx);animation-delay:-2.2s}
.rx-sparks i:nth-child(5){left:36%;top:4%;width:8px;height:8px;--c:var(--lamp);animation-delay:-1.1s}
.rx-sparks i:nth-child(6){left:56%;top:92%;width:10px;height:10px;--c:var(--lamp);animation-delay:-2.6s}
@keyframes rx-twinkle{0%,100%{scale:1;rotate:0deg}50%{scale:.55;rotate:45deg}}

@media (max-width:980px){
  .rx-head{grid-template-columns:minmax(0,1fr)}
  .rx-stage{--k:.74;height:370px;margin-top:4px}
  .rx-pop{width:84px;height:84px;margin:-42px 0 0 -42px}
  .rx-pop-art svg{width:58px;height:58px}
  .rx-pop b{font-size:13px}
  .rx-cap{width:230px;height:72px;margin:-36px 0 0 -115px}
  .rx-badge{width:96px;height:96px;bottom:0}
  .rx-badge b{font-size:24px}.rx-badge text{font-size:11px}
}
@media (max-width:420px){.rx-stage{--k:.6;height:330px}.rx-pop{width:76px;height:76px;margin:-38px 0 0 -38px}.rx-pop-art svg{width:52px;height:52px}.rx-cap{width:190px;height:60px;margin:-30px 0 0 -95px}.rx-stage.is-open .rx-cap-a{transform:translate(-40px,-4px) rotate(-7deg)}.rx-stage.is-open .rx-cap-b{transform:translate(40px,4px) rotate(6deg)}}
@media (prefers-reduced-motion:reduce){
  .rx-cap,.rx-pop-in,.rx-badge svg,.rx-sparks i{animation:none!important}
  .rx-cap-a,.rx-cap-b,.rx-pop,.rx-cap-light,.rx-hint,.rx-sparks i{transition:none!important}
}
html.reduced .rx-stage .rx-cap-a{transform:translate(-62px,-6px) rotate(-7deg)}
html.reduced .rx-stage .rx-cap-b{transform:translate(62px,6px) rotate(6deg)}
html.reduced .rx-stage .rx-cap-light{opacity:1;transform:none}
html.reduced .rx-stage .rx-pop{opacity:1;transform:translate(calc(var(--x) * var(--k) * 1px),calc(var(--y) * var(--k) * 1px)) rotate(calc(var(--r) * 1deg))}
html.reduced .rx-stage .rx-hint,html.reduced .rx-stage .rx-sparks i{opacity:.8}

/* ===================== Request form: mother mode + location feedback ===================== */
.cm:not(.is-pn) .pn-only{display:none!important}
.cm.is-pn .pn-hide{display:none!important}
.cm.is-pn:not(.pn-grid) .cm-svcset{display:none}
.cm.is-pn .cm-ic{background:color-mix(in srgb,var(--mama) 16%,transparent)}
.cm-ic .cm-mama,.cm-pnsum-ic .cm-mama{width:26px;height:26px;fill:none;stroke:var(--mama);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.cm-mama circle:first-child{fill:var(--mama);stroke:none}
.cm-chips.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.cm-chips.three .cm-chip>span,.cm-chips.two .cm-chip>span{align-items:center;text-align:center;font-weight:600;font-size:15px}
.cm.is-pn .cm-chip input:checked+span{border-color:var(--mama);box-shadow:inset 0 0 0 1.5px var(--mama);background:color-mix(in srgb,var(--mama) 10%,transparent)}
.cm-opt{font-weight:500;color:var(--muted);font-size:13px}
.cm-pnsum{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;border:1.5px solid color-mix(in srgb,var(--mama) 45%,transparent);background:color-mix(in srgb,var(--mama) 8%,transparent)}
.cm-pnsum-ic{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:color-mix(in srgb,var(--mama) 16%,transparent)}
.cm-pnsum>span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column}
.cm-pnsum small{color:var(--text-soft);font-weight:600;font-size:13.5px;margin-top:2px}
.cm-link{flex:none;border:0;background:none;color:var(--sky);font:inherit;font-weight:700;font-size:14px;cursor:pointer;padding:8px 4px;text-decoration:underline;text-underline-offset:3px}
.cm-gps{position:relative}
.cm-spin{display:none;width:18px;height:18px;border-radius:50%;border:2.4px solid color-mix(in srgb,var(--call) 30%,transparent);border-top-color:var(--call);animation:cm-spin .8s linear infinite}
.cm-gps.is-busy .cm-spin{display:block}.cm-gps.is-busy svg{display:none}
.cm-gps:disabled{opacity:1;cursor:progress}
@keyframes cm-spin{to{transform:rotate(360deg)}}
.cm-place.is-warn{background:var(--warn-bg);color:var(--warn);font-weight:600}
.cm-attn{animation:cm-attn 1.2s ease-out 2;border-color:var(--sky)!important}
@keyframes cm-attn{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--sky) 55%,transparent)}100%{box-shadow:0 0 0 12px transparent}}
@media (max-width:420px){.cm-chips.three{grid-template-columns:repeat(2,minmax(0,1fr))}}
html[data-theme="dark"] .rx-badge b{color:#0A7A54}

@media (max-width:560px){.rx-badge{display:none}}