*{box-sizing:border-box}
:root{--cream:#f4efdf;--ink:#151515;--red:#ff3f2f;--yellow:#f6d84a;--blue:#5267ff;--pink:#f48ab5;--muted:#66645e;--line:rgba(21,21,21,.25)}
html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--ink);font-family:"Space Grotesk",sans-serif;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 48% 10%,rgba(246,216,74,.38),transparent 25%),radial-gradient(circle at 82% 48%,rgba(244,138,181,.28),transparent 24%),radial-gradient(circle at 10% 80%,rgba(82,103,255,.22),transparent 26%)}
.grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.13;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}.color-field{position:fixed;z-index:0;pointer-events:none;border-radius:50%;filter:blur(4px);mix-blend-mode:multiply}.field-yellow{width:34vw;height:34vw;background:var(--yellow);left:-15vw;top:8vh}.field-blue{width:30vw;height:30vw;background:var(--blue);right:-13vw;top:35vh}.field-pink{width:26vw;height:26vw;background:var(--pink);left:32vw;bottom:-15vw}.scroll-progress{height:4px;position:fixed;top:0;left:0;right:0;z-index:100}.scroll-progress span{display:block;height:100%;width:0;background:var(--red)}

.hero{height:150vh;position:relative;z-index:2;overflow:clip}.hero-stage{height:150vh;position:relative}.hero-top{position:absolute;top:150px;left:7vw;right:7vw;z-index:7}.hero-name h1{font:800 clamp(58px,8vw,112px)/.9 "Syne";letter-spacing:-.06em;margin:0;max-width:650px}.hero-name em{font-style:normal;color:var(--red)}
.orb-stage{position:sticky;top:10vh;height:80vh;width:100%;display:flex;align-items:center;justify-content:center;z-index:4;pointer-events:none}.orbit{position:relative;width:min(58vw,760px);height:min(58vw,760px);transform-origin:center;will-change:transform,filter;border-radius:48% 52% 58% 42%/52% 45% 55% 48%;filter:drop-shadow(0 30px 45px rgba(21,21,21,.13));animation:orbFloat 7s ease-in-out infinite}.orbit:before{content:"";position:absolute;inset:10%;border-radius:46% 54% 59% 41%/55% 42% 58% 45%;background:var(--yellow);opacity:.9;mix-blend-mode:multiply;animation:blob 8s ease-in-out infinite alternate}.orbit-a,.orbit-b,.orbit-c,.orbit-d{position:absolute;border:4px solid var(--ink);border-radius:50%;inset:2%;transform:rotate(25deg) scaleX(.72);will-change:transform,border-radius}.orbit-b{inset:10%;border-color:var(--blue);border-width:5px;transform:rotate(-48deg) scaleX(.52) scaleY(1.05)}.orbit-c{inset:19%;border-color:var(--red);border-width:8px;transform:rotate(70deg) scaleX(.83)}.orbit-d{inset:31%;border-color:var(--ink);border-width:3px;transform:rotate(-25deg) scaleX(.58)}.orbit-dot{position:absolute;border-radius:50%;background:var(--red);width:25px;height:25px;will-change:transform}.dot-a{top:3%;left:49%}.dot-b{right:8%;bottom:24%;background:var(--blue);width:42px;height:42px}.dot-c{left:11%;bottom:11%;background:var(--ink);width:18px;height:18px}.orbit-core{position:absolute;inset:37%;border-radius:50%;background:var(--red);display:grid;place-items:center;box-shadow:0 0 85px rgba(255,63,47,.45);will-change:transform,border-radius}.orbit-core:before{content:"";position:absolute;inset:-13%;border:3px solid var(--ink);border-radius:50%}.orbit-core span{width:18%;height:18%;background:var(--cream);border-radius:50%}.orbit-label{position:absolute;font:700 11px "DM Mono";letter-spacing:2px;background:var(--cream);border:2px solid var(--ink);padding:7px 9px;box-shadow:4px 4px 0 var(--ink);animation:labelFloat 4s ease-in-out infinite}.label-law{top:14%;right:10%}.label-policy{left:7%;top:47%;animation-delay:-1.3s}.label-track{right:15%;bottom:11%;animation-delay:-2.4s}

