@import url("https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400..700;1,6..96,400..500&family=Outfit:wght@200..700&display=swap");
/* MYA Urology webfonts. Bodoni Moda = display/editorial serif (matches the high-contrast
   serif of the MYA monogram). Outfit = UI + body sans. Both served from Google Fonts;
   no licensed binaries were supplied. See readme.md > Type substitutions. */
:root{--font-display:"Bodoni Moda",Didot,"Times New Roman",serif;--font-sans:"Outfit","Helvetica Neue",Arial,sans-serif}

:root{
/* --- Ink (black ground) --- */
--ink-950:#050506;--ink-900:#0B0B0C;--ink-850:#111214;--ink-800:#16171A;--ink-700:#22242A;
--ink-600:#33363E;--ink-500:#4A4A50;--ink-400:#6E6E76;--ink-300:#9A9AA1;--ink-200:#C6C4C0;
/* --- Ivory (light ground) --- */
--ivory-050:#FFFDF9;--ivory-100:#FAF8F4;--ivory-200:#F3F0E9;--ivory-300:#E7E1D6;--ivory-400:#D5CDBE;
/* --- Gold --- */
--gold-100:#F4EBD8;--gold-200:#E8D2A0;--gold-300:#DFC488;--gold-400:#D6B36A;--gold-500:#C09A4E;
--gold-600:#A6803A;--gold-700:#8A6A21;--gold-800:#6B5218;
/* --- Semantic hues, deliberately desaturated --- */
--clinical-600:#3A5A78;--clinical-100:#E7EDF3;
--positive-600:#2F6B4F;--positive-100:#E4EEE8;
--caution-600:#A9701C;--caution-100:#F7EEDE;
--critical-600:#96322C;--critical-100:#F6E7E5;

/* ===== Semantic aliases: light (default) ===== */
--surface-page:var(--ivory-100);
--surface-card:var(--ivory-050);
--surface-sunken:var(--ivory-200);
--surface-inverse:var(--ink-900);
--surface-gold-wash:var(--gold-100);
--text-heading:var(--ink-900);
--text-body:var(--ink-500);
--text-muted:var(--ink-400);
--text-eyebrow:var(--gold-700);
--text-on-inverse:var(--ivory-100);
--text-on-gold:var(--ink-900);
--border-hairline:var(--ivory-300);
--border-strong:var(--ink-900);
--border-gold:var(--gold-400);
--accent:var(--gold-500);
--accent-hover:var(--gold-600);
--accent-quiet:var(--gold-200);
--link:var(--gold-700);
--link-hover:var(--ink-900);
--focus-ring:color-mix(in oklch,var(--gold-400) 70%,transparent);
--rule:var(--ivory-300);
}

/* ===== Dark ground. Put .on-ink on any black band or full dark page. =====
   .on-ink-scope / .on-ivory-scope re-establish the aliases WITHOUT painting a
   background — a light-surfaced component nested inside an ink band applies
   .on-ivory-scope so its text does not invert. ===== */
.on-ink,.on-ink-scope{
--surface-page:var(--ink-900);
--surface-card:var(--ink-850);
--surface-sunken:var(--ink-950);
--surface-inverse:var(--ivory-100);
--surface-gold-wash:rgba(214,179,106,.08);
--text-heading:var(--ivory-050);
--text-body:var(--ink-200);
--text-muted:var(--ink-300);
--text-eyebrow:var(--gold-400);
--text-on-inverse:var(--ink-900);
--border-hairline:rgba(214,179,106,.22);
--border-strong:var(--gold-400);
--accent:var(--gold-400);
--accent-hover:var(--gold-300);
--link:var(--gold-400);
--link-hover:var(--gold-200);
--rule:rgba(255,253,249,.14);
}
.on-ink{color:var(--text-body);background:var(--surface-page)}
.on-ink-scope{color:var(--text-body)}

.on-ivory-scope{
--surface-page:var(--ivory-100);
--surface-card:var(--ivory-050);
--surface-sunken:var(--ivory-200);
--surface-inverse:var(--ink-900);
--surface-gold-wash:var(--gold-100);
--text-heading:var(--ink-900);
--text-body:var(--ink-500);
--text-muted:var(--ink-400);
--text-eyebrow:var(--gold-700);
--text-on-inverse:var(--ivory-100);
--border-hairline:var(--ivory-300);
--border-strong:var(--ink-900);
--accent:var(--gold-500);
--accent-hover:var(--gold-600);
--accent-quiet:var(--gold-200);
--link:var(--gold-700);
--link-hover:var(--ink-900);
--rule:var(--ivory-300);
color:var(--text-body);
}

:root{
/* Display — Bodoni Moda. Optical sizing on, tight leading, negative tracking. */
--display-1:400 clamp(3.25rem,6.2vw,5.25rem)/0.98 var(--font-display);
--display-2:400 clamp(2.5rem,4.4vw,3.75rem)/1.04 var(--font-display);
--display-3:400 clamp(2rem,3vw,2.75rem)/1.1 var(--font-display);
--heading-1:400 1.75rem/1.18 var(--font-display);
--heading-2:400 1.375rem/1.25 var(--font-display);
--heading-3:500 1.0625rem/1.35 var(--font-sans);
/* Body + UI — Outfit */
--body-lg:300 1.1875rem/1.62 var(--font-sans);
--body:300 1.0625rem/1.68 var(--font-sans);
--body-sm:300 0.9375rem/1.6 var(--font-sans);
--ui:400 0.9375rem/1.4 var(--font-sans);
--ui-sm:400 0.8125rem/1.4 var(--font-sans);
--eyebrow:500 0.75rem/1.2 var(--font-sans);
--caption:300 0.8125rem/1.5 var(--font-sans);
/* Tracking */
--track-display:-0.02em;--track-heading:-0.01em;--track-body:0; /* @kind other */
--track-ui:0.01em;--track-eyebrow:0.18em;--track-button:0.08em;
/* Measure */
--measure-prose:64ch;--measure-lede:52ch;--measure-narrow:38ch;
}

