/* ============================================================
   N8STUDIO — DESIGN TOKENS
   ============================================================ */
:root{
  /* --- brand palette (exact, from brief) --- */
  --red:      #a20101;
  --white:    #ffffff;
  --taupe:    #9a8174;
  --slate:    #778d9f;
  --grey:     #737373;
  --char:     #4d4d4d;

  /* --- surfaces, derived from the background artwork --- */
  --void:     #000000;   /* page canvas */
  --pitch:    #060606;   /* hero base */
  --panel:    #0b0b0b;   /* alternating band */
  --card:     #111111;   /* card fill */
  --card-hi:  #171717;   /* card hover */
  --line:     #1e1e1e;   /* hairline border */
  --line-soft:rgba(255,255,255,.07);
  --sheet:    #1a1a1a;   /* modal panel */
  --drawer:   #282828;   /* mobile menu panel — deliberately lifted off the page black */

  /* --- text --- */
  --ink:      #f2f2f2;   /* primary */
  --ink-2:    #b8b8b8;   /* secondary body */
  --ink-3:    var(--grey);/* muted meta */
  --ink-4:    var(--char);/* faintest */

  /* --- type families ---
     Nourd is a Canva-licensed face with no web version. It sits first in the
     stack so it swaps in automatically once you self-host the .woff2.
     Until then Barlow carries the display role. */
  --f-display: 'Nourd', 'Barlow', system-ui, sans-serif;
  --f-body:    'Barlow', system-ui, sans-serif;
  --f-accent:  'Lora', Georgia, serif;
  --f-util:    'Nourd', 'Barlow Condensed', 'Barlow', sans-serif;

  /* --- scale --- */
  --t-eyebrow: 10px;
  --t-micro:   10px;
  --t-label:   11px;
  --t-small:   13px;
  --t-body:    14.5px;
  --t-lead:    16px;
  --t-h3:      19px;
  --t-h2:      clamp(28px, 3.6vw, 42px);
  --t-h1:      clamp(38px, 5.6vw, 66px);

  /* --- rhythm --- */
  --wrap:      1180px;
  --gut:       clamp(20px, 5vw, 48px);
  --band:      clamp(88px, 11vw, 150px);

  /* --- shape --- */
  --r-btn:  3px;
  --r-card: 10px;
  --r-nav:  14px;
  --r-img:  8px;
}

/* ============================================================
   RESET
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--void); color:var(--ink);
  font-family:var(--f-body); font-size:var(--t-body); font-weight:400;
  line-height:1.75; letter-spacing:.005em;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
button{font:inherit; color:inherit; background:none; border:0; cursor:pointer}
h1,h2,h3,h4,p,ul{margin:0}
ul{list-style:none; padding:0}
::selection{background:var(--red); color:var(--white)}
:focus-visible{outline:2px solid var(--taupe); outline-offset:3px; border-radius:2px}

/* ============================================================
   GLOBAL FILM GRAIN — recreates the texture of the supplied art
   ============================================================ */
.grain{
  position:fixed; inset:-50%; z-index:80; pointer-events:none;
  opacity:.4; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='260' height='260'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.82' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============================================================
   LAYOUT PRIMITIVES
   ============================================================ */
.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut)}
.band{padding-block:var(--band); position:relative}
.band--panel{background:var(--panel)}
.band--tight{padding-block:calc(var(--band) * .68)}

/* ============================================================
   TYPE ROLES
   ============================================================ */
.eyebrow{
  font-family:var(--f-util); font-size:var(--t-eyebrow); font-weight:500;
  letter-spacing:.30em; text-transform:uppercase; color:var(--ink-4);
  line-height:1; margin-bottom:18px; display:block;
}
.eyebrow::before{content:"–- "; letter-spacing:.1em}

/* the signature: slash-heading + hairline running to the edge */
.rule-head{display:flex; align-items:center; gap:clamp(18px,3vw,40px)}
.rule-head h2{
  font-family:var(--f-display); font-size:var(--t-h2); font-weight:700;
  letter-spacing:-.022em; line-height:1; color:var(--ink);
  white-space:nowrap; flex:0 0 auto;
}
.rule-head h2 .slash{color:var(--ink); font-weight:700; margin-right:.16em}
.rule-head .rule{flex:1 1 auto; height:1px; background:var(--line); min-width:40px}
.rule-head .see-all{
  flex:0 0 auto; font-family:var(--f-util); font-size:var(--t-label);
  letter-spacing:.14em; text-transform:lowercase; color:var(--ink-2);
  border-bottom:1px solid transparent; transition:color .25s, border-color .25s;
}
.rule-head .see-all:hover{color:var(--white); border-color:var(--red)}

.sub{color:var(--ink-3); font-size:var(--t-small); max-width:56ch; margin-top:20px; line-height:1.7}
.lead{color:var(--ink-2); font-size:var(--t-body); line-height:1.8; max-width:62ch}

/* ============================================================
   MONOGRAM
   ============================================================ */
