:root {
  --atelier-paper: #efe7d8;
  --atelier-cream: #f8f3e9;
  --atelier-ink: #232522;
  --atelier-muted: #66675f;
  --atelier-red: #9f3f2f;
  --atelier-red-dark: #6e2b22;
  --atelier-green: #2f5d50;
  --atelier-line: rgba(35, 37, 34, .22);
  --atelier-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --atelier-serif: Georgia, "Times New Roman", serif;
}

.atelier-home,
.portrait-page { margin: 0; color: var(--atelier-ink); background: var(--atelier-paper); font-family: var(--atelier-sans); }

.atelier-header {
  display: flex; width: min(1320px, calc(100% - 3rem)); min-height: 92px; align-items: center;
  justify-content: space-between; gap: 2rem; margin: 0 auto; border-bottom: 1px solid var(--atelier-line);
}
.atelier-brand { display: grid; text-decoration: none; line-height: 1.2; }
.atelier-brand strong { font: 700 1rem/1.2 var(--atelier-sans); letter-spacing: -.02em; }
.atelier-brand span { margin-top: .2rem; color: var(--atelier-muted); font-size: .63rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.atelier-nav { display: flex; flex-wrap: wrap; gap: clamp(.85rem, 2.3vw, 2rem); font-size: .78rem; font-weight: 750; letter-spacing: .04em; }
.atelier-nav a { padding: .4rem 0; text-decoration: none; border-bottom: 2px solid transparent; }
.atelier-nav a:hover, .atelier-nav a:focus-visible, .atelier-nav a[aria-current="page"] { color: var(--atelier-red); border-color: currentColor; }

.atelier-hero {
  position: relative; display: grid; width: min(1320px, calc(100% - 3rem)); min-height: 720px;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .38fr); align-items: center; gap: 5rem; margin: 0 auto; padding: 5rem 0 7rem;
}
.atelier-hero::after { position: absolute; right: 25%; bottom: 0; width: 1px; height: 34%; background: var(--atelier-line); content: ""; transform: rotate(19deg); transform-origin: bottom; }
.hero-number { position: absolute; top: 2rem; right: 0; color: rgba(35,37,34,.08); font: 700 clamp(7rem, 21vw, 19rem)/.8 var(--atelier-sans); letter-spacing: -.09em; }
.hero-copy { position: relative; z-index: 1; max-width: 850px; }
.kicker { margin: 0 0 1rem; color: var(--atelier-red); font-size: .7rem; font-weight: 800; letter-spacing: .18em; text-transform: uppercase; }
.hero-copy h1 { max-width: 850px; margin: 0; font: 400 clamp(4rem, 9.2vw, 9rem)/.82 var(--atelier-serif); letter-spacing: -.075em; }
.hero-copy > p:not(.kicker) { max-width: 690px; margin: 2.5rem 0; color: var(--atelier-muted); font: 400 clamp(1.05rem, 1.8vw, 1.35rem)/1.55 var(--atelier-serif); }
.atelier-button { display: inline-flex; align-items: center; gap: 2rem; padding: .9rem 1.1rem; border: 1px solid var(--atelier-ink); background: var(--atelier-ink); color: var(--atelier-cream); font-size: .82rem; font-weight: 750; text-decoration: none; }
.atelier-button:hover, .atelier-button:focus-visible { background: var(--atelier-red); border-color: var(--atelier-red); }
.hero-note { position: relative; z-index: 2; align-self: end; max-width: 320px; margin-bottom: 3rem; padding: 1.6rem; background: #d8c69c; box-shadow: 9px 12px 0 rgba(35,37,34,.1); transform: rotate(2deg); }
.hero-note span { font-size: .62rem; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.hero-note p { margin: .8rem 0 0; font: italic 1.03rem/1.5 var(--atelier-serif); }

.atelier-section { width: min(1320px, calc(100% - 3rem)); margin: 0 auto; padding: 8rem 0; }
.section-marker { display: flex; align-items: center; gap: 1rem; margin-bottom: 4rem; border-top: 1px solid var(--atelier-line); }
.section-marker span { min-width: 3rem; padding-top: .8rem; color: var(--atelier-red); font-size: .72rem; font-weight: 850; }
.section-marker p { margin: 0; padding-top: .8rem; font-size: .72rem; font-weight: 850; letter-spacing: .16em; text-transform: uppercase; }
.section-lead { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(260px, .55fr); align-items: end; gap: 4rem; margin-bottom: 4rem; }
.section-lead h2, .portrait-copy h2, .eve-grid h2, .next-portrait h2 { margin: 0; font: 400 clamp(2.9rem, 6vw, 6.4rem)/.92 var(--atelier-serif); letter-spacing: -.06em; }
.section-lead > p { margin: 0; color: var(--atelier-muted); font: 400 1.08rem/1.55 var(--atelier-serif); }

.selected-works { background: var(--atelier-cream); box-shadow: 0 0 0 100vmax var(--atelier-cream); clip-path: inset(0 -100vmax); }
.works-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 1.4rem; }
.work-card { min-width: 0; }
.work-card a { display: grid; height: 100%; grid-template-rows: 420px 1fr; color: inherit; background: var(--atelier-paper); text-decoration: none; }
.work-card img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.82) contrast(1.03); transition: filter 250ms ease, transform 450ms ease; }
.work-card a:hover img { filter: saturate(1.05) contrast(1.03); transform: scale(1.015); }
.work-card a { overflow: hidden; }
.work-card div { position: relative; z-index: 1; padding: 1.7rem; background: var(--atelier-paper); }
.work-card span { color: var(--atelier-red); font-size: .64rem; font-weight: 850; letter-spacing: .15em; text-transform: uppercase; }
.work-card h3 { max-width: 620px; margin: .6rem 0 .8rem; font: 400 clamp(1.8rem, 3.7vw, 3.7rem)/.98 var(--atelier-serif); letter-spacing: -.045em; }
.work-card p { max-width: 560px; margin: 0; color: var(--atelier-muted); font-size: .86rem; }
.work-wide { grid-row: span 2; }
.work-wide a { grid-template-rows: minmax(540px, 1fr) auto; }

