:root{--ink:#14123a;--navy:#1d1b63;--violet:#7a5cd6;--lilac:#d9cdf7;--gold:#ff8a1f;--cream:#fff6e6;--r:22px}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font:400 1.05rem/1.6 "DM Sans",system-ui,sans-serif;color:var(--ink);background:var(--cream);overflow-x:hidden}
h1,h2,h3,.logo,.stat strong,.loader__word{font-family:Fredoka,"DM Sans",sans-serif;line-height:1.05}
img{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
/* loader */
.loader{position:fixed;inset:0;z-index:99;display:grid;place-content:center;justify-items:center;background:var(--navy);color:var(--cream);transition:transform .8s cubic-bezier(.77,0,.18,1)}
.loader__word{font-size:clamp(3rem,12vw,7rem);font-weight:700;animation:pop .9s both}
.loader i{position:absolute;width:14px;height:14px;border-radius:50%;background:var(--gold);animation:rise 1.1s ease-out infinite}
.loader i:nth-of-type(1){left:44%;animation-delay:.1s}.loader i:nth-of-type(2){left:50%;background:var(--lilac);animation-delay:.3s}.loader i:nth-of-type(3){left:56%;animation-delay:.5s}
.loader.done{transform:translateY(-100%)}
@keyframes pop{from{transform:scale(.6);opacity:0}}
@keyframes rise{from{bottom:30%;opacity:1}to{bottom:60%;opacity:0}}
.progress{position:fixed;top:0;left:0;height:4px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;z-index:60}
/* nav */
.nav{position:fixed;top:0;inset-inline:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:14px clamp(16px,4vw,48px);transition:background .3s,box-shadow .3s}
.nav.solid{background:rgba(255,246,230,.92);backdrop-filter:blur(8px);box-shadow:0 2px 20px rgba(20,18,58,.08)}
.logo{display:inline-flex;text-decoration:none}.logo img{height:44px;width:auto}
.nav nav{display:flex;gap:clamp(12px,2.5vw,32px);align-items:center;font-weight:500}
.nav nav a{text-decoration:none;position:relative}
.nav nav a:not(.btn)::after{content:"";position:absolute;left:0;bottom:-4px;height:2px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.nav nav a:hover::after{transform:scaleX(1)}
.btn{display:inline-block;padding:14px 28px;border-radius:99px;background:var(--gold);color:var(--ink);font-weight:700;text-decoration:none;transition:transform .25s,box-shadow .25s;box-shadow:0 6px 0 #c2610a}
.btn:hover{transform:translateY(-3px);box-shadow:0 9px 0 #c2610a}
.btn:active{transform:translateY(4px);box-shadow:0 2px 0 #c2610a}
.btn--sm{padding:8px 18px}
.btn--ghost{background:transparent;box-shadow:inset 0 0 0 2px currentColor;color:inherit}
.btn--ghost:hover{box-shadow:inset 0 0 0 2px currentColor,0 6px 0 rgba(122,92,214,.4)}
/* hero */
.hero{min-height:100svh;display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:32px;padding:110px clamp(20px,5vw,72px) 60px;background:radial-gradient(circle at 85% 20%,var(--lilac),transparent 55%)}
.tag{display:inline-block;background:var(--navy);color:var(--cream);padding:6px 16px;border-radius:99px;font-size:.9rem;margin-bottom:20px}
.hero h1{font-size:clamp(2.4rem,5.4vw,4.6rem);font-weight:700;color:var(--navy);margin-bottom:20px}
.lead{max-width:46ch;font-size:1.2rem;margin-bottom:28px}
.hero__cta{display:flex;flex-wrap:wrap;gap:16px}
.hero__text>*{animation:up .8s both}.hero__text>*:nth-child(2){animation-delay:.9s}.hero__text>*:nth-child(3){animation-delay:1s}.hero__text>*:nth-child(4){animation-delay:1.1s}.hero__text>*:nth-child(1){animation-delay:.8s}
@keyframes up{from{opacity:0;transform:translateY(30px)}}
.collage{position:relative;aspect-ratio:1/1;max-width:640px;width:100%;justify-self:center;--mx:0;--my:0}
.pol{position:absolute;left:var(--x);top:var(--y);width:var(--w);padding:10px 10px 34px;background:#fff;border-radius:6px;box-shadow:0 18px 40px rgba(20,18,58,.28);rotate:var(--r);translate:calc(var(--mx)*var(--d)*1px) calc(var(--my)*var(--d)*1px);animation:drop .9s cubic-bezier(.3,1.4,.5,1) both;transition:scale .3s,z-index 0s}
.pol:nth-child(1){animation-delay:.9s}.pol:nth-child(2){animation-delay:1.1s}.pol:nth-child(3){animation-delay:1.3s}
.pol img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 30%;cursor:zoom-in;border-radius:2px}
.pol--wide img{aspect-ratio:16/9}
.pol:hover{scale:1.05;z-index:5}
@keyframes drop{from{transform:translateY(-120vh) rotate(25deg);opacity:0}}
.petal{position:absolute;width:26px;height:26px;border-radius:60% 0 60% 0;background:var(--gold);opacity:.9;animation:float 7s ease-in-out infinite;pointer-events:none}
.p1{left:-2%;top:44%}.p2{right:2%;top:46%;background:var(--violet);animation-delay:-2s;width:20px;height:20px}.p3{left:48%;top:-3%;animation-delay:-4s;width:18px;height:18px}
@keyframes float{50%{transform:translateY(-22px) rotate(120deg)}}
/* marquee */
.marquee{background:var(--navy);color:var(--cream);overflow:hidden;padding:18px 0;transform:rotate(-1.2deg);margin:-10px -10px 40px;position:relative;z-index:2}
.marquee__in{display:flex;gap:28px;width:max-content;align-items:center;animation:scroll 28s linear infinite;font:600 1.6rem Fredoka,sans-serif}
.marquee b{width:16px;height:16px;border-radius:60% 0 60% 0;background:var(--gold);flex:none}
@keyframes scroll{to{transform:translateX(-50%)}}
/* sections */
.sec{padding:clamp(56px,9vw,120px) clamp(20px,5vw,72px);max-width:1280px;margin-inline:auto}
.sec--dark{max-width:none;background:var(--navy);color:var(--cream)}
.sec--dark .sec__head,.sec--dark .stats{max-width:1136px;margin-inline:auto}
.sec__head{margin-bottom:48px}
.sec__head h2,.cta h2{font-size:clamp(2rem,4.5vw,3.4rem);font-weight:700;margin-bottom:10px}
.sec__head p{max-width:56ch}
.rv{opacity:0;transform:translateY(36px);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
/* timeline */
.timeline{list-style:none;padding:0;position:relative;display:grid;gap:56px}
.timeline::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:3px;background:repeating-linear-gradient(var(--violet) 0 10px,transparent 10px 20px);transform:translateX(-50%)}
.ev{display:grid;grid-template-columns:1fr 1fr;gap:20px 64px;align-items:center;position:relative}
.ev__date{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:2;background:var(--gold);width:104px;height:104px;border-radius:50%;display:grid;place-content:center;text-align:center;box-shadow:0 0 0 8px var(--cream);line-height:1.1}
.ev__date strong{font:700 1.5rem Fredoka;display:block}
.ev__date span{font-size:.85rem;font-weight:500}
.ev__flyer{justify-self:end;max-width:340px;width:100%;border-radius:var(--r);box-shadow:0 20px 40px rgba(20,18,58,.25);cursor:zoom-in;transition:transform .4s cubic-bezier(.2,.8,.2,1);transform:rotate(-2deg)}
.ev__flyer:hover{transform:rotate(1deg) scale(1.04)}
.ev__body h3{font-size:clamp(1.6rem,3vw,2.3rem);color:var(--navy);margin-bottom:8px}
.where{margin-bottom:16px}
.menu{list-style:none;padding:0;display:grid;gap:8px;max-width:360px}
.menu li{display:flex;justify-content:space-between;gap:16px;padding:10px 16px;background:#fff;border-radius:14px;border:2px solid var(--lilac)}
.menu b{color:#b9560a}
.ev--alt .ev__flyer{order:2;justify-self:start;transform:rotate(2deg)}
.ev--alt .ev__body{order:1;justify-self:end;text-align:right}
.ev--alt .menu li{flex-direction:row-reverse}
/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.stat{border-top:3px solid var(--gold);padding-top:16px}
.stat strong{font-size:clamp(3.4rem,8vw,6rem);display:block;color:var(--gold)}
/* gallery */
.masonry{columns:3 260px;column-gap:20px}
.masonry figure{break-inside:avoid;margin-bottom:20px;position:relative;overflow:hidden;border-radius:var(--r);cursor:zoom-in;background:var(--lilac)}
.masonry img{width:100%;height:auto;transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.masonry figure:hover img{transform:scale(1.06)}
.masonry figcaption{position:absolute;inset:auto 0 0;padding:44px 16px 14px;color:#fff;font-weight:500;background:linear-gradient(transparent,rgba(20,18,58,.85));transform:translateY(100%);transition:transform .4s}
.masonry figure:hover figcaption,.masonry figure:focus-within figcaption{transform:none}
/* cta */
.cta{text-align:center;background:var(--lilac);border-radius:48px;margin-bottom:60px;max-width:1136px}
.cta p{margin:0 auto 28px;max-width:46ch}
.cta .hero__cta{justify-content:center}
footer{background:var(--ink);color:var(--cream);text-align:center;padding:40px 20px}
footer .logo{color:var(--lilac)}
/* lightbox */
.lb{position:fixed;inset:0;z-index:100;background:rgba(20,18,58,.94);display:flex;align-items:center;justify-content:center;animation:fade .3s}
.lb[hidden]{display:none}
.lb img{max-height:86vh;max-width:88vw;border-radius:12px;animation:pop .35s both}
.lb button{position:absolute;background:none;border:0;color:#fff;font-size:3rem;cursor:pointer;padding:12px 18px;line-height:1}
.lb__x{top:8px;right:12px}.lb__n{right:8px}.lb__n--p{left:8px;right:auto}
.lb__c{position:absolute;bottom:14px;color:var(--lilac);font-size:.9rem}
@keyframes fade{from{opacity:0}}
@media(max-width:860px){
 .hero{grid-template-columns:1fr;padding-top:96px}
 .nav nav a:not(.btn){display:none}
 .timeline::before{left:30px}
 .ev,.ev--alt{grid-template-columns:1fr;padding-left:72px;gap:16px}
 .ev__date{left:30px;width:60px;height:60px;top:0;translate:-50% 0;box-shadow:0 0 0 5px var(--cream)}
 .ev__date strong{font-size:1rem}.ev__date span{font-size:.62rem}
 .ev__flyer,.ev--alt .ev__flyer{order:0;justify-self:start;max-width:300px}
 .ev--alt .ev__body{order:0;text-align:left;justify-self:start}.ev--alt .menu li{flex-direction:row}
 .stats{grid-template-columns:repeat(2,1fr)}
 .cta{border-radius:28px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.rv{opacity:1;transform:none}html{scroll-behavior:auto}}

.loader img.loader__word{width:clamp(200px,36vw,380px);height:auto}
footer .logo img{height:60px}footer p{margin-top:8px}
/* principal */
.feat{display:grid;grid-template-columns:1fr 1.25fr;gap:clamp(28px,5vw,64px);align-items:center}
.feat h2{font-size:clamp(2rem,4.5vw,3.4rem);color:var(--navy);margin-bottom:14px}
.feat p:not(.tag){margin-bottom:24px;max-width:46ch}
.mosaic{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.mosaic img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:18px;cursor:zoom-in;box-shadow:0 14px 30px rgba(20,18,58,.22);transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.mosaic img:first-child,.mosaic img:last-child{grid-column:1/-1;aspect-ratio:16/9}
.mosaic img:nth-child(2){rotate:-1.5deg}.mosaic img:nth-child(3){rotate:1.5deg}
.mosaic img:hover{transform:scale(1.04);position:relative;z-index:3}
/* meta */
.stamp{display:inline-block;background:var(--gold);color:var(--ink);font:700 1.1rem Fredoka;padding:6px 20px;border-radius:99px;rotate:-4deg;margin-bottom:16px;animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{scale:1.08}}
.stats{grid-template-columns:repeat(3,1fr)}
/* equipo */
.team{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(28px,5vw,64px);align-items:center}
.team h2{font-size:clamp(2rem,4.5vw,3.4rem);color:var(--navy);margin-bottom:12px}
.frame{background:#fff;padding:12px;border-radius:10px;rotate:-2deg;box-shadow:0 20px 44px rgba(20,18,58,.25);position:relative;transition:rotate .5s}
.frame:hover{rotate:0deg}
.frame img{width:100%;border-radius:4px;cursor:zoom-in}
/* galería collage */
.gal{position:relative;max-width:1400px}
.gal .petal{opacity:.55;z-index:0}
.g1{left:3%;top:8%}.g2{right:5%;top:22%;background:var(--violet);animation-delay:-3s}.g3{left:8%;bottom:10%;background:var(--navy);animation-delay:-5s;width:18px;height:18px}.g4{right:10%;bottom:6%;animation-delay:-1s}
.gal .sec__head h2{color:var(--navy)}
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:-20px 0 40px}
.chip{font:600 1rem Fredoka,sans-serif;padding:10px 20px;border-radius:99px;border:2px solid var(--violet);background:transparent;color:var(--violet);cursor:pointer;transition:background .25s,color .25s,transform .25s}
.chip:hover{transform:translateY(-3px)}
.chip.on{background:var(--violet);color:#fff}
.collage2{columns:4 230px;column-gap:26px;position:relative;z-index:1}
.collage2 figure{--r:0deg;break-inside:avoid;margin:0 0 30px;background:#fff;padding:10px 10px 8px;border-radius:6px;box-shadow:0 12px 28px rgba(20,18,58,.2);position:relative;cursor:zoom-in;rotate:var(--r);transition:opacity .8s,transform .8s cubic-bezier(.2,.8,.2,1),rotate .9s cubic-bezier(.2,1.3,.4,1),scale .35s,box-shadow .35s}
.collage2 figure:nth-child(4n+1){--r:-1.8deg}.collage2 figure:nth-child(4n+2){--r:1.4deg}.collage2 figure:nth-child(4n+3){--r:-.8deg}.collage2 figure:nth-child(4n){--r:2deg}
.collage2 figure.rv:not(.in){rotate:calc(var(--r) + 9deg);transform:translateY(70px) scale(.9)}
.collage2 figure::before{content:"";position:absolute;top:-12px;left:50%;width:74px;height:24px;translate:-50% 0;rotate:-3deg;background:rgba(217,205,247,.85);border-radius:3px}
.collage2 figure:nth-child(3n)::before{background:rgba(255,138,31,.55);rotate:4deg}
.collage2 img{width:100%;height:auto;border-radius:3px}
.collage2 figcaption{font:500 1rem/1.2 Fredoka,sans-serif;padding:10px 4px 4px;color:var(--navy)}
.collage2 figure:hover{rotate:0deg;scale:1.06;z-index:4;box-shadow:0 26px 50px rgba(20,18,58,.35)}
.collage2 figure.out{opacity:0;transform:scale(.8)}
.cta{max-width:1136px}
@media(max-width:860px){.feat,.team{grid-template-columns:1fr}.stats{grid-template-columns:1fr}.chips{margin-top:0}}

.mosaic{grid-template-columns:repeat(3,1fr)}
.mosaic img{aspect-ratio:3/4;object-position:center 28%}
.mosaic img:first-child{grid-column:1/-1;aspect-ratio:16/9;object-position:center}
.mosaic img:last-child{grid-column:auto;aspect-ratio:3/4}
.mosaic img:nth-child(2){rotate:-1.5deg}.mosaic img:nth-child(3){rotate:1deg}.mosaic img:nth-child(4){rotate:-1deg}
.ev__date strong{font-size:1.25rem}