@font-face{font-family:'Big Sexy Sans';src:url('fonts/BigSexySans.woff2') format('woff2'),url('fonts/BigSexySans.woff') format('woff');font-display:swap;}
@font-face{font-family:'Circular Pro';src:url('fonts/CircularPro-Bold.woff2') format('woff2'),url('fonts/CircularPro-Bold.woff') format('woff');font-weight:700;font-display:swap;}

:root{
  --graublau:#4b5b6d;
  /* Subtle gradient like the «November Tumble» cover: bluish grey, lighter towards bottom right */
  --verlauf:radial-gradient(120% 90% at 100% 100%,rgba(116,126,126,.75) 0%,rgba(116,126,126,0) 60%),linear-gradient(165deg,#4b5b6d 0%,#536478 55%,#566676 100%);
  --rot:#ff0000;
  --rot-hover:#d60000;
  --weiss:#ffffff;
  --pad-x:clamp(20px,4vw,56px);
  --pad-y:clamp(48px,6vw,88px);
  --font-display:'Big Sexy Sans','Archivo',sans-serif;
  --font-body:'GT Alpina','Newsreader',serif;
  --font-ui:'Circular Pro','Archivo',sans-serif;
  --ease:150ms ease;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html,body{margin:0;background:var(--graublau);color:var(--weiss);}
body{background:transparent;}
body::after{content:"";position:fixed;inset:0;z-index:-1;background:var(--verlauf);}
body{font-family:var(--font-ui);font-weight:700;-webkit-font-smoothing:antialiased;}
img{display:block;max-width:100%;}
h2,p{margin:0;}
a{color:inherit;text-decoration:none;transition:color var(--ease),background-color var(--ease),border-color var(--ease),padding var(--ease);}
a:hover{color:var(--rot);}
a:focus-visible{outline:2px solid var(--rot);outline-offset:2px;}
::selection{background:var(--rot);color:var(--weiss);}
section[id]{scroll-margin-top:68px;}

/* Typo */
.h2{font-family:var(--font-display);font-weight:400;font-size:clamp(32px,4vw,56px);line-height:.95;text-transform:uppercase;color:var(--rot);}
.body-lg{font-family:var(--font-body);font-weight:400;font-size:clamp(22px,2.2vw,30px);line-height:1.32;text-wrap:pretty;}
.caps{font-size:14px;letter-spacing:.08em;text-transform:uppercase;}
.label{font-family:var(--font-display);font-weight:400;font-size:16px;text-transform:uppercase;letter-spacing:.08em;}

/* Nav */
.nav{position:sticky;top:0;z-index:5;background:var(--verlauf);background-color:var(--graublau);background-attachment:fixed;display:flex;flex-wrap:nowrap;gap:2px;overflow-x:auto;scrollbar-width:none;}
.nav::-webkit-scrollbar{display:none;}
.nav a{display:flex;align-items:center;}
.nav a:hover{color:var(--weiss);}
.nav__logo{flex:0 0 auto;padding:14px clamp(14px,2.4vw,40px);}
.nav__logo img{height:40px;width:auto;}
.nav__item{flex:1 1 0;min-width:max-content;padding:22px clamp(10px,1.2vw,16px);}
.nav__item:hover,.nav__icon:hover{background:var(--rot);}
.nav__icon{flex:0 0 auto;justify-content:center;padding:12px 22px;}
.nav__contact{flex:0 1 180px;min-width:max-content;padding:22px clamp(12px,1.4vw,18px);background:var(--rot);}
.nav__contact:hover{background:var(--rot-hover);}
.nav__contact .label{flex:1;display:flex;justify-content:space-between;align-items:center;gap:12px;}
.nav__lang{flex:0 0 auto;display:flex;align-items:center;gap:2px;padding:0 clamp(8px,1vw,14px);}
.nav__lang button{border:0;background:none;color:var(--weiss);padding:8px 4px;cursor:pointer;transition:color var(--ease);}
.nav__lang button:hover,.nav__lang button[aria-pressed="true"]{color:var(--rot);}
.nav__lang button:focus-visible{outline:2px solid var(--rot);outline-offset:2px;}
.nav__toggle{display:none;cursor:pointer;flex:0 0 auto;margin-left:auto;align-items:center;justify-content:center;padding:0 clamp(14px,2.4vw,40px);border:0;background:none;color:var(--weiss);font:inherit;transition:background-color var(--ease);}
.nav__toggle:hover{background:var(--rot);}
.nav__toggle:focus-visible{outline:2px solid var(--rot);outline-offset:-2px;}
.nav__toggle-close,.nav.is-open .nav__toggle-open{display:none;}
.nav.is-open .nav__toggle-close{display:block;}

/* Mobile nav: hamburger menu */
@media (max-width:900px){
  .nav{flex-wrap:wrap;overflow:visible;gap:0;}
  .nav.is-open{max-height:100vh;max-height:100dvh;overflow-y:auto;}
  .nav__toggle{display:flex;margin-left:0;order:2;}
  .nav__logo{order:0;}
  .nav__lang{order:1;margin-left:auto;}
  .nav__item,.nav__icon,.nav__contact{order:3;}
  .nav .nav__item,.nav .nav__icon,.nav .nav__contact{display:none;flex:1 0 100%;}
  .nav.is-open .nav__item,.nav.is-open .nav__icon,.nav.is-open .nav__contact{display:flex;}
  .nav__item,.nav__icon{padding:20px var(--pad-x);border-top:2px solid var(--weiss);}
  .nav__item .label{font-size:24px;}
  .nav__icon{justify-content:flex-start;}
  .nav__contact{padding:20px var(--pad-x);}
  .nav__contact .label{font-size:24px;}
}

/* Hero */
.hero{height:clamp(460px,72vw,940px);}
.hero img{width:100%;height:100%;object-fit:cover;object-position:50% 100%;}
/* Desktop: hero fills the screen below the sticky nav (68px) */
@media (min-width:1024px) and (orientation:landscape){
  .hero{height:calc(100vh - 68px);height:calc(100svh - 68px);}
  /* The band sits between 55% and 93% of the (square) photo: keep the window's
     bottom at 97% so feet stay in, but never start below 52% so heads stay in */
  .hero img{object-position:50% max(100vh - 68px - 97vw, -52vw);object-position:50% max(100svh - 68px - 97vw, -52vw);}
}

/* Sections */
.section{padding:var(--pad-y) var(--pad-x);}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:32px clamp(24px,4vw,64px);}
.stack{display:flex;flex-direction:column;}

/* Buttons */
.btns{display:flex;flex-wrap:wrap;gap:12px;}
.btn{display:flex;justify-content:space-between;gap:16px;font-size:16px;}
.btn--red{background:var(--rot);padding:14px 20px;min-width:140px;}
.btn--red:hover{background:var(--rot-hover);color:var(--weiss);}
.btn--outline{border:2px solid var(--weiss);padding:12px 18px;min-width:180px;}
.btn--outline:hover{border-color:var(--rot);}

/* Music */
.music__intro{max-width:30ch;line-height:1.3;}
.music,.about{grid-template-columns:1fr;}
.music__cover{display:block;width:100%;max-width:640px;justify-self:center;}
.music__cover img{width:100%;height:auto;}

/* About */
.about__text{gap:20px;max-width:34ch;justify-self:center;}

/* Photos */
.photos__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px 32px;}
.photos__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:2px;}
.photos__grid a{position:relative;aspect-ratio:1/1;overflow:hidden;}
.photos__grid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}