.portrait-invite { display: grid; grid-template-columns: minmax(330px, .85fr) minmax(0, 1.15fr); min-height: 760px; background: var(--atelier-red); color: var(--atelier-cream); }
.portrait-crop { min-height: 640px; overflow: hidden; background: #bfc2b1; }
.portrait-crop img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 25%; filter: saturate(.9); }
.portrait-copy { display: flex; max-width: 760px; flex-direction: column; justify-content: center; padding: clamp(3rem, 8vw, 8rem); }
.portrait-copy .kicker { color: #e8cba8; }
.portrait-copy p:not(.kicker) { max-width: 570px; margin: 2rem 0; color: rgba(248,243,233,.76); font: 1.1rem/1.6 var(--atelier-serif); }
.text-link { align-self: flex-start; padding: .6rem 0; border-bottom: 1px solid currentColor; font-size: .82rem; font-weight: 800; text-decoration: none; }

.lab { padding-bottom: 9rem; }
.lab-list { border-top: 1px solid var(--atelier-line); }
.lab-list a { display: grid; grid-template-columns: 4rem minmax(0, 1.6fr) minmax(160px, .6fr) 2rem; align-items: center; gap: 1rem; padding: 1.6rem 0; border-bottom: 1px solid var(--atelier-line); color: inherit; text-decoration: none; }
.lab-list a:hover, .lab-list a:focus-visible { color: var(--atelier-red); }
.lab-list span, .lab-list em { color: var(--atelier-muted); font-size: .72rem; font-style: normal; }
.lab-list strong { font: 400 clamp(1.25rem, 2.2vw, 2rem)/1.1 var(--atelier-serif); }
.lab-list b { font-size: 1.3rem; font-weight: 400; }

.eve-section { padding: 8rem max(1.5rem, calc((100% - 1320px) / 2)); background: var(--atelier-green); color: var(--atelier-cream); }
.eve-section .section-marker { border-color: rgba(248,243,233,.28); }
.eve-section .section-marker span { color: #d6b989; }
.eve-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .65fr); align-items: start; gap: clamp(3rem, 10vw, 9rem); }
.eve-grid h2 { font-size: clamp(2.5rem, 5.3vw, 5.6rem); }
.eve-grid > div { color: rgba(248,243,233,.78); font: 1.08rem/1.65 var(--atelier-serif); }
.eve-grid > div p:first-child { margin-top: 0; }
.privacy-note { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid rgba(248,243,233,.25); font: 700 .72rem/1.5 var(--atelier-sans); letter-spacing: .06em; text-transform: uppercase; }
.atelier-footer { display: flex; width: min(1320px, calc(100% - 3rem)); justify-content: space-between; gap: 2rem; margin: 0 auto; padding: 2rem 0; color: var(--atelier-muted); font-size: .72rem; }
.atelier-footer p { margin: 0; }

