@import 'tailwindcss';

:root {
  --ink: #0b1020;
  --ground: #f6f8fc;
  --surface: #eaf0f8;
  --surface-2: #dfe7f4;
  --orange: #2457d6;
  --muted: #566176;
  --line: rgba(11, 16, 32, .14);
  --accent-strong: #183a99;
  --accent-soft: #dbe6ff;
  --paper: #ffffff;
  --shadow: rgba(11, 16, 32, .12);
  --control-line: #8390a4;
  --page: clamp(20px, 4vw, 64px);
  --radius: 18px;
  --radius-lg: 28px;
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  color-scheme: light;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { background: var(--ground); scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; background: var(--ground); color: var(--ink); font-family: "Manrope Variable", Manrope, "Segoe UI", sans-serif; margin: 0; overflow-x: hidden; text-rendering: optimizeLegibility; }
body::before { background-image: linear-gradient(rgba(36,87,214,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(36,87,214,.045) 1px, transparent 1px); background-size: 32px 32px; content: ''; inset: 0; opacity: .28; pointer-events: none; position: fixed; z-index: 1000; }
h1, h2, h3, .wordmark, .footer-mark, .mobile-menu nav a { font-family: "Space Grotesk Variable", "Space Grotesk", "Segoe UI", sans-serif; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button, summary, a { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; }
::selection { background: var(--orange); color: #fff; }
:focus-visible { outline: 2px solid var(--orange); outline-offset: 4px; }
.sr-only { height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.section-shell { padding: clamp(66px, 8vw, 112px) var(--page); }
.page-kicker { color: var(--orange); display: block; font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.button-link { border: 1px solid var(--orange); border-radius: 999px; color: var(--orange); display: inline-block; font-size: 10px; font-weight: 750; letter-spacing: .1em; padding: 15px 20px; text-transform: uppercase; transition: background .25s var(--ease-out), border-color .25s var(--ease-out), color .25s var(--ease-out), transform .25s var(--ease-out); }
.button-link:hover { background: var(--orange); border-color: var(--orange); color: #fff; }
.button-link:active { transform: translateY(1px); }

/* Header */
.site-header { align-items: center; backdrop-filter: blur(22px); background: rgba(246, 248, 252, .88); border-bottom: 1px solid rgba(11, 16, 32, .1); box-shadow: 0 8px 34px rgba(11, 16, 32, .07); display: grid; grid-template-columns: 1fr auto 1fr; min-height: 80px; padding: 0 var(--page); position: sticky; top: 0; z-index: 100; }
.wordmark { font-size: 26px; font-weight: 760; justify-self: start; letter-spacing: -.055em; }
.wordmark span { font-size: .6em; font-weight: 620; letter-spacing: .02em; text-transform: uppercase; }
.wordmark span, .footer-mark span { color: var(--orange); }
.desktop-nav { display: flex; gap: clamp(17px, 2.6vw, 40px); }
.desktop-nav a, .header-action { font-size: 10px; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; }
.desktop-nav a { position: relative; }
.desktop-nav a::after { background: var(--orange); bottom: -8px; content: ''; height: 2px; left: 0; position: absolute; transform: scaleX(0); transform-origin: left; transition: transform .25s var(--ease-out); width: 100%; }
.desktop-nav a:hover { color: var(--orange); }
.desktop-nav a:hover::after, .desktop-nav a:focus-visible::after { transform: scaleX(1); }
.header-action { background: var(--orange); border: 1px solid var(--orange); border-radius: 999px; color: #fff; justify-self: end; padding: 12px 18px; transition: background .2s ease, border-color .2s ease, transform .2s var(--ease-out); }
.header-action:hover { background: var(--accent-strong); border-color: var(--accent-strong); color: #fff; }
.header-action:active { transform: translateY(1px); }
.mobile-menu { display: none; justify-self: end; }
.mobile-menu summary { align-items: center; border: 1px solid var(--line); cursor: pointer; display: flex; flex-direction: column; gap: 6px; height: 42px; justify-content: center; list-style: none; width: 44px; }
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu summary i { background: var(--ink); display: block; height: 1px; transition: transform .2s ease; width: 18px; }
.mobile-menu[open] summary i:first-of-type { transform: translateY(3.5px) rotate(45deg); }
.mobile-menu[open] summary i:last-of-type { transform: translateY(-3.5px) rotate(-45deg); }
.mobile-menu nav { background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 18px 38px var(--shadow); display: flex; flex-direction: column; left: 0; padding: 24px var(--page) 34px; position: absolute; right: 0; top: 100%; }
.mobile-menu nav a { border-bottom: 1px solid var(--line); font-size: clamp(24px, 8vw, 42px); font-weight: 700; letter-spacing: -.04em; padding: 12px 0; }

/* Home */
.hero { background: #081022; color: #fff; display: flex; flex-direction: column; isolation: isolate; min-height: clamp(680px, calc(100svh - 80px), 900px); overflow: hidden; padding: clamp(30px, 4vw, 52px) var(--page) 0; position: relative; }
.hero-media { inset: 0; position: absolute; z-index: -3; }
.hero-media img { filter: saturate(.78) contrast(1.07); height: 100%; object-fit: cover; object-position: center 48%; transform: scale(1.015); width: 100%; }
.hero::before { background: linear-gradient(90deg, rgba(5, 11, 25, .94) 0%, rgba(5, 11, 25, .8) 43%, rgba(5, 11, 25, .24) 76%, rgba(5, 11, 25, .14) 100%), linear-gradient(180deg, rgba(5, 11, 25, .28) 0%, rgba(5, 11, 25, .04) 45%, rgba(5, 11, 25, .88) 100%); content: ''; inset: 0; position: absolute; z-index: -2; }
.hero::after { background: radial-gradient(circle at 78% 24%, rgba(71, 119, 255, .3), transparent 28%); border: 1px solid rgba(255,255,255,.12); content: ''; inset: 14px; pointer-events: none; position: absolute; z-index: -1; }
.hero-status { align-items: center; align-self: flex-start; backdrop-filter: blur(14px); background: rgba(8, 16, 34, .46); border: 1px solid rgba(255,255,255,.2); border-radius: 999px; display: flex; font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; font-size: 10px; font-weight: 700; gap: 10px; letter-spacing: .1em; padding: 10px 14px; position: relative; text-transform: uppercase; z-index: 1; }
.hero-status span { background: #8bb0ff; border-radius: 50%; box-shadow: 0 0 18px rgba(139, 176, 255, .85); height: 7px; width: 7px; }
.hero-grid { align-items: end; display: grid; gap: clamp(34px, 6vw, 96px); grid-template-columns: minmax(0, 1.45fr) minmax(270px, .55fr); margin-top: auto; padding-top: clamp(110px, 18vh, 210px); position: relative; z-index: 1; }
.hero h1 { font-size: clamp(64px, 8.6vw, 132px); font-weight: 690; letter-spacing: -.072em; line-height: .84; margin: 0; max-width: 1080px; text-wrap: balance; }
.hero h1 em { color: #a9c3ff; display: block; font-family: inherit; font-style: normal; font-weight: 430; }
.hero-copy { backdrop-filter: blur(16px); background: rgba(8, 16, 34, .55); border: 1px solid rgba(255,255,255,.18); border-radius: var(--radius); padding: 22px; }
.hero-copy p { color: rgba(255,255,255,.82); font-family: inherit; font-size: clamp(16px, 1.35vw, 19px); line-height: 1.58; margin: 0 0 24px; }
.hero-copy a { align-items: center; border: 1px solid rgba(255,255,255,.62); border-radius: 999px; display: inline-flex; font-size: 10px; font-weight: 750; letter-spacing: .1em; min-height: 44px; padding: 0 17px; text-transform: uppercase; transition: background .25s var(--ease-out), color .25s var(--ease-out), transform .25s var(--ease-out); }
.hero-copy a:hover, .hero-copy a:focus-visible { background: #fff; color: var(--ink); }
.hero-copy a:active { transform: translateY(1px); }
.signal-row { align-items: center; border-top: 1px solid rgba(255,255,255,.22); display: flex; gap: 22px; margin-top: clamp(48px, 7vw, 84px); min-height: 64px; overflow: hidden; position: relative; white-space: nowrap; z-index: 1; }
.signal-row span { color: rgba(255,255,255,.7); font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; font-size: 10px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.signal-row i { background: #8bb0ff; border-radius: 50%; height: 4px; width: 4px; }
.hero-photo-credit { bottom: 22px; color: rgba(255,255,255,.48); font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; font-size: 9px; letter-spacing: .06em; position: absolute; right: var(--page); text-transform: uppercase; z-index: 2; }
.section-label { align-items: center; border-bottom: 1px solid var(--ink); display: flex; justify-content: space-between; margin-bottom: 30px; padding-bottom: 12px; }
.section-label p, .section-label span { font-size: 10px; font-weight: 750; letter-spacing: .11em; margin: 0; text-transform: uppercase; }
.section-label p, .section-label span, .article-card-meta, .article-card-foot, .result-count { font-family: ui-monospace, "SFMono-Regular", Consolas, monospace; }
.section-label span { color: var(--muted); }
.lead-story { border-bottom: 1px solid var(--line); }
.lead-grid { background: rgba(255,255,255,.62); border: 1px solid rgba(11,16,32,.1); border-radius: var(--radius-lg); display: grid; gap: clamp(32px, 5vw, 82px); grid-template-columns: minmax(0, 1.18fr) minmax(300px, .82fr); overflow: hidden; padding: clamp(12px, 1.6vw, 22px); transition: border-color .25s var(--ease-out), box-shadow .25s var(--ease-out), transform .25s var(--ease-out); }
.lead-grid:hover, .lead-grid:focus-visible { border-color: rgba(36,87,214,.32); box-shadow: 0 24px 65px rgba(11,16,32,.12); transform: translateY(-3px); }
.lead-grid .article-art { border-radius: calc(var(--radius-lg) - 10px); }
.article-art { aspect-ratio: 1.38; background: var(--orange); color: #fff; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; padding: clamp(24px, 4vw, 54px); position: relative; }
.article-art[data-theme='blue'] { background: #cfdad7; color: var(--ink); }
.article-art[data-theme='cream'] { background: #e7e0d1; color: var(--ink); }
.article-art[data-theme='violet'] { background: #d8d7cf; color: var(--ink); }
.article-art[data-theme='green'] { background: #c9d3b7; color: var(--ink); }
.article-art[data-theme='orange'] .art-rings i { border-color: rgba(255, 255, 255, .42); }
.art-index { font-size: 10px; font-weight: 800; letter-spacing: .15em; position: relative; z-index: 2; }
.art-rings { inset: -14% -12% auto auto; position: absolute; }
.art-rings i { border: 1px solid rgba(9, 9, 9, .48); border-radius: 50%; display: block; height: clamp(130px, 20vw, 300px); position: absolute; right: 0; top: 0; width: clamp(130px, 20vw, 300px); }
.art-rings i:nth-child(2) { right: 58px; top: 58px; }
.art-rings i:nth-child(3) { right: 116px; top: 116px; }
.article-art > p { font-size: clamp(40px, 6vw, 90px); font-weight: 800; letter-spacing: -.075em; line-height: .78; margin: auto 0 0; position: relative; z-index: 2; }
.article-art > p span { display: block; }
.article-art > small { font-family: Georgia, 'Times New Roman', serif; font-size: 13px; font-style: italic; margin-top: 22px; position: relative; z-index: 2; }
.article-art.is-compact { aspect-ratio: 1.15; padding: clamp(18px, 2.3vw, 30px); }
.article-art.is-compact > p { font-size: clamp(31px, 3.7vw, 58px); }
.article-art.is-compact .art-rings i { height: clamp(100px, 14vw, 210px); width: clamp(100px, 14vw, 210px); }
.lead-copy { align-self: end; padding-bottom: 12px; }
.article-meta { display: flex; flex-wrap: wrap; gap: 12px 22px; margin-bottom: 24px; }
.article-meta span { font-size: 10px; font-weight: 750; letter-spacing: .09em; text-transform: uppercase; }
.article-meta span:first-child { color: var(--orange); }
.lead-copy h2 { font-size: clamp(44px, 5.4vw, 82px); letter-spacing: -.067em; line-height: .94; margin: 0 0 26px; }
.lead-copy > p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: 18px; line-height: 1.55; margin: 0 0 28px; max-width: 620px; }
.text-link { border-bottom: 1px solid var(--ink); display: inline-block; font-size: 10px; font-weight: 750; letter-spacing: .11em; padding-bottom: 7px; text-transform: uppercase; }
.section-heading-row { align-items: end; display: flex; gap: 30px; justify-content: space-between; margin-bottom: 42px; }
.section-heading-row h2 { font-size: clamp(44px, 6.2vw, 90px); letter-spacing: -.07em; line-height: .94; margin: 14px 0 0; max-width: 950px; }
.section-heading-row h2 em, .archive-heading h2 em { color: var(--orange); font-family: Georgia, 'Times New Roman', serif; font-weight: 400; }
.section-heading-row > a { border-bottom: 1px solid var(--ink); flex: 0 0 auto; font-size: 10px; font-weight: 750; letter-spacing: .1em; padding-bottom: 7px; text-transform: uppercase; }
.latest-section { border-bottom: 1px solid var(--line); }
.article-grid { display: grid; gap: clamp(24px, 3vw, 48px) 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.article-card a { background: rgba(255,255,255,.58); border: 1px solid rgba(11,16,32,.1); border-radius: var(--radius); display: flex; flex-direction: column; height: 100%; overflow: hidden; padding: 10px; transition: background .25s var(--ease-out), border-color .25s var(--ease-out), box-shadow .25s var(--ease-out), transform .25s var(--ease-out); }
.article-card a:hover, .article-card a:focus-visible { background: #fff; border-color: rgba(36,87,214,.32); box-shadow: 0 20px 48px rgba(11,16,32,.1); transform: translateY(-5px); }
.article-card .article-art { border-radius: 12px; }
.article-card-meta { color: var(--muted); display: flex; font-size: 10px; font-weight: 750; justify-content: space-between; letter-spacing: .1em; padding: 14px 0; text-transform: uppercase; }
.article-card-meta span:first-child { color: var(--orange); }
.article-card h3 { font-size: clamp(25px, 2.35vw, 38px); letter-spacing: -.055em; line-height: .98; margin: 2px 0 14px; }
.article-card > a > p { color: var(--muted); flex: 1; font-family: Georgia, 'Times New Roman', serif; font-size: 15px; line-height: 1.52; margin: 0 0 20px; }
.article-card-foot { border-top: 1px solid var(--line); color: #70786f; display: flex; font-size: 9px; font-weight: 750; justify-content: space-between; letter-spacing: .09em; padding-top: 12px; text-transform: uppercase; }
.article-card .article-art { transition: box-shadow .22s ease, transform .22s ease; }
.article-card:hover .article-art, .article-card:focus-within .article-art { box-shadow: 0 14px 30px rgba(11, 16, 32, .14); transform: scale(1.012); }
.article-card:hover h3, .article-card:focus-within h3 { color: var(--orange); }
.home-about { background: linear-gradient(135deg, #0b1020 0%, #111d3d 100%); color: #f6f8fc; display: grid; gap: clamp(45px, 8vw, 130px); grid-template-columns: 1.15fr .85fr; overflow: hidden; position: relative; }
.home-about::after { border: 1px solid rgba(139,176,255,.16); border-radius: 50%; content: ''; height: min(42vw, 620px); position: absolute; right: -18vw; top: -20vw; width: min(42vw, 620px); }
.home-about > * { position: relative; z-index: 1; }
.home-about .page-kicker { color: #9fbcff; }
.home-about h2 { font-size: clamp(52px, 7.3vw, 105px); letter-spacing: -.075em; line-height: .88; margin: 18px 0 0; max-width: 850px; }
.home-about-copy { align-self: end; }
.home-about-copy p { color: #d6dff1; font-family: inherit; font-size: clamp(17px, 1.6vw, 22px); line-height: 1.55; margin: 0 0 20px; }
.home-about .button-link { border-color: #f8f7f1; color: #f8f7f1; margin-top: 10px; }
.home-about .button-link:hover { background: #f8faff; border-color: #f8faff; color: #0b1020; }
.archive-heading { display: grid; gap: 25px; grid-template-columns: .45fr 1.45fr .65fr; margin-bottom: 52px; }
.archive-heading h2 { font-size: clamp(48px, 7.5vw, 108px); letter-spacing: -.075em; line-height: .87; margin: 0; }
.archive-heading > p { align-self: end; color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: 16px; line-height: 1.55; margin: 0; }
.explorer-tools { align-items: start; border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); display: grid; gap: 24px; grid-template-columns: 1fr minmax(230px, .32fr); padding: 18px 0; }
.topic-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.topic-filters button { background: transparent; border: 1px solid var(--control-line); color: var(--muted); cursor: pointer; font-size: 10px; font-weight: 750; letter-spacing: .08em; min-height: 44px; padding: 0 14px; text-transform: uppercase; transition: background .18s ease, border-color .18s ease, color .18s ease; }
.topic-filters button:hover { background: var(--accent-soft); border-color: var(--orange); color: var(--accent-strong); }
.topic-filters button[aria-pressed='true'] { background: var(--orange); border-color: var(--orange); color: #fff; }
.search-field { border-bottom: 1px solid var(--ink); display: grid; grid-template-columns: 1fr auto; }
.search-field input { background: transparent; border: 0; color: var(--ink); font-family: Georgia, 'Times New Roman', serif; font-size: 14px; min-height: 40px; outline: 0; padding: 0; width: 100%; }
.search-field:focus-within { border-color: var(--orange); box-shadow: 0 2px 0 var(--orange); }
.search-field i { align-self: center; font-size: 20px; font-style: normal; }
.result-count { color: var(--muted); font-size: 10px; font-weight: 750; letter-spacing: .1em; margin: 18px 0 26px; text-transform: uppercase; }
.empty-state { border: 1px solid var(--line); padding: 50px; text-align: center; }
.empty-state p { font-family: Georgia, 'Times New Roman', serif; font-size: 22px; }
.empty-state button { background: transparent; border: 1px solid var(--ink); color: var(--ink); cursor: pointer; padding: 12px 16px; }

/* Footer and forms */
.site-footer { border-top: 1px solid var(--line); padding: 0 var(--page) 24px; }
.footer-newsletter { align-items: end; display: grid; gap: clamp(35px, 8vw, 130px); grid-template-columns: 1.2fr .8fr; padding: clamp(70px, 9vw, 125px) 0; }
.footer-newsletter h2 { font-size: clamp(50px, 7.8vw, 116px); letter-spacing: -.075em; line-height: .85; margin: 16px 0 0; }
.footer-newsletter h2 em { color: var(--orange); font-family: Georgia, 'Times New Roman', serif; font-weight: 400; }
.footer-newsletter > div:last-child > p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: 17px; line-height: 1.5; max-width: 540px; }
.newsletter-form { display: grid; gap: 15px; margin-top: 26px; }
.newsletter-form.is-compact { grid-template-columns: 1fr 1.35fr auto; }
.newsletter-form label { display: grid; gap: 7px; }
.newsletter-form label > span { font-size: 10px; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.newsletter-form input { background: transparent; border: 0; border-bottom: 1px solid var(--control-line); border-radius: 0; color: var(--ink); min-height: 46px; outline: 0; padding: 0; width: 100%; }
.newsletter-form input:focus { border-color: var(--orange); box-shadow: 0 2px 0 var(--orange); }
.newsletter-form button { align-self: end; background: var(--orange); border: 0; color: #fff; cursor: pointer; font-size: 10px; font-weight: 800; letter-spacing: .1em; min-height: 46px; padding: 0 18px; text-transform: uppercase; transition: background .18s ease; }
.newsletter-form button:hover:not(:disabled) { background: var(--accent-strong); }
.newsletter-form button:disabled { cursor: wait; opacity: .6; }
.form-status { color: var(--muted); font-size: 12px; grid-column: 1 / -1; margin: 0; min-height: 16px; }
.form-status.is-success { color: #2f6b3d; }
.form-status.is-error { color: #9b2c2c; }
.honeypot { height: 0; left: -9999px; overflow: hidden; position: absolute; width: 0; }
.footer-lead { align-items: end; border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); display: flex; justify-content: space-between; padding: 30px 0; }
.footer-mark { font-size: clamp(58px, 9vw, 130px); font-weight: 800; letter-spacing: -.09em; line-height: .8; }
.footer-lead > p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: 16px; line-height: 1.5; margin: 0; max-width: 350px; }
.footer-grid { display: grid; gap: 40px; grid-template-columns: repeat(3, 1fr); padding: 42px 0 70px; }
.footer-grid > div { display: flex; flex-direction: column; gap: 10px; }
.footer-grid p { color: var(--orange); font-size: 10px; font-weight: 750; letter-spacing: .1em; margin: 0 0 7px; text-transform: uppercase; }
.footer-grid a { color: var(--muted); font-size: 13px; width: fit-content; }
.footer-grid a:hover { color: var(--ink); }
.footer-bottom { border-top: 1px solid var(--line); color: var(--muted); display: flex; font-size: 10px; font-weight: 700; justify-content: space-between; letter-spacing: .08em; padding-top: 18px; text-transform: uppercase; }

/* Supporting pages */
.page-main { min-height: 70vh; }
.page-hero { border-bottom: 1px solid var(--line); min-height: 590px; padding: clamp(62px, 8vw, 120px) var(--page) clamp(70px, 9vw, 130px); position: relative; }
.page-hero::after { background: radial-gradient(circle, rgba(77, 93, 47, .16), transparent 68%); content: ''; height: 620px; position: absolute; right: -230px; top: -250px; width: 620px; }
.page-hero h1 { font-size: clamp(62px, 9.6vw, 145px); letter-spacing: -.078em; line-height: .84; margin: 42px 0 35px; max-width: 1300px; position: relative; z-index: 1; }
.page-hero > p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: clamp(18px, 2vw, 26px); line-height: 1.5; margin: 0; max-width: 740px; position: relative; z-index: 1; }
.manifesto-grid { border-bottom: 1px solid var(--line); display: grid; gap: 60px; grid-template-columns: .55fr 1fr; }
.manifesto-grid > div:first-child span, .principle-grid article > span, .policy-content article > span { color: var(--orange); font-size: 10px; font-weight: 750; letter-spacing: .1em; }
.manifesto-grid h2 { font-size: clamp(42px, 5vw, 72px); letter-spacing: -.06em; line-height: .96; margin: 16px 0 0; }
.prose-column p { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(21px, 2.2vw, 31px); line-height: 1.45; margin: 0 0 28px; }
.principles { border-bottom: 1px solid var(--line); }
.principle-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.principle-grid article { border-left: 1px solid var(--line); padding: 25px; }
.principle-grid article:last-child { border-right: 1px solid var(--line); }
.principle-grid h3 { font-size: 28px; letter-spacing: -.05em; margin: 38px 0 16px; }
.principle-grid p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: 15px; line-height: 1.55; margin: 0; }
.about-audience { text-align: center; }
.about-audience h2 { font-size: clamp(45px, 6.8vw, 98px); letter-spacing: -.072em; line-height: .92; margin: 26px auto 38px; max-width: 1250px; }
.faq-list { padding-top: 0; }
.faq-list details { border-bottom: 1px solid var(--line); }
.faq-list summary { align-items: center; cursor: pointer; display: grid; gap: 24px; grid-template-columns: 48px 1fr 30px; list-style: none; padding: 30px 0; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary > span { color: var(--orange); font-size: 10px; font-weight: 750; }
.faq-list summary h2 { font-size: clamp(25px, 3.2vw, 48px); letter-spacing: -.055em; margin: 0; }
.faq-list summary i { font-size: 27px; font-style: normal; transition: transform .2s ease; }
.faq-list details[open] summary i { transform: rotate(45deg); }
.faq-list details > p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: clamp(17px, 1.7vw, 22px); line-height: 1.6; margin: 0; max-width: 900px; padding: 0 0 34px 72px; }
.policy-content { margin: 0 auto; max-width: 1180px; }
.policy-content article { border-bottom: 1px solid var(--line); display: grid; gap: 28px; grid-template-columns: 55px 1fr; padding: 35px 0; }
.policy-content h2 { font-size: clamp(31px, 4vw, 55px); letter-spacing: -.06em; margin: 0 0 16px; }
.policy-content p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: 18px; line-height: 1.62; margin: 0; }
.not-found { align-items: flex-start; display: flex; flex-direction: column; justify-content: center; min-height: 72vh; padding: 80px var(--page); }
.not-found > span { color: var(--orange); font-size: 10px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; }
.not-found h1 { font-size: clamp(58px, 9vw, 130px); letter-spacing: -.075em; line-height: .86; margin: 30px 0; max-width: 1200px; }
.not-found p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: 19px; margin-bottom: 32px; }

/* Article */
.article-hero { padding: 44px var(--page) 0; }
.breadcrumbs { color: var(--muted); display: flex; flex-wrap: wrap; font-size: 10px; font-weight: 750; gap: 10px; letter-spacing: .1em; text-transform: uppercase; }
.breadcrumbs a:hover { color: var(--orange); }
.article-title-grid { align-items: end; display: grid; gap: clamp(35px, 7vw, 110px); grid-template-columns: 1.6fr .55fr; margin: 65px 0 50px; }
.article-title-grid h1 { font-size: clamp(52px, 7.8vw, 120px); letter-spacing: -.075em; line-height: .88; margin: 0; overflow-wrap: anywhere; }
.article-title-grid > p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; font-size: 18px; line-height: 1.55; margin: 0 0 8px; }
.article-hero > .article-art { aspect-ratio: 2.05; }
.audio-dock { margin: -1px auto 0; position: sticky; top: 96px; width: min(980px, calc(100% - 40px)); z-index: 85; }
.audio-dock, .video-section { display: none !important; }
.audio-player { background: rgba(251, 250, 246, .97); border: 1px solid #d2d7ca; box-shadow: 0 16px 45px rgba(28, 35, 24, .16); outline: 0; padding: 12px 15px 9px; }
.audio-player:focus-visible { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(77, 93, 47, .18), 0 16px 45px rgba(28, 35, 24, .16); }
.audio-heading { align-items: center; display: flex; justify-content: space-between; }
.audio-heading > div > span { color: var(--orange); display: block; font-size: 9px; font-weight: 800; letter-spacing: .13em; margin-bottom: 2px; text-transform: uppercase; }
.audio-heading h2 { font-size: 13px; letter-spacing: -.01em; margin: 0; }
.audio-heading > small { background: var(--surface); border: 1px solid var(--line); color: var(--muted); font-size: 9px; letter-spacing: .07em; padding: 5px 7px; text-transform: uppercase; }
.audio-controls { align-items: center; display: grid; gap: 12px; grid-template-columns: 1fr auto auto; margin-top: 7px; }
.audio-controls button { background: #eff1e9; border: 1px solid #c8cebf; color: var(--ink); cursor: pointer; transition: background .18s ease, border-color .18s ease, color .18s ease; }
.audio-controls button:hover:not(:disabled) { background: var(--accent-soft); border-color: var(--orange); }
.audio-controls > button { border-radius: 50%; height: 40px; width: 40px; }
.audio-controls button:disabled, .audio-timeline input:disabled { cursor: not-allowed; opacity: .4; }
.speed-buttons { display: flex; gap: 5px; }
.speed-buttons button { border-radius: 999px; font-size: 10px; min-height: 44px; min-width: 44px; }
.speed-buttons button.active { background: var(--accent-soft); border-color: var(--orange); color: var(--accent-strong); }
.transport { align-items: center; display: flex; gap: 7px; }
.transport button { border-radius: 50%; font-size: 13px; height: 39px; width: 39px; }
.transport button small { font-size: 7px; }
.transport .play-button { background: var(--orange); border-color: var(--orange); color: #fff; font-size: 14px; height: 48px; width: 48px; }
.transport .play-button:hover:not(:disabled) { background: var(--accent-strong); border-color: var(--accent-strong); }
.audio-timeline { align-items: center; display: grid; gap: 9px; grid-template-columns: 34px 1fr 34px; margin-top: 3px; }
.audio-timeline span { color: var(--muted); font-size: 10px; }
.audio-timeline span:last-child { text-align: right; }
.audio-timeline input { accent-color: var(--orange); cursor: pointer; min-height: 26px; width: 100%; }
.audio-note { color: var(--muted); font-size: 9px; letter-spacing: .025em; margin: 0; }
.article-reading-layout { display: grid; gap: clamp(48px, 9vw, 145px); grid-template-columns: minmax(180px, .33fr) minmax(0, 1fr); margin: 0 auto; max-width: 1300px; }
.article-aside { align-self: start; position: sticky; top: 260px; }
.article-author { border-bottom: 1px solid var(--line); padding-bottom: 24px; }
.article-author > span, .article-aside nav > span { color: var(--muted); display: block; font-size: 10px; font-weight: 750; letter-spacing: .1em; margin-bottom: 14px; text-transform: uppercase; }
.article-author strong { display: block; font-size: 34px; letter-spacing: -.08em; }
.article-author strong span { color: var(--orange); }
.article-author p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; margin: 5px 0 0; }
.article-aside nav { display: flex; flex-direction: column; gap: 9px; padding-top: 24px; }
.article-aside nav a { color: var(--muted); font-size: 11px; line-height: 1.4; }
.article-aside nav a:hover { color: var(--orange); }
.article-body { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(18px, 1.55vw, 22px); line-height: 1.7; max-width: 820px; }
.article-deck { border-left: 3px solid var(--orange); color: var(--ink); font-size: clamp(23px, 2.4vw, 34px); line-height: 1.42; margin: 0 0 70px; padding-left: 26px; }
.article-body section { scroll-margin-top: 255px; }
.article-body h2 { font-family: Arial, Helvetica, sans-serif; font-size: clamp(40px, 5vw, 70px); letter-spacing: -.067em; line-height: .98; margin: 90px 0 28px; }
.article-body p { color: #424b43; }
.article-body ul { border-bottom: 1px solid var(--line); border-top: 1px solid var(--line); list-style: none; margin: 35px 0; padding: 14px 0; }
.article-body li { border-bottom: 1px solid var(--line); color: var(--ink); padding: 15px 15px 15px 38px; position: relative; }
.article-body li:last-child { border: 0; }
.article-body li::before { color: var(--orange); content: '→'; left: 8px; position: absolute; }
.article-endnote { border-top: 1px solid var(--ink); margin-top: 90px; padding-top: 22px; }
.article-endnote > span { color: var(--orange); font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 10px; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.article-endnote > p { font-size: 14px; }
.video-section { align-items: center; background: var(--surface); display: grid; gap: 60px; grid-template-columns: .55fr 1fr; }
.video-section h2 { font-size: clamp(45px, 6vw, 85px); letter-spacing: -.07em; margin: 15px 0; }
.video-section > div:first-child p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; line-height: 1.5; }
.video-placeholder { align-items: center; aspect-ratio: 16 / 9; background: #26321f; border: 1px solid #26321f; display: flex; flex-direction: column; justify-content: center; }
.video-placeholder > span { align-items: center; background: #f8f7f1; border-radius: 50%; color: var(--accent-strong); display: flex; height: 62px; justify-content: center; padding-left: 3px; width: 62px; }
.video-placeholder p { color: #d7ddce; font-size: 10px; font-weight: 750; letter-spacing: .1em; margin-top: 15px; text-transform: uppercase; }
.related-section { border-top: 1px solid var(--line); }

/* External warning */
.external-overlay { align-items: center; backdrop-filter: blur(7px); background: rgba(18, 25, 18, .78); display: flex; inset: 0; justify-content: center; padding: 20px; position: fixed; z-index: 1500; }
.external-dialog { background: var(--paper); border: 1px solid #ccd1c4; box-shadow: 0 35px 100px rgba(18, 25, 18, .3); max-width: 540px; padding: clamp(30px, 5vw, 55px); width: 100%; }
.external-dialog h2 { font-size: clamp(37px, 5vw, 58px); letter-spacing: -.06em; line-height: 1; margin: 20px 0; }
.external-dialog > p { color: var(--muted); font-family: Georgia, 'Times New Roman', serif; line-height: 1.6; }
.external-dialog > div { display: flex; gap: 10px; margin-top: 30px; }
.external-dialog button, .external-dialog a { align-items: center; border: 1px solid var(--orange); color: var(--orange); cursor: pointer; display: flex; font-size: 10px; font-weight: 750; justify-content: center; letter-spacing: .09em; min-height: 45px; padding: 0 17px; text-transform: uppercase; }
.external-dialog button { background: transparent; }
.external-dialog button:last-child, .external-dialog a { background: var(--orange); border-color: var(--orange); color: #fff; }
.external-dialog button:hover, .external-dialog a:hover { background: var(--accent-strong); border-color: var(--accent-strong); color: #fff; }

@media (max-width: 1050px) {
  .desktop-nav { gap: 16px; }
  .desktop-nav a:nth-last-child(2) { display: none; }
  .principle-grid { grid-template-columns: repeat(2, 1fr); }
  .principle-grid article:nth-child(3) { border-top: 1px solid var(--line); }
  .principle-grid article:nth-child(4) { border-top: 1px solid var(--line); border-right: 1px solid var(--line); }
}

@media (max-width: 800px) {
  .site-header { grid-template-columns: 1fr auto; min-height: 74px; }
  .desktop-nav, .header-action { display: none; }
  .mobile-menu { display: block; }
  .hero { min-height: 720px; padding-top: 28px; }
  .hero-grid, .lead-grid, .home-about, .footer-newsletter, .manifesto-grid, .article-title-grid, .video-section { grid-template-columns: 1fr; }
  .hero-grid { gap: 28px; margin-top: auto; padding-top: 130px; }
  .hero h1 { font-size: clamp(58px, 14vw, 92px); max-width: 820px; }
  .hero-copy { max-width: 520px; padding: 19px; }
  .signal-row { margin-top: 42px; padding-right: 100px; }
  .hero-photo-credit { bottom: 24px; }
  .article-art { aspect-ratio: 1.05; }
  .article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .archive-heading { grid-template-columns: 1fr; }
  .archive-heading > p { max-width: 560px; }
  .explorer-tools { grid-template-columns: 1fr; }
  .newsletter-form.is-compact { grid-template-columns: 1fr 1fr; }
  .newsletter-form.is-compact button { grid-column: 1 / -1; }
  .footer-newsletter { gap: 35px; }
  .footer-lead { align-items: start; flex-direction: column; gap: 30px; }
  .page-hero { min-height: auto; }
  .principle-grid { grid-template-columns: 1fr 1fr; }
  .article-title-grid { margin-top: 45px; }
  .article-hero > .article-art { aspect-ratio: 1.25; }
  .audio-dock { top: 82px; width: calc(100% - 16px); }
  .article-reading-layout { grid-template-columns: 1fr; }
  .article-aside { display: none; }
}

@media (max-width: 560px) {
  .hero { min-height: 700px; padding-left: 18px; padding-right: 18px; }
  .hero-media img { object-position: 64% center; }
  .hero::before { background: linear-gradient(90deg, rgba(5,11,25,.93), rgba(5,11,25,.56)), linear-gradient(180deg, rgba(5,11,25,.2), rgba(5,11,25,.9)); }
  .hero::after { inset: 8px; }
  .hero-status { font-size: 9px; letter-spacing: .07em; padding: 9px 11px; }
  .hero-grid { gap: 22px; padding-top: 120px; }
  .hero h1 { font-size: clamp(50px, 14.2vw, 66px); line-height: .88; }
  .hero-copy { backdrop-filter: blur(12px); max-width: 100%; padding: 16px; }
  .hero-copy p { font-size: 15px; margin-bottom: 19px; }
  .signal-row { gap: 14px; margin-top: 28px; min-height: 56px; padding-right: 0; }
  .signal-row span { font-size: 9px; }
  .signal-row span:nth-of-type(n+3), .signal-row i:nth-of-type(n+2) { display: none; }
  .hero-photo-credit { bottom: 17px; font-size: 8px; right: 18px; }
  .section-heading-row { align-items: start; flex-direction: column; }
  .section-heading-row > a { align-self: flex-start; }
  .article-grid { grid-template-columns: 1fr; }
  .article-art.is-compact { aspect-ratio: 1.18; }
  .newsletter-form.is-compact { grid-template-columns: 1fr; }
  .newsletter-form.is-compact button { grid-column: auto; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-bottom { flex-direction: column; gap: 8px; }
  .page-hero h1 { font-size: clamp(54px, 16vw, 78px); }
  .principle-grid { grid-template-columns: 1fr; }
  .principle-grid article { border-right: 1px solid var(--line); border-top: 1px solid var(--line); }
  .faq-list summary { gap: 13px; grid-template-columns: 30px 1fr 25px; }
  .faq-list details > p { padding-left: 43px; }
  .policy-content article { grid-template-columns: 35px 1fr; }
  .article-title-grid h1 { font-size: clamp(44px, 13vw, 67px); }
  .article-hero { padding-left: 16px; padding-right: 16px; }
  .article-hero > .article-art { aspect-ratio: .95; }
  .audio-player { max-height: calc(100svh - 90px); overflow: auto; padding: 10px; }
  .audio-heading > small { display: none; }
  .audio-controls { grid-template-columns: auto 1fr; }
  .audio-controls > button { grid-column: 1; grid-row: 1; }
  .transport { grid-column: 2; grid-row: 1; justify-self: end; }
  .speed-buttons { grid-column: 1 / -1; grid-row: 2; justify-self: center; }
  .transport button { height: 42px; width: 42px; }
  .transport .play-button { height: 48px; width: 48px; }
  .audio-note { display: none; }
  .article-reading-layout { padding-left: 20px; padding-right: 20px; }
  .article-body h2 { margin-top: 68px; }
  .video-section { padding-left: 20px; padding-right: 20px; }
  .external-dialog > div { flex-direction: column; }
}

@media (max-width: 380px) {
  .hero h1 { font-size: 48px; }
  .audio-timeline { gap: 4px; grid-template-columns: 29px 1fr 29px; }
  .transport { gap: 3px; }
  .transport button { height: 39px; width: 39px; }
  .footer-grid { grid-template-columns: 1fr; }
}

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

@media (prefers-reduced-motion: no-preference) {
  .hero-media img { animation: hero-settle 1.4s var(--ease-out) both; }
  .hero-status { animation: hero-rise .65s .08s var(--ease-out) both; }
  .hero h1 { animation: hero-rise .78s .16s var(--ease-out) both; }
  .hero-copy { animation: hero-rise .78s .25s var(--ease-out) both; }
  .signal-row { animation: hero-rise .65s .34s var(--ease-out) both; }
}

@keyframes hero-rise {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes hero-settle {
  from { opacity: .72; transform: scale(1.055); }
  to { opacity: 1; transform: scale(1.015); }
}

/* Twokq Tech brand system */
.lead-copy > p, .article-card > a > p, .archive-heading > p,
.search-field input, .empty-state p, .footer-newsletter > div:last-child > p,
.footer-lead > p, .page-hero > p, .prose-column p, .principle-grid p,
.faq-list details > p, .policy-content p, .not-found p,
.article-title-grid > p, .article-author p, .article-body,
.video-section > div:first-child p, .external-dialog > p { font-family: inherit; }
.section-heading-row h2 em, .archive-heading h2 em,
.footer-newsletter h2 em { font-family: inherit; font-weight: 430; }
.page-hero::after { background: radial-gradient(circle, rgba(36, 87, 214, .18), transparent 68%); }
.audio-player { background: rgba(255, 255, 255, .97); border-color: #cbd5e5; box-shadow: 0 16px 45px rgba(11, 16, 32, .16); }
.audio-player:focus-visible { box-shadow: 0 0 0 3px rgba(36, 87, 214, .2), 0 16px 45px rgba(11, 16, 32, .16); }
.video-placeholder { background: #0b1020; }
.video-placeholder p { color: #d6dff1; }
.article-author-logo { border: 1px solid var(--line); height: 56px; margin-top: 14px; object-fit: cover; width: 56px; }
.prose-column a { color: var(--orange); text-decoration: underline; text-underline-offset: 4px; }