/* Wide editorial notices, inspired by the supplied white Apple cards.
   Increased-contrast semantic hues come from tokens.css, separately per mode.
   Supplied artwork is used unchanged as a high-density alpha mask. */
.post-callout {
  --callout-accent: var(--brand);
  --callout-icon-color: var(--callout-accent);
  --callout-icon-size: clamp(56px, 6vw, 80px);
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-7);
  margin-block: var(--block-gap);
  padding: var(--panel-padding);
  border-radius: var(--radius-2xl);
  background: var(--surface-raised);
  box-shadow: var(--shadow-panel);
  overflow-wrap: anywhere;
}
.post-article-section > .post-callout { width: var(--article-wide); }
.post-callout-icon {
  flex: 0 0 var(--callout-icon-size);
  width: var(--callout-icon-size);
  height: var(--callout-icon-size);
  color: var(--callout-icon-color);
}
.post-callout-icon svg { display: block; width: 100%; height: 100%; overflow: visible; }
.post-callout-content { min-width: 0; flex: 1; }
.post-callout-symbol {
  display: block; width: 100%; height: 100%;
  background: currentColor;
  mask: var(--callout-art) center / contain no-repeat;
  -webkit-mask: var(--callout-art) center / contain no-repeat;
}
.post-callout .post-callout-title {
  color: var(--callout-accent);
  margin: 0 0 var(--space-3);
}
.post-callout .post-callout-text { margin: 0; }
.post-callout .post-callout-text + .post-callout-text { margin-top: var(--space-4); }
.post-callout-content > :last-child { margin-bottom: 0; }
.post-callout .post-callout-content a {
  color: var(--callout-accent);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.post-callout--note { --callout-accent: var(--brand); --callout-art: url("/assets/icons/callouts/note.png?v=ea8e1e8acef0"); }
.post-callout--information { --callout-accent: var(--brand); --callout-art: url("/assets/icons/callouts/information.png?v=0771ded10ffb"); }
.post-callout--information .post-callout-symbol { transform: rotate(180deg); }
.post-callout--success { --callout-accent: var(--green); }
.post-callout--warning { --callout-accent: var(--pink); --callout-art: url("/assets/icons/callouts/warning.png?v=f3a4f66cac3d"); }
.post-callout--caution { --callout-accent: var(--yellow); --callout-icon-color: rgb(255, 204, 0); --callout-art: url("/assets/icons/callouts/caution.png?v=9c86dad1c086"); }
html[data-theme="dark"] .post-callout--caution { --callout-icon-color: rgb(254, 223, 67); }
.post-callout--caution .post-callout-title { color: var(--callout-icon-color); }
.post-callout--important { --callout-accent: var(--green); --callout-art: url("/assets/icons/callouts/important.png?v=d5d3e9c88d74"); }
.post-callout--error { --callout-accent: var(--red); }
@media (max-width: 720px) {
  .post-callout { padding: var(--panel-padding); border-radius: var(--radius-xl); gap: var(--space-4); }
}
@media (forced-colors: active) {
  .post-callout { border: 1px solid CanvasText; }
  .post-callout-icon { color: CanvasText; }
}