/* UnderOne Health — shared tokens, header, footer (used by every page) */
:root{
  --navy:#073A4C; --navy-2:#0C4D63; --teal:#4DBBCB; --ink:#0A2431; --muted:#5A6B75;
  --lav:#ECE7FA; --lav-2:#D9CFF3; --sky:#E7F3F8; --line:#E6ECF1; --bg:#FFFFFF;
  --radius:28px; --radius-sm:22px; --max:1280px; --gut:24px;
  --shadow:0 18px 40px -22px rgba(7,58,76,.35);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'Plus Jakarta Sans',system-ui,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.5;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.hand{font-family:'Caveat',cursive;font-weight:500;color:var(--navy);line-height:1.05}
h1,h2,h3{letter-spacing:-.035em;line-height:1.02;font-weight:800;color:var(--navy)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:52px;padding:0 30px;border-radius:999px;font-weight:600;font-size:16px;white-space:nowrap;transition:transform .2s,box-shadow .2s,background .2s}
.btn-primary{background:var(--navy);color:#fff;box-shadow:0 10px 22px -12px rgba(7,58,76,.7)}
.btn-primary:hover{background:var(--navy-2);transform:translateY(-2px);box-shadow:0 16px 28px -14px rgba(7,58,76,.8)}
.btn-outline{background:#fff;color:var(--navy);border:1.5px solid var(--line)}
.btn-outline:hover{border-color:var(--navy)}
.btn svg{transition:transform .2s}
.btn:hover svg{transform:translateX(4px)}
.round{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;transition:transform .2s,background .2s}
.round.dark{background:var(--navy);color:#fff}
.round.light{background:#fff;color:var(--navy);box-shadow:0 6px 16px -8px rgba(7,58,76,.35)}

/* header */
header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.9);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);transition:box-shadow .25s}
header.scrolled{box-shadow:0 1px 0 var(--line),0 10px 30px -24px rgba(7,58,76,.4)}
.nav{height:84px;display:flex;align-items:center;gap:16px}
.logo{flex-shrink:0;display:block}
.logo img{height:40px;width:auto;max-width:none;aspect-ratio:520/134}
.menu{display:flex;align-items:center;gap:clamp(12px,1.05vw,15px);margin:0 auto;font-size:clamp(13px,.95vw,13.75px);font-weight:500;color:var(--ink)}
.menu a{position:relative;padding:6px 0;white-space:nowrap;transition:color .2s}
.menu a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--teal);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.menu a:hover{color:var(--navy)}
.menu a:hover::after{transform:scaleX(1)}
.actions{display:flex;align-items:center;gap:10px;margin-left:auto}
.menu + .actions{margin-left:0}
.icon-btn{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;background:#fff;box-shadow:0 6px 18px -10px rgba(7,58,76,.35);border:1px solid var(--line);color:var(--navy);transition:transform .2s}
.icon-btn:hover{transform:translateY(-2px)}
.burger{display:none}
.drawer{display:none}

/* Care Services dropdown (desktop) */
.dd{position:relative}
.dd-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 0;font:inherit;font-weight:500;color:var(--ink);cursor:pointer;white-space:nowrap}
.dd-btn svg{transition:transform .25s}
.dd:hover .dd-btn,.dd.open .dd-btn{color:var(--navy)}
.dd:hover .dd-btn svg,.dd.open .dd-btn svg{transform:rotate(180deg)}
.dd-panel{position:absolute;top:100%;left:-18px;width:330px;padding:8px;margin-top:14px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 24px 50px -24px rgba(7,58,76,.35);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .35s ease,transform .45s cubic-bezier(.22,.61,.36,1),visibility .35s;z-index:70}
.dd-panel::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.dd:hover .dd-panel,.dd:focus-within .dd-panel,.dd.open .dd-panel{opacity:1;visibility:visible;transform:none}
.menu .dd-item{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;white-space:normal;transition:background-color .45s cubic-bezier(.22,.61,.36,1),transform .45s cubic-bezier(.22,.61,.36,1)}
.menu .dd-item::after{display:none}
.menu .dd-item:hover,.menu .dd-item:focus-visible{background:#EAE5F8;transform:translateX(3px);outline:none}
.dd-item .dd-ic{transition:background-color .45s ease,transform .45s cubic-bezier(.22,.61,.36,1)}
.menu .dd-item:hover .dd-ic{background:#fff;transform:scale(1.06)}
/* items drift in one after another when the panel opens */
.dd-panel .dd-item{opacity:0;translate:0 6px;transition:background-color .45s cubic-bezier(.22,.61,.36,1),transform .45s cubic-bezier(.22,.61,.36,1),opacity .4s ease,translate .4s ease}
.dd:hover .dd-item,.dd:focus-within .dd-item,.dd.open .dd-item{opacity:1;translate:0 0}
.dd-item:nth-child(2){transition-delay:0s,0s,.06s,.06s}
.dd-item:nth-child(3){transition-delay:0s,0s,.12s,.12s}
.dd-item b{display:block;font-size:14.5px;font-weight:600;color:var(--navy)}
.dd-item small{display:block;font-size:12.5px;color:var(--muted);margin-top:1px}
.dd-ic{width:38px;height:38px;border-radius:50%;background:var(--lav);display:grid;place-items:center;color:var(--navy);flex-shrink:0}

/* Care Services group (mobile drawer) */
.dd-m{grid-column:1/-1;border-bottom:1px solid var(--line)}
.dd-m summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:14px 0;font-weight:500;font-size:16px;cursor:pointer}
.dd-m summary::-webkit-details-marker{display:none}
.dd-m summary svg{color:var(--teal);transition:transform .25s}
.dd-m[open] summary svg{transform:rotate(180deg)}
.drawer nav .dd-m a{justify-content:flex-start;gap:12px;padding:10px 8px;border-bottom:0;border-radius:12px;font-size:15px;transition:background-color .45s cubic-bezier(.22,.61,.36,1)}
.drawer nav .dd-m a:hover,.drawer nav .dd-m a:active{background:#EAE5F8}
.drawer nav .dd-m a::after{margin-left:auto}
.drawer nav .dd-m a:last-child{padding-bottom:16px}
.dd-m .dd-ic{width:34px;height:34px}

/* footer */
footer{padding:48px 0 36px}
.foot{display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.foot .logo img{height:40px}
.foot-links{display:flex;gap:40px;font-size:14px;color:var(--muted)}
.foot-links a:hover{color:var(--navy)}
.social{display:flex;gap:10px;margin-left:auto}
.social a{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;color:var(--navy);transition:background .2s}
.social a:hover{background:var(--sky)}
.fine{margin-top:28px;padding-top:22px;border-top:1px solid var(--line);font-size:12px;color:#8494A0;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

/* multi-column footer */
.site-foot{margin-top:24px;padding:56px 0 30px;background:linear-gradient(180deg,#F8F6FE 0%,#F1EEFB 100%);border-top:1px solid #ECE8FA}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1.3fr;gap:36px}
.fbrand .logo img{height:40px}
.fbrand p{font-size:14px;color:var(--muted);line-height:1.6;margin:14px 0 16px;max-width:280px}
.fbrand .social{margin-left:-10px}
.fcol h4,.fcta h4{font-size:15px;font-weight:700;color:var(--navy);margin-bottom:14px}
.fcol ul{list-style:none;display:grid;gap:10px}
.fcol a{font-size:14px;color:var(--muted);transition:color .3s ease}
.fcol a:hover{color:var(--navy)}
.fcta{background:#fff;border:1px solid #E4DEF8;border-radius:20px;padding:22px;align-self:start;box-shadow:0 18px 40px -32px rgba(91,68,184,.35)}
.fcta p{font-size:14px;color:var(--muted);line-height:1.55;margin-bottom:16px}
.fcta .btn{height:44px;padding:0 20px;font-size:14.5px}
.site-foot .fine{margin-top:40px}
@media (max-width:1100px){.fgrid{grid-template-columns:1fr 1fr 1fr;}.fbrand,.fcta{grid-column:span 3}.fcta{max-width:420px}}
@media (max-width:640px){.fgrid{grid-template-columns:1fr 1fr;gap:28px 20px}.fbrand,.fcta{grid-column:span 2}.fcol:nth-of-type(4){grid-column:span 2}.site-foot{padding-top:42px}}

/* Patient Portal dropdown (replaces the account icon) */
.actions .portal-btn{height:48px;padding:0 16px;gap:8px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--navy);font-size:14px;font-weight:600;box-shadow:0 6px 18px -10px rgba(7,58,76,.35);transition:background-color .35s ease,border-color .35s ease}
.actions .portal-btn:hover,.dd.portal.open .portal-btn{background:#EAE5F8;border-color:#D9CFF3}
.dd.portal .dd-panel{left:auto;right:0;width:320px}
.dd.portal .dd-panel::before{left:auto;right:0;width:100%}
.dd-item .ext{margin-left:auto;color:#9AA6B0;flex-shrink:0;transition:transform .3s ease,color .3s ease}
.dd-item:hover .ext{color:var(--navy);transform:translate(2px,-2px)}
/* desktop header with the full "Patient Portal" label: tighter menu so everything fits the 1280px container */
@media (min-width:1321px){
  .menu{gap:12px;font-size:13.25px}
  .nav{gap:14px}
  .logo img{height:36px}
  .actions{gap:8px}
  .actions .portal-btn{height:44px;padding:0 13px;font-size:13.5px;gap:6px}
  .actions .portal-btn > svg:first-child{display:none}
  .actions > .btn-primary{height:44px;padding:0 20px;font-size:14.5px}
  .actions > .btn-primary svg{display:none}
}
@media (min-width:861px) and (max-width:1320px){.actions .portal-btn{height:44px;padding:0 14px;font-size:14px}}
@media (max-width:860px){.actions .portal{display:none}}

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

@media (max-width:1439px){
  .actions .account{display:none}
}
@media (max-width:1320px){
  .menu{display:none}
  .menu + .actions{margin-left:auto}
  .burger{display:grid}
  .drawer{display:block;position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid var(--line);box-shadow:0 30px 40px -30px rgba(7,58,76,.35);max-height:0;overflow:hidden;transition:max-height .35s ease}
  .drawer.open{max-height:calc(100vh - 84px);overflow-y:auto}
  .drawer nav{display:grid;grid-template-columns:1fr 1fr;gap:4px 24px;padding:16px var(--gut) 24px;max-width:var(--max);margin:0 auto}
  .drawer nav a{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-weight:500;font-size:16px}
  .drawer nav a::after{content:"→";color:var(--teal)}
  .drawer nav a.account-link{display:none}
}
@media (max-width:860px){
  :root{--gut:16px;--radius:24px}
  .nav{height:72px;gap:12px}
  .logo img{height:34px}
  .actions{gap:8px}
  .drawer.open{max-height:calc(100vh - 72px)}
  .drawer nav{grid-template-columns:1fr}
  .actions .btn{height:44px;padding:0 18px;font-size:14px}
  .actions .btn svg{display:none}
  .icon-btn{width:44px;height:44px;border-radius:14px}
  .foot{gap:22px}
  .foot-links{gap:24px;order:3;width:100%}
  .social{margin-left:auto}
}
@media (max-width:420px){
  .logo img{height:30px}
  .actions .btn{padding:0 14px}
  .actions .account{display:none}
  .drawer nav a.account-link{display:flex}
}

/* keep the Care Services menu's gentle fade even when the OS asks for reduced motion */
@media (prefers-reduced-motion:reduce){
  .dd-panel{transition:opacity .35s ease,transform .45s cubic-bezier(.22,.61,.36,1),visibility .35s!important}
  .menu .dd-item{transition:background-color .45s cubic-bezier(.22,.61,.36,1),transform .45s cubic-bezier(.22,.61,.36,1),opacity .4s ease,translate .4s ease!important}
  .dd-item .dd-ic{transition:background-color .45s ease,transform .45s cubic-bezier(.22,.61,.36,1)!important}
  .drawer nav .dd-m a{transition:background-color .45s cubic-bezier(.22,.61,.36,1)!important}
  .dd-btn svg,.dd-m summary svg{transition:transform .25s!important}
}

/* Patient Portal panel items: same row layout and lilac hover as the Care Services menu */
.actions .dd-item{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;white-space:normal;opacity:0;translate:0 6px;transition:background-color .45s cubic-bezier(.22,.61,.36,1),transform .45s cubic-bezier(.22,.61,.36,1),opacity .4s ease,translate .4s ease}
.actions .dd:hover .dd-item,.actions .dd:focus-within .dd-item,.actions .dd.open .dd-item{opacity:1;translate:0 0}
.actions .dd-item:hover,.actions .dd-item:focus-visible{background:#EAE5F8;transform:translateX(3px);outline:none}
.actions .dd-item:hover .dd-ic{background:#fff;transform:scale(1.06)}
@media (prefers-reduced-motion:reduce){.actions .dd-item,.actions .portal-btn{transition:background-color .45s ease,transform .45s ease,opacity .4s ease,translate .4s ease,border-color .35s ease!important}}