.zero-feature { position: relative; display: grid; min-height: 670px; grid-template-columns: minmax(300px,.8fr) minmax(0,1.2fr); align-items:center; gap:clamp(3rem,8vw,8rem); padding:7rem max(1.5rem,calc((100% - 1320px)/2)); overflow:hidden; background:#171915; color:#efeade; }
.zero-feature::before { position:absolute; width:42rem; height:42rem; right:-18rem; bottom:-28rem; border:1px dashed rgba(200,255,61,.24); border-radius:50%; content:""; }
.zero-feature-code { display:grid; width:min(100%,510px); aspect-ratio:1; grid-template-columns:repeat(4,1fr); grid-template-rows:repeat(4,1fr); border:1px solid rgba(239,234,222,.22); background:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px),#252820; background-size:25% 25%; transform:rotate(-3deg); box-shadow:18px 20px 0 rgba(200,255,61,.08); }
.zero-feature-code>* { display:grid; place-items:center; font-style:normal; }
.zero-feature-code span { grid-column:1; grid-row:4; color:#ff7043; font:900 clamp(3rem,7vw,6rem)/1 var(--atelier-sans); }
.zero-feature-code i:nth-of-type(1) { grid-column:2; grid-row:4; border-top:9px solid #c8ff3d; transform:rotate(-45deg); }
.zero-feature-code i:nth-of-type(2) { grid-column:2; grid-row:3; background:radial-gradient(circle,#ff7043 0 13%,transparent 15%); }
.zero-feature-code i:nth-of-type(3) { grid-column:2; grid-row:2; border-top:9px solid #c8ff3d; transform:rotate(45deg); }
.zero-feature-code b { grid-column:3; grid-row:2; color:#ff7043; font:900 4rem/1 var(--atelier-sans); }
.zero-feature-code i:nth-of-type(4) { grid-column:4; grid-row:2; background:repeating-linear-gradient(45deg,transparent 0 7px,rgba(255,255,255,.12) 7px 14px); }
.zero-feature-code i:nth-of-type(5) { grid-column:3; grid-row:1; background:radial-gradient(circle,#65d6ff 0 11%,transparent 13%); }
.zero-feature-code strong { grid-column:4; grid-row:1; color:#c8ff3d; font:400 4rem/1 var(--atelier-sans); }
.zero-feature-copy { position:relative; z-index:1; max-width:700px; }
.zero-feature-copy .kicker { color:#c8ff3d; }
.zero-feature-copy h2 { margin:0; font:900 clamp(4rem,10vw,9rem)/.78 var(--atelier-sans); letter-spacing:-.09em; text-transform:uppercase; }
.zero-feature-copy>p:not(.kicker) { max-width:580px; margin:2rem 0; color:rgba(239,234,222,.72); font:1.05rem/1.65 var(--atelier-sans); }
.zero-feature-link { display:inline-flex; align-items:center; gap:2.5rem; padding:1rem 1.2rem; background:#ff7043; color:#171915; font-size:.75rem; font-weight:900; letter-spacing:.05em; text-decoration:none; text-transform:uppercase; }
.zero-feature-link:hover,.zero-feature-link:focus-visible { background:#c8ff3d; }
.zero-feature-stamp { position:absolute; right:3rem; bottom:3rem; padding:.7rem 1rem; border:4px double #ff7043; color:#ff7043; font-size:.9rem; font-weight:900; line-height:.95; text-align:center; transform:rotate(-8deg); }

.minions-invite { display:grid; min-height:700px; grid-template-columns:minmax(0,1fr) minmax(420px,.85fr); align-items:center; gap:clamp(3rem,8vw,8rem); padding:7rem max(1.5rem,calc((100% - 1320px)/2)); overflow:hidden; background:#d7d0ff; color:#211f27; }
.minions-invite-copy { position:relative; z-index:2; max-width:730px; }
.minions-invite-copy .kicker { color:#7048c8; }
.minions-invite-copy h2 { margin:0; font:900 clamp(4.2rem,9vw,8.5rem)/.8 var(--atelier-sans); letter-spacing:-.085em; text-transform:uppercase; }
.minions-invite-copy h2 span { color:#ef5b39; }
.minions-invite-copy>p:not(.kicker) { max-width:590px; margin:2rem 0; color:#55505f; font:1.08rem/1.6 var(--atelier-serif); }
.minions-invite-link { display:inline-flex; align-items:center; gap:2.5rem; padding:1rem 1.2rem; background:#211f27; color:#f8f3e9; font-size:.75rem; font-weight:900; letter-spacing:.05em; text-decoration:none; text-transform:uppercase; }
.minions-invite-link:hover,.minions-invite-link:focus-visible { background:#7048c8; }
.minions-invite-board { position:relative; width:min(100%,560px); aspect-ratio:1; border:1px solid rgba(33,31,39,.2); border-radius:50%; background:radial-gradient(circle at center,rgba(255,255,255,.72) 0 8%,transparent 8.5%),repeating-radial-gradient(circle at center,transparent 0 16%,rgba(33,31,39,.08) 16.2% 16.5%,transparent 16.8% 24%); }
.minions-invite-board::before,.minions-invite-board::after { position:absolute; top:50%; left:50%; background:rgba(33,31,39,.18); content:""; transform:translate(-50%,-50%) rotate(-14deg); }
.minions-invite-board::before { width:82%; height:1px; }
.minions-invite-board::after { width:1px; height:82%; }
.minion-node { position:absolute; display:grid; width:clamp(92px,12vw,132px); aspect-ratio:1; place-content:center; border:1px solid #211f27; border-radius:50%; background:#f8f3e9; box-shadow:9px 10px 0 rgba(33,31,39,.12); text-align:center; }
.minion-node b { font-size:.67rem; letter-spacing:.08em; }
.minion-node i { color:#7048c8; font:italic .8rem/1 var(--atelier-serif); }
.node-code { top:5%; left:39%; }
.node-image { top:35%; right:0; background:#ef5b39; color:#211f27; transform:rotate(5deg); }
.node-tools { right:12%; bottom:3%; transform:rotate(-4deg); }
.node-judge { bottom:8%; left:7%; background:#211f27; color:#f8f3e9; transform:rotate(3deg); }
.node-synthesis { top:32%; left:-2%; background:#c9ff63; transform:rotate(-6deg); }
.duel-invite { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr); min-height:680px; background:#211f27; color:#f8f3e9; }
.duel-invite-image { min-height:560px; overflow:hidden; }
.duel-invite-image img { width:100%; height:100%; object-fit:cover; filter:saturate(.8) contrast(1.05); transition:transform .5s ease; }
.duel-invite-image:hover img,.duel-invite-image:focus-visible img { transform:scale(1.025); }
.duel-invite-copy { align-self:center; padding:clamp(3rem,7vw,7rem); }
.duel-invite-copy .kicker { color:#c9ff63; }
.duel-invite-copy h2 { margin:.2rem 0 1.5rem; font:900 clamp(3rem,6vw,6rem)/.88 var(--atelier-sans); letter-spacing:-.07em; text-transform:uppercase; }
.duel-invite-copy>p:not(.kicker) { color:rgba(248,243,233,.76); font:1.08rem/1.6 var(--atelier-serif); }
.duel-invite-link { display:inline-flex; margin-top:1.4rem; padding:1rem 1.2rem; gap:2rem; background:#c9ff63; color:#211f27; text-decoration:none; font-size:.75rem; font-weight:900; letter-spacing:.06em; text-transform:uppercase; }
.duel-invite-link:hover,.duel-invite-link:focus-visible { background:#d7d0ff; }

.portrait-page { background: var(--atelier-cream); }
.portrait-hero { width: min(1320px, calc(100% - 3rem)); margin: 0 auto; padding: 7rem 0 6rem; }
.portrait-hero h1 { margin: 0; font: 400 clamp(4.7rem, 13vw, 12rem)/.78 var(--atelier-serif); letter-spacing: -.08em; }
.portrait-hero h1 span { color: var(--atelier-red); }
.portrait-manifesto { display: grid; max-width: 860px; grid-template-columns: 1fr 1fr; gap: 2rem; margin: 5rem 0 0 auto; color: var(--atelier-muted); font: 1.08rem/1.6 var(--atelier-serif); }
.portrait-manifesto p { margin: 0; }
.portrait-entry { display: grid; width: min(1320px, calc(100% - 3rem)); grid-template-columns: 170px minmax(380px, .95fr) minmax(300px, .7fr); align-items: start; gap: clamp(2rem, 5vw, 5rem); margin: 0 auto; padding: 6rem 0 9rem; border-top: 1px solid var(--atelier-line); }
.portrait-meta { position: sticky; top: 1rem; }
.portrait-meta p { display: grid; gap: .15rem; margin: 0; padding: .8rem 0; border-bottom: 1px solid var(--atelier-line); }
.portrait-meta span { color: var(--atelier-muted); font-size: .62rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.portrait-meta strong { font-size: .78rem; }
.portrait-figure { margin: 0; }
.portrait-figure img { width: 100%; height: auto; background: #c8c8b9; }
.portrait-figure figcaption { margin-top: .75rem; color: var(--atelier-muted); font-size: .68rem; }
.portrait-reading { padding-top: 3rem; }
.portrait-reading > div { margin-bottom: 3rem; }
.portrait-reading > div > p:not(.kicker) { margin: 0; color: var(--atelier-muted); font: 1.05rem/1.65 var(--atelier-serif); }
.portrait-reading blockquote { margin: 5rem 0 0; padding: 1.5rem 0 0; border-top: 3px solid var(--atelier-red); font: italic 1.55rem/1.4 var(--atelier-serif); }
.next-portrait { display: grid; grid-template-columns: .35fr 1fr; gap: 3rem; padding: 7rem max(1.5rem, calc((100% - 1320px) / 2)); background: var(--atelier-ink); color: var(--atelier-cream); }
.next-portrait > span { color: rgba(248,243,233,.15); font: 700 clamp(5rem, 14vw, 12rem)/.75 var(--atelier-sans); letter-spacing: -.08em; }
.next-portrait h2 { max-width: 850px; font-size: clamp(2.5rem, 5.5vw, 5.5rem); }

@media (max-width: 850px) {
  .atelier-header { width: min(100% - 2rem, 1320px); min-height: 112px; align-items: flex-start; flex-direction: column; justify-content: center; gap: .7rem; }
  .atelier-nav { width: 100%; justify-content: space-between; gap: .55rem; }
  .atelier-hero, .section-lead, .portrait-invite, .eve-grid, .portrait-entry { grid-template-columns: 1fr; }
  .zero-feature { grid-template-columns:1fr; }
  .minions-invite,.duel-invite { grid-template-columns:1fr; }
  .minions-invite-board { max-width:500px; margin:0 auto; }
  .zero-feature-code { max-width:430px; }
  .atelier-hero { width: min(100% - 2rem, 1320px); min-height: 650px; gap: 2rem; padding: 5rem 0; }
  .hero-number { top: 3rem; font-size: 11rem; }
  .hero-note { align-self: auto; margin: 0 0 0 auto; }
  .atelier-section, .portrait-hero, .portrait-entry { width: min(100% - 2rem, 1320px); padding-top: 5rem; padding-bottom: 5rem; }
  .section-lead { align-items: start; gap: 1.5rem; }
  .works-grid { grid-template-columns: 1fr; }
  .work-card a, .work-wide a { grid-template-rows: 380px auto; }
  .work-wide { grid-row: auto; }
  .portrait-invite { min-height: 0; }
  .portrait-crop { min-height: 520px; max-height: 75vh; }
  .portrait-copy { padding: 4rem 1.5rem; }
  .lab-list a { grid-template-columns: 2rem 1fr 1.5rem; }
  .lab-list em { display: none; }
  .eve-section { padding-top: 5rem; padding-bottom: 5rem; }
  .portrait-manifesto { grid-template-columns: 1fr; margin-top: 3rem; }
  .portrait-entry { gap: 2rem; }
  .portrait-meta { position: static; display: grid; grid-template-columns: repeat(3, 1fr); }
  .portrait-meta p { padding-right: .8rem; border-right: 1px solid var(--atelier-line); }
  .portrait-reading { padding-top: 1rem; }
  .next-portrait { grid-template-columns: 1fr; padding-top: 5rem; padding-bottom: 5rem; }
}

@media (max-width: 520px) {
  .atelier-nav { overflow-x: auto; justify-content: flex-start; padding-bottom: .2rem; }
  .atelier-nav a { flex: 0 0 auto; }
  .hero-copy h1 { font-size: clamp(3.4rem, 18vw, 5rem); }
  .hero-note { max-width: 88%; }
  .section-marker { margin-bottom: 2.8rem; }
  .work-card a, .work-wide a { grid-template-rows: 280px auto; }
  .portrait-crop { min-height: 430px; }
  .lab-list strong { font-size: 1.1rem; }
  .portrait-hero { padding-top: 5rem; }
  .portrait-hero h1 { font-size: clamp(3.8rem, 20vw, 6.5rem); }
  .portrait-meta { grid-template-columns: 1fr; }
  .portrait-meta p { border-right: 0; }
  .atelier-footer { width: min(100% - 2rem, 1320px); align-items: flex-start; flex-direction: column; }
  .zero-feature { padding-right:1rem; padding-left:1rem; }
  .zero-feature-code { width:92%; }
  .zero-feature-stamp { right:1rem; bottom:1.5rem; font-size:.7rem; }
  .minions-invite { padding-right:1rem; padding-left:1rem; }
  .minions-invite-copy h2 { font-size:clamp(3.4rem,17vw,5rem); }
  .minion-node { width:88px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