.work{position:relative;z-index:2;padding:120px 7vw 160px;background:var(--cream)}.work-intro{display:grid;grid-template-columns:1.2fr .8fr;gap:7vw;align-items:end;padding:30px 0 90px}.work-intro h2{font:800 clamp(65px,8vw,120px)/.82 "Syne";letter-spacing:-.075em;margin:0}.work-intro em{font-style:italic;color:var(--red)}.work-intro p{max-width:380px;font-size:18px;line-height:1.5;margin:0}/* 24-column grid so card widths can be tuned finely. Rows: 15+9, 9+15, 16+8 */
.work-grid{display:grid;grid-template-columns:repeat(24,1fr);gap:18px}
.work-card{--title:clamp(48px,5vw,78px);container-type:inline-size;min-height:390px;padding:25px;position:relative;border:2px solid var(--ink);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-start;gap:34px;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}
.work-card:hover{transform:translate(-6px,-6px) rotate(-.5deg);box-shadow:10px 10px 0 var(--ink)}
.card-large{grid-column:span 15;background:var(--red)}
.card-blue{grid-column:span 9;background:var(--blue)}
.card-outline{grid-column:span 9;background:transparent}
.card-pink{grid-column:span 15;background:var(--pink)}
.card-dark{grid-column:span 16;background:var(--ink);color:var(--cream)}
.card-yellow{grid-column:span 8;background:var(--yellow)}
.work-card h3{font:800 var(--title)/.82 "Syne";letter-spacing:-.06em;margin:0;white-space:nowrap}
/* Each title is its normal size, and only ever shrinks if its card is physically too narrow to hold the word (Syne ExtraBold is very wide). */
.card-large h3{font-size:min(var(--title),10.4cqw)}
.card-blue h3{font-size:min(var(--title),22cqw)}
.card-outline h3{font-size:min(var(--title),18cqw)}
.card-pink h3{font-size:min(var(--title),9.2cqw);letter-spacing:-.075em}
.card-dark h3{font-size:min(var(--title),14.5cqw)}
.card-yellow h3{font-size:min(var(--title),25cqw)}
.work-card p{font-size:16px;line-height:1.45;margin:0}
.card-large p{white-space:nowrap}
@media(max-width:1220px){.work-card{min-height:340px}.card-large,.card-pink{grid-column:span 24}.card-blue,.card-outline{grid-column:span 12}.card-dark{grid-column:span 14}.card-yellow{grid-column:span 10}}
@media(max-width:900px){.work-grid{display:flex;flex-direction:column;gap:15px}.work-card{min-height:300px;padding:22px;gap:26px}.card-large p{white-space:normal}}

