/* ==========================================================================
   Női kör – kiegészítések a közös styles.css-hez
   (a hero videó helyett a logó körét rajzoljuk ki nagyban)
   ========================================================================== */

.hero--circle{ background:var(--ink); }

.hero__art{
  position:absolute;
  top:50%; right:max(var(--gutter), calc((100vw - var(--maxw)) / 2));
  width:min(78vh, 46vw); height:auto;
  transform:translateY(-46%);
}
.hero__ring{
  fill:none; stroke:rgba(246,241,233,.2); stroke-width:.35;
}
.hero__figs{
  fill:rgba(246,241,233,.16);
  transform-box:view-box; transform-origin:50% 52%;
  animation:korForog 140s linear infinite;
}
.hero__fig{
  transform-box:view-box;
  animation:korForog 140s linear infinite reverse;
}
.hero__center{ fill:var(--clay); opacity:.75; }

@keyframes korForog{
  to{ transform:rotate(360deg); }
}

.hero--circle .hero__scrim{
  background:
    radial-gradient(90% 80% at 15% 50%, rgba(20,17,15,.75), transparent 70%),
    linear-gradient(180deg, rgba(20,17,15,0) 60%, rgba(20,17,15,.5) 100%);
}

@media (max-width:900px){
  .hero__art{
    right:50%; width:min(118vw, 640px);
    transform:translate(50%, -50%);
    opacity:.55;
  }
  .hero--circle .hero__scrim{ background:rgba(20,17,15,.45); }
}

/* ---------- Tények egy alkalomról ---------- */
.facts{
  list-style:none; margin:clamp(40px,5vw,64px) 0 0; padding:0;
  display:grid; grid-template-columns:repeat(4,1fr); gap:24px;
  border-top:1px solid var(--line);
}
.facts li{ padding-top:22px; display:flex; flex-direction:column; gap:6px; }
.facts__label{
  font-size:.7rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted);
}
.facts li span:last-child{
  font-family:var(--serif); font-size:1.3rem; color:var(--ink); line-height:1.3;
}

@media (max-width:1080px){ .facts{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .facts{ grid-template-columns:1fr; gap:4px; } }