/*
Theme Name: MOJOTEK Web Radio
Description: Version propre codée d'après le visuel MOJOTEK validé.
Version: 3.0
*/
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600;700&display=swap');

:root{--cream:#f2dfb4;--amber:#c58a45;--black:#070706}
*{box-sizing:border-box} html,body{margin:0;background:#050504;color:#f5ead0;font-family:Arial,sans-serif}
body{min-height:100vh}
.site-shell{position:relative;isolation:isolate;width:100%;min-height:100vh;background:#070706;overflow:hidden}
.vinyl-patina{position:absolute;inset:0;z-index:100;pointer-events:none;background:url("assets/patine-vinyle.png") center/100% 100% no-repeat;opacity:.72;mix-blend-mode:screen}
.vinyl-patina:after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='540' height='540'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.018 .105' numOctaves='4' seed='31'/%3E%3CfeColorMatrix values='.58 0 0 0 .18 0 .43 0 0 .12 0 0 .26 0 .06 0 0 0 .34 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.22;mix-blend-mode:screen}

.top{position:relative;height:164px;z-index:30;background:#080807}
.top:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(218,171,103,.38)}
.nav{position:absolute;bottom:0;height:72px;display:flex;align-items:center;gap:48px;font-family:Oswald,sans-serif;font-size:20px;letter-spacing:.12em;z-index:35}
.nav a{color:#f3ead8;text-decoration:none}.nav a:hover{color:#fff}.nav span{color:#b98a51;font-weight:300}
.nav-left{left:12.4%}.nav-right{right:11.6%}
.nav-left a:first-child{position:relative;font-weight:500}.nav-left a:first-child:after{content:"";position:absolute;left:0;right:0;bottom:-14px;height:3px;background:#eee5d3}
.socials{position:absolute;right:5.3%;top:40px;display:flex;gap:26px;z-index:40}
.socials a{font-size:30px;color:white;text-decoration:none;font-weight:700}
.brand{position:absolute;left:50%;top:12px;transform:translateX(-50%);width:235px;height:220px;z-index:50;pointer-events:none;overflow:visible}
.brand img{width:100%;height:100%;object-fit:contain;display:block;background:transparent}

.hero{position:relative;height:430px;z-index:20;overflow:hidden;background:#080706}
.hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 53%;filter:saturate(.94) contrast(1.05)}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,4,3,.96) 0%,rgba(4,4,3,.78) 28%,rgba(4,4,3,.25) 49%,rgba(4,4,3,.02) 72%,rgba(4,4,3,.13) 100%),linear-gradient(180deg,rgba(0,0,0,.13),rgba(0,0,0,.04) 67%,rgba(0,0,0,.30))}
.hero-copy{position:absolute;left:6.6%;top:66px;z-index:3}
.hero-copy h1,.hero-copy h2{font-family:Oswald,sans-serif;margin:0;color:#f2dfb7;text-shadow:0 2px 1px #000}
.hero-copy h1{font-size:108px;line-height:.92;font-weight:700;letter-spacing:.025em}
.hero-copy h2{font-size:45px;line-height:1;margin:11px 0 22px 105px;letter-spacing:.20em;font-weight:600}
.rule{width:550px;height:2px;background:rgba(240,234,216,.86);margin-bottom:14px}
.genres{display:flex;align-items:center;gap:20px;font-family:Oswald,sans-serif;font-size:18px;letter-spacing:.13em;white-space:nowrap}
.genres b{font-size:13px}.genre-wave{display:inline-block;transform-origin:50% 70%}
.genre-wave:hover{animation:wave .62s ease-in-out infinite}
@keyframes wave{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-4px) rotate(-1.5deg)}50%{transform:translateY(2px) rotate(1.2deg)}75%{transform:translateY(-2px) rotate(-.7deg)}}
.listen{margin:25px 0 0 90px;width:368px;height:48px;border:0;background:#f1dfb7;color:#111;font-family:Oswald,sans-serif;font-weight:600;letter-spacing:.25em;font-size:17px;cursor:pointer;box-shadow:0 0 22px rgba(220,173,99,.12)}
.listen span{font-size:19px;margin-right:20px}
.slogan{position:absolute;right:4.3%;top:65px;z-index:3;border-left:2px solid rgba(244,238,222,.92);padding-left:22px;font-family:Oswald,sans-serif;letter-spacing:.12em;font-size:20px;line-height:1.5}
.slogan p{margin:54px 0 0}.slogan em{display:block;width:20px;height:2px;background:#eee1c6;margin-top:16px}

.cards{position:relative;z-index:22;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding:0 2.7%;height:330px;background:#070706}
.card{position:relative;overflow:hidden;color:white;text-decoration:none;border:1px solid rgba(191,135,71,.45)}
.card img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.92) contrast(1.04)}
.card-fade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 37%,rgba(0,0,0,.25) 58%,rgba(4,4,3,.94) 100%)}
.card-copy{position:absolute;left:28px;right:20px;bottom:18px}
.card h3{font-family:Oswald,sans-serif;font-weight:400;font-size:24px;letter-spacing:.02em;margin:0}.card u{display:block;width:37px;height:2px;background:white;text-decoration:none;margin:8px 0 18px}
.card p{font-size:16px;line-height:1.42;margin:0}.card:hover img{transform:scale(1.018);transition:.35s ease}

