/* Layout: the postcard turned into a site. Black logo band + coral claim bar + paste-up collage with the cut-out band; below, sabbia "paper" with letter-spaced DejaVu lines between coral rules. Booking sits in the sticky bar and on its own page. Single brand look, no dark mode. */
@font-face{font-family:"NLK Sans";src:url(/fonts/nlk-book.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"NLK Sans";src:url(/fonts/nlk-bold.woff2) format("woff2");font-weight:700;font-display:swap}
:root{
  --corallo:#DA3C2C; --nero:#141414; --sabbia:#ECDCC5; --ivory:#ECE7DA; --panna:#FBF7ED; --bianco:#FFFFFF; --giallo:#FFE500;
  --linea:rgba(20,20,20,.2); --linea-scura:rgba(236,231,218,.22);
  --sans:"NLK Sans","DejaVu Sans",Verdana,"Segoe UI",sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{background:var(--sabbia);color:var(--nero);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--nero)}
a{color:inherit}
:focus-visible{outline:3px solid var(--giallo);outline-offset:3px}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* the postcard voice: bold caps, wide tracking */
.caps{font-weight:700;text-transform:uppercase;letter-spacing:.32em}
.wide{font-weight:700;text-transform:uppercase;letter-spacing:.5em}
h1,h2,h3{margin:0;font-weight:700;text-transform:uppercase;text-wrap:balance;line-height:1.2}
h2{font-size:clamp(22px,2.8vw,32px);letter-spacing:.28em}
h3{font-size:19px;letter-spacing:.14em}
.kicker{display:block;color:var(--corallo);font-weight:700;font-size:19px;letter-spacing:.5em;text-transform:uppercase;text-align:center}
.rule{height:5px;background:var(--corallo);border:0;margin:0 auto;width:min(100%,720px);border-radius:3px}
.center{text-align:center}
.nw{white-space:nowrap;display:inline-block}
@media (max-width:640px){.dot{display:none}.claim .nw,.from .nw{display:block}}
svg.ico{width:48px;height:48px;fill:currentColor;flex:none}
section{scroll-margin-top:70px}

/* bar */
.bar{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--nero);color:var(--ivory)}
.bar .wrap{display:flex;align-items:center;gap:20px;min-height:62px}
.brand svg{display:block;width:130px;height:15px;fill:var(--ivory)}
.bar nav{display:flex;gap:4px;margin-left:auto}
.bar nav a{text-decoration:none;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:10px 10px;border-bottom:3px solid transparent}
.bar nav a:hover{border-bottom-color:var(--corallo)}
.bar nav a[aria-current="page"]{border-bottom-color:var(--corallo)}
.lang{display:flex;gap:10px;font-size:12px;font-weight:700;letter-spacing:.12em}
.lang a{text-decoration:none;opacity:.8}
.book{display:inline-flex;align-items:center;background:var(--corallo);color:var(--bianco);text-decoration:none;font-weight:700;font-size:13px;letter-spacing:.16em;text-transform:uppercase;padding:13px 16px;flex:none}
.book:hover{background:#c2311f}
.menu{display:none;background:none;border:2px solid var(--ivory);color:var(--ivory);font:700 12px var(--sans);letter-spacing:.14em;padding:9px 10px;cursor:pointer}
@media (max-width:1140px){
  .bar nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--nero);flex-direction:column;padding:8px max(16px,env(safe-area-inset-right,0px)) 16px max(16px,env(safe-area-inset-left,0px));border-top:1px solid var(--linea-scura)}
  .bar nav.open{display:flex}
  .bar nav a{padding:14px 0;border-bottom:1px solid var(--linea-scura)}
  .menu{display:inline-block;margin-left:auto}
}
@media (max-width:480px){.lang{display:none}.book{padding:11px 12px;font-size:12px;letter-spacing:.1em}.brand svg{width:112px;height:13px}.bar .wrap{gap:10px}}