.about{position:relative;z-index:2;padding:150px 7vw 150px;background:#5267ff;color:var(--cream)}.about-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:8vw;padding-top:20px}.about h2{font:800 clamp(62px,8vw,120px)/.84 "Syne";letter-spacing:-.075em;margin:0}.about h2 em{font-style:italic;color:var(--yellow)}.about-body{padding-top:20px}.lead{font-size:clamp(25px,3vw,40px);line-height:1.12;letter-spacing:-.04em;margin:0}.about-location{border-top:2px solid rgba(244,239,223,.65);margin-top:70px;padding-top:16px}.about-location span{display:block;font:500 9px "DM Mono";letter-spacing:1.2px;margin-bottom:9px;opacity:.7}.about-location strong{font-size:14px;line-height:1.55;font-weight:600}.contact-block{border-top:2px solid rgba(244,239,223,.65);margin-top:42px;padding-top:16px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}.contact-label{font:500 9px "DM Mono";letter-spacing:1.2px;opacity:.7;width:100%}.contact-email{font:600 19px "Space Grotesk";color:var(--cream);text-decoration:none;border-bottom:2px solid rgba(244,239,223,.55);padding-bottom:3px;transition:border-color .2s}.contact-email:hover{border-color:var(--yellow)}a:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}.site-footer{position:relative;z-index:2;background:var(--ink);color:var(--cream);padding:22px 7vw;font:500 11px "DM Mono";letter-spacing:.14em;text-transform:uppercase}.linkedin-button{display:inline-flex;align-items:center;gap:8px;padding:9px 12px;border:2px solid var(--cream);background:var(--cream);color:var(--blue);text-decoration:none;font:600 12px "Space Grotesk";transition:transform .2s,box-shadow .2s}.linkedin-button svg{width:16px;height:16px;fill:currentColor}.linkedin-button:hover{transform:translate(-3px,-3px);box-shadow:4px 4px 0 var(--ink)}.writing-block{margin-top:65px;display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:end;padding:25px 0;border-top:2px solid rgba(244,239,223,.65);border-bottom:2px solid rgba(244,239,223,.65);color:var(--cream);text-decoration:none;transition:padding .3s,background .3s}.writing-block:hover{padding-left:15px;background:rgba(244,239,223,.08)}.writing-index{font:500 9px "DM Mono";letter-spacing:1.2px;opacity:.7}.writing-title{font:800 clamp(28px,3vw,42px)/.9 "Syne";letter-spacing:-.05em}.writing-title em{color:var(--yellow);font-style:italic}.writing-arrow{font:400 30px "Space Grotesk"}
.reveal{opacity:0;transform:translateY(35px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.12s}.delay-2{transition-delay:.22s}@keyframes orbFloat{0%,100%{transform:translate3d(0,-8px,0) rotate(-2deg) scale(1)}50%{transform:translate3d(18px,12px,0) rotate(3deg) scale(1.035)}}@keyframes blob{0%{border-radius:46% 54% 59% 41%/55% 42% 58% 45%}100%{border-radius:62% 38% 42% 58%/48% 61% 39% 52%}}@keyframes labelFloat{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}
@media(max-width:750px){.hero{height:145vh}.hero-stage{height:145vh}.hero-top{top:105px;left:7vw;right:7vw}.hero-name h1{font-size:66px;line-height:.9}.orb-stage{top:12vh;height:72vh}.orbit{width:104vw;height:104vw}.orbit-label{font-size:8px;padding:5px 6px}.work,.about{padding-left:7vw;padding-right:7vw}.work-intro,.about-layout{grid-template-columns:1fr;gap:35px}.work-intro{padding:30px 0 65px}.writing-block{grid-template-columns:1fr auto;gap:12px}.writing-title{grid-column:1/-1;grid-row:2}.writing-arrow{grid-column:2;grid-row:1}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{transition:none}.orbit{animation:none}.orbit-label{animation:none}}

/* =====================================================================
   HOME: work cards are links now
   ===================================================================== */
.work-card{color:var(--ink);text-decoration:none}
.work-card.card-dark{color:var(--cream)}
.work-card:after{content:"\2197";position:absolute;right:24px;bottom:16px;font:400 46px "Space Grotesk";line-height:1;transition:transform .3s}
.work-card:hover:after{transform:translate(5px,-5px)}

/* =====================================================================
   SUB-PAGES (government-internship, track, writing, performances, gym)
   ===================================================================== */
.theme-red{--hero-bg:var(--red);--hero-fg:var(--ink)}
.theme-blue{--hero-bg:var(--blue);--hero-fg:var(--ink)}
.theme-cream{--hero-bg:var(--cream);--hero-fg:var(--ink)}
.theme-pink{--hero-bg:var(--pink);--hero-fg:var(--ink)}
.theme-ink{--hero-bg:var(--ink);--hero-fg:var(--cream)}
.theme-yellow{--hero-bg:var(--yellow);--hero-fg:var(--ink)}

.pg-nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:18px 7vw;pointer-events:none}
.pg-nav a{pointer-events:auto;background:var(--cream);color:var(--ink);border:2px solid var(--ink);padding:9px 16px;font:500 12px "DM Mono";letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:transform .2s,box-shadow .2s}
.pg-nav a:hover{transform:translate(-3px,-3px);box-shadow:4px 4px 0 var(--ink)}

.pg-hero{position:relative;z-index:2;background:var(--hero-bg);color:var(--hero-fg);border-bottom:2px solid var(--ink);padding:118px 7vw 70px;overflow:clip}
.pg-hero-inner{container-type:inline-size;max-width:1400px;margin:0 auto}
/* Title fills the width of the page. --fit is set per page (cqw = % of the title area's width) */
.pg-hero h1{font:800 var(--fit,12cqw)/.84 "Syne";letter-spacing:-.06em;margin:0;white-space:nowrap}
.pg-hero h1 em{font-style:normal;color:var(--red)}
.theme-red .pg-hero h1 em{color:var(--cream)}
.pg-lede{font:500 clamp(18px,2.1vw,26px)/1.35 "Space Grotesk";max-width:30em;margin:36px 0 0}
.pg-meta{display:flex;flex-wrap:wrap;margin-top:52px;border-top:2px solid currentColor}
.pg-meta div{padding:16px 40px 0 0;min-width:170px}
.pg-meta span{display:block;font:500 11px "DM Mono";letter-spacing:.16em;text-transform:uppercase;opacity:.7;margin-bottom:8px}
.pg-meta strong{font:600 17px "Space Grotesk"}
.pg-meta .is-empty{opacity:.45}

.pg-main{position:relative;z-index:2;background:var(--cream)}
.pg-section{padding:90px 7vw;border-bottom:2px solid var(--ink)}
.pg-section-inner{max-width:1400px;margin:0 auto}
.pg-label{display:inline-block;font:500 12px "DM Mono";letter-spacing:.16em;text-transform:uppercase;border:2px solid var(--ink);padding:7px 12px}
.pg-section h2{font:800 clamp(38px,5.2vw,76px)/.9 "Syne";letter-spacing:-.05em;margin:24px 0 40px}
.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}

