:root{
  --paper:#ECE7DB;        /* warm cream ground */
  --paper-tint:#E3DDCD;   /* deeper warm tint for alt sections */
  --ink:#17180F;
  --ink-soft:#59544A;     /* warm grey */
  --line:#D2CCBB;         /* warm hairline */
  --accent:#1E37C4;
  --accent-soft:#7f8bff;
  --teal:#3E9C93;
  --dark:#14150E;

  --serif:"Fraunces", Georgia, serif;
  --sans:"IBM Plex Sans", system-ui, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, monospace;

  --gutter:clamp(18px, 4vw, 56px);
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:84px; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); font-size:clamp(15px,1vw,17px); line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
body.menu-open{ overflow:hidden; }
a{ color:inherit; text-decoration:none; }
::selection{ background:var(--accent); color:#fff; }
[id]{ scroll-margin-top:92px; }

.wrap{ padding-inline:var(--gutter); }
.mono{ font-family:var(--mono); letter-spacing:0.1em; text-transform:uppercase; }

/* ---------- Custom cursor ---------- */
.cursor{
  position:fixed; top:0; left:0; z-index:200; pointer-events:none;
  width:14px; height:14px; border-radius:50%; background:var(--teal);
  transform:translate(-50%,-50%); mix-blend-mode:normal;
  opacity:0;
  transition:width .22s ease, height .22s ease, background-color .22s ease, opacity .2s ease;
  will-change:transform;
}
.cursor.on{ opacity:1; }
.cursor.big{ width:52px; height:52px; background:color-mix(in srgb, var(--teal) 26%, transparent); }
@media (hover: none), (pointer: coarse){ .cursor{ display:none; } }
/* When the custom dot is active (fine pointer + JS), hide the native cursor so there is only one */
html.cursor-custom, html.cursor-custom *{ cursor:none !important; }

/* ---------- Top bar ---------- */
.topbar{
  position:fixed; top:0; left:0; right:0; z-index:80;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px var(--gutter);
  mix-blend-mode:normal;
}
.monogram{ display:inline-flex; align-items:center; gap:9px; font-family:var(--mono); font-size:12px; letter-spacing:0.08em; }
.monogram svg{ width:26px; height:26px; }
/* RMY disc logo, recoloured from a single alpha mask */
.brand-logo{
  display:block; width:30px; height:30px; flex:none;
  background-color:var(--accent);
  -webkit-mask:url("/newsite/assets/logo-mask.png") center / contain no-repeat;
  mask:url("/newsite/assets/logo-mask.png") center / contain no-repeat;
}
.menu .brand-logo{ background-color:var(--paper); }
.topbar .est{ font-family:var(--mono); font-size:11px; letter-spacing:0.22em; color:var(--ink-soft); }
.menu-btn{
  display:inline-flex; flex-direction:column; gap:5px; align-items:flex-end;
  background:none; border:0; cursor:pointer; padding:6px 0;
}
.menu-btn span{ display:block; height:1.5px; width:26px; background:var(--ink); transition:transform .3s ease, width .3s ease; }
.menu-btn span:nth-child(2){ width:18px; }
@media (max-width:640px){ .topbar .est{ display:none; } }

/* ---------- Hero (home) ---------- */
.hero{ padding:clamp(94px,13vw,150px) var(--gutter) clamp(18px,2.5vw,28px); }
.hero-mark{ position:relative; max-width:1600px; }   /* stop the wordmark ballooning on wide screens */
.hero-mark svg{ display:block; width:100%; height:auto; overflow:visible; }
.hero-mark .glyph{ font-family:var(--serif); font-weight:900; font-size:100px; fill:var(--accent);
  font-variation-settings:"opsz" 144, "SOFT" 0, "WONK" 1; }
.hero-row{ display:flex; justify-content:space-between; align-items:flex-end; gap:clamp(20px,4vw,48px); flex-wrap:wrap; margin-top:clamp(20px,2.6vw,32px); }
.hero-lead{ max-width:46ch; margin:0; font-size:clamp(17px,1.6vw,21px); line-height:1.45; color:var(--ink); }
.hero-lead u{ text-decoration:none; border-bottom:1.5px solid var(--accent); padding-bottom:1px; }
.about-pill{
  display:inline-block; flex:none; padding:11px 26px; border:1.5px solid var(--accent);
  border-radius:40px; font-family:var(--mono); font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--accent); transition:background-color .25s ease, color .25s ease;
}
.about-pill:hover{ background:var(--accent); color:#fff; }

/* hero image band, blue-scale */
.hero-figure{ margin:0; padding:0 0 clamp(24px,3vw,40px); }   /* full-bleed image, edge to edge */
.hero-img-wrap{ position:relative; background:var(--accent); overflow:hidden; }
.hero-img{ display:block; width:100%; height:clamp(300px,46vh,500px); object-fit:cover; object-position:center 50%;
  filter:grayscale(1) contrast(1.04) brightness(1.06); mix-blend-mode:luminosity; }
.hero-img-wrap::after{ content:""; position:absolute; inset:0; pointer-events:none;
  background:url("/newsite/assets/grain.png") repeat; background-size:220px 220px; opacity:.16; mix-blend-mode:overlay; }
.hero-cap{ display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap;
  padding:14px var(--gutter) 0; font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-soft); }