/* hero = postcard front */
.strip svg,.field svg,.foot-strip svg{display:block;width:100%;height:100%}
.strip{height:clamp(56px,7vw,110px)}
.logoband{background:var(--nero);padding-block:clamp(22px,4vw,54px)}
.logoband svg{display:block;width:min(78%,1000px);min-width:240px;margin:0 auto;fill:var(--ivory);aspect-ratio:1279/141.3;height:auto}
.claim{background:var(--corallo);color:var(--bianco)}
.claim p{margin:0;padding:16px 8px;text-align:center;font-weight:700;text-transform:uppercase;letter-spacing:.42em;font-size:clamp(14px,1.9vw,22px);line-height:1.5}
.field{position:relative;height:clamp(420px,44vw,640px);overflow:hidden;background:var(--nero)}
.field .bg{position:absolute;inset:0}
.field img{position:absolute;left:50%;bottom:0;transform:translateX(-50%);height:96%;width:auto;max-width:none;filter:drop-shadow(0 0 0 var(--nero)) drop-shadow(3px 0 0 var(--sabbia)) drop-shadow(-3px 0 0 var(--sabbia)) drop-shadow(0 -3px 0 var(--sabbia))}
.d-only{display:block}.m-only{display:none}
@media (max-width:640px){.d-only{display:none}.m-only{display:block}.field{height:auto;aspect-ratio:800/760}.field img{height:auto;width:104%}}

/* intro */
.intro .wrap{padding-block:52px 44px;display:grid;gap:22px;justify-items:center;text-align:center}
.intro h1{font-size:clamp(20px,2.9vw,34px);letter-spacing:.3em}
.intro .from{margin:0;font-size:clamp(14px,1.5vw,18px);letter-spacing:.5em;text-transform:uppercase}
.intro .lead{max-width:40em;margin:6px 0 0}
.quick{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 34px;margin-top:8px;padding-top:22px;border-top:5px solid var(--corallo);width:min(100%,900px)}
.quick .m{font-weight:700;font-size:clamp(20px,2.4vw,28px)}
.quick .m a{text-decoration:none}
.quick .p{font-weight:700;font-size:17px;font-variant-numeric:tabular-nums}
.quick .p a{text-decoration:none}
.quick .p small{display:block;font-weight:400;font-size:13px;letter-spacing:.02em}

/* video */
.video{background:var(--nero);color:var(--ivory)}
.video .wrap{padding-block:56px;display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:32px;align-items:start}
.screen{position:relative;aspect-ratio:16/9;max-width:100%;background:#000;overflow:hidden}
.screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9;transition:opacity .6s}
#poster1{animation:kb 7s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.08) translate(-1.5%,-1%)}}
@media (prefers-reduced-motion:reduce){#poster1{animation:none}}
.screen .live{position:absolute;top:14px;left:16px;background:var(--corallo);color:var(--bianco);font-weight:700;font-size:11px;letter-spacing:.16em;padding:4px 8px}
.screen a.play{position:absolute;inset:0;display:grid;place-items:center;text-decoration:none}
.screen a.play span{width:84px;height:84px;border-radius:50%;background:var(--corallo);display:grid;place-items:center}
.screen a.play span::before{content:"";border-left:26px solid var(--bianco);border-top:16px solid transparent;border-bottom:16px solid transparent;margin-left:7px}
.screen .now{position:absolute;left:0;bottom:0;right:0;padding:14px 18px;background:linear-gradient(transparent,rgba(0,0,0,.85));font-weight:700;letter-spacing:.14em;text-transform:uppercase;font-size:15px}
.playlist h2{color:var(--ivory);font-size:20px}
.playlist ol{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--linea-scura)}
.playlist li button{all:unset;cursor:pointer;display:flex;gap:14px;width:100%;padding:11px 0;border-bottom:1px solid var(--linea-scura);font-size:15px}
.playlist li button:focus-visible{outline:3px solid var(--giallo)}
.playlist li button .n{opacity:.6;font-variant-numeric:tabular-nums;width:2ch}
.playlist li button[aria-current="true"]{color:var(--giallo);font-weight:700}
.playlist .ctrl{display:flex;gap:10px;margin-top:16px}
.btn-line{background:none;border:2px solid var(--ivory);color:var(--ivory);font:700 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:10px 14px;cursor:pointer;text-decoration:none;display:inline-block}
.btn-line.dark{border-color:var(--nero);color:var(--nero)}
@media (max-width:860px){.video .wrap{grid-template-columns:1fr}}