/* ---- empty slots: dashed boxes that mark where content goes ---- */
.slot-empty{display:grid;place-content:center;justify-items:center;gap:14px;min-height:150px;border:2px dashed rgba(21,21,21,.45);background:repeating-linear-gradient(135deg,rgba(21,21,21,.045) 0 14px,transparent 14px 28px);font:500 12px "DM Mono";letter-spacing:.14em;text-transform:uppercase;color:rgba(21,21,21,.6);text-align:center;padding:20px}
.slot-video{margin:0}
.slot-video .slot-empty{aspect-ratio:16/9}
.slot-video iframe,.slot-video video{display:block;width:100%;aspect-ratio:16/9;border:2px solid var(--ink);background:var(--ink)}
.slot-photo{margin:0}
.slot-photo .slot-empty{aspect-ratio:1/1}
.slot-photo img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;border:2px solid var(--ink)}
.slot-video figcaption,.slot-photo figcaption{margin-top:14px;display:flex;justify-content:space-between;gap:4px 14px;flex-wrap:wrap;font:500 15px "Space Grotesk"}
.slot-video figcaption strong,.slot-photo figcaption strong{font-weight:700}
.slot-video figcaption span,.slot-photo figcaption span{opacity:.55}
.play{position:relative;width:64px;height:64px;border:2px solid currentColor;border-radius:50%}
.play:after{content:"";position:absolute;left:25px;top:19px;border-left:18px solid currentColor;border-top:11px solid transparent;border-bottom:11px solid transparent}

.info-card{border:2px solid var(--ink);background:var(--cream);padding:26px;box-shadow:7px 7px 0 var(--ink)}
.info-card h3{font:800 clamp(24px,2.4vw,32px)/.95 "Syne";letter-spacing:-.04em;margin:0 0 16px}
.info-card p{margin:0;font:400 16px/1.5 "Space Grotesk"}
.info-card .ph{opacity:.5}

