/* Medical Street design system — "the Apple of health" (2026 redesign).
   Soft, clean, high-end: light airy surfaces, frosted-glass nav, Inter
   typography, generous whitespace, hairline borders and diffuse shadows.
   Brand tokens per website.md §5 — dark teal = authority, teal = primary,
   aqua = technology, lime = outcomes, orange = key CTAs. */
:root{
  --ms-teal-900:#003D3C;
  --ms-teal-800:#00524F;
  --ms-teal:#008080;
  --ms-green:#01A993;
  --ms-aqua:#5BEFE1;
  --ms-lime:#B2D33E;
  --ms-orange:#FFA500;
  --ms-orange-dark:#B37400; /* AA-safe orange for text on light */
  --ms-ink:#0A2B2A;          /* body heading ink (deep teal-black) */
  --ms-slate:#415754;        /* body text */
  --ms-muted:#6B817E;        /* secondary text */
  --ms-line:#E3EEEC;         /* hairline borders */
  --ms-bg:#FFFFFF;
  --ms-bg-soft:#F5FAF9;      /* soft mint-white section bg */
  --ms-bg-deep:#00302F;      /* dark section bg */
  --radius-lg:24px; --radius-md:18px; --radius-sm:12px;
  --shadow-soft:0 1px 2px rgba(10,43,42,.04),0 10px 30px rgba(10,43,42,.06);
  --shadow-raise:0 2px 6px rgba(10,43,42,.05),0 22px 48px rgba(10,43,42,.10);
  --shadow-glow:0 24px 56px rgba(0,128,128,.16);
  --font:"Inter",-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",system-ui,"Helvetica Neue",Arial,sans-serif;
  --maxw:1200px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal{opacity:1!important;transform:none!important}
}
body{
  margin:0;font-family:var(--font);color:var(--ms-slate);background:var(--ms-bg);
  font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg{max-width:100%}
::selection{background:rgba(1,169,147,.20)}
::-webkit-scrollbar{width:10px}
::-webkit-scrollbar-track{background:var(--ms-bg-soft)}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--ms-teal),var(--ms-green));border-radius:8px}
a{color:var(--ms-teal);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{color:var(--ms-ink);line-height:1.12;margin:0 0 .5em;font-weight:700;letter-spacing:-.032em}
h1{font-size:clamp(2.4rem,5.4vw,4rem);letter-spacing:-.038em}
h2{font-size:clamp(1.75rem,3.4vw,2.55rem)}
h3{font-size:1.22rem}
p{margin:0 0 1em}
strong{color:var(--ms-ink);font-weight:600}
.container{max-width:var(--maxw);margin:0 auto;padding:0 28px}
section{padding:96px 0}
.section-head{max-width:780px;margin:0 auto 56px;text-align:center}
.section-head p{color:var(--ms-muted);font-size:1.08rem}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.75rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ms-green);margin-bottom:14px}
.eyebrow::before{content:"";width:24px;height:2px;border-radius:2px;background:linear-gradient(90deg,var(--ms-green),var(--ms-aqua))}
.eyebrow.on-dark{color:var(--ms-aqua)}
.text-center{text-align:center}
.grad-text{background:linear-gradient(92deg,#5BEFE1 0%,#7DE8C8 45%,#B2D33E 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.bg-soft{background:var(--ms-bg-soft)}
.bg-deep{background:radial-gradient(820px 420px at 85% 0%,rgba(91,239,225,.10),transparent 70%),radial-gradient(620px 340px at 5% 100%,rgba(178,211,62,.06),transparent 70%),linear-gradient(160deg,#042C2B 0%,var(--ms-teal-900) 55%,var(--ms-teal-800) 100%);color:#CDE6E2}
.bg-deep h2,.bg-deep h3{color:#FFFFFF}
.bg-deep p{color:#B9D8D3}

/* ---------- skip link & focus ---------- */
.skip-link{position:absolute;left:-9999px;top:0;background:var(--ms-teal-900);color:#fff;padding:10px 18px;z-index:200;border-radius:0 0 10px 0}
.skip-link:focus{left:0}
:focus-visible{outline:3px solid var(--ms-orange);outline-offset:2px;border-radius:6px}

/* ---------- header / nav (frosted glass, Apple-style) ---------- */
.site-header{position:sticky;top:0;z-index:100;background:rgba(0,48,47,.92);-webkit-backdrop-filter:blur(22px) saturate(1.3);backdrop-filter:blur(22px) saturate(1.3);border-bottom:1px solid rgba(91,239,225,.14)}
.nav{display:flex;align-items:center;gap:26px;max-width:var(--maxw);margin:0 auto;padding:0 28px;min-height:92px}
.brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:700;font-size:1.1rem;letter-spacing:-.01em;text-decoration:none}
.brand:hover{text-decoration:none}
.brand .mark{display:flex;align-items:center;flex:0 0 auto}
.brand .mark svg{display:block;width:34px;height:34px}
.brand .mark img{display:block;height:64px;width:auto;max-width:400px}
.site-footer .brand .mark img{height:88px}
@media (max-width:960px){
  .nav{min-height:72px}
  .brand .mark img{height:48px}
}
.nav-links{display:flex;align-items:center;gap:2px;margin-left:auto;list-style:none;margin-block:0;padding:0}
.nav-links>li{position:relative}
.nav-links a,.nav-toggle{display:block;padding:10px 14px;color:#D7ECE8;font-size:.93rem;font-weight:500;border-radius:10px;background:none;border:0;font-family:inherit;cursor:pointer;transition:background .15s,color .15s}
.nav-links a:hover,.nav-toggle:hover,.nav-links a[aria-current="page"]{color:#fff;background:rgba(91,239,225,.10);text-decoration:none}
.nav-toggle::after{content:"▾";font-size:.7em;margin-left:6px;opacity:.55}
.dropdown{position:absolute;top:calc(100% + 10px);left:0;min-width:260px;background:#fff;border:1px solid var(--ms-line);border-radius:var(--radius-md);box-shadow:var(--shadow-raise);padding:8px;list-style:none;margin:0;opacity:0;visibility:hidden;transform:translateY(6px);transition:all .18s ease}
li:hover>ul.dropdown,li:focus-within>ul.dropdown{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown a{display:block;padding:10px 13px;color:var(--ms-ink);border-radius:10px;font-weight:500;font-size:.9rem}
.dropdown a:hover{background:var(--ms-bg-soft);color:var(--ms-teal)}
.dropdown small{display:block;color:var(--ms-muted);font-weight:400;font-size:.76rem;line-height:1.35;margin-top:2px}
.nav-cta{margin-left:14px}
.burger{display:none;margin-left:auto;background:none;border:0;cursor:pointer;padding:8px}
.burger span{display:block;width:24px;height:2px;background:#fff;margin:5px 0;border-radius:2px;transition:transform .2s}
.mobile-panel{display:none;background:var(--ms-teal-900);border-top:1px solid rgba(91,239,225,.14);padding:14px 28px 24px}
.mobile-panel a{display:block;color:#D7ECE8;padding:11px 4px;font-weight:500;border-bottom:1px solid rgba(255,255,255,.06)}
.mobile-panel .grp{color:var(--ms-aqua);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;padding:16px 4px 4px;font-weight:700}
body.nav-open .mobile-panel{display:block}
@media (max-width:960px){
  .nav-links,.nav>.nav-cta{display:none}
  .burger{display:block}
}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:14px 28px;border-radius:999px;font-weight:600;font-size:.95rem;border:2px solid transparent;cursor:pointer;text-decoration:none!important;transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;font-family:inherit;line-height:1.2;position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;top:0;left:-80%;width:50%;height:100%;background:linear-gradient(105deg,transparent,rgba(255,255,255,.34),transparent);transform:skewX(-20deg);transition:left .55s ease;pointer-events:none}
.btn:hover::after{left:135%}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,#FFB733 0%,var(--ms-orange) 55%,#F08C00 100%);color:#3D2800;box-shadow:0 10px 26px rgba(255,165,0,.30)}
.btn-primary:hover{box-shadow:0 14px 34px rgba(255,165,0,.38)}
.btn-outline{border-color:rgba(255,255,255,.5);color:#fff;background:transparent}
.btn-outline:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-teal{background:linear-gradient(135deg,var(--ms-teal),var(--ms-green));color:#fff;box-shadow:0 10px 24px rgba(1,169,147,.26)}
.btn-teal:hover{box-shadow:0 14px 30px rgba(1,169,147,.34)}
.btn-ghost{border-color:rgba(10,43,42,.16);color:var(--ms-teal-900);background:#fff}
.btn-ghost:hover{border-color:var(--ms-teal);background:var(--ms-bg-soft)}
.btn-sm{padding:9px 18px;font-size:.87rem}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin-top:36px}

/* ---------- hero (soft light, airy) ---------- */
.hero{background:linear-gradient(165deg,var(--ms-teal-900) 0%,#004946 60%,var(--ms-teal-800) 100%);color:#E7F5F2;padding:128px 0 116px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:-20%;background:radial-gradient(520px 400px at 78% 18%,rgba(91,239,225,.16),transparent 65%),radial-gradient(460px 360px at 12% 82%,rgba(178,211,62,.09),transparent 65%);animation:aurora 16s ease-in-out infinite alternate;pointer-events:none}
@keyframes aurora{from{transform:translate3d(-2%,-1%,0) scale(1)}to{transform:translate3d(2%,2%,0) scale(1.06)}}
.hero::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:radial-gradient(720px 440px at 50% 30%,#000,transparent 75%);mask-image:radial-gradient(720px 440px at 50% 30%,#000,transparent 75%);pointer-events:none}
.hero .container{position:relative;z-index:1}
.hero h1{color:#fff;max-width:900px}
.hero .lede{font-size:1.22rem;color:#C3DED9;max-width:760px;line-height:1.7}
.hero .tagline{color:var(--ms-aqua);font-weight:600;letter-spacing:.01em}
.hero-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:64px;align-items:center}
@media (max-width:960px){.hero-inner{grid-template-columns:1fr}}
.hero-card{background:#fff;border:1px solid var(--ms-line);border-radius:var(--radius-lg);padding:28px;box-shadow:var(--shadow-soft)}
.hero .hero-card{background:rgba(255,255,255,.05);border:1px solid rgba(91,239,225,.18);box-shadow:none;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.hero .eco-node{background:rgba(255,255,255,.06);border:1px solid rgba(91,239,225,.22);color:#fff;box-shadow:none}
.hero .eco-node small{color:#A9CDC8}
.hero .eco-link{background:linear-gradient(180deg,rgba(91,239,225,.15),var(--ms-aqua),rgba(91,239,225,.15))}

/* ---------- ecosystem diagram (animated flow) ---------- */
.eco{display:flex;flex-direction:column;gap:0}
.eco-node{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid rgba(10,43,42,.08);border-radius:var(--radius-md);padding:13px 17px;color:var(--ms-ink);font-weight:600;font-size:.95rem;box-shadow:var(--shadow-soft)}
.eco-node .dot{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.eco-node small{display:block;font-weight:400;color:var(--ms-muted);font-size:.78rem}
.eco-link{height:26px;width:2px;margin:0 22px;background:linear-gradient(180deg,rgba(0,128,128,.10),var(--ms-teal),rgba(0,128,128,.10));background-size:2px 200%;animation:flow 1.6s linear infinite;position:relative}
.eco-link::after{content:"";position:absolute;bottom:-1px;left:-3px;border:4px solid transparent;border-top-color:var(--ms-green)}
@keyframes flow{from{background-position:0 0}to{background-position:0 200%}}

/* ---------- cards & grids ---------- */
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:960px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}}
.card{position:relative;background:#fff;border:1px solid rgba(10,43,42,.07);border-radius:var(--radius-lg);padding:30px;box-shadow:var(--shadow-soft);transition:transform .22s ease,box-shadow .22s ease}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-glow)}
.bg-deep .card{background:rgba(255,255,255,.05);border-color:rgba(91,239,225,.14);box-shadow:none}
.card h3{margin-bottom:.4em}
.card p{color:var(--ms-muted);font-size:.96rem;margin-bottom:1em}
.bg-deep .card p{color:#B9D8D3}
.card .icon{width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;margin-bottom:18px;background:linear-gradient(140deg,rgba(0,128,128,.10),rgba(91,239,225,.24));border:1px solid rgba(0,128,128,.10)}
.card-link{font-weight:600;font-size:.9rem;color:var(--ms-teal);display:inline-flex;gap:6px;align-items:center}
.card-link:hover{gap:10px}
.card-link.on-dark{color:var(--ms-aqua)}
.pill-row{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 18px;padding:0;list-style:none}
.pill{display:inline-block;padding:5px 14px;border-radius:999px;font-size:.79rem;font-weight:600;background:var(--ms-bg-soft);color:var(--ms-teal-800);border:1px solid rgba(0,128,128,.12)}
.bg-deep .pill{background:rgba(91,239,225,.10);border-color:rgba(91,239,225,.25);color:var(--ms-aqua)}

/* ---------- badges / chips / stats ---------- */
.badge{display:inline-block;padding:5px 13px;border-radius:999px;font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.badge-demo{background:rgba(255,165,0,.14);color:var(--ms-orange-dark)}
.bg-deep .badge-demo{background:rgba(255,165,0,.16);color:#FFD08A}
.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
@media (max-width:760px){.stat-grid{grid-template-columns:repeat(2,1fr)}}
.stat{text-align:center}
.stat .num{font-size:2.4rem;font-weight:700;letter-spacing:-.03em;background:linear-gradient(120deg,var(--ms-teal-900),var(--ms-teal) 60%,var(--ms-green));-webkit-background-clip:text;background-clip:text;color:transparent}
.bg-deep .stat .num{color:var(--ms-aqua)}
.stat .lbl{font-size:.86rem;color:var(--ms-muted)}
.bg-deep .stat .lbl{color:#B9D8D3}

/* ---------- flow (horizontal journey) ---------- */
.flow{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;list-style:none;padding:0;margin:28px 0}
.flow li{background:#fff;border:1px solid rgba(10,43,42,.08);border-radius:999px;padding:11px 22px;font-weight:600;color:var(--ms-teal-900);font-size:.9rem;box-shadow:var(--shadow-soft)}
.flow .arr{background:none;border:0;box-shadow:none;color:var(--ms-green);padding:0 2px;font-size:1.1rem}
.bg-deep .flow li{background:rgba(255,255,255,.07);border-color:rgba(91,239,225,.25);color:#fff}

/* ---------- before/after ---------- */
.ba{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media (max-width:760px){.ba{grid-template-columns:1fr}}
.ba-col{border-radius:var(--radius-lg);padding:30px;border:1px solid var(--ms-line)}
.ba-before{background:#FDF6F4;border-color:#F0DCD4}
.ba-after{background:#F0FBF6;border-color:#CFEBDD}
.ba-col h3{margin-bottom:14px}
.ba-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ba-list li{display:flex;gap:10px;align-items:flex-start;font-weight:500;color:var(--ms-slate);font-size:.95rem}
.ba-list .x{color:#C2452D;font-weight:700}
.ba-list .ok{color:var(--ms-green);font-weight:700}

/* ---------- haya chat mock ---------- */
.chat{background:var(--ms-teal-900);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:12px;border:1px solid rgba(91,239,225,.25);box-shadow:var(--shadow-raise)}
.chat .msg{max-width:85%;padding:12px 16px;border-radius:16px;font-size:.9rem;line-height:1.5}
.chat .user{align-self:flex-end;background:var(--ms-teal);color:#fff;border-bottom-right-radius:4px}
.chat .ai{align-self:flex-start;background:rgba(255,255,255,.08);color:#E7F5F2;border-bottom-left-radius:4px;border:1px solid rgba(91,239,225,.2)}
.chat .ai b{color:var(--ms-aqua)}
.chat-caption{font-size:.8rem;color:var(--ms-muted);margin-top:10px}

/* ---------- accordion ---------- */
.accordion{border:1px solid var(--ms-line);border-radius:var(--radius-md);background:#fff;overflow:hidden;box-shadow:var(--shadow-soft)}
.acc-item+.acc-item{border-top:1px solid var(--ms-line)}
.acc-item summary{cursor:pointer;padding:18px 22px;font-weight:600;color:var(--ms-ink);list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.acc-item summary::-webkit-details-marker{display:none}
.acc-item summary::after{content:"+";font-size:1.4rem;color:var(--ms-green);font-weight:400;transition:transform .15s}
.acc-item[open] summary::after{transform:rotate(45deg)}
.acc-item .acc-body{padding:0 22px 18px;color:var(--ms-muted);font-size:.95rem}

/* ---------- tabs ---------- */
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:24px}
.tabs button{padding:10px 18px;border-radius:999px;border:1px solid var(--ms-line);background:#fff;font-weight:600;color:var(--ms-slate);cursor:pointer;font-family:inherit;font-size:.88rem}
.tabs button[aria-selected="true"]{background:var(--ms-teal-900);border-color:var(--ms-teal-900);color:#fff}
.tab-panel[hidden]{display:none}

/* ---------- forms ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:640px){.form-grid{grid-template-columns:1fr}}
.field{display:flex;flex-direction:column;gap:6px}
.field.full{grid-column:1/-1}
.field label{font-weight:600;font-size:.88rem;color:var(--ms-ink)}
.field .req{color:#C2452D}
.field input,.field select,.field textarea{padding:13px 15px;border:1px solid var(--ms-line);border-radius:var(--radius-sm);font-family:inherit;font-size:.95rem;background:#fff;color:var(--ms-ink);transition:border .15s,box-shadow .15s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--ms-teal);box-shadow:0 0 0 4px rgba(0,128,128,.12)}
.field .err{color:#C2452D;font-size:.8rem;min-height:1em}
.field input[aria-invalid="true"],.field textarea[aria-invalid="true"]{border-color:#C2452D}
.form-msg{padding:14px 18px;border-radius:var(--radius-sm);font-weight:600;margin-top:16px;display:none}
.form-msg.ok{display:block;background:#EAF8F1;color:#0B6B4F;border:1px solid #BEE5D3}
.form-msg.fail{display:block;background:#FDEFEA;color:#9A3420;border:1px solid #F2CDBF}
.hp-field{position:absolute;left:-9999px;top:-9999px;opacity:0}

/* ---------- breadcrumbs / page hero (soft light) ---------- */
.page-hero{background:radial-gradient(620px 320px at 82% 0%,rgba(91,239,225,.13),transparent 70%),linear-gradient(160deg,var(--ms-teal-900),var(--ms-teal-800));color:#E7F5F2;padding:88px 0 76px}
.page-hero h1{color:#fff;font-size:clamp(1.9rem,3.6vw,2.7rem);max-width:800px}
.page-hero p{color:#B9D8D3;max-width:740px;font-size:1.07rem}
.breadcrumb{font-size:.82rem;color:#8FB8B3;margin-bottom:20px;padding:0;list-style:none;display:flex;gap:8px;flex-wrap:wrap}
.breadcrumb a{color:var(--ms-aqua)}
.breadcrumb .sep{opacity:.5}
.prose{max-width:800px;margin:0 auto}
.prose h2{font-size:1.5rem;margin-top:2em}
.prose ul{padding-left:1.3em}
.prose li{margin-bottom:.5em}

/* ---------- footer ---------- */
.site-footer{background:linear-gradient(180deg,#002B2A,var(--ms-teal-900));border-top:1px solid rgba(91,239,225,.15);color:#A9CDC8;padding:76px 0 32px;margin-top:0}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr 1fr;gap:30px;margin-bottom:52px}
@media (max-width:960px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.footer-grid{grid-template-columns:1fr}}
.site-footer h4{color:#fff;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:16px}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:9px}
.site-footer a{color:#A9CDC8;font-size:.92rem}
.site-footer a:hover{color:var(--ms-aqua)}
.footer-about p{font-size:.92rem;max-width:300px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.82rem;color:#7FA8A3}

/* ---------- CTA band (soft light) ---------- */
.cta-band{position:relative;overflow:hidden;background:radial-gradient(620px 320px at 15% 20%,rgba(91,239,225,.25),transparent 70%),radial-gradient(520px 300px at 85% 85%,rgba(178,211,62,.22),transparent 70%),linear-gradient(135deg,var(--ms-teal-900) 0%,var(--ms-teal) 55%,var(--ms-green) 100%);color:#fff;text-align:center;padding:104px 0}
.cta-band h2{color:#fff}
.cta-band p{color:#D8F2E8;max-width:640px;margin:0 auto 8px}

/* ---------- reveal / counters ----------
   Hidden-until-observed only when JS is present (html.js set in <head>),
   so no-JS visitors and crawlers always see full content. */
html.js .reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
html.js .reveal.in{opacity:1;transform:none}

/* ---------- search ---------- */
.search-wrap{position:relative;max-width:580px;margin:0 auto}
.search-wrap input{width:100%;padding:15px 22px;border-radius:999px;border:1px solid var(--ms-line);font-size:1rem;font-family:inherit;box-shadow:var(--shadow-soft)}
.search-wrap input:focus{outline:none;border-color:var(--ms-teal);box-shadow:0 0 0 4px rgba(0,128,128,.12)}
.search-results{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border:1px solid var(--ms-line);border-radius:var(--radius-md);box-shadow:var(--shadow-raise);max-height:340px;overflow:auto;z-index:20}
.search-results a{display:block;padding:12px 18px;color:var(--ms-ink);font-weight:600;border-bottom:1px solid var(--ms-line);font-size:.92rem}
.search-results a small{display:block;color:var(--ms-muted);font-weight:400}
.search-results a:hover,.search-results a.active{background:var(--ms-bg-soft);text-decoration:none}
.search-empty{padding:16px 18px;color:var(--ms-muted);font-size:.9rem}

/* ---------- misc ---------- */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.divider-note{font-size:.85rem;color:var(--ms-muted)}
.placeholder-note{background:#FFF8E8;border:1px dashed #E5C77B;color:#7A6220;padding:12px 16px;border-radius:var(--radius-sm);font-size:.88rem;margin:14px 0}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
@media (max-width:860px){.two-col{grid-template-columns:1fr}}
.layer-stack{display:flex;flex-direction:column;gap:0;max-width:660px;margin:0 auto}
.layer{background:#fff;border:1px solid rgba(10,43,42,.07);border-radius:var(--radius-md);padding:17px 24px;box-shadow:var(--shadow-soft)}
.layer b{color:var(--ms-teal-900)}
.layer span{color:var(--ms-muted);font-size:.88rem;display:block}
.layer-arrow{text-align:center;color:var(--ms-green);font-size:1.2rem;line-height:1.6}
.cookie-note{position:fixed;bottom:18px;left:18px;right:18px;max-width:460px;background:var(--ms-teal-900);color:#D7ECE8;border-radius:var(--radius-md);padding:18px 20px;box-shadow:var(--shadow-raise);z-index:150;font-size:.88rem;display:none}
.cookie-note.show{display:block}
.cookie-note .btn{margin-top:10px}
@media (max-width:640px){
  section{padding:68px 0}
  .hero{padding:88px 0 76px}
}

/* ---------- marketplace browse (/marketplace/) ---------- */
.mk-controls{display:flex;flex-direction:column;gap:16px;margin-bottom:24px}
.mk-search input{width:100%;padding:14px 22px;border-radius:999px;border:1px solid var(--ms-line);font-size:1rem;font-family:inherit;box-shadow:var(--shadow-soft)}
.mk-search input:focus{outline:none;border-color:var(--ms-teal);box-shadow:0 0 0 4px rgba(0,128,128,.12)}
.mk-chips{display:flex;flex-wrap:wrap;gap:8px}
.mk-chip{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;border:1px solid var(--ms-line);background:#fff;font-weight:600;color:var(--ms-slate);cursor:pointer;font-family:inherit;font-size:.87rem;transition:background .15s,color .15s,border-color .15s}
.mk-chip span{font-size:.73rem;font-weight:600;color:var(--ms-muted);background:var(--ms-bg-soft);border-radius:999px;padding:1px 8px}
.mk-chip:hover{border-color:var(--ms-teal);color:var(--ms-teal-900)}
.mk-chip.is-active{background:var(--ms-teal-900);border-color:var(--ms-teal-900);color:#fff}
.mk-chip.is-active span{background:rgba(255,255,255,.16);color:var(--ms-aqua)}
.mk-status{font-size:.9rem;color:var(--ms-muted);margin:0 0 18px}
.mk-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:1040px){.mk-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.mk-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.mk-grid{grid-template-columns:1fr}}
.mk-card{display:flex;flex-direction:column;gap:6px;background:#fff;border:1px solid rgba(10,43,42,.07);border-radius:var(--radius-md);padding:14px;box-shadow:var(--shadow-soft);transition:transform .18s ease,box-shadow .18s ease}
.mk-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-raise)}
.mk-card h3{font-size:1rem;margin:0;line-height:1.32}
.mk-meta{margin:0;font-size:.84rem;color:var(--ms-slate);font-weight:600}
.mk-generic{margin:0;font-size:.82rem;color:var(--ms-muted)}
.mk-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.mk-tags span{font-size:.71rem;font-weight:600;color:var(--ms-teal);background:var(--ms-bg-soft);border:1px solid var(--ms-line);border-radius:999px;padding:2px 9px}
.mk-price-note{margin-top:auto;padding-top:10px;font-size:.75rem;font-weight:600;letter-spacing:.03em;color:var(--ms-orange-dark)}
.mk-thumb{position:relative;width:100%;aspect-ratio:1/1;border-radius:var(--radius-sm);overflow:hidden;border:1px solid var(--ms-line);background:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:8px}
.mk-thumb img{width:100%;height:100%;object-fit:contain;display:block;background:#fff}
.mk-thumb.no-img{background:radial-gradient(120px 90px at 50% 42%,rgba(91,239,225,.28),transparent 72%),var(--ms-bg-soft)}
.mk-thumb.no-img::after{content:"";width:52px;height:52px;opacity:.55;background-repeat:no-repeat;background-position:center;background-size:contain;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 34' fill='none' stroke='%23008080' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M4 21 L9 12 L13 18 L17 7 L21 18 L25 12 L30 21'/><circle cx='17' cy='26' r='1.8' fill='%2301A993' stroke='none'/></svg>")}
.mk-empty{grid-column:1/-1;text-align:center;color:var(--ms-muted);padding:30px 0}
.mk-more{display:flex;justify-content:center;margin-top:32px}
