/* page-styles.css — merged inline <style> blocks from every static .html
   page in /Terawatt-3-New-Theme-Dev/. Recovered in cycle 7 after extract-
   templates.py dropped the <head> during cycle-0 body extraction. */


/* ==================== about.html ==================== */
.ab-hero { padding: clamp(64px,8vw,128px) 0 clamp(48px,6vw,80px); border-bottom: 1px solid var(--tw-line); }
.ab-hero h1 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(2.5rem,7vw,5.5rem); letter-spacing: -0.05em; line-height: 0.92; margin: 18px 0 0; max-width: 22ch; text-wrap: balance; }
.ab-hero h1 em { font-style: normal; color: var(--tw-mark); }
.ab-hero__lede { font-size: clamp(1.0625rem,1.5vw,1.375rem); line-height: 1.5; color: var(--tw-slogan-fg); max-width: 56ch; margin: 28px 0 0; text-wrap: pretty; }

.ab-thesis { padding: clamp(56px,7vw,96px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.ab-thesis__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.4fr); gap: clamp(28px,4vw,72px); align-items: start; }
.ab-thesis h2 { font-family: var(--tw-font-display); font-weight: 700; font-size: clamp(1.75rem,3vw,2.5rem); letter-spacing: -0.03em; line-height: 1.05; margin: 0; text-wrap: balance; }
.ab-thesis h2 em { font-style: normal; color: var(--tw-mark); }
.ab-thesis p { font-size: 1.0625rem; line-height: 1.62; color: var(--tw-fg); margin: 0 0 1em; text-wrap: pretty; }
.ab-thesis p em { font-style: normal; color: var(--tw-mark); font-weight: 500; }
.ab-thesis p:last-child { margin-bottom: 0; }
@media (max-width:880px) { .ab-thesis__grid { grid-template-columns: 1fr; } }

.ab-metrics { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.ab-metrics__grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; border-top: 1px solid var(--tw-line); }
.ab-metrics__cell { padding: 28px 24px 28px 0; border-right: 1px solid var(--tw-line); }
.ab-metrics__cell:last-child { border-right: 0; }
.ab-metrics__cell:nth-child(n+2) { padding-left: 24px; }
.ab-metrics__cell .v { font-family: var(--tw-font-display); font-weight: 800; letter-spacing: -0.04em; font-size: clamp(2rem,4vw,3rem); line-height: 1; }
.ab-metrics__cell .v em { font-style: normal; color: var(--tw-mark); }
.ab-metrics__cell .l { display: block; margin-top: 10px; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); }
@media (max-width:880px) { .ab-metrics__grid { grid-template-columns: 1fr 1fr; } .ab-metrics__cell:nth-child(2n) { border-right: 0; } .ab-metrics__cell:nth-child(-n+2) { border-bottom: 1px solid var(--tw-line); padding-bottom: 28px; } }

.ab-team { padding: clamp(56px,7vw,96px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.ab-team__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.ab-team__card { padding: 24px; border: 1px solid var(--tw-line); background: var(--tw-data-bg); border-radius: 4px; display: flex; flex-direction: column; gap: 16px; }
.ab-team__avatar { width: 64px; height: 64px; border-radius: 50%; background: var(--tw-mark); color: var(--tw-bg); display: flex; align-items: center; justify-content: center; font-family: var(--tw-font-display); font-weight: 700; font-size: 1.375rem; letter-spacing: -0.02em; }
.ab-team__avatar--solar { background: #F2C94C; }
.ab-team__avatar--peak { background: #F26B1F; color: #fff; }
.ab-team__avatar--cloud { background: #E8B92E; }
.ab-team__role { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-mark); }
.ab-team__name { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.25rem; letter-spacing: -0.025em; line-height: 1.1; margin: 0; }
.ab-team__bio { font-size: 14px; line-height: 1.55; color: var(--tw-slogan-fg); margin: 0; }
.ab-team__creds { padding-top: 14px; border-top: 1px solid var(--tw-line); font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tw-fg); }
@media (max-width:980px) { .ab-team__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width:640px) { .ab-team__grid { grid-template-columns: 1fr; } }

.ab-creds { padding: clamp(56px,7vw,96px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.ab-creds__grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 0; border-top: 1px solid var(--tw-line); border-bottom: 1px solid var(--tw-line); }
.ab-creds__cell { padding: 28px 18px 28px 0; border-right: 1px solid var(--tw-line); }
.ab-creds__cell:last-child { border-right: 0; }
.ab-creds__cell:nth-child(n+2) { padding-left: 18px; }
.ab-creds__cell .tag { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-mark); margin-bottom: 8px; display: block; }
.ab-creds__cell .name { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.125rem; letter-spacing: -0.02em; line-height: 1.1; margin: 0 0 6px; }
.ab-creds__cell .meta { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.04em; color: var(--tw-slogan-fg); }
@media (max-width:880px) { .ab-creds__grid { grid-template-columns: 1fr 1fr; } .ab-creds__cell:nth-child(2n) { border-right: 0; } .ab-creds__cell:nth-child(-n+2) { border-bottom: 1px solid var(--tw-line); padding-bottom: 28px; } }

.ab-hq { padding: clamp(56px,7vw,96px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.ab-hq__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.2fr); gap: clamp(28px,4vw,56px); align-items: stretch; }
.ab-hq__photo { background: var(--tw-data-bg); border: 1px solid var(--tw-line); border-radius: 4px; aspect-ratio: 4/3; position: relative; overflow: hidden; }
.ab-hq__photo svg { width: 100%; height: 100%; }
.ab-hq__body { display: flex; flex-direction: column; gap: 18px; }
.ab-hq__body h2 { font-family: var(--tw-font-display); font-weight: 700; font-size: clamp(1.5rem,2.6vw,2rem); letter-spacing: -0.03em; line-height: 1.05; margin: 0; }
.ab-hq__body h2 em { font-style: normal; color: var(--tw-mark); }
.ab-hq__body p { font-size: 1rem; line-height: 1.6; color: var(--tw-slogan-fg); margin: 0; }
.ab-hq__rows { display: flex; flex-direction: column; gap: 0; margin-top: 14px; }
.ab-hq__row { display: grid; grid-template-columns: auto 1fr auto; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--tw-line); align-items: center; font-family: var(--tw-font-mono); font-size: 12px; }
.ab-hq__row:last-child { border-bottom: 0; }
.ab-hq__row .tag { color: var(--tw-mark); font-size: 10.5px; letter-spacing: 0.18em; }
.ab-hq__row .name { color: var(--tw-fg); font-family: var(--tw-font-display); font-weight: 700; font-size: 1rem; letter-spacing: -0.02em; }
.ab-hq__row .meta { color: var(--tw-slogan-fg); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; }
@media (max-width:880px) { .ab-hq__grid { grid-template-columns: 1fr; } }

/* ==================== contact.html ==================== */
.ct-hero { padding: clamp(56px,7vw,108px) 0 clamp(40px,5vw,72px); border-bottom: 1px solid var(--tw-line); }
.ct-hero__grid { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr); gap: clamp(28px,4vw,72px); align-items: end; }
.ct-hero h1 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(2.5rem,7vw,5.5rem); letter-spacing: -0.05em; line-height: 0.92; margin: 18px 0 0; text-wrap: balance; }
.ct-hero h1 em { font-style: normal; color: var(--tw-mark); }
.ct-hero__lede { font-size: clamp(1rem,1.4vw,1.25rem); line-height: 1.5; color: var(--tw-slogan-fg); max-width: 50ch; margin: 24px 0 0; }
.ct-hero__panel { background: var(--tw-data-bg); border: 1px solid var(--tw-line); border-radius: 4px; padding: 24px; }
.ct-hero__row { display: grid; grid-template-columns: 1fr auto; padding: 12px 0; border-bottom: 1px solid var(--tw-line); font-family: var(--tw-font-mono); font-size: 12px; align-items: baseline; }
.ct-hero__row:last-child { border-bottom: 0; }
.ct-hero__row label { font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tw-slogan-fg); }
.ct-hero__row .v { color: var(--tw-fg); font-weight: 500; }
.ct-hero__row .v em { font-style: normal; color: var(--tw-mark); }
@media (max-width:880px) { .ct-hero__grid { grid-template-columns: 1fr; } }

