@import url("styles-base.css");

/* Mobile-only hero spacing correction */
@media (max-width: 760px) {
  .hero {
    min-height: 0;
    display: block;
    padding-top: 56.25vw;
  }

  .hero-art {
    inset: 0 0 auto;
    height: 56.25vw;
    background-position: center top;
    background-size: 100% auto;
  }

  .hero::after {
    background: linear-gradient(0deg, #fff 0 30%, rgba(255,255,255,.96) 38%, rgba(255,255,255,0) 58%);
  }

  .hero-copy {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 24px 20px 38px;
  }
}

@media (max-width: 430px) {
  .hero { min-height: 0; }
  .hero-art { height: 56.25vw; }
}

/* Chi siamo */
.about-manifesto {
  max-width: 720px;
  margin: 26px 0 32px;
  display: grid;
  gap: 14px;
}

.about-manifesto p {
  margin: 0;
  color: #dbeaff;
  font-size: 15px;
  line-height: 1.75;
}

.about-manifesto .about-final {
  margin-top: 6px;
  padding: 16px 18px;
  border-left: 4px solid #8bc6ff;
  color: #fff;
  background: rgba(255,255,255,.08);
  font-family: "Barlow Condensed", sans-serif;
  font-size: clamp(22px,2.2vw,31px);
  font-weight: 700;
  line-height: 1.05;
  text-transform: uppercase;
}

.about-manifesto .about-final strong {
  color: #8bc6ff;
}

/* Contatti */
.footer-brand-panel {
  width: min(560px,100%);
  min-height: 150px;
  padding: 24px 28px;
  display: flex;
  align-items: center;
  gap: 26px;
  color: #071421;
  background: #fff;
  box-shadow: 0 20px 55px rgba(0,0,0,.28);
}

.footer-brand-panel img {
  width: 190px;
  height: 96px;
  object-fit: contain;
  filter: none;
  mix-blend-mode: normal;
}

.footer-brand-panel span {
  display: block;
  margin-bottom: 5px;
  color: #0b57a3;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.footer-brand-panel p {
  margin: 0;
  color: #071421;
  font-size: 25px;
}

@media (max-width: 760px) {
  .about-manifesto {
    margin: 22px 0 28px;
    gap: 12px;
  }

  .about-manifesto p {
    font-size: 14px;
    line-height: 1.68;
  }

  .footer-brand-panel {
    min-height: 0;
    padding: 22px 20px;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }

  .footer-brand-panel img {
    width: 170px;
    height: auto;
  }

  .footer-brand-panel p {
    font-size: 22px;
  }
}

/* Il Rumore delle Idee */
.music-section{position:relative;overflow:hidden;color:#fff;background:radial-gradient(circle at 11% 16%,rgba(20,107,193,.34),transparent 25%),repeating-linear-gradient(90deg,transparent 0 79px,rgba(255,255,255,.035) 80px),#050c13;isolation:isolate}
.music-section::before{content:"FREQUENZE CLANDESTINE";position:absolute;right:-18px;top:60px;z-index:-1;color:rgba(255,255,255,.035);font:italic 800 clamp(72px,12vw,190px)/.72 "Barlow Condensed",sans-serif;letter-spacing:-.05em;writing-mode:vertical-rl;text-transform:uppercase}
.music-signal{height:28px;display:flex;align-items:center;gap:5px;margin-bottom:32px}.music-signal span{width:4px;height:8px;background:#70b8ff;animation:music-signal 1.15s ease-in-out infinite alternate}.music-signal span:nth-child(2),.music-signal span:nth-child(6){height:20px;animation-delay:-.4s}.music-signal span:nth-child(3),.music-signal span:nth-child(5){height:12px;animation-delay:-.7s}.music-signal span:nth-child(4){height:28px;animation-delay:-.2s}@keyframes music-signal{to{transform:scaleY(.38);opacity:.48}}
.music-heading{display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:end;margin-bottom:44px}.music-section .kicker{color:#70b8ff}.music-heading h2{font-size:clamp(54px,6.7vw,104px);line-height:.76;letter-spacing:-.055em}.music-intro{max-width:480px;margin:0 0 5px;color:#a9bdd0;font-size:14px;line-height:1.75}
.music-layout{display:grid;grid-template-columns:minmax(300px,.67fr) minmax(560px,1.33fr);gap:clamp(18px,3vw,42px);align-items:start}
.music-character{min-height:760px;position:relative;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.46),transparent 45%),#d8e8f6;border:1px solid rgba(255,255,255,.23);box-shadow:0 28px 80px rgba(0,0,0,.3)}
.music-character::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(160deg,transparent 0 17px,rgba(7,20,33,.055) 18px 19px)}
.music-character img{width:112%;height:82%;position:absolute;left:-6%;bottom:-2%;z-index:1;object-fit:contain;object-position:center bottom;filter:contrast(1.06)}
.music-character-copy{position:absolute;inset:26px 22px auto;z-index:2;color:var(--ink)}
.music-label{display:inline-block;margin-bottom:12px;padding:6px 9px;color:#fff;background:var(--blue);font-size:9px;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.music-character-copy .music-alias{display:block;color:#071421;font:italic 800 clamp(58px,5.2vw,84px)/.72 "Barlow Condensed",sans-serif;letter-spacing:-.065em;text-transform:uppercase;text-shadow:3px 3px 0 rgba(255,255,255,.7)}
.music-character-copy p{margin:20px 0 0;padding-left:13px;border-left:4px solid var(--blue);font:800 clamp(21px,2vw,31px)/.9 "Barlow Condensed",sans-serif;text-transform:uppercase}
.music-stamp{position:absolute;right:18px;bottom:18px;z-index:2;color:rgba(7,20,33,.45);font:800 11px/1 "Barlow Condensed",sans-serif;letter-spacing:.16em}
.music-console{min-width:0}.spotify-stage{padding:20px;background:#111b24;border:1px solid rgba(255,255,255,.13);box-shadow:0 24px 60px rgba(0,0,0,.25)}.spotify-stage-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:14px}.spotify-stage-head span{display:block;color:#708ba1;font-size:9px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.spotify-stage-head strong{display:block;margin-top:4px;font:italic 800 clamp(27px,3vw,42px)/.9 "Barlow Condensed",sans-serif;text-transform:uppercase}.spotify-stage-head .spotify-mark{color:#1ed760;font-size:10px}.spotify-stage iframe{display:block;border-radius:12px;background:#121212}
.record-crate{position:relative;margin-top:22px;padding:18px 18px 24px;background:linear-gradient(180deg,#243848,#14232f 12%,#0c151d 100%);border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 -16px 26px rgba(0,0,0,.3),0 18px 50px rgba(0,0,0,.22)}.record-crate::after{content:"";position:absolute;inset:auto 0 0;height:19px;background:linear-gradient(#25445e,#112635);border-top:1px solid rgba(255,255,255,.18)}
.crate-label{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:15px}.crate-label span{font:800 18px/1 "Barlow Condensed",sans-serif;letter-spacing:.08em;text-transform:uppercase}.crate-label small{color:#8299ab;font-size:8px;letter-spacing:.08em;text-transform:uppercase}
.release-picker{display:grid;grid-template-columns:repeat(9,minmax(66px,1fr));gap:7px;align-items:end;padding-top:34px;overflow-x:auto;overflow-y:visible;scrollbar-width:thin}
.release-pick{min-width:66px;height:164px;position:relative;padding:0;border:0;color:#fff;background:none;cursor:pointer;transform-origin:center bottom;transition:transform .3s cubic-bezier(.2,.8,.2,1),filter .25s ease;z-index:1}.release-pick:hover,.release-pick:focus-visible{transform:translateY(-30px) rotate(-1deg);z-index:4;filter:drop-shadow(0 18px 13px rgba(0,0,0,.5));outline:0}.release-pick.is-active{transform:translateY(-16px);z-index:3}.release-pick.is-active .sleeve{box-shadow:0 0 0 3px #70b8ff,0 14px 24px rgba(0,0,0,.4)}
.sleeve{position:absolute;inset:14px 0 0;overflow:hidden;padding:10px 7px;text-align:left;background:#0b57a3;border:1px solid rgba(255,255,255,.3);box-shadow:0 8px 14px rgba(0,0,0,.35);transition:box-shadow .25s ease}.sleeve::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(255,255,255,.09) 11px 12px)}.sleeve small,.sleeve strong{position:relative;z-index:2}.sleeve small{display:block;margin-bottom:12px;font-size:7px;letter-spacing:.08em}.sleeve strong{display:block;font:italic 800 clamp(14px,1.35vw,20px)/.82 "Barlow Condensed",sans-serif;text-transform:uppercase;word-break:normal}.sleeve i{position:absolute;right:-4px;bottom:-12px;color:rgba(255,255,255,.15);font:italic 800 54px/1 "Barlow Condensed",sans-serif}
.vinyl{width:82%;aspect-ratio:1;position:absolute;left:9%;top:1px;border-radius:50%;background:repeating-radial-gradient(circle,#06090b 0 3px,#1d2c36 4px 5px);box-shadow:0 7px 13px rgba(0,0,0,.55);transition:transform .42s cubic-bezier(.2,.8,.2,1)}.vinyl::after{content:"";position:absolute;inset:36%;border-radius:50%;background:#70b8ff;border:3px solid #eaf5ff}.release-pick:hover .vinyl,.release-pick:focus-visible .vinyl{transform:translateY(-27px) rotate(48deg)}
.variant-1 .sleeve{background:linear-gradient(145deg,#126fc0,#06111c)}.variant-1 .sleeve::after{content:"";position:absolute;width:60px;height:60px;right:-22px;top:30px;border:8px solid rgba(255,255,255,.18);border-radius:50%}
.variant-2 .sleeve{background:linear-gradient(25deg,#071421 40%,#b9c9d5)}.variant-2 .sleeve::before{background:repeating-linear-gradient(90deg,transparent 0 12px,rgba(0,0,0,.18) 13px 14px)}
.variant-3 .sleeve{background:linear-gradient(160deg,#0d5f9f,#70b8ff 48%,#071421 49%)}.variant-4 .sleeve{background:repeating-linear-gradient(45deg,#15344e 0 11px,#0b57a3 12px 22px)}.variant-5 .sleeve{background:radial-gradient(circle at 68% 35%,#93ccff 0 17%,transparent 18%),#18364f}.variant-6 .sleeve{background:linear-gradient(115deg,#071421 0 45%,#256fae 46% 58%,#d8e8f6 59%)}.variant-7 .sleeve{background:linear-gradient(20deg,#05080a 48%,#a9bfd1 49% 54%,#174e78 55%)}.variant-8 .sleeve{background:repeating-radial-gradient(circle at 20% 20%,#174e78 0 5px,#071421 6px 15px)}.variant-9 .sleeve{background:linear-gradient(135deg,#dcecf8 0 22%,#0b57a3 23% 48%,#071421 49%)}.variant-9 .sleeve strong,.variant-9 .sleeve small{color:#fff}
.platform-alternative{margin:15px 3px 0;color:#73899c;font-size:10px}.platform-alternative a{color:#a9c9e3;border-bottom:1px solid rgba(169,201,227,.45)}
@media(max-width:1050px){.music-layout{grid-template-columns:1fr}.music-character{min-height:580px}.music-character img{width:70%;height:95%;left:30%}.music-character-copy{max-width:42%}.music-character-copy .music-alias{font-size:clamp(62px,9vw,88px)}}
@media(max-width:760px){.music-signal{margin-bottom:24px}.music-heading{grid-template-columns:1fr;gap:24px;margin-bottom:30px}.music-heading h2{font-size:clamp(56px,18vw,78px)}.music-intro{font-size:13px}.music-character{min-height:510px}.music-character img{width:100%;height:79%;left:9%;bottom:-2%}.music-character-copy{inset:20px 18px auto;max-width:62%}.music-character-copy .music-alias{font-size:clamp(51px,16vw,71px)}.music-character-copy p{font-size:22px}.spotify-stage{padding:12px}.spotify-stage-head{align-items:start}.spotify-stage-head .spotify-mark{margin-top:4px}.spotify-stage iframe{height:352px}.record-crate{padding:15px 10px 22px}.crate-label{align-items:start}.crate-label small{max-width:145px;text-align:right;line-height:1.35}.release-picker{grid-template-columns:repeat(9,92px);gap:8px}.release-pick{height:154px}.sleeve strong{font-size:18px}}
@media(prefers-reduced-motion:reduce){.music-signal span{animation:none}.release-pick,.vinyl{transition:none}.release-pick:hover,.release-pick:focus-visible,.release-pick.is-active{transform:none}.release-pick:hover .vinyl,.release-pick:focus-visible .vinyl{transform:none}}


/* Music layout refinement: records first, compact player */
.music-layout{
  grid-template-columns:minmax(280px,.52fr) minmax(600px,1.48fr);
}
.music-character{
  min-height:650px;
}
.music-character-copy{
  inset:24px 24px auto;
  max-width:88%;
}
.music-character-copy .music-alias{
  font-size:clamp(42px,3.65vw,60px);
  line-height:.78;
  letter-spacing:-.045em;
}
.music-character-copy p{
  display:inline-block;
  margin-top:18px;
  padding:8px 12px;
  border-left:5px solid var(--blue);
  color:#071421;
  background:rgba(255,255,255,.88);
  box-shadow:7px 7px 0 rgba(11,87,163,.16);
  font-size:clamp(21px,1.65vw,27px);
  line-height:.96;
}
.music-character img{
  height:78%;
}
.music-console{
  display:flex;
  min-width:0;
  flex-direction:column;
}
.record-crate{
  order:1;
  margin-top:0;
  padding:22px 22px 30px;
  overflow:visible;
}
.crate-label{
  margin-bottom:20px;
}
.crate-label span{
  font-size:23px;
}
.crate-label small{
  font-size:9px;
}
.release-picker{
  grid-template-columns:repeat(9,minmax(122px,1fr));
  gap:12px;
  align-items:end;
  padding:54px 5px 10px;
  overflow-x:auto;
  overflow-y:visible;
  scroll-snap-type:x proximity;
}
.release-pick{
  min-width:122px;
  height:196px;
  scroll-snap-align:start;
}
.release-pick:hover,
.release-pick:focus-visible{
  transform:translateY(-43px) rotate(-1.5deg) scale(1.045);
}
.release-pick.is-active{
  transform:translateY(-22px);
}
.sleeve{
  inset:16px 0 0;
  padding:13px 10px;
}
.sleeve small{
  margin-bottom:16px;
  font-size:8px;
}
.sleeve strong{
  font-size:clamp(19px,1.55vw,25px);
  line-height:.84;
}
.sleeve i{
  font-size:68px;
}
.vinyl{
  width:86%;
  left:7%;
}
.release-pick:hover .vinyl,
.release-pick:focus-visible .vinyl{
  transform:translateY(-38px) rotate(58deg);
}
.spotify-stage{
  order:2;
  margin-top:28px;
  padding:14px 16px 16px;
}
.spotify-stage-head{
  margin-bottom:10px;
}
.spotify-stage-head strong{
  font-size:clamp(23px,2.2vw,32px);
}
.spotify-stage iframe{
  height:152px;
  border-radius:10px;
}
.platform-alternative{
  order:3;
  margin:18px 4px 0;
  color:#a7bac9;
  font-size:14px;
  line-height:1.5;
}
.platform-alternative a{
  color:#d9edff;
  font-weight:700;
}

@media(max-width:1050px){
  .music-character{
    min-height:540px;
  }
  .music-character-copy{
    max-width:46%;
  }
  .music-character-copy .music-alias{
    font-size:clamp(44px,7vw,62px);
  }
  .music-character-copy p{
    font-size:clamp(20px,3vw,26px);
  }
}

@media(max-width:760px){
  .music-character{
    min-height:470px;
  }
  .music-character-copy{
    max-width:68%;
  }
  .music-character-copy .music-alias{
    font-size:clamp(42px,13vw,58px);
  }
  .music-character-copy p{
    font-size:19px;
  }
  .record-crate{
    padding:18px 12px 27px;
  }
  .crate-label span{
    font-size:21px;
  }
  .release-picker{
    grid-template-columns:repeat(9,116px);
    gap:10px;
    padding-top:50px;
  }
  .release-pick{
    min-width:116px;
    height:188px;
  }
  .sleeve strong{
    font-size:21px;
  }
  .spotify-stage{
    margin-top:22px;
    padding:12px;
  }
  .spotify-stage iframe{
    height:152px;
  }
  .platform-alternative{
    font-size:13px;
  }
}


/* Music identity refinement: claim beside the name, branded shirt */
.music-character-copy{
  inset:24px 22px auto;
  width:calc(100% - 44px);
  max-width:none;
}
.music-brand-lockup{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(118px,.95fr);
  align-items:end;
  gap:14px;
}
.music-brand-lockup .music-alias{
  min-width:0;
}
.music-brand-lockup p{
  display:block;
  align-self:end;
  margin:0 0 3px;
  padding:9px 10px 8px;
  border-left:4px solid var(--blue);
  color:#071421;
  background:rgba(255,255,255,.92);
  box-shadow:6px 6px 0 rgba(11,87,163,.16);
  font-size:clamp(17px,1.35vw,22px);
  line-height:.94;
}
.music-shirt-logo{
  width:56px;
  aspect-ratio:1;
  position:absolute;
  left:50%;
  top:65%;
  z-index:2;
  border-radius:50%;
  background:#fff url("assets/logo.jpg?v=2") center 54%/145% auto no-repeat;
  clip-path:circle(47% at 50% 50%);
  transform:translateX(-50%) rotate(-2deg);
  opacity:.88;
  filter:contrast(1.08) saturate(.9);
  pointer-events:none;
}
@media(max-width:1050px){
  .music-character-copy{
    width:calc(48% - 28px);
    max-width:none;
  }
  .music-brand-lockup{
    grid-template-columns:1fr;
    gap:11px;
  }
  .music-brand-lockup p{
    width:max-content;
    max-width:100%;
    font-size:clamp(18px,2.7vw,23px);
  }
  .music-shirt-logo{
    left:65%;
    top:65%;
  }
}
@media(max-width:760px){
  .music-character-copy{
    width:calc(72% - 22px);
    max-width:none;
  }
  .music-brand-lockup{
    grid-template-columns:minmax(0,1fr) minmax(104px,.78fr);
    gap:10px;
  }
  .music-brand-lockup p{
    width:auto;
    font-size:16px;
  }
  .music-shirt-logo{
    width:50px;
    left:59%;
    top:66%;
  }
}