/* Allegedly Media — Option C styling fix, front page only.
   Replaces the earlier repeat(3, 1fr) grid rule that shrank the
   2-post Latest News / Community Picks cards to ~200px wide. */

/* 1) Widen the story area. The story group is the tan #F8F0DC group
   with 48px top padding (Top Story + Latest News + podcast +
   Community Picks). It was capped at the theme's ~640px content
   width; widen it toward the sample's fuller width. */
.page-id-1111 .is-layout-constrained > .wp-block-group[style*="padding-top:48px"] {
  max-width: 1120px !important;
  padding-left: 32px !important;
  padding-right: 32px !important;
  padding-bottom: 64px !important;
}
.page-id-1111 .wp-block-group[style*="padding-top:48px"] > * {
  max-width: 1120px !important;
}
.page-id-1111 .wp-block-group[style*="padding-top:48px"] .wp-block-query,
.page-id-1111 .wp-block-group[style*="padding-top:48px"] .wp-block-post-template,
.page-id-1111 .wp-block-group[style*="padding-top:48px"] .wp-block-columns {
  max-width: none !important;
  width: 100% !important;
}

/* 2) Airier section headings. */
.page-id-1111 .wp-block-group[style*="padding-top:48px"] > h2.wp-block-heading {
  margin-top: 56px !important;
  margin-bottom: 28px !important;
}

/* 3) Latest News + Community Picks: 2-across grid that fills its
   columns, with big 16/9 full-bleed photos and clean, even-height
   cards with bylines aligned at the bottom. */