.mark{
  display:block; aspect-ratio:1/1; background-repeat:no-repeat;
  background-position:center; background-size:contain;
  background-image:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAUAAAAFACAIAAABC8jL9AAAd/0lEQVR42u2dbXBVxRnHd/ece0lCQhIhCZEYwkCIEqWoEAYjBKaByEsl0gCBviiiY6XTijOUaR0Zirbj0FJbndZOW/2iFQgBCYJEawlQBXlRDBoIWKpBSTAiuUkkr/ecs/3wDGcygEByc8+5Z+//96laJ/fePfvb59k9++wyBgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADQf/Bwf4CmaZxzNHTEYpqmlBLtAAAACkVgIYRlWY8++ui4ceMsyxJCoLkjCikl5/zll1/et28fPSy0iefQwy3wvHnzCgsL0dARy/bt2xljmOZA4CvT3NxsGIZhGLquo7kjLfwahvHJJ5/QP6JNIPAV0DSN1IXAEShwS0tLc3MzBIbAwJMCt7e3t7a2Rtp345yHktLTYBQlQxIEjmpaWlo6OzsjobtzzoUQnHN6rRX69xFC0CqM2otzEDh6IzBjLBAIkDzuCqxpmmmapmnSPyYlJcXFxcXFxfl8vt5+sc7Ozo6OjtbW1o6ODlJXCNEvIwIEBhFHd3e36wKTvbquT5s2bcaMGZMnTx4+fHhsbGxMTExv102klN3d3V1dXd98882HH364Z8+eysrKkydP2p+CJ96bsUHXGWOvvfaalDIYDEoQSRiGIaV88803KUa51Unoo4uLi6urq8PxMzs7O1955ZWMjAxyWD3LsLkiqnExKHHONU2zLGvt2rVbt279zne+Y1mWYRiWZYXurWVZpmkahjFgwIAf/vCHhw4dKigoME1TPYchcFTj4gKPEMI0zbVr165cuZK8FULouk5LWSEihLDfXxqGkZ6evnPnzvHjx5umqdiOQAgMXJv3zpkzZ+XKlcFgUNO08Hml67phGHFxca+++mp8fDy9P4PAAIQU+f1+/9q1a6WUFHLDvRxjGMbo0aMfffRRKaVKiTQEBi6EXynllClTxowZ45hO9DJpyZIlPp9PpeVoCAychuLt7NmzabXJsSk3YywnJyc3N5fCPgQGoC9QAJw4cWKIWyb7kLcLIfLy8pirb84gMPB2+JVSJiQkZGZmMmfLGGmzSk5OjkrtCYGBC/nzoEGDEhMTmRt1yEOHDmUKlTpAYOAC9kta58cOGjggMAD9kNA6j9/vRwoNAIDAAAAIDAAEBgBAYAAABAYAQGAAIDAAAAIDACAwAAACAwCBAQAQGAAAgQGAwAAACAwAgMAAAAgMAAQGAEBgAAAEBgBAYAAgMAAAAgMAIDAAEBgAAIEBABAYAACBAYDAAAAIDACAwABAYAAABAYAQGAAAAQGAAIDEBYsy5JSuvXREBiAPkLednd3d3V1ufIF2traIDAAIdHS0hIIBGyfnRw7GhoaGGNCCAgMQF8sEkJ0dXV9+umnDgvMOWeM1dTUIAIDEEKfE4Ixtn//focFFkJYlkWfq8xMGAIDd6bBr7/+OkVjZz7UNE3GWHV19bFjxzjnEBiAvrskhPjggw/efvttIYRhGM6MGpzzdevWWZalaRpSaABCZcWKFV1dXUIICo/ho7u7W9f1f/3rXxs3bnRsyIDAQFkoDH788ccPP/ywEELTNMMwwjEftizLMAy/319bW/vjH/9YwQUFdCbgViKtadorr7xSXFzc2Nio6zrn3DRNwzBM07RCwP4jNMfWdX379u1Tp05tbGxUafYLgQHTdd11h7dt2zZ+/Pi///3vgUBA0zRd1zVNEyFg/xHO+dGjRx988MF77733q6++olVo1Z4gOnE0ExcXx5x9l3NFh8+cOfPII4/8+te/vvvuuydNmpSdnZ2enq7reh++GOf8woULdXV1R48efeeddw4ePEjLV0y5TZQQOKqhPp2cnOyuwOQw51wIcfbs2fLy8vLy8v79+5qmhXuRDCk0cEfgoUOHJiUl2f/oFlJK0piy3xBfDtt/h7Johe2FwFEtsJTyhhtuGD58uOsC99TYMIwQc13779A6ltrPEQJHL/QuZ8KECZTBokEgMPAeRUVFUkrlIxUEBso9eyEYY9OnT09JSaHtjWgTCAy8NA02TTMxMXHRokVMoRJZCAyiyGHG2LJly/x+v5KvSSEwUDyLNk0zJydn6dKllmW5uzFL1fERAoPwdjLLslavXp2SkmJZFhLpfmxYB5YG8bQQhIWUMi0t7fnnn1esVtb1Vk1PTx80aFBYQzEEBoyq+UpLS5cvXx4MBn0+H9okRHstyxo0aNCGDRvi4+PD+llOzHnkRbw4xwhTg0TaBIw2DD/77LP19fXl5eU+ny8YDELFvo2Gpmnqur5p06aCgoLW1lZvC8w5p40+YZKNdrp6IvGzv6pj4871N469GWv9+vWc802bNmmaJqXE0nTvdNJ1wzBiYmLWr19fVFT09ddfh3tdMOwC05bUYDAYjrBDG9btmBbJAbnn9NKZI13sxrnOpSladNE0raysLCsr63e/+x39kWjYUdwvaTPn3DCM4cOHv/rqq/n5+c6s6oexx1OHyMjISExMpFqTfv+I+Pj4rKys+fPnz58/n108uCwy7RVCVFVVvfTSS6dOnbpw4YIDSgwcODA7O/vBBx8sLCy8/uVleyjcsmXLY489Vl9fTzHcxctQIl9d+5ytkpKSP//5z2lpabSU0NzcPGLEiObmZmdWpD3M/Pnz29ra6CgWGWFQBFu7dq1bjbN69Wr7a1wPdI6UlPLs2bM//elP/X6/PbtzMv+PfG97Vj6OGTOmrKyMGpAKqqSUgUAgEqo1Q43DIpxomkarpg899BC1XQTa+9FHH1FT0CN3DDuLrqqq6m3j2P9xdXX1/fffn5CQ0LPvRu3bJnqIPYXMzc194YUX2tra6HGTuuoI7FibMsYOHToUaQ7T5P+Xv/wlY8yV1zPU20pKSvrQMnYollLW1dWtW7du8uTJsbGx6HKMsczMzB/96Eevv/56Z2fnJUMeBO5LN2WMPfDAA5EmMH2Z4uJiOibClUyPMZaTk9PnyYW9Bkm0trbu2bNn6dKlLMrqH0jCwYMH//Wvfz158mRPV4PB4CXN65jAiux9pfclO3bsaG5uTkpKipzVLPoaXV1d7q5htLe3d3Z2xsbG9rZlqDvaq6mnTp06fPjw0aNHP/nkE+b2YVqu0NnZeeDAgZaWlry8vHHjxiUnJ9PQjE1soULNt2HDBjtxjZw58MyZM5lLL6spSGZkZNAkrVdx2M5lAoHAP/7xj4KCgpiYGPQ0m2HDhj3yyCPvvvuu/aztlUKk0H2c7M2dO7dXK64Q+Oqz3wsXLqxbty4rK6vnQBn6uXNeDxWXtMDMmTNpmdAe9SBwH5PVgQMHnjlzprehBgJf/p2llJs2bbr55pvtXot3SJd3uZ5tsmjRorq6OkoAIXDfl7L+8pe/RE4W7TmB7cD78MMP262KGsNrxmRqorS0tPLycrsZIXBfpsFTpkyJnCzaWwJTt/v0008nTJjQs1+C648f7OLOGcuympqaIHDvUhrOuc/nq62tjRCHPSQw2Xvy5MnMzEzm0ltrr2NvcVm2bJmUsqmpKTExkaEe+DqhvfjBYHDLli1M0btwwgS9Bamvry8qKvr88891XUc5Yd+a0bIsn8/3wgsv/OpXv0pOTsYW6L4EnLFjx9r7URGBrxmBac25o6MjLy+PuX1loUrp9DPPPJORkYEUui+J9IEDByJhV5YnBKZWevzxx5E5928npAldeJ+vkktZ9AqEReVWod5CF3y+9957f/rTn+hsHbRJv8zm7M3wELjX8xDG2NatWzs7O/t2x2y0xQrLslauXEkNhebq37YNe4alpMBCiM8++2zv3r04FOaa4VcIUVlZ+e6776p9j65bcRgC933it2HDBiweXE+IePbZZ9FQXu3qSv4qiro7d+5sbm6mKTGe9LelKrW1tf/5z3/YxYouAIEjomtqmnbu3Lk333yTloLxpL9tmNuxY4dhGCiFg8CRmB9SFo39gFeZaFD4RZLiUZR9ZU8vPKuqqurr64cNG4Zbfy5BSimE6OjoqKmpiSiBaTYe4pw8eq4sFwp3UE3TLly4sG3bNoZtlVdqH8ZYY2NjQ0NDJAhMpXm0YEHvDkKBhqdoqKNSf9NcWVnZsmXLEH6vKHBDQ0N3d7frpxbTGyx7qSItLc3v9yckJPj9/t5+sfb29vb29ra2tubmZhq16dGrOoKrLDCdJv/ee++dOHHi5ptvRhZ9ORcuXGBOXYR5lam4aZpxcXGFhYVFRUX5+fkjRoyIjY295PTW6586dXd3BwKBY8eO7dmzZ+fOnR9++KE9RuCJe2180nXG2NNPP+1WiX/E7oWm/c87duxg7h0uSbuFGWOlpaUnTpwIU/tv2bJl1KhRzCMXaIErdF8Xi5MiXODt27e7JbB9zu7zzz9vf6VgMEhno9tT2d4eZG1Df43+/blz52bMmMFUPAdX8ZTSsizO+ccff/z+++9zzpFERdTYaprmc88997Of/YyGV/uwOLuUp28hnaC/xhgzDGPIkCHbtm2766671JtGqT8npIXNsrIyhredkfRQTNO87777fv7znweDwbCe3UMXLMbExPzzn/9MTEyM2BvwIPC3BmHG2NatWzs6OlCcFAlQ/dOAAQOeeeYZetsXbqOoTHLEiBF00o1KQTgqBBZC1NXV0ZYjvBCOhORZSjlt2rScnBzHdKIPfeCBB/x+f5guu4XAYXx4nPONGzdCngiJwIyxWbNmOVnsScNEdnb2bbfdxhQ64yYqBKalYLo5CcVJkfA4GGN5eXl9W6kK5XM553TulzJZdFQITBOtr7/+GsVJkRB+pZSDBg2i096cFyk7O1up7DJ6+o1dnITiddfz54SEBDow2fmPTktLYwq9j4gWgSmL3rVrV319PV0GCZdchOoWXPlouioBAnsvi9Z1va2tDcVJUY5i5+ZG0eZ+GnRpRwe2xQII7DFoWyUVJ9FeAjx+AIG9FIHp5qTNmzcjiwYQ2KtZdHl5OV1HgMcPILCXoFf5KE4CENir4OYkAIE9DE19X3vtNRQnAQjsSYHt4iTcnAQgsAd/M25OAhDYu9DaFW5OAhDYk9ALYdycBCCwh0FxEoDAXoWOLN21a9eZM2dQnAQgsCezaBQnAQjsbag4CVeuAAjsMeybk2pra4UQCMIAAnsMOi4YxUkAAnsSktYuTsILYQCBPSZwz+IkBGEAgb2XRTPG6Mx3RGAAgT2ZRePmJACBvSqwEOL06dN79+5lF7dJAwCBvdMEF4uTmEJX5gAIHC3YxUmBQABr0QACewz75qTKykoUJwEI7Eno/lHOObZVAgjsMag4qaqq6syZM9hWCSCwJ7NoFCcBCOxtaEcHsmgAgT0GFScdPHjw+PHjyKIBBPYeuDkJQGAPQ9Ju3rwZNycBCOxJgTnnNTU1hw4dws1JAAJ7MouWUtI5O9iSBSCwJ7PoioqK9vZ2bKsEENh7AtvFSSjxBxDYgy0iBG2rRFOED9M03VpiCAaDEFjxviWlfOONN5qampBF9zvUnp2dnR0dHa58gdbWVqZQ3SgEvkIP0zTt/PnzKE4KHy0tLefPn2fOrhTSZ9XX10Ng9UFxUvgsEkIYhvG///3PYYFJ2pqaGqTQioPipHCvMjDG9u3b56TAlFgFg8H9+/czhXbaQeArP2xd19vb2ysqKhi2VYZhfGSMVVRUGIbh2I43GpQPHDjw3//+V6VBGQJfbb6E4qQwuSSEqK2t3b59O+fcMAxnHijn/A9/+AP9D6TQioPiJAdmpE888QRtmAn3SmF3d7eu69u3b9+2bZsQQqWFSQj8rUTDzUluxSIKwidOnFiyZAnnnJo6HPNhy7IMw/D7/dXV1UuWLBFCKPZeEAJfI4suLy93cqrmMLquu5jjaJq2adOmkpKSL7/8Utd12vpmGIYZMoZh0IgghNB1/Y033igqKnL+xRVwP0Bxzvfv3y+lpA7RW2hbyMyZM9nFa1ycHqGFYIxlZGS0tbVJKWktx/45//73v5mrL0WpTdLT0//4xz82NDTI/ubw4cOLFy/u2RSqDcGw9JpZ9MaNGydNmqTkD4yNjXV9rUHTtLNnzz7++ONr1qy5++67J0yYcOutt6ampvbtphvOeXt7+2effVZdXb1///4jR47YIxQWMqIOGrMzMzPb29t7hi8FIjB9sY8++ihCMp3wNY7aZzNgDnzttZbPP/989+7d1PsV+4Hx8fE0DXb3zQoNKKSxruuapvEQEELQ36G6FLU3w0Lg64pgGzZsUOzaJPo58fHxiYmJEfKVSGNaxApl3mtZFv0dSjcU759Q9JqTNMZYZWWlksVJgwYNIoFxqxsEVhNVi5M451LKAQMGpKSkQGAIrDicc8qiVXoVQVP64cOHQ2AIrDI0ldq9e/cXX3yh0rZKmg6MGjUKjxgCq59Fq1qcdMsttzDsT4LA0cDGjRtpd54iz14IxtiYMWNwfB8EVhx6S3no0CGVipNo3pudnZ2WlqbSwASBwRVQrziJAm9CQsKtt97KsI4FgZWfCTPlipNoJJoyZQoEhsBRkUUfO3ZMpZuTSNqpU6cy7PWHwNGQRTPG6OYkRR6/EIyx8ePHZ2Zm0sZvPGUIrHIQZmrdnESpRGxs7IwZMxhO/4LAyk+DqThpz549ihUnLViwAFk0BI6C9hLC3lapUhZdUFCQnZ2NLBoCq59FSyl37typTHESHezq9/vvv/9+ZNH927A+ny/cp47hafU6i9Y0rampaefOncoUJ5G0S5YsSUhIoMV2POgQocG9uLh42LBhLJyv6CBwX0ZWxW5OoqOSb7zxxqVLl9IIhaccYg+RUsbFxa1YsaK7uxsNEnGPhzEWFxd3+vRp+3Apz52Jdfn3tCyroaEhKSlJCIFEOsTwyxhbvny5lDI+Ph4ROBKzaMWKkygIp6enr1y5EktZIbaklDI5OfmJJ55oa2sL96iN59R3aEeHMgmnpmmWZS1fvnz06NGGYcDhPgtsWdbq1atTUlI6OjqwoBC5ibSu6zU1NVfPor2SQvc87f3tt99mrl7a4PXkOT8/n47UCwQCSUlJSKEj9FEZhlFeXs4U2v9A94wVFhY+9thjhmHA4d6O6TTpffHFF+lkXLRJRGdKjLHc3NxgMHiVsOatCEz/gWEY3d3deXl5iMO9zcgYYy+//LKUMhgMSikdiMAgJDc45/v27bvKzUmeE9j+znV1dUOHDmWq32zQX/h8PsbYihUryF5qZ6TQfRkIHetwtN5IS1kqnSlFK9LDhw+vqKhITEyk64ug6NXtDQaDixYt+v3vf4/m8lgWfdNNN10luHkxAvdc0HrnnXfo5Hd0yqtnzosXL6YbIaiFHYvASjUl9dS8vDzHZm6kx44dO74ti/auwPZE7sCBA6mpqZgPX7Ft6Zk+9NBD1LZ280LgXkPd67e//a2Ucvbs2fbQGO4P5Zz/4Ac/UFJg2+Hjx4+PGTPG/r3obD2f5pNPPmlvZeu5Fog5cF/o6uqyLGvx4sXUjuH+OPKzsrLy/Pnz6t2cRMaapnnLLbfs3bt3wYIFNEhFeTpNgdc0zSFDhmzYsOHpp5+2LIt2yLvwZdQbF4UQRUVFqampDhTW2MVJlZWV7OKRHeo1qWVZQ4YMKSsre/HFFwcPHmxfBRqdM16a686dO/fw4cOlpaWmadL7CHdGEyVnwoMHD54zZ44znYyG3vXr1zN1i2lpvd2yrKVLlx4+fHjhwoWUNFIsioakWgih6zpNlEaMGPHSSy9VVFRkZWVhzbmf58BPPfUUJc+0H9ABo6j7xsbGXrE4yetz4CsuTUspq6qqCgsLeza+koMXxQD7waWmpj711FNNTU30ZK+yhRaLWCEJbJpmZ2fnyJEjnXGYPvq5556zV31UFfiSjrtjx47Zs2f7/f6eTeH1mExl3vRD7H85cuTI1atXNzQ0XDKQQeCwCNzR0SGl/MUvfsEceflBT3rSpEmXG6KewHYPtv9UTU3N6tWrx44de/l0kZYk3Frg6ZWxmqZdIi1j7IYbbigpKSkrK/vmm28u/+GRILCab/aovRYuXLhu3ToHFpZoUefw4cPHjh3Lzc2NhnkR/UD64bm5ubm5uatWrTpy5Mhbb71VVVVVXV0dCAQMw7hkKOmZDbm4Ym/r1HNE6/n/5uTkTJo06Z577pkyZQrtJ6Ufa7/4jaC4pWr3klLefvvtt99++5EjR2jRP9yfaBjGpk2b1qxZEz1XdVJvpg0Muq5PmDBhwoQJTz75ZGNjY01Nzfvvv//BBx+cOnWqrq4uEAjQfxaBv2LAgAHDhg0bMWLE2LFj77jjjjvuuGP06NF24kaGR6C6KgtM46Wu6wsXLjxy5IgD+Rt1zc2bN69atSraliUptNqpoxAiLS0tLS3tu9/9Lv0H586d++qrr06fPn327NnGxsYvv/yyubn58hDtDAkJCcnJyYMHD05PT09NTc3MzMzIyBgyZEhsbOwl/efyrAECOz33mzdv3qpVq7q7u6lWM6wCc86PHz9+8ODB/Pz8KHy7QBNdanY7NaVV3JSUlJSUlNzc3Ej+/naCQJN2rzw+lQW2LGvUqFGTJ0/etWsXVdg4kEWXlZXl5+dH+YX3lwjQc3XnklmoW/T8JvbQ48U3YSqfyEED6qJFi5z8uIqKira2Nnrpz8BFSexlXkJzm57fxMV9VBD42kssc+bMoaLWcD8kmv598cUXu3fvVuzmJACB3Rn4LctKS0ubMWOGM7MaGsvpzHf0LQCB+yEqSikXLVrkTEi8pDgJQRhA4FCzaM55YWFhenq6A+eVX3JzEgQGEDjULNo0zYSEhLlz5zKnqoXs+0dxNjqAwP1DaWkpc+QAZ0ra9+7de/r0aXqVhU4GIHAIv1AIxthdd92Vk5PjTBat67piNycBCOxmFm0Yhs/nKykpcSaLpjfAit2cBCCwmw4zxhYsWOBAVQO7WKNz6NChmpoaCAwgcKhQcdJtt9125513OnMmG40U5eXldkkwuhqAwKFGxYULFzJHNuLS1Le8vJw2kOBEZQCBQw2JjLF58+bFxsYahuHAtkrOeW1t7d/+9re9e/c2NjYyta5fARFCtEQG2laZlZVVUFDw1ltvOVCcRLr+5Cc/uSQsA4AI3MeoaG+rdK59hfB0sQuAwBGURXPOZ82alZyc7EBxkj1q0MCBrgYgcKhZNF2Hcc8990TnxQIAAnsbioR0cxJmpAACey+LZoxNmzbtpptucmBbJQAQuP+z6IEDBxYXFzN1rzICEFhxaEcHsmgAgb2XRUspJ06cmJubiywaQGDvQWe+z58/H1k0gMAe/M1CMMZKSkro+nl0AgCBPSawlHLMmDF5eXnOFCcBAIH7OYvmnNOZ79jnCCCwJ7Po4uLigQMHOlCcBAAE7meBLcvKyMiYNm0aw8E3AAJ7Drs4iaFSF0Bgz2EXJ6WkpDhWnAQABO4faFtlUlLSrFmzkEUDCOxJpJSOnfkOAATu1x8vBOd86tSpWVlZ2FYJILD3smjDMGJiYu677z6GbZUAAnvRYcZYaWkpnXqHDgEgsJeg4qQ777xz7NixlmVhKQtAYI9hmqamaVSchJdJAAJ7rQkuFif5fD4UJwEI7D2BLcvKycnJz89HcRKAwN6Dlq/ohTAAENhjUNS99957ExISsK0SQGCPQdsq09PTp0+fjjPfAQT2HlJK++YkvBAGENh7WTTnfPr06WlpaXQ5KNoEQGCPZdGJiYnf+973GIqTAAT2KChOAhDYm20hBGNs8uTJo0aNQnESgMDey6INw/D7/d///vcZipMABPaiw4yxBQsWaJqGbZUAAnsMKk4aN27cuHHjpJQIwgACewzTNIUQdH0hBAYQ2GstIgRjbN68eQMGDMCZ7wACe09gy7JGjhw5efJkBGEAgb0HvQSmM98BgMAeg7ZhzZkzJykpCcVJAAJ7DNpWmZqaOmPGDBQnAQjsPVCcBCCwt7NoznlhYeGNN96I4iQAgb2XRRuGER8fP3fuXIbiJACBvegwu7gWjSwaRCa6knNXInSBLcuaOHFiTk7OyZMn6f2wAi2DTu9MazNH7p1WTWCau/p8vv6KwH6/v7S0dM2aNV4X2Ofzcc4xmXcyfeuXfhhdAnd0dLS2thqGoev98NNo+Wr69Om/+c1v6IWwRyOYlLKpqSkuLk5KCYedaXDOeUtLS7g7jGrPMi4urt+7Kef8/Pnzng6/Qojk5GQagCCwYwJblhUIBDBtAQBERwQOU3hRYBBF4HUrFKMRAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACgDv8HzH6rf7dD5AAAAAAASUVORK5CYII=");
}
/* the drawer sits on #282828 — this variant is matted to match */
.drawer .mark{background-image:url("data:image/png;base64,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")}
.mark--nav{height:30px}
.mark--foot{height:64px; margin-inline:auto}