/* Press kit */
.list{border-top:2px solid var(--weiss);}
.list__row{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;border-bottom:2px solid var(--weiss);font-size:clamp(17px,1.5vw,20px);}
.list__row:hover{padding-left:8px;}
.btn--kit{margin-top:28px;display:flex;justify-content:space-between;align-items:center;gap:16px;background:var(--rot);padding:20px 22px;font-size:clamp(17px,1.5vw,20px);}
.btn--kit:hover{background:var(--rot-hover);color:var(--weiss);}

/* Booking */
.booking__row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;padding:22px 0;border-bottom:2px solid var(--weiss);}
.booking__row:first-child{border-top:2px solid var(--weiss);}
.booking__row .body-lg{line-height:1.2;}
@media (max-width:600px){
  .booking__row{flex-direction:column;align-items:flex-start;}
}

/* Footer */
.footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:32px;padding:clamp(40px,5vw,72px) var(--pad-x);}
.footer__mail{font-family:var(--font-body);font-weight:400;font-size:clamp(26px,3.6vw,48px);line-height:1.1;color:var(--weiss);overflow-wrap:anywhere;}
.footer__mail:hover{color:var(--rot);}
.footer__logo{width:min(100%,280px);height:auto;}
@media (max-width:600px){
  .footer__logo{margin-inline:auto;}
}