@media (max-width:640px){ .hero-cap .fr{ display:none; } }

.hero-foot{
  display:flex; justify-content:space-between; align-items:flex-end; gap:16px;
  padding:clamp(28px,5vw,52px) 0 26px; font-family:var(--mono); font-size:11px;
  letter-spacing:0.12em; text-transform:uppercase; color:var(--ink-soft); flex-wrap:wrap;
}
.hero-foot b{ color:var(--ink); font-weight:400; }
.scroll-cue{ display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; flex:1; }
.scroll-cue .arc{ width:40px; height:20px; border:1px solid var(--line); border-bottom:0; border-radius:40px 40px 0 0; position:relative; }
.scroll-cue .arrow{ font-size:14px; color:var(--accent); animation:bob 2s ease-in-out infinite; }
@keyframes bob{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(4px);} }
@media (prefers-reduced-motion: reduce){ .scroll-cue .arrow{ animation:none; } }
@media (max-width:640px){ .hero-foot .fr{ display:none; } }

/* ---------- Ticker ---------- */
.ticker{ border-block:1px solid var(--line); overflow:hidden; white-space:nowrap; padding-block:12px; background:var(--paper-tint); }
.ticker-track{ display:inline-flex; animation:tick 40s linear infinite; }
.ticker span{ font-family:var(--mono); font-size:12px; letter-spacing:0.14em; text-transform:uppercase; color:var(--ink-soft); padding-right:16px; }
.ticker b{ color:var(--accent); font-weight:400; padding-right:16px; }
@keyframes tick{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }
@media (prefers-reduced-motion: reduce){ .ticker-track{ animation:none; } }

/* ---------- Work list (home teaser + reusable rows) ---------- */
.work{ padding:clamp(60px,9vw,120px) 0 clamp(30px,5vw,60px); }
.work-head{ display:flex; justify-content:space-between; align-items:baseline; padding-inline:var(--gutter); margin-bottom:8px; }
.work-head .lbl{ font-family:var(--mono); font-size:12px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-soft); }
.work-head .see{ font-family:var(--mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); }

.work-list{ border-top:1px solid var(--line); }
.row{
  position:relative; display:block; border-bottom:1px solid var(--line);
  overflow:hidden; isolation:isolate;
}
.row-inner{
  position:relative; z-index:2; display:grid;
  grid-template-columns:auto 1fr auto; align-items:center; gap:20px;
  padding:clamp(16px,2.4vw,26px) var(--gutter);
  transition:color .35s ease;
}
.row-num{ font-family:var(--mono); font-size:12px; color:var(--ink-soft); transition:color .35s ease; align-self:start; padding-top:10px; }
.row-title{
  font-family:var(--serif); font-weight:500; font-variation-settings:"opsz" 90,"WONK" 1;
  font-size:clamp(30px,6vw,74px); line-height:1.02; letter-spacing:-0.01em; color:var(--ink);
  transition:color .35s ease, transform .5s cubic-bezier(.16,.84,.3,1);
}
.row-meta{ text-align:right; font-family:var(--mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); line-height:1.7; transition:color .35s ease; }
.row-meta b{ color:var(--ink); font-weight:400; display:block; transition:color .35s ease; }

