/*=========================GLOBAL CSS=========================*/
:root{
  --bg:#050608;

  --ptDark:#050608;
  --ptLight:#f6f1ec;
  --ptColor:var(--ptDark);

  --fg:#f3f4f6;
  --muted:rgba(243,244,246,.62);
  --line:rgba(243,244,246,.12);
  --ink:#000;
  --ghost:rgba(243,244,246,.06);

  --drawerW:420px;
  --blur:6px;
  --dim:.65;
  --inkMS:1000ms;
}

*{box-sizing:border-box}
html,body{height:100%}

html{overflow-x:hidden}
body{margin:0;background:var(--bg);color:var(--fg);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,"Apple Color Emoji","Segoe UI Emoji";overflow-x:hidden}
a{color:inherit}
img{max-width:100%;height:auto;display:block}
/* Header */
.site-head{position:fixed;inset:0 0 auto 0;display:flex;align-items:center;justify-content:space-between;padding:26px 34px;z-index:120}
.brand{color:var(--fg);text-decoration:none;display:inline-flex;align-items:center;gap:0}
.brand-img{width:56px;height:56px;object-fit:contain;display:block}
.menu-btn{appearance:none;border:0;background:transparent;color:var(--fg);padding:10px;border-radius:14px;cursor:pointer;position:relative;z-index:130}
.hb{display:inline-block;width:34px;height:22px;position:relative}
.hb span{position:absolute;left:0;right:0;height:2px;background:var(--fg);border-radius:999px;transition:transform .22s ease,opacity .18s ease,top .22s ease}
.hb span:nth-child(1){top:0}
.hb span:nth-child(2){top:10px;opacity:.9}
.hb span:nth-child(3){top:20px}
body.menu-open .hb span:nth-child(1){top:10px;transform:rotate(45deg)}
body.menu-open .hb span:nth-child(2){opacity:0}
body.menu-open .hb span:nth-child(3){top:10px;transform:rotate(-45deg)}
/* Drawer system */
.ink{position:fixed;inset:0;z-index:110;pointer-events:none}
body.menu-open{overflow:hidden}
body.menu-open .ink{pointer-events:auto}
.ink__backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;transition:opacity .22s ease}
body.menu-open .ink__backdrop{opacity:1}
.ink__drawer{position:absolute;inset:0 auto 0 0;width:var(--drawerW);max-width:88vw;background:#050608;border-right:1px solid rgba(255,255,255,.06);box-shadow:0 24px 80px rgba(0,0,0,.55);overflow:hidden;transform:translateX(-10px);opacity:0;transition:opacity .18s ease,transform .18s ease}
body.menu-open .ink__drawer{opacity:1;transform:translateX(0)}
.ink__drawer::before{content:"";position:absolute;inset:-30vmax;background:radial-gradient(closest-side,rgba(0,0,0,.22),rgba(0,0,0,1));clip-path:circle(0px at var(--mx,95vw) var(--my,6vh));-webkit-clip-path:circle(0px at var(--mx,95vw) var(--my,6vh));transition:clip-path var(--inkMS) cubic-bezier(.12,.9,.12,1);-webkit-transition:-webkit-clip-path var(--inkMS) cubic-bezier(.12,.9,.12,1);will-change:clip-path;pointer-events:none}
body.menu-open .ink__drawer::before{clip-path:circle(120vmax at var(--mx,95vw) var(--my,6vh));-webkit-clip-path:circle(120vmax at var(--mx,95vw) var(--my,6vh))}
.ink__panel{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:34px 34px 28px;z-index:2;opacity:0;transform:translateY(8px);transition:opacity .28s ease .35s,transform .28s ease .35s}
body.menu-open .ink__panel{opacity:1;transform:translateY(0)}
.ink__ghost{position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-end;padding:0 28px;pointer-events:none;z-index:3;opacity:0;transition:opacity .22s ease .18s}
body.menu-open .ink__ghost{opacity:1}
.ink__ghost span{writing-mode:vertical-rl;text-orientation:mixed;font-size:clamp(70px,10vh,140px);font-weight:800;letter-spacing:.18em;text-transform:uppercase;line-height:1;color:rgba(243,244,246,.06);transform:translateY(0)}
@media (max-width:900px){
.ink__ghost{justify-content:center;padding:0}
}
@media (max-width:900px){
.ink__ghost span{font-size:clamp(54px,10vh,110px);opacity:.85}
}
#menuGhostText{opacity:.9;transition:opacity .18s ease}
#menuGhostText.is-off{opacity:.2}
#menuGhostText.is-on{opacity:.9}
.ink__nav{flex:1;display:flex;align-items:flex-end}
.ink__list{list-style:none;margin:0 0 10px 0;padding:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:16px}
.ink__list li{margin:0}
.ink__list a{color:rgba(243,244,246,.95);text-decoration:none;font-size:clamp(19px,1.55vw,26px);letter-spacing:.24em;font-weight:750;display:inline-block;opacity:.72;transition:opacity .2s ease,transform .2s ease,filter .2s ease;text-transform:uppercase}
.ink__list a::after{display:none}
.ink__list .current-menu-item>a,.ink__list .current_page_item>a,.ink__list .current-menu-ancestor>a{opacity:1;filter:none;transform:none}
.ink__list:hover a{filter:blur(.35px)}
.ink__list li:hover>a{opacity:1;transform:translateX(6px);filter:none}
.ink__meta{margin-top:18px}
.ink__corner{color:rgba(243,244,246,.45);font-size:12px;letter-spacing:.12em;margin-bottom:10px;text-transform:uppercase}
.ink__social{display:flex;align-items:center;flex-wrap:wrap;gap:10px;color:rgba(243,244,246,.75);font-size:12px;letter-spacing:.22em;text-transform:uppercase}
.ink__sociallink{text-decoration:none;color:rgba(243,244,246,.75)}
.ink__sociallink:hover{color:rgba(243,244,246,.95)}
.ink__dash{opacity:.55}
.ink__sociallink--x{opacity:1}
body.menu-open .site-main{pointer-events:none}
.site-main{min-height:100vh}
.site-foot{position:fixed;left:18px;bottom:14px;z-index:10;color:rgba(243,244,246,.55);font-size:12px;letter-spacing:.06em}
/* =========================
   MENU — Mobile full-width drawer
   ========================= */
@media (max-width:420px){
  :root{ --drawerW: 100vw; }
  .ink__drawer{ max-width:100vw; }
  .site-head{ padding:20px 18px; }
  
}
/* =========================
   ACTIVE MENU ITEM = hover state
   ========================= */

.ink__list .current-menu-item > a,
.ink__list .current_page_item > a,
.ink__list .current-menu-ancestor > a{
  opacity:1 !important;
  transform:translateX(6px);
}
.ink__list .current-menu-item > a{
  letter-spacing:.08em;
}
.pt{position:fixed;inset:0;z-index:99999;pointer-events:none;opacity:0;transition:opacity .2s ease}
.pt__wipe{position:absolute;inset:-20vh -20vw;background:var(--ptColor,#0b0c10);transform:translateY(110%);transition:transform .65s cubic-bezier(.2,.8,.2,1)}
body.is-leaving .pt{opacity:1}
body.is-leaving .pt__wipe{transform:translateY(0)}
body.is-enter .pt{opacity:1}
body.is-enter .pt__wipe{transform:translateY(-110%)}
@media (prefers-reduced-motion:reduce){.pt,.pt__wipe{transition:none}}
.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
.reveal.is-in{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}
body.home{ --ptColor: var(--ptDark); }
body.page-about{ --ptColor: var(--ptLight); }
body.page-works{ --ptColor: var(--ptLight); }
/* =========================
   DRAWER — FULL WIDTH (<=800px)
   ========================= */
@media (max-width:800px){
  :root{ --drawerW: 100vw; }
  .ink__drawer{ max-width:100vw; }
}
@media (max-width:800px){
  .ink__panel{ padding:26px 20px 22px; }
}