/*! Empório Portugal — EP-20260905-FRONTEND-REGRESSION-001
   Overlay estrutural (carregar por último). Não altera master PT de markup.
   BUG_IDs: FR001-HERO-TALL, FR001-HERO-PAD, FR001-COVER-AR,
            FR001-TOPIC-BAND, FR001-CARD-AR, FR001-FIG-MINH,
            FR001-INNER-HERO, FR001-LANG-SWITCH, FR001-404-TALL */

/* ——— FR001-LANG-SWITCH: current language must win over later !important cream pills ——— */
body:not(.admin-page) .ep-site-header .language-switcher.ep-site-lang a,
body:not(.admin-page) .ep-site-header .ep-site-lang a {
  color: #062018 !important;
  background: #fff !important;
  border: 1px solid #0b2f24 !important;
  opacity: 1 !important;
}
body:not(.admin-page) .ep-site-header .language-switcher.ep-site-lang a[aria-current="true"],
body:not(.admin-page) .ep-site-header .ep-site-lang a[aria-current="true"] {
  color: #fff !important;
  background: #0b2f24 !important;
  border-color: #0b2f24 !important;
}

/* ——— FR001-HERO-PAD + FR001-HERO-TALL ———
   Header is position:sticky (in-flow). Extra header-offset padding
   plus min-height 76–82vh made the first fold excessively tall. */
body.ep-home .ep-hero-revista.ep-cover,
body.ep-home.ep-magazine-v22 .ep-hero-revista.ep-cover,
body.ep-home .ep-home-hero.ep-cover {
  min-height: 0 !important;
}
body.ep-home .ep-hero-revista__inner.ep-cover__inner,
body.ep-home .ep-home-hero.ep-cover .ep-cover__inner {
  min-height: 0 !important;
  padding-top: clamp(0.85rem, 1.6vh, 1.35rem) !important;
  padding-bottom: clamp(0.9rem, 1.8vh, 1.5rem) !important;
}

/* ——— FR001-COVER-AR: source home-cover is landscape (~960×405), not 4/4.85 portrait ——— */
body.ep-home .ep-hero-revista__cover img,
body.ep-home .ep-hero-revista__cover.ep-home-cover-card img,
body.ep-home.ep-magazine-v22 .ep-home-cover-card img,
body.ep-home .ep-home-cover-card img {
  aspect-ratio: 16 / 10 !important;
  min-height: 0 !important;
  max-height: min(38vh, 340px) !important;
  width: 100% !important;
  height: auto !important;
  object-fit: cover !important;
  object-position: center 38% !important;
  transform: none !important;
}

/* ——— FR001-TOPIC-BAND: stacked conflicting aspect-ratio + max-height + ::after overlay
   left a colored bar under home theme images (visible at tablet 768). ——— */
body.ep-home .ep-home-topic__visual {
  position: relative !important;
  aspect-ratio: 16 / 10 !important;
  max-height: none !important;
  min-height: 0 !important;
  height: auto !important;
  background: #14261f !important;
  overflow: hidden !important;
}
body.ep-home .ep-home-topic__visual img,
body.ep-home.ep-magazine-v22 .ep-home-topic.ep-card--media img,
body.ep-home.ep-magazine-v22 .ep-home-topic[data-theme] .ep-home-topic__visual img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center 40% !important;
  transform: none !important;
  filter: none !important;
}
body.ep-home .ep-home-topic__visual::after {
  display: none !important;
}

/* ——— FR001-CARD-AR + FR001-CARD-WELL ———
   min-height on the img made a cream box taller than the progressive
   JPEG first scan → sliver at the top + empty well. overflow:hidden
   + loading=lazy also left siblings stuck mid-decode. */
.recipe-grid > .recipe-card,
.ep-receitas-hub-listing .recipe-grid > .recipe-card,
.ep-receitas-hub-listing .recipe-results-grid > .recipe-card,
.recipes-grid .recipe-card,
.recipe-card.recipe-card--published {
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  align-items: stretch !important;
  overflow: hidden !important;
}
.recipe-card.recipe-card--published > img,
.recipe-card.recipe-card--published > .recipe-card__image,
.recipe-card img,
img.recipe-card__image,
.recipe-grid .recipe-card__image,
img.recipe-card__image.protected-image {
  flex: 0 0 auto !important;
  align-self: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  object-position: center 40% !important;
  background: #efe2c9 !important;
  display: block !important;
}