/* media reveal behind the row */
.row-media{
  position:absolute; inset:0; z-index:1; overflow:hidden;
  background:var(--accent);
  clip-path:inset(0 0 100% 0);
  transition:clip-path .55s cubic-bezier(.16,.84,.3,1);
}
.row-media img, .row-media video{
  width:100%; height:100%; object-fit:cover; object-position:center 40%;
  filter:grayscale(1) contrast(1.05) brightness(1.03);
  mix-blend-mode:luminosity; opacity:.92;
  transform:scale(1.06); transition:transform .8s cubic-bezier(.16,.84,.3,1);
}
.row:hover .row-media, .row:focus-visible .row-media{ clip-path:inset(0 0 0 0); }
.row:hover .row-media img, .row:hover .row-media video{ transform:scale(1); }
.row:hover .row-inner, .row:focus-visible .row-inner{ color:var(--paper); }
.row:hover .row-title{ color:var(--paper); transform:translateX(12px); }
.row:hover .row-num, .row:hover .row-meta, .row:hover .row-meta b{ color:var(--paper); }
.row:focus-visible{ outline:2px solid var(--accent); outline-offset:-2px; }
@media (prefers-reduced-motion: reduce){
  .row-media{ transition:none; } .row-title{ transition:color .2s; }
  .row:hover .row-title{ transform:none; }
  .row-media img, .row-media video{ transition:none; transform:none; }
}

/* ---------- Pillars ---------- */
.pillars{ padding:clamp(70px,10vw,140px) 0; background:var(--paper-tint); border-top:1px solid var(--line); }
.pillars-head{
  padding-inline:var(--gutter);
  font-family:var(--serif); font-weight:400; font-variation-settings:"opsz" 144,"WONK" 1;
  font-size:clamp(30px,6.5vw,86px); line-height:1.04; letter-spacing:-0.015em; color:var(--ink);
  display:flex; flex-wrap:wrap; align-items:baseline; gap:0 clamp(14px,2vw,26px); margin:0;
}
.pillars-head .ab{ font-family:var(--mono); font-size:0.26em; letter-spacing:0.06em; color:var(--accent); text-transform:uppercase; align-self:center; }
.pillars-head .sl{ color:var(--line); font-weight:400; }
.pillars-head em{ font-style:italic; }
.pillars-body{
  padding-inline:var(--gutter); margin-top:clamp(40px,6vw,72px);
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); gap:clamp(20px,4vw,60px); align-items:start;
}
.pillars-body h3{ font-family:var(--serif); font-weight:500; font-size:clamp(20px,2vw,26px); margin:0; letter-spacing:-0.01em; }
.pillars-rule{ height:1px; background:var(--line); margin-top:18px; }
.pillars-body p{ margin:0; font-size:clamp(16px,1.4vw,19px); line-height:1.6; color:var(--ink); max-width:52ch; }
.pillars-body .all{ display:inline-block; margin-top:22px; font-family:var(--mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); }
@media (max-width:720px){ .pillars-body{ grid-template-columns:1fr; gap:22px; } }

/* ============================================================
   INTERIOR PAGES
   ============================================================ */
.page{ padding-top:clamp(96px,12vw,132px); }

.page-head{ padding:0 var(--gutter) clamp(30px,4vw,48px); border-bottom:1px solid var(--line); }
.eyebrow{ font-family:var(--mono); font-size:12px; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-soft); display:flex; align-items:center; gap:12px; margin:0 0 clamp(20px,3vw,30px); }
.eyebrow::before{ content:""; width:26px; height:1px; background:var(--accent); flex:none; }
.page-title{ font-family:var(--serif); font-weight:400; font-variation-settings:"opsz" 144,"WONK" 1; font-size:clamp(40px,9vw,118px); line-height:0.98; letter-spacing:-0.02em; margin:0; color:var(--ink); }
.page-title em{ font-style:italic; color:var(--accent); }
.lede{ font-family:var(--serif); font-weight:400; font-size:clamp(20px,2.4vw,30px); line-height:1.3; max-width:32ch; margin:clamp(22px,3vw,32px) 0 0; color:var(--ink); }
.lede u{ text-decoration:none; border-bottom:1.5px solid var(--accent); }

.prose{ padding:clamp(44px,6vw,84px) var(--gutter); }
.prose .col{ max-width:64ch; }
.prose p{ font-size:clamp(17px,1.5vw,21px); line-height:1.62; margin:0 0 1.1em; }
.prose p:last-child{ margin-bottom:0; }
.prose p u{ text-decoration:none; border-bottom:1.5px solid var(--accent); }
.prose h2{ font-family:var(--serif); font-weight:500; font-variation-settings:"opsz" 90,"WONK" 1; font-size:clamp(21px,2.2vw,28px); letter-spacing:-0.01em; margin:1.9em 0 0.5em; }
.prose h2:first-child{ margin-top:0; }
.prose h3{ font-family:var(--mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); margin:1.5em 0 0.4em; }
.prose ul{ margin:0 0 1.1em; padding-left:1.15em; }
.prose li{ font-size:clamp(16px,1.4vw,20px); line-height:1.6; margin:0 0 0.5em; padding-left:0.15em; }
.prose li ul{ margin:0.5em 0 0.6em; }
.prose strong{ font-weight:600; color:var(--ink); }
.prose a{ color:var(--accent); border-bottom:1px solid color-mix(in srgb, var(--accent) 40%, transparent); transition:border-color .2s; }
.prose a:hover{ border-color:var(--accent); }