:root{
--space-0:0;--space-1:2px;--space-2:4px;--space-3:8px;--space-4:12px;--space-5:16px;
--space-6:20px;--space-7:24px;--space-8:32px;--space-9:40px;--space-10:56px;
--space-11:72px;--space-12:96px;--space-13:128px;--space-14:160px;
/* Semantic rhythm */
--gutter-page:clamp(20px,5vw,72px); /* @kind spacing */
--content-max:1240px;
--content-max-prose:760px;
--section-y:clamp(72px,9vw,160px); /* @kind spacing */
--section-y-tight:clamp(48px,6vw,96px); /* @kind spacing */
--card-pad:28px;
--card-pad-lg:40px;
--stack-tight:12px;--stack:20px;--stack-loose:32px;
--field-h:48px;--control-h-sm:36px;--control-h:48px;--control-h-lg:56px;
}

:root{
/* Restraint: near-square corners everywhere except pills. */
--radius-none:0;--radius-xs:2px;--radius-sm:3px;--radius-md:4px;--radius-lg:8px;
--radius-image:4px;--radius-card:4px;--radius-field:3px;--radius-pill:999px;
--hairline:1px;--rule-w:1px;--border-emphasis:1.5px;
}

:root{
/* Warm, low-opacity shadows — light never looks blue-grey. */
--shadow-none:none;
--shadow-xs:0 1px 2px rgba(31,25,12,.05);
--shadow-sm:0 1px 3px rgba(31,25,12,.06),0 1px 1px rgba(31,25,12,.04);
--shadow-md:0 6px 18px -6px rgba(31,25,12,.13),0 2px 5px rgba(31,25,12,.05);
--shadow-lg:0 22px 48px -18px rgba(31,25,12,.22),0 4px 12px rgba(31,25,12,.06);
--shadow-float:0 30px 70px -28px rgba(11,11,12,.35);
--shadow-inset-hairline:inset 0 0 0 1px var(--border-hairline);
--glow-gold:0 0 0 1px var(--gold-400),0 8px 28px -10px rgba(214,179,106,.45);
--ring-focus:0 0 0 2px var(--surface-page),0 0 0 4px var(--gold-400);
/* Protection gradients for type over photography */
--scrim-bottom:linear-gradient(to top,rgba(5,5,6,.82) 0%,rgba(5,5,6,.52) 34%,rgba(5,5,6,0) 78%); /* @kind other */
--scrim-left:linear-gradient(to right,rgba(5,5,6,.78) 0%,rgba(5,5,6,.34) 46%,rgba(5,5,6,0) 82%); /* @kind other */
--scrim-flat:rgba(5,5,6,.42);
--glass:rgba(11,11,12,.42);--glass-blur:saturate(140%) blur(14px); /* @kind other */
}

:root{
--dur-instant:90ms; /* @kind other */--dur-fast:160ms; /* @kind other */--dur-base:240ms; /* @kind other */--dur-slow:420ms; /* @kind other */--dur-reveal:680ms; /* @kind other */
--ease-standard:cubic-bezier(.22,.61,.36,1); /* @kind other */
--ease-out-soft:cubic-bezier(.16,.84,.28,1); /* @kind other */
--ease-in-out:cubic-bezier(.62,.02,.34,1); /* @kind other */
/* No bounce, no spring, no overshoot anywhere in this brand. */
--lift-hover:translateY(-2px); /* @kind other */
--press-scale:scale(.985); /* @kind other */
--transition-control:background-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard),transform var(--dur-fast) var(--ease-standard); /* @kind other */
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--body);letter-spacing:var(--track-body);text-wrap:pretty;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;color:var(--text-heading);font-optical-sizing:auto}
h1{font:var(--display-2);letter-spacing:var(--track-display)}
h2{font:var(--display-3);letter-spacing:var(--track-display)}
h3{font:var(--heading-1);letter-spacing:var(--track-heading)}
h4{font:var(--heading-3);letter-spacing:var(--track-ui)}
p{margin:0}
a{color:var(--link);text-decoration:none;border-bottom:1px solid color-mix(in oklch,var(--link) 40%,transparent);transition:var(--transition-control)}
a:hover{color:var(--link-hover);border-bottom-color:currentColor}
img{display:block;max-width:100%}
::selection{background:var(--gold-200);color:var(--ink-900)}
:focus-visible{outline:none;box-shadow:var(--ring-focus)}
.mya-eyebrow{font:var(--eyebrow);letter-spacing:var(--track-eyebrow);text-transform:uppercase;color:var(--text-eyebrow)}
.mya-prose{max-width:var(--measure-prose)}
.mya-rule{height:1px;background:var(--rule);border:0;margin:0}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