/* credentials */
.cred .wrap{padding-block:56px;display:grid;gap:26px}
.cred .big{font-size:clamp(24px,3.6vw,44px);letter-spacing:.14em;text-align:center}
.cred .big em{font-style:normal;color:var(--corallo)}
.stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;border-top:2px solid var(--nero);border-bottom:2px solid var(--nero)}
.stage{padding:22px 20px;display:flex;gap:16px;align-items:flex-start;min-width:0}
.stage + .stage{border-left:1px solid var(--linea)}
.stage .y{display:block;font-weight:700;font-size:28px;letter-spacing:.06em;font-variant-numeric:tabular-nums;line-height:1}
.stage h3{margin-top:8px;font-size:15px;letter-spacing:.12em}
.stage p{margin:4px 0 0;font-size:15px}
@media (max-width:820px){.stages{grid-template-columns:1fr}.stage + .stage{border-left:0;border-top:1px solid var(--linea)}}

/* where we play (postcard copy) */
.where .wrap{padding-block:52px;display:grid;gap:20px;justify-items:center;text-align:center}
.where ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.where li{font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:clamp(14px,1.55vw,18px)}
.where li span:not(:last-child)::after{content:"·";margin:0 .7em;}
.where li span{white-space:nowrap;display:inline-block}

/* dates */
.dates .wrap{padding-block:52px}
.dates ol{list-style:none;margin:24px 0 0;padding:0;border-top:2px solid var(--nero)}
.dates li{display:grid;grid-template-columns:220px minmax(0,1fr) auto;gap:20px;align-items:center;padding:16px 0;border-bottom:1px solid var(--linea)}
.dates .d{font-weight:700;font-size:22px;letter-spacing:.08em;text-transform:uppercase;font-variant-numeric:tabular-nums;white-space:nowrap}
.dates .e{font-weight:700;font-size:17px}
.dates .e small{display:block;font-weight:400;font-size:15px}
.dates .c{font-weight:700;font-size:12px;letter-spacing:.14em;border:2px solid var(--nero);padding:5px 8px}
.dates li.past{opacity:.55}
.dates li.past .d::after{content:"Played";display:table;margin-top:6px;font-size:11px;letter-spacing:.14em;background:var(--nero);color:var(--sabbia);padding:3px 6px;vertical-align:middle}
.dates .more{margin-top:22px}
.empty{padding:20px 0}
@media (max-width:600px){.dates li{grid-template-columns:1fr auto;gap:4px 12px}.dates .d{grid-column:1/-1;font-size:19px}}

