:root { --ink:#17140f; --paper:#f3efe5; --lime:#c8ff36; --orange:#ff6b2b; --blue:#3155ff; --magenta:#ff3da2; --yellow:#ffd524; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }

.site-header { align-items:center; background:var(--paper); border-bottom:2px solid var(--ink); display:grid; grid-template-columns:1fr auto 1fr; min-height:76px; padding:0 3vw; position:relative; z-index:10; }
.wordmark { font-size:1.45rem; font-weight:950; letter-spacing:-.08em; width:fit-content; }
.wordmark span:nth-child(1) { color:var(--blue); }
.wordmark span:nth-child(2) { color:var(--orange); }
.site-header nav { display:flex; gap:clamp(1.5rem,4vw,4rem); }
.site-header nav a { font-size:.75rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.site-header nav a:hover { color:var(--blue); }
.round-link { align-items:center; border:2px solid var(--ink); border-radius:50%; display:flex; font-size:1.1rem; height:42px; justify-self:end; justify-content:center; transition:.2s ease; width:42px; }
.round-link:hover { background:var(--ink); color:var(--paper); transform:rotate(-30deg); }

.hero { background:var(--yellow); min-height:720px; overflow:hidden; padding:clamp(4rem,8vw,8rem) 4vw 4rem; position:relative; }
.eyebrow,.section-number,.footer-kicker { font-size:.72rem; font-weight:900; letter-spacing:.16em; text-transform:uppercase; }
.hero h1 { font-size:clamp(4.7rem,12.5vw,12rem); font-weight:950; letter-spacing:-.09em; line-height:.73; margin:5rem 0 0; max-width:1400px; position:relative; z-index:2; }
.hero h1 em { color:var(--blue); font-style:normal; -webkit-text-stroke:2px var(--ink); }
.hero-bottom { align-items:end; display:flex; justify-content:space-between; margin-top:5rem; position:relative; z-index:2; }
.hero-bottom p { font-size:clamp(1rem,1.35vw,1.35rem); font-weight:700; line-height:1.5; margin:0; max-width:580px; }
.cta { align-items:center; background:var(--ink); border:2px solid var(--ink); color:white; display:inline-flex; font-size:.82rem; font-weight:900; gap:2.5rem; padding:1.15rem 1.25rem; text-transform:uppercase; transition:.2s ease; }
.cta:hover { background:var(--magenta); box-shadow:4px 4px 0 var(--ink); color:var(--ink); transform:translate(-4px,-4px); }
.hero-orbit { border:3px solid var(--ink); border-radius:50%; position:absolute; }
.orbit-one { height:42vw; right:-9vw; top:-18vw; width:42vw; }
.orbit-two { background:var(--magenta); height:12vw; min-height:100px; min-width:100px; right:10vw; top:4vw; width:12vw; }

.ticker { background:var(--ink); color:white; overflow:hidden; padding:1rem 0; white-space:nowrap; }
.ticker div { align-items:center; display:flex; gap:2.4rem; justify-content:center; min-width:max-content; }
.ticker span { font-size:.75rem; font-weight:900; letter-spacing:.13em; }
.ticker i { color:var(--lime); font-style:normal; }

.section { padding:clamp(5rem,9vw,9rem) 4vw; }
.section-heading { align-items:end; display:grid; gap:4rem; grid-template-columns:2fr 1fr; margin-bottom:4rem; }
.section h2,footer h2 { font-size:clamp(3.5rem,7vw,7.3rem); font-weight:950; letter-spacing:-.07em; line-height:.84; margin:1.3rem 0 0; }
.section-intro { font-size:1.06rem; font-weight:700; line-height:1.55; margin:0; max-width:450px; }

.projects-section { background:var(--paper); }
.project-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(3,1fr); }
.project-card { border:2px solid var(--ink); display:flex; flex-direction:column; justify-content:space-between; min-height:440px; padding:1.5rem; transition:.22s ease; }
.project-card:hover { box-shadow:8px 8px 0 var(--ink); transform:translate(-8px,-8px) rotate(-1deg); }
.project-card.lime { background:var(--lime); }
.project-card.orange { background:var(--orange); }
.project-card.blue { background:var(--blue); color:white; }
.card-top { display:flex; font-size:1.2rem; font-weight:900; justify-content:space-between; }
.project-card h3 { font-size:clamp(2rem,3vw,3.2rem); letter-spacing:-.06em; line-height:.9; margin:0 0 1rem; text-transform:uppercase; }
.project-card p { font-weight:700; line-height:1.5; }
.project-card ul { display:flex; flex-wrap:wrap; gap:.45rem; list-style:none; margin:2rem 0 0; padding:0; }
.project-card li { border:1.5px solid currentColor; border-radius:99px; font-size:.65rem; font-weight:900; padding:.45rem .7rem; text-transform:uppercase; }

.journal-section { background:var(--ink); color:white; }
.journal-title span { color:var(--magenta); }
.article-list { border-top:1px solid #5b574f; margin-top:5rem; }
.article-list article { align-items:start; border-bottom:1px solid #5b574f; display:grid; gap:2rem; grid-template-columns:70px 1fr auto; padding:2.2rem 0; transition:.2s ease; }
.article-list article:hover { background:#26221c; padding-left:1rem; padding-right:1rem; }
.article-index,.article-date,.article-meta { color:#a7a197; font-size:.7rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.article-copy h3 { font-size:clamp(1.7rem,3vw,3rem); letter-spacing:-.04em; margin:.6rem 0 .8rem; }
.article-copy>p:last-child { color:#c8c2b9; line-height:1.55; margin:0; max-width:650px; }
.article-meta { align-items:center; display:flex; gap:2rem; }
.article-meta span:last-child { color:var(--lime); font-size:1.5rem; }

.media-section { background:#ffecf6; }
.media-heading h2 { color:var(--magenta); -webkit-text-stroke:2px var(--ink); }
.media-grid { display:grid; gap:1.25rem; grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(2,300px); }
.media-tile { border:2px solid var(--ink); display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; padding:1.25rem; position:relative; }
.media-tile-wide { grid-column:span 2; }
.media-label { font-size:.65rem; font-weight:900; letter-spacing:.12em; position:relative; z-index:2; }
.media-tile h3 { font-size:clamp(1.6rem,2.8vw,3rem); letter-spacing:-.05em; line-height:.95; margin:0; position:relative; z-index:2; }
.sunset { background:linear-gradient(145deg,#ff6b2b,#ffd524 52%,#ff3da2); }
.sun { background:var(--paper); border:2px solid var(--ink); border-radius:50%; height:180px; position:absolute; right:12%; top:25%; width:180px; }
.cobalt { background:var(--blue); color:white; }
.shape-stack { left:50%; position:absolute; top:48%; transform:translate(-50%,-50%) rotate(12deg); }
.shape-stack i { background:var(--lime); border:2px solid var(--ink); display:block; height:70px; margin-top:-38px; width:150px; }
.chartreuse { background:var(--lime); }
.play { align-items:center; background:var(--ink); border-radius:50%; color:white; display:flex; font-size:1.4rem; height:90px; justify-content:center; left:50%; padding-left:.3rem; position:absolute; top:50%; transform:translate(-50%,-50%); width:90px; }
.magenta { background:var(--magenta); }
.rings { border:18px solid var(--yellow); border-radius:50%; height:300px; position:absolute; right:-45px; top:-40px; width:300px; }
.rings::after { border:18px solid var(--blue); border-radius:50%; content:""; inset:36px; position:absolute; }

footer { background:var(--blue); color:white; padding:clamp(5rem,9vw,9rem) 4vw 2.5rem; }
footer h2 { font-size:clamp(5rem,12vw,12rem); }
footer h2 span { color:var(--lime); }
.footer-row { align-items:end; border-top:2px solid white; display:grid; gap:2rem; grid-template-columns:1fr 2fr 1fr; margin-top:7rem; padding-top:1.5rem; }
.footer-row a { font-size:.72rem; font-weight:900; letter-spacing:.1em; }
.footer-row a:last-child { justify-self:end; }
.footer-row p { font-size:.85rem; line-height:1.5; margin:0 auto; max-width:420px; text-align:center; }

@media (max-width:900px) {
  .site-header { grid-template-columns:1fr auto; } .site-header nav { display:none; } .hero { min-height:650px; }
  .hero h1 { font-size:clamp(4rem,15vw,8rem); } .section-heading { grid-template-columns:1fr; }
  .project-grid { grid-template-columns:1fr; } .project-card { min-height:350px; }
  .media-grid { grid-template-columns:1fr 1fr; grid-template-rows:repeat(3,280px); }
  .article-list article { grid-template-columns:45px 1fr; } .article-meta { grid-column:2; }
  .footer-row { grid-template-columns:1fr 1fr; } .footer-row p { display:none; }
}

@media (max-width:600px) {
  .site-header { min-height:64px; padding:0 1rem; } .round-link { height:36px; width:36px; }
  .hero { min-height:600px; padding:4rem 1rem 2rem; } .hero h1 { font-size:clamp(3.5rem,18vw,6rem); margin-top:4rem; }
  .hero h1 em { -webkit-text-stroke:1.5px var(--ink); } .hero-bottom { align-items:start; flex-direction:column; gap:2rem; margin-top:4rem; }
  .cta { justify-content:space-between; width:100%; } .ticker div { justify-content:flex-start; }
  .section { padding:5rem 1rem; } .section h2 { font-size:3.4rem; } .project-card { min-height:320px; }
  .article-list { margin-top:3rem; } .article-list article { gap:.5rem; grid-template-columns:30px 1fr; padding:1.6rem 0; }
  .article-meta { grid-column:2; justify-content:space-between; } .media-grid { display:flex; flex-direction:column; }
  .media-tile { min-height:280px; } footer { padding:5rem 1rem 2rem; } footer h2 { font-size:4.8rem; }
  .footer-row { margin-top:4rem; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none!important; } }