.ct-channels { padding: clamp(56px,7vw,96px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.ct-channels__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.ct-channel { padding: clamp(24px,3vw,32px); border: 1px solid var(--tw-line); border-radius: 4px; background: var(--tw-data-bg); display: flex; flex-direction: column; gap: 14px; min-height: 240px; text-decoration: none; color: inherit; transition: border-color var(--tw-dur-2) var(--tw-ease), transform var(--tw-dur-2) var(--tw-ease); }
.ct-channel:hover { border-color: var(--tw-mark); transform: translateY(-2px); }
.ct-channel__icon { width: 44px; height: 44px; border-radius: 50%; background: var(--tw-mark); color: var(--tw-bg); display: flex; align-items: center; justify-content: center; }
.ct-channel__icon svg { width: 22px; height: 22px; }
.ct-channel__tag { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-mark); }
.ct-channel h3 { font-family: var(--tw-font-display); font-weight: 700; letter-spacing: -0.025em; font-size: 1.25rem; line-height: 1.15; margin: 0; }
.ct-channel p { font-size: 0.9375rem; line-height: 1.55; color: var(--tw-slogan-fg); margin: 0; flex: 1; }
.ct-channel__meta { padding-top: 14px; border-top: 1px solid var(--tw-line); font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-fg); display: flex; justify-content: space-between; }
.ct-channel__meta .arrow { color: var(--tw-mark); }
@media (max-width:980px) { .ct-channels__grid { grid-template-columns: 1fr; } }

.ct-team { padding: clamp(56px,7vw,96px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.ct-team__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.ct-team__card { padding: 24px; border: 1px solid var(--tw-line); background: var(--tw-data-bg); border-radius: 4px; display: grid; grid-template-columns: 56px 1fr; gap: 16px; align-items: start; }
.ct-team__avatar { width: 56px; height: 56px; border-radius: 50%; background: var(--tw-mark); color: var(--tw-bg); display: flex; align-items: center; justify-content: center; font-family: var(--tw-font-display); font-weight: 700; font-size: 1.125rem; }
.ct-team__avatar--solar { background: #F2C94C; }
.ct-team__avatar--peak { background: #F26B1F; color: #fff; }
.ct-team__avatar--cloud { background: #E8B92E; }
.ct-team__role { font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-mark); }
.ct-team__name { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.0625rem; letter-spacing: -0.02em; margin: 4px 0; line-height: 1.15; }
.ct-team__links { display: flex; flex-direction: column; gap: 4px; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.04em; }
.ct-team__links a { color: var(--tw-slogan-fg); text-decoration: none; }
.ct-team__links a:hover { color: var(--tw-mark); }
@media (max-width:980px) { .ct-team__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width:640px) { .ct-team__grid { grid-template-columns: 1fr; } }

.ct-offices { padding: clamp(56px,7vw,96px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.ct-offices__grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.4fr); gap: clamp(28px,4vw,56px); align-items: stretch; }
.ct-offices__list { display: flex; flex-direction: column; gap: 0; }
.ct-office { padding: 22px 0; border-bottom: 1px solid var(--tw-line); display: grid; grid-template-columns: auto 1fr auto; gap: 18px; align-items: center; }
.ct-office:last-child { border-bottom: 0; }
.ct-office__tag { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.18em; color: var(--tw-mark); }
.ct-office__name { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.0625rem; letter-spacing: -0.02em; }
.ct-office__addr { display: block; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.04em; color: var(--tw-slogan-fg); margin-top: 4px; }
.ct-office__phone { font-family: var(--tw-font-mono); font-size: 12px; letter-spacing: 0.04em; color: var(--tw-fg); }
.ct-offices__map { background: var(--tw-data-bg); border: 1px solid var(--tw-line); border-radius: 4px; padding: 24px; min-height: 360px; position: relative; }
.ct-offices__map svg { width: 100%; height: 100%; min-height: 320px; }
@media (max-width:880px) { .ct-offices__grid { grid-template-columns: 1fr; } }

/* ==================== insights.html ==================== */
.in-hero { padding: clamp(56px,7vw,108px) 0 clamp(40px,5vw,72px); border-bottom: 1px solid var(--tw-line); }
.in-hero h1 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(2.5rem,7vw,5rem); letter-spacing: -0.05em; line-height: 0.92; margin: 18px 0 0; max-width: 18ch; text-wrap: balance; }
.in-hero h1 em { font-style: normal; color: var(--tw-mark); }
.in-hero__lede { font-size: clamp(1rem,1.4vw,1.25rem); line-height: 1.5; color: var(--tw-slogan-fg); max-width: 56ch; margin: 22px 0 0; }

.in-featured { padding: clamp(48px,6vw,80px) 0; border-bottom: 1px solid var(--tw-line); background: var(--tw-bg); }
.in-featured__grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: clamp(28px,4vw,56px); align-items: stretch; }
.in-featured__media { position: relative; aspect-ratio: 16/10; background: #0F0F0F; border-radius: 4px; overflow: hidden; }
.in-featured__media svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.in-featured__media-overlay { position: absolute; inset: 0; padding: 24px; display: flex; flex-direction: column; justify-content: space-between; color: #F4F1EC; }
.in-featured__media-tag { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; padding: 6px 10px; background: var(--tw-mark); color: var(--tw-bg); border-radius: 2px; align-self: flex-start; }
.in-featured__body { display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.in-featured__cat { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); }
.in-featured__h { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(1.5rem,3.5vw,2.5rem); letter-spacing: -0.035em; line-height: 1.05; margin: 0; text-wrap: balance; }
.in-featured__deck { font-size: 1.0625rem; line-height: 1.55; color: var(--tw-slogan-fg); margin: 0; text-wrap: pretty; }
.in-featured__meta { display: flex; gap: 18px; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); margin-top: 8px; }
.in-featured__meta em { font-style: normal; color: var(--tw-mark); margin-right: 6px; }
@media (max-width:880px) { .in-featured__grid { grid-template-columns: 1fr; } }

.in-filter { padding: clamp(24px,3vw,32px) 0; border-bottom: 1px solid var(--tw-line); background: var(--tw-bg); position: sticky; top: 68px; z-index: 20; backdrop-filter: blur(10px); background: rgba(15,17,18,0.92); }
@media (max-width:880px) { .in-filter { top: 124px; } }
.in-filter__inner { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.in-filter__label { font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-slogan-fg); margin-right: 8px; }
.in-chip { padding: 7px 12px; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; background: transparent; border: 1px solid var(--tw-line); color: var(--tw-slogan-fg); border-radius: 2px; cursor: pointer; transition: all var(--tw-dur-2) var(--tw-ease); }
.in-chip:hover { color: var(--tw-fg); border-color: var(--tw-fg); }
.in-chip[aria-pressed="true"] { background: var(--tw-mark); border-color: var(--tw-mark); color: var(--tw-bg); }

.in-archive { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); }
.in-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
@media (max-width:980px) { .in-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width:640px) { .in-grid { grid-template-columns: 1fr; } }
.in-card { display: flex; flex-direction: column; border: 1px solid var(--tw-line); background: var(--tw-data-bg); border-radius: 4px; overflow: hidden; text-decoration: none; color: inherit; transition: border-color var(--tw-dur-2) var(--tw-ease), transform var(--tw-dur-2) var(--tw-ease); }
.in-card:hover { border-color: var(--tw-mark); transform: translateY(-2px); }
.in-card__media { aspect-ratio: 16/10; background: #0F0F0F; position: relative; overflow: hidden; }
.in-card__media svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.in-card__cat { position: absolute; top: 14px; left: 14px; font-family: var(--tw-font-mono); font-size: 9.5px; letter-spacing: 0.2em; text-transform: uppercase; padding: 4px 8px; background: rgba(0,0,0,0.6); color: var(--tw-mark); border: 1px solid var(--tw-mark); border-radius: 2px; }
.in-card__body { padding: 20px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.in-card__meta { font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-slogan-fg); display: flex; gap: 10px; }
.in-card__meta em { font-style: normal; color: var(--tw-mark); }
.in-card__h { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.0625rem; letter-spacing: -0.02em; line-height: 1.2; margin: 0; }
.in-card__deck { font-size: 13.5px; line-height: 1.5; color: var(--tw-slogan-fg); margin: 0; flex: 1; }
.in-card__foot { padding-top: 12px; border-top: 1px solid var(--tw-line); display: flex; justify-content: space-between; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; }
.in-card__foot .arrow { color: var(--tw-mark); }
.in-card.is-hidden { display: none; }

.in-newsletter { padding: clamp(56px,7vw,88px) 0; background: var(--tw-bg); border-top: 1px solid var(--tw-line); }
.in-newsletter__inner { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.1fr); gap: clamp(28px,4vw,56px); align-items: center; padding: clamp(28px,4vw,48px); border: 1px solid var(--tw-mark); background: linear-gradient(180deg, rgba(200,232,76,0.05), rgba(200,232,76,0.01)); border-radius: 4px; }
.in-newsletter h2 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(1.75rem,3.4vw,2.5rem); letter-spacing: -0.035em; line-height: 1; margin: 0; text-wrap: balance; }
.in-newsletter h2 em { font-style: normal; color: var(--tw-mark); }
.in-newsletter p { font-size: 1rem; line-height: 1.55; color: var(--tw-slogan-fg); margin: 14px 0 0; max-width: 50ch; }
.in-newsletter form { display: flex; flex-direction: column; gap: 12px; }
.in-newsletter input { background: transparent; border: 0; border-bottom: 1px solid var(--tw-line); padding: 14px 0; color: var(--tw-fg); font-family: var(--tw-font-body); font-size: 1rem; outline: none; transition: border-color var(--tw-dur-2) var(--tw-ease); }
.in-newsletter input::placeholder { color: var(--tw-slogan-fg); }
.in-newsletter input:focus { border-bottom-color: var(--tw-mark); }
.in-newsletter button { margin-top: 8px; background: var(--tw-mark); color: var(--tw-bg); border: 0; padding: 16px 22px; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 500; cursor: pointer; border-radius: 4px; transition: background var(--tw-dur-2) var(--tw-ease); align-self: flex-start; }
.in-newsletter button:hover { background: var(--tw-fg); }
.in-newsletter .meta { font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); }
@media (max-width:880px) { .in-newsletter__inner { grid-template-columns: 1fr; } }

