/* Brand styling for block content (About page and any page built from blocks).
   Loaded on the front end AND inside the block editor, so the editor matches the site. */

.us-blocks { max-width: 1280px; margin: 0 auto; padding: 72px 56px 96px; font-family: var(--font-body); color: var(--ink-900); }
.us-blocks > * + * { margin-top: 16px; }
.us-blocks h1, .us-blocks h2, .us-blocks h3, .us-blocks h4 { font-family: var(--font-display); font-weight: 400; text-transform: uppercase; letter-spacing: -0.005em; line-height: 0.95; color: var(--ink-900); margin: 0 0 16px; }
.us-blocks h1 { font-size: clamp(40px, 5vw, 72px); }
.us-blocks h2 { font-size: clamp(32px, 4vw, 52px); }
.us-blocks h3 { font-size: 28px; }
.us-blocks p, .us-blocks li { font-size: 17px; line-height: 1.6; color: var(--ink-800); }
.us-blocks a { color: var(--ink-900); text-decoration: underline; text-decoration-thickness: 1px; }
.us-blocks a:hover { text-decoration-thickness: 2px; }
.us-blocks img { max-width: 100%; height: auto; }

/* Headline accent: bold words in the big headline render in rust */
.us-about-h1 strong, .us-h2 strong { color: var(--rust-500); font-weight: inherit; }
.wp-block-heading.us-about-h1 { font-family: var(--font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(40px, 5vw, 72px); line-height: 0.95; letter-spacing: -0.005em; max-width: 14ch; margin: 12px 0 28px; }

/* Hero columns */
.wp-block-columns.us-about-hero-cols { gap: 48px; align-items: center; margin-bottom: 48px; }
.us-about-art { display: flex; justify-content: center; }
.wp-block-image.us-about-mascot { margin: 0; }
.wp-block-image.us-about-mascot img { width: 100%; max-width: 340px; }

.wp-block-separator.us-divider { border: 0; border-top: 2px solid var(--ink-900); opacity: 1; width: 100%; max-width: none; margin: 0 0 48px; }

/* Host cards */
.wp-block-columns.us-hosts-cols { gap: 22px; margin-top: 28px; align-items: stretch; }
.wp-block-column.us-host { background: var(--peach-50); border: 2px solid var(--ink-900); box-shadow: 4px 4px 0 var(--ink-900); padding: 24px; transition: transform 120ms var(--ease-out), box-shadow 120ms var(--ease-out); }
.wp-block-column.us-host:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 var(--ink-900); }
.wp-block-column.us-host > * { margin-top: 0; }
.wp-block-image.us-host-photo { margin: 0 0 12px; width: 96px; height: 96px; border-radius: 50%; border: 2px solid var(--ink-900); overflow: hidden; background: var(--peach-200); }
.wp-block-image.us-host-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.wp-block-heading.us-host-name { font-family: var(--font-display); font-weight: 400; text-transform: uppercase; font-size: 32px; line-height: 1; margin: 4px 0 0; }
p.us-host-role { font-family: var(--font-body); font-style: italic; font-size: 15px; color: var(--ink-700); margin: 2px 0 8px; }
p.us-host-from { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--ink-700); margin: 0; }
p.us-host-bio { font-family: var(--font-body); font-size: 15px; line-height: 1.55; color: var(--ink-800); margin: 12px 0 0; }
p.us-eyebrow { font-family: var(--font-mono); font-size: 12px; text-transform: uppercase; letter-spacing: 0.16em; color: var(--ink-700); margin: 0 0 8px; }
p.us-body { max-width: 58ch; }