/* facts grid */
.facts{ padding:0 var(--gutter) clamp(48px,6vw,84px); display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:1px; background:transparent; }
.facts-inner{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.fact{ background:var(--paper); padding:24px clamp(16px,2vw,24px); }
.fact .n{ font-family:var(--mono); font-size:clamp(20px,2vw,26px); color:var(--accent); display:block; margin-bottom:8px; }
.fact .l{ font-family:var(--mono); font-size:11.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); line-height:1.6; display:block; }

/* beliefs */
.beliefs{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.belief{ display:grid; grid-template-columns:minmax(160px,1fr) 2.4fr; gap:clamp(16px,4vw,52px); align-items:baseline; padding:clamp(24px,3vw,34px) var(--gutter); border-bottom:1px solid var(--line); }
.belief .t{ font-family:var(--mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--accent); }
.belief .d{ font-size:clamp(17px,1.5vw,21px); line-height:1.5; }
@media (max-width:620px){ .belief{ grid-template-columns:1fr; gap:8px; } }

/* project entries (archive / work detail) */
.entry{ border-top:1px solid var(--line); padding:clamp(40px,6vw,80px) 0; }
.entry-grid{ padding-inline:var(--gutter); display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:clamp(24px,4vw,64px); align-items:center; }
.entry:nth-child(even) .entry-media{ order:2; }
.entry-media{ overflow:hidden; aspect-ratio:4/3; background:var(--accent); border:1px solid var(--line); }
.entry-media img, .entry-media video{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .8s cubic-bezier(.16,.84,.3,1), filter .6s ease; }
.entry-media img, .entry-media video{ filter:grayscale(1) contrast(1.05) brightness(1.02); mix-blend-mode:luminosity; }  /* blue-scale duotone */
.entry:hover .entry-media img, .entry:hover .entry-media video{ transform:scale(1.04); filter:none; mix-blend-mode:normal; }  /* colour on hover */
.entry-lead .tag{ font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:14px; }
.entry-lead h2{ font-family:var(--serif); font-weight:500; font-variation-settings:"opsz" 90,"WONK" 1; font-size:clamp(26px,4vw,50px); line-height:1.04; letter-spacing:-0.012em; margin:0; }
.entry .tag{ font-family:var(--mono); font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:14px; }
.entry h2{ font-family:var(--serif); font-weight:500; font-variation-settings:"opsz" 90,"WONK" 1; font-size:clamp(26px,4vw,50px); line-height:1.04; letter-spacing:-0.012em; margin:0 0 16px; }
.entry p{ font-size:clamp(16px,1.4vw,19px); line-height:1.6; margin:0 0 14px; max-width:54ch; color:var(--ink); }
.entry p:last-child{ margin-bottom:0; }
.entry .credit{ font-family:var(--mono); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); }
.entry--text .entry-media{ display:none; }
.entry--text .entry-grid{ grid-template-columns:minmax(0,0.7fr) minmax(0,1.4fr); align-items:baseline; }
@media (prefers-reduced-motion: reduce){ .entry-media img, .entry:hover .entry-media img{ transition:none; transform:none; } }
@media (max-width:760px){ .entry-grid{ grid-template-columns:1fr !important; gap:20px; } .entry:nth-child(even) .entry-media{ order:0; } }

/* talks */
.talks{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.talk{ display:grid; grid-template-columns:minmax(160px,1fr) 2.3fr; gap:clamp(16px,4vw,52px); align-items:baseline; padding:clamp(24px,3vw,36px) var(--gutter); border-bottom:1px solid var(--line); }
.talk .t{ font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--accent); }
.talk .d{ font-family:var(--serif); font-size:clamp(20px,2.2vw,29px); line-height:1.2; letter-spacing:-0.01em; }
@media (max-width:620px){ .talk{ grid-template-columns:1fr; gap:8px; } }