/* ==================== projects.html ==================== */
.pj-hero { padding: clamp(56px,7vw,108px) 0 clamp(32px,4vw,56px); border-bottom: 1px solid var(--tw-line); }
.pj-hero h1 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(2.5rem,7vw,5rem); letter-spacing: -0.05em; line-height: 0.92; margin: 18px 0 0; max-width: 18ch; text-wrap: balance; }
.pj-hero h1 em { font-style: normal; color: var(--tw-mark); }
.pj-hero__lede { font-size: clamp(1rem,1.4vw,1.25rem); line-height: 1.5; color: var(--tw-slogan-fg); max-width: 56ch; margin: 22px 0 0; }
.pj-hero__metrics { margin-top: 36px; display: grid; grid-template-columns: repeat(4,1fr); gap: 0; border-top: 1px solid var(--tw-line); }
.pj-hero__metric { padding: 18px 18px 0 0; border-right: 1px solid var(--tw-line); }
.pj-hero__metric:last-child { border-right: 0; }
.pj-hero__metric:nth-child(n+2) { padding-left: 18px; }
.pj-hero__metric .v { font-family: var(--tw-font-display); font-weight: 800; letter-spacing: -0.03em; font-size: clamp(1.5rem,3vw,2.25rem); line-height: 1; }
.pj-hero__metric .v em { font-style: normal; color: var(--tw-mark); }
.pj-hero__metric .v .u { font-size: 0.42em; color: var(--tw-slogan-fg); font-weight: 600; margin-left: 4px; }
.pj-hero__metric .l { display: block; margin-top: 8px; font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); }
@media (max-width:880px) { .pj-hero__metrics { grid-template-columns: 1fr 1fr; } .pj-hero__metric:nth-child(2n) { border-right: 0; } }

.pj-filter { position: sticky; top: 68px; z-index: 20; background: rgba(15,17,18,0.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--tw-line); padding: 14px 0; }
@media (max-width:880px) { .pj-filter { top: 124px; } }
.pj-filter__inner { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; }
.pj-filter__group { display: flex; gap: 6px; align-items: center; }
.pj-filter__group::before { content: attr(data-label); font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-slogan-fg); margin-right: 8px; }
.pj-chip { padding: 7px 12px; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; background: transparent; border: 1px solid var(--tw-line); color: var(--tw-slogan-fg); border-radius: 2px; cursor: pointer; transition: color var(--tw-dur-2) var(--tw-ease), border-color var(--tw-dur-2) var(--tw-ease), background var(--tw-dur-2) var(--tw-ease); }
.pj-chip:hover { color: var(--tw-fg); border-color: var(--tw-fg); }
.pj-chip[aria-pressed="true"] { background: var(--tw-mark); border-color: var(--tw-mark); color: var(--tw-bg); }
.pj-search { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--tw-line); border-radius: 2px; padding: 6px 12px; }
.pj-search input { background: transparent; border: 0; outline: 0; color: var(--tw-fg); font-family: var(--tw-font-mono); font-size: 12px; letter-spacing: 0.04em; min-width: 200px; }
.pj-search input::placeholder { color: var(--tw-slogan-fg); }

.pj-grid-wrap { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); }
.pj-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
@media (max-width:980px) { .pj-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width:640px) { .pj-grid { grid-template-columns: 1fr; } }
.pj-card { display: flex; flex-direction: column; border: 1px solid var(--tw-line); background: var(--tw-data-bg); border-radius: 4px; overflow: hidden; text-decoration: none; color: inherit; transition: border-color var(--tw-dur-2) var(--tw-ease), transform var(--tw-dur-2) var(--tw-ease); }
.pj-card:hover { border-color: var(--tw-mark); transform: translateY(-2px); }
.pj-card__media { aspect-ratio: 16/10; background: #0F0F0F; position: relative; overflow: hidden; }
.pj-card__media svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.pj-card__media-stat { position: absolute; left: 14px; bottom: 14px; font-family: var(--tw-font-display); font-weight: 800; letter-spacing: -0.03em; font-size: 1.5rem; color: #F4F1EC; text-shadow: 0 2px 8px rgba(0,0,0,0.4); }
.pj-card__media-stat .u { font-size: 0.48em; font-weight: 600; opacity: 0.7; margin-left: 4px; }
.pj-card__tags { position: absolute; right: 14px; top: 14px; display: flex; gap: 4px; }
.pj-card__tag { font-family: var(--tw-font-mono); font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase; padding: 3px 8px; border-radius: 2px; background: rgba(0,0,0,0.55); color: var(--tw-mark); border: 1px solid var(--tw-mark); }
.pj-card__body { padding: 20px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.pj-card__meta { font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-slogan-fg); display: flex; gap: 10px; align-items: center; }
.pj-card__meta em { font-style: normal; color: var(--tw-mark); }
.pj-card__h { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.0625rem; letter-spacing: -0.02em; line-height: 1.2; margin: 0; color: var(--tw-fg); }
.pj-card__deck { font-size: 13.5px; line-height: 1.5; color: var(--tw-slogan-fg); margin: 0; flex: 1; }
.pj-card__foot { display: flex; justify-content: space-between; padding-top: 12px; border-top: 1px solid var(--tw-line); font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; }
.pj-card__foot .arrow { color: var(--tw-mark); }
.pj-card.is-hidden { display: none; }
.pj-empty { display: none; padding: 40px; text-align: center; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); }
.pj-empty.is-visible { display: block; }

/* ==================== project-detail.html ==================== */
.proj-hero { position: relative; padding: clamp(56px,7vw,108px) 0 clamp(40px,5vw,72px); border-bottom: 1px solid var(--tw-line); overflow: hidden; }
.proj-hero__bg { position: absolute; inset: 0; pointer-events: none; opacity: 0.35; }
.proj-hero__bg svg { width: 100%; height: 100%; }
.proj-hero__inner { position: relative; }
.proj-hero__crumbs { display: flex; align-items: center; gap: 10px; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-slogan-fg); margin-bottom: 24px; flex-wrap: wrap; }
.proj-hero__crumbs a { color: var(--tw-slogan-fg); text-decoration: none; }
.proj-hero__crumbs a:hover { color: var(--tw-mark); }
.proj-hero__crumbs em { font-style: normal; color: var(--tw-mark); }
.proj-hero__crumbs .sep { opacity: 0.4; }
.proj-hero__tags { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.proj-hero__tag { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; padding: 4px 10px; border-radius: 2px; border: 1px solid; }
.proj-hero h1 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(2rem,6vw,4.25rem); letter-spacing: -0.04em; line-height: 0.95; margin: 18px 0 0; max-width: 18ch; text-wrap: balance; }
.proj-hero h1 em { font-style: normal; color: var(--tw-mark); }
.proj-hero__deck { font-size: clamp(1rem,1.4vw,1.25rem); line-height: 1.5; color: var(--tw-slogan-fg); max-width: 56ch; margin: 22px 0 0; text-wrap: pretty; }
.proj-hero__specs { margin-top: 36px; display: grid; grid-template-columns: repeat(6,1fr); gap: 0; border-top: 1px solid var(--tw-line); }
.proj-hero__spec { padding: 18px 14px 18px 0; border-right: 1px solid var(--tw-line); }
.proj-hero__spec:last-child { border-right: 0; padding-right: 0; }
.proj-hero__spec:nth-child(n+2) { padding-left: 14px; }
.proj-hero__spec .v { font-family: var(--tw-font-display); font-weight: 700; letter-spacing: -0.025em; font-size: clamp(1.125rem,1.8vw,1.5rem); line-height: 1; color: var(--tw-fg); }
.proj-hero__spec .v em { font-style: normal; color: var(--tw-mark); }
.proj-hero__spec .v .u { font-size: 0.55em; color: var(--tw-slogan-fg); font-weight: 600; margin-left: 4px; }
.proj-hero__spec .l { display: block; margin-top: 8px; font-family: var(--tw-font-mono); font-size: 9.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); }
@media (max-width:980px) { .proj-hero__specs { grid-template-columns: repeat(3,1fr); } .proj-hero__spec:nth-child(3n) { border-right: 0; } }
@media (max-width:540px) { .proj-hero__specs { grid-template-columns: 1fr 1fr; } .proj-hero__spec:nth-child(2n) { border-right: 0; } }

