/* Fiebre disco — años 70: bola de espejos, margaritas, franjas onduladas y la foto en un vinil.
   Va después de kit/base.css y kit/fiesta.css. Solo var(--mi-*) / var(--k-*). */

.ds h2 { font-weight: 400; color: var(--k-primary); }
.ds-hero { padding-top: 150px; }
.ds-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-conic-gradient(from 0deg at 50% 0%, color-mix(in srgb, var(--k-secondary) 40%, transparent) 0 6deg, transparent 6deg 12deg);
  -webkit-mask: linear-gradient(#000, transparent 75%); mask: linear-gradient(#000, transparent 75%); }
.fs:not(.fs--orn) .ds-hero::before { display: none; }
.ds-hero > .ds-ball { position: absolute; top: -4px; left: 50%; width: 104px; margin-left: -52px; transform-origin: 50% 0; --k-orn-2: color-mix(in srgb, var(--k-secondary) 55%, var(--k-surface)); }
@media (prefers-reduced-motion: no-preference) {
  .ds-ball { animation: ds-swing 4s ease-in-out infinite; }
}
@keyframes ds-swing { 0%, 100% { rotate: -4deg; } 50% { rotate: 4deg; } }
.ds-hero > .ds-daisy { position: absolute; width: 72px; --k-orn-2: var(--k-surface); --k-orn-1: var(--k-secondary); }
.ds-daisy--a { top: 26%; left: -18px; rotate: -12deg; }
.ds-daisy--b { top: 48%; right: -16px; width: 56px; --k-orn-2: var(--k-accent); --k-orn-1: var(--k-secondary); }
.ds-frame { position: relative; width: min(68vw, 290px); margin: .2rem auto 1rem; }
.ds-record { padding: 10%; border-radius: 50%; background: repeating-radial-gradient(circle, var(--k-text) 0 2px, color-mix(in srgb, var(--k-text) 82%, var(--k-surface)) 2px 4px); box-shadow: 0 26px 50px -24px rgba(0, 0, 0, .5); }
.ds-photo { overflow: hidden; aspect-ratio: 1; border-radius: 50%; background: var(--k-soft); box-shadow: 0 0 0 5px var(--k-accent); }
.ds-photo img { width: 100%; height: 100%; object-fit: cover; }
.ds .fs-age { position: absolute; right: -6%; bottom: -2%; background: var(--k-accent); color: var(--fs-on-accent); rotate: 10deg; }
.ds .fs-name { color: var(--k-primary); font-weight: 400; line-height: 1.15; }
.ds-waves { position: relative; height: 56px; overflow: hidden; }
.ds-waves span { position: absolute; left: 0; right: 0; height: 24px; -webkit-mask: url(../kit/orn/fiesta-ola.svg) 0 0 / 60px 24px repeat-x; mask: url(../kit/orn/fiesta-ola.svg) 0 0 / 60px 24px repeat-x; }
.ds-waves span:nth-child(1) { top: 0; background: var(--k-secondary); }
.ds-waves span:nth-child(2) { top: 14px; background: var(--k-accent); }
.ds-waves span:nth-child(3) { top: 28px; background: var(--k-primary); }
.ds .fs-countdown > div { box-shadow: 0 0 0 2px var(--k-secondary); border-radius: 999px; }
.ds .k-card { border-radius: 28px; }
.ds .fs-welcome .k-divider { width: 64px; --k-orn-2: var(--k-accent); --k-orn-1: var(--k-secondary); }
.ds .fs-footer-orn { width: 80px; --k-orn-2: color-mix(in srgb, var(--k-secondary) 55%, var(--k-surface)); }