/* ============================================================
   NAVIGATION
   ============================================================ */
.nav-shell{position:fixed; top:0; left:0; right:0; z-index:70; padding:14px var(--gut) 0}
.nav{
  max-width:var(--wrap); margin-inline:auto;
  display:flex; align-items:center; gap:24px;
  background:#000000; backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border:1px solid var(--line); border-radius:var(--r-nav);
  padding:19px 18px;
}
.nav__brand{display:flex; align-items:center; flex:0 0 auto}
.nav__links{display:flex; gap:clamp(14px,2.4vw,32px); margin-inline:auto}
.nav__links a{
  font-family:var(--f-util); font-size:12.5px; font-weight:500;
  letter-spacing:.20em; text-transform:uppercase; color:var(--ink-2);
  position:relative; padding-block:4px; transition:color .25s;
}
.nav__links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--red); transition:right .32s cubic-bezier(.4,0,.2,1);
}
.nav__links a:hover{color:var(--white)}
.nav__links a:hover::after{right:0}
.nav__social{display:flex; gap:13px; flex:0 0 auto}
.nav__social a{color:var(--ink-3); transition:color .25s, transform .25s}
.nav__social a:hover{color:var(--white); transform:translateY(-2px)}
.nav__social svg{width:16.5px; height:16.5px; display:block}