.player{position:relative;z-index:40;height:100px;display:flex;align-items:center;gap:30px;padding:0 6.5%;background:#070706}
.onair{font-family:Oswald,sans-serif;font-size:25px;color:#ff2b24;border:2px solid #ff2b24;padding:7px 12px;box-shadow:0 0 14px rgba(255,30,25,.72),inset 0 0 10px rgba(255,30,25,.22)}
.divider{width:2px;height:48px;background:#eee8d8}.now{width:38%;position:relative}.now small{display:block;color:#ff3128;font-weight:700;margin-bottom:7px}.now span{font-size:18px}.now i{position:absolute;left:0;right:0;bottom:-15px;height:2px;background:linear-gradient(90deg,#eee9dc 0 53%,#444 53%)}
.eq{height:48px;display:flex;align-items:flex-end;gap:4px}.eq b{display:block;width:3px;background:#e8d6a8;animation:eq 1s ease-in-out infinite alternate}.eq b:nth-child(1){height:17px}.eq b:nth-child(2){height:29px;animation-delay:.1s}.eq b:nth-child(3){height:39px;animation-delay:.2s}.eq b:nth-child(4){height:25px;animation-delay:.3s}.eq b:nth-child(5){height:44px;animation-delay:.4s}.eq b:nth-child(6){height:32px;animation-delay:.5s}@keyframes eq{to{height:12px}}
.round{width:64px;height:64px;border-radius:50%;border:2px solid #eee6d3;background:transparent;color:white;font-size:24px;cursor:pointer}.volume{display:flex;align-items:center;gap:16px;flex:1}.volume input{width:100%;accent-color:#ead9b3}.icon-btn{border:0;background:transparent;color:#f2e5c8;font-size:30px;cursor:pointer}

.modal{position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.78);display:none;place-items:center}.modal.open{display:grid}.modal-box{position:relative;width:min(520px,88vw);padding:38px;background:#0b0a08;border:1px solid #9f7140;text-align:center;box-shadow:0 20px 70px #000}.close{position:absolute;right:12px;top:8px;background:none;border:0;color:#e7d1a5;font-size:28px;cursor:pointer}.about-logo{width:115px;height:auto;margin:0 auto 22px;display:block}.modal-box h2{font-family:Oswald,sans-serif;letter-spacing:.12em}.modal-box p{line-height:1.65;color:#e9ddc6}

.emissions-only{overflow:hidden}.emissions-shell{height:100vh}.emissions-page{position:relative;z-index:25;height:100vh;padding:42px 7%;text-align:center}.emissions-page h1{font:600 56px Oswald,sans-serif;letter-spacing:.08em;margin:0}.em-intro{color:#d5c19a}.future-sounds{width:min(860px,90vw);height:430px;margin:25px auto 20px;display:flex;align-items:center;justify-content:center;gap:55px;background:radial-gradient(circle at 25% 40%,rgba(121,73,33,.25),transparent 30%),#0b0907;border:1px solid rgba(177,126,70,.4)}
.vinyl-visual{width:310px;height:250px;position:relative}.disc{position:absolute;width:220px;height:220px;border-radius:50%;left:10px;top:15px;background:repeating-radial-gradient(circle,#111 0 5px,#1b1712 6px 7px);box-shadow:0 0 35px #000}.disc:after{content:"";position:absolute;width:58px;height:58px;border-radius:50%;background:#b97a37;left:81px;top:81px}.tonearm{position:absolute;width:150px;height:10px;background:#8b6846;right:-18px;top:58px;transform:rotate(38deg);transform-origin:right center}
.future-copy{text-align:left;max-width:340px}.future-copy small{color:#b98a51;letter-spacing:.22em}.future-copy strong{display:block;font:500 38px Oswald,sans-serif;color:#f0dbb0;margin:12px 0}.future-copy p{line-height:1.6;color:#cdbb9b}.back{color:#e9d5ac;text-decoration:none;font:400 17px Oswald,sans-serif;letter-spacing:.1em}

@media(max-width:1000px){
 .top{height:150px}.nav{font-size:16px;gap:20px}.nav-left{left:4%}.nav-right{right:4%}.brand{width:190px;height:190px}
 .hero{height:470px}.hero-copy{left:5%;top:90px}.hero-copy h1{font-size:76px}.hero-copy h2{font-size:32px;margin-left:70px}.rule{width:430px}.genres{font-size:14px;gap:10px}.listen{margin-left:40px}
 .cards{height:auto;grid-template-columns:repeat(2,1fr);padding:15px 4%;}.card{height:280px}.player{position:sticky;bottom:0;padding:0 3%;gap:15px}.slogan{display:none}
}
@media(max-width:650px){
 .nav{display:none}.socials{right:6%}.brand{left:32%;width:170px;height:170px}
 .hero-copy h1{font-size:58px}.hero-copy h2{font-size:25px;margin-left:35px}.rule{width:88vw}.genres{flex-wrap:wrap;width:88vw}.listen{margin-left:0;width:300px}
 .cards{grid-template-columns:1fr}.card{height:260px}.player{height:88px}.now{width:45%}.volume,.eq,.icon-btn{display:none}
 .future-sounds{height:auto;min-height:480px;flex-direction:column;padding:30px}.future-copy{text-align:center}
}


/* ============================================================
   CORRECTION FINALE : AUCUN TRAIT + PATINE VINYLE BIEN VISIBLE
   ============================================================ */

/* Supprime explicitement TOUS les séparateurs artificiels */
.top:after,.top:before,
header:after,header:before,
.hero:after,.hero:before,
.cards:after,.cards:before,
main:after,main:before{
  content:none!important;
  display:none!important;
  border:0!important;
  background:none!important;
  box-shadow:none!important;
}
.top,.hero,.cards,main{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}

/* Une seule surface continue */
.site-shell{
  background:#070706!important;
}

/* Patine visible sur TOUT le site, y compris images et cartes */
.vinyl-patina{
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:900!important;
  pointer-events:none!important;
  opacity:1!important;
  background:
    url("assets/patine-vinyle.png") center/100% 100% no-repeat!important;
  mix-blend-mode:screen!important;
}

/* Micro-craquelures et griffures irrégulières */
.vinyl-patina:after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  opacity:.48!important;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='560'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .092' numOctaves='5' seed='71'/%3E%3CfeColorMatrix values='.66 0 0 0 .20 0 .48 0 0 .13 0 0 .29 0 .07 0 0 0 .48 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")!important;
  background-size:560px 560px!important;
  mix-blend-mode:screen!important;
  -webkit-mask-image:radial-gradient(ellipse at center,rgba(0,0,0,.34) 0%,rgba(0,0,0,.52) 58%,#000 100%)!important;
  mask-image:radial-gradient(ellipse at center,rgba(0,0,0,.34) 0%,rgba(0,0,0,.52) 58%,#000 100%)!important;
}

/* Usure crème/brun irrégulière aux quatre bords */
.site-shell:after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:901!important;
  pointer-events:none!important;
  border:0!important;
  outline:0!important;
  box-shadow:
    inset 15px 0 18px -11px rgba(239,197,128,.76),
    inset -15px 0 18px -11px rgba(239,197,128,.73),
    inset 0 15px 18px -11px rgba(239,197,128,.70),
    inset 0 -15px 18px -11px rgba(239,197,128,.70)!important;
  background:
    radial-gradient(ellipse at 0 0,rgba(246,208,143,.72),rgba(188,128,67,.26) 3%,transparent 9%),
    radial-gradient(ellipse at 100% 0,rgba(242,203,138,.69),rgba(184,124,65,.25) 3%,transparent 9%),
    radial-gradient(ellipse at 0 100%,rgba(239,199,134,.66),rgba(180,121,63,.24) 3%,transparent 9.3%),
    radial-gradient(ellipse at 100% 100%,rgba(241,201,136,.68),rgba(182,123,64,.25) 3%,transparent 9.3%),
    radial-gradient(ellipse at 0 31%,rgba(210,157,91,.25),transparent 5.7%),
    radial-gradient(ellipse at 100% 67%,rgba(207,154,88,.24),transparent 5.7%)!important;
}

/* Logo toujours au-dessus, entier, sans fond et non cliquable */
.brand{z-index:950!important;overflow:visible!important;pointer-events:none!important}
.brand img{
  object-fit:contain!important;
  clip-path:none!important;
  mask:none!important;
  -webkit-mask:none!important;
  background:transparent!important;
}


/* ============================================================
   SEULES MODIFICATIONS :
   1. PLAYER FIXE
   2. BORDS PLUS "VINYLE UN PEU USÉ"
   ============================================================ */

/* Player réellement fixé au viewport */
.player{
  position:fixed!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  width:100%!important;
  z-index:2000!important;
  margin:0!important;
}

/* Réserve l'espace du player pour ne rien masquer en bas */
.site-shell{
  padding-bottom:100px!important;
}
@media(max-width:650px){
  .site-shell{padding-bottom:88px!important}
}

/* On conserve le dégradé actuel, avec une usure vinyle plus organique */
.site-shell:after{
  z-index:901!important;
  background:
    /* petits frottements irréguliers aux angles */
    radial-gradient(ellipse at 1% 2%,rgba(246,211,148,.72) 0 1.1%,rgba(196,137,74,.35) 1.8%,transparent 6.8%),
    radial-gradient(ellipse at 99% 2%,rgba(242,205,142,.68) 0 1.0%,rgba(191,132,71,.33) 1.8%,transparent 6.7%),
    radial-gradient(ellipse at 1% 98%,rgba(238,201,137,.64) 0 1.0%,rgba(185,127,68,.31) 1.8%,transparent 6.9%),
    radial-gradient(ellipse at 99% 98%,rgba(240,203,139,.66) 0 1.0%,rgba(188,129,69,.32) 1.8%,transparent 6.9%),

    /* petites zones usées le long des bords */
    radial-gradient(ellipse at 0% 19%,rgba(219,169,101,.31),transparent 3.4%),
    radial-gradient(ellipse at 0% 46%,rgba(207,156,91,.25),transparent 2.8%),
    radial-gradient(ellipse at 0% 77%,rgba(216,164,97,.29),transparent 3.2%),
    radial-gradient(ellipse at 100% 28%,rgba(216,165,98,.29),transparent 3.2%),
    radial-gradient(ellipse at 100% 57%,rgba(204,153,88,.24),transparent 2.8%),
    radial-gradient(ellipse at 100% 82%,rgba(214,162,95,.28),transparent 3.1%),
    radial-gradient(ellipse at 18% 0%,rgba(211,160,94,.27),transparent 3.0%),
    radial-gradient(ellipse at 43% 0%,rgba(201,149,85,.22),transparent 2.6%),
    radial-gradient(ellipse at 72% 0%,rgba(210,158,92,.25),transparent 2.9%),
    radial-gradient(ellipse at 26% 100%,rgba(207,155,89,.24),transparent 2.8%),
    radial-gradient(ellipse at 61% 100%,rgba(199,147,83,.21),transparent 2.5%),
    radial-gradient(ellipse at 83% 100%,rgba(211,159,93,.25),transparent 2.9%)!important;

  /* garde le dégradé doux déjà validé */
  box-shadow:
    inset 15px 0 18px -11px rgba(239,197,128,.70),
    inset -15px 0 18px -11px rgba(239,197,128,.68),
    inset 0 15px 18px -11px rgba(239,197,128,.65),
    inset 0 -15px 18px -11px rgba(239,197,128,.65)!important;
}

/* Micro-rayures / craquelures davantage concentrées vers les bords */
.vinyl-patina:before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  pointer-events:none!important;
  opacity:.34!important;
  background-image:
    repeating-linear-gradient(101deg,
      transparent 0 43px,
      rgba(231,190,123,.18) 44px,
      transparent 45px 118px),
    repeating-linear-gradient(7deg,
      transparent 0 79px,
      rgba(208,160,97,.13) 80px,
      transparent 81px 151px)!important;
  -webkit-mask-image:radial-gradient(ellipse at center,transparent 0 62%,rgba(0,0,0,.30) 75%,#000 100%)!important;
  mask-image:radial-gradient(ellipse at center,transparent 0 62%,rgba(0,0,0,.30) 75%,#000 100%)!important;
}

/* La patine ne doit jamais recouvrir les commandes du player */
.player{
  isolation:isolate!important;
}


/* ============================================================
   MOJOTEK — ONE PAGE DESKTOP
   Tout l'accueil tient dans la hauteur de l'écran.
   ============================================================ */
@media (min-width:1001px){
  html,body{
    width:100%!important;
    height:100%!important;
    overflow:hidden!important;
  }
  .site-shell{
    width:100vw!important;
    height:100vh!important;
    min-height:100vh!important;
    padding-bottom:82px!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-rows:128px minmax(280px,1.35fr) minmax(205px,.85fr)!important;
  }

  .top{
    height:128px!important;
    min-height:128px!important;
  }
  .brand{
    top:2px!important;
    width:190px!important;
    height:176px!important;
  }
  .nav{
    bottom:0!important;
    height:56px!important;
    font-size:17px!important;
  }
  .socials{
    top:28px!important;
  }

  main{
    min-height:0!important;
    display:contents!important;
  }
  .hero{
    height:auto!important;
    min-height:0!important;
  }
  .hero-copy{
    top:clamp(30px,5vh,58px)!important;
  }
  .hero-copy h1{
    font-size:clamp(72px,6.7vw,104px)!important;
  }
  .hero-copy h2{
    font-size:clamp(31px,3vw,44px)!important;
    margin-top:8px!important;
    margin-bottom:16px!important;
  }
  .rule{margin-bottom:11px!important}
  .listen{
    margin-top:18px!important;
    height:44px!important;
  }
  .slogan{
    top:clamp(35px,5vh,60px)!important;
  }
  .slogan p{
    margin-top:38px!important;
  }

  .cards{
    height:auto!important;
    min-height:0!important;
    padding:0 2.7% 8px!important;
    gap:22px!important;
  }
  .card{
    min-height:0!important;
    height:100%!important;
  }
  .card-copy{
    bottom:14px!important;
  }
  .card u{
    margin:6px 0 10px!important;
  }

  .player{
    height:82px!important;
    min-height:82px!important;
  }
}

/* Sur les écrans peu hauts, on compacte encore sans supprimer de contenu. */
@media (min-width:1001px) and (max-height:780px){
  .site-shell{
    grid-template-rows:112px minmax(245px,1.28fr) minmax(175px,.72fr)!important;
    padding-bottom:74px!important;
  }
  .top{height:112px!important;min-height:112px!important}
  .brand{width:168px!important;height:158px!important;top:-2px!important}
  .nav{height:48px!important;font-size:15px!important}
  .socials{top:20px!important}
  .hero-copy{top:24px!important}
  .hero-copy h1{font-size:70px!important}
  .hero-copy h2{font-size:29px!important;margin:5px 0 10px 70px!important}
  .rule{width:455px!important;margin-bottom:8px!important}
  .genres{font-size:14px!important}
  .listen{height:39px!important;margin-top:12px!important}
  .slogan{top:25px!important;font-size:17px!important}
  .slogan p{margin-top:28px!important}
  .card h3{font-size:20px!important}
  .card p{font-size:13px!important}
  .player{height:74px!important;min-height:74px!important}
}

/* Mobile/tablette : garde un défilement normal plutôt que d'écraser le contenu. */
@media (max-width:1000px){
  html,body{overflow-x:hidden!important;overflow-y:auto!important}
  .site-shell{height:auto!important;min-height:100vh!important}
}


/* ============================================================
   ÉMISSIONS UNIQUEMENT — CENTRAGE + TYPO SANS CHEVAUCHEMENT
   Aucun autre élément du site n'est modifié.
   ============================================================ */
.emissions-only .emissions-shell{
  width:100vw!important;
  height:100vh!important;
  min-height:100vh!important;
  padding:0!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.emissions-only .emissions-page{
  position:relative!important;
  z-index:25!important;
  width:min(1000px,92vw)!important;
  height:auto!important;
  min-height:0!important;
  padding:28px 40px!important;
  margin:0 auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}
.emissions-only .emissions-page h1{
  margin:0 0 8px!important;
  padding:0!important;
  font-family:Oswald,sans-serif!important;
  font-size:clamp(38px,5vh,56px)!important;
  line-height:1.05!important;
  letter-spacing:.08em!important;
  white-space:normal!important;
}
.emissions-only .em-intro{
  margin:0 0 18px!important;
  line-height:1.35!important;
}
.emissions-only .future-sounds{
  width:min(860px,88vw)!important;
  height:min(430px,52vh)!important;
  min-height:300px!important;
  margin:0 auto 18px!important;
  padding:24px 34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:45px!important;
  overflow:hidden!important;
}
.emissions-only .vinyl-visual{
  flex:0 0 300px!important;
  width:300px!important;
  height:240px!important;
}
.emissions-only .future-copy{
  flex:0 1 350px!important;
  width:auto!important;
  max-width:350px!important;
  min-width:0!important;
  text-align:left!important;
}
.emissions-only .future-copy small{
  display:block!important;
  margin:0 0 10px!important;
  line-height:1.25!important;
}
.emissions-only .future-copy strong{
  display:block!important;
  margin:0 0 12px!important;
  font-size:clamp(28px,3vw,38px)!important;
  line-height:1.08!important;
  white-space:normal!important;
}
.emissions-only .future-copy p{
  margin:0!important;
  line-height:1.5!important;
}
.emissions-only .back{
  display:inline-block!important;
  margin:0 auto!important;
  line-height:1.3!important;
}

@media(max-width:700px){
  .emissions-only .emissions-shell{
    height:auto!important;
    min-height:100vh!important;
    overflow:auto!important;
  }
  .emissions-only .emissions-page{
    width:94vw!important;
    padding:28px 14px!important;
  }
  .emissions-only .future-sounds{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    flex-direction:column!important;
    gap:14px!important;
    padding:22px 16px!important;
  }
  .emissions-only .vinyl-visual{
    flex:0 0 210px!important;
    width:260px!important;
    height:210px!important;
    transform:scale(.82)!important;
    margin:-15px 0!important;
  }
  .emissions-only .future-copy{
    flex:none!important;
    width:100%!important;
    max-width:420px!important;
    text-align:center!important;
  }
}