/* blocks.css — styles native Gutenberg (core block) output for CONVERTED pages.
 *
 * P2 strategy (2026-07-16): a converted page stores its content as core blocks in
 * post_content and renders via page.php's the_content() path (no parts/<slug>.php).
 * The trick that keeps this cheap: each block carries the THEME'S OWN classNames
 * (section / section-title / section-eyebrow / grid-3 / card / faq-item …) in the
 * block's "Additional CSS class(es)" field, so it inherits the existing shared.css /
 * upgrades.css styling — and every one of those rules is already token-based, so the
 * font swap (item 2) and light palette (item 3) carry through with no rework here.
 *
 * This file only fixes the gaps: the .entry-content wrapper, a few core-block defaults,
 * and a cover-block-as-hero so a converted page's hero is client-editable.
 */

/* the block render wrapper (page.php fallback) */
.entry-content{ display:block; }
.entry-content > *{ /* full-width sections; the theme's .section owns its own padding */ }

/* core blocks that AREN'T given a theme className fall back to sane, on-token defaults */
.entry-content p:not([class]){ font-family:var(--sans); color:var(--muted); line-height:1.8;
  max-width:68ch; }
.entry-content h1:not([class]),.entry-content h2:not([class]),
.entry-content h3:not([class]){ font-family:var(--serif); font-weight:300; color:var(--white); }
.entry-content a:not([class]){ color:var(--gold); }
.entry-content ul:not([class]),.entry-content ol:not([class]){ font-family:var(--sans);
  color:var(--muted); line-height:1.8; }

/* core/image + core/columns keep their intrinsic layout; just clamp + round-trip safe */
.entry-content .wp-block-image img{ max-width:100%; height:auto; display:block; }
.entry-content .wp-block-columns{ display:flex; gap:clamp(1.25rem,3vw,2.4rem); flex-wrap:wrap; }
.entry-content .wp-block-column{ flex:1 1 0; min-width:min(100%,220px); }

/* core/buttons -> our .btn look, via tokens */
.entry-content .wp-block-button__link{ display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:0 22px; border-radius:2px; font-family:var(--sans); font-size:12px;
  font-weight:500; letter-spacing:.14em; text-transform:uppercase; text-decoration:none;
  background:var(--btn-bg); color:var(--btn-fg); border:1px solid transparent; transition:background .25s var(--ease); }
.entry-content .wp-block-button__link:hover{ background:var(--btn-bg-hover); }

/* core/cover used as a page hero (className "page-hero") */
.wp-block-cover.page-hero{ min-height:52vh; align-items:center; justify-content:center;
  text-align:center; color:var(--white); }
@media(min-width:900px){ .wp-block-cover.page-hero{ min-height:58vh; } }
.wp-block-cover.page-hero .wp-block-cover__inner-container{ max-width:820px; padding:0 24px; }
.wp-block-cover.page-hero h1{ font-family:var(--serif); font-weight:300; color:var(--white);
  font-size:clamp(2.4rem,6vw,4.4rem); line-height:1.05; margin:0; }
.wp-block-cover.page-hero p{ font-family:var(--sans); color:rgba(255,255,255,.82); font-weight:300;
  margin:.9rem auto 0; max-width:52ch; }

/* core/details as an accordion styled like our .faq-item (client can add/remove FAQs natively) */
.entry-content .wp-block-details{ border-bottom:1px solid var(--border); padding:18px 0; }
.entry-content .wp-block-details summary{ font-family:var(--sans); font-size:1.02rem; color:var(--white);
  cursor:pointer; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.entry-content .wp-block-details summary::-webkit-details-marker{ display:none; }
.entry-content .wp-block-details summary::after{ content:'+'; color:var(--gold); font-size:1.4rem; line-height:1; }
.entry-content .wp-block-details[open] summary::after{ content:'\2212'; }
.entry-content .wp-block-details > :not(summary){ font-family:var(--sans); color:var(--muted);
  line-height:1.75; margin-top:.8rem; }

/* Converted-page hero: a plain group carrying .hero renders at 100vh (from shared.css)
   because .hero--short lives in quiz.css (not loaded here). Scope a short hero to
   converted pages via the .entry-content ancestor — bespoke heros are unaffected. */
.entry-content .hero,
.entry-content .hero.hero--short{ min-height:44vh!important; padding:clamp(90px,14vh,140px) 24px clamp(48px,7vh,72px)!important;
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.entry-content .hero .hero-h1,
.entry-content .hero h1{ font-size:clamp(2.4rem,6vw,4.2rem); }