/* live photos */
.photos .wrap{padding-block:52px}
.grid4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:26px}
.grid4 figure,.gallery figure{margin:0;min-width:0}
.grid4 img{display:block;width:100%;max-width:100%;aspect-ratio:4/5;object-fit:cover}
figcaption{font-size:14px;padding-top:8px}
figcaption b{font-weight:700;text-transform:uppercase;letter-spacing:.08em;font-size:13px}
@media (max-width:820px){.grid4{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* event pages */
.events{background:var(--panna)}
.events .wrap{padding-block:52px}
.events .cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px;margin-top:26px}
.events h3{padding-bottom:10px;border-bottom:3px solid var(--nero)}
.events ul{list-style:none;margin:0;padding:0}
.events li a{display:flex;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid var(--linea);text-decoration:none;font-weight:700;font-size:15px}
.events li a::after{content:"→";color:var(--corallo)}
.events li a:hover{color:var(--corallo)}
@media (max-width:700px){.events .cols{grid-template-columns:1fr}}

/* instagram */
.ig .wrap{padding-block:52px}
.ig .head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:14px}
.ig .tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin-top:22px}
.ig .tiles a{display:block;aspect-ratio:1;overflow:hidden;max-width:100%}
.ig .tiles img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s}
.ig .tiles a:hover img{transform:scale(1.05)}
.ig .tiles a{position:relative}.ig .tiles a.v::after{content:"";position:absolute;top:8px;right:8px;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent #fff;filter:drop-shadow(0 0 3px rgba(0,0,0,.6))}
@media (max-width:700px){.ig .tiles{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* inner pages */
.pagehead{background:var(--nero);color:var(--ivory)}
.pagehead .wrap{padding-block:46px 40px;text-align:center}
.pagehead h1{font-size:clamp(26px,4vw,46px);letter-spacing:.3em}
.pagehead p{margin:14px auto 0;max-width:40em;opacity:.9}
.band4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:8px}
.band4 figure{margin:0;min-width:0}
.band4 img{display:block;width:100%;max-width:100%;aspect-ratio:4/5;object-fit:cover}
.band4 figcaption{display:flex;gap:12px;align-items:center;padding-top:12px}
.band4 .n{display:block;font-weight:700;font-size:20px;letter-spacing:.2em;text-transform:uppercase}
.band4 .r{display:block;font-size:14px;font-weight:700;letter-spacing:.04em}
.crew{margin-top:34px;border-top:5px solid var(--corallo);padding-top:20px;display:flex;flex-wrap:wrap;gap:12px 36px;align-items:baseline}
.crew .k{font-weight:700;letter-spacing:.4em;text-transform:uppercase;font-size:14px}
.crew b{font-weight:700}
@media (max-width:820px){.band4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.pad{padding-block:52px}
.gallery{columns:3 280px;column-gap:10px;margin-top:26px}
.gallery figure{break-inside:avoid;margin-bottom:12px}
.gallery img{display:block;width:100%;height:auto;max-width:100%}
.dl{list-style:none;margin:24px 0 0;padding:0;border-top:2px solid var(--nero)}
.dl li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;padding:16px 0;border-bottom:1px solid var(--linea)}
.dl b{display:block;font-size:16px}
.dl small{font-size:14px}
.dl .f{font-weight:700;font-size:12px;letter-spacing:.14em;border:2px solid var(--nero);padding:5px 8px;white-space:nowrap}
.dl .btn-line{white-space:nowrap}
@media (max-width:600px){.dl li{grid-template-columns:1fr auto}.dl .f{display:none}}
.tbc{display:inline-block;border:2px dashed var(--nero);font-weight:700;font-size:12px;letter-spacing:.06em;padding:1px 7px}
.contact .mail{font-weight:700;font-size:clamp(28px,5.4vw,60px);margin:14px 0 0;word-break:break-word;text-align:center}
.contact .mail a{text-decoration:none;border-bottom:5px solid var(--corallo)}
.ppl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:40px;text-align:center}
.ppl .role{display:block;font-size:15px}
.ppl .who{display:block;font-weight:700;font-size:clamp(20px,2.4vw,28px);font-variant-numeric:tabular-nums;margin-top:4px}
.ppl a{text-decoration:none}
.bookform{display:grid;gap:14px;max-width:780px;margin:20px auto 0;text-align:left}
.bookform .row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.bookform label{display:grid;gap:6px;font-weight:700;font-size:13px;letter-spacing:.04em}
.bookform input,.bookform select,.bookform textarea{font:400 16px var(--sans);padding:11px 12px;border:2px solid var(--nero);background:var(--panna);color:var(--nero);border-radius:0;width:100%}
.bookform button{justify-self:start;border:0;cursor:pointer}
.formmsg{margin:0;font-weight:700}
.or{text-align:center;margin:34px 0 0;font-size:14px;letter-spacing:.2em;text-transform:uppercase}
@media (max-width:600px){.bookform .row2{grid-template-columns:1fr}}
.agencies{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:44px}
.agency{border:3px solid var(--nero);padding:22px;display:grid;gap:6px;justify-items:center;text-align:center;background:var(--panna);min-width:0}
.agency b{font-size:16px}
.agency a{text-decoration:none;font-weight:700}
.aglogo{height:52px;width:auto;margin:8px 0 4px}
@media (max-width:700px){.agencies{grid-template-columns:1fr}}
.copy{justify-self:center;background:none;border:2px solid var(--nero);font:700 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:9px 12px;cursor:pointer;margin:16px auto 0;display:block}
@media (max-width:640px){.ppl{grid-template-columns:1fr}}

/* footer */
footer{background:var(--nero);color:var(--ivory)}
.foot-strip{height:56px}
footer .wrap{padding-block:34px;display:grid;grid-template-columns:auto 1fr auto;gap:24px 40px;align-items:center}
footer .k{display:block;font-weight:700;letter-spacing:.32em;text-transform:uppercase;font-size:12px;margin-bottom:10px}
.social{display:flex;gap:12px}
.social a{display:grid;place-items:center;width:46px;height:46px;border:2px solid var(--ivory);text-decoration:none}
.social a:hover{background:var(--ivory);color:var(--nero)}
.social svg{width:22px;height:22px;fill:currentColor}
.partner img{display:block;height:46px;width:auto}
.forg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 36px;min-width:0}
.forg ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.forg a{text-decoration:none;font-size:13px;opacity:.9}
.forg a:hover{color:var(--giallo)}
@media (max-width:700px){.forg{grid-template-columns:1fr}}
footer .legal{grid-column:1/-1;border-top:1px solid var(--linea-scura);padding-top:18px;font-size:13px;opacity:.8;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
@media (max-width:700px){footer .wrap{grid-template-columns:1fr}}


/* booked-by marquee */
.booked{background:var(--panna);border-top:2px solid var(--nero);border-bottom:2px solid var(--nero);overflow:hidden}
.booked .wrap{padding-block:40px 18px;display:grid;gap:8px;justify-items:center;text-align:center}
.booked .sub{margin:0;font-size:15px}
.marquee{overflow:hidden;padding-block:16px 34px;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.track{display:flex;gap:14px;width:max-content;animation:roll 140s linear infinite}
.track.rev{animation-direction:reverse;margin-top:14px;animation-duration:170s}
.marquee:hover .track,.marquee:focus-within .track{animation-play-state:paused}
@keyframes roll{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.track{animation:none}.marquee{overflow-x:auto}}
.logo-tile{flex:none;display:grid;place-items:center;width:150px;height:96px;padding:6px;text-decoration:none}
.logo-tile{overflow:hidden}
.logo-tile img{max-width:136px;max-height:80px;width:auto;height:auto;display:block;object-fit:contain;mix-blend-mode:multiply}
.logo-tile:hover{transform:translateY(-3px)}
.logo-tile.dark{background:var(--nero)}
.logo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-top:22px}
.logo-grid .logo-tile{width:auto}
.bio{margin:8px 0 0;font-size:14px;line-height:1.55}
.band4 img.pg{display:none}
:root[data-portrait="grey"] .band4 img.pg{display:block}
:root[data-portrait="grey"] .band4 img.pc{display:none}
.num{position:absolute;left:0;top:0;background:var(--corallo);color:var(--bianco);font-weight:700;font-size:13px;padding:3px 7px}
.gallery figure{position:relative}
.videolist li button img{width:96px;height:54px;object-fit:cover;flex:none;display:block}
.videolist li button{align-items:center}


/* production additions */
html,body{margin:0}
.band4 img{height:auto}
.screen iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:2}
.screen .sound{position:absolute;right:14px;top:12px;z-index:3;background:var(--corallo);color:var(--bianco);border:0;font:700 12px var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:8px 11px;cursor:pointer}
.screen .sound[hidden]{display:none}
.screen.playing .live{display:none}
.hp{position:absolute;left:-9999px}
.forg span{font-size:13px;opacity:.9}
.err{max-width:760px;margin:0 auto;text-align:center}
.err .big{font-size:clamp(70px,14vw,160px);font-weight:700;color:var(--corallo);letter-spacing:.1em;line-height:1;margin:0}
@media (min-width:701px) and (max-width:1100px){footer .wrap{grid-template-columns:1fr 1fr}footer .forg{grid-column:1/-1;order:-1}}
.forg .k{letter-spacing:.24em}
.btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:26px}