/* HealthSarthi landing — shared theme, layout and animation styles.
   Used by index.html and the product pages; Tailwind utilities live in tw.css. */
  /* ─── theme tokens (Clinical Precision palette; dark variant keeps the same hues) ─── */
  :root{
    --c-primary:0 80 52;
    --c-primary-container:0 107 71;
    --c-primary-fixed:157 245 198;
    --c-on-primary:255 255 255;
    --c-secondary:0 108 75;
    --c-secondary-container:130 245 193;
    --c-surface:250 248 255;
    --c-surface-container:234 237 255;
    --c-surface-container-low:242 243 255;
    --c-surface-container-high:225 231 255;
    --c-surface-container-lowest:255 255 255;
    --c-on-surface:19 27 46;
    --c-on-surface-variant:63 73 66;
    --c-outline:111 122 114;
    --c-outline-variant:190 201 192;
    --c-error:186 26 26;
    --c-error-container:255 218 214;
    --c-on-error:255 255 255;
    --c-on-error-container:147 0 10;
    --c-inverse-surface:40 48 68;
    --c-inverse-on-surface:238 240 255;
    --c-emerald-50:236 253 245;
    --c-emerald-100:209 250 229;
    --c-emerald-200:167 243 208;
    --c-emerald-300:110 231 183;
    --c-emerald-500:16 185 129;
    --c-emerald-600:5 150 105;
    --c-emerald-700:4 120 87;
    --c-emerald-800:6 95 70;
    --c-purple-100:243 232 255;
    --c-purple-300:216 180 254;
    --c-purple-600:147 51 234;
    --c-purple-700:126 34 206;
    --c-purple-800:107 33 168;
    --c-cyan-100:207 250 254;
    --c-cyan-300:103 232 249;
    --c-cyan-700:14 116 144;
    --c-cyan-800:21 94 117;
    --c-amber-300:252 211 77;
    --c-amber-500:245 158 11;
    --c-amber-700:180 83 9;
    --c-amber-800:146 64 14;
    --c-rose-300:253 164 175;
    --c-rose-700:190 18 60;
    --c-rose-800:159 18 57;
    --c-sky-200:186 230 253;
    --c-sky-400:56 189 248;
    --c-sky-500:14 165 233;
    --c-sky-900:12 74 110;
    /* extra Material tokens used by medstock.html (DESIGN.md "Clinical Precision") */
    --c-on-primary-container:255 255 255;
    --c-on-secondary-container:0 113 78;
    --c-surface-container-highest:218 226 253;
    --c-surface-variant:218 226 253;
    --c-tertiary:132 83 0;
    --c-tertiary-container:166 105 0;
    --c-tertiary-fixed:255 221 184;
    --c-tertiary-fixed-dim:255 185 95;
    --c-on-tertiary-fixed:42 23 0;
    --c-primary-fixed-dim:113 219 166;
    --c-inverse-primary:113 219 166;
    color-scheme:light;
  }
  :root[data-theme="dark"]{
    --c-primary:61 220 151;
    --c-primary-container:30 158 106;
    --c-primary-fixed:12 42 30;
    --c-on-primary:3 19 11;
    --c-secondary:95 221 170;
    --c-secondary-container:17 49 36;
    --c-surface:0 0 0;
    --c-surface-container:18 18 18;
    --c-surface-container-low:10 10 10;
    --c-surface-container-high:24 24 24;
    --c-surface-container-lowest:14 14 14;
    --c-on-surface:243 243 243;
    --c-on-surface-variant:161 161 161;
    --c-outline:110 110 110;
    --c-outline-variant:38 38 38;
    --c-error:255 138 128;
    --c-error-container:58 20 18;
    --c-on-error:26 0 0;
    --c-on-error-container:255 218 214;
    --c-inverse-surface:243 243 243;
    --c-inverse-on-surface:14 14 14;
    --c-emerald-50:10 31 23;
    --c-emerald-100:15 42 31;
    --c-emerald-200:21 58 43;
    --c-emerald-300:27 74 53;
    --c-emerald-500:16 185 129;
    --c-emerald-600:52 211 153;
    --c-emerald-700:110 231 183;
    --c-emerald-800:134 239 172;
    --c-purple-100:36 26 51;
    --c-purple-300:61 44 85;
    --c-purple-600:196 167 255;
    --c-purple-700:196 167 255;
    --c-purple-800:216 180 254;
    --c-cyan-100:11 42 48;
    --c-cyan-300:23 73 79;
    --c-cyan-700:103 232 249;
    --c-cyan-800:165 243 252;
    --c-amber-300:74 52 16;
    --c-amber-500:245 183 64;
    --c-amber-700:252 211 77;
    --c-amber-800:252 211 77;
    --c-rose-300:74 26 36;
    --c-rose-700:253 164 175;
    --c-rose-800:253 164 175;
    --c-sky-200:18 48 63;
    --c-sky-400:30 90 130;
    --c-sky-500:56 189 248;
    --c-sky-900:186 230 253;
    --c-on-primary-container:3 19 11;
    --c-on-secondary-container:130 245 193;
    --c-surface-container-highest:34 34 34;
    --c-surface-variant:34 34 34;
    --c-tertiary:255 185 95;
    --c-tertiary-container:166 105 0;
    --c-tertiary-fixed:74 52 16;
    --c-tertiary-fixed-dim:245 183 64;
    --c-on-tertiary-fixed:255 221 184;
    --c-primary-fixed-dim:61 220 151;
    --c-inverse-primary:0 107 71;
    color-scheme:dark;
  }
  /* Flutter web draws its own focused border (green, 2px). Chrome also paints
     its :focus-visible ring on the hidden <input> that receives the typing —
     that is the blue rectangle around every field. */
  input:focus,input:focus-visible,textarea:focus,textarea:focus-visible,[contenteditable]:focus{outline:none !important;box-shadow:none !important;}
  flutter-view:focus,flutter-view:focus-visible,flt-glass-pane:focus,flt-glass-pane:focus-visible,flt-semantics-host:focus,flt-text-editing-host:focus{outline:none !important;}
  html,body{margin:0;padding:0;}
  main > section{scroll-margin-top:84px;}
  :root[data-theme="dark"] .bg-\[radial-gradient\(\#bec9c0_1\.2px\,transparent_1\.2px\)\]{background-image:radial-gradient(#2a2a2a 1.2px,transparent 1.2px) !important;}
  :root[data-theme="dark"] .fcard{box-shadow:0 18px 44px rgb(0 0 0 / .6),0 0 0 1px rgb(255 255 255 / .04);}
  body{overscroll-behavior:none;background:rgb(var(--c-surface));color:rgb(var(--c-on-surface));transition:background .3s ease,color .3s ease;}
  ::-webkit-scrollbar{display:none;}
  .material-symbols-outlined{font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;}

  @keyframes float-slow{0%,100%{transform:translateY(0px) rotate(0deg);}50%{transform:translateY(-8px) rotate(1deg);}}
  @keyframes pulse-glow{0%,100%{opacity:.45;transform:scale(1);}50%{opacity:.75;transform:scale(1.08);}}
  @keyframes spin-slow{from{transform:translate(-50%,-50%) rotate(0deg);}to{transform:translate(-50%,-50%) rotate(360deg);}}
  @keyframes spin-reverse{from{transform:translate(-50%,-50%) rotate(360deg);}to{transform:translate(-50%,-50%) rotate(0deg);}}
  .animate-float{animation:float-slow 7s ease-in-out infinite;}
  .animate-glow{animation:pulse-glow 8s ease-in-out infinite;}
  .animate-orbit-cw{animation:spin-slow 110s linear infinite;}
  .animate-orbit-ccw{animation:spin-reverse 85s linear infinite;}
  .perspective-container{perspective:1200px;}
  .preserve-3d{transform-style:preserve-3d;}
  .hover-card-3d{transition:transform .22s cubic-bezier(.2,0,0,1),box-shadow .25s ease;}
  .hover-card-3d:hover{transform:translateY(-4px) rotateX(1.2deg) rotateY(-.8deg);}


  /* ─── brand: the H mark as an image, the wordmark as live text so it reads in both themes ─── */
  .hs-brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap;}
  .hs-brand img{height:34px;width:auto;display:block;}
  .hs-wordmark{font-family:Nunito,Inter,sans-serif;font-weight:800;font-size:1.3rem;letter-spacing:-.02em;line-height:1;}
  .hs-wordmark .h{color:#0E4D3A;} .hs-wordmark .s{color:#1F62D4;}
  :root[data-theme="dark"] .hs-wordmark .h{color:#5FD3A6;} :root[data-theme="dark"] .hs-wordmark .s{color:#7FB2FF;}
  .hs-tagline{display:block;font-size:9px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:rgb(var(--c-on-surface-variant));margin-top:3px;}
  /* ─── Cookie / storage notice ───────────────────────────────────────────── */
  /* Bottom-right card, shown once to a new visitor. What it says is exactly
     what the page does: one localStorage key (theme), one sessionStorage flag
     on the app origin, Cloudflare's cookieless analytics, a sign-in cookie
     only after sign-in. There is nothing optional to decline, so one button. */
  .cn{position:fixed;right:20px;bottom:20px;z-index:70;width:min(400px,calc(100vw - 32px));
    background:rgb(var(--c-surface-container-lowest) / .96);backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);
    border:1px solid rgb(var(--c-outline-variant) / .6);border-radius:24px 24px 8px 24px;
    box-shadow:0 18px 50px rgb(0 0 0 / .16),0 0 0 1px rgb(var(--c-primary) / .06);
    padding:18px 18px 16px;display:none;opacity:0;transform:translateY(14px) scale(.98);
    transition:opacity .28s ease,transform .32s cubic-bezier(.22,1,.36,1);}
  .cn.show{display:block;} .cn.in{opacity:1;transform:none;}
  .cn-head{display:flex;align-items:center;gap:10px;margin-bottom:8px;}
  .cn-ico{width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgb(var(--c-primary) / .10);color:rgb(var(--c-primary));}
  .cn-ico .material-symbols-outlined{font-size:19px;}
  .cn h3{margin:0;font-size:.95rem;font-weight:700;color:rgb(var(--c-on-surface));letter-spacing:-.01em;}
  .cn p{margin:0;font-size:.82rem;line-height:1.5;color:rgb(var(--c-on-surface-variant));}
  .cn p a{color:rgb(var(--c-primary));font-weight:600;text-decoration:underline;text-underline-offset:2px;}
  .cn-actions{display:flex;align-items:center;gap:10px;margin-top:14px;}
  .cn-ok{display:inline-flex;align-items:center;justify-content:center;height:38px;padding:0 18px;border-radius:999px;border:0;cursor:pointer;
    font:inherit;font-size:.84rem;font-weight:600;color:rgb(var(--c-surface));background:rgb(var(--c-on-surface));transition:transform .18s ease,box-shadow .2s ease;}
  .cn-ok:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgb(0 0 0 / .18);}
  .cn-ok:focus-visible,.cn-more:focus-visible{outline:2px solid rgb(var(--c-primary));outline-offset:2px;}
  .cn-more{font-size:.82rem;font-weight:600;color:rgb(var(--c-on-surface-variant));text-decoration:none;padding:8px 6px;}
  .cn-more:hover{color:rgb(var(--c-on-surface));}
  @media (max-width:520px){ .cn{right:16px;left:16px;bottom:16px;width:auto;border-radius:20px;} }
  @media (prefers-reduced-motion:reduce){ .cn{transition:none;} }
  /* ─── MedStock pill nav ──────────────────────────────────────────────────── */
  nav.ms-nav{position:sticky;top:12px;z-index:60;padding:0 16px;}
  .ms-nav .nav-in{
    max-width:1420px;margin:0 auto;display:flex;align-items:center;gap:18px;
    height:60px;padding:0 10px 0 20px;
    background:rgb(var(--c-surface-container-lowest) / .84);
    backdrop-filter:blur(22px) saturate(180%);-webkit-backdrop-filter:blur(22px) saturate(180%);
    border:1px solid rgb(var(--c-outline-variant) / .6);border-radius:999px;
    box-shadow:0 1px 3px rgb(0 0 0 / .05),0 0 0 1px rgb(var(--c-primary) / .06);
    transition:background .3s ease,border-color .3s ease,height .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease;
  }
  nav.ms-nav.scrolled .nav-in{height:54px;box-shadow:0 10px 30px rgb(0 0 0 / .10),0 0 0 1px rgb(var(--c-primary) / .10);}
  :root[data-theme="dark"] nav.ms-nav.scrolled .nav-in{box-shadow:0 10px 30px rgb(0 0 0 / .6),0 0 0 1px rgb(var(--c-primary) / .14);}
  .ms-nav .brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.05rem;color:rgb(var(--c-on-surface));letter-spacing:-.02em;text-decoration:none;white-space:nowrap;}
  .ms-nav .brand .mark{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(145deg,rgb(var(--c-primary-container)),rgb(var(--c-primary)));color:rgb(var(--c-on-primary));box-shadow:0 4px 14px rgb(var(--c-primary) / .35);flex:none;}
  :root[data-theme="dark"] .ms-nav .brand .mark{color:#04150D;}
  .ms-nav .nav-links{display:flex;gap:18px;align-items:center;margin-left:12px;padding-left:18px;border-left:1px solid rgb(var(--c-outline-variant) / .5);}
  .ms-nav .nav-links a{position:relative;color:rgb(var(--c-on-surface-variant));font-size:.875rem;font-weight:500;text-decoration:none;padding:4px 0;white-space:nowrap;transition:color .15s ease;}
  .ms-nav .nav-links a::after{content:"";position:absolute;left:0;bottom:-3px;width:0;height:2px;border-radius:2px;background:rgb(var(--c-primary));transition:width .22s cubic-bezier(.22,1,.36,1);}
  .ms-nav .nav-links a:hover{color:rgb(var(--c-on-surface));}
  .ms-nav .nav-links a:hover::after,.ms-nav .nav-links a.active::after{width:100%;}
  .ms-nav .nav-links a.active{color:rgb(var(--c-on-surface));}
  .ms-nav .nav-cta{margin-left:auto;display:flex;gap:10px;align-items:center;flex:none;}
  .ms-nav .sign{color:rgb(var(--c-on-surface-variant));font-size:.875rem;font-weight:500;padding:8px 10px;text-decoration:none;white-space:nowrap;transition:color .15s ease;}
  .ms-nav .sign:hover{color:rgb(var(--c-on-surface));}
  .ms-nav .cta{
    display:inline-flex;align-items:center;gap:10px;height:40px;padding:0 6px 0 20px;border-radius:999px;
    font-size:.875rem;font-weight:600;text-decoration:none;white-space:nowrap;flex:none;
    color:rgb(var(--c-surface));background:rgb(var(--c-on-surface));
    transition:transform .18s cubic-bezier(.22,1,.36,1),box-shadow .22s ease;
  }
  .ms-nav .cta .ic{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:rgb(var(--c-surface) / .16);transition:transform .32s cubic-bezier(.22,1,.36,1);}
  .ms-nav .cta:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgb(0 0 0 / .22);}
  .ms-nav .cta:hover .ic{transform:translateX(3px);}
  #theme-toggle{width:38px;height:38px;border-radius:50%;border:1.5px solid rgb(var(--c-outline-variant) / .8);background:rgb(var(--c-surface-container));cursor:pointer;display:grid;place-items:center;transition:all .2s cubic-bezier(.22,1,.36,1);flex:none;position:relative;overflow:hidden;color:rgb(var(--c-on-surface));padding:0;}
  #theme-toggle:hover{transform:scale(1.1) rotate(12deg);border-color:rgb(var(--c-primary) / .5);}
  #theme-toggle:focus-visible{outline:2px solid rgb(var(--c-primary));outline-offset:2px;}
  #theme-toggle .material-symbols-outlined{position:absolute;font-size:19px;transition:opacity .28s ease,transform .36s cubic-bezier(.34,1.56,.64,1);}
  #theme-toggle .icon-sun{opacity:1;transform:rotate(0) scale(1);color:rgb(var(--c-amber-500));}
  #theme-toggle .icon-moon{opacity:0;transform:rotate(-120deg) scale(.4);}
  :root[data-theme="dark"] #theme-toggle .icon-sun{opacity:0;transform:rotate(120deg) scale(.4);}
  :root[data-theme="dark"] #theme-toggle .icon-moon{opacity:1;transform:rotate(0) scale(1);color:rgb(var(--c-primary));}
  .nav-burger{display:none;width:38px;height:38px;border-radius:50%;border:1.5px solid rgb(var(--c-outline-variant) / .8);background:rgb(var(--c-surface-container));place-items:center;cursor:pointer;color:rgb(var(--c-on-surface));padding:0;}
  .nav-drawer{display:none;}
  @media (max-width:1460px){ .ms-nav .nav-links{gap:16px;} }
  @media (max-width:1240px){
    .ms-nav .nav-links{display:none;}
    .nav-burger{display:grid;}
    .nav-drawer{display:block;position:fixed;left:16px;right:16px;top:84px;z-index:59;background:rgb(var(--c-surface-container-lowest) / .96);backdrop-filter:blur(22px);border:1px solid rgb(var(--c-outline-variant) / .6);border-radius:24px;box-shadow:0 24px 60px rgb(0 0 0 / .18);padding:10px;opacity:0;pointer-events:none;transform:translateY(-8px) scale(.98);transition:opacity .22s ease,transform .26s cubic-bezier(.22,1,.36,1);}
    .nav-drawer.open{opacity:1;pointer-events:auto;transform:none;}
    .nav-drawer a{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:14px;font-weight:500;font-size:.9rem;color:rgb(var(--c-on-surface));text-decoration:none;}
    .nav-drawer a:hover{background:rgb(var(--c-surface-container));}
    .nav-drawer a .material-symbols-outlined{color:rgb(var(--c-primary));font-size:20px;}
  }
  @media (max-width:520px){
    nav.ms-nav{padding:0 10px;} .ms-nav .nav-in{padding:0 8px 0 14px;gap:8px;}
    .ms-nav .cta{padding:0;width:38px;height:38px;justify-content:center;} .ms-nav .cta .lbl{display:none;} .ms-nav .cta .ic{background:transparent;}
  }

  /* ─── Book a demo: nav button + modal form ───────────────────────────────── */
  .ms-nav .demo{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 16px;border-radius:999px;font-size:.84rem;font-weight:600;color:rgb(var(--c-primary));background:transparent;border:1.5px solid rgb(var(--c-primary) / .45);cursor:pointer;white-space:nowrap;transition:background .2s ease,border-color .2s ease,transform .18s ease;font-family:inherit;}
  .ms-nav .demo:hover{background:rgb(var(--c-primary) / .08);border-color:rgb(var(--c-primary));transform:translateY(-1px);}
  .ms-nav .demo .material-symbols-outlined{font-size:17px;}
  /* Between the drawer breakpoint and 1460px the full nav does not fit in the pill: drop "Sign in" (also in the app) and the demo label. */
  @media (max-width:1460px){ .ms-nav .demo .lbl{display:none;} .ms-nav .demo{width:38px;padding:0;justify-content:center;} .ms-nav .sign{display:none;} }
  .dm-backdrop{position:fixed;inset:0;z-index:100;background:rgb(0 0 0 / .45);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:16px;}
  .dm-backdrop.open{display:flex;animation:dm-in .2s ease;}
  @keyframes dm-in{from{opacity:0}to{opacity:1}}
  .dm{width:100%;max-width:640px;max-height:calc(100vh - 32px);overflow:auto;background:rgb(var(--c-surface-container-lowest));color:rgb(var(--c-on-surface));border:1px solid rgb(var(--c-outline-variant) / .6);border-radius:24px;box-shadow:0 30px 80px rgb(0 0 0 / .3);animation:dm-up .28s cubic-bezier(.22,1,.36,1);}
  @keyframes dm-up{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
  .dm-head{display:flex;align-items:flex-start;gap:12px;padding:22px 24px 14px;border-bottom:1px solid rgb(var(--c-outline-variant) / .4);}
  .dm-head img{height:36px;width:auto;flex:none;}
  .dm-head h2{font-size:1.25rem;font-weight:700;letter-spacing:-.02em;margin:0;}
  .dm-head p{font-size:.85rem;color:rgb(var(--c-on-surface-variant));margin:2px 0 0;}
  .dm-close{margin-left:auto;width:36px;height:36px;border-radius:50%;border:1px solid rgb(var(--c-outline-variant) / .7);background:rgb(var(--c-surface-container));color:rgb(var(--c-on-surface));cursor:pointer;display:grid;place-items:center;flex:none;}
  .dm-body{padding:18px 24px 24px;}
  .dm-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px;}
  .dm-field{display:flex;flex-direction:column;gap:5px;min-width:0;}
  .dm-field.full{grid-column:1 / -1;}
  .dm-field label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:rgb(var(--c-on-surface-variant));}
  .dm-field label .opt{font-weight:500;text-transform:none;letter-spacing:0;color:rgb(var(--c-outline));margin-left:4px;}
  .dm-field input,.dm-field select,.dm-field textarea{width:100%;font:inherit;font-size:.92rem;color:rgb(var(--c-on-surface));background:rgb(var(--c-surface-container-lowest));border:1.5px solid rgb(var(--c-outline-variant));border-radius:12px;padding:10px 12px;outline:none;transition:border-color .15s ease,box-shadow .15s ease;}
  .dm-field textarea{min-height:88px;resize:vertical;}
  .dm-field input:focus,.dm-field select:focus,.dm-field textarea:focus{border-color:rgb(var(--c-primary-container));box-shadow:0 0 0 3px rgb(var(--c-primary) / .15);}
  .dm-field.invalid input,.dm-field.invalid select,.dm-field.invalid textarea{border-color:rgb(var(--c-error));}
  .dm-field .err{display:none;font-size:.78rem;color:rgb(var(--c-error));}
  .dm-field.invalid .err{display:block;}
  .dm-phone{display:flex;align-items:center;border:1.5px solid rgb(var(--c-outline-variant));border-radius:12px;overflow:hidden;transition:border-color .15s ease,box-shadow .15s ease;}
  .dm-phone:focus-within{border-color:rgb(var(--c-primary-container));box-shadow:0 0 0 3px rgb(var(--c-primary) / .15);}
  .dm-field.invalid .dm-phone{border-color:rgb(var(--c-error));}
  .dm-phone span{padding:10px 10px 10px 12px;font-size:.92rem;font-weight:600;color:rgb(var(--c-on-surface-variant));background:rgb(var(--c-surface-container-low));border-right:1px solid rgb(var(--c-outline-variant));}
  .dm-phone input{border:0 !important;border-radius:0 !important;box-shadow:none !important;letter-spacing:.04em;}
  .dm-consent{display:flex;gap:10px;align-items:flex-start;font-size:.84rem;color:rgb(var(--c-on-surface-variant));margin-top:16px;cursor:pointer;}
  .dm-consent input{width:18px;height:18px;margin-top:2px;flex:none;accent-color:rgb(var(--c-primary-container));}
  .dm-consent a{color:rgb(var(--c-primary));font-weight:600;text-decoration:underline;}
  .dm-consent.invalid{color:rgb(var(--c-error));}
  .dm-actions{display:flex;align-items:center;gap:12px;margin-top:18px;flex-wrap:wrap;}
  .dm-submit{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 22px;border-radius:999px;border:0;font:inherit;font-size:.9rem;font-weight:600;color:rgb(var(--c-on-primary));background:rgb(var(--c-primary-container));cursor:pointer;box-shadow:0 8px 20px rgb(var(--c-primary) / .3);transition:transform .18s ease,background .2s ease;}
  .dm-submit:hover{background:rgb(var(--c-primary));transform:translateY(-1px);}
  .dm-submit[disabled]{opacity:.6;cursor:progress;transform:none;}
  .dm-note{font-size:.76rem;color:rgb(var(--c-outline));}
  .dm-alert{display:none;padding:12px 14px;border-radius:12px;font-size:.85rem;margin-bottom:14px;}
  .dm-alert.err{display:block;background:rgb(var(--c-error-container));color:rgb(var(--c-on-error-container));}
  .dm-success{display:none;text-align:center;padding:36px 24px 40px;}
  .dm-success .ico{width:64px;height:64px;border-radius:50%;margin:0 auto 14px;display:grid;place-items:center;background:rgb(var(--c-emerald-100));color:rgb(var(--c-emerald-800));}
  .dm-success .ico .material-symbols-outlined{font-size:34px;}
  .dm-success h3{font-size:1.2rem;font-weight:700;margin:0 0 6px;}
  .dm-success p{font-size:.9rem;color:rgb(var(--c-on-surface-variant));margin:0 auto;max-width:40ch;}
  .dm.sent .dm-body,.dm.sent .dm-head p{display:none;} .dm.sent .dm-success{display:block;}
  @media (max-width:560px){ .dm-grid{grid-template-columns:1fr;} .dm-head,.dm-body{padding-left:18px;padding-right:18px;} }
  body.dm-lock{overflow:hidden;}
  /* ─── hero: entrance + floating sample screens ───────────────────────────── */
  @keyframes hero-in{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
  .hero-copy > *{animation:hero-in .7s cubic-bezier(.22,1,.36,1) both;}
  .hero-copy > *:nth-child(1){animation-delay:.05s;} .hero-copy > *:nth-child(2){animation-delay:.15s;} .hero-copy > *:nth-child(3){animation-delay:.25s;} .hero-copy > *:nth-child(4){animation-delay:.35s;} .hero-copy > *:nth-child(5){animation-delay:.45s;}
  .fcard{
    position:absolute;z-index:5;width:250px;display:none;text-align:left;
    background:rgb(var(--c-surface-container-lowest) / .96);backdrop-filter:blur(14px);
    border:1px solid rgb(var(--c-outline-variant) / .7);border-radius:20px;
    box-shadow:0 18px 44px rgb(19 27 46 / .12),0 1px 2px rgb(19 27 46 / .06);
    padding:12px 14px;font-size:11px;color:rgb(var(--c-on-surface-variant));
    animation:float-slow var(--dur,8s) ease-in-out infinite;animation-delay:var(--del,0s);
    transition:transform .3s ease,box-shadow .3s ease;
  }
  .fcard:hover{box-shadow:0 26px 60px rgb(19 27 46 / .18);}
  .fcard .hd{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
  .fcard .hd .ico{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:rgb(var(--c-surface-container-high));color:rgb(var(--c-primary));flex:none;}
  .fcard .hd .ico .material-symbols-outlined{font-size:16px;}
  .fcard .hd b{display:block;font-size:12px;color:rgb(var(--c-on-surface));font-weight:600;line-height:1.2;}
  .fcard .hd small{font-size:10px;color:rgb(var(--c-on-surface-variant));}
  .fcard .hd .st{margin-left:auto;font-size:9.5px;font-weight:700;padding:2px 7px;border-radius:999px;background:rgb(var(--c-emerald-100));color:rgb(var(--c-emerald-800));border:1px solid rgb(var(--c-emerald-300));white-space:nowrap;}
  .fcard .hd .st.warn{background:rgb(var(--c-amber-300) / .35);color:rgb(var(--c-amber-800));border-color:rgb(var(--c-amber-300));}
  .fcard .row{display:flex;justify-content:space-between;align-items:center;padding:5px 0;border-top:1px solid rgb(var(--c-outline-variant) / .35);}
  .fcard .row:first-of-type{border-top:none;}
  .fcard .row b{color:rgb(var(--c-on-surface));font-weight:600;font-variant-numeric:tabular-nums;}
  .fcard .bar{height:5px;border-radius:999px;background:rgb(var(--c-surface-container));overflow:hidden;margin-top:6px;}
  .fcard .bar i{display:block;height:100%;width:var(--w,60%);background:rgb(var(--c-primary-container));border-radius:999px;}
  .fcard .steps{display:flex;gap:4px;margin-top:8px;}
  .fcard .steps i{flex:1;height:4px;border-radius:999px;background:rgb(var(--c-surface-container));}
  .fcard .steps i.on{background:rgb(var(--c-primary-container));}
  .fcard .btnrow{display:flex;gap:6px;margin-top:8px;}
  .fcard .btnrow span{flex:1;text-align:center;font-size:10px;font-weight:600;padding:6px 8px;border-radius:999px;border:1px solid rgb(var(--c-outline-variant) / .7);color:rgb(var(--c-on-surface));}
  .fcard .btnrow span.pri{background:rgb(var(--c-primary-container));color:rgb(var(--c-on-primary));border-color:transparent;}
  .fcard .av{width:26px;height:26px;border-radius:8px;background:rgb(var(--c-primary-container));color:rgb(var(--c-on-primary));font-weight:700;font-size:10px;display:grid;place-items:center;}
  @media (min-width:1400px){ .fcard{display:block;} }
  [data-parallax]:not(.hero-layer){transform:translateY(var(--py,0));will-change:transform;}


  /* ─── hero mouse parallax: each layer drifts with the pointer by its depth ─── */
  #top{--mx:0;--my:0;}
  .hero-layer{transform:translate3d(calc(var(--mx) * var(--dx,0px)),calc(var(--py,0px) + var(--my) * var(--dy,0px)),0);transition:transform .9s cubic-bezier(.22,1,.36,1);will-change:transform;}
  .hero-layer.far{filter:blur(.6px);}
  .hero-copy{--dx:-6px;--dy:-4px;}
  @media (prefers-reduced-motion:reduce){ .hero-layer{transform:none !important;transition:none;} .hero-layer.far{filter:none;} }
  /* ─── scroll reveal ──────────────────────────────────────────────────────── */
  /* --rp is written every frame from scroll position: 0 = just below the fold,
     1 = comfortably in view, back toward 0 as it leaves the top. Opacity, lift,
     scale and a touch of blur all key off it, so the page reveals exactly as
     far as it is scrolled — and folds back when scrolled up. */
  [data-reveal]{--rp:0;opacity:var(--rp);transform:translate3d(0,calc((1 - var(--rp)) * 40px),0) scale(calc(.96 + .04 * var(--rp)));filter:blur(calc((1 - var(--rp)) * 4px));transition:opacity .18s linear,transform .18s linear,filter .18s linear;will-change:opacity,transform,filter;}
  [data-reveal].in{--rp:1;}
  .hover-card-3d[data-reveal]:hover{transform:translate3d(0,calc((1 - var(--rp)) * 40px - 4px),0) rotateX(1.2deg) rotateY(-.8deg);}
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    [data-reveal]{--rp:1;opacity:1;transform:none;filter:none;transition:none;}
    .animate-float,.animate-glow,.animate-orbit-cw,.animate-orbit-ccw,.fcard,.animate-ping{animation:none !important;}
    .hero-copy > *{animation:none;}
  }


  /* ─── hero orbit (MedStock rings, HealthSarthi pills kept upright) ───────── */
  .hs-orbit{position:absolute;left:50%;top:46%;width:1240px;height:1240px;margin:-620px 0 0 -620px;pointer-events:none;z-index:0;}
  .hs-orbit-rot{position:absolute;inset:0;animation:hs-spin 160s linear infinite;}
  @keyframes hs-spin{to{transform:rotate(360deg);}}
  @keyframes hs-spin-rev{to{transform:rotate(-360deg);}}
  .hs-ring{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;border:1px solid rgb(var(--c-outline-variant) / .55);}
  .hs-ring.r1{width:520px;height:520px;} .hs-ring.r2{width:820px;height:820px;} .hs-ring.r3{width:1140px;height:1140px;}
  .hs-ring.accent{--w:2px;--start:0deg;border-color:transparent;
    background:conic-gradient(from var(--start),transparent 0 60%,rgb(var(--c-primary-container) / .55) 70%,rgb(var(--c-secondary-container) / .9) 76%,transparent 85%);
    -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - var(--w)),#000 calc(100% - var(--w)));mask:radial-gradient(farthest-side,transparent calc(100% - var(--w)),#000 calc(100% - var(--w)));}
  .opill{position:absolute;transform:translate(-50%,-50%);}
  .opill-in{display:block;animation:hs-spin-rev 160s linear infinite;}
  .opill .pill{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:999px;white-space:nowrap;font-size:11px;font-weight:600;
    background:rgb(var(--c-surface-container-lowest) / .92);backdrop-filter:blur(10px);border:1px solid rgb(var(--c-outline-variant) / .8);
    box-shadow:0 8px 24px rgb(0 0 0 / .08);color:rgb(var(--c-on-surface));}
  .opill .pill .material-symbols-outlined{font-size:15px;color:rgb(var(--c-primary));}
  .opill .pill.green{color:rgb(var(--c-primary));border-color:rgb(var(--c-primary) / .35);}
  .opill .pill.purple{color:rgb(var(--c-purple-800));border-color:rgb(var(--c-purple-300));} .opill .pill.purple .material-symbols-outlined{color:rgb(var(--c-purple-600));}
  .opill .pill .dot{width:7px;height:7px;border-radius:50%;background:rgb(var(--c-emerald-500));box-shadow:0 0 0 3px rgb(var(--c-emerald-500) / .25);}
  @media (max-width:640px){ .hs-orbit{display:none;} }

  /* ─── floating sample screens: stacked columns, no overlap possible ─────── */
  .fcol{position:absolute;z-index:5;display:none;flex-direction:column;gap:16px;width:232px;}
  .fcol.l{left:2.5%;top:9%;} .fcol.r{right:2.5%;top:11%;}
  @media (min-width:1400px){ .fcol{display:flex;} }
  .fcard{position:static;width:100%;display:block;padding:12px 13px;}
  .fcard .hd{margin-bottom:6px;}
  .fcard .row{padding:4px 0;font-size:10.5px;}

  /* ─── status tags ────────────────────────────────────────────────────────── */
  .hs-tag{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;font-size:10px;font-weight:600;letter-spacing:.02em;white-space:nowrap;line-height:16px;flex:none;}
  .hs-tag.live{background:rgb(var(--c-emerald-100));color:rgb(var(--c-emerald-800));border:1px solid rgb(var(--c-emerald-300));}
  .hs-tag.live::before{content:"";width:6px;height:6px;border-radius:50%;background:rgb(var(--c-emerald-500));box-shadow:0 0 0 2px rgb(var(--c-emerald-500) / .25);}
  .hs-tag.soon{background:rgb(var(--c-sky-200) / .55);color:rgb(var(--c-sky-900));border:1px solid rgb(var(--c-sky-400) / .8);}
  .hs-tag.soon::before{content:"";width:6px;height:6px;border-radius:50%;background:rgb(var(--c-sky-500));}

  /* ─── workflow stepper ───────────────────────────────────────────────────── */
  .hs-flow{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;position:relative;margin:0 auto;}
  .hs-flow::before{content:"";position:absolute;left:7%;right:7%;top:26px;height:2px;border-radius:2px;background:linear-gradient(90deg,rgb(var(--c-primary) / .1),rgb(var(--c-primary) / .5),rgb(var(--c-primary) / .1));z-index:0;}
  .hs-step{position:relative;z-index:1;text-align:center;padding:0 4px;}
  .hs-step .dot{width:52px;height:52px;border-radius:50%;margin:0 auto;display:grid;place-items:center;background:rgb(var(--c-surface-container-lowest));border:1.5px solid rgb(var(--c-outline-variant) / .8);color:rgb(var(--c-primary));box-shadow:0 1px 3px rgb(0 0 0 / .06);transition:transform .25s cubic-bezier(.22,1,.36,1),border-color .25s ease,box-shadow .25s ease;}
  .hs-step .dot .material-symbols-outlined{font-size:22px;}
  .hs-step:hover .dot{transform:translateY(-3px) scale(1.06);border-color:rgb(var(--c-primary));box-shadow:0 12px 28px rgb(var(--c-primary) / .22);}
  .hs-step .k{font-size:10px;font-weight:600;letter-spacing:.08em;color:rgb(var(--c-primary));margin-top:12px;}
  .hs-step b{display:block;font-size:14px;font-weight:600;color:rgb(var(--c-on-surface));margin-top:2px;}
  .hs-step small{display:block;font-size:11.5px;line-height:1.4;color:rgb(var(--c-on-surface-variant));margin-top:3px;}
  @media (max-width:1100px){ .hs-flow{grid-template-columns:repeat(4,1fr);row-gap:22px;} .hs-flow::before{display:none;} }
  @media (max-width:640px){ .hs-flow{grid-template-columns:repeat(2,1fr);} }

  /* ─── topology layers ────────────────────────────────────────────────────── */
  .hs-layer{border:1px solid rgb(var(--c-outline-variant) / .6);border-radius:22px;padding:18px 20px;background:rgb(var(--c-surface-container-low) / .6);}
  .hs-layer.core{border-color:rgb(var(--c-primary) / .4);background:linear-gradient(180deg,rgb(var(--c-primary) / .08),rgb(var(--c-primary) / .03));}
  .hs-layer .lt{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:rgb(var(--c-on-surface-variant));margin-bottom:12px;}
  .hs-layer.core .lt{color:rgb(var(--c-primary));}
  .hs-layer .lt small{text-transform:none;letter-spacing:0;font-weight:500;color:rgb(var(--c-on-surface-variant));margin-left:auto;font-size:11px;}
  .hs-tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;}
  .hs-tile{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:14px;background:rgb(var(--c-surface-container-lowest));border:1px solid rgb(var(--c-outline-variant) / .6);font-size:12.5px;font-weight:500;color:rgb(var(--c-on-surface));min-width:0;transition:transform .22s cubic-bezier(.22,1,.36,1),border-color .22s ease,box-shadow .22s ease;}
  .hs-tile:hover{transform:translateY(-2px);border-color:rgb(var(--c-primary) / .5);box-shadow:0 10px 24px rgb(0 0 0 / .08);}
  .hs-tile .material-symbols-outlined{font-size:20px;color:rgb(var(--c-primary));flex:none;}
  .hs-tile{align-items:flex-start;} .hs-tile .material-symbols-outlined{margin-top:1px;} .hs-tile .t{min-width:0;flex:1;} .hs-tile .t b{display:block;font-weight:600;line-height:1.3;} .hs-tile .t small{display:block;font-size:10.5px;color:rgb(var(--c-on-surface-variant));font-weight:400;margin-top:1px;}
  .hs-tile .mono{margin-left:4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10.5px;font-weight:600;color:rgb(var(--c-primary));background:rgb(var(--c-primary) / .1);padding:2px 7px;border-radius:6px;flex:none;}
  .hs-link{display:flex;justify-content:center;height:26px;position:relative;}
  .hs-link::before{content:"";width:2px;height:100%;background:repeating-linear-gradient(180deg,rgb(var(--c-primary) / .5) 0 4px,transparent 4px 8px);}
  .hs-link::after{content:"";position:absolute;bottom:-1px;left:50%;width:8px;height:8px;border-right:2px solid rgb(var(--c-primary) / .6);border-bottom:2px solid rgb(var(--c-primary) / .6);transform:translateX(-50%) rotate(45deg);}
  @media (max-width:1100px){ .hs-tiles{grid-template-columns:repeat(3,1fr);} }
  @media (max-width:640px){ .hs-tiles{grid-template-columns:1fr;} }

  /* ─── footer ─────────────────────────────────────────────────────────────── */
  .hs-foot a{transition:color .15s ease,transform .15s ease;}
  .hs-foot .col a{display:inline-flex;align-items:center;gap:8px;font-size:13px;color:rgb(var(--c-on-surface-variant));text-decoration:none;padding:3px 0;min-height:28px;}
  .hs-foot .col a:hover{color:rgb(var(--c-primary));}
  .hs-foot .col a:focus-visible{outline:2px solid rgb(var(--c-primary));outline-offset:3px;border-radius:6px;}
  .hs-foot h4{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgb(var(--c-on-surface));margin-bottom:12px;}
  .hs-foot .word{font-weight:700;font-size:clamp(3rem,12vw,9.5rem);line-height:.9;letter-spacing:-.05em;text-align:center;color:rgb(var(--c-primary) / .07);user-select:none;padding:8px 0 0;}
  .hs-social{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:20px;}
  .hs-social a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:999px;color:rgb(var(--c-on-surface-variant));background:rgb(var(--c-surface-container-low));border:1px solid rgb(var(--c-outline-variant) / .6);transition:color .15s ease,background .15s ease,border-color .15s ease,transform .15s ease;}
  .hs-social a:hover{color:rgb(var(--c-primary));border-color:rgb(var(--c-primary) / .5);background:rgb(var(--c-primary) / .08);transform:translateY(-2px);}
  .hs-social a:focus-visible{outline:2px solid rgb(var(--c-primary));outline-offset:3px;}
  .hs-social svg{width:17px;height:17px;fill:currentColor;display:block;}

  /* ─── depth & motion polish ──────────────────────────────────────────────── */
  .rounded-3xl.shadow-sm,.rounded-\[2rem\].shadow-2xl,.rounded-3xl.shadow-md{box-shadow:0 1px 2px rgb(19 27 46 / .05),0 12px 32px -12px rgb(19 27 46 / .18),0 30px 60px -30px rgb(var(--c-primary) / .18) !important;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s ease,border-color .25s ease;}
  :root[data-theme="dark"] .rounded-3xl.shadow-sm,:root[data-theme="dark"] .rounded-\[2rem\].shadow-2xl,:root[data-theme="dark"] .rounded-3xl.shadow-md{box-shadow:0 1px 2px rgb(0 0 0 / .5),0 16px 40px -12px rgb(0 0 0 / .7),0 0 0 1px rgb(255 255 255 / .04) !important;}
  .fcard{box-shadow:0 2px 4px rgb(19 27 46 / .06),0 22px 48px -14px rgb(19 27 46 / .28),0 40px 80px -30px rgb(var(--c-primary) / .25);}
  :root[data-theme="dark"] .fcard{box-shadow:0 2px 4px rgb(0 0 0 / .6),0 24px 56px -14px rgb(0 0 0 / .8),0 0 0 1px rgb(255 255 255 / .05);}
  #hero-directory-card{box-shadow:0 2px 6px rgb(19 27 46 / .06),0 40px 90px -30px rgb(19 27 46 / .35),0 60px 120px -50px rgb(var(--c-primary) / .35) !important;}
  [data-parallax-rel]{will-change:transform;transform:translateY(var(--pr,0));}
  .tele-shot{perspective:1400px;}
  .tele-frame{position:relative;border-radius:28px;overflow:hidden;border:1px solid rgb(var(--c-outline-variant) / .7);background:rgb(var(--c-surface-container-lowest));box-shadow:0 2px 6px rgb(19 27 46 / .08),0 40px 90px -30px rgb(19 27 46 / .4),0 70px 130px -50px rgb(var(--c-primary) / .35);animation:tele-float 9s ease-in-out infinite;transform-style:preserve-3d;transition:transform .4s cubic-bezier(.22,1,.36,1);}
  :root[data-theme="dark"] .tele-frame{box-shadow:0 2px 6px rgb(0 0 0 / .6),0 40px 90px -30px rgb(0 0 0 / .85),0 0 0 1px rgb(255 255 255 / .06);}
  .tele-frame img{display:block;width:100%;height:auto;}
  .tele-frame::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,rgb(255 255 255 / .18),transparent 40%);}
  @keyframes tele-float{0%,100%{transform:translateY(0) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));}50%{transform:translateY(-10px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));}}
  .tele-pill{position:absolute;left:14px;bottom:14px;display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;font-size:11px;font-weight:600;color:rgb(var(--c-on-surface));background:rgb(var(--c-surface-container-lowest) / .92);backdrop-filter:blur(10px);border:1px solid rgb(var(--c-outline-variant) / .7);}
  .tele-pill .live{width:7px;height:7px;border-radius:50%;background:rgb(var(--c-emerald-500));box-shadow:0 0 0 3px rgb(var(--c-emerald-500) / .25);}
  @media (prefers-reduced-motion:reduce){ .tele-frame{animation:none;} [data-parallax-rel]{transform:none;} }
  /* ─── hand-off overlay (shown while leaving for the MedStock app) ──────── */
  #flutter-overlay{position:fixed;inset:0;z-index:9999;display:none;flex-direction:column;align-items:center;justify-content:center;background:rgb(var(--c-surface));transition:opacity .4s ease;}
  #flutter-overlay.visible{display:flex;}
  #flutter-overlay.fade-out{opacity:0;pointer-events:none;}
  .ms-loader-wrap{position:relative;width:72px;height:72px;display:grid;place-items:center;margin-bottom:20px;}
  .ms-logo-mark{z-index:2;position:relative;animation:ms-pulse 2s ease infinite;color:rgb(var(--c-primary));}
  @keyframes ms-pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.1);}}
  .ms-spinner{position:absolute;inset:0;border-radius:50%;border:3px solid rgb(var(--c-primary) / .18);border-top-color:rgb(var(--c-primary));animation:ms-rotate .8s linear infinite;}
  @keyframes ms-rotate{to{transform:rotate(360deg);}}
  .ms-loading-label{font-family:Inter,sans-serif;font-size:1rem;font-weight:700;color:rgb(var(--c-primary));letter-spacing:-.02em;}
  .ms-loading-sub{font-family:Inter,sans-serif;font-size:.78rem;color:rgb(var(--c-on-surface-variant));margin-top:4px;animation:ms-sub-fade 1.8s ease infinite;}
  @keyframes ms-sub-fade{0%,100%{opacity:.5;}50%{opacity:1;}}