/* ==========================================================================
   Header and footer blocks.

   The design system lives in site.css and is used as-is. Everything here is
   an addition: an opt-out, two layout variants the static build did not need,
   and the editor-canvas adjustments that let a fixed header and hidden
   dropdowns be edited in Gutenberg.
   ========================================================================== */

/* Header Bar with "keep on screen while scrolling" switched off. */
.site-header--static { position: absolute; }

/* A dropdown with no featured story collapses to intro + links. */
.mega-inner.v2.no-featured { grid-template-columns: 230px minmax(0, 1fr); }

/* The contact column's first link sits clear of the address above it. */
.footer-col address + a { margin-top: 0.9rem; }

/* ==========================================================================
   Editor canvas only

   The published header is fixed to the viewport and its dropdowns are hidden
   until opened. Inside the editor both must sit in normal flow so they can be
   seen and edited. `.editor-styles-wrapper` never appears on the front end.
   ========================================================================== */

.editor-styles-wrapper .site-header {
  position: static;
  background: var(--ink-deep);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

/* The narrow-screen rule hides the main nav; the canvas is often narrow. */
.editor-styles-wrapper .primary-nav { display: block; }
.editor-styles-wrapper .primary-nav ul { flex-wrap: wrap; }

.editor-styles-wrapper .mega-panel {
  position: static;
  opacity: 1;
  visibility: visible;
  transform: none;
  margin-top: 1px;
}

/* Dropdown rows: show the arrow that only appears on hover when published. */
.editor-styles-wrapper .mega-list svg { opacity: 1; transform: none; }

/* Featured story is an <a> when published and a plain box while editing. */
.editor-styles-wrapper .mega-featured { display: block; }

/* Names each dropdown in the canvas so a header full of them stays readable. */
.editor-styles-wrapper .heavies-editor-panel-caption {
  font-family: var(--font-display);
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold-bright);
  padding: 0.6rem var(--gutter);
  border-bottom: 1px solid var(--line-soft);
}

/* The small print spans the whole footer grid rather than sitting in a column. */
.editor-styles-wrapper .footer-grid > .footer-bottom {
  grid-column: 1 / -1;
  margin-top: 1rem;
}

/* Contact details are spans in the canvas so they cannot be clicked away. */
.editor-styles-wrapper .heavies-editor-contact-line {
  display: block;
  font-size: 0.95rem;
  color: var(--muted);
  padding-block: 0.32rem;
}
.editor-styles-wrapper .footer-col address + .heavies-editor-contact-line { margin-top: 0.9rem; }

/* Quiet guidance shown inside a block preview or an inspector panel. The base
   rule is unscoped so it also reads well in the editor sidebar. */
.heavies-editor-note {
  font-size: 12px;
  line-height: 1.5;
  color: #757575;
  margin: 8px 0 0;
}
.editor-styles-wrapper .heavies-editor-note {
  font-family: var(--font-display);
  font-size: 0.7rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(179, 160, 119, 0.85);
  padding: 0.6rem var(--gutter);
  margin: 0;
}