/* ——— FR001-DOUBLE-OL: author-written "1." plus list-style decimal → 1. 1. ——— */
ol.ep-f410-steps,
ol.ep-f410-steps > li {
  list-style: none !important;
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* ——— FR001-FIG-MINH: min-height 280px fought aspect-ratio and inflated figures ——— */
.recipe-figure img,
.guide-figure img,
.pillar-figure img,
.page-hero__grid > img,
.recipe-hero__grid > img,
.split > img {
  min-height: 0 !important;
}

/* ——— FR001-INNER-HERO: cap editorial hero photos; keep cover crop intentional ——— */
body.inner-page:not(.admin-page) .page-hero,
body.ep-inner-public .page-hero,
body.ep-recipes-hub-premium-v1 .ep-receitas-hero,
.error-page .page-hero {
  min-height: 0 !important;
}
/* When a real <img> is shown, drop the generic gastronomia CSS background (double photo). */
body.inner-page:not(.admin-page) .page-hero:has(.page-hero__grid > img),
body.ep-inner-public .page-hero:has(.page-hero__grid > img),
body.editorial-page .page-hero:has(.page-hero__grid > img) {
  background-image: none !important;
  background-color: #063d31 !important;
  background:
    linear-gradient(120deg, rgba(11, 47, 36, 0.98), rgba(111, 29, 47, 0.88)) !important;
}
.page-hero__grid > img,
.recipe-hero__grid > img,
body.ep-recipes-hub-premium-v1 .ep-receitas-hero .page-hero__grid > img {
  max-height: none !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  object-fit: cover !important;
  object-position: center 42% !important;
}

/* Doces classic visuals — prevent sliver + empty cream well */
body.ep-art-doces .ep-doces-classic__visual--photo,
body.ep-art-regionais .ep-regionais-classic__visual--photo {
  aspect-ratio: 4 / 3 !important;
  min-height: 0 !important;
  background: #1a2a24 !important;
  overflow: hidden !important;
}
body.ep-art-doces .ep-doces-classic__visual--photo img,
body.ep-art-regionais .ep-regionais-classic__visual--photo img {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* Loading placeholder: cream until decode. Cover crop hides it after load. */
img[src*="/assets/images/"] {
  background: #efe2c9;
}

/* Conversion / newsletter: native HTML only — never stretch a raster panel */
body.ep-art-form .page-hero img[src*="panel-newsletter"],
img[src*="panel-newsletter"] {
  display: none !important;
}

/* Overflow guard from receitas-hub/site-shell must not undo object-fit covers */
body.ep-recipes-hub-premium-v1 .page-hero__grid > img,
body.ep-home .ep-hero-revista__cover img {
  height: auto !important;
}

@media (max-width: 860px) {
  body.ep-home .ep-hero-revista__cover img,
  body.ep-home .ep-home-cover-card img {
    max-height: min(32vh, 260px) !important;
  }
  .page-hero__grid > img,
  .recipe-hero__grid > img {
    max-height: min(32vh, 220px) !important;
  }
}

/* ——— FR001-LOGO-PT ———
   Guia comercial is body.inner-page.commercial-page (no ep-inner-public),
   so it keeps style.css .brand{min-width:180px} + site-shell logo max 190px.
   Below 390px that wordmark overlaps the PT language control. */
@media (max-width: 389px) {
  body:not(.admin-page) header .brand,
  body.inner-page .brand,
  body.commercial-page .brand,
  body:not(.admin-page) .ep-site-header .ep-site-brand {
    min-width: 0 !important;
    width: auto !important;
    max-width: min(48vw, 150px) !important;
  }
  body:not(.admin-page) header .brand__logo,
  body.inner-page .brand__logo,
  body.commercial-page .brand__logo,
  body:not(.admin-page) .ep-site-header .brand__logo,
  body:not(.admin-page) .ep-site-header .ep-site-brand__logo {
    width: auto !important;
    max-width: min(135px, 38vw) !important;
    height: auto !important;
    max-height: 28px !important;
    object-fit: contain !important;
    object-position: left center !important;
  }
}