.proj-media { padding: clamp(40px,5vw,64px) 0; background: var(--tw-bg); }
.proj-media__frame { aspect-ratio: 16/9; border-radius: 4px; overflow: hidden; position: relative; background: #0F0F0F; }
.proj-media__frame svg { width: 100%; height: 100%; }
.proj-media__cap { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); margin-top: 14px; }
.proj-media__cap em { color: var(--tw-mark); font-style: normal; }

.proj-grid { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); border-top: 1px solid var(--tw-line); }
.proj-grid__layout { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: clamp(32px,5vw,72px); align-items: start; }
@media (max-width:980px) { .proj-grid__layout { grid-template-columns: 1fr; } }
.proj-section { margin-bottom: clamp(40px,5vw,64px); }
.proj-section:last-child { margin-bottom: 0; }
.proj-section h2 { font-family: var(--tw-font-display); font-weight: 700; font-size: clamp(1.5rem,2.6vw,2rem); letter-spacing: -0.03em; line-height: 1.1; margin: 0 0 18px; text-wrap: balance; }
.proj-section h2::before { content: ""; display: block; width: 32px; height: 2px; background: var(--tw-mark); margin-bottom: 14px; }
.proj-section p { font-size: 1rem; line-height: 1.6; color: var(--tw-fg); margin: 0 0 1em; text-wrap: pretty; }
.proj-section p em { font-style: normal; color: var(--tw-mark); font-weight: 500; }
.proj-section ul { list-style: none; padding: 0; margin: 0 0 1em; }
.proj-section ul li { padding: 6px 0 6px 24px; position: relative; font-size: 0.9375rem; line-height: 1.55; }
.proj-section ul li::before { content: ""; position: absolute; left: 0; top: 14px; width: 10px; height: 1px; background: var(--tw-mark); }

.proj-side { position: sticky; top: 84px; display: flex; flex-direction: column; gap: 20px; }
@media (max-width:980px) { .proj-side { position: static; } }
.proj-side__card { padding: 20px; border: 1px solid var(--tw-line); border-radius: 4px; background: var(--tw-data-bg); }
.proj-side__card h3 { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); margin: 0 0 14px; font-weight: 500; }
.proj-side__row { display: grid; grid-template-columns: 1fr auto; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--tw-line); font-family: var(--tw-font-mono); font-size: 12px; }
.proj-side__row:last-child { border-bottom: 0; }
.proj-side__row label { color: var(--tw-slogan-fg); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; }
.proj-side__row .v { color: var(--tw-fg); font-weight: 500; }
.proj-side__row .v em { color: var(--tw-mark); font-style: normal; }

.proj-quote { padding: clamp(28px,4vw,40px); border: 1px solid var(--tw-line); border-left: 3px solid var(--tw-mark); background: var(--tw-data-bg); border-radius: 4px; margin: clamp(28px,4vw,40px) 0; }
.proj-quote blockquote { margin: 0; font-family: var(--tw-font-display); font-weight: 600; font-size: clamp(1.125rem,1.8vw,1.375rem); line-height: 1.35; letter-spacing: -0.015em; color: var(--tw-fg); text-wrap: pretty; }
.proj-quote blockquote::before { content: "“"; color: var(--tw-mark); font-size: 1.4em; line-height: 0.5; vertical-align: -0.3em; margin-right: 4px; }
.proj-quote cite { display: block; margin-top: 18px; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); font-style: normal; }
.proj-quote cite em { font-style: normal; color: var(--tw-mark); }

.proj-arch { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); border-top: 1px solid var(--tw-line); }
.proj-arch__frame { padding: clamp(24px,3vw,40px); border: 1px solid var(--tw-line); border-radius: 4px; background: var(--tw-data-bg); }
.proj-arch__frame-head { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 12px; margin-bottom: 18px; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-slogan-fg); }
.proj-arch__frame-head em { font-style: normal; color: var(--tw-mark); }
.proj-arch__frame svg { width: 100%; height: auto; }

.proj-live { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); border-top: 1px solid var(--tw-line); }
.proj-live__panel { padding: clamp(20px,3vw,32px); border: 1px solid var(--tw-line); border-radius: 4px; background: var(--tw-data-bg); }
.proj-live__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 18px; }
.proj-live__title { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-fg); }
.proj-live__title em { font-style: normal; color: var(--tw-mark); }
.proj-live__pill { display: inline-flex; align-items: center; gap: 8px; font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-mark); padding: 4px 10px; border: 1px solid var(--tw-mark); border-radius: 999px; }
.proj-live__pill::before { content: ""; width: 6px; height: 6px; background: var(--tw-mark); border-radius: 50%; animation: pulse 1.6s var(--tw-ease) infinite; }
.proj-live__tiles { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
@media (max-width:880px) { .proj-live__tiles { grid-template-columns: 1fr 1fr; } }
.proj-live__tile { padding: 16px; border: 1px solid var(--tw-line); border-radius: 4px; background: rgba(244,241,236,0.025); }
.proj-live__tile-head { font-family: var(--tw-font-mono); font-size: 9.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-slogan-fg); margin-bottom: 8px; }
.proj-live__tile-val { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.5rem; letter-spacing: -0.025em; line-height: 1; color: var(--tw-fg); }
.proj-live__tile-val em { font-style: normal; color: var(--tw-mark); font-size: 0.6em; margin-left: 4px; }
.proj-live__tile-spark { margin-top: 10px; height: 32px; }
.proj-live__tile-spark svg { width: 100%; height: 100%; }

/* ==================== thanks.html ==================== */
.tx-hero { padding: clamp(80px,10vw,160px) 0 clamp(40px,5vw,72px); border-bottom: 1px solid var(--tw-line); }
.tx-hero__eyebrow { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); display: inline-flex; align-items: center; gap: 10px; }
.tx-hero__eyebrow::before { content: ""; width: 8px; height: 8px; background: var(--tw-mark); border-radius: 50%; animation: pulse 1.6s var(--tw-ease) infinite; }
.tx-hero h1 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(2.5rem,6vw,4.5rem); letter-spacing: -0.045em; line-height: 0.95; margin: 18px 0 0; max-width: 16ch; text-wrap: balance; }
.tx-hero h1 em { font-style: normal; color: var(--tw-mark); }
.tx-hero__lede { font-size: clamp(1rem,1.4vw,1.25rem); line-height: 1.55; color: var(--tw-slogan-fg); max-width: 56ch; margin: 24px 0 0; text-wrap: pretty; }
.tx-hero__meta { margin-top: 28px; display: flex; gap: 24px; flex-wrap: wrap; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); }
.tx-hero__meta em { font-style: normal; color: var(--tw-mark); margin-right: 8px; }

.tx-next { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.tx-next__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 28px; }
.tx-next__card { padding: clamp(20px,3vw,28px); border: 1px solid var(--tw-line); border-radius: 4px; background: var(--tw-data-bg); display: flex; flex-direction: column; gap: 14px; }
.tx-next__num { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); }
.tx-next__h { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.125rem; letter-spacing: -0.02em; line-height: 1.2; margin: 0; }
.tx-next__p { font-size: 0.9375rem; line-height: 1.55; color: var(--tw-slogan-fg); margin: 0; }
.tx-next__when { padding-top: 14px; border-top: 1px solid var(--tw-line); font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-fg); margin-top: auto; }
@media (max-width: 880px) { .tx-next__grid { grid-template-columns: 1fr; } }

