/* Daisy Chain Press — shared responsive presentation */

/*
  Canonical MOBILE family only.

  Vertical system:
  H = canonical rendered mobile header height
  header → metadata ≈ 3H
  metadata → image ≈ 1H

  The image frame is shared; crop position can be overridden per release.
*/

/*
  Legacy in-page identity/title are retained in the document but hidden
  across all canonical interface families. The global header now owns
  this presentation. They can be restored later without changing HTML.
*/
html[data-dc-interface-layout="mobile"] .dc-brand,
html[data-dc-interface-layout="mobile"] h1.dc-title,
html[data-dc-interface-layout="tablet"] .dc-brand,
html[data-dc-interface-layout="tablet"] h1.dc-title,
html[data-dc-interface-layout="desktop"] .dc-brand,
html[data-dc-interface-layout="desktop"] h1.dc-title {
  display: none !important;
}

/* Use the canonical mobile header band as the spacing unit. */
html[data-dc-interface-layout="mobile"] main.dc-release {
  --dc-press-mobile-H: var(--dc-header-band-height, 51px);

  padding-top: calc(var(--dc-press-mobile-H) * 4);
}

/*
  Metadata is the first visible document element.
  Its own existing typography stays untouched.
*/
html[data-dc-interface-layout="mobile"] .dc-meta {
  margin-bottom: var(--dc-press-mobile-H);
}

/*
  Shared mobile lead-image frame.
  Source images remain unchanged; framing is controlled with object-position.
*/
html[data-dc-interface-layout="mobile"] .dc-hero-image {
  width: 100%;
  height: min(72vw, 320px);
  margin: 0 0 24px 0;
  overflow: hidden;
}

html[data-dc-interface-layout="mobile"] .dc-hero-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--dc-press-image-x, 50%) var(--dc-press-image-y, 50%);
}

/*
  Optional per-release focal controls can be added directly to the page,
  e.g.:
    style="--dc-press-image-x: 35%; --dc-press-image-y: 50%;"
  on .dc-hero-image
*/

/* =========================================================
   DESKTOP + TABLET PRESS COMPOSITION
   ========================================================= */

/*
  The canonical header owns:
  heading
  subheading
  date

  The body begins lower, preserving deliberate editorial space.
*/
html[data-dc-interface-layout="desktop"] main.dc-release {
  padding-top: var(--dc-header-band-height, 117px);
}

html[data-dc-interface-layout="tablet"] main.dc-release {
  padding-top: calc(var(--dc-header-band-height, 85px) * 2.15);
}

/*
  Desktop/tablet body metadata becomes only FOR IMMEDIATE RELEASE.
  The date is represented in the header.
*/
html[data-dc-interface-layout="desktop"] .dc-meta time,
html[data-dc-interface-layout="tablet"] .dc-meta time,
html[data-dc-interface-layout="desktop"] .dc-meta > p,
html[data-dc-interface-layout="tablet"] .dc-meta > p {
  display: none !important;
}

/*
  After the JS moves .dc-meta beneath the hero,
  keep it flush with the body column.
*/
html[data-dc-interface-layout="desktop"] .dc-meta,
html[data-dc-interface-layout="tablet"] .dc-meta {
  margin: 0 0 0 0;
  padding: 0;
}

/*
  Tight relationship between hero and FOR IMMEDIATE RELEASE.
*/
html[data-dc-interface-layout="desktop"] .dc-hero-image {
  margin-bottom: 16px;
}

html[data-dc-interface-layout="tablet"] .dc-hero-image {
  margin-bottom: 8px;
}


/* =========================================================
   PRESS DESKTOP — RIGHT EDITORIAL COLUMN
   ========================================================= */

/*
  Match the editorial column's right edge to the canonical
  desktop right rail.

  117 / 1024 = 11.42578125vw

  Therefore:
  1024px viewport → 117px right rail
  1280px viewport → ~146px right rail
  1440px viewport → ~165px right rail

  This follows the same proportional desktop geometry as
  the global interface rather than centering the article.
*/
html[data-dc-interface-layout="desktop"] main.dc-release {
  width: min(820px, calc(100vw - 23vw));
  max-width: 820px;

  margin-left: auto;
  margin-right: 11.42578125vw;
}

/*
  FOR IMMEDIATE RELEASE remains part of the article column
  immediately beneath the lead image.
*/
html[data-dc-interface-layout="desktop"] .dc-meta {
  display: none !important;
}

/* Keep the duplicate body date suppressed on desktop. */
html[data-dc-interface-layout="desktop"] .dc-meta time,
html[data-dc-interface-layout="desktop"] .dc-meta > p {
  display: none !important;
}

/*
  Give FOR IMMEDIATE RELEASE a deliberate breath beneath
  the image without separating it from the article.
*/
html[data-dc-interface-layout="desktop"] .dc-hero-image {
  margin-bottom: 16px;
}

/* =========================================================
   PRESS — AUTHORED MULTILINE CANONICAL HEADING
   ========================================================= */

/*
  Press may author line breaks inside the canonical heading.
  Placement, typography, scale, and vertical alignment remain
  entirely owned by dc-header.css and dc-heading.css.
*/
#dc-ui-heading .dc-heading-block__heading {
  white-space: pre-line;
  margin-top: 0;
}


/* =========================================================
   TEMP DIAGNOSTIC — PRESS TOP SPACE CONTROL
   Remove after visual confirmation.
   ========================================================= */

html[data-dc-interface-layout="desktop"] main.dc-release {
  position: relative;
}

/* TEMP DIAGNOSTIC — distinguish Press top-spacing region */
/* TEMP DIAGNOSTIC — full-width Press content container */
html[data-dc-interface-layout="desktop"] main.dc-release {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* TEST — Press column owns the 117px perimeter */
html[data-dc-interface-layout="desktop"] main.dc-release {
  box-sizing: border-box !important;

  width: 100% !important;
  max-width: none !important;

  margin: 0 !important;
  padding: 11.42578125vw !important;
}