/* ============================================================
   HERO
   ============================================================ */
.hero{position:relative; min-height:clamp(560px, 84vh, 760px); display:flex; align-items:center;
  padding-top:86px;
  overflow:hidden; background:#101010 url("hero-bg.png") center/cover no-repeat}
.hero__bg{position:absolute; inset:0; overflow:hidden; pointer-events:none}
/* light beams sit on top of the artwork, lifting the same two diagonals */
.beam{position:absolute; border-radius:50%; filter:blur(70px)}
.beam--a{
  width:78%; height:52%; left:-6%; top:-14%;
  background:radial-gradient(ellipse at center, rgba(255,255,255,.10), rgba(255,255,255,0) 68%);
  transform:rotate(-17deg);
}
.beam--b{
  width:92%; height:44%; right:-16%; bottom:-16%;
  background:radial-gradient(ellipse at center, rgba(255,255,255,.08), rgba(255,255,255,0) 66%);
  transform:rotate(-13deg);
}
.hero__vig{position:absolute; inset:0;
  background:radial-gradient(ellipse 100% 90% at 50% 45%, transparent 45%, rgba(0,0,0,.45) 100%)}

.hero__grid{
  position:relative; z-index:2; width:100%; max-width:var(--wrap); margin-inline:auto;
  padding-inline:var(--gut);
  display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1fr);
  gap:clamp(28px,4.6vw,62px); align-items:center;
}
.hero__art{display:flex; justify-content:flex-end}
/* dot-matrix figure — density, not photography (per the reference system) */
.dotfield{width:100%; aspect-ratio:1024/1107; max-width:330px; opacity:.62; object-fit:contain}