.tx-wait { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); }
.tx-wait__grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 24px; }
.tx-wait__card { padding: 20px; border: 1px solid var(--tw-line); border-radius: 4px; background: var(--tw-data-bg); text-decoration: none; color: inherit; display: flex; flex-direction: column; gap: 8px; transition: border-color var(--tw-dur-2) var(--tw-ease), transform var(--tw-dur-2) var(--tw-ease); }
.tx-wait__card:hover { border-color: var(--tw-mark); transform: translateY(-2px); }
.tx-wait__cat { font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); }
.tx-wait__h { font-family: var(--tw-font-display); font-weight: 700; font-size: 1rem; letter-spacing: -0.02em; line-height: 1.25; margin: 0; }
.tx-wait__p { font-size: 0.875rem; line-height: 1.5; color: var(--tw-slogan-fg); margin: 0; flex: 1; }
.tx-wait__arrow { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-mark); margin-top: 8px; }
@media (max-width: 880px) { .tx-wait__grid { grid-template-columns: 1fr; } }

/* ==================== compliance.html ==================== */
.cm-hero { padding: clamp(80px,10vw,160px) 0 clamp(40px,5vw,72px); border-bottom: 1px solid var(--tw-line); }
.cm-hero__eyebrow { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); display: inline-flex; align-items: center; gap: 10px; }
.cm-hero__eyebrow::before { content: ""; width: 8px; height: 8px; background: var(--tw-mark); border-radius: 50%; }
.cm-hero h1 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(2.25rem,5.5vw,4rem); letter-spacing: -0.045em; line-height: 0.98; margin: 18px 0 0; max-width: 20ch; text-wrap: balance; }
.cm-hero h1 em { font-style: normal; color: var(--tw-mark); }
.cm-hero__lede { font-size: clamp(1rem,1.4vw,1.25rem); line-height: 1.55; color: var(--tw-slogan-fg); max-width: 60ch; margin: 22px 0 0; text-wrap: pretty; }

.cm-grid-wrap { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); border-bottom: 1px solid var(--tw-line); }
.cm-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.cm-cert { padding: clamp(20px,3vw,28px); border: 1px solid var(--tw-line); border-left: 3px solid var(--tw-mark); border-radius: 4px; background: var(--tw-data-bg); display: grid; grid-template-columns: auto 1fr; column-gap: clamp(18px,3vw,28px); row-gap: 10px; }
.cm-cert__tag { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); white-space: nowrap; padding-top: 6px; }
.cm-cert__name { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.125rem; letter-spacing: -0.02em; line-height: 1.2; margin: 0; }
.cm-cert__meta { font-family: var(--tw-font-mono); font-size: 11.5px; letter-spacing: 0.04em; color: var(--tw-slogan-fg); display: flex; flex-direction: column; gap: 4px; }
.cm-cert__body { grid-column: 1 / -1; font-size: 0.9375rem; line-height: 1.55; color: var(--tw-slogan-fg); margin: 8px 0 0; }
.cm-cert__action { grid-column: 1 / -1; padding-top: 14px; border-top: 1px solid var(--tw-line); margin-top: 6px; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; display: flex; justify-content: space-between; gap: 12px; }
.cm-cert__action a { color: var(--tw-mark); text-decoration: none; }
.cm-cert__action a:hover { color: var(--tw-fg); }
@media (max-width: 880px) {
  .cm-grid { grid-template-columns: 1fr; }
  .cm-cert { grid-template-columns: 1fr; }
}

.cm-request { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); }
.cm-request__panel { padding: clamp(28px,4vw,40px); border: 1px solid var(--tw-mark); background: linear-gradient(180deg, rgba(200,232,76,0.05), rgba(200,232,76,0.01)); border-radius: 4px; display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(28px,4vw,56px); align-items: center; }
.cm-request h2 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(1.5rem,3vw,2.25rem); letter-spacing: -0.035em; line-height: 1.05; margin: 0; text-wrap: balance; }
.cm-request h2 em { font-style: normal; color: var(--tw-mark); }
.cm-request p { font-size: 1rem; line-height: 1.6; color: var(--tw-slogan-fg); margin: 14px 0 0; max-width: 60ch; }
.cm-request__cta { display: flex; gap: 10px; flex-direction: column; align-items: stretch; }
.cm-request__cta .tw-btn { justify-content: center; }
@media (max-width: 880px) { .cm-request__panel { grid-template-columns: 1fr; } }

/* ==================== legal-popia.html ==================== */
.lg-hero { padding: clamp(80px,10vw,160px) 0 clamp(40px,5vw,72px); border-bottom: 1px solid var(--tw-line); }
.lg-hero__eyebrow { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); display: inline-flex; align-items: center; gap: 10px; }
.lg-hero__eyebrow::before { content: ""; width: 8px; height: 8px; background: var(--tw-mark); border-radius: 50%; }
.lg-hero h1 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(2.25rem,5.5vw,4rem); letter-spacing: -0.045em; line-height: 0.98; margin: 18px 0 0; max-width: 20ch; text-wrap: balance; }
.lg-hero h1 em { font-style: normal; color: var(--tw-mark); }
.lg-hero__lede { font-size: clamp(1rem,1.4vw,1.25rem); line-height: 1.55; color: var(--tw-slogan-fg); max-width: 60ch; margin: 22px 0 0; text-wrap: pretty; }
.lg-hero__meta { margin-top: 28px; display: flex; gap: 24px; flex-wrap: wrap; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); }
.lg-hero__meta em { font-style: normal; color: var(--tw-mark); margin-right: 8px; }

.lg-body { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); }
.lg-body__grid { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: clamp(28px,4vw,56px); align-items: start; }
.lg-toc { position: sticky; top: 88px; font-family: var(--tw-font-mono); font-size: 12px; letter-spacing: 0.04em; }
.lg-toc__h { font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); margin: 0 0 12px; }
.lg-toc__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.lg-toc__list a { color: var(--tw-slogan-fg); text-decoration: none; padding: 6px 0; display: block; border-bottom: 1px solid var(--tw-line); }
.lg-toc__list a:hover { color: var(--tw-fg); }
.lg-prose { max-width: 72ch; font-size: 1rem; line-height: 1.7; color: var(--tw-fg); }
.lg-prose h2 { font-family: var(--tw-font-display); font-weight: 700; font-size: clamp(1.375rem,2.4vw,1.875rem); letter-spacing: -0.03em; line-height: 1.15; margin: 48px 0 16px; padding-top: 24px; border-top: 1px solid var(--tw-line); text-wrap: balance; }
.lg-prose h2:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }
.lg-prose h2 .num { font-family: var(--tw-font-mono); font-size: 0.55em; letter-spacing: 0.18em; color: var(--tw-mark); margin-right: 14px; vertical-align: 0.18em; }
.lg-prose h3 { font-family: var(--tw-font-display); font-weight: 600; font-size: 1.125rem; letter-spacing: -0.02em; margin: 24px 0 8px; }
.lg-prose p { margin: 0 0 1em; text-wrap: pretty; }
.lg-prose p:last-child { margin-bottom: 0; }
.lg-prose ul, .lg-prose ol { margin: 0 0 1em 1.25em; padding: 0; }
.lg-prose ul li, .lg-prose ol li { margin: 0 0 0.4em; line-height: 1.6; }
.lg-prose strong { color: var(--tw-mark); font-weight: 500; }
.lg-prose a { color: var(--tw-mark); text-decoration: underline; text-underline-offset: 3px; }
.lg-prose code { font-family: var(--tw-font-mono); font-size: 0.9em; padding: 1px 6px; background: var(--tw-data-bg); border: 1px solid var(--tw-line); border-radius: 2px; }
.lg-prose .pq { padding: 16px 20px; border-left: 3px solid var(--tw-mark); background: var(--tw-data-bg); margin: 24px 0; }
.lg-prose .pq p { margin: 0; font-size: 0.9375rem; line-height: 1.55; }
.lg-prose .tbd { display: inline-block; padding: 2px 8px; background: rgba(232,185,46,0.12); border: 1px solid var(--tw-saffron, #E8B92E); border-radius: 2px; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--tw-saffron, #E8B92E); }
@media (max-width: 880px) {
  .lg-body__grid { grid-template-columns: 1fr; }
  .lg-toc { position: static; padding-bottom: 24px; border-bottom: 1px solid var(--tw-line); margin-bottom: 24px; }
}

/* ==================== legal-terms.html ==================== */
.lg-hero { padding: clamp(80px,10vw,160px) 0 clamp(40px,5vw,72px); border-bottom: 1px solid var(--tw-line); }
.lg-hero__eyebrow { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); display: inline-flex; align-items: center; gap: 10px; }
.lg-hero__eyebrow::before { content: ""; width: 8px; height: 8px; background: var(--tw-mark); border-radius: 50%; }
.lg-hero h1 { font-family: var(--tw-font-display); font-weight: 800; font-size: clamp(2.25rem,5.5vw,4rem); letter-spacing: -0.045em; line-height: 0.98; margin: 18px 0 0; max-width: 20ch; text-wrap: balance; }
.lg-hero h1 em { font-style: normal; color: var(--tw-mark); }
.lg-hero__lede { font-size: clamp(1rem,1.4vw,1.25rem); line-height: 1.55; color: var(--tw-slogan-fg); max-width: 60ch; margin: 22px 0 0; text-wrap: pretty; }
.lg-hero__meta { margin-top: 28px; display: flex; gap: 24px; flex-wrap: wrap; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); }
.lg-hero__meta em { font-style: normal; color: var(--tw-mark); margin-right: 8px; }

