/* ============================================================
   blocks-a.css — content/layout block partials (blocks-a slice)
   heading · rich_text · callout · button · divider · columns ·
   social_row · cta_band · feature_grid · tabs
   Mobile-first; Golden Hour tokens only; reduced-motion respected
   (tokens.css also zeroes all animation/transition durations globally).
   ============================================================ */

/* ---------- shared block rhythm ---------- */
.blk{ padding-block:var(--space-6); }
.blk--center{ text-align:center; }
.blk--center .blk-social,
.blk--center .blk-cols{ justify-content:center; }

/* pages that begin with a flowing block (no hero) need clearance under the fixed nav */
main > .blk:first-child:not(.blk--cta_band){ padding-top:calc(96px + var(--space-8)); }
main > .blk:last-child:not(.blk--cta_band){ padding-bottom:var(--space-16); }

/* ---------- heading ---------- */
.blk--heading{ padding-block:var(--space-8) var(--space-2); }
.blk-heading{ text-wrap:balance; }
.blk-heading--h1{ font-size:var(--fs-h1); }
.blk-heading--h5{ font-family:var(--font-sans); font-weight:600; font-size:var(--fs-body);
  letter-spacing:.02em; color:var(--ink); }

/* ---------- prose (rich_text, columns, callout, tab bodies) ---------- */
.prose{ max-width:72ch; }
.blk--center .prose{ margin-inline:auto; }
.prose > :first-child{ margin-top:0; }
.prose > :last-child{ margin-bottom:0; }
.prose p{ margin:0 0 var(--space-4); color:var(--ink-soft); }
.prose h1,.prose h2,.prose h3{ font-family:var(--font-serif); font-weight:500; color:var(--ink);
  margin:var(--space-8) 0 var(--space-3); line-height:1.15; letter-spacing:-.01em; }
.prose h1{ font-size:var(--fs-h2); }
.prose h2{ font-size:var(--fs-h3); }
.prose h3{ font-size:1.25rem; }
.prose h4,.prose h5,.prose h6{ font-family:var(--font-sans); font-weight:600; font-size:var(--fs-body);
  color:var(--ink); margin:var(--space-6) 0 var(--space-2); }
.prose a{ color:var(--brass-deep); font-weight:500; text-decoration:none;
  border-bottom:1px solid rgba(58,42,114,.4);
  transition:color .2s var(--ease), border-color .2s var(--ease); }
.prose a:hover{ color:var(--ink); border-bottom-color:var(--brass); border-bottom-width:2px; }
.prose ul,.prose ol{ margin:0 0 var(--space-4); padding-left:1.4em; display:grid; gap:var(--space-2); }
.prose ul ul,.prose ol ol,.prose ul ol,.prose ol ul{ margin:var(--space-2) 0 0; }
.prose li{ color:var(--ink-soft); }
.prose li::marker{ color:var(--brass); font-weight:600; }
.prose blockquote{ margin:var(--space-6) 0; padding:var(--space-1) 0 var(--space-1) var(--space-6);
  border-left:2px solid var(--brass); font-family:var(--font-serif); font-size:1.25rem;
  line-height:1.45; color:var(--ink); }
.prose blockquote p{ color:inherit; margin-bottom:var(--space-2); }
.prose table{ width:100%; border-collapse:collapse; margin:var(--space-6) 0; font-size:var(--fs-sm); }
.prose th{ text-align:left; font-weight:600; color:var(--ink); padding:10px 14px;
  border-bottom:2px solid var(--brass); }
.prose td{ padding:10px 14px; border-bottom:var(--border-hair); color:var(--ink-soft); }
.prose tr:hover td{ background:rgba(58,42,114,.05); }
.prose hr{ border:0; height:1px; background:var(--brass); opacity:.55; margin:var(--space-8) 0; }
.prose code{ font-size:.9em; background:rgba(28,27,25,.07); padding:2px 6px; border-radius:4px; }
.prose pre{ background:#1E1433; color:var(--bg); padding:var(--space-4) var(--space-6);
  border-radius:var(--radius-md); overflow-x:auto; margin:0 0 var(--space-4); }
.prose pre code{ background:none; padding:0; }
.prose img{ border-radius:var(--radius-md); max-width:100%; height:auto; }

/* ---------- callout ---------- */
.blk-callout{ display:flex; align-items:flex-start; gap:var(--space-5,20px);
  border-radius:var(--radius-md); padding:var(--space-6) var(--space-6);
  border-left:3px solid var(--brass); box-shadow:var(--shadow-1); }
@media (min-width:640px){ .blk-callout{ padding:var(--space-6) var(--space-8); } }
.blk-callout--info{ background:var(--sand); border-left-color:var(--brass); }
.blk-callout--warn{ background:var(--warning-bg); border-left-color:var(--warning); }
.blk-callout--success{ background:var(--success-bg); border-left-color:var(--success); }
.blk-callout__icon{ font-size:1.75rem; line-height:1.2; flex:none; }
.blk-callout__body{ min-width:0; }
.blk-callout__body p{ color:var(--ink); }