.hero__copy h1{
  font-family:var(--f-display); font-size:var(--t-h1); font-weight:700;
  line-height:1.02; letter-spacing:-.035em; color:var(--white);
}
.hero__copy h1 em{font-style:normal; color:var(--red)}
.hero__copy .lead{margin-top:22px; max-width:48ch; color:var(--ink-2); font-size:var(--t-body)}

/* outlined red button — the only button shape in the system */
.btn{
  display:inline-flex; align-items:center; gap:9px; margin-top:30px;
  font-family:var(--f-util); font-size:var(--t-label); font-weight:500;
  letter-spacing:.16em; text-transform:none;
  color:var(--red); border:1px solid var(--red); border-radius:var(--r-btn);
  padding:11px 26px; position:relative; overflow:hidden; isolation:isolate;
  transition:color .3s;
}
.btn::before{
  content:""; position:absolute; inset:0; z-index:-1; background:var(--red);
  transform:scaleY(0); transform-origin:bottom; transition:transform .34s cubic-bezier(.4,0,.2,1);
}
.btn:hover{color:var(--white)}
.btn:hover::before{transform:scaleY(1)}
.btn .arw{transition:transform .3s}
.btn:hover .arw{transform:translateX(4px)}

/* white-outline variant */
.btn--ghost{color:var(--white); border-color:rgba(255,255,255,.6)}
.btn--ghost::before{background:var(--white)}
.btn--ghost:hover{color:#000; border-color:var(--white)}

.hero__cta{display:flex; flex-wrap:wrap; gap:14px; margin-top:30px}
.hero__cta .btn{margin-top:0}
.hero__cta-m{display:none}

/* ============================================================
   MARQUEE — the one warm typographic moment
   ============================================================ */
.ticker{
  border-block:1px solid var(--line); background:var(--pitch);
  overflow:hidden; padding-block:20px; position:relative;
}
.ticker::before,.ticker::after{
  content:""; position:absolute; top:0; bottom:0; width:clamp(60px,12vw,180px); z-index:3; pointer-events:none;
}
.ticker::before{left:0; background:linear-gradient(90deg, var(--pitch), transparent)}
.ticker::after{right:0; background:linear-gradient(270deg, var(--pitch), transparent)}
.ticker__track{display:flex; width:max-content; animation:slide 42s linear infinite}
.ticker__set{display:flex; align-items:center; flex:0 0 auto}
.ticker__item{
  font-size:15px; color:var(--ink-3); padding-inline:clamp(20px,3vw,44px);
  white-space:nowrap; letter-spacing:.01em;
}
.ticker__item--alt{font-family:var(--f-accent); font-style:italic; color:var(--ink-2); font-size:16px}
.ticker__dot{width:3px; height:3px; border-radius:50%; background:var(--char); flex:0 0 auto}
@keyframes slide{to{transform:translateX(-50%)}}
.ticker:hover .ticker__track{animation-play-state:paused}

/* ============================================================
   ABOUT
   ============================================================ */
.about{display:grid; grid-template-columns:minmax(0,.42fr) minmax(0,1fr); gap:clamp(30px,6vw,72px); align-items:start}
.about__figure{
  border:1px solid var(--line); border-radius:var(--r-img); overflow:hidden;
  aspect-ratio:1/1.12; position:relative; background:var(--card);
}
.about__figure svg{position:absolute; inset:0; width:100%; height:100%}
.about__body p + p{margin-top:14px}
.about__name{color:var(--ink); font-weight:500}
.about__body .lead{color:var(--ink-2)}
.about__quote{font-family:var(--f-accent); font-style:italic; color:var(--taupe)}
.about__social{display:flex; gap:16px; margin-top:34px}
.about__social a{color:var(--ink-3); transition:color .25s, transform .25s}
.about__social a:hover{color:var(--white); transform:translateY(-2px)}
.about__social svg{width:17px; height:17px; display:block}

/* ============================================================
   WAYS I WORK — tabbed, numbered because it IS an ordered list of roles
   ============================================================ */
.ways{display:grid; grid-template-columns:minmax(0,.24fr) minmax(0,1fr); gap:clamp(28px,5vw,64px); margin-top:52px}
.ways__tabs{display:flex; flex-direction:column; border-left:1px solid var(--line)}
.ways__tab{
  text-align:left; padding:14px 0 14px 22px; position:relative;
  font-size:var(--t-small); font-weight:500; color:var(--ink-3);
  transition:color .28s; line-height:1.3;
}
.ways__tab::before{
  content:""; position:absolute; left:-1px; top:0; bottom:0; width:2px;
  background:var(--red); transform:scaleY(0); transform-origin:center;
  transition:transform .34s cubic-bezier(.4,0,.2,1);
}
.ways__tab:hover{color:var(--ink-2)}
.ways__tab[aria-selected="true"]{color:var(--white)}
.ways__tab[aria-selected="true"]::before{transform:scaleY(1)}

.ways__panel[hidden]{display:none}
.ways__panel h3{
  font-family:var(--f-display); font-size:var(--t-h3); font-weight:600;
  color:var(--white); letter-spacing:-.012em; margin-bottom:16px;
}
.ways__panel h3 .num{color:var(--taupe); font-variant-numeric:tabular-nums}
.ways__note{
  font-family:var(--f-util); font-size:var(--t-label); letter-spacing:.16em;
  text-transform:uppercase; color:var(--ink-4); margin:34px 0 18px;
}
.ways__list{display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr)); gap:2px 40px}
.ways__list li{
  font-size:var(--t-small); color:var(--ink-2); padding:6px 0 6px 18px; position:relative;
}
.ways__list li::before{
  content:""; position:absolute; left:0; top:15px; width:5px; height:1px; background:var(--taupe);
}
.ways__close{
  margin-top:32px; padding-top:26px; border-top:1px solid var(--line);
  color:var(--ink-3); font-size:var(--t-small); max-width:64ch;
}