.lg-body { padding: clamp(48px,6vw,80px) 0; background: var(--tw-bg); }
.lg-body__grid { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); gap: clamp(28px,4vw,56px); align-items: start; }
.lg-toc { position: sticky; top: 88px; font-family: var(--tw-font-mono); font-size: 12px; letter-spacing: 0.04em; }
.lg-toc__h { font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); margin: 0 0 12px; }
.lg-toc__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 4px; }
.lg-toc__list a { color: var(--tw-slogan-fg); text-decoration: none; padding: 6px 0; display: block; border-bottom: 1px solid var(--tw-line); }
.lg-toc__list a:hover { color: var(--tw-fg); }
.lg-prose { max-width: 72ch; font-size: 1rem; line-height: 1.7; color: var(--tw-fg); }
.lg-prose h2 { font-family: var(--tw-font-display); font-weight: 700; font-size: clamp(1.375rem,2.4vw,1.875rem); letter-spacing: -0.03em; line-height: 1.15; margin: 48px 0 16px; padding-top: 24px; border-top: 1px solid var(--tw-line); text-wrap: balance; }
.lg-prose h2:first-of-type { border-top: 0; padding-top: 0; margin-top: 0; }
.lg-prose h2 .num { font-family: var(--tw-font-mono); font-size: 0.55em; letter-spacing: 0.18em; color: var(--tw-mark); margin-right: 14px; vertical-align: 0.18em; }
.lg-prose h3 { font-family: var(--tw-font-display); font-weight: 600; font-size: 1.125rem; letter-spacing: -0.02em; margin: 24px 0 8px; }
.lg-prose p { margin: 0 0 1em; text-wrap: pretty; }
.lg-prose p:last-child { margin-bottom: 0; }
.lg-prose ul, .lg-prose ol { margin: 0 0 1em 1.25em; padding: 0; }
.lg-prose ul li, .lg-prose ol li { margin: 0 0 0.4em; line-height: 1.6; }
.lg-prose strong { color: var(--tw-mark); font-weight: 500; }
.lg-prose a { color: var(--tw-mark); text-decoration: underline; text-underline-offset: 3px; }
.lg-prose .pq { padding: 16px 20px; border-left: 3px solid var(--tw-mark); background: var(--tw-data-bg); margin: 24px 0; }
.lg-prose .pq p { margin: 0; font-size: 0.9375rem; line-height: 1.55; }
@media (max-width: 880px) {
  .lg-body__grid { grid-template-columns: 1fr; }
  .lg-toc { position: static; padding-bottom: 24px; border-bottom: 1px solid var(--tw-line); margin-bottom: 24px; }
}

/* ==================== blog-post.html ==================== */
/* ============================================================
   BLOG POST TEMPLATE — editorial primitives
   To move into terawatt.css when promoted to the WP theme.
   ============================================================ */

/* Reading progress bar */
.read-progress { position: fixed; top: 0; left: var(--tw-spine-w); right: 0; height: 2px; z-index: 70; background: rgba(244,241,236,0.06); }
.read-progress__bar { height: 100%; background: var(--tw-mark); width: 0; transform-origin: left; transition: width 80ms linear; }
@media (max-width: 880px) { .read-progress { left: 0; top: 56px; } }

/* ============== HERO ============== */
.post-hero { position: relative; isolation: isolate; padding: clamp(48px, 7vw, 96px) 0 clamp(56px, 7vw, 88px); overflow: hidden; }
.post-hero__media { position: absolute; inset: 0; z-index: 0; }
.post-hero__media img { width: 100%; height: 100%; object-fit: cover; filter: saturate(0.85) contrast(1.05); }
.post-hero__media::after { content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(26,29,33,0.55) 0%, rgba(26,29,33,0.78) 50%, rgba(26,29,33,0.96) 100%);
}
.post-hero__inner { position: relative; z-index: 1; }
.post-hero__crumbs { display: flex; align-items: center; gap: 10px; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; color: rgba(244,241,236,0.6); margin-bottom: 28px; flex-wrap: wrap; }
.post-hero__crumbs a { color: rgba(244,241,236,0.7); text-decoration: none; }
.post-hero__crumbs a:hover { color: var(--tw-mark); }
.post-hero__crumbs em { font-style: normal; color: var(--tw-mark); }
.post-hero__crumbs .sep { opacity: 0.4; }
.post-hero__tag { display: inline-flex; align-items: center; gap: 8px; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-bg); background: var(--tw-mark); padding: 6px 12px; border-radius: 2px; }
.post-hero__tag::before { content: ""; width: 6px; height: 6px; background: var(--tw-bg); border-radius: 50%; }

.post-hero h1 {
  font-family: var(--tw-font-display); font-weight: 800;
  font-size: clamp(2rem, 5.4vw, 4.25rem); letter-spacing: -0.04em; line-height: 0.98;
  color: #F4F1EC; margin: 22px 0 0; max-width: 22ch; text-wrap: balance;
}
.post-hero__deck {
  font-family: var(--tw-font-body); font-size: clamp(1.0625rem, 1.5vw, 1.3125rem); line-height: 1.45;
  color: rgba(244,241,236,0.82); margin: 22px 0 0; max-width: 56ch; text-wrap: pretty;
}
.post-hero__meta {
  margin-top: clamp(28px, 4vw, 44px); padding-top: 22px;
  border-top: 1px solid rgba(244,241,236,0.16);
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 24px;
}
.post-hero__author { display: inline-flex; align-items: center; gap: 14px; }
.post-hero__avatar {
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--tw-mark); color: var(--tw-bg);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--tw-font-display); font-weight: 700; letter-spacing: -0.01em; font-size: 0.9375rem;
}
.post-hero__author-name { font-family: var(--tw-font-display); font-weight: 700; font-size: 1rem; letter-spacing: -0.015em; color: #F4F1EC; }
.post-hero__author-role { display: block; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(244,241,236,0.6); margin-top: 4px; }
.post-hero__stats { display: flex; gap: 28px; font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: rgba(244,241,236,0.65); }
.post-hero__stats em { font-style: normal; color: var(--tw-mark); margin-right: 6px; }
.post-hero__share { display: flex; gap: 6px; }
.post-hero__share a, .post-hero__share button {
  width: 36px; height: 36px; border-radius: 4px;
  background: rgba(244,241,236,0.06); border: 1px solid rgba(244,241,236,0.16);
  color: #F4F1EC; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background var(--tw-dur-2) var(--tw-ease), color var(--tw-dur-2) var(--tw-ease), border-color var(--tw-dur-2) var(--tw-ease);
}
.post-hero__share a:hover, .post-hero__share button:hover { background: var(--tw-mark); color: var(--tw-bg); border-color: var(--tw-mark); }
.post-hero__share svg { width: 16px; height: 16px; }

@media (max-width: 720px) {
  .post-hero__meta { grid-template-columns: 1fr; gap: 16px; }
  .post-hero__stats { flex-wrap: wrap; gap: 18px; }
  .post-hero__share { justify-self: start; }
}

/* ============== ARTICLE LAYOUT ============== */
.post-shell { padding: clamp(56px, 7vw, 88px) 0; background: var(--tw-bg); }
.post-grid {
  display: grid;
  grid-template-columns: minmax(0, 240px) minmax(0, 1fr);
  gap: clamp(32px, 5vw, 80px);
  align-items: start;
}
@media (max-width: 980px) { .post-grid { grid-template-columns: 1fr; gap: 32px; } }

/* ---- Sticky TOC ---- */
.post-toc {
  position: sticky; top: 84px;
  border-left: 1px solid var(--tw-line);
  padding-left: 20px;
  font-family: var(--tw-font-mono);
}
@media (max-width: 980px) {
  .post-toc { position: static; border-left: 0; border-top: 1px solid var(--tw-line); padding: 18px 0 0; }
  .post-toc__list { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 24px; }
}
.post-toc__head { font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-slogan-fg); margin-bottom: 18px; display: flex; justify-content: space-between; }
.post-toc__head em { font-style: normal; color: var(--tw-mark); }
.post-toc__list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 2px; }
.post-toc__list a {
  display: grid; grid-template-columns: 24px 1fr; gap: 10px;
  padding: 8px 0; font-size: 12.5px; line-height: 1.4;
  color: var(--tw-slogan-fg); text-decoration: none; letter-spacing: 0;
  text-transform: none; font-family: var(--tw-font-body);
  border-bottom: 1px solid var(--tw-line);
  transition: color var(--tw-dur-2) var(--tw-ease);
}
.post-toc__list a:last-child { border-bottom: 0; }
.post-toc__list a:hover, .post-toc__list a.active { color: var(--tw-fg); }
.post-toc__list a.active span:first-child { color: var(--tw-mark); }
.post-toc__list span:first-child { font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.14em; color: var(--tw-slogan-fg); padding-top: 2px; }