.page-id-1111 .wp-block-post-template.is-layout-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 36px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid > .wp-block-post {
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  margin: 0 !important;
  background: #ffffff !important;
  border: 1px solid #e9e1cd !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 10px rgba(60, 45, 20, 0.07) !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-featured-image {
  margin: 0 !important;
  width: 100% !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-featured-image a {
  display: block !important;
  width: 100% !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-featured-image img {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  object-fit: cover !important;
  object-position: 50% 15% !important;
}
/* Faces: crop from the top so full heads stay in frame. */
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-featured-image img[src*="Joanna-Gaines-Baby-6"] {
  object-position: 50% 8% !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-featured-image img[src*="Druski-White-House-Correspondents"] {
  object-position: 50% 10% !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid > .wp-block-post > .wp-block-group {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  max-width: none !important;
  padding: 22px 24px 24px !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-title {
  margin-top: 10px !important;
  margin-bottom: 0 !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid > .wp-block-post > .wp-block-group > p:last-child {
  margin-top: auto !important;
  padding-top: 16px !important;
}

/* 4) Podcast collage: let it fill its (now wider) 40% column. */
.page-id-1111 .wp-block-group[style*="padding-top:48px"] .wp-block-image img {
  width: 100% !important;
  height: auto !important;
}

/* 5) Mobile: stack the cards, but keep a big photo and the same
   clean card look — no cramped plain stack. */
@media (max-width: 680px) {
  .page-id-1111 .is-layout-constrained > .wp-block-group[style*="padding-top:48px"] {
    padding-left: 16px !important;
    padding-right: 16px !important;
    padding-top: 32px !important;
    padding-bottom: 48px !important;
  }
  .page-id-1111 .wp-block-post-template.is-layout-grid {
    grid-template-columns: 1fr !important;
    gap: 28px !important;
  }
  .page-id-1111 .wp-block-group[style*="padding-top:48px"] > h2.wp-block-heading {
    margin-top: 40px !important;
    margin-bottom: 20px !important;
  }
  .page-id-1111 .wp-block-post-template.is-layout-grid > .wp-block-post > .wp-block-group {
    padding: 20px 18px 22px !important;
  }
}

/* ---- v2 overrides (appended 2026-11-07) ---- */
/* Widen the story group without relying on its parent's layout class. */
.page-id-1111 .wp-block-group[style*="padding-top:48px"],
.page-id-1111 .wp-block-group[style*="padding-top: 48px"] {
  max-width: 1120px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 32px !important;
  padding-right: 32px !important;
  padding-bottom: 64px !important;
}
.page-id-1111 .wp-block-group[style*="padding-top:48px"] > *,
.page-id-1111 .wp-block-group[style*="padding-top: 48px"] > * {
  max-width: 1120px !important;
}
.page-id-1111 .wp-block-group[style*="padding-top:48px"] .wp-block-query,
.page-id-1111 .wp-block-group[style*="padding-top: 48px"] .wp-block-query,
.page-id-1111 .wp-block-group[style*="padding-top:48px"] .wp-block-post-template,
.page-id-1111 .wp-block-group[style*="padding-top: 48px"] .wp-block-post-template,
.page-id-1111 .wp-block-group[style*="padding-top:48px"] .wp-block-columns,
.page-id-1111 .wp-block-group[style*="padding-top: 48px"] .wp-block-columns {
  max-width: none !important;
  width: 100% !important;
}
.page-id-1111 .wp-block-group[style*="padding-top:48px"] > h2.wp-block-heading,
.page-id-1111 .wp-block-group[style*="padding-top: 48px"] > h2.wp-block-heading {
  margin-top: 56px !important;
  margin-bottom: 28px !important;
}
.page-id-1111 .wp-block-group[style*="padding-top:48px"] .wp-block-image img,
.page-id-1111 .wp-block-group[style*="padding-top: 48px"] .wp-block-image img {
  width: 100% !important;
  height: auto !important;
}
/* Cards: any group inside a card stretches, its own padding is
   removed, and the text blocks carry the inset directly so the
   card text is set in 24px from the card edge. */
.page-id-1111 .wp-block-post-template.is-layout-grid > .wp-block-post > .wp-block-group,
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post .wp-block-group {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-terms,
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-title,
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-excerpt,
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post > p {
  padding-left: 24px !important;
  padding-right: 24px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-terms {
  padding-top: 20px !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-title {
  margin-top: 10px !important;
  margin-bottom: 0 !important;
}
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post > p:last-child,
.page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post .wp-block-group > p:last-child {
  margin-top: auto !important;
  padding-top: 16px !important;
}
@media (max-width: 680px) {
  .page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-terms,
  .page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-title,
  .page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post-excerpt,
  .page-id-1111 .wp-block-post-template.is-layout-grid .wp-block-post > p {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }
}
/* ---- v3: widen the story sections (appended 2026-11-07) ----
   There is no separate story wrapper group in the Front Page
   template: the story sections are direct children of the page
   wrapper group, capped at the theme's ~640px content width.
   Break each story section out to a fuller 1024px width, centred.
   The min()/calc() formula stays safe on narrow screens (the
   section then simply fills the viewport width minus 32px).
   (The earlier [style*="padding-top:48px"] rules above match
   nothing in this template and are inert.) */
.page-id-1111 .wp-block-columns[style*="margin-top:24px"],
.page-id-1111 .wp-block-columns[style*="margin-top:24px"] + h2.wp-block-heading,
.page-id-1111 .wp-block-group[style*="#efe9fb"] + h2.wp-block-heading,
.page-id-1111 .wp-block-group[style*="#efe9fb"],
.page-id-1111 .wp-block-query {
  width: min(1024px, 100vw - 32px) !important;
  max-width: none !important;
  margin-left: calc((100% - min(1024px, 100vw - 32px)) / 2) !important;
  margin-right: calc((100% - min(1024px, 100vw - 32px)) / 2) !important;
}
/* Airier spacing above the Latest News / Community Picks headings. */
.page-id-1111 .wp-block-columns[style*="margin-top:24px"] + h2.wp-block-heading,
.page-id-1111 .wp-block-group[style*="#efe9fb"] + h2.wp-block-heading {
  margin-top: 56px !important;
  margin-bottom: 28px !important;
}
/* Podcast band: let its columns use the full (widened) band, so the
   collage grows with it. */
.page-id-1111 .wp-block-group[style*="#efe9fb"] .wp-block-columns {
  max-width: none !important;
  width: 100% !important;
}
.page-id-1111 .wp-block-group[style*="#efe9fb"] .wp-block-image img {
  width: 100% !important;
  height: auto !important;
}

/* ---- v4: phone view (appended 2026-11-07) ----
   The 100px masthead word overflows a ~390px viewport, which makes
   the whole front page sideways-scrollable on phones. That is in the
   template (not changed here); clip the page-level sideways overflow
   so the phone view cannot be swiped sideways. The masthead itself
   is untouched — the word shows exactly as it did, just without
   the stray horizontal scrollbar. */
body.page-id-1111 {
  overflow-x: clip;
}

/* ---- v5: mobile photo crop fix (appended 2026-11-07) ----
On phones the story-photo cards go full-width in a hard 16/9
cover crop, which cuts faces/subjects out of portrait-leaning
photos (Amy's report). Below 600px use a taller 4/3 crop so
more of each photo reads, keeping the top-weighted
object-position from v3 (15% general, 8% Joanna, 10% Druski).
Desktop is untouched: this block only runs under 600px. */
@media (max-width: 600px) {
  /* Top Story photo + every story-card photo (Latest News and
     Community Picks, whichever articles are placed). */
  .page-id-1111.page-id-1111 .wp-block-post-featured-image,
  .page-id-1111.page-id-1111 .wp-block-post-featured-image img,
  .page-id-1111 .wp-block-post-template.is-layout-grid > .wp-block-post > .wp-block-post-featured-image img {
    aspect-ratio: 4 / 3 !important;
  }
  .page-id-1111.page-id-1111 .wp-block-post-featured-image img,
  .page-id-1111 .wp-block-post-template.is-layout-grid > .wp-block-post > .wp-block-post-featured-image img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    object-position: 50% 15% !important;
  }
  /* Keep faces whole: Joanna and Druski stay top-weighted. */
  .page-id-1111.page-id-1111 .wp-block-post-featured-image img[src*="Joanna" i] {
    object-position: 50% 8% !important;
  }
  .page-id-1111.page-id-1111 .wp-block-post-featured-image img[src*="Druski" i] {
    object-position: 50% 10% !important;
  }
}

/* ---- v6: hero + Druski face fixes (appended 2026-11-07) ----
A. Top Story hero: the same Joanna photo is fine in its card
   but the hero's 16/9 cover crop (centre-weighted) loses the
   top half of her face. Give the hero a taller 4/3 crop,
   top-weighted, at every width -- desktop as well as phones.
   The hero is the featured image carrying the inline
   aspect-ratio style, so it is targeted by that style
   attribute as well as by the general front-page rule.
B. Druski's close-up portrait cannot fit a 16/9 (or 4/3)
   slice: hair and chin are both cut. Show his photo at its
   natural height, uncropped, wherever it appears (he is
   coming off the homepage cards, but the rule stays so the
   photo is whole in any listing). */
.page-id-1111.page-id-1111 .wp-block-post-featured-image[style*="aspect-ratio"],
.page-id-1111.page-id-1111 .wp-block-post-featured-image[style*="aspect-ratio"] img,
.page-id-1111.page-id-1111 .wp-block-post-featured-image img[style*="aspect-ratio"] {
  aspect-ratio: 4 / 3 !important;
}
.page-id-1111.page-id-1111 .wp-block-post-featured-image[style*="aspect-ratio"] img,
.page-id-1111.page-id-1111 .wp-block-post-featured-image img[style*="aspect-ratio"] {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  object-position: 50% 15% !important;
}
.page-id-1111.page-id-1111 .wp-block-post-featured-image[style*="aspect-ratio"] img[src*="Joanna" i],
.page-id-1111.page-id-1111 .wp-block-post-featured-image img[style*="aspect-ratio"][src*="Joanna" i] {
  object-position: 50% 8% !important;
}
.page-id-1111.page-id-1111 .wp-block-post-template.is-layout-grid > .wp-block-post > .wp-block-post-featured-image img[src*="Druski" i],
.page-id-1111.page-id-1111 .wp-block-post-featured-image img[src*="Druski" i],
.wp-block-post-featured-image img[src*="Druski" i] {
  aspect-ratio: auto !important;
  height: auto !important;
  object-fit: contain !important;
  object-position: 50% 50% !important;
}