.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.stat{border:2px solid var(--ink);background:var(--cream);padding:24px 26px;box-shadow:7px 7px 0 var(--ink)}
.stat span,.stat small{display:block;font:500 12px "DM Mono";letter-spacing:.16em;text-transform:uppercase}
.stat strong{display:block;font:800 clamp(52px,7vw,104px)/.9 "Syne";letter-spacing:-.05em;margin:18px 0 10px}
.stat small{opacity:.55}
.stat strong.is-empty{opacity:.3}

.table-wrap{overflow-x:auto}
.pr-table{width:100%;border-collapse:collapse;font:500 17px "Space Grotesk";min-width:480px}
.pr-table th{font:500 11px "DM Mono";letter-spacing:.14em;text-transform:uppercase;text-align:left;padding:12px 14px;border-bottom:2px solid var(--ink)}
.pr-table td{padding:22px 14px;border-bottom:1px solid rgba(21,21,21,.25)}
.pr-table .ph{opacity:.45}

.pieces{border-top:2px solid var(--ink)}
.piece{display:grid;grid-template-columns:56px 1fr auto 110px 40px;gap:18px;align-items:center;padding:26px 8px;border-bottom:2px solid var(--ink);color:var(--ink);text-decoration:none;transition:padding .25s,background .25s}
a.piece[href]:hover{padding-left:22px;background:rgba(21,21,21,.05)}
.piece-n,.piece-tag,.piece-d{font:500 12px "DM Mono";letter-spacing:.14em;text-transform:uppercase}
.piece-t{font:800 clamp(22px,2.8vw,40px)/1 "Syne";letter-spacing:-.04em}
.piece-a{font:400 30px "Space Grotesk";text-align:right}
.piece.is-empty .piece-t,.piece.is-empty .piece-tag,.piece.is-empty .piece-d{opacity:.4}

.pg-btn{display:inline-flex;align-items:center;gap:12px;border:2px solid var(--ink);background:var(--ink);color:var(--cream);padding:17px 28px;font:700 15px "Space Grotesk";text-decoration:none;transition:transform .2s,box-shadow .2s}
.pg-btn:hover{transform:translate(-3px,-3px);box-shadow:5px 5px 0 var(--red)}
.pg-btn.is-empty{opacity:.45;cursor:not-allowed}
.pg-btn.is-empty:hover{transform:none;box-shadow:none}
.pg-btn-row{display:flex;flex-wrap:wrap;gap:16px}

.pg-next{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:72px 7vw;background:var(--nx-bg);color:var(--nx-fg,var(--ink));border-top:2px solid var(--ink);text-decoration:none;transition:padding .3s}
.pg-next:hover{padding-left:calc(7vw + 20px)}
.pg-next small{display:block;font:500 12px "DM Mono";letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px}
.pg-next strong{display:block;font:800 min(150px,var(--nf,7vw))/.88 "Syne";letter-spacing:-.06em}
.pg-next i{font:400 clamp(40px,6vw,90px) "Space Grotesk";font-style:normal}

@media(max-width:1000px){.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){
  .pg-hero{padding:100px 6vw 56px}
  .pg-section{padding:64px 6vw}
  .pg-nav{padding:14px 6vw}
  .pg-next{padding:56px 6vw}
  .pg-meta div{min-width:45%;padding-right:20px}
  .grid-2,.grid-3,.stats{grid-template-columns:minmax(0,1fr)}
  .piece{grid-template-columns:36px 1fr 28px;gap:12px}
  .piece-tag,.piece-d{display:none}
}
.slot-video.feature figcaption{align-items:baseline}
.slot-video.feature figcaption strong{font:700 17px/1.3 "Space Grotesk"}

/* Reselling: a plain black box on the home page (no text, no link, no hover) */
.work-card.card-dark:after{display:none}
.work-card.card-dark:hover{transform:none;box-shadow:none}