/* ============== ARTICLE BODY ============== */
.post-body { max-width: 68ch; font-size: 17px; line-height: 1.62; color: var(--tw-fg); }
.post-body p { margin: 0 0 1.4em; color: var(--tw-fg); text-wrap: pretty; }
.post-body p > strong { color: var(--tw-fg); font-weight: 600; }
.post-body p > em { color: var(--tw-mark); font-style: normal; font-weight: 500; }
.post-body a { color: var(--tw-mark); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.post-body a:hover { text-decoration-thickness: 2px; }

.post-body h2 {
  font-family: var(--tw-font-display); font-weight: 700; letter-spacing: -0.03em;
  font-size: clamp(1.5rem, 2.6vw, 2rem); line-height: 1.08;
  margin: 2em 0 0.7em; color: var(--tw-fg); text-wrap: balance;
  scroll-margin-top: 96px;
}
.post-body h2::before {
  content: ""; display: block; width: 32px; height: 2px;
  background: var(--tw-mark); margin-bottom: 18px;
}
.post-body h3 {
  font-family: var(--tw-font-display); font-weight: 700; letter-spacing: -0.025em;
  font-size: clamp(1.125rem, 1.6vw, 1.25rem); line-height: 1.2;
  margin: 1.8em 0 0.6em; color: var(--tw-fg);
}
.post-body ul, .post-body ol { margin: 0 0 1.4em 0; padding: 0; list-style: none; }
.post-body li { padding: 6px 0 6px 24px; position: relative; line-height: 1.55; }
.post-body ul li::before {
  content: ""; position: absolute; left: 0; top: 14px;
  width: 10px; height: 1px; background: var(--tw-mark);
}
.post-body ol { counter-reset: olcounter; }
.post-body ol li { counter-increment: olcounter; padding-left: 36px; }
.post-body ol li::before {
  content: counter(olcounter, decimal-leading-zero);
  position: absolute; left: 0; top: 8px;
  font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.1em;
  color: var(--tw-mark); font-weight: 600;
}

/* First-para drop cap */
.post-body > p:first-of-type::first-letter {
  font-family: var(--tw-font-display); font-weight: 800;
  font-size: 4.5em; line-height: 0.86;
  float: left; padding: 0.06em 0.12em 0 0;
  color: var(--tw-mark); letter-spacing: -0.03em;
}

/* ---- TL;DR pull-out ---- */
.tldr {
  margin: 2.4em 0;
  padding: clamp(20px, 3vw, 32px);
  border: 1px solid var(--tw-mark);
  background: linear-gradient(180deg, rgba(200,232,76,0.05), rgba(200,232,76,0.01));
  border-radius: 4px;
}
.tldr__head {
  font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--tw-mark); display: inline-flex; align-items: center; gap: 12px; margin-bottom: 14px;
}
.tldr__head::before { content: ""; width: 14px; height: 14px; border: 2px solid var(--tw-mark); border-radius: 50%; background: radial-gradient(circle, var(--tw-mark) 30%, transparent 32%); }
.tldr ul { margin: 0; padding: 0; list-style: none; }
.tldr li { padding: 8px 0 8px 24px; position: relative; font-size: 15.5px; line-height: 1.5; }
.tldr li::before {
  content: "→"; position: absolute; left: 0; top: 8px;
  font-family: var(--tw-font-mono); color: var(--tw-mark); font-weight: 600;
}

/* ---- Pull quote ---- */
.pq {
  margin: 2.4em 0; padding: 24px 0 24px 28px;
  border-left: 3px solid var(--tw-mark);
  font-family: var(--tw-font-display); font-weight: 600;
  font-size: clamp(1.25rem, 2vw, 1.625rem); line-height: 1.3; letter-spacing: -0.02em;
  color: var(--tw-fg); text-wrap: pretty;
}
.pq cite {
  display: block; margin-top: 14px;
  font-family: var(--tw-font-mono); font-weight: 400; font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-slogan-fg); font-style: normal;
}

/* ---- Figures + charts ---- */
.fig { margin: 2.4em 0; border: 1px solid var(--tw-line); border-radius: 4px; background: var(--tw-data-bg); overflow: hidden; }
.fig__head { padding: 14px 20px; border-bottom: 1px solid var(--tw-line); display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-slogan-fg); }
.fig__head em { font-style: normal; color: var(--tw-mark); }
.fig__canvas { padding: clamp(24px, 3vw, 36px); }
.fig__canvas svg { width: 100%; height: auto; display: block; max-height: 400px; }
.fig__cap { padding: 14px 20px; border-top: 1px solid var(--tw-line); font-family: var(--tw-font-body); font-size: 13.5px; line-height: 1.5; color: var(--tw-slogan-fg); }
.fig__cap strong { color: var(--tw-fg); font-weight: 600; }

/* ---- Table ---- */
.post-table { margin: 2.4em 0; border: 1px solid var(--tw-line); border-radius: 4px; overflow: hidden; }
.post-table table { width: 100%; border-collapse: collapse; }
.post-table th, .post-table td {
  padding: 14px 16px; text-align: left;
  border-bottom: 1px solid var(--tw-line);
  font-size: 13.5px; line-height: 1.4;
}
.post-table th {
  font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--tw-slogan-fg); font-weight: 500;
  background: rgba(244,241,236,0.03);
}
.post-table td { font-family: var(--tw-font-body); color: var(--tw-fg); }
.post-table .num { font-family: var(--tw-font-mono); font-variant-numeric: tabular-nums; text-align: right; }
.post-table .num--mark { color: var(--tw-mark); font-weight: 600; }
.post-table tr:hover td { background: rgba(244,241,236,0.025); }
.post-table tr:last-child td { border-bottom: 0; }
@media (max-width: 720px) {
  .post-table { overflow-x: auto; }
  .post-table table { min-width: 640px; }
}

/* ---- Numbered framework ---- */
.framework { margin: 2.4em 0; display: grid; gap: 12px; }
.framework__step { padding: 20px; border: 1px solid var(--tw-line); border-left: 3px solid var(--tw-mark); border-radius: 4px; background: var(--tw-data-bg); display: grid; grid-template-columns: 36px 1fr; gap: 16px; align-items: start; }
.framework__step .n { font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.18em; color: var(--tw-mark); padding-top: 4px; }
.framework__step h4 { font-family: var(--tw-font-display); font-size: 1.0625rem; font-weight: 700; letter-spacing: -0.02em; margin: 0 0 6px; color: var(--tw-fg); }
.framework__step p { margin: 0; color: var(--tw-slogan-fg); font-size: 14px; line-height: 1.55; }

