:root {
  --press-ink: #30212a;
  --press-muted: #765f6b;
  --press-line: rgba(113, 58, 82, .14);
  --press-carmine: #cf3476;
  --press-rose: #fff0f6;
}

.press-main { min-height: 70vh; background: linear-gradient(155deg, #fff 0%, #fff9fb 54%, #fff8ec 100%); color: var(--press-ink); }
.press-hero { min-height: 52vh; display: grid; align-content: end; padding: clamp(8rem, 14vw, 12rem) clamp(1.5rem, 6vw, 6rem) clamp(3rem, 6vw, 5.5rem); border-bottom: 1px solid var(--press-line); background: radial-gradient(circle at 78% 30%, rgba(207,52,118,.16), transparent 24rem), radial-gradient(circle at 92% 75%, rgba(231,184,80,.16), transparent 18rem); }
.press-hero > span, .press-heading > span, .postcard-intro > div > span, .postcard-reading span, .postcard-tools > div > span, .postcard-code > span, .postcard-sources span { color: var(--press-carmine); font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.press-hero h1 { max-width: 14ch; margin: .85rem 0 1rem; font: 600 clamp(4.2rem, 10vw, 9rem)/.84 "Instrument Sans", sans-serif; letter-spacing: -.08em; }
.press-hero p { max-width: 48rem; margin: 0; color: var(--press-muted); font-size: clamp(1rem, 1.8vw, 1.35rem); line-height: 1.55; }
.press-gallery { padding: clamp(3rem, 7vw, 7rem) clamp(1rem, 5vw, 5rem); }
.press-heading h2 { max-width: 16ch; margin: .65rem 0 2.2rem; font-size: clamp(2.5rem, 5vw, 5rem); line-height: .95; letter-spacing: -.06em; }
.press-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.press-card { position: relative; min-height: 34rem; display: flex; flex-direction: column; overflow: hidden; padding: 1.6rem; border: 1px solid var(--press-line); border-radius: 2rem; background: rgba(255,255,255,.82); box-shadow: 0 2rem 6rem rgba(91,38,62,.06); }
.press-card > span { position: relative; color: var(--card-accent); font-size: .68rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }
.press-card h2 { position: relative; max-width: 12ch; margin: 8.5rem 0 1rem; font-size: clamp(2rem, 3.2vw, 3.7rem); line-height: .94; letter-spacing: -.06em; }
.press-card h2 a { color: inherit; text-decoration: none; }
.press-card p { position: relative; color: var(--press-muted); line-height: 1.5; }
.press-card > div:last-child { position: relative; display: flex; flex-wrap: wrap; gap: .75rem 1.1rem; margin-top: auto; }
.press-card > div:last-child a { color: var(--card-accent); font-size: .74rem; font-weight: 600; letter-spacing: .07em; text-decoration: none; text-transform: uppercase; }
.press-card--rose { --card-accent: #cf3476; background: radial-gradient(circle at 78% 18%, rgba(241,153,188,.3), transparent 12rem), #fff; }
.press-card--teal { --card-accent: #277f7d; background: radial-gradient(circle at 78% 18%, rgba(83,176,169,.24), transparent 12rem), #fff; }
.press-card--gold { --card-accent: #a66e08; background: radial-gradient(circle at 78% 18%, rgba(232,184,82,.27), transparent 12rem), #fff; }
.press-card-art { position: absolute !important; top: 1.4rem; right: 1.4rem; width: 11rem; height: 11rem; border: 1px solid color-mix(in srgb, var(--card-accent) 18%, transparent); border-radius: 50%; }
.press-card-art i { position: absolute; border: 1px solid color-mix(in srgb, var(--card-accent) 25%, transparent); border-radius: 50%; }
.press-card-art i:nth-child(1) { inset: 18%; }
.press-card-art i:nth-child(2) { width: 32%; height: 32%; top: 8%; right: 4%; background: color-mix(in srgb, var(--card-accent) 13%, transparent); }
.press-card-art i:nth-child(3) { width: 18%; height: 18%; left: 5%; bottom: 14%; background: color-mix(in srgb, var(--card-accent) 23%, transparent); }
.press-principles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--press-line); border-bottom: 1px solid var(--press-line); background: rgba(255,255,255,.62); }
.press-principles article { min-height: 13rem; padding: 2rem; border-right: 1px solid var(--press-line); }
.press-principles article:last-child { border-right: 0; }
.press-principles strong { color: var(--press-carmine); font-size: 1.25rem; }
.press-principles p { color: var(--press-muted); line-height: 1.55; }

.postcard-intro { min-height: 49vh; display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(16rem, .5fr); align-items: end; gap: 3rem; padding: clamp(8rem, 12vw, 11rem) clamp(1.5rem, 6vw, 6rem) 3.5rem; }
.postcard-intro h1 { max-width: 15ch; margin: .8rem 0 1.2rem; font-size: clamp(3.2rem, 7vw, 7rem); line-height: .88; letter-spacing: -.07em; }
.postcard-intro p { max-width: 50rem; color: var(--press-muted); font-size: clamp(1rem, 1.6vw, 1.3rem); line-height: 1.55; }
.postcard-date { align-self: end; display: grid; padding: 1.4rem; border: 1px solid var(--press-line); border-radius: 1.4rem; background: rgba(255,255,255,.72); }
.postcard-date span, .postcard-date small { color: var(--press-muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; }
.postcard-date strong { margin: .8rem 0; font-size: 1.3rem; }
.postcard-stage { padding: 0 clamp(1rem, 4vw, 4rem) clamp(2rem, 5vw, 5rem); }
.postcard-stage svg { display: block; width: 100%; height: auto; border-radius: clamp(1rem, 2vw, 2.4rem); box-shadow: 0 2rem 7rem rgba(83,35,56,.1); }
.postcard-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0 clamp(1rem, 4vw, 4rem) clamp(3rem, 7vw, 7rem); border: 1px solid var(--press-line); border-radius: 1.7rem; overflow: hidden; background: rgba(255,255,255,.78); }
.postcard-metrics > div { min-height: 12rem; display: flex; flex-direction: column; padding: 1.5rem; border-right: 1px solid var(--press-line); }
.postcard-metrics > div:last-child { border-right: 0; }
.postcard-metrics strong { color: var(--press-carmine); font-size: clamp(2.3rem, 4vw, 4.6rem); font-weight: 500; letter-spacing: -.07em; }
.postcard-metrics span { margin-top: auto; font-weight: 600; }
.postcard-metrics small { margin-top: .4rem; color: var(--press-muted); }
.postcard-reading { display: grid; grid-template-columns: 1.25fr .75fr; gap: 1px; background: var(--press-line); border-top: 1px solid var(--press-line); border-bottom: 1px solid var(--press-line); }
.postcard-reading article { min-height: 23rem; padding: clamp(2rem, 6vw, 6rem); background: #fff; }
.postcard-reading h2 { max-width: 24ch; margin-top: 1.5rem; font-size: clamp(2.2rem, 4.5vw, 4.8rem); line-height: .98; letter-spacing: -.055em; }
.postcard-reading p { max-width: 34rem; margin-top: 1.5rem; color: var(--press-muted); font-size: 1.15rem; line-height: 1.65; }
.postcard-tools { display: grid; grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); gap: 2rem 4rem; padding: clamp(3rem, 7vw, 7rem) clamp(1.5rem, 6vw, 6rem); background: linear-gradient(145deg, #fff6fa, #fff); }
.postcard-tools h2 { margin: .8rem 0; font-size: clamp(2.5rem, 5vw, 5rem); line-height: .94; letter-spacing: -.06em; }
.postcard-tools p { color: var(--press-muted); line-height: 1.55; }
.postcard-actions { display: flex; flex-wrap: wrap; align-content: start; gap: .65rem; }
.postcard-actions a, .postcard-actions button { min-height: 3.25rem; display: inline-flex; align-items: center; padding: .8rem 1.1rem; border: 1px solid rgba(207,52,118,.2); border-radius: 999px; background: white; color: var(--press-ink); font: 600 .76rem/1 "Instrument Sans", sans-serif; letter-spacing: .04em; text-decoration: none; cursor: pointer; }
.postcard-actions .postcard-primary { border-color: var(--press-carmine); background: var(--press-carmine); color: white; }
.postcard-code { display: grid; gap: .65rem; }
.postcard-code textarea { min-height: 7.5rem; resize: vertical; padding: 1rem; border: 1px solid var(--press-line); border-radius: 1rem; background: rgba(255,255,255,.86); color: #5e4d56; font: .78rem/1.5 ui-monospace, SFMono-Regular, Consolas, monospace; }
.postcard-sources { display: grid; grid-template-columns: 1.2fr .8fr; gap: 4rem; padding: clamp(3rem, 7vw, 7rem) clamp(1.5rem, 6vw, 6rem); border-top: 1px solid var(--press-line); }
.postcard-sources h2 { max-width: 34ch; margin-top: 1.2rem; font-size: clamp(1.8rem, 3vw, 3.4rem); line-height: 1.05; letter-spacing: -.04em; }
.postcard-sources nav { display: grid; align-content: start; }
.postcard-sources nav a { padding: 1rem 0; border-bottom: 1px solid var(--press-line); color: var(--press-carmine); text-decoration: none; }
.postcard-next { display: flex; flex-wrap: wrap; gap: 1rem 2rem; padding: 2rem clamp(1.5rem, 6vw, 6rem) 5rem; }
.postcard-next a { color: var(--press-carmine); font-weight: 600; text-decoration: none; }

@media (min-width: 621px) {
  .press-hero { box-sizing: border-box; min-height: 0; padding-top: clamp(6.25rem, 8vw, 7rem); padding-bottom: clamp(2.5rem, 4vw, 3.5rem); }
  .press-gallery { padding-top: clamp(3rem, 4vw, 4rem); }
}

@media (max-width: 980px) {
  .press-grid { grid-template-columns: 1fr; }
  .press-card { min-height: 27rem; }
  .press-principles, .postcard-metrics { grid-template-columns: repeat(2, 1fr); }
  .press-principles article:nth-child(2), .postcard-metrics > div:nth-child(2) { border-right: 0; }
  .press-principles article:nth-child(-n+2), .postcard-metrics > div:nth-child(-n+2) { border-bottom: 1px solid var(--press-line); }
  .postcard-intro, .postcard-reading, .postcard-tools, .postcard-sources { grid-template-columns: 1fr; }
  .postcard-reading article { min-height: auto; }
}

@media (max-width: 620px) {
  .press-hero { min-height: 44vh; padding-top: 7rem; }
  .press-hero h1 { font-size: clamp(3.4rem, 18vw, 5.2rem); }
  .press-gallery { padding-inline: 1rem; }
  .press-card { min-height: 25rem; padding: 1.35rem; border-radius: 1.5rem; }
  .press-card h2 { margin-top: 7rem; }
  .press-card-art { width: 8.5rem; height: 8.5rem; }
  .press-principles { grid-template-columns: 1fr; }
  .press-principles article { min-height: 0; border-right: 0; border-bottom: 1px solid var(--press-line); }
  .postcard-intro { min-height: 0; padding-top: 7.5rem; gap: 1.5rem; }
  .postcard-intro h1 { font-size: clamp(3rem, 15vw, 4.7rem); }
  .postcard-stage { padding-inline: .5rem; overflow: hidden; }
  .postcard-stage svg { width: 160%; max-width: none; transform: translateX(-4%); transform-origin: left center; }
  .postcard-metrics { grid-template-columns: 1fr 1fr; margin-inline: 1rem; }
  .postcard-metrics > div { min-height: 9rem; padding: 1rem; }
  .postcard-reading article, .postcard-tools, .postcard-sources { padding-inline: 1.25rem; }
  .postcard-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .postcard-actions a, .postcard-actions button { justify-content: center; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .press-card, .postcard-actions * { scroll-behavior: auto; }
}