/* ---------- divider ---------- */
.blk--divider{ padding-block:var(--space-4); }
.blk--divider-space{ padding-block:var(--space-2); }
.blk-spacer{ height:48px; }
/* graceful no-JS: the self-drawing rule should simply be visible */
html:not(.js) .blk--divider .fpg-rule{ transform:scaleX(1); }

/* ---------- columns ---------- */
.blk--columns{ padding-block:var(--space-8); }
.blk-cols{ display:grid; gap:var(--space-8); }
@media (min-width:820px){
  .blk-cols{ gap:var(--space-12); }
  .blk-cols--50-50{ grid-template-columns:1fr 1fr; }
  .blk-cols--60-40{ grid-template-columns:3fr 2fr; }
  .blk-cols--40-60{ grid-template-columns:2fr 3fr; }
}
.blk-cols__col{ min-width:0; }

/* ---------- social_row ---------- */
.blk-social{ list-style:none; display:flex; flex-wrap:wrap; gap:var(--space-3); margin:0; padding:0; }
.blk--center .blk-social{ justify-content:center; }
.blk-social__link{ width:48px; height:48px; border-radius:50%; border:1px solid var(--brass);
  color:var(--brass-deep); display:grid; place-items:center;
  transition:background-color .2s var(--ease), color .2s var(--ease), transform .2s var(--ease); }
.blk-social__link .ic{ width:22px; height:22px; }
.blk-social__link:hover{ background:var(--brass); color:#1C1B19; transform:translateY(-2px); }
.blk-social__link:focus-visible{ outline:none; box-shadow:var(--focus-ring); }

/* ---------- cta_band (visuals live in components.css .cta) ---------- */
.blk--cta_band{ padding:0; }

/* ---------- feature_grid ---------- */
.blk--feature_grid{ padding-block:var(--space-12); }
.blk-features{ display:grid; grid-template-columns:1fr; gap:var(--space-4); }
@media (min-width:640px){ .blk-features{ grid-template-columns:repeat(2,1fr); gap:var(--space-6); } }
@media (min-width:1000px){ .blk-features{ grid-template-columns:repeat(3,1fr); } }
.blk-feature{ background:var(--surface); border-radius:var(--radius-md); box-shadow:var(--shadow-1);
  padding:var(--space-8) var(--space-6);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease); }
.blk-feature:hover{ transform:translateY(-4px); box-shadow:var(--shadow-2); }
.blk-feature__icon{ display:grid; place-items:center; width:56px; height:56px; border-radius:50%;
  background:rgba(58,42,114,.14); color:var(--brass-deep); font-size:1.5rem; line-height:1;
  margin-bottom:var(--space-5,20px); }
.blk-feature__icon .ic{ width:26px; height:26px; }
.blk-feature__title{ font-family:var(--font-serif); font-weight:500; font-size:var(--fs-h3);
  letter-spacing:-.01em; margin-bottom:var(--space-2); }
.blk-feature__body{ color:var(--ink-soft); font-size:var(--fs-sm); margin:0; }

/* ---------- tabs ---------- */
.blk--tabs{ padding-block:var(--space-12); }
.blk-tabs__list{ display:flex; gap:var(--space-2); overflow-x:auto; -webkit-overflow-scrolling:touch;
  border-bottom:var(--border-hair); margin-bottom:var(--space-8); }
.blk-tabs__tab{ appearance:none; background:none; border:0; border-bottom:2px solid transparent;
  margin-bottom:-1px; padding:var(--space-3) var(--space-4); cursor:pointer; white-space:nowrap;
  font-family:var(--font-sans); font-size:var(--fs-sm); font-weight:600; line-height:1;
  color:var(--ink-muted);
  transition:color .2s var(--ease), border-color .2s var(--ease); }
.blk-tabs__tab:hover{ color:var(--ink); }
.blk-tabs__tab[aria-selected="true"]{ color:var(--ink); border-bottom-color:var(--brass); }
.blk-tabs__tab:focus-visible{ outline:none; box-shadow:var(--focus-ring); border-radius:var(--radius-sm); }
.blk-tabs__panel{ outline:none; }
.blk-tabs__panel:focus-visible{ box-shadow:var(--focus-ring); border-radius:var(--radius-sm); }
.blk-tabs__panel--media{ display:grid; gap:var(--space-8); align-items:center; }
@media (min-width:880px){
  .blk-tabs__panel--media{ grid-template-columns:5fr 6fr; gap:var(--space-12); }
}
.blk-tabs__media{ border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-2); }
.blk-tabs__media img{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; }
.blk-tabs__body{ min-width:0; }
@media (prefers-reduced-motion:no-preference){
  .js .blk-tabs__panel:not([hidden]){ animation:blkTabIn .3s var(--ease); }
}
@keyframes blkTabIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
/* progressive enhancement fallback: no JS → hide the tablist, stack every panel */
html:not(.js) .blk-tabs__list{ display:none; }
html:not(.js) .blk-tabs__panel[hidden]{ display:block !important; margin-top:var(--space-8); }
html:not(.js) .blk-tabs__panel--media[hidden]{ display:grid !important; }