/* CENC Royale v000034a — Premium Public Experience UI Polish
   Surgical visual patch: compact entity cards + deterministic participant grid.
   Theme tokens remain authoritative; no hard-coded Royale Purple & Gold colors here. */

:root{
  --royale-card-grid-max:1320px;
  --royale-participant-grid-max:1320px;
}

/* Keep anchored/linked sections clear of the sticky public header. */
.catalog-section,.catalog-hero,.royale-overview{scroll-margin-top:96px}

/* Event / competition / category collections: fixed column count instead of stretching sparse data. */
.royale-event-grid,
.royale-wide-card-grid{
  width:min(100%,var(--royale-card-grid-max));
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
}

/* Shared compact premium entity card. All visual decisions resolve from effective theme tokens. */
.royale-entity-card{
  position:relative;
  min-height:228px;
  padding:26px;
  overflow:hidden;
  border-color:color-mix(in srgb,var(--theme-border) 68%,transparent);
  background:
    radial-gradient(circle at 100% 0,color-mix(in srgb,var(--theme-primary) 8%,transparent),transparent 42%),
    linear-gradient(155deg,color-mix(in srgb,var(--theme-surface) 98%,transparent),color-mix(in srgb,var(--theme-primary) 4%,var(--theme-surface)));
  box-shadow:0 16px 44px rgba(0,0,0,.13);
}
.royale-entity-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:2px;
  background:linear-gradient(90deg,var(--theme-primary),var(--theme-secondary),transparent 78%);
  opacity:.7;
}
.royale-entity-card::after{
  content:"→";
  position:absolute;
  right:24px;
  top:24px;
  color:var(--theme-primary);
  font-size:18px;
  line-height:1;
  opacity:.72;
  transform:translateX(0);
  transition:transform .18s ease,opacity .18s ease;
}
.royale-entity-card:hover::after{transform:translateX(4px);opacity:1}
.royale-entity-card>small{padding-right:34px}
.royale-entity-card h3{
  max-width:92%;
  margin:18px 0 10px;
  font-size:clamp(28px,2.2vw,36px);
  line-height:1.02;
}
.royale-entity-card p{max-width:40ch;font-size:13px;line-height:1.6}
.royale-entity-card .catalog-card-footer{
  gap:18px;
  padding-top:28px;
  border-top:1px solid color-mix(in srgb,var(--theme-border) 34%,transparent);
}
.royale-entity-card .catalog-card-footer strong{text-align:right}

/* Event cards use the same scale rhythm while preserving their own 16:9 media. */
.royale-event-card{
  border-color:color-mix(in srgb,var(--theme-border) 68%,transparent);
  background:linear-gradient(155deg,color-mix(in srgb,var(--theme-surface) 98%,transparent),color-mix(in srgb,var(--theme-primary) 4%,var(--theme-surface)));
  box-shadow:0 16px 44px rgba(0,0,0,.13);
}
.royale-event-card-media{transition:transform .28s ease,filter .28s ease}
.royale-event-card:hover .royale-event-card-media{transform:scale(1.018);filter:saturate(1.04)}
.royale-card-body{min-height:196px;padding:24px}
.royale-card-body h3{font-size:clamp(28px,2.2vw,36px);margin:12px 0 9px}
.royale-card-body p{font-size:13px;line-height:1.6}
.royale-card-body .catalog-card-footer{
  padding-top:22px;
  border-top:1px solid color-mix(in srgb,var(--theme-border) 34%,transparent);
}

/* Participant gallery: exactly 3 desktop columns; sparse result sets never stretch a card. */
.entry-grid.royale-participant-grid{
  width:min(100%,var(--royale-participant-grid-max));
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(18px,2vw,26px);
  align-items:start;
}
.royale-participant-grid .entry-card{width:100%;min-width:0}
.royale-participant-grid .entry-copy{min-height:176px;display:flex;flex-direction:column;padding:22px}
.royale-participant-grid .entry-copy h3{font-size:clamp(28px,2.1vw,36px)}
.royale-participant-grid .entry-copy p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.royale-participant-grid .entry-copy .entry-link{margin-top:auto;padding-top:18px}

/* Tablet: two cards. */
@media(max-width:1180px){
  .royale-event-grid,
  .royale-wide-card-grid,
  .entry-grid.royale-participant-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Smartphone / narrow portrait: one card, full usable content width. */
@media(max-width:760px){
  .royale-event-grid,
  .royale-wide-card-grid,
  .entry-grid.royale-participant-grid{grid-template-columns:1fr}
  .royale-entity-card{min-height:210px;padding:22px}
  .royale-entity-card::after{right:20px;top:21px}
  .royale-card-body{min-height:184px;padding:21px}
  .royale-participant-grid .entry-copy{min-height:164px;padding:20px}
}

@media(prefers-reduced-motion:reduce){
  .royale-entity-card::after,.royale-event-card-media{transition:none}
}