:root {
  color-scheme: dark;
  --background: #050609;
  --surface: #101218;
  --white: #f4f3f0;
  --muted: #b8bac3;
  --line: #343842;
  --blue: #124cff;
  --cyan: #58cfff;
  --body: "DM Sans", Arial, sans-serif;
  --title: "Libre Caslon Display", Georgia, serif;
  --mark: "Archivo Black", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 95px; overflow-x: hidden; }
body { margin: 0; overflow-x: hidden; background: var(--background); color: var(--white); font: 1rem/1.65 var(--body); }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
img { display: block; max-width: 100%; }
h1, h2, h3, p { margin: 0; }
h2 { font: 400 clamp(2.8rem, 6vw, 5.6rem)/.94 var(--title); letter-spacing: .035em; }
a, button { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible { outline: 2px solid white; outline-offset: 6px; }
[hidden] { display: none !important; }
::selection { background: #a5dfff; color: #080808; }
.skip-link { position: fixed; z-index: 100; top: -90px; left: 1rem; background: white; color: black; padding: .75rem 1rem; }
.skip-link:focus { top: .5rem; }
.section-shell { width: min(1180px, 88%); margin-inline: auto; }
.small-label, .eyebrow, .poster-label, .poster-detail { font-size: .72rem; line-height: 1.6; letter-spacing: .17em; font-weight: 600; }
.small-label { color: var(--muted); }
.site-header { background: rgba(5,6,9,.97); position: sticky; top: 0; z-index: 50; border-bottom: 1px solid #252934; }
.header-inner { width: min(1180px, 88%); min-height: 78px; margin-inline: auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.brand { display: flex; flex-direction: column; align-items: center; font-family: var(--mark); font-weight: 400; font-style: italic; line-height: 1; letter-spacing: -.045em; transform: skew(-7deg); }
.brand-number { font-size: 1em; letter-spacing: -.09em; padding-right: .08em; }
.brand-name { font-size: .245em; letter-spacing: -.025em; margin-top: .02em; padding: .08em 0 .2em; border-bottom: .065em solid currentColor; }
.brand-posta { font-size: .43em; letter-spacing: -.07em; margin-top: .035em; }
.brand-small { font-size: 2.5rem; width: 90px; padding: 10px 0; }
nav { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .35rem 1.4rem; padding-block: .65rem; }
nav a { min-height: 44px; display: inline-flex; align-items: center; font-size: .9rem; transition: color .2s; }
nav a:hover { color: var(--cyan); }
.header-social { padding-inline: .8rem; }
.mobile-label { margin-left: .5rem; }
.menu-toggle { padding: 10px; min-width: 44px; min-height: 44px; background: none; border: 1px solid #5b5d66; border-radius: 50%; color: white; cursor: pointer; }
.menu-toggle span { width: 20px; height: 1px; display: block; background: currentColor; margin: 5px auto; transition: transform .2s; }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3px) rotate(-45deg); }
.js nav { display: none; width: 100%; flex-direction: column; align-items: stretch; padding: 1rem 0 1.7rem; }
.js nav.open { display: flex; }
.js nav a { padding: .5rem 0; }
.hero { position: relative; isolation: isolate; min-height: 680px; min-height: min(820px, calc(100svh - 78px)); display: grid; place-items: center; overflow: hidden; background: #050918; }
.hero-image { position: absolute; z-index: -4; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 49%; filter: grayscale(.12) contrast(1.08) saturate(.92); }
.hero-light { position: absolute; z-index: -3; inset: 0; background: linear-gradient(110deg,rgba(0,15,90,.72),rgba(0,90,255,.24) 48%,rgba(0,8,37,.58)),radial-gradient(ellipse at 56% 36%,rgba(43,181,255,.55),transparent 42%); mix-blend-mode: color; }
.hero::after { content: ""; position: absolute; z-index: -2; inset: 0; background: linear-gradient(90deg,rgba(0,6,27,.42),rgba(0,0,0,.06) 60%,rgba(0,3,22,.38)),linear-gradient(0deg,#050609 0%,transparent 22%,transparent 80%,rgba(0,0,0,.14)); }
.hero-content { position: relative; z-index: 4; width: min(780px, 88%); text-align: center; padding: 3rem 1rem 5.5rem; transform-style: preserve-3d; animation: hero-arrive 1s cubic-bezier(.2,.7,.2,1) both; }
.hero .eyebrow,.hero-caption { position: relative; isolation: isolate; z-index: 1; width: fit-content; max-width: 100%; margin-inline: auto; border-radius: 100px; text-shadow: 0 2px 12px #000, 0 0 18px #66b9ff9c; }
.hero .eyebrow::before,.hero-caption::before { content: ""; position: absolute; z-index: -1; inset: -.42em -.9em; border: 1px solid #b9d9ff63; border-radius: inherit; background: linear-gradient(100deg,#050a1ab0,#050a1af0 18%,#050a1af0 82%,#050a1ab0); box-shadow: 0 0 28px #287dff52, inset 0 0 18px #479cff22; pointer-events: none; animation: copy-light-breathe 4.8s ease-in-out 1.5s infinite; }
.hero .eyebrow { font-size: .69rem; letter-spacing: .22em; margin-bottom: 1.5rem; padding: .38rem .9rem; animation: hero-copy-enter .8s cubic-bezier(.2,.7,.2,1) .48s both, hero-text-glow 5s ease-in-out 1.5s infinite; }
.hero-brand { font-size: clamp(7rem, 24vw, 17rem); margin-inline: auto; width: max-content; max-width: 100%; transform: none; perspective: 900px; transform-style: preserve-3d; -webkit-text-stroke: 1.6px #080a12; paint-order: stroke fill; text-shadow: 1px 3px 0 #858791, 0 8px 34px #000, 0 0 44px #174cff9e; }
.hero-brand .brand-number,.hero-brand .brand-name,.hero-brand .brand-posta { backface-visibility: hidden; }
.hero-brand .brand-number { position: relative; left: -.09em; transform-origin: 50% 100%; animation: logo-number-in .9s cubic-bezier(.18,.78,.22,1) .08s both; }
.hero-brand .brand-name { transform-origin: 50% 50%; animation: logo-name-in 1.05s cubic-bezier(.18,.78,.22,1) .2s both, logo-glow 7s ease-in-out 1.5s infinite; }
.hero-brand .brand-posta { transform-origin: 50% 0; animation: logo-posta-in .85s cubic-bezier(.18,.78,.22,1) .34s both; }
.hero-caption { margin: 1.5rem auto 1.3rem; padding: .38rem 1.05rem; font-family: var(--title); font-size: clamp(1.4rem,2vw,1.9rem); animation: hero-copy-enter .9s cubic-bezier(.2,.7,.2,1) .78s both, hero-text-glow 5.5s ease-in-out 1.8s infinite; }
.button { min-height: 48px; border: 1px solid #a0a7b9; border-radius: 100px; padding: .78rem 1.4rem; display: inline-flex; align-items: center; justify-content: center; gap: 1rem; font-size: .82rem; line-height: 1.4; font-weight: 600; letter-spacing: .06em; transition: background .25s, color .25s, border-color .25s, transform .25s; }
.button:hover { background: var(--white); color: #050609; border-color: var(--white); transform: translateY(-2px); }
.button span { font-size: 1.1rem; }
.hero-button { background: #080b18a8; border-color: #c2d8ff; }
.hero-ribbons { position: absolute; z-index: 3; inset: 0; overflow: hidden; pointer-events: none; perspective: 1000px; transform-style: preserve-3d; }
.ribbon { position: absolute; left: -10%; width: 120%; height: clamp(52px,8vw,94px); overflow: hidden; display: flex; align-items: center; white-space: nowrap; box-shadow: 0 16px 40px #0008; transform-style: preserve-3d; }
.ribbon span { flex: 0 0 auto; min-width: 100%; font: 400 clamp(1rem,2vw,1.6rem)/1 var(--title); letter-spacing: .16em; text-align: center; animation: ribbon-drift 22s linear infinite; }
.ribbon-silver { top: 38%; color: #11131a; background: linear-gradient(180deg,#f3f4f7,#c4c8d0 50%,#e5e7ec); transform: rotateZ(-8deg) rotateY(-7deg) translateZ(45px); }
.ribbon-black { top: 55%; color: #f6f7fa; background: linear-gradient(180deg,#11131b,#05060a 55%,#171923); transform: rotateZ(-8deg) rotateY(6deg) translateZ(80px); }
.ribbon-black span { animation-direction: reverse; }
.hero-bottom { display: flex; justify-content: space-between; position: absolute; bottom: 24px; width: 88%; left: 6%; z-index: 4; font-size: .64rem; line-height: 1.5; letter-spacing: .14em; color: #d4d8e2; }
.dates { padding-top: 5.8rem; }
.section-heading { margin-bottom: 2.5rem; display: flex; align-items: end; justify-content: space-between; flex-wrap: wrap; gap: 1.3rem; }
.section-heading h2 { margin-top: .7rem; font-size: clamp(3rem,6.7vw,5.8rem); }
.dates-link { margin: 0 0 .5rem; }
.event-grid { display: grid; gap: 1.25rem; perspective: 1300px; }
.event-card { position: relative; border: 1px solid #272b35; background: var(--surface); overflow: hidden; transform-style: preserve-3d; transition: transform .5s cubic-bezier(.2,.7,.2,1), border-color .35s, box-shadow .35s; }
.event-card::before { content: ""; position: absolute; z-index: 3; inset: 0; pointer-events: none; background: linear-gradient(112deg,transparent 27%,#c6e4ff0d 40%,#d9edff2b 47%,transparent 58%); transform: translateX(-125%); transition: transform .9s cubic-bezier(.2,.7,.2,1); }
.poster { aspect-ratio: 1/1.08; position: relative; padding: 1.6rem; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: space-between; isolation: isolate; overflow: hidden; color: white; }
.poster::before { content: ""; position: absolute; z-index: -2; inset: 0; background: url("assets/club-night-community.jpg") center/cover no-repeat; filter: grayscale(.2) contrast(1.08) saturate(.92); transition: transform .7s; }
.poster::after { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(140deg,#022cff90,#040615c9 61%,#050609ee); }
.poster-label,.poster-detail { transform: translateZ(20px); transition: transform .45s cubic-bezier(.2,.7,.2,1); }
.poster-words { position: relative; z-index: 1; transform: translateZ(34px); transition: transform .5s cubic-bezier(.2,.7,.2,1), letter-spacing .5s; }
.poster-label { font-size: .62rem; }
.poster-detail { font-size: .62rem; }
.poster-words { margin-block: auto; font: 400 clamp(2.8rem,5.3vw,5.1rem)/.88 var(--title); letter-spacing: .035em; text-shadow: 0 4px 24px #000b; }
.poster-info::after { background: linear-gradient(150deg,#082bffac,#060815e8 60%,#020309); }
.poster-rules::after { background: linear-gradient(150deg,#036da1ac,#080b14e8 62%,#020309); }
.card-content { padding: 1.35rem 1.2rem 1.3rem; }
.card-content h3 { font-weight: 600; font-size: 1.1rem; }
.card-content p { color: var(--muted); font-size: .95rem; line-height: 1.6; margin-top: .5rem; }
.card-content .button { margin-top: 1.25rem; width: 100%; }
.about { position: relative; display: grid; gap: 2.5rem; padding-block: 7rem; }
.about::before { content: ""; position: absolute; z-index: -1; width: 55vw; aspect-ratio: 1; left: 50%; top: 48%; transform: translate(-50%,-50%); background: radial-gradient(circle,#102c8e36,transparent 69%); pointer-events: none; }
.about h2 { margin-top: 1rem; font-size: clamp(3.6rem,9vw,8.5rem); line-height: .88; }
.about-copy { max-width: 540px; align-self: end; color: #c5c8d0; font-size: 1.05rem; }
.about-copy p + p { margin-top: .8rem; }
.text-link { display: inline-flex; align-items: center; gap: 1rem; border-bottom: 1px solid #7f95bc; margin-top: 1.6rem; padding-bottom: .25rem; font-size: .83rem; letter-spacing: .06em; }
.text-link:hover { color: var(--cyan); }
.moments { padding-block: 1rem 7rem; }
.moments-heading p { max-width: 245px; color: var(--muted); font-size: .95rem; }
.instagram-carousel { position: relative; width: 100%; margin-inline: auto; perspective: 1450px; }
.instagram-stage { position: relative; height: 700px; perspective: 1450px; perspective-origin: 50% 42%; transform-style: preserve-3d; outline: none; transition: height .45s cubic-bezier(.2,.7,.2,1); }
.instagram-stage::before { content: ""; position: absolute; z-index: 0; top: 49%; left: 50%; width: min(68rem,110%); height: 70%; border-radius: 50%; background: radial-gradient(ellipse at center,#135dff36 0%,#0b36ab20 36%,transparent 72%); filter: blur(26px); opacity: .76; transform: translate(-50%,-50%); pointer-events: none; animation: instagram-aura 7s ease-in-out infinite alternate; }
.instagram-stage:focus-visible { outline: 2px solid #8bcaff; outline-offset: 6px; }
.instagram-slide { position: absolute; top: 50%; left: 50%; width: min(430px,calc(100% - 2rem)); transform-style: preserve-3d; transform: translate(-50%,-50%) translateZ(-600px) scale(.58); opacity: 0; visibility: hidden; pointer-events: none; transition: transform .95s cubic-bezier(.16,1,.3,1), opacity .75s ease, filter .75s ease; }
.instagram-slide.is-active { z-index: 5; transform: translate(-50%,-50%) translateZ(75px); opacity: 1; visibility: visible; pointer-events: auto; }
.instagram-slide.is-prev,.instagram-slide.is-next { z-index: 4; opacity: .6; visibility: visible; filter: saturate(.75); }
.instagram-slide.is-prev { transform: translate(-50%,-50%) translateX(-82%) rotateY(34deg) translateZ(-145px) scale(.8); }
.instagram-slide.is-next { transform: translate(-50%,-50%) translateX(82%) rotateY(-34deg) translateZ(-145px) scale(.8); }
.instagram-frame { position: relative; min-height: 650px; background: #fff; border: 1px solid #dedee3; box-shadow: 0 24px 60px #0009,0 0 30px #0b4cff30; }
.instagram-frame blockquote.instagram-media { box-sizing: border-box !important; width: 100% !important; min-width: 0 !important; max-width: none !important; margin: 0 !important; border: 0 !important; background: #fff; }
.instagram-frame blockquote.instagram-media > a { color: #171717; font-family: Arial,sans-serif; text-decoration: none; }
.instagram-frame iframe { display: block; width: 100% !important; min-width: 0 !important; max-width: 100% !important; border: 0; }
.instagram-mobile-tap { display: none; }
.instagram-controls { position: relative; z-index: 6; display: grid; justify-items: center; gap: .9rem; margin: 0 0 .7rem; }
.instagram-dots { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .55rem; }
.instagram-dot { width: 9px; height: 9px; padding: 0; border: 1px solid #8a96ac; border-radius: 50%; background: #252b39; cursor: pointer; transition: width .25s,background .25s,border-color .25s; }
.instagram-dot.is-active { width: 23px; border-color: #c6e7ff; border-radius: 8px; background: #83c5ff; }
.instagram-progress { width: min(250px,70%); height: 2px; overflow: hidden; border-radius: 3px; background: #ffffff2b; }
.instagram-progress > span { display: block; width: 100%; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#285eff,#60d7ff); box-shadow: 0 0 14px #56bfff; transform: scaleX(0); transform-origin: left center; }
.instagram-progress > span.is-running { animation: carousel-progress 8s linear forwards; }
.instagram-carousel.is-paused .instagram-progress > span.is-running { animation-play-state: paused; }
.carousel-status { margin-top: .85rem; color: var(--muted); text-align: center; font-size: .75rem; letter-spacing: .12em; }
.active-post-link { display: flex; width: max-content; max-width: 100%; justify-content: center; margin: .7rem auto 0; }
.instagram-fallback { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 1rem; list-style: none; padding: 0; }
.instagram-fallback a { color: #cdd0d8; text-underline-offset: 4px; }
.instagram-fallback a:hover { color: var(--cyan); }
html:not(.js) .instagram-carousel { display: none; }
.instagram-fallback li { padding: 1rem; border-bottom: 1px solid var(--line); background: #101218; }
.instagram-link { display: inline-flex; gap: .75rem; align-items: center; margin-top: .9rem; color: #cdd0d8; font-size: .82rem; }
.instagram-link:hover { color: var(--cyan); }
.instagram-cta { margin-top: 2.2rem; }
@keyframes carousel-progress { to { transform: scaleX(1); } }
@keyframes instagram-aura { from { opacity: .52; transform: translate(-50%,-50%) scale(.92); } to { opacity: .92; transform: translate(-50%,-50%) scale(1.07); } }
.music { overflow: hidden; }
.music-heading { padding: 1rem 0 2rem; }
.music-heading h2 { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0 1rem; font-size: clamp(3.2rem,8vw,7rem); margin-top: .5rem; }
.music-stage { min-height: 610px; position: relative; isolation: isolate; display: grid; align-items: center; gap: 3rem; padding: 3.5rem 6%; }
.music-stage>img { position: absolute; z-index: -3; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 49%; filter: grayscale(.2) contrast(1.08) saturate(.92); }
.music-stage::before { content: ""; position: absolute; z-index: -2; inset: 0; background: linear-gradient(110deg,#061760c9,#02040bed 78%),radial-gradient(ellipse at 70% 38%,#126aff99,transparent 48%); mix-blend-mode: color; }
.music-stage::after { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg,#0009,#0002),linear-gradient(#050609 0%,transparent 14%,transparent 83%,#050609); }
.music-image { width: min(100%,520px); height: 290px; overflow: hidden; border: 1px solid #a5c5ff85; box-shadow: 25px 25px 0 #07194ab8, 0 35px 90px #000a; transform: perspective(900px) rotateY(9deg) rotateX(-3deg) rotateZ(-2deg); }
.music-image img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; filter: grayscale(.12) contrast(1.08) saturate(.92); }
.playlist-panel { max-width: 530px; width: 100%; padding: 2rem 1.5rem; border-left: 2px solid #65b9ff; background: linear-gradient(90deg,#05070bea,#05070b80); backdrop-filter: blur(8px); }
.playlist-panel h3 { font: 400 clamp(2.7rem,4.7vw,4.5rem)/.98 var(--title); margin: 1.2rem 0; }
.playlist-panel p { max-width: 400px; color: #c6c9d3; }
.button-solid { background: var(--white); color: #0a0a0a; border-color: var(--white); margin-top: 2rem; }
.button-solid:hover { background: #c8e8ff; border-color: #c8e8ff; }
.contact { padding-block: 7rem 6rem; text-align: center; }
.contact h2 { font-size: clamp(4.4rem,11vw,10rem); line-height: .85; margin-top: 1.3rem; }
.contact p { max-width: 500px; margin: 1.2rem auto 1.8rem; color: #bdbfc8; }
.site-footer { border-top: 1px solid #343842; padding-block: 2.5rem 1.5rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; }
.site-footer>p { color: #aaa; font-size: .875rem; }
.footer-links { display: flex; gap: 1.5rem; font-size: .875rem; }
.footer-links a:hover { text-decoration: underline; text-underline-offset: 4px; }
.footer-bottom { border-top: 1px solid #272b34; width: 100%; padding-top: 1.5rem; display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; color: #aaa; font-size: .75rem; }
.footer-bottom small { font-size: inherit; }
.js .reveal { opacity: 0; transform: translateY(28px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1); }
.js .reveal.is-visible { opacity: 1; transform: none; }
.js .event-card.reveal { transition: opacity .7s ease, transform .65s cubic-bezier(.2,.7,.2,1), border-color .35s, box-shadow .35s; }
.js .event-card.reveal:nth-child(2) { transition-delay: .13s; }
.js .event-card.reveal:nth-child(3) { transition-delay: .26s; }
.js .event-card.reveal.is-visible:hover,
.js .event-card.reveal.is-visible:focus-within { transition-delay: 0s; border-color: #65a1ff; box-shadow: 0 30px 60px #06174299, 0 0 0 1px #4b91ff38; }
.js .event-card.reveal.is-visible:hover { transform: perspective(1050px) rotateY(-4deg) rotateX(2deg) translateY(-10px) scale(1.012); }
.js .event-card.reveal.is-visible:nth-child(2):hover { transform: perspective(1050px) rotateY(0) rotateX(2deg) translateY(-10px) scale(1.015); }
.js .event-card.reveal.is-visible:nth-child(3):hover { transform: perspective(1050px) rotateY(4deg) rotateX(2deg) translateY(-10px) scale(1.012); }
.js .event-card.reveal.is-visible:focus-within { transform: perspective(1050px) rotateY(-1deg) rotateX(1deg) translateY(-5px); }
.js .event-card.reveal.is-visible:hover::before,
.js .event-card.reveal.is-visible:focus-within::before { transform: translateX(125%); }
.js .event-card.reveal.is-visible:hover .poster::before,
.js .event-card.reveal.is-visible:focus-within .poster::before { transform: scale(1.1) translateX(1%); }
.js .event-card.reveal.is-visible:hover .poster-words,
.js .event-card.reveal.is-visible:focus-within .poster-words { transform: translateZ(48px) scale(1.025); letter-spacing: .055em; }
.js .event-card.reveal.is-visible:hover .poster-label,
.js .event-card.reveal.is-visible:hover .poster-detail,
.js .event-card.reveal.is-visible:focus-within .poster-label,
.js .event-card.reveal.is-visible:focus-within .poster-detail { transform: translateZ(30px); }
.event-card:active { transform: scale(.992); }
@keyframes ribbon-drift { to { transform: translateX(-100%); } }
@keyframes hero-arrive { from { opacity: 0; transform: perspective(900px) translateY(22px) rotateX(5deg); } to { opacity: 1; transform: perspective(900px) translateY(0) rotateX(0); } }
@keyframes logo-number-in { from { opacity: 0; filter: blur(9px); transform: translateY(-.12em) rotateX(-68deg) scale(.82); } to { opacity: 1; filter: blur(0); transform: translateY(0) rotateX(0) scale(1); } }
@keyframes logo-name-in { from { opacity: 0; filter: blur(8px); transform: translateZ(-80px) rotateX(42deg) scale(.9); } to { opacity: 1; filter: blur(0); transform: translateZ(0) rotateX(0) scale(1); } }
@keyframes logo-posta-in { from { opacity: 0; filter: blur(7px); transform: translateY(.16em) rotateX(55deg) scale(.86); } to { opacity: 1; filter: blur(0); transform: translateY(0) rotateX(0) scale(1); } }
@keyframes logo-glow { 0%,100% { text-shadow: 0 1px 0 #858791, 0 7px 24px #000, 0 0 24px #174cff65; } 50% { text-shadow: 0 2px 0 #b9c1d2, 0 8px 28px #000, 0 0 42px #53baffb0; } }
@keyframes hero-copy-enter { from { opacity: 0; filter: blur(5px); transform: translateY(14px) scale(.98); } to { opacity: 1; filter: blur(0); transform: translateY(0) scale(1); } }
@keyframes hero-text-glow { 0%,100% { text-shadow: 0 2px 12px #000, 0 0 14px #72baff87; } 50% { text-shadow: 0 2px 12px #000, 0 0 22px #d0edffcc, 0 0 38px #2589ff90; } }
@keyframes copy-light-breathe { 0%,100% { opacity: .9; box-shadow: 0 0 24px #1d72ff40, inset 0 0 16px #479cff20; } 50% { opacity: 1; box-shadow: 0 0 38px #319dff75, inset 0 0 24px #8dcaff40; } }
@media (min-width: 700px) {
  .event-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.35rem; }
  .event-card { display: flex; flex-direction: column; }
  .poster { flex: none; padding: 1.2rem; }
  .card-content { flex: 1; display: flex; flex-direction: column; padding: 1.4rem; }
  .card-content .button { margin-top: auto; }
  .card-content p { margin-bottom: 1.4rem; }
  .poster-words { font-size: clamp(2.7rem,4.6vw,4.5rem); }
  .about { grid-template-columns: 1.1fr .7fr; align-items: end; gap: 2rem; padding-block: 10rem; }
  .about-copy { padding-bottom: .5rem; }
  .instagram-stage { height: 710px; }
  .music-stage { grid-template-columns: 1.1fr .9fr; padding-inline: max(6%,calc((100vw - 1180px)/2)); min-height: 720px; }
  .music-image { width: min(100%,500px); height: 390px; }
  .playlist-panel { padding: 2.5rem 0 2.5rem 2rem; }
}
@media (min-width: 850px) {
  .js nav { display: flex; width: auto; flex-direction: row; align-items: center; padding: 0; gap: 1.65rem; }
  .js nav a { padding: 0; }
  .js .menu-toggle { display: none; }
  .mobile-label { display: none; }
  .hero-content { width: 66%; }
  .hero-brand { font-size: clamp(11rem,20vw,17rem); }
  .hero-content .eyebrow { font-size: .75rem; }
  .hero-caption { font-size: 1.5rem; }
}
@media (max-width: 699px) {
  .hero { min-height: 670px; min-height: min(760px, calc(100svh - 72px)); }
  .hero-image { object-position: 52% 49%; }
  .hero-brand { font-size: clamp(6.5rem, 29vw, 11rem); }
  .hero-ribbons { top: 0; bottom: 0; }
  .ribbon { height: 57px; }
  .ribbon-silver { top: 35%; transform: rotateZ(-9deg) rotateY(-5deg) translateZ(40px); }
  .ribbon-black { top: 59%; transform: rotateZ(-9deg) rotateY(5deg) translateZ(70px); }
  .hero-bottom { font-size: .59rem; gap: 1.5rem; }
  .hero-bottom span:last-child { max-width: 145px; text-align: right; }
  .dates { padding-top: 4.5rem; }
  .section-heading h2 { font-size: clamp(3rem,14vw,5rem); }
  .dates-link { margin-top: -.6rem; }
  .event-card { display: grid; grid-template-columns: 1.05fr .95fr; }
  .poster { aspect-ratio: .9/1.16; padding: 1rem .75rem; }
  .poster-words { font-size: clamp(2rem,8vw,3.4rem); }
  .poster-label,.poster-detail { font-size: .53rem; }
  .card-content { display: flex; flex-direction: column; justify-content: center; padding: 1rem; }
  .card-content h3 { font-size: .98rem; }
  .card-content p { font-size: .83rem; line-height: 1.5; }
  .card-content .button { margin-top: 1rem; padding-inline: .7rem; gap: .45rem; font-size: .7rem; }
  .about { padding-block: 6.5rem; }
  .about h2 { font-size: clamp(4rem,17vw,7rem); }
  .moments { padding-bottom: 5rem; }
  .moments-heading p { max-width: 210px; }
  .instagram-carousel { perspective: none; }
  .instagram-stage { height: 610px; perspective: none; perspective-origin: center; transform-style: flat; }
  .instagram-slide { width: min(380px,calc(100% - 1.6rem)); }
  .instagram-slide.is-active { transform: translate(-50%,-50%); }
  .instagram-slide.is-prev,.instagram-slide.is-next { display: none; }
  .instagram-frame { min-height: 555px; }
  .instagram-mobile-tap { position: absolute; z-index: 8; inset: 0; display: flex; align-items: flex-end; justify-content: center; padding: 1rem; color: white; }
  .instagram-mobile-tap span { padding: .55rem .8rem; border: 1px solid #ffffff80; border-radius: 999px; background: #05070bd9; box-shadow: 0 2px 14px #0008; font-size: .65rem; font-weight: 700; letter-spacing: .1em; }
  .instagram-mobile-tap:focus-visible { outline: 3px solid #83c5ff; outline-offset: -5px; }
  .instagram-controls { gap: .8rem; margin-bottom: .5rem; }
  .instagram-dots { gap: .4rem; }
  .instagram-progress { width: min(210px,75%); }
  .music-heading h2 { display: block; font-size: clamp(3.3rem,13vw,5.7rem); line-height: .92; }
  .music-stage { min-height: 730px; align-content: center; gap: 2.4rem; padding: 2.5rem 7%; }
  .music-image { height: 235px; width: 88%; margin-inline: auto; transform: perspective(800px) rotateY(7deg) rotateX(-3deg) rotateZ(-2deg); }
  .playlist-panel { padding: 1.3rem 0 1rem; background: transparent; border-left: 0; border-top: 1px solid #65b9ff; backdrop-filter: none; }
  .playlist-panel h3 { margin: .8rem 0; font-size: 2.8rem; }
  .contact { padding-block: 6rem 5rem; }
  .contact h2 { font-size: clamp(4.2rem,16vw,7rem); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .hero .eyebrow,.hero-caption,.hero .eyebrow::before,.hero-caption::before { animation: none !important; }
  .hero-brand .brand-number,.hero-brand .brand-name,.hero-brand .brand-posta { animation: none !important; filter: none; opacity: 1; transform: none; }
  .instagram-slide { transition: none; }
  .instagram-stage::before { animation: none; }
  .instagram-progress > span.is-running { animation: none; transform: none; }
  .js .reveal { opacity: 1; transform: none; }
}


/* Ticketing dinámico */
.event-date-card .poster-words {
  max-width: 100%;
  font-size: clamp(1.75rem,5vw,3.45rem);
  line-height: .88;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
.event-date-card .card-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.event-date-card .card-content h3 {
  width: 100%;
  margin-inline: auto;
  font-size: 1.15rem;
  text-align: center;
}
.event-meta {
  color: #d7d9e1 !important;
  font-weight: 600;
}
.dates-status {
  min-height: 1.6em;
  margin-top: 1.3rem;
  color: var(--muted);
  font-size: .9rem;
}
.button.is-disabled {
  opacity: .48;
  cursor: not-allowed;
  pointer-events: auto;
}
.button.is-disabled:hover {
  background: transparent;
  color: inherit;
  border-color: #a0a7b9;
  transform: none;
}