/* ============================================================
   PROJECT CARDS
   ============================================================ */
.grid-3{display:grid; grid-template-columns:repeat(auto-fill, minmax(280px,1fr)); gap:22px; margin-top:44px}
.pcard{
  background:var(--card); border:1px solid var(--line); border-radius:var(--r-card);
  overflow:hidden; display:flex; flex-direction:column;
  transition:border-color .32s, background .32s, transform .32s;
}
.pcard:hover{border-color:#2b2b2b; background:var(--card-hi); transform:translateY(-3px)}
.pcard__vis{aspect-ratio:16/10; position:relative; overflow:hidden; border-bottom:1px solid var(--line)}
.pcard__meta{padding:16px 18px 18px}
.pcard__title{font-size:var(--t-small); font-weight:500; color:var(--ink); letter-spacing:.005em}
.pcard__desc{font-size:12.5px; color:var(--ink-3); line-height:1.62; margin-top:6px}
.pcard__tag{
  display:block; margin-top:14px; font-family:var(--f-util); font-size:var(--t-micro);
  letter-spacing:.22em; text-transform:uppercase; color:var(--ink-4);
}

/* miniature site previews, drawn in CSS — placeholders until real captures land */
.mini{position:absolute; inset:0; padding:16px 18px; display:flex; flex-direction:column; justify-content:flex-end}
.mini--krz{background:#0d0d0f}
.mini--krz .h{font-family:var(--f-display); font-weight:700; font-size:clamp(15px,2.2vw,21px);
  line-height:1.02; letter-spacing:-.03em; color:#fff}
.mini--krz .cmyk{position:absolute; right:14px; top:50%; transform:translateY(-40%); display:flex}
.mini--krz .cmyk i{width:30px; height:30px; border-radius:50%; margin-left:-11px; mix-blend-mode:screen; display:block}
.mini--roof{background:linear-gradient(160deg,#241a17,#0d0a09)}
.mini--roof .h{font-family:var(--f-display); font-weight:700; font-size:clamp(15px,2.1vw,20px);
  letter-spacing:.06em; color:#fff}
.mini--roof .h em{font-style:normal; color:var(--red)}
.mini--roof .bar{width:74px; height:6px; background:var(--red); border-radius:2px; margin-top:10px}
.mini--spa{background:#efe7dc; justify-content:center; align-items:flex-start}
.mini--spa .h{font-family:var(--f-accent); font-style:italic; font-size:clamp(14px,2vw,19px);
  color:#3b332c; line-height:1.25; max-width:64%}
.mini--spa .swatch{position:absolute; right:0; top:0; bottom:0; width:32%;
  background:linear-gradient(180deg,#c9b9a4,#8d7a66)}
.mini--power{background:linear-gradient(120deg,#0a1410,#050807)}
.mini--power .h{font-family:var(--f-display); font-weight:700; font-size:clamp(15px,2.2vw,21px);
  line-height:1.05; letter-spacing:-.02em; color:#fff}
.mini--power .h em{font-style:normal; color:var(--slate)}

/* open slot — honest placeholder, doubles as an invitation */
.pcard--slot{background:transparent; border-style:dashed; border-color:#242424}
.pcard--slot:hover{border-color:var(--taupe); background:rgba(154,129,116,.04)}
.pcard--slot .pcard__vis{
  border-bottom:1px dashed #242424; display:grid; place-items:center; text-align:center;
}
.slot-label{font-family:var(--f-util); font-size:var(--t-micro); letter-spacing:.24em;
  text-transform:uppercase; color:var(--ink-4)}
.slot-sub{font-size:12px; color:#3a3a3a; margin-top:8px}

/* ============================================================
   NFC RAIL
   ============================================================ */
.nfc__intro{margin-top:26px}
.nfc__intro h4{font-size:var(--t-small); font-weight:500; color:var(--ink)}
.rail{
  display:flex; gap:18px; margin-top:38px; overflow-x:auto; padding-bottom:16px;
  scrollbar-width:thin; scrollbar-color:var(--char) transparent;
  /* free scroll — no snap. momentum preserved on touch. */
  -webkit-overflow-scrolling:touch;
  cursor:grab;
}
.rail.is-dragging{cursor:grabbing; scroll-behavior:auto; user-select:none}
.rail.is-dragging a{pointer-events:none}
.rail::-webkit-scrollbar{height:2px}
.rail::-webkit-scrollbar-thumb{background:var(--char)}
.rail::-webkit-scrollbar-track{background:var(--line)}
.ncard{
  flex:0 0 clamp(180px, 20vw, 216px);
  border:1px solid var(--line); border-radius:var(--r-card); overflow:hidden;
  background:var(--card); transition:border-color .3s, transform .3s;
}
.ncard:hover{border-color:#2b2b2b; transform:translateY(-3px)}
.ncard__vis{aspect-ratio:1/1; display:grid; place-items:center; border-bottom:1px solid var(--line)}
.ncard__vis svg{width:44%; height:44%; stroke:var(--taupe); fill:none; stroke-width:1.25}
.ncard--slate .ncard__vis svg{stroke:var(--slate)}
.ncard__meta{padding:13px 15px 15px}
.ncard__title{font-size:12.5px; color:var(--ink-2); font-weight:500}
.ncard__cta{display:block; margin-top:7px; font-family:var(--f-util); font-size:9px;
  letter-spacing:.26em; text-transform:uppercase; color:var(--ink-4)}
.ncard--slot{border-style:dashed; border-color:#242424; background:transparent}
.ncard--slot .ncard__vis{border-bottom-style:dashed; border-bottom-color:#242424}


/* ============================================================
   NFC DETAIL MODAL
   ============================================================ */
.ncard{text-align:left; font:inherit; color:inherit; display:block; padding:0; cursor:pointer}
.ncard:hover .ncard__cta{color:var(--taupe)}

.modal{position:fixed; inset:0; z-index:95; display:none; padding:clamp(12px,3vw,40px)}
.modal[data-open="true"]{display:grid; place-items:center}
.modal__scrim{
  position:absolute; inset:0; background:rgba(0,0,0,.78);
  backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
  opacity:0; transition:opacity .3s ease;
}
.modal[data-open="true"] .modal__scrim{opacity:1}
.modal__panel{
  position:relative; width:min(1140px,100%);
  max-height:calc(100dvh - 2*clamp(12px,3vw,40px));
  overflow-y:auto; overscroll-behavior:contain;
  background:var(--sheet); border:1px solid #262626; border-radius:20px;
  padding:clamp(20px,3.4vw,42px);
  opacity:0; transform:translateY(14px) scale(.985);
  transition:opacity .32s ease, transform .38s cubic-bezier(.2,.7,.3,1);
}
.modal[data-open="true"] .modal__panel{opacity:1; transform:none}
.modal__close{
  position:absolute; top:clamp(14px,2vw,24px); right:clamp(14px,2vw,24px); z-index:4;
  width:38px; height:38px; display:grid; place-items:center; color:var(--white);
  transition:transform .3s, color .25s;
}
.modal__close:hover{transform:rotate(90deg); color:var(--red)}
.modal__close svg{width:21px; height:21px}

.modal__grid{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(26px,4vw,58px); align-items:start}

.gal__hero{aspect-ratio:1/1; border-radius:13px; overflow:hidden; border:1px solid #2a2a2a; position:relative}
.gal__hero img{width:100%; height:100%; object-fit:cover; display:block}
.gal__thumbs{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:12px}
.gal__thumbs[hidden]{display:none}
.gal__thumb{
  aspect-ratio:1/1; border-radius:11px; overflow:hidden; border:1px solid #2a2a2a;
  padding:0; cursor:pointer; position:relative; opacity:.7;
  transition:border-color .25s, opacity .25s;
}
.gal__thumb:hover,.gal__thumb[aria-current="true"]{opacity:1; border-color:var(--taupe)}
.gal__thumb img{width:100%; height:100%; object-fit:cover; display:block}

/* placeholder fills — disappear automatically once images[] is filled */
.ph{position:absolute; inset:0}
.ph--1{background:linear-gradient(150deg,#2a221b,#120e0b)}
.ph--2{background:linear-gradient(150deg,#1d2429,#0b0e10)}
.ph--3{background:linear-gradient(150deg,#2b2119,#131009)}
.ph--4{background:linear-gradient(150deg,#241a1c,#100b0c)}
.ph::after{
  content:attr(data-ph); position:absolute; inset:0; display:grid; place-items:center;
  font-family:var(--f-util); font-size:9px; letter-spacing:.24em; text-transform:uppercase;
  color:rgba(255,255,255,.20);
}

.modal__body{padding-top:clamp(0px,1vw,14px)}
.modal__title{
  font-family:var(--f-display); font-weight:700; letter-spacing:-.03em; line-height:1.02;
  font-size:clamp(27px,3.4vw,44px); color:var(--white); margin-bottom:22px;
}
.modal__body p{
  font-family:var(--f-accent); font-size:clamp(14px,1.15vw,16.5px); line-height:1.62;
  color:var(--ink-2); max-width:52ch;
}
.modal__body p + p{margin-top:19px}
.btn-pill{
  display:inline-block; margin-top:clamp(28px,4vw,54px);
  font-family:var(--f-accent); font-size:15.5px; color:#111;
  background:var(--white); border-radius:999px; padding:14px 36px;
  transition:background .25s, transform .25s;
}
.btn-pill:hover{background:var(--taupe); transform:translateY(-2px)}

@media (max-width:840px){
  .modal__grid{grid-template-columns:1fr; gap:26px}
  .modal__panel{border-radius:16px}
  .modal__body{padding-top:0}
  .modal__title{margin-bottom:16px}
  .btn-pill{display:block; text-align:center; margin-top:30px}
}

/* ============================================================
   PERSONAL PROJECTS — the section that breaks voice on purpose
   ============================================================ */
.personal .rule-head h2{font-family:var(--f-accent); font-style:italic; font-weight:500; letter-spacing:-.01em}
.personal .sub{color:var(--slate)}
.mason{columns:3; column-gap:16px; margin-top:44px}
.mason figure{margin:0 0 16px; break-inside:avoid; border-radius:var(--r-img); overflow:hidden;
  border:1px solid var(--line); position:relative}
.tile{width:100%; display:block}

/* project title, sat on a gradient scrim at the foot of each tile */
.mason figcaption{
  position:absolute; inset-inline:0; bottom:0; z-index:1; pointer-events:none;
  padding:44px 14px 12px;
  font-family:var(--f-util); font-size:var(--t-label); font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--white);
  background:linear-gradient(to top,
    rgba(0,0,0,.86) 0%, rgba(0,0,0,.62) 38%, rgba(0,0,0,.22) 70%, rgba(0,0,0,0) 100%);
}
.tile--a{aspect-ratio:4/3;  background:linear-gradient(150deg,#1d1a17,#0a0908)}
.tile--b{aspect-ratio:3/5;  background:linear-gradient(150deg,#12171b,#070809)}
.tile--c{aspect-ratio:4/3;  background:linear-gradient(150deg,#191512,#0a0908)}
.tile--d{aspect-ratio:4/3;  background:linear-gradient(150deg,#1b1214,#090707)}
.tile--e{aspect-ratio:16/10;background:linear-gradient(150deg,#141a1e,#070809)}
.tile--f{aspect-ratio:5/4;  background:linear-gradient(150deg,#17140f,#090807)}

/* ============================================================
   FOOTER
   ============================================================ */
.footer{position:relative; overflow:hidden; background:var(--pitch);
  border-top:1px dashed #1c1c1c; text-align:center; padding-block:clamp(60px,8vw,96px)}
.footer .beam--f{
  position:absolute; width:120%; height:70%; left:-10%; bottom:-40%;
  background:radial-gradient(ellipse at center, rgba(255,255,255,.09), transparent 68%);
  filter:blur(60px); pointer-events:none;
}
.footer__in{position:relative; z-index:2}
.footer__mail{
  display:inline-block; margin-top:26px; font-size:var(--t-small); color:var(--ink-2);
  border-bottom:1px solid var(--red); padding-bottom:3px; transition:color .25s;
}
.footer__mail:hover{color:var(--white)}
.footer__fine{margin-top:22px; font-size:12px; color:var(--ink-4); line-height:1.9}

/* ============================================================
   SCROLL REVEAL
   ============================================================ */
.rise{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1)}
.rise.in{opacity:1; transform:none}


/* ============================================================
   MOBILE — BURGER + DRAWER
   ============================================================ */
.burger{
  display:none; flex-direction:column; align-items:flex-start; gap:5px;
  padding:8px 2px; margin-left:auto; flex:0 0 auto;
}
.burger span{
  display:block; height:2px; background:var(--white); border-radius:2px;
  transition:width .3s cubic-bezier(.4,0,.2,1), transform .3s, opacity .2s;
}
.burger span:nth-child(1){width:26px}
.burger span:nth-child(2){width:16px}
.burger span:nth-child(3){width:21px}
.burger:hover span:nth-child(2){width:26px}
.burger:hover span:nth-child(3){width:26px}

.drawer{
  position:fixed; inset:0; z-index:90; display:none;
  padding:clamp(12px,3vw,22px);
}
.drawer[data-open="true"]{display:block}
.drawer__scrim{
  position:absolute; inset:0; background:rgba(0,0,0,.72);
  backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
  opacity:0; transition:opacity .34s ease;
}
.drawer[data-open="true"] .drawer__scrim{opacity:1}
.drawer__panel{
  position:relative; height:100%; overflow-y:auto; overscroll-behavior:contain;
  background:var(--drawer); border-radius:18px;
  padding:22px clamp(22px,7vw,34px) 46px;
  transform:translateY(-14px); opacity:0;
  transition:transform .38s cubic-bezier(.2,.7,.3,1), opacity .3s ease;
}
.drawer[data-open="true"] .drawer__panel{transform:none; opacity:1}

.drawer__top{display:flex; align-items:center; justify-content:space-between; margin-bottom:38px}
.drawer__top .mark{margin-inline:auto}
.drawer__close{
  width:40px; height:40px; display:grid; place-items:center; color:var(--white);
  flex:0 0 auto; transition:transform .3s, color .25s;
}
.drawer__close:hover{transform:rotate(90deg); color:var(--red)}
.drawer__close svg{width:24px; height:24px}
.drawer__spacer{width:40px; flex:0 0 auto}

.drawer__eyebrow{
  font-family:var(--f-util); font-size:12px; font-weight:500; letter-spacing:.10em;
  color:var(--ink-3); display:block; margin-bottom:20px;
}
.drawer__eyebrow::before{content:"--- "}

.drawer__nav{margin-bottom:44px}
.drawer__row{border:0}
.drawer__link{
  display:flex; align-items:center; gap:10px; width:100%;
  font-family:var(--f-accent); font-weight:600; font-size:clamp(18px,4.4vw,21px);
  line-height:1.45; padding-block:7px; color:var(--white); text-align:left;
  letter-spacing:-.005em; transition:color .25s;
}
.drawer__link:hover{color:var(--taupe)}

.drawer__social{display:flex; gap:20px; margin-bottom:40px}
.drawer__social a{color:var(--white); transition:color .25s, transform .25s}
.drawer__social a:hover{color:var(--taupe); transform:translateY(-2px)}
.drawer__social svg{width:22px; height:22px; display:block}

.drawer__mail{
  font-family:var(--f-accent); font-weight:500; font-size:clamp(15px,3.8vw,17px);
  color:var(--white); word-break:break-all; transition:color .25s;
}
.drawer__mail:hover{color:var(--taupe)}

body[data-locked="true"]{overflow:hidden}

@media (max-width:940px){
  .burger{display:flex}
  .nav{background:#000; border-radius:16px; padding:14px 20px}
  /* social lives inside the drawer at this size — the bar stays logo + burger only */
  .nav__social{display:none}
}
@media (min-width:941px){
  .drawer{display:none !important}
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:940px){
  .hero__grid{grid-template-columns:1fr}
  .hero__art{order:1; justify-self:center; justify-content:center; opacity:.45; margin-bottom:26px}
  .hero__copy{order:2; padding-bottom:44px}
  .hero__cta-m{display:inline-flex}
  .about{grid-template-columns:1fr}
  /* photo drops below the copy and socials on mobile (same order swap as the hero) */
  .about__body{order:1}
  .about__figure{order:2; max-width:230px; aspect-ratio:1/1; margin-top:38px}
  .ways{grid-template-columns:1fr}
  .ways__tabs{
    flex-direction:row; border-left:0; border-bottom:1px solid var(--line);
    overflow-x:auto; gap:clamp(26px,7vw,40px); scrollbar-width:none;
  }
  .ways__tabs::-webkit-scrollbar{display:none}
  .ways__tab{padding:10px 0 14px; white-space:nowrap; flex:0 0 auto}
  .ways__tab::before{left:0; right:auto; top:auto; bottom:-1px; width:100%; height:2px;
    transform:scaleX(0); transform-origin:left}
  .ways__tab[aria-selected="true"]::before{transform:scaleX(1)}
  .mason{columns:2}
  .nav__links{display:none}
  .nav__brand{margin-right:auto}
}
@media (max-width:560px){
  .mason{columns:1}
  .rule-head{flex-wrap:wrap; gap:14px}
  .rule-head .rule{order:3; width:100%; flex-basis:100%}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important}
  .rise{opacity:1; transform:none}
}

/* ============================================================
   BACK TO TOP
   ============================================================ */
/* Pages carrying the Calendly badge: lift the back-to-top button clear of it.
   Both are fixed bottom-right, and Calendly sits on a much higher z-index. */
.has-calendly .totop{bottom:calc(clamp(16px,3vw,30px) + 62px)}
@media (max-width:620px){ .has-calendly .totop{bottom:calc(clamp(16px,3vw,30px) + 76px)} }

.totop{
  position:fixed; right:clamp(16px,3vw,30px); bottom:clamp(16px,3vw,30px); z-index:75;
  width:46px; height:46px; display:grid; place-items:center;
  background:rgba(0,0,0,.72); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border:1px solid var(--line); border-radius:var(--r-btn);
  color:var(--ink-2); cursor:pointer;
  opacity:0; transform:translateY(10px); pointer-events:none;
  transition:opacity .3s, transform .3s, color .25s, border-color .25s, background .25s;
}
.totop[data-show="true"]{opacity:1; transform:none; pointer-events:auto}
.totop:hover{color:var(--white); border-color:var(--red); background:#000}
.totop svg{width:17px; height:17px; display:block}