/* ───────── Home + Episodes block layouts ───────── */
.us-page { overflow-x: clip; }
.us-blocks-home { padding-bottom: 0; }
.wp-block-columns.us-hero-cols { gap: 40px; align-items: center; margin-bottom: 56px; }
p.us-hero-stripe { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: 0.18em; color: var(--ink-700); display: flex; align-items: center; gap: 10px; margin: 0 0 16px; }
p.us-hero-stripe::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--alert-red); flex: none; }
.wp-block-heading.us-hero-h1 { font-family: var(--font-display); font-weight: 400; text-transform: uppercase; font-size: clamp(48px, 6.5vw, 96px); line-height: 0.92; letter-spacing: -0.005em; margin: 0 0 24px; color: var(--ink-900); }
.us-hero-h1 strong { color: var(--rust-500); font-weight: inherit; }
.us-hero-h1 em { font-style: normal; font-size: 0.4em; display: inline-block; }
p.us-hero-sub { font-size: 18px; line-height: 1.55; color: var(--ink-800); max-width: 52ch; margin: 0 0 28px; }
.wp-block-image.us-hero-mascot { margin: 0; }
.wp-block-image.us-hero-mascot img { width: 100%; max-width: 380px; }
.wp-block-buttons { gap: 14px; }
.wp-block-button.us-btn-primary .wp-block-button__link,
.wp-block-button.us-btn-ghost .wp-block-button__link { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.04em; font-size: 14px; padding: 14px 24px; border-radius: 999px; text-decoration: none; border: 2px solid var(--ink-900); transition: transform 120ms var(--ease-out), background 120ms var(--ease-out), color 120ms var(--ease-out); }
.wp-block-button.us-btn-primary .wp-block-button__link { background: var(--ink-900); color: var(--peach-100); }
.wp-block-button.us-btn-primary .wp-block-button__link:hover { background: var(--rust-500); border-color: var(--rust-500); }
.wp-block-button.us-btn-ghost .wp-block-button__link { background: transparent; color: var(--ink-900); }
.wp-block-button.us-btn-ghost .wp-block-button__link:hover { background: var(--ink-900); color: var(--peach-100); }
.wp-block-button .wp-block-button__link:active { transform: translate(2px, 2px); }

/* Full-bleed bands inside the block wrapper */
.us-blocks .us-marquee, .us-blocks .us-newsletter { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.us-blocks .us-section { padding: 56px 0; max-width: none; }
.us-blocks .us-ep-list { padding: 24px 0 0; max-width: none; }
.us-blocks .us-ep-card-title, .us-blocks .us-ep-row-title { font-size: 24px; margin: 4px 0; }
.us-blocks .us-ep-row-title { font-size: 22px; }
.us-blocks .us-ep-card-sub, .us-blocks .us-ep-row-sub { font-size: 14px; }
.wp-block-heading.us-archive-h1 { font-size: clamp(36px, 5vw, 64px); margin: 0 0 20px; }
p.us-archive-sub { font-size: 17px; color: var(--ink-700); max-width: 60ch; }
p.us-archive-sub a { color: var(--ink-900); }

/* Signup band — styles Jetpack's native form to match */
.us-newsletter .us-h2 { color: var(--peach-100); }
.us-newsletter-form { max-width: 520px; margin: 0 auto; }
.us-newsletter-form form, .us-newsletter-form .wp-block-jetpack-subscriptions__form-elements { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; align-items: stretch; margin: 0; }
.us-newsletter-form p { margin: 0; color: var(--peach-200); }
.us-newsletter-form input[type="email"], .us-newsletter-form input[type="text"] { flex: 1; min-width: 220px; font-family: var(--font-body); font-size: 15px; padding: 12px 16px; border: 2px solid var(--peach-100) !important; border-radius: 0 !important; background: transparent !important; color: var(--peach-100) !important; }
.us-newsletter-form input::placeholder { color: var(--peach-300); }
.us-newsletter-form button, .us-newsletter-form input[type="submit"] { font-family: var(--font-display) !important; text-transform: uppercase; letter-spacing: 0.04em; font-size: 14px !important; padding: 14px 24px !important; border-radius: 999px !important; border: 0 !important; background: var(--peach-100) !important; color: var(--ink-900) !important; cursor: pointer; }
.us-newsletter-form button:hover, .us-newsletter-form input[type="submit"]:hover { background: var(--rust-500) !important; color: var(--peach-50) !important; }
.us-newsletter-fallback .us-btn-ghost { color: var(--peach-100); border-color: var(--peach-100); }

/* 404 */
.us-404 { min-height: 60vh; }

/* Editor previews of theme blocks */
.us-ssr { pointer-events: none; }
.us-ssr .us-marquee, .us-ssr .us-newsletter { margin-left: 0; margin-right: 0; }

@media (max-width: 900px) {
  .us-blocks { padding: 48px 24px 72px; }
}