/* Sedgwick Ave Display — gazduit local, subsetat la latin + diacritice RO.
   Licenta SIL OFL, copia e in assets/fonts/OFL.txt */
@font-face{
  font-family:'Sedgwick Ave Display';
  src:url('assets/fonts/sedgwick-ave-display.woff2') format('woff2');
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
:root{--accent:#b5f100;--accent-2:#b5f100;--cta:#f9470c;--cta-hover:#ff5c26;--bg:#0a0a0a;--poster:'Barlow Condensed','Arial Narrow',Impact,sans-serif;--script:'Sedgwick Ave Display','Caveat',cursive}
.event-nav{padding:12px 3.4%;background:#0a0a0aeb;border-bottom:1px solid #ffffff36;backdrop-filter:blur(16px)}
.event-nav .nav__logo{font-family:var(--poster);font-size:30px;font-weight:900;letter-spacing:-1px;line-height:1}
.event-nav .nav__links{gap:24px}.event-nav .nav__links a{border-radius:2px;color:#fff}.event-nav .nav__cta{padding:8px 24px}.nav__cta span{margin-left:18px}
.battle-hero{position:relative;isolation:isolate;overflow:hidden;background:#090909}
.battle-backdrop{position:absolute;inset:-18px;z-index:-1;background:url('assets/hero-background.webp') center bottom/cover no-repeat;transform:translate(var(--bg-x,0px),var(--bg-y,0px));will-change:transform}
.battle-stage{position:relative;max-width:1800px;margin:auto;min-height:clamp(710px,62vw,990px);padding:20px 3.4% 48px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto 1fr;align-content:start}
.battle-title{grid-column:1/-1;margin:0;color:var(--accent);font:900 clamp(100px,18vw,324px)/1 var(--poster);letter-spacing:-.035em;white-space:nowrap;position:relative;z-index:1;animation:title-arrive .95s cubic-bezier(.16,1,.3,1) both}
.battle-tagline{grid-column:1;position:relative;z-index:3;margin:calc(15px + .95vw) 0 26px;font:400 clamp(38px,5.6vw,94px)/1.05 var(--script);transform:rotate(-4deg);width:max-content;animation:copy-arrive .8s .15s both}
.battle-tagline:after{content:'';position:absolute;left:3%;right:0;bottom:-6px;height:3px;background:#fff;transform:rotate(-1deg);clip-path:polygon(0 30%,100% 0,97% 80%,5% 100%)}
.battle-art{position:absolute;z-index:2;right:3%;top:24%;width:47%;pointer-events:none;animation:dancer-arrive 1.25s cubic-bezier(.16,1,.3,1) .12s both}
.dancer-drift{transform:translate(var(--move-x,0px),var(--move-y,0px));will-change:transform}
.battle-dancer{width:100%;height:auto;filter:drop-shadow(0 22px 18px #0007);animation:dancer-float 7s ease-in-out 1.4s infinite}
.battle-orbit{position:absolute;inset:-5% -10% 0;transform:translate(calc(var(--move-x,0px)*-.4),calc(var(--move-y,0px)*-.4));z-index:-1}
.battle-orbit svg{width:100%;height:100%;overflow:visible;animation:orbit-sway 10s ease-in-out infinite}
.orbit-ink ellipse{stroke-dasharray:1;animation:draw-orbit 1.6s .35s both}.paint{animation:paint-in 1s .5s both}
.battle-copy{grid-column:1;position:relative;z-index:3;align-self:start;animation:copy-arrive .8s .3s both}
.battle-kicker{margin:0 0 25px;font:700 clamp(17px,2.05vw,32px)/1.2 var(--poster);letter-spacing:.055em}.battle-kicker span{margin:0 8px;color:var(--accent)}
.battle-date{margin:0;color:#b5f100;font:800 clamp(26px,2.65vw,44px)/1.12 var(--poster);letter-spacing:.025em}.battle-date span{display:block;font-size:.88em;margin-top:5px}
.battle-intro{font-size:clamp(14px,1.45vw,21px);margin:23px 0;color:#e2e2e2}
.battle-actions{display:flex;align-items:center;gap:30px}.battle-cta{display:inline-flex;align-items:center;justify-content:center;background:var(--cta);color:#090909;padding:17px 40px;text-decoration:none;font:800 24px/1.15 var(--poster);text-transform:uppercase;letter-spacing:.03em;border:1px solid var(--cta);border-radius:2px;box-shadow:none;transition:transform .18s,box-shadow .18s,background .18s;position:relative;overflow:hidden}.battle-cta:hover{transform:translate(-2px,-3px);background:var(--cta-hover);box-shadow:none}.battle-cta:active{transform:translate(3px,3px);box-shadow:none;transition-duration:.06s}.battle-cta:focus-visible{outline:3px solid #fff;outline-offset:4px}
.battle-link{color:#fff;text-underline-offset:7px;font-size:15px;white-space:nowrap}.battle-link span{display:inline-block;margin-left:8px;transition:transform .2s}.battle-link:hover span{transform:translateY(4px)}
.battle-facts{display:grid;grid-template-columns:auto 1fr 1fr;align-items:stretch;margin-top:34px;max-width:min(100%,760px);border:1px solid var(--accent);background:#0a0a0ad9}
.battle-facts .fact{padding:14px clamp(16px,1.5vw,26px);min-width:0}
.facts-top{display:contents}
.fact--when{display:none}
.battle-facts .fact--cat{border-left:1px solid #b5f10047}
.fact__label{margin:0 0 8px;font:700 clamp(10px,.8vw,13px)/1 var(--poster);letter-spacing:.2em;color:#d3d3d3}
.fact--cat .fact__label{color:var(--accent)}
.fact__value{margin:0;font:800 clamp(19px,1.68vw,28px)/1.05 var(--poster);letter-spacing:.02em;color:#fff;white-space:nowrap}
.fact--price .fact__value{display:flex;flex-direction:column;gap:1px}
.fact--price .fact__value strong{font-weight:900;font-size:1.3em;color:var(--accent)}
.fact--price .fact__value span{font-size:.56em;letter-spacing:.09em;color:#fff}
.fact__time{margin:7px 0 0;font:500 clamp(11px,.95vw,15px)/1 var(--body);color:#b6b6b6;white-space:nowrap}
.motion-toggle{position:absolute;bottom:12px;right:3.4%;z-index:5;border:0;background:#090909ad;color:#b5b5b5;padding:8px 10px;font:11px var(--body);cursor:pointer}.motion-toggle:hover{color:#fff}
.battle-ticker{overflow:hidden;background:var(--accent);color:#090909;padding:13px 0}.battle-ticker-track{display:flex;width:max-content;animation:battle-ticker 30s linear infinite}.battle-ticker-track span{flex-shrink:0;font:800 19px/1 var(--poster);letter-spacing:.04em;white-space:nowrap}.battle-ticker i{font-style:normal;margin:0 26px}
a:focus-visible,button:focus-visible{outline:2px solid white;outline-offset:5px}section[id]{scroll-margin-top:85px}
@keyframes title-arrive{from{opacity:0;transform:translateY(55px);clip-path:inset(100% 0 0)}to{opacity:1;transform:translateY(0);clip-path:inset(0)}}
@keyframes copy-arrive{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
@keyframes dancer-arrive{from{opacity:0;translate:65px 60px;rotate:5deg}to{opacity:1;translate:0 0;rotate:0deg}}
@keyframes dancer-float{0%,100%{transform:translateY(0) rotate(-.5deg)}50%{transform:translateY(-12px) rotate(.5deg)}}
@keyframes orbit-sway{0%,100%{rotate:-2deg}50%{rotate:2deg}}
@keyframes draw-orbit{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes paint-in{from{opacity:0}to{opacity:1}}
@keyframes battle-ticker{to{transform:translateX(-25%)}}
.motion-paused .battle-hero *,.motion-paused .battle-ticker-track{animation-play-state:paused!important}.motion-paused .dancer-drift,.motion-paused .battle-backdrop,.motion-paused .battle-orbit{transform:none}
@media(min-width:1800px){.battle-title{font-size:324px}}
@media(max-width:1000px) and (min-width:701px){.battle-stage{min-height:720px}.battle-art{top:30%;right:-4%;width:53%}.battle-copy{grid-column:1/-1;max-width:52%}.battle-actions{gap:20px}.battle-cta{font-size:20px;padding:14px 18px}.battle-facts{max-width:none}.battle-facts .fact{padding:12px 14px}}
@media(max-width:700px){
.event-nav{padding:4px 16px;min-height:44px;justify-content:flex-start}.event-nav .nav__logo{font-size:20px;line-height:1}.event-nav .nav__links{display:none}.event-nav .nav-detail{display:none}.event-nav .nav__cta{display:none}.nav__cta span{margin-left:9px}
.battle-stage{display:flex;flex-direction:column;min-height:0;padding:16px 20px 42px}.battle-title{font-size:17.6vw;line-height:1.06;letter-spacing:-.035em;width:100%;order:0}.battle-tagline{order:1;font-size:10vw;margin:14px auto 0;line-height:1.1}.battle-art{order:2;position:relative;top:auto;right:auto;align-self:center;width:min(82%,360px);margin:-2px 0 -10px;z-index:2}.battle-orbit{inset:0 -12% 0}.battle-dancer{animation-name:dancer-float;max-height:340px;object-fit:contain}.battle-backdrop{background-position:65% center;background-size:auto 100%}.battle-copy{order:3;align-self:stretch;text-align:center}.battle-kicker{font-size:17px;margin:0 0 12px;letter-spacing:.04em}.battle-kicker span{margin:0 4px}.battle-date{font-size:30px}.battle-date span{font-size:25px}.battle-intro{font-size:13px;margin:14px 0 17px}.battle-actions{flex-direction:column;gap:17px}.battle-cta{width:100%;font-size:22px;padding:17px 20px;box-shadow:none}.battle-link{font-size:13px}.battle-facts{margin-top:22px;grid-template-columns:1fr 1fr;gap:10px;border:0;background:none;text-align:left}.battle-facts .fact{border:1px solid #b5f1005c;background:#0a0a0ab8;padding:13px 15px}.battle-facts .fact--cat{border-left:1px solid #b5f1005c}.facts-top{display:grid;grid-column:1/-1;grid-template-columns:1fr 1fr;border:1px solid var(--accent);background:#0a0a0ab8}.facts-top .fact{border:0;background:none;padding-left:12px;padding-right:12px}.facts-top .fact--when{display:grid;align-content:center;position:relative}.facts-top .fact--when:before{content:'';position:absolute;left:0;top:16%;bottom:16%;width:1px;background:#b5f100a6}.fact__when{margin:0;font:800 clamp(14px,4.5vw,22px)/1.16 var(--poster);letter-spacing:.02em;color:var(--accent)}.fact__when span{display:block;font-size:.86em;color:#fff}.fact__label{font-size:11px;margin-bottom:6px;letter-spacing:.18em}.fact__value{font-size:21px;white-space:normal}.fact--price .fact__value{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:2px 9px}.fact--price .fact__value strong{font-size:1.7em}.fact--price .fact__value span{font-size:.7em}.fact__time{font-size:13px;margin-top:6px}.battle-ticker{padding:12px 0}.battle-ticker-track span{font-size:16px}.motion-toggle{font-size:10px;bottom:4px;right:16px}.battle-ticker i{margin:0 18px}
}
@media(max-width:360px){.battle-stage{padding-inline:14px}.battle-date{font-size:26px}.battle-kicker{font-size:15px}.battle-facts{font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.battle-hero *,.battle-ticker-track{animation:none!important;transition:none!important}.dancer-drift,.battle-backdrop,.battle-orbit{transform:none!important}.motion-toggle{display:none}}
/* Fill the poster width and keep mobile information readable over asphalt. */
@media(min-width:701px){.battle-title{font-size:min(22.2vw,399px);line-height:.9}.battle-stage{grid-template-rows:auto auto 1fr}.battle-art{top:25%}}
@media(max-width:700px){.battle-title{font-size:21.5vw;line-height:1}.battle-backdrop:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#090909d9 80%)}.battle-facts .fact__value{color:#fff}}

/* Static composition, dancer grounded closer to the asphalt. */
.battle-hero *,.battle-ticker-track{animation:none!important}
.dancer-drift,.battle-backdrop,.battle-orbit,.battle-dancer{transform:none;will-change:auto}
@media(min-width:1001px){.battle-art{top:auto;bottom:12px;right:3%;width:44%}}
@media(min-width:701px) and (max-width:1000px){.battle-art{top:auto;bottom:22px;right:0;width:50%}}
@media(max-width:700px){.battle-art{margin-top:16px;margin-bottom:0}}

/* .battle-stage e scalat si estompat la fiecare cadru cat tine povestea de
   scroll. Fara promovare pe un strat propriu, telefonul redeseneaza tot eroul
   (peste 700px inaltime) la fiecare cadru. .battle-backdrop are deja
   will-change; ii adaugam si opacity, fiindca si ea se animeaza. */
.scroll-story .battle-stage{will-change:transform,opacity}

/* Eroul incape intr-un singur ecran pe desktop: tipografia si spatiile se
   scaleaza si dupa inaltimea ferestrei, nu doar dupa latime. */
@media(min-width:1001px){
.battle-hero{--nav:66px}
.battle-stage{min-height:calc(100svh - var(--nav));padding-top:min(20px,1.4vh);padding-bottom:min(48px,3.2vh);align-content:space-between}
.battle-title{font-size:min(22.2vw,399px,calc(50vh - 94px));line-height:.96;margin-bottom:-.055em}
.battle-tagline{font-size:min(5.6vw,94px,calc(11vh - 10px));margin-bottom:min(26px,1.9vh)}
.battle-kicker{font-size:min(2.05vw,32px,2.4vh);margin-bottom:min(25px,1vh)}
.battle-date{font-size:min(2.65vw,44px,4.7vh)}
.battle-intro{font-size:min(1.45vw,21px,1.9vh);margin:min(23px,1.1vh) 0}
.battle-cta{font-size:min(24px,2.7vh);padding:min(17px,1.9vh) 40px}
.battle-facts{margin-top:min(34px,2vh)}
.battle-date span{margin-top:3px}
.battle-copy{align-self:end}
.battle-facts .fact{padding:min(14px,1.5vh) clamp(16px,1.5vw,26px)}
.fact__label{margin-bottom:min(8px,.9vh)}
.fact__value{font-size:min(1.68vw,28px,3.1vh)}
.fact--price .fact__value strong{font-size:1.28em}
.fact__time{margin-top:min(7px,.8vh);font-size:min(.95vw,15px,1.8vh)}
.battle-art{bottom:0;width:min(44%,62vh)}
}
@media(min-width:701px) and (max-width:1000px){
.battle-hero{--nav:66px}
.battle-stage{min-height:calc(100svh - var(--nav));padding-top:min(20px,1.4vh);padding-bottom:min(42px,3vh)}
.battle-copy{align-self:end;max-width:50%}
.battle-title{font-size:min(22.2vw,calc(50vh - 94px));line-height:.96;margin-bottom:-.055em}
.battle-tagline{font-size:min(5.6vw,94px,calc(11vh - 10px));margin-bottom:min(26px,1.9vh)}
.battle-kicker{font-size:min(2.05vw,2.4vh);margin-bottom:min(25px,1vh)}
.battle-date{font-size:min(2.65vw,4.4vh)}
.battle-intro{font-size:min(1.45vw,1.9vh);margin:min(23px,1.1vh) 0}
.battle-cta{font-size:min(20px,2.6vh);padding:min(14px,1.8vh) 18px}
.battle-facts{margin-top:min(28px,2vh)}
.battle-date span{margin-top:3px}
.battle-facts .fact{padding:min(12px,1.4vh) 14px}
.fact__label{margin-bottom:min(8px,.9vh)}
.fact__value{font-size:clamp(15px,2.3vw,2.9vh)}
.fact__time{margin-top:min(7px,.8vh);font-size:clamp(11px,1.5vw,1.9vh)}
.battle-art{bottom:0;width:min(50%,58vh)}
}
@media(max-width:700px){
.battle-hero{--nav:62px}
.battle-stage{min-height:calc(100svh - var(--nav));padding-top:min(16px,1.6vh);padding-bottom:min(42px,2.2vh)}
.battle-title{font-size:min(19.5vw,11.5vh);line-height:.92;text-align:center}
.battle-tagline{font-size:min(8.8vw,4.8vh)}
.battle-art{margin-top:min(10px,1.2vh);width:min(96%,400px)}
.battle-dancer{max-height:min(400px,45vh)}
.battle-kicker,.battle-intro,.battle-date{display:none}
.battle-cta{font-size:min(17px,2.3vh);padding:min(10px,1.4vh) 20px}
.battle-facts{margin-top:min(12px,1.6vh);gap:min(7px,.9vh)}
.battle-facts .fact{padding:min(8px,1.1vh) 12px}
.fact__label{font-size:min(9px,1.2vh);margin-bottom:min(5px,.7vh)}
.fact__value{font-size:min(16px,2.2vh)}
.fact__time{font-size:min(10.5px,1.4vh);margin-top:min(4px,.6vh)}
}
@media(max-width:700px) and (max-height:700px){
.battle-stage{padding-bottom:min(42px,1.4vh)}
.battle-dancer{max-height:40vh}
.battle-facts{margin-top:min(22px,1.8vh)}
}

/* Formatul concursului, doar pe telefon, ca in referinta. */
.battle-format{display:none}
@media(max-width:700px){
.battle-format{display:flex;flex-direction:column;position:absolute;right:calc(14px - (100vw - 100%)/2);top:calc(80% - 22.5335vw);width:22.525vw;z-index:4;pointer-events:none;font-family:var(--poster);font-weight:800;line-height:1;white-space:nowrap}
.battle-format__styles{color:var(--accent);font-size:3.91vw;line-height:1.15;transform:translateY(2px)}
.battle-format__battle{color:#fff;font-size:4.08vw;line-height:1.15}
.battle-format__versus{align-self:flex-end;color:var(--accent);font-size:10vw;font-weight:900;line-height:.85;margin-top:-.8vw;letter-spacing:-.045em;transform:translateX(-3vw) scaleX(1.28);transform-origin:right center}
}

/* Acces la formular dupa ce CTA-ul initial nu mai este vizibil. */
.mobile-signup{display:none}
@media(max-width:700px){
.mobile-signup:not([hidden]){display:block;position:fixed;inset:auto 0 0;z-index:1000;padding:12px 20px calc(12px + env(safe-area-inset-bottom,0px));background:#090909;border-top:1px solid #ffffff26}
.mobile-signup a{display:flex;align-items:center;justify-content:center;min-height:48px;padding:12px;background:var(--cta);color:#090909;text-decoration:none;text-transform:uppercase;font:800 22px/1.15 var(--poster);border-radius:2px}
.mobile-signup a:focus-visible{outline:3px solid #fff;outline-offset:3px}
}


/* Mobile v6: layoutul original ramane intact. Eliminam CTA-ul inline din flux,
   astfel casetele urca doar in locul butonului eliminat; dansatorul si headerul
   isi pastreaza dimensiunile/pozitiile originale. */
.battle-details-cue{display:none}
@media(max-width:700px){
  /* Ridicam doar blocul cu pret/data/categorii si indicatorul Detalii, fara sa schimbam dansatorul. */
  .battle-copy{margin-top:-24px}
}

@media(max-width:700px){
  /* CTA-ul portocaliu original nu mai ocupa spatiu in hero. */
  .battle-actions{display:none}

  /* Indicatorul ramane imediat sub cele doua categorii. */
  .battle-details-cue{
    display:flex;
    width:max-content;
    margin:min(7px,.8vh) auto 0;
    flex-direction:column;
    align-items:center;
    color:#fff;
    text-decoration:none;
    font:800 min(10px,1.25vh)/1 var(--poster);
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    z-index:6;
  }
  .battle-details-cue__arrows{
    display:flex;
    flex-direction:column;
    align-items:center;
    margin-top:3px;
  }
  .battle-details-cue__arrows i{
    display:block;
    width:min(10px,1.25vh);
    height:min(10px,1.25vh);
    border-right:3px solid var(--accent);
    border-bottom:3px solid var(--accent);
    transform:rotate(45deg);
  }
  .battle-details-cue__arrows i+i{margin-top:-5px}

  /* Singurul CTA portocaliu vizibil: fix jos, fara bara neagra auxiliara. */
  .mobile-signup:not([hidden]){
    display:block;
    position:fixed;
    left:0;
    right:0;
    bottom:calc(6px + env(safe-area-inset-bottom,0px));
    z-index:1000;
    padding:0 20px;
    background:transparent;
    border:0;
    pointer-events:none;
  }
  .mobile-signup a{
    pointer-events:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:52px;
    padding:11px 16px;
    background:var(--cta);
    color:#090909;
    border:1px solid var(--cta);
    border-radius:2px;
    text-decoration:none;
    text-transform:uppercase;
    font:800 min(22px,5.6vw)/1.1 var(--poster);
    letter-spacing:.03em;
    box-shadow:0 8px 24px #0008;
  }
}

/* Bilet de battle — doar finisaj vizual.
   Dimensiunile, grila, spatiile si tipografia originale sunt pastrate. */
.battle-facts{background:#10120ded}
.battle-facts .fact--price{background:#b5f100}
.battle-facts .fact--price .fact__label,
.battle-facts .fact--price .fact__value strong,
.battle-facts .fact--price .fact__value span{color:#0a0a0a}
.battle-facts .fact--cat{border-left-style:dashed;border-left-color:#b5f10070}
.battle-facts .fact__time{color:#deded8}
@media(max-width:700px){
  .battle-facts{background:none}
  .battle-facts .facts-top{background:#10120ded}
  .battle-facts .facts-top .fact--price{background:#b5f100}
  .battle-facts .facts-top .fact--when:before{background:none}
  .battle-facts .fact--cat{
    background:#10120ded;
    border-style:dashed;
    border-color:#b5f10070;
  }
}

/* Indicator mobil: text lizibil si tinta tactila extinsa fara rearanjarea hero-ului. */
@media(max-width:700px){
  .battle-details-cue{font-size:11px;letter-spacing:.12em}
  .battle-details-cue::before{
    content:"";
    position:absolute;
    top:0;
    left:-12px;
    right:-12px;
    height:44px;
  }
  .battle-details-cue__arrows i{width:10px;height:10px}
  .battle-details-cue:hover .battle-details-cue__label{color:var(--accent)}
}

/* Pe telefon, bara portocalie e fixa peste hero, iar indicatorul "Descopera
   evenimentul" ajungea sub ea — sagetile nu se vedeau deloc pe ecranele mai
   scunde. Rezervam jos exact cat ocupa bara, plus putin aer:
     max(48px, ...) = minimul sub care sagetile ar reintra sub buton;
     min(64px, 7vh) = pe ecrane inalte lasam mai mult aer;
     env(...)       = zona indicatorului de acasa, cand bara urca peste ea.
   O singura margine auto, pe titlu: tot spatiul liber se aduna deasupra lui,
   iar restul blocului ramane strans — dansatorul sta aproape de casete, cum
   arata afisul. Fiind auto, consuma doar spatiu liber si nu adauga inaltime. */
@media(max-width:700px){
  /* padding-top a devenit redundant: titlul are margin-top:auto, deci spatiul
     de sus il da marginea. Pe ecranele unde exista loc liber, mutarea lui in
     margine nu schimba nimic vizual; unde nu exista, elibereaza ~12px si
     opreste heroul sa depaseasca ecranul. */
  .battle-stage{padding-top:0;padding-bottom:calc(max(54px,min(64px,7vh)) + env(safe-area-inset-bottom,0px))}
  .battle-title{margin-top:auto}
  .battle-copy{margin-top:0}
}

/* Banda 701-799px inaltime: dansatorul la 45vh plus latimea lui plafonata la
   400px fac continutul mai inalt decat ecranul, asa ca indicatorul "Descopera
   evenimentul" ajungea sub bara portocalie (pe iPhone 14 Pro Max, 430x775,
   intra 10px sub ea). Sub 700px exista deja o regula cu 40vh; aici lipsea.
   41vh elibereaza ~30px, exact cat trebuie ca sagetile sa ramana deasupra. */
@media(max-width:700px) and (min-height:701px) and (max-height:799px){
  .battle-dancer{max-height:min(400px,41vh)}
}

/* Sub 700px inaltime, 40vh lasa continutul cu cativa pixeli peste ecran si
   sagetile ajung lipite de buton. 36vh elibereaza ~25px, cat sa incapa si
   marginea de sub titlu ceruta de "l"-ul din tagline. */
@media(max-width:700px) and (max-height:700px){
  .battle-dancer{max-height:36vh}
}