/* ---- Inline CTA ---- */
.inline-cta {
  margin: 2.4em 0;
  padding: clamp(24px, 3vw, 36px);
  border-radius: 4px;
  background: linear-gradient(165deg, rgba(232,185,46,0.08), rgba(14,36,59,0.6));
  border: 1px solid rgba(232,185,46,0.30);
  display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center;
}
.inline-cta__head { font-family: var(--tw-font-display); font-weight: 700; letter-spacing: -0.025em; font-size: 1.25rem; line-height: 1.2; color: var(--tw-fg); margin: 0 0 8px; }
.inline-cta__head em { color: #E8B92E; font-style: normal; }
.inline-cta__sub { font-size: 14px; color: var(--tw-slogan-fg); line-height: 1.5; margin: 0; max-width: 50ch; }
.inline-cta__btn {
  padding: 14px 22px;
  font-family: var(--tw-font-mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 500;
  background: #E8B92E; color: #0E243B; border: 1px solid #E8B92E; border-radius: 4px;
  text-decoration: none; display: inline-flex; align-items: center; gap: 10px;
  white-space: nowrap; transition: background var(--tw-dur-2) var(--tw-ease);
}
.inline-cta__btn:hover { background: #F4F1EC; }
@media (max-width: 720px) { .inline-cta { grid-template-columns: 1fr; } }

/* ---- FAQ accordion ---- */
.faqs { margin: 2.4em 0; border-top: 1px solid var(--tw-line); }
.faqs details { border-bottom: 1px solid var(--tw-line); padding: 0; }
.faqs summary {
  padding: 20px 32px 20px 0; cursor: pointer;
  list-style: none; position: relative;
  font-family: var(--tw-font-display); font-weight: 600; font-size: 1.0625rem; letter-spacing: -0.015em;
  color: var(--tw-fg); line-height: 1.35; text-wrap: pretty;
}
.faqs summary::-webkit-details-marker { display: none; }
.faqs summary::after {
  content: "+"; position: absolute; right: 0; top: 50%; transform: translateY(-50%);
  font-family: var(--tw-font-mono); font-weight: 400; font-size: 22px;
  color: var(--tw-mark); transition: transform var(--tw-dur-2) var(--tw-ease);
  width: 24px; height: 24px; display: flex; align-items: center; justify-content: center;
}
.faqs details[open] summary::after { content: "−"; }
.faqs details[open] summary { color: var(--tw-mark); }
.faqs__a { padding: 0 32px 20px 0; color: var(--tw-slogan-fg); font-size: 15px; line-height: 1.6; }
.faqs__a p { margin: 0; }

/* ---- Author box ---- */
.authorbox {
  margin: 56px 0 0; padding: clamp(24px, 3vw, 36px);
  border: 1px solid var(--tw-line); border-radius: 4px; background: var(--tw-data-bg);
  display: grid; grid-template-columns: 80px 1fr auto; gap: 24px; align-items: start;
}
.authorbox__avatar {
  width: 80px; height: 80px; border-radius: 50%;
  background: linear-gradient(135deg, var(--tw-mark), color-mix(in oklab, var(--tw-mark), #000 25%));
  color: var(--tw-bg); display: flex; align-items: center; justify-content: center;
  font-family: var(--tw-font-display); font-weight: 800; font-size: 1.875rem; letter-spacing: -0.02em;
}
.authorbox__by { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tw-slogan-fg); }
.authorbox__name { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.375rem; letter-spacing: -0.02em; margin: 6px 0 4px; color: var(--tw-fg); }
.authorbox__role { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-mark); margin-bottom: 12px; display: block; }
.authorbox__bio { color: var(--tw-slogan-fg); font-size: 14.5px; line-height: 1.55; margin: 0; max-width: 60ch; }
.authorbox__links { display: flex; flex-direction: column; gap: 8px; align-self: center; font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; }
.authorbox__links a { color: var(--tw-mark); text-decoration: none; white-space: nowrap; }
.authorbox__links a:hover { color: var(--tw-fg); }
@media (max-width: 720px) {
  .authorbox { grid-template-columns: 64px 1fr; }
  .authorbox__avatar { width: 64px; height: 64px; font-size: 1.5rem; }
  .authorbox__links { grid-column: 1 / -1; flex-direction: row; gap: 18px; }
}

/* ---- Related ---- */
.related { padding: clamp(56px, 7vw, 96px) 0; border-top: 1px solid var(--tw-line); background: var(--tw-bg); }
.related__head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 32px; flex-wrap: wrap; }
.related__head h2 { font-family: var(--tw-font-display); font-weight: 700; letter-spacing: -0.03em; font-size: clamp(1.5rem, 2.6vw, 2rem); margin: 0; }
.related__head h2 em { font-style: normal; color: var(--tw-mark); }
.related__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.relcard {
  border: 1px solid var(--tw-line); background: var(--tw-data-bg); border-radius: 4px; overflow: hidden;
  display: flex; flex-direction: column; text-decoration: none; color: inherit;
  transition: border-color var(--tw-dur-2) var(--tw-ease), transform var(--tw-dur-2) var(--tw-ease);
}
.relcard:hover { border-color: var(--tw-mark); transform: translateY(-2px); }
.relcard__media { aspect-ratio: 16/9; background: #0F0F0F; position: relative; overflow: hidden; }
.relcard__media svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.relcard__body { padding: 22px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.relcard__meta { font-family: var(--tw-font-mono); font-size: 10px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-mark); display: flex; gap: 12px; }
.relcard__meta .dot { color: var(--tw-slogan-fg); }
.relcard__title { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.0625rem; letter-spacing: -0.02em; line-height: 1.2; color: var(--tw-fg); margin: 0; }
.relcard__deck { font-size: 13.5px; line-height: 1.5; color: var(--tw-slogan-fg); margin: 0; flex: 1; }
.relcard__footer { padding-top: 12px; border-top: 1px solid var(--tw-line); font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-fg); display: flex; justify-content: space-between; }
.relcard__footer .arrow { color: var(--tw-mark); }
@media (max-width: 980px) { .related__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .related__grid { grid-template-columns: 1fr; } }

/* ==================== 404.html ==================== */
.fourohfour { min-height: calc(100vh - 68px); display: grid; place-items: center; padding: clamp(48px,8vw,120px) 0; background: var(--tw-bg); position: relative; overflow: hidden; }
.fourohfour__bg { position: absolute; inset: 0; pointer-events: none; opacity: 0.55; }
.fourohfour__bg svg { width: 100%; height: 100%; }
.fourohfour__inner { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(32px,5vw,80px); align-items: center; max-width: 1200px; margin: 0 auto; padding: 0 clamp(20px,4vw,56px); }
.fourohfour__code { font-family: var(--tw-font-display); font-weight: 800; letter-spacing: -0.06em; line-height: 0.9; font-size: clamp(8rem, 22vw, 18rem); color: var(--tw-mark); display: flex; align-items: center; gap: 0; position: relative; }
.fourohfour__code .digit { display: inline-block; }
.fourohfour__code .digit--zero { position: relative; }
.fourohfour__code .digit--zero::after { content: ""; position: absolute; inset: 18% 18%; border: 0.18em solid var(--tw-bg); border-radius: 50%; }
.fourohfour__diag { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--tw-slogan-fg); display: flex; gap: 12px; margin-bottom: 24px; }
.fourohfour__diag::before { content: ""; width: 8px; height: 8px; background: var(--tw-mark); border-radius: 50%; align-self: center; animation: pulse 1.6s var(--tw-ease) infinite; }
.fourohfour h1 { font-family: var(--tw-font-display); font-weight: 800; letter-spacing: -0.04em; line-height: 0.98; font-size: clamp(2rem,4.5vw,3.5rem); color: var(--tw-fg); margin: 0; text-wrap: balance; }
.fourohfour h1 em { font-style: normal; color: var(--tw-mark); }
.fourohfour__lede { font-size: clamp(1rem,1.3vw,1.125rem); line-height: 1.55; color: var(--tw-slogan-fg); max-width: 50ch; margin: 18px 0 0; }
.fourohfour__links { margin-top: 32px; display: grid; grid-template-columns: 1fr 1fr; gap: 0; border-top: 1px solid var(--tw-line); }
.fourohfour__links a { display: flex; flex-direction: column; gap: 6px; padding: 18px 18px 18px 0; border-bottom: 1px solid var(--tw-line); border-right: 1px solid var(--tw-line); text-decoration: none; color: var(--tw-fg); transition: background var(--tw-dur-2) var(--tw-ease); }
.fourohfour__links a:hover { background: var(--tw-data-bg); color: var(--tw-mark); }
.fourohfour__links a:nth-child(2n) { border-right: 0; padding-left: 18px; padding-right: 0; }
.fourohfour__links .tag { font-family: var(--tw-font-mono); font-size: 10.5px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--tw-mark); }
.fourohfour__links .l { font-family: var(--tw-font-display); font-weight: 700; font-size: 1.0625rem; letter-spacing: -0.02em; }
.fourohfour__cta { margin-top: 32px; display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width:880px) { .fourohfour__inner { grid-template-columns: 1fr; gap: 32px; } .fourohfour__code { font-size: clamp(7rem,30vw,12rem); justify-self: start; } }