/* pull quote */
.pullquote{ padding:clamp(48px,7vw,100px) var(--gutter); }
.pullquote p{ font-family:var(--serif); font-style:italic; font-weight:400; font-size:clamp(24px,3.4vw,44px); line-height:1.24; letter-spacing:-0.01em; max-width:26ch; margin:0 0 20px; }
.pullquote cite{ font-family:var(--mono); font-style:normal; font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--ink-soft); }

/* recognition */
.recog{ padding:clamp(44px,6vw,84px) var(--gutter); }
.recog-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:clamp(28px,3vw,40px); }
.recog-cell{ background:var(--paper); padding:22px 20px; }
.recog-cell .nm{ font-family:var(--serif); font-size:19px; display:block; margin-bottom:6px; line-height:1.2; }
.recog-cell .dt{ font-family:var(--mono); font-size:11px; letter-spacing:0.06em; text-transform:uppercase; color:var(--ink-soft); }
.recog--tint{ background:var(--paper-tint); }
.recog--tint .recog-cell{ background:var(--paper-tint); }

/* big contact block */
.contact-hero{ padding:clamp(50px,8vw,120px) var(--gutter); }
.contact-mail{ font-family:var(--serif); font-style:italic; font-size:clamp(28px,6vw,72px); color:var(--accent); border-bottom:2px solid var(--accent); line-height:1.1; display:inline-block; }
.contact-mail:hover{ color:var(--ink); border-color:var(--ink); }
.contact-list{ margin-top:clamp(40px,5vw,64px); display:flex; flex-wrap:wrap; gap:14px 40px; font-family:var(--mono); font-size:13px; letter-spacing:0.04em; text-transform:uppercase; }
.contact-list a{ color:var(--ink-soft); border-bottom:1px solid transparent; transition:color .2s, border-color .2s; }
.contact-list a:hover{ color:var(--accent); border-color:var(--accent); }
.contact-list .k{ color:var(--ink-soft); }

/* between-section band + generic section */
.band{ padding:clamp(48px,7vw,96px) 0; border-top:1px solid var(--line); }
.band--tint{ background:var(--paper-tint); }
.section-head{ padding:0 var(--gutter) clamp(24px,3vw,36px); }
.section-head .eyebrow{ margin-bottom:18px; }
.section-head h2{ font-family:var(--serif); font-weight:400; font-variation-settings:"opsz" 120,"WONK" 1; font-size:clamp(26px,4vw,52px); line-height:1.06; letter-spacing:-0.015em; margin:0; max-width:22ch; }

/* video / screencast */
.video-hero{ padding:clamp(16px,2.5vw,32px) var(--gutter) clamp(44px,6vw,80px); }
.video-hero video{ display:block; width:100%; max-width:1120px; height:auto; background:#0b0b0d; border:1px solid var(--line); }
.video-cap{ margin-top:16px; max-width:1120px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  font-family:var(--mono); font-size:11.5px; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); }
.video-cap a{ color:var(--accent); border-bottom:1px solid color-mix(in srgb, var(--accent) 40%, transparent); }

/* page nav */
.pagenav{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; padding:clamp(32px,4vw,52px) var(--gutter); border-top:1px solid var(--line); font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase; }
.pagenav a{ color:var(--accent); }
.pagenav a:hover{ color:var(--ink); }

/* ---------- Footer ---------- */
.foot{ background:var(--dark); color:var(--paper); padding:clamp(56px,8vw,110px) var(--gutter) 40px; }
.foot-cols{ display:grid; grid-template-columns:repeat(3,1fr) auto; gap:clamp(28px,4vw,56px); align-items:start; }
.foot h4{ font-family:var(--mono); font-size:11px; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent-soft); margin:0 0 20px; font-weight:500; border-bottom:1px solid rgba(243,244,241,0.18); padding-bottom:12px; }
.foot ul{ list-style:none; margin:0; padding:0; display:grid; gap:11px; }
.foot li a, .foot .val{ font-family:var(--mono); font-size:13px; letter-spacing:0.02em; color:var(--paper); opacity:.82; transition:opacity .2s ease; }
.foot li a:hover{ opacity:1; color:var(--accent-soft); }
.foot .sub{ font-family:var(--mono); font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent-soft); display:block; margin-bottom:5px; }
.foot-mark{ align-self:stretch; display:flex; align-items:flex-end; justify-content:flex-end; }
.lockup{ display:grid; justify-items:end; line-height:0.92; gap:1px; text-align:right; }
.lockup span{ font-family:var(--serif); font-weight:600; font-variation-settings:"opsz" 90,"WONK" 1; font-size:clamp(28px,4.2vw,50px); color:var(--accent-soft); letter-spacing:-0.005em; }
.foot-base{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:clamp(48px,6vw,80px); padding-top:20px; border-top:1px solid rgba(243,244,241,0.14);
  font-family:var(--mono); font-size:10.5px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(243,244,241,0.55); }
