/* Tabula v5 — Brutalist Raw
   White, black, one orange. Bebas Neue display, IBM Plex Mono body.
   3 px borders. No radius. No shadows. Phone first. */

:root{
  --w:#FFFFFF;
  --k:#000000;
  --o:#FF4D00;
  --b:3px;
  --gut:16px;
  --display:"Bebas Neue","Anton","Impact","Arial Narrow",sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --fs-body:15px;
  --lh-body:1.55;
}
@media (min-width:760px){ :root{ --gut:32px; --fs-body:16px; } }
@media (min-width:1100px){ :root{ --gut:48px; } }

*,*::before,*::after{ box-sizing:border-box; border-radius:0 !important; box-shadow:none !important; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion:reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; background:var(--w); color:var(--k);
  font-family:var(--mono); font-size:var(--fs-body); line-height:var(--lh-body);
  overflow-x:hidden; -webkit-font-smoothing:antialiased;
}
img,video{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
p{ margin:0 0 1em; }
ul,ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3{ margin:0; font-family:var(--display); font-weight:400; letter-spacing:.01em; text-transform:uppercase; line-height:.86; }
figure{ margin:0; }
:focus-visible{ outline:var(--b) solid var(--o); outline-offset:2px; }

.skip{ position:absolute; left:-999px; top:0; background:var(--o); color:var(--k); padding:8px 12px; font-weight:600; z-index:100; }
.skip:focus{ left:var(--gut); }

/* ---------- NAV ---------- */
.nav{
  position:sticky; top:0; z-index:50;
  display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:0;
  background:var(--w); border-bottom:var(--b) solid var(--k);
  min-height:56px;
}
.nav-brand{ display:flex; align-items:center; gap:10px; padding:0 var(--gut); height:56px; border-right:var(--b) solid var(--k); }
.nav .mark{ width:32px; height:32px; color:var(--k); flex:none; }
.nav-word{ font-family:var(--display); font-size:28px; line-height:1; letter-spacing:.08em; padding-top:3px; }
.nav-links{ display:none; }
.nav-all{ display:none; }
.nav-cta{
  display:flex; align-items:center; height:56px; padding:0 var(--gut);
  background:var(--o); color:var(--k); font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:.04em; white-space:nowrap;
}
.nav-cta:hover{ background:var(--k); color:var(--w); }
@media (min-width:1100px){
  .nav{ grid-template-columns:auto 1fr auto auto; }
  .nav-links{ display:flex; gap:0; height:56px; align-items:stretch; }
  .nav-links a{ display:flex; align-items:center; padding:0 18px; font-size:13px; text-transform:uppercase; letter-spacing:.06em; border-right:var(--b) solid var(--k); }
  .nav-links a:hover{ background:var(--k); color:var(--w); }
  .nav-all{ display:flex; align-items:center; height:56px; padding:0 22px; font-size:12px; text-transform:uppercase; letter-spacing:.06em; border-left:var(--b) solid var(--k); border-right:var(--b) solid var(--k); }
  .nav-all:hover{ background:var(--o); }
}

/* ---------- HERO ---------- */
.hero{
  display:grid; grid-template-columns:1fr; border-bottom:var(--b) solid var(--k);
}
.hero-copy{ padding:28px var(--gut) 0; }
.kicker{ font-size:12px; text-transform:uppercase; letter-spacing:.08em; margin:0 0 18px; border-left:6px solid var(--o); padding-left:10px; }
.hero-h{
  font-size:clamp(112px, 36vw, 340px); line-height:.82; margin:0 0 20px -0.02em;
}
.hero-block{
  background:var(--o); color:var(--k); padding:20px; border:var(--b) solid var(--k);
  margin:0 0 var(--gut);
}
.hero-block p{ font-size:16px; font-weight:500; }
.hero-actions{ display:grid; grid-template-columns:1fr; gap:10px; margin-top:16px; }
.btn{
  display:inline-flex; align-items:center; justify-content:center; min-height:52px; padding:0 20px;
  font-family:var(--mono); font-weight:600; font-size:14px; text-transform:uppercase; letter-spacing:.06em;
  border:var(--b) solid var(--k); background:var(--w); color:var(--k); text-align:center; cursor:pointer;
}
.btn-black{ background:var(--k); color:var(--w); }
.btn-black:hover{ background:var(--o); color:var(--k); }
.btn-ghost{ background:transparent; }
.btn-ghost:hover{ background:var(--k); color:var(--w); }
.hero-media{ border-top:var(--b) solid var(--k); }
.box{ border:var(--b) solid var(--k); overflow:hidden; background:var(--k); position:relative; }
.box img,.box video{ width:100%; height:100%; object-fit:cover; }
.box-video{ aspect-ratio:16/9; border-left:0; border-right:0; border-top:0; }
.box-45{ aspect-ratio:4/5; }
.box-169{ aspect-ratio:16/9; }
.box figcaption{
  position:absolute; left:0; bottom:0; background:var(--w); color:var(--k);
  border-top:var(--b) solid var(--k); border-right:var(--b) solid var(--k);
  padding:6px 10px; font-size:12px; text-transform:uppercase; letter-spacing:.06em; font-weight:600;
}
.hero-strip{
  display:grid; grid-template-columns:repeat(2,1fr); border-top:0;
}
.hero-strip span{
  padding:12px var(--gut); font-size:12px; text-transform:uppercase; letter-spacing:.06em; font-weight:500;
  border-right:var(--b) solid var(--k); border-bottom:var(--b) solid var(--k);
}
.hero-strip span:nth-child(2n){ border-right:0; }
.hero-strip span:nth-child(n+3){ border-bottom:0; }

@media (min-width:760px){
  .hero-h{ font-size:clamp(160px, 24vw, 340px); }
  .hero-actions{ grid-template-columns:auto auto; justify-content:start; }
}
@media (min-width:1100px){
  .hero{ grid-template-columns:1fr 1fr; }
  .hero-copy{ padding-top:48px; border-right:var(--b) solid var(--k); display:flex; flex-direction:column; justify-content:space-between; }
  .hero-h{ font-size:clamp(180px, 17vw, 300px); }
  .hero-block{ margin-bottom:0; border-left:0; border-right:0; border-bottom:0; margin-left:calc(-1 * var(--gut)); margin-right:calc(-1 * var(--gut)); padding:28px var(--gut); }
  .hero-media{ border-top:0; display:flex; flex-direction:column; }
  .box-video{ flex:1; aspect-ratio:auto; min-height:520px; border-bottom:var(--b) solid var(--k); }
  .hero-strip{ grid-template-columns:repeat(4,1fr); }
  .hero-strip span{ border-bottom:0; padding:12px 16px; white-space:nowrap; font-size:11px; }
  .hero-strip span:nth-child(2n){ border-right:var(--b) solid var(--k); }
  .hero-strip span:last-child{ border-right:0; }
}

/* ---------- MARQUEE (used once) ---------- */
.marquee{
  overflow:hidden; background:var(--k); color:var(--w); border-bottom:var(--b) solid var(--k);
  white-space:nowrap; padding:10px 0;
}
.marquee-track{ display:inline-flex; width:max-content; animation:mq 28s linear infinite; }
.marquee-track span{
  font-family:var(--display); font-size:clamp(40px, 9vw, 96px); line-height:1; letter-spacing:.04em; padding-right:0;
}
@keyframes mq{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion:reduce){ .marquee-track{ animation:none; } }

/* ---------- SECTIONS ---------- */
.sec{ padding:0 0 var(--gut); border-bottom:var(--b) solid var(--k); }
.sec-black{ background:var(--k); color:var(--w); }
.sec-black .box, .sec-black .btn, .sec-black .block, .sec-black .plain{ border-color:var(--w); }
.sec-head{ padding:36px var(--gut) 24px; }
.sec-h{ font-size:clamp(72px, 20vw, 200px); line-height:.84; margin:0 0 18px -0.02em; }
.sec-note{ max-width:56ch; font-size:var(--fs-body); margin:0; }
@media (min-width:760px){
  .sec-head{ display:grid; grid-template-columns:1fr 1fr; gap:var(--gut); align-items:end; padding-top:56px; padding-bottom:36px; }
  .sec-h{ font-size:clamp(104px, 11vw, 160px); margin-bottom:0; }
  .sec-note{ font-size:17px; }
}

/* numbered rows */
.rows{ border-top:var(--b) solid var(--k); counter-reset:none; }
.row{
  display:grid; grid-template-columns:auto 1fr; grid-template-areas:"n t" "n d";
  gap:0 14px; align-items:baseline;
  padding:14px var(--gut) 16px; border-bottom:var(--b) solid var(--k);
}
.row-n{ grid-area:n; font-family:var(--display); color:var(--o); font-size:clamp(36px, 9vw, 96px); line-height:.9; align-self:start; }
.row-t{ grid-area:t; font-family:var(--display); font-size:clamp(56px, 15vw, 200px); line-height:.86; text-transform:uppercase; min-width:0; }
.row-d{ grid-area:d; font-size:14px; margin-top:8px; max-width:48ch; }
.row:hover{ background:var(--o); }
.row:hover .row-n{ color:var(--k); }
@media (min-width:760px){
  .row{ grid-template-columns:120px 1fr 1fr; grid-template-areas:"n t d"; align-items:center; padding:10px var(--gut) 14px; }
  .row-n{ font-size:64px; align-self:center; }
  .row-t{ font-size:clamp(96px, 11vw, 176px); }
  .row-d{ margin:0; font-size:15px; justify-self:end; text-align:right; max-width:36ch; }
}

/* split (image + block) */
.split{ display:grid; grid-template-columns:1fr; margin-top:var(--gut); padding:0 var(--gut); gap:var(--gut); }
.block{ border:var(--b) solid var(--k); padding:22px 20px; display:flex; flex-direction:column; justify-content:flex-end; }
.block-orange{ background:var(--o); color:var(--k); }
.block-white{ background:var(--w); color:var(--k); }
.sec-black .block-white{ border-color:var(--w); }
.block .big{ font-family:var(--display); font-size:clamp(48px, 12vw, 104px); line-height:.86; text-transform:uppercase; margin:0 0 16px; }
.block p{ font-size:15px; }
.block p:last-child{ margin-bottom:0; }
.mono-note{ font-size:12px; text-transform:uppercase; letter-spacing:.06em; font-weight:600; border-top:var(--b) solid currentColor; padding-top:12px; margin-top:12px; }
.mono-note.center{ text-align:left; margin:var(--gut) var(--gut) 0; border-top:0; padding-top:0; font-weight:400; text-transform:none; letter-spacing:0; }
@media (min-width:760px){
  .split{ grid-template-columns:1fr 1fr; }
  .block{ padding:32px 28px; }
  .block p{ font-size:16px; }
}

/* ledger */
.ledger{ border-top:var(--b) solid var(--w); border-bottom:var(--b) solid var(--w); }
.ledger-head{ display:none; }
.ledger-row{
  display:grid; grid-template-columns:1fr; border-bottom:var(--b) solid var(--w);
}
.ledger-row:last-child{ border-bottom:0; }
.ledger .ask{
  font-family:var(--display); font-size:clamp(36px, 9vw, 72px); line-height:.9; letter-spacing:.01em;
  padding:16px var(--gut) 10px; color:var(--o);
}
.ledger .ans{ padding:0 var(--gut) 18px; font-size:15px; max-width:60ch; }
@media (min-width:760px){
  .ledger-head{
    display:grid; grid-template-columns:1fr 1fr; border-bottom:var(--b) solid var(--w);
  }
  .ledger-head span{ padding:10px var(--gut); font-size:12px; text-transform:uppercase; letter-spacing:.1em; font-weight:600; }
  .ledger-head span+span{ border-left:var(--b) solid var(--w); }
  .ledger-row{ grid-template-columns:1fr 1fr; }
  .ledger .ask{ padding:22px var(--gut); font-size:clamp(44px, 4.2vw, 72px); border-right:var(--b) solid var(--w); }
  .ledger .ans{ padding:24px var(--gut); font-size:16px; align-self:center; }
  .ledger-row:hover{ background:var(--w); color:var(--k); }
  .ledger-row:hover .ask{ color:var(--k); border-right-color:var(--k); }
}

/* faces */
.faces{
  display:grid; grid-template-columns:repeat(2,1fr);
  border-top:var(--b) solid var(--k); border-bottom:var(--b) solid var(--k);
}
.face{
  position:relative; aspect-ratio:1/1; background:var(--k); overflow:hidden;
  border-right:var(--b) solid var(--k); border-bottom:var(--b) solid var(--k);
}
.face:nth-child(2n){ border-right:0; }
.face:nth-last-child(-n+2){ border-bottom:0; }
.face img{ width:100%; height:100%; object-fit:cover; }
.face-cap{
  position:absolute; left:0; bottom:0; background:var(--w); color:var(--k);
  border-top:var(--b) solid var(--k); border-right:var(--b) solid var(--k);
  padding:6px 10px 6px 8px; font-size:11px; text-transform:uppercase; letter-spacing:.06em; font-weight:600;
  display:flex; align-items:baseline; gap:8px; max-width:100%;
}
.face-cap b{ font-family:var(--display); font-size:20px; color:var(--o); font-weight:400; }
/* fallback when a face render is missing (site.js adds .missing) */
.face.missing img{ display:none; }
.face.missing::before{
  content:attr(data-n); position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-size:clamp(96px, 30vw, 240px); color:var(--w); opacity:.18;
}
@media (min-width:760px){
  .faces{ grid-template-columns:repeat(3,1fr); }
  .face:nth-child(2n){ border-right:var(--b) solid var(--k); }
  .face:nth-child(3n){ border-right:0; }
  .face:nth-last-child(-n+3){ border-bottom:0; }
  .face-cap{ font-size:12px; padding:8px 14px 8px 10px; }
  .face-cap b{ font-size:26px; }
}

/* trio of images */
.trio{ display:grid; grid-template-columns:1fr; gap:var(--gut); padding:0 var(--gut); }
@media (min-width:760px){ .trio{ grid-template-columns:repeat(3,1fr); } }

/* plain table */
.plain{
  width:calc(100% - 2*var(--gut)); margin:var(--gut) var(--gut) 0; border-collapse:collapse;
  border:var(--b) solid currentColor; font-size:13px;
}
.plain caption{
  text-align:left; font-family:var(--display); font-size:clamp(40px, 10vw, 72px); line-height:1; padding:0 0 10px; caption-side:top;
}
.plain th,.plain td{ padding:8px 8px; border:var(--b) solid currentColor; text-align:left; vertical-align:top; }
.plain thead th{ font-size:11px; text-transform:uppercase; letter-spacing:.1em; background:var(--o); color:var(--k); border-color:currentColor; }
.sec-black .plain thead th{ border-color:var(--w); }
.plain tbody th{ font-weight:600; text-transform:uppercase; font-size:12px; letter-spacing:.06em; white-space:nowrap; }
.sec-black .plain tbody tr:hover{ background:var(--w); color:var(--k); }
.sec-black .plain tbody tr:hover th,.sec-black .plain tbody tr:hover td{ border-color:var(--k); }
.sec-black .box-169{ margin:var(--gut) var(--gut) 0; }
@media (min-width:760px){ .plain{ font-size:15px; } .plain th,.plain td{ padding:14px 16px; } }

/* pricing */
.agent-band{
  display:grid; grid-template-columns:1fr; background:var(--o); color:var(--k);
  border-top:var(--b) solid var(--k); border-bottom:var(--b) solid var(--k);
}
.agent-l{ padding:24px var(--gut); border-bottom:var(--b) solid var(--k); }
.agent-k{ font-size:12px; text-transform:uppercase; letter-spacing:.1em; font-weight:600; margin:0 0 6px; }
.agent-p{ font-family:var(--display); font-size:clamp(96px, 28vw, 260px); line-height:.86; margin:0; display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.agent-p small{ font-family:var(--mono); font-size:14px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; }
.agent-p.alt{ font-size:clamp(56px, 16vw, 140px); margin-top:4px; }
.agent-r{ padding:24px var(--gut); font-size:15px; }
.agent-r p:first-child{ font-weight:600; font-size:17px; }
.agent-r .btn{ width:100%; }
@media (min-width:760px){
  .agent-band{ grid-template-columns:1.2fr 1fr; }
  .agent-l{ border-bottom:0; border-right:var(--b) solid var(--k); }
  .agent-r{ display:flex; flex-direction:column; justify-content:flex-end; font-size:16px; }
  .agent-r .btn{ width:auto; align-self:flex-start; }
}

.editions{ display:grid; grid-template-columns:1fr; border-bottom:var(--b) solid var(--k); }
.ed{
  display:flex; flex-direction:column; border-bottom:var(--b) solid var(--k); background:var(--w);
}
.ed:last-child{ border-bottom:0; }
.ed-img{ aspect-ratio:16/10; overflow:hidden; background:var(--k); border-bottom:var(--b) solid var(--k); }
.ed-img img{ width:100%; height:100%; object-fit:cover; }
.ed-k{ padding:16px var(--gut) 0; font-size:12px; text-transform:uppercase; letter-spacing:.1em; font-weight:600; margin:0; }
.ed-p{ padding:0 var(--gut); font-family:var(--display); font-size:clamp(80px, 22vw, 150px); line-height:.9; margin:0 0 12px; }
.ed-l{ padding:0 var(--gut); flex:1; }
.ed-l li{ padding:8px 0; border-top:var(--b) solid var(--k); font-size:14px; }
.ed .btn{ margin:16px var(--gut) var(--gut); }
.ed-founder{ background:var(--k); color:var(--w); }
.ed-founder .ed-l li{ border-color:var(--w); }
.ed-founder .ed-img{ border-color:var(--w); }
.ed-founder .ed-p{ color:var(--o); }
.ed-founder .btn-black{ background:var(--o); color:var(--k); border-color:var(--o); }
.ed-founder .btn-black:hover{ background:var(--w); border-color:var(--w); }
@media (min-width:760px){
  .editions{ grid-template-columns:repeat(2,1fr); }
  .ed{ border-right:var(--b) solid var(--k); }
  .ed:nth-child(2n){ border-right:0; }
  .ed:nth-last-child(-n+2){ border-bottom:0; }
  .ed-p{ font-size:clamp(80px, 9vw, 130px); }
  .ed-img{ aspect-ratio:4/3; }
}
@media (min-width:1100px){
  .editions{ grid-template-columns:repeat(4,1fr); }
  .ed{ border-bottom:0; border-right:var(--b) solid var(--k); }
  .ed:nth-child(2n){ border-right:var(--b) solid var(--k); }
  .ed:last-child{ border-right:0; }
  .ed-img{ aspect-ratio:4/5; }
  .ed-p{ font-size:clamp(72px, 6.6vw, 110px); }
}

/* manifesto */
.manifesto{ padding:40px var(--gut) 8px; }
.man-k{ font-size:12px; text-transform:uppercase; letter-spacing:.1em; font-weight:600; color:var(--o); margin:0 0 16px; border-left:6px solid var(--o); padding-left:10px; }
.man-h{ font-size:clamp(56px, 15vw, 190px); line-height:.86; margin:0 0 28px -0.02em; }
.man-l{ counter-reset:man; border-top:var(--b) solid var(--w); }
.man-l li{
  counter-increment:man; display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:baseline;
  padding:14px 0; border-bottom:var(--b) solid var(--w);
  font-family:var(--display); font-size:clamp(28px, 7vw, 56px); line-height:.95; letter-spacing:.01em;
}
.man-l li::before{ content:counter(man, decimal-leading-zero); color:var(--o); font-size:.6em; }
@media (min-width:760px){
  .manifesto{ padding-top:64px; }
  .man-h{ font-size:clamp(100px, 9vw, 150px); }
  .man-l{ display:grid; grid-template-columns:1fr 1fr; border-left:var(--b) solid var(--w); }
  .man-l li{ padding:18px var(--gut) 18px 18px; border-right:var(--b) solid var(--w); font-size:clamp(32px, 3.2vw, 48px); }
}

/* faq */
.faq{ margin:0 var(--gut); border-top:var(--b) solid var(--k); }
.faq details{ border-bottom:var(--b) solid var(--k); }
.faq summary{
  list-style:none; cursor:pointer; display:grid; grid-template-columns:1fr auto; gap:16px; align-items:center;
  padding:16px 0; font-family:var(--display); font-size:clamp(28px, 7.4vw, 56px); line-height:.95;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; color:var(--o); font-size:1.1em; line-height:1; }
.faq details[open] summary::after{ content:"–"; }
.faq summary:hover{ color:var(--o); }
.faq details p{ margin:0; padding:0 0 20px; max-width:64ch; font-size:15px; }
@media (min-width:760px){
  .faq summary{ font-size:clamp(36px, 3.6vw, 56px); padding:20px 0; }
  .faq details p{ font-size:16px; padding-left:0; }
}

/* footer */
.foot{ background:var(--k); color:var(--w); padding:0 0 28px; }
.foot-top{ padding:36px var(--gut) 20px; border-bottom:var(--b) solid var(--w); }
.wordmark{ width:min(100%, 460px); height:auto; color:var(--w); display:block; margin-bottom:20px; }
.foot-line{ font-size:13px; text-transform:uppercase; letter-spacing:.08em; margin:0; }
.foot-links{ display:grid; grid-template-columns:repeat(2,1fr); border-bottom:var(--b) solid var(--w); }
.foot-links li{ border-right:var(--b) solid var(--w); border-bottom:var(--b) solid var(--w); }
.foot-links li:nth-child(2n){ border-right:0; }
.foot-links li:nth-last-child(-n+1){ border-bottom:0; }
.foot-links a{ display:block; padding:12px var(--gut); font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.foot-links a:hover{ background:var(--o); color:var(--k); }
.foot-c{ padding:20px var(--gut) 0; font-size:13px; margin:0; }
.foot-c a{ text-decoration:underline; text-underline-offset:3px; }
@media (min-width:760px){
  .foot-links{ grid-template-columns:repeat(7,auto); justify-content:start; }
  .foot-links li{ border-bottom:0; }
  .foot-links li:nth-child(2n){ border-right:var(--b) solid var(--w); }
  .foot-links li:last-child{ border-right:0; }
  .foot-links a{ padding:14px 20px; }
}
