/* CENC Royale v000043 add-on — Contextual public heroes / full-bleed refinement.
 * Removes the old framed/card treatment from public event identities and gives
 * Event / Competition / Category their own deterministic fallback art.
 */

.event-identity.royale-context-hero{
  width:100%;
  max-width:none;
  min-height:clamp(330px,34vw,560px);
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  background:var(--theme-bg);
  overflow:hidden;
}
.event-identity.royale-context-hero.is-compact{
  width:100%;
  max-width:none;
  min-height:clamp(270px,27vw,440px);
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.event-identity.royale-context-hero .event-identity-picture,
.event-identity.royale-context-hero .event-identity-picture img,
.event-identity.royale-context-hero .event-identity-theme-art{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.event-identity.royale-context-hero .event-identity-picture img{
  display:block;
  object-fit:cover;
  object-position:center;
}
.event-identity.royale-context-hero::after{
  z-index:1;
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--theme-bg) 12%,transparent) 0%,transparent 34%,color-mix(in srgb,var(--theme-bg) 28%,transparent) 100%),
    linear-gradient(90deg,color-mix(in srgb,var(--theme-bg) 92%,transparent) 0%,color-mix(in srgb,var(--theme-bg) 70%,transparent) 40%,color-mix(in srgb,var(--theme-bg) 16%,transparent) 72%,transparent 100%);
}
.event-identity.royale-context-hero .event-identity-overlay{
  position:relative;
  z-index:2;
  box-sizing:border-box;
  width:min(100%,var(--royale-wide-max));
  min-height:inherit;
  margin-inline:auto;
  padding:clamp(34px,5vw,78px) var(--royale-gutter) clamp(36px,5vw,72px);
  justify-content:flex-end;
}
.event-identity.royale-context-hero .event-identity-overlay span{
  font-size:10px;
  letter-spacing:.2em;
}
.event-identity.royale-context-hero .event-identity-overlay strong{
  max-width:min(940px,78vw);
  margin-top:10px;
  font-size:clamp(40px,5.5vw,78px);
  line-height:.96;
  text-wrap:balance;
  text-shadow:0 8px 34px rgba(0,0,0,.38);
}
.event-identity.royale-context-hero.is-compact .event-identity-overlay strong{
  max-width:min(980px,82vw);
  font-size:clamp(34px,4.7vw,68px);
}

/* The old event frame is intentionally retired from public headers/cards. */
.royale-context-hero .royale-event-frame,
.royale-event-card-frame{display:none!important}

/* Cards continue to be cards, but the fallback is now its own artwork and no
 * second decorative frame is placed over it. */
.royale-event-card-media-wrap{background:color-mix(in srgb,var(--theme-surface) 92%,var(--theme-bg))}

/* Give each context a subtly different image anchor so their authored fallback
 * reads correctly even at unusual viewport ratios. */
.event-identity.royale-context-hero.is-context-event .event-identity-picture img{object-position:center 48%}
.event-identity.royale-context-hero.is-context-competition .event-identity-picture img{object-position:center 50%}
.event-identity.royale-context-hero.is-context-category .event-identity-picture img{object-position:center 52%}

/* Breadcrumb/content begins after the full-width visual with deliberate rhythm. */
.event-identity.royale-context-hero + .public-breadcrumbs{margin-top:clamp(24px,3vw,42px)}

@media(max-width:900px){
  .event-identity.royale-context-hero,
  .event-identity.royale-context-hero.is-compact{min-height:clamp(300px,54vw,470px)}
  .event-identity.royale-context-hero .event-identity-overlay,
  .event-identity.royale-context-hero.is-compact .event-identity-overlay{padding-left:clamp(20px,5vw,36px);padding-right:clamp(20px,5vw,36px)}
  .event-identity.royale-context-hero .event-identity-overlay strong,
  .event-identity.royale-context-hero.is-compact .event-identity-overlay strong{max-width:92vw;font-size:clamp(38px,8vw,66px)}
}

@media(max-width:640px){
  .event-identity.royale-context-hero,
  .event-identity.royale-context-hero.is-compact{min-height:clamp(360px,88vw,560px)}
  .event-identity.royale-context-hero::after{
    background:linear-gradient(0deg,color-mix(in srgb,var(--theme-bg) 92%,transparent) 0%,color-mix(in srgb,var(--theme-bg) 48%,transparent) 44%,color-mix(in srgb,var(--theme-bg) 10%,transparent) 78%);
  }
  .event-identity.royale-context-hero .event-identity-overlay,
  .event-identity.royale-context-hero.is-compact .event-identity-overlay{padding:28px 18px 34px}
  .event-identity.royale-context-hero .event-identity-overlay strong,
  .event-identity.royale-context-hero.is-compact .event-identity-overlay strong{max-width:100%;font-size:clamp(38px,12.4vw,58px)}
  .event-identity.royale-context-hero + .public-breadcrumbs{margin-top:22px}
}
