/* Menovē site, direction G. Pages carry their layout inline; this file holds
   what the design tool left to the runtime: base type, focus, the mobile nav,
   and a few guards. */
html{scroll-behavior:smooth}
body{margin:0;background:#FBFAF6;color:#1C1520;font-family:'Satoshi',-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:hover{opacity:.75}
input::placeholder{color:#8A8390}
img,iframe{max-width:100%}
:focus-visible{outline:2px solid #D3DC5A;outline-offset:3px;border-radius:4px}
button,input{font:inherit}

/* frames scaled by site.js */
[data-fit]{position:relative}
[data-fit-child]{transform-origin:left top;position:absolute;left:0;top:0}

/* the row reveal on For clinicians, opt-in via .rv-ready so no JS = visible */
.rv-ready [data-reveal]{opacity:0;transform:translateY(40px);transition:opacity .8s cubic-bezier(.22,1,.36,1),transform .8s cubic-bezier(.22,1,.36,1)}
.rv-ready [data-reveal].in{opacity:1;transform:none}

/* ---- mobile nav ---- */
.nav-toggle{display:none;width:42px;height:42px;border:0;background:transparent;color:inherit;cursor:pointer;padding:0;align-items:center;justify-content:center;border-radius:999px}
.nav-toggle i{display:block;width:20px;height:2px;background:currentColor;position:relative;transition:transform .3s,background .3s}
.nav-toggle i::before,.nav-toggle i::after{content:'';position:absolute;left:0;width:20px;height:2px;background:currentColor;transition:transform .3s,top .3s}
.nav-toggle i::before{top:-6px}.nav-toggle i::after{top:6px}
.nav-open .nav-toggle i{background:transparent}
.nav-open .nav-toggle i::before{top:0;transform:rotate(45deg)}
.nav-open .nav-toggle i::after{top:0;transform:rotate(-45deg)}
.nav-drawer{display:none}
@media(max-width:820px){
  nav[data-nav]>div:nth-child(2){display:none!important}
  .nav-toggle{display:inline-flex}
  .nav-drawer{display:flex;position:fixed;inset:0;z-index:40;background:#17091F;color:#fff;padding:96px clamp(20px,6vw,40px) 40px;flex-direction:column;gap:6px;transform:translateY(-8px);opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease}
  .nav-open .nav-drawer{opacity:1;transform:none;pointer-events:auto}
  .nav-drawer a{font-family:'Cabinet Grotesk',sans-serif;font-weight:800;letter-spacing:-.02em;font-size:clamp(34px,9vw,46px);line-height:1.1;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.1)}
  .nav-drawer a.cta{margin-top:26px;align-self:flex-start;font-family:'Satoshi',sans-serif;font-weight:700;font-size:15px;letter-spacing:0;padding:14px 24px;border-radius:999px;background:#D3DC5A;color:#17091F;border:0}
  .nav-drawer .fine{margin-top:auto;font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.12em;color:#CDB8F0}
  .nav-open{overflow:hidden}
  nav[data-nav]{position:relative;z-index:50!important}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.rv-ready [data-reveal]{transition:none}.nav-drawer,.nav-toggle i,.nav-toggle i::before,.nav-toggle i::after{transition:none}}

/* ---- Our story: the founder ----
   The photo sets the row height, not the text, so she is never cropped.
   The grid is capped so two equal halves of a 27-inch screen do not turn
   the image cell short and wide. */
.founder{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);align-items:center;max-width:1480px;margin:0 auto}
/* aspect-ratio makes the photo's full height the row minimum; explicit stretch
   lets the cell grow with taller text, and cover then trims the sides only */
.founder-img{position:relative;aspect-ratio:1744/2336;align-self:stretch;min-height:0}
.founder-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.founder-txt{min-width:0}
@media(max-width:880px){
  .founder{grid-template-columns:1fr}
}