@media (max-width:820px){ .foot-cols{ grid-template-columns:1fr 1fr; } .foot-mark{ grid-column:1/-1; justify-content:flex-start; } .lockup{ justify-items:start; } }
@media (max-width:460px){ .foot-cols{ grid-template-columns:1fr; } }

/* ---------- Menu overlay ---------- */
.menu{
  position:fixed; inset:0; z-index:120; background:var(--accent); color:var(--paper);
  clip-path:inset(0 0 100% 0); transition:clip-path .6s cubic-bezier(.76,0,.24,1);
  display:flex; flex-direction:column; padding:clamp(20px,4vw,48px) var(--gutter);
  pointer-events:none; overflow:auto;
}
/* film grain over the menu overlay */
.menu::before{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background-image:url("/newsite/assets/grain.png"); background-size:220px 220px; background-repeat:repeat;
  opacity:.2; mix-blend-mode:overlay;
}
body.menu-open .menu{ clip-path:inset(0 0 0 0); pointer-events:auto; }
.menu-ghost{
  position:absolute; left:1.5%; bottom:3%; z-index:0; margin:0; pointer-events:none;
  font-family:var(--serif); font-weight:900; font-variation-settings:"opsz" 144,"WONK" 1;
  font-size:12vw; line-height:0.8; color:#fff; opacity:0.08; white-space:nowrap; letter-spacing:-0.01em;
}
.menu-top{ position:relative; z-index:2; display:flex; justify-content:space-between; align-items:center; }
.menu-top .monogram, .menu-top .est{ color:var(--paper); }
.close-btn{ background:none; border:0; cursor:pointer; font-family:var(--mono); font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:var(--paper); display:inline-flex; align-items:center; gap:10px; }
.close-btn .x{ font-size:20px; line-height:1; }
.menu-main{ position:relative; z-index:2; flex:1; display:grid; grid-template-columns:1fr 1.6fr; gap:40px; align-items:center; padding-block:clamp(24px,4vw,48px); }
.menu-contact{ font-family:var(--mono); font-size:12px; letter-spacing:0.04em; line-height:1.5; }
.menu-contact .h{ font-family:var(--serif); font-weight:400; font-size:26px; letter-spacing:0; text-transform:none; margin-bottom:22px; display:block; }
.menu-contact .grp{ margin-bottom:18px; }
.menu-contact .grp span{ display:block; opacity:.6; text-transform:uppercase; letter-spacing:0.14em; font-size:10.5px; margin-bottom:4px; }
.menu-contact a{ border-bottom:1px solid transparent; transition:border-color .2s; }
.menu-contact a:hover{ border-color:var(--paper); }
.menu-nav{ display:grid; gap:clamp(2px,0.8vw,8px); }
.menu-nav a{
  font-family:var(--serif); font-weight:400; font-variation-settings:"opsz" 144,"WONK" 1;
  font-size:clamp(30px,6vw,68px); line-height:1.06; letter-spacing:-0.01em; color:var(--paper);
  display:flex; align-items:baseline; gap:18px; width:max-content; max-width:100%;
  opacity:.72; transition:opacity .3s ease, transform .4s cubic-bezier(.16,.84,.3,1);
}
.menu-nav a .n{ font-family:var(--mono); font-size:14px; letter-spacing:0.06em; opacity:.6; }
.menu-nav a:hover, .menu-nav a[aria-current="page"]{ opacity:1; transform:translateX(16px); font-style:italic; }
.menu-foot{ position:relative; z-index:2; font-family:var(--mono); font-size:11px; letter-spacing:0.1em; text-transform:uppercase; opacity:.7; }
@media (max-width:720px){ .menu-main{ grid-template-columns:1fr; gap:26px; align-content:center; } .menu-contact{ order:2; } }
@media (prefers-reduced-motion: reduce){
  .menu{ transition:none; } .menu-nav a{ transition:opacity .2s; } .menu-nav a:hover, .menu-nav a[aria-current="page"]{ transform:none; }
}

a:focus-visible, button:focus-visible, .row:focus-visible, .about-pill:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:2px; }
.menu a:focus-visible, .menu button:focus-visible, .foot a:focus-visible{ outline-color:var(--accent-soft); }
