/* One site-wide header: the case-study header, now also used on the Framer pages (Home, About, Works, Contact, 404).
   Rules are copied 1:1 from assets/case/case.css so both page types look and behave identically. */
html.am-fr:not([data-theme="dark"]){--bg:#fefcfa;--ink:#201f1d;--line:rgba(32,31,29,.2);--pink:#BCE8D2}
html.am-fr{
  --serif:"Ortica Linear","Ortica Linear Fallback",Georgia,serif;--sans:Manrope,"Manrope Placeholder",system-ui,sans-serif;--hand:Caveat,cursive;
  --pad:40px;--max:1280px;--nav:84px}
/* the old Framer header (kept in the DOM so React hydration is untouched) is hidden */
html.am-fr .ui-hiektc-container{display:none!important}
/* the Framer pages have content designed to start under a fixed header */
html.am-fr header.nav{position:fixed;left:0;right:0;top:0}
html.am-fr body{padding-top:0}

header.nav{position:sticky;top:0;z-index:50;height:var(--nav);background:rgba(254,252,250,.92);backdrop-filter:saturate(1.2) blur(10px);-webkit-backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--line);color:var(--ink);font:500 17px/1.6 var(--sans);letter-spacing:-.01em;-webkit-font-smoothing:antialiased}
html.am-fr header.nav{position:fixed}
header.nav *{box-sizing:border-box}
header.nav a{color:inherit}
header.nav .wrap{max-width:calc(var(--max) + var(--pad)*2);margin:0 auto;padding:0 var(--pad);height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
header.nav .links{display:flex;gap:36px}
header.nav .links a{font:600 18px/1 var(--sans);text-decoration:none;letter-spacing:-.01em}
header.nav .links a[aria-current]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px}
header.nav .links a{position:relative}
header.nav .links a:not([aria-current])::before{content:"";position:absolute;left:0;bottom:-6px;width:100%;height:2px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}
header.nav .links a:not([aria-current]):hover::before,header.nav .links a:not([aria-current]):focus-visible::before{transform:scaleX(1);transform-origin:left}
@media (prefers-reduced-motion:reduce){header.nav .links a::before{transition:none}}
header.nav .resume{display:inline-flex;align-items:center;gap:8px;padding:14px 26px;border:1.5px solid var(--ink);border-radius:40px;background:var(--pink);font:700 17px/1 var(--sans);text-decoration:none;transition:background .3s ease}
header.nav .resume:hover{background:#A9DCC3}
header.nav .brand{display:flex;align-items:center;gap:24px}
header.nav .clock{font:400 25px/1 var(--hand);letter-spacing:0;white-space:nowrap;font-variant-numeric:tabular-nums}
header.nav .nav-r{display:flex;align-items:center;gap:12px}
header.nav .menu-btn{display:none;align-items:center;padding:12px 18px;border:1.5px solid var(--ink);border-radius:40px;background:transparent;font:700 15px/1 var(--sans);color:var(--ink);cursor:pointer}
nav.mnav{position:fixed;top:var(--nav);left:0;right:0;z-index:49;display:none;flex-direction:column;padding:16px var(--pad) 28px;background:var(--bg);border-bottom:1px solid var(--line);color:var(--ink);font:500 17px/1.6 var(--sans)}
nav.mnav.on{display:flex}
nav.mnav a{font:300 36px/1.35 var(--serif);letter-spacing:-.02em;text-decoration:none;color:inherit}
nav.mnav a[aria-current]{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1.5px}
@media (max-width:999.98px){header.nav .links,header.nav .clock{display:none}header.nav .menu-btn{display:inline-flex}}
@media (max-width:809.98px){html.am-fr{--pad:16px;--nav:68px}header.nav .resume{display:none}}
html.am-fr[data-theme="dark"] header.nav{background:rgba(21,20,18,.9)}