/*
  Applied only when a piece is shown inside alexcorvin.io (the page URL has ?embed=site, which embed.js
  turns into the .in-site class). Opening a piece directly leaves it exactly as built.

  Goals: no title repeated inside the project page, one set of colors, one type voice
  (Geist for text, Geist Mono for labels), and content that lines up with the site's own column.
  Site tokens: ink #1c1e21, muted #5a5e66, soft #8b8e93, hairline #e3e4e1. Display weight 300.
*/
html.in-site body { margin: 0; }

/* ------------------------------------------------------------------ The Speed of News (light) */
html.in-site[data-piece="speed-of-news"] header h1,
html.in-site[data-piece="speed-of-news"] header .sub { display: none; }
html.in-site[data-piece="speed-of-news"] .sheet { max-width: none; padding-inline: 0; padding-block: 0 32px; }

/* ------------------------------------------------------------------ Medicaid Spending Explorer (light) */
html.in-site[data-piece="medicaid-spending-explorer"] {
  color-scheme: light;
  --surface: #ffffff; --surface-2: #f6f6f3; --rule: #e3e4e1;
  --ink: #1c1e21; --ink-2: #5a5e66; --ink-3: #8b8e93;
}
html.in-site[data-piece="medicaid-spending-explorer"] .eyebrow,
html.in-site[data-piece="medicaid-spending-explorer"] h1,
html.in-site[data-piece="medicaid-spending-explorer"] .dek { display: none; }
html.in-site[data-piece="medicaid-spending-explorer"] .wrap { max-width: none; padding: 0 0 40px; }
/* heavy 700 figures become the site's light display weight */
html.in-site[data-piece="medicaid-spending-explorer"] .hero { font-weight: 300; letter-spacing: -.04em; }
html.in-site[data-piece="medicaid-spending-explorer"] h2 { font-weight: 400; letter-spacing: -.02em; }
/* mono labels: the site's weight and tracking instead of ultra-wide .18em */
html.in-site[data-piece="medicaid-spending-explorer"] .control label,
html.in-site[data-piece="medicaid-spending-explorer"] .panel .kicker,
html.in-site[data-piece="medicaid-spending-explorer"] .legend-title,
html.in-site[data-piece="medicaid-spending-explorer"] summary,
html.in-site[data-piece="medicaid-spending-explorer"] th { font-weight: 400; letter-spacing: .09em; }
html.in-site[data-piece="medicaid-spending-explorer"] .legend .sw { font-weight: 400; }

/* ------------------------------------------------------------------ Holding Still (dark, sits in a full-bleed dark band) */
html.in-site[data-piece="holding-still"] header.wrap { display: none; }
html.in-site[data-piece="holding-still"] .wrap { max-width: none; padding-inline: 0; }
html.in-site[data-piece="holding-still"] main.wrap { padding-top: 0; }
/* vh inside an auto-sizing frame would feed back on itself, so use a fixed cap */
html.in-site[data-piece="holding-still"] .hero img { max-height: 720px; }
html.in-site[data-piece="holding-still"] h2 { font-weight: 400; letter-spacing: -.025em; font-size: clamp(26px, 3.2vw, 40px); line-height: 1.1; max-width: 24ch; }

/* ------------------------------------------------------------------ Renewable Energy Shift (light) */
html.in-site[data-piece="renewable-energy-shift"] {
  color-scheme: light;
  --bg: #ffffff; --panel: #ffffff;
  --ink: #1c1e21; --ink-2: #5a5e66; --ink-3: #8b8e93; --rule: #e3e4e1; --grid: #eeeeec;
  --accent: #1c1e21; --accent-soft: #1c1e21;
}
html.in-site[data-piece="renewable-energy-shift"] header .eyebrow,
html.in-site[data-piece="renewable-energy-shift"] header h1,
html.in-site[data-piece="renewable-energy-shift"] header .subtitle { display: none; }
html.in-site[data-piece="renewable-energy-shift"] .wrap { max-width: none; padding: 0 0 40px; }
/* the site's light display weight instead of 600-700 */
html.in-site[data-piece="renewable-energy-shift"] h2 { font-weight: 400; letter-spacing: -.025em; }
html.in-site[data-piece="renewable-energy-shift"] h3 { font-weight: 500; }
html.in-site[data-piece="renewable-energy-shift"] .lede { font-weight: 300; letter-spacing: -.02em; }
html.in-site[data-piece="renewable-energy-shift"] .lede strong { font-weight: 400; }
/* mono labels: the site's weight and tracking */
html.in-site[data-piece="renewable-energy-shift"] .eyebrow,
html.in-site[data-piece="renewable-energy-shift"] .controls .label,
html.in-site[data-piece="renewable-energy-shift"] th { font-weight: 400; letter-spacing: .09em; }

/* ------------------------------------------------------------------ Contaminants in Cat Food (light) */
html.in-site[data-piece="cat-food-contaminants"] header > div:first-child h1,
html.in-site[data-piece="cat-food-contaminants"] header > div:first-child .sub { display: none; }
html.in-site[data-piece="cat-food-contaminants"] .sheet { max-width: none; padding-inline: 0; padding-block: 0 32px; }
html.in-site[data-piece="cat-food-contaminants"] .figure { margin-top: clamp(32px, 4vw, 56px); }

/* ------------------------------------------------------------------ AI Data Center Power (light) */
html.in-site[data-piece="ai-data-center-power"] header.top,
html.in-site[data-piece="ai-data-center-power"] .hero .mono,
html.in-site[data-piece="ai-data-center-power"] .hero h1 { display: none; }
html.in-site[data-piece="ai-data-center-power"] .wrap { max-width: none; padding-inline: 0; }
html.in-site[data-piece="ai-data-center-power"] .hero { padding: 0 0 clamp(40px, 6vw, 72px); }
html.in-site[data-piece="ai-data-center-power"] .lede { margin-top: 0; }
html.in-site[data-piece="ai-data-center-power"] footer { padding-bottom: 32px; }

/* ------------------------------------------------------------------ Spain Housing Prices (light, Svelte build) */
html.in-site[data-piece="spain-housing-prices"] header { display: none; }
html.in-site[data-piece="spain-housing-prices"] main { max-width: none; padding: 0 0 32px; }
