/*
Theme Name: VIP Room
Theme URI: https://ironbuiltmedia.com
Author: Megan Boyd at Iron Built Media
Author URI: https://ironbuiltmedia.com
Description: Podcast theme for the Home Services VIP Room. 
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: vip-room
Tags: podcast, custom-menu, custom-logo, featured-images, translation-ready
*/

/* ==========================================================================
   Base design system. Carried over from the approved homepage comp.
   New template styles live in assets/css/interior.css
   ========================================================================== */
:root {
  --bg:#080808;
  --cream:#f4ede1;
  --cream2:#e6d9c8;
  --ink:#111111;
  --muted:#6b625a;
  --orange:#f36a22;
  --orange2:#ff8a2c;
  --panel:#151313;
  --line:rgba(244,237,225,.14);
  --shadow:0 28px 90px rgba(0,0,0,.36);
  --soft-shadow:0 16px 42px rgba(0,0,0,.18);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--cream);
  font-family:Inter,system-ui,sans-serif;
  line-height:1.6;
  overflow-x:hidden;
}
a{color:inherit}
img{display:block;max-width:100%}
.page{
  background:
    radial-gradient(circle at 80% 8%, rgba(243,106,34,.16), transparent 22%),
    radial-gradient(circle at 14% 18%, rgba(243,106,34,.08), transparent 20%),
    linear-gradient(180deg, #090909 0%, #0d0a09 50%, #090909 100%);
}
.container{width:min(1400px,calc(100% - 40px));margin:0 auto}

.header{
  position:sticky;
  top:0;
  z-index:90;
  background:rgba(8,8,8,.78);
  backdrop-filter:blur(18px);
}
.header::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(244,237,225,.18),transparent);
}
.header-inner{
  min-height:88px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:22px;
}
.header-links,
.listen-icons{
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
}
.header-links a{
  text-decoration:none;
  color:rgba(244,237,225,.82);
  font-size:12px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.header-links a:hover{color:var(--orange)}
.header-logo{
  display:flex;
  justify-content:center;
  align-items:center;
}
.header-logo img{
  width:260px;
  height:auto;
  filter:drop-shadow(0 12px 22px rgba(0,0,0,.34));
}
.listen-icons{justify-content:flex-end}
.listen-icon{
  width:38px;
  height:38px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#151515;
  border:1px solid rgba(243,106,34,.42);
  box-shadow:5px 5px 0 rgba(243,106,34,.16);
  transition:transform .18s ease;
}
.listen-icon:hover{transform:translateY(-3px)}
.listen-icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:var(--orange);
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.listen-icon .play{fill:var(--orange);stroke:none}
.listen-icon rect,
.listen-icon circle:first-child{fill:rgba(243,106,34,.16)}

.hero{
  position:relative;
  padding:22px 0 0;
}
.hero-stage{
  position:relative;
  min-height:820px;
  overflow:hidden;
  border-radius:44px 44px 72px 72px / 44px 44px 108px 108px;
  background:
    radial-gradient(circle at 50% 10%, rgba(255,228,177,.28), transparent 19%),
    radial-gradient(circle at 50% 24%, rgba(243,106,34,.15), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0) 28%),
    linear-gradient(180deg, #181212 0%, #0f0d0c 100%);
  box-shadow:var(--shadow);
}
.hero-stage::before{
  content:"";
  position:absolute;
  inset:12px;
  border-radius:34px 34px 62px 62px / 34px 34px 92px 92px;
  border:1px solid rgba(244,237,225,.08);
  pointer-events:none;
}
.hero-stage::after{
  content:"";
  position:absolute;
  left:3%;
  right:3%;
  bottom:6px;
  height:240px;
  background:
    radial-gradient(ellipse at center, rgba(243,106,34,.14) 0%, rgba(243,106,34,.06) 24%, rgba(0,0,0,0) 62%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.16) 24%, rgba(0,0,0,.92) 100%);
  border-radius:50%;
  z-index:1;
  pointer-events:none;
}
.light-beam{
  position:absolute;
  top:-2%;
  width:2px;
  height:55%;
  background:linear-gradient(180deg, rgba(255,225,168,.70), transparent);
  opacity:.62;
  z-index:2;
}
.beam-1{left:24%;transform:rotate(12deg)}
.beam-2{left:50%;height:60%;transform:rotate(0deg)}
.beam-3{right:24%;transform:rotate(-12deg)}

.hosts-panorama{
  position:absolute;
  left:0;
  right:0;
  bottom:104px;
  z-index:4;
}
.hosts-panorama svg{
  width:100%;
  height:auto;
  display:block;
  overflow:visible;
}

.hero-title{
  position:absolute;
  left:50%;
  bottom:34px;
  z-index:12;
  transform:translateX(-50%) rotate(-1deg);
  width:min(1180px,96%);
  text-align:center;
  pointer-events:none;
}
.hero-title .small{
  display:block;
  margin-bottom:4px;
  color:rgba(244,237,225,.78);
  font-size:12px;
  font-weight:900;
  letter-spacing:.28em;
  text-transform:uppercase;
  text-shadow:0 4px 18px rgba(0,0,0,.85);
}
.hero-title h1{
  margin:0;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:clamp(66px,8vw,138px);
  line-height:.86;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:var(--cream);
  text-shadow:
    0 6px 0 rgba(0,0,0,.26),
    0 18px 52px rgba(0,0,0,.88);
}
.hero-title h1 span{
  color:var(--orange);
}

.wave-divider{
  position:relative;
  height:82px;
  margin-top:-8px;
  z-index:3;
}
.wave-divider svg{
  width:100%;
  height:100%;
  display:block;
}

.sponsor-zone{
  position:relative;
  margin-top:-2px;
  padding:0 0 84px;
  background:var(--cream);
  color:var(--ink);
}
.sponsor-showcase{
  position:relative;
  width:min(1420px,calc(100% - 34px));
  margin:0 auto;
  padding:22px 0 12px;
}
.sponsor-kicker{
  position:relative;
  z-index:2;
  margin:0 0 18px;
  text-align:center;
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  letter-spacing:.30em;
  text-transform:uppercase;
}
.ticker-shell{
  position:relative;
  padding:18px 0;
  transform:rotate(-1.8deg);
}
.ticker-shell::before{
  content:"";
  position:absolute;
  left:2%;
  right:2%;
  top:0;
  height:74px;
  border-radius:999px;
  background:#171717;
  box-shadow:var(--soft-shadow);
}
.ticker-shell::after{
  content:"";
  position:absolute;
  left:5%;
  right:5%;
  top:38px;
  height:74px;
  border-radius:999px;
  background:var(--orange);
  opacity:.20;
  filter:blur(18px);
}
.ticker-inner{
  position:relative;
  z-index:3;
  overflow:hidden;
  padding:18px 0;
}
.ticker-track{
  display:flex;
  gap:16px;
  width:max-content;
  animation:marquee 34s linear infinite;
}
.sponsor-badge{
  min-width:220px;
  height:54px;
  padding:0 20px;
  border-radius:999px;
  background:var(--cream);
  color:#111;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:28px;
  letter-spacing:.05em;
  text-transform:uppercase;
  box-shadow:7px 7px 0 rgba(0,0,0,.12);
}
.sponsor-badge .accent{color:var(--orange)}

.section{
  position:relative;
  padding:92px 0;
}
.section-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:28px;
  margin-bottom:38px;
}
.section-head h2{
  margin:0;
  color:#131110;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:clamp(48px,5.5vw,82px);
  line-height:.94;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.section-head p{
  margin:0;
  max-width:600px;
  color:var(--muted);
  font-size:17px;
  line-height:1.66;
}

.feature-wrap{
  display:grid;
  grid-template-columns:1.06fr .94fr;
  gap:24px;
  align-items:stretch;
}
.feature-card{
  position:relative;
  padding:42px;
  background:#111;
  color:var(--cream);
  border-radius:56px 40px 62px 44px / 40px 58px 42px 64px;
  box-shadow:var(--shadow);
}
.feature-card::before{
  content:"";
  position:absolute;
  right:-54px;
  top:-42px;
  width:190px;
  height:190px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(243,106,34,.28), rgba(243,106,34,0));
}
.meta{
  margin-bottom:14px;
  color:rgba(244,237,225,.68);
  font-size:11px;
  font-weight:800;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.meta span{color:var(--orange)}
.feature-card h3{
  margin:0 0 18px;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:clamp(42px,4.7vw,68px);
  line-height:.98;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.feature-card p{
  margin:0 0 24px;
  color:rgba(244,237,225,.74);
  font-size:16px;
  line-height:1.72;
  max-width:620px;
}
.player{
  display:grid;
  grid-template-columns:54px 1fr auto;
  gap:16px;
  align-items:center;
  padding:16px;
  background:#090909;
  border-radius:999px;
  margin-bottom:18px;
}
.player-play{
  width:50px;
  height:50px;
  border-radius:50%;
  background:var(--orange);
  position:relative;
}
.player-play::after{
  content:"";
  position:absolute;
  left:19px;
  top:14px;
  border-left:14px solid #080808;
  border-top:10px solid transparent;
  border-bottom:10px solid transparent;
}
.bar{
  height:6px;
  background:rgba(244,237,225,.13);
  border-radius:999px;
  overflow:hidden;
}
.bar span{
  display:block;
  width:34%;
  height:100%;
  background:var(--orange);
}
.time{
  color:rgba(244,237,225,.64);
  font-size:12px;
  font-weight:800;
  white-space:nowrap;
}
.listen-pills{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.listen-pills a{
  text-decoration:none;
  padding:10px 14px;
  background:var(--cream);
  color:#111;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.feature-art{
  position:relative;
  min-height:560px;
  border-radius:42px 60px 40px 64px / 58px 40px 62px 36px;
  background:
    radial-gradient(circle at 50% 14%, rgba(243,106,34,.22), transparent 26%),
    linear-gradient(180deg, rgba(243,106,34,.10), rgba(17,17,17,0) 36%),
    #171414;
  overflow:hidden;
  box-shadow:var(--shadow);
}
.feature-art::before{
  content:"";
  position:absolute;
  inset:18px;
  border:1px dashed rgba(244,237,225,.14);
  border-radius:34px 56px 34px 56px / 46px 34px 54px 36px;
}
.feature-art::after{
  content:"";
  position:absolute;
  left:10%;
  right:10%;
  bottom:10%;
  height:46%;
  border-radius:50%;
  background:radial-gradient(ellipse at center, rgba(243,106,34,.22), rgba(243,106,34,0) 62%);
}
.feature-art-badge{
  position:absolute;
  inset:0;
  margin:auto;
  width:min(300px,62%);
  height:min(300px,62vw);
  border-radius:50%;
  background:var(--cream);
  color:#111;
  box-shadow:0 18px 0 var(--orange), var(--shadow);
  display:grid;
  place-items:center;
  text-align:center;
}
.feature-art-badge strong{
  display:block;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:54px;
  line-height:.9;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.feature-art-badge span{
  display:block;
  margin-top:8px;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.dark-section{
  position:relative;
  padding:98px 0;
  background:#0b0b0b;
  color:var(--cream);
}
.dark-section::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-42px;
  height:86px;
  background:#0b0b0b;
  border-radius:44% 56% 0 0 / 100% 100% 0 0;
}
.dark-section .section-head h2{color:var(--cream)}
.dark-section .section-head p{color:rgba(244,237,225,.68)}

.episode-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
.episode{
  text-decoration:none;
  color:inherit;
  background:#141414;
  border-radius:44px 34px 48px 38px / 34px 50px 38px 54px;
  overflow:hidden;
  box-shadow:var(--soft-shadow);
  transition:transform .18s ease;
}
.episode:hover{transform:translateY(-5px)}
.episode-top{
  height:188px;
  position:relative;
  background:
    radial-gradient(circle at 50% 24%, rgba(243,106,34,.30), transparent 24%),
    linear-gradient(180deg, rgba(243,106,34,.10), rgba(17,17,17,0) 36%),
    #1b1515;
}
.episode-top::before{
  content:"";
  position:absolute;
  width:58px;
  height:58px;
  border-radius:50%;
  background:var(--cream);
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
}
.episode-top::after{
  content:"";
  position:absolute;
  left:calc(50% + 2px);
  top:50%;
  transform:translate(-50%,-50%);
  border-left:16px solid var(--orange);
  border-top:11px solid transparent;
  border-bottom:11px solid transparent;
}
.episode-body{
  display:flex;
  flex-direction:column;
  min-height:248px;
  padding:22px 22px 24px;
}
.ep-kicker{
  min-height:16px;
  margin-bottom:12px;
  color:var(--orange);
  font-size:11px;
  font-weight:900;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.episode h3{
  min-height:104px;
  margin:0 0 12px;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:36px;
  line-height:1.05;
  letter-spacing:.01em;
  text-transform:uppercase;
}
.episode p{
  margin:auto 0 0;
  color:rgba(244,237,225,.72);
  font-size:14.5px;
  line-height:1.62;
}

.about-zone{
  background:var(--cream);
  color:var(--ink);
  position:relative;
  padding:92px 0 110px;
}
.about-zone::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-42px;
  height:86px;
  background:var(--cream);
  border-radius:56% 44% 0 0 / 100% 100% 0 0;
}
.about-layout{
  display:grid;
  grid-template-columns:.84fr 1.16fr;
  gap:26px;
  align-items:start;
}
.story{
  padding:40px;
  background:#171717;
  color:var(--cream);
  border-radius:62px 36px 58px 44px / 42px 54px 36px 60px;
  box-shadow:var(--shadow);
}
.story p{
  margin:0 0 18px;
  color:rgba(244,237,225,.76);
  line-height:1.72;
}
.info-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.info{
  padding:24px;
  background:#fff9ef;
  border-radius:30px 44px 32px 46px / 34px 30px 48px 36px;
  box-shadow:10px 10px 0 rgba(17,17,17,.08);
}
.info h3{
  margin:0 0 10px;
  color:var(--orange);
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:34px;
  line-height:1;
  text-transform:uppercase;
}
.info p{
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.62;
}

.cta{
  padding:82px 0 0;
  text-align:center;
}
.cta-mark{
  display:inline-grid;
  place-items:center;
  width:126px;
  height:126px;
  border-radius:50%;
  background:#111;
  color:#fff;
  box-shadow:0 14px 0 var(--orange), var(--soft-shadow);
  margin:0 auto 24px;
  transform:rotate(-4deg);
}
.cta-mark span{
  display:block;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:34px;
  line-height:.9;
  letter-spacing:.04em;
  text-transform:uppercase;
}
.cta h2{
  margin:0 0 14px;
  color:#131110;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:clamp(48px,5vw,86px);
  line-height:.96;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.cta p{
  max-width:670px;
  margin:0 auto 28px;
  color:var(--muted);
  font-size:17px;
  line-height:1.68;
}
.cta-actions{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:14px;
}
.btn-ink{background:#111;color:#fff;box-shadow:8px 8px 0 var(--orange)}
.btn-cream{background:#fff;color:#111;box-shadow:8px 8px 0 rgba(243,106,34,.36)}

.footer{
  padding:34px 0 42px;
  background:#050505;
}
.footer-wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
}
.footer-mark{
  display:flex;
  align-items:center;
  gap:14px;
}
.footer-circle{
  width:54px;
  height:54px;
  border-radius:50%;
  background:var(--cream);
  color:#111;
  display:grid;
  place-items:center;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:18px;
  line-height:.85;
  text-transform:uppercase;
}
.footer-mark strong{
  display:block;
  font-family:"Bebas Neue", Impact, sans-serif;
  font-size:32px;
  line-height:.9;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.footer-mark span{
  display:block;
  color:rgba(244,237,225,.62);
  font-size:10px;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.footer-links{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
}
.footer-links a{
  text-decoration:none;
  color:rgba(244,237,225,.64);
  font-size:11px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.footer-links a:hover{color:var(--orange)}

@keyframes marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

@media (max-width:1180px){
  .feature-wrap,
  .about-layout{grid-template-columns:1fr}
  .episode-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .header-inner{
    grid-template-columns:1fr;
    justify-items:center;
    padding:16px 0 18px;
  }
  .header-links,
  .listen-icons{justify-content:center}
  .header-logo img{width:220px}
  .hero-stage{min-height:720px}
  .hosts-panorama{bottom:122px}
  .hero-title{bottom:24px}
  .hero-title h1{font-size:clamp(58px,10vw,98px)}
}
@media (max-width:760px){
  .container{width:min(100% - 28px,1400px)}
  .hero-stage{min-height:650px}
  .hosts-panorama{
    width:132%;
    left:50%;
    right:auto;
    transform:translateX(-50%);
    bottom:142px;
  }
  .hero-title{
    width:96%;
    bottom:28px;
  }
  .hero-title .small{font-size:10px}
  .hero-title h1{font-size:clamp(52px,14vw,76px)}
  .section-head{display:block}
  .section-head p{margin-top:14px}
  .player{grid-template-columns:54px 1fr}
  .time{grid-column:2}
  .episode-grid,
  .info-grid{grid-template-columns:1fr}
}

/* --- Revision overrides based on feedback --- */
.listen-icon{
  width:44px;
  height:44px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:transparent;
  border:1px solid rgba(244,237,225,.28);
  box-shadow:none;
  color:var(--cream);
  transition:background .2s ease,border-color .2s ease,color .2s ease,transform .18s ease;
}
.listen-icon:hover{
  transform:translateY(-2px);
  background:var(--orange);
  border-color:var(--orange);
  color:#111;
}
.listen-icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.listen-icon .play{
  fill:currentColor;
  stroke:none;
}
.listen-icon rect,
.listen-icon circle:first-child{
  fill:rgba(244,237,225,.08);
}
.listen-icon:hover rect,
.listen-icon:hover circle:first-child{
  fill:rgba(17,17,17,.08);
}

.hero{
  padding:0;
}
.container.hero-stage{
  width:min(1480px,calc(100% - 40px));
}
.hero-stage{
  min-height:860px;
  border-radius:0 0 68px 68px / 0 0 104px 104px;
  background:
    radial-gradient(ellipse 66% 58% at 50% 36%, rgba(243,106,34,.24) 0%, rgba(243,106,34,.10) 38%, rgba(243,106,34,0) 76%),
    linear-gradient(180deg, #130807 0%, #090504 58%, #040404 100%);
  box-shadow:none;
}
.hero-stage::before{
  display:none;
}
.hero-stage::after{
  left:8%;
  right:8%;
  bottom:0;
  height:210px;
  background:
    radial-gradient(ellipse at center, rgba(243,106,34,.22) 0%, rgba(243,106,34,.06) 26%, rgba(0,0,0,0) 64%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.18) 24%, rgba(0,0,0,.94) 100%);
}
.light-beam{
  display:none;
}
.hosts-panorama{
  left:50%;
  right:auto;
  width:118%;
  transform:translateX(-50%);
  bottom:94px;
  z-index:4;
}
.hosts-panorama svg{
  width:100%;
}
.hero-title{
  bottom:26px;
  width:min(1320px,98%);
  transform:translateX(-50%);
}
.hero-title .small{
  margin-bottom:8px;
  font-size:clamp(26px,3vw,52px);
  letter-spacing:.18em;
  color:rgba(244,237,225,.84);
}
.hero-title h1{
  font-size:clamp(74px,9vw,156px);
  line-height:.84;
  white-space:nowrap;
}
.hero-title h1 span{
  display:inline-block;
  color:#111;
  background:var(--orange);
  padding:.03em .16em 0;
  box-shadow:0 10px 34px rgba(243,106,34,.34);
}

.feature-wrap--single{
  display:block;
}
.feature-card--wide{
  width:100%;
  max-width:none;
}
.feature-card--wide h3{
  max-width:980px;
}
.feature-card--wide p{
  max-width:860px;
}
.feature-card--wide .player{
  max-width:900px;
}
.feature-card--wide .listen-pills{
  max-width:900px;
}

.cta--email{
  padding:94px 0 0;
}
.cta-logo{
  width:min(280px,72%);
  margin:0 auto 28px;
  filter:drop-shadow(0 16px 30px rgba(0,0,0,.30));
}
.cta--email h2{
  margin-bottom:14px;
}
.cta--email h2 span{
  color:var(--orange);
}
.cta--email p{
  max-width:720px;
  margin:0 auto 28px;
}
.cta-form{
  display:flex;
  align-items:stretch;
  width:min(680px,100%);
  margin:0 auto 24px;
  border:1px solid rgba(17,17,17,.12);
  background:#111;
  overflow:hidden;
  border-radius:10px;
  box-shadow:var(--soft-shadow);
}
.cta-form input{
  flex:1;
  min-height:62px;
  border:0;
  background:transparent;
  color:var(--cream);
  font:inherit;
  padding:0 22px;
  outline:none;
}
.cta-form input::placeholder{
  color:rgba(244,237,225,.46);
}
.cta-form button{
  border:0;
  background:var(--orange);
  color:#111;
  font:inherit;
  font-size:12px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  padding:0 28px;
  cursor:pointer;
}
.cta-actions{
  margin-top:8px;
}
.cta-actions .btn{
  border:0;
  cursor:pointer;
  font:inherit;
  font-size:12px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
  padding:16px 24px;
  border-radius:4px;
}
.about-zone{
  padding-bottom:118px;
}

@media (max-width:1100px){
  .hosts-panorama{
    width:132%;
    bottom:118px;
  }
  .hero-stage{
    min-height:780px;
  }
  .hero-title h1{
    white-space:normal;
  }
}
@media (max-width:760px){
  .hero-stage{
    min-height:680px;
    border-radius:0 0 48px 48px / 0 0 70px 70px;
  }
  .hosts-panorama{
    width:175%;
    bottom:122px;
  }
  .hero-title{
    bottom:24px;
    width:96%;
  }
  .hero-title .small{
    font-size:20px;
  }
  .hero-title h1{
    font-size:clamp(52px,14vw,84px);
  }
  .cta-form{
    flex-direction:column;
  }
  .cta-form button{
    min-height:58px;
  }
}


/* Apple Podcasts reviews section */
.reviews-section {
  position: relative;
  padding: 96px 0;
  background: #121010;
  color: var(--cream);
}

.reviews-section::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -42px;
  height: 86px;
  background: #121010;
  border-radius: 44% 56% 0 0 / 100% 100% 0 0;
}

.reviews-section .section-head h2 {
  color: var(--cream);
}

.reviews-section .section-head p {
  color: rgba(244,237,225,.70);
}

.reviews-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.review-card {
  padding: 28px;
  background: #0b0b0b;
  border: 1px solid rgba(244,237,225,.10);
  border-radius: 34px 26px 38px 30px / 30px 38px 28px 42px;
  box-shadow: var(--soft-shadow);
}

.review-stars {
  color: var(--orange);
  font-size: 20px;
  letter-spacing: .08em;
  margin-bottom: 14px;
}

.review-card h3 {
  margin: 0 0 12px;
  font-family: "Bebas Neue", Impact, sans-serif;
  font-size: 32px;
  line-height: 1.02;
  letter-spacing: .02em;
  text-transform: uppercase;
}

.review-card p {
  margin: 0 0 16px;
  color: rgba(244,237,225,.76);
  font-size: 15px;
  line-height: 1.68;
}

.review-by {
  display: block;
  color: rgba(244,237,225,.52);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

@media (max-width: 1100px) {
  .reviews-grid {
    grid-template-columns: 1fr;
  }
}


/* latest feedback refinements */
.hero{
  padding:0;
}
.container.hero-stage{
  width:min(1480px,calc(100% - 40px));
}
.hero-stage{
  min-height:810px;
  border-radius:44px 44px 0 0 / 44px 44px 0 0;
  background:
    radial-gradient(circle at 50% 34%, rgba(243,106,34,.22) 0%, rgba(243,106,34,.08) 28%, rgba(243,106,34,0) 56%),
    linear-gradient(180deg, #120807 0%, #090504 64%, #090504 100%);
}
.hero-stage::before{
  display:none;
}
.hero-stage::after{
  display:none;
}
.light-beam{
  display:none;
}
.hosts-panorama{
  left:50%;
  right:auto;
  width:94%;
  bottom:96px;
  transform:translateX(-50%);
}
.hero-title{
  bottom:6px;
  transform:translateX(-50%);
  width:min(1320px,96%);
}
.hero-title .small{
  font-size:clamp(28px,2.8vw,52px);
  margin-bottom:12px;
  letter-spacing:.16em;
}
.hero-title h1{
  font-size:clamp(72px,8.8vw,150px);
  line-height:.84;
}
.hero-title h1 span{
  display:inline-block;
  color:#111;
  background:var(--orange);
  padding:.02em .15em 0;
  box-shadow:none;
  text-shadow:none;
}

.wave-divider{
  position:relative;
  height:70px;
  margin-top:0;
  background:linear-gradient(180deg, #090504 0%, #090504 100%);
}
.wave-divider svg{
  display:block;
}
.wave-divider::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:26px;
  height:4px;
  background:var(--orange);
  clip-path:polygon(0 72%, 25% 40%, 50% 0, 75% 42%, 100% 72%, 100% 100%, 0 100%);
}
.wave-divider path{
  fill:var(--cream);
}

.sponsor-zone{
  margin-top:0;
}

.feature-wrap--episode{
  display:block;
}
.feature-card--wide{
  width:100%;
}
.feature-card--wide::before{
  display:none;
}
.feature-card-grid{
  display:grid;
  grid-template-columns:minmax(0,1.4fr) 320px;
  gap:30px;
  align-items:start;
}
.feature-copy{
  min-width:0;
}
.feature-copy p{
  max-width:none;
}
.episode-art-placeholder{
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:12px;
}
.episode-art-box{
  width:100%;
  aspect-ratio:1 / 1;
  border:5px solid #f0a13d;
  background:#090909;
}

.dark-section{
  position:relative;
}
.dark-section::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-30px;
  height:60px;
  background:var(--orange);
  clip-path:polygon(0 70%, 23% 44%, 50% 0, 78% 46%, 100% 74%, 100% 100%, 0 100%);
}
.about-zone::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-30px;
  height:60px;
  background:#f4ede1;
  border-radius:0;
  clip-path:polygon(0 72%, 22% 42%, 50% 0, 79% 46%, 100% 72%, 100% 100%, 0 100%);
}
.reviews-section::before{
  background:#121010;
  border-radius:0;
  top:-30px;
  height:60px;
  clip-path:polygon(0 72%, 20% 46%, 50% 0, 80% 46%, 100% 72%, 100% 100%, 0 100%);
}
.cta--email{
  background:
    linear-gradient(180deg, #111111 0%, #090909 100%);
  padding:88px 0 0;
  border-radius:28px 28px 0 0;
  box-shadow:0 -1px 0 rgba(17,17,17,.08);
}

.story p:first-child{
  margin-top:0;
}
.info:nth-child(2) p{
  content:"";
}

@media (max-width:1100px){
  .feature-card-grid{
    grid-template-columns:1fr;
  }
  .episode-art-placeholder{
    justify-content:flex-start;
    padding-top:6px;
  }
  .episode-art-box{
    max-width:300px;
  }
}

@media (max-width:760px){
  .hero-stage{
    min-height:640px;
    border-radius:28px 28px 0 0 / 28px 28px 0 0;
  }
  .hosts-panorama{
    width:132%;
    bottom:112px;
  }
  .hero-title{
    bottom:10px;
    width:94%;
  }
  .hero-title h1{
    font-size:clamp(52px,13vw,88px);
  }
  .feature-card-grid{
    gap:20px;
  }
}


/* v4 focused cleanup */
.listen-icons{
  gap:10px;
}
.listen-icon{
  width:42px;
  height:42px;
  border-radius:50%;
  border:1px solid rgba(244,237,225,.22);
  background:transparent;
  color:var(--cream);
  box-shadow:none;
}
.listen-icon svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.listen-icon .play{
  fill:currentColor;
  stroke:none;
}
.listen-icon rect,
.listen-icon circle{
  fill:none;
}
.listen-icon:hover{
  background:var(--orange);
  border-color:var(--orange);
  color:#111;
  transform:translateY(-2px);
}

.hero{
  padding:0;
  background:#090504;
}
.container.hero-stage{
  width:100%;
  max-width:none;
  padding:0;
}
.hero-stage{
  min-height:clamp(560px, 40vw + 120px, 820px);
  overflow:hidden;
  border-radius:0;
  box-shadow:none;
  background:
    radial-gradient(ellipse 62% 58% at 50% 44%, rgba(243,106,34,.46) 0%, rgba(243,106,34,.18) 38%, rgba(243,106,34,0) 68%),
    linear-gradient(180deg, #150806 0%, #090504 60%, #060302 100%);
}
.hero-stage::before,
.hero-stage::after,
.light-beam{
  display:none !important;
}
.hosts-panorama{
  left:50%;
  right:auto;
  width:min(99%, 1300px);
  transform:translateX(-50%);
  top:20px;
  bottom:auto;
}
.hosts-panorama svg{
  width:100%;
}
.hosts-panorama img{
  width:100%;
  height:auto;
  display:block;
  filter:drop-shadow(0 24px 40px rgba(0,0,0,.55));
}
.hero-title{
  bottom:54px;
  width:min(1300px,94%);
  transform:translateX(-50%);
}
.hero-title .small{
  font-size:clamp(28px,3vw,54px);
  margin-bottom:12px;
}
.hero-title h1{
  font-size:clamp(76px,8.8vw,150px);
  line-height:.84;
}
.hero-title h1 span{
  display:inline-block;
  background:var(--orange);
  color:#111;
  padding:.02em .15em 0;
  text-shadow:none;
  box-shadow:none;
}

.wave-divider{
  height:86px;
  margin-top:0;
  background:#090504;
}
.wave-divider::after{
  display:none !important;
}
.wave-divider svg{
  display:block;
  width:100%;
  height:100%;
}
.wave-divider path{
  fill:var(--cream);
}

.dark-section::before{
  background:#0b0b0b;
  top:-54px;
  height:54px;
  border-radius:0;
  clip-path:polygon(0 100%, 100% 20%, 100% 100%);
}
.reviews-section::before{
  background:#121010;
  top:-54px;
  height:54px;
  border-radius:0;
  clip-path:polygon(0 100%, 100% 20%, 100% 100%);
}
.about-zone::before{
  background:var(--cream);
  top:-54px;
  height:54px;
  border-radius:0;
  clip-path:polygon(0 100%, 100% 20%, 100% 100%);
}

.feature-card-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) 360px;
  gap:38px;
  align-items:center;
}
.feature-copy{
  min-width:0;
}
.episode-art-placeholder{
  display:flex;
  justify-content:center;
  align-items:center;
}
.episode-art-box{
  width:100%;
  aspect-ratio:1 / .84;
  border:0;
  background:#090909;
  overflow:hidden;
  border-radius:0 44px 44px 0;
  box-shadow:0 18px 42px rgba(0,0,0,.28);
}
.episode-art-box img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.email-cta-section{
  position:relative;
  background:
    radial-gradient(ellipse 60% 48% at 50% 18%, rgba(243,106,34,.14), transparent 58%),
    linear-gradient(180deg, #111 0%, #070707 100%);
  padding:98px 0 108px;
  color:var(--cream);
}
.email-cta-section::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-54px;
  height:54px;
  background:#111;
  clip-path:polygon(0 100%, 100% 20%, 100% 100%);
}
.email-cta-section .cta--email{
  background:transparent;
  margin:0 auto;
  padding:0;
  border-radius:0;
  box-shadow:none;
}
.email-cta-section .cta-logo{
  filter:drop-shadow(0 12px 24px rgba(0,0,0,.40));
}
.email-cta-section .cta--email h2{
  color:var(--cream);
  opacity:1;
}
.email-cta-section .cta--email h2 span{
  color:var(--orange);
}
.email-cta-section .cta--email p{
  color:rgba(244,237,225,.78);
}
.email-cta-section .cta-form{
  background:#0a0a0a;
  border:1px solid rgba(244,237,225,.12);
  box-shadow:0 20px 40px rgba(0,0,0,.30);
}
.email-cta-section .cta-form input{
  color:var(--cream);
}
.email-cta-section .cta-actions .btn{
  opacity:1;
}
.email-cta-section .btn-ink{
  background:#111;
  color:#fff;
}
.email-cta-section .btn-cream{
  background:#fff;
  color:#111;
}

.footer-logo-only img{
  height:58px;
  width:auto;
}
.footer-circle,
.footer-mark strong,
.footer-mark span{
  display:none;
}

@media (max-width:1100px){
  .hosts-panorama{
    width:112%;
    top:38px;
    bottom:auto;
  }
  .feature-card-grid{
    grid-template-columns:1fr;
  }
  .episode-art-box{
    max-width:420px;
    border-radius:0 36px 36px 0;
  }
}
@media (max-width:760px){
  .hero-stage{
    min-height:clamp(430px, 72vw + 60px, 640px);
  }
  .hosts-panorama{
    width:152%;
    top:30px;
    bottom:auto;
  }
  .hero-title{
    bottom:34px;
  }
  .hero-title h1{
    font-size:clamp(54px,13vw,88px);
  }
  .email-cta-section{
    padding:78px 0 88px;
  }
}


/* v5 header + logo cleanup */
.listen-icons {
  gap: 12px;
}

.listen-icon {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(244,237,225,.28);
  background: transparent;
  color: var(--cream);
  box-shadow: none;
  display: inline-grid;
  place-items: center;
  text-decoration: none;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.listen-icon svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.listen-icon .apple-mark {
  fill: currentColor;
  stroke: none;
  width: 17px;
  height: 17px;
}

.listen-icon .play {
  fill: currentColor;
  stroke: none;
}

.listen-icon rect {
  fill: none;
}

.listen-icon:hover {
  background: var(--orange);
  border-color: var(--orange);
  color: #111;
  transform: translateY(-1px);
}

.header-subscribe {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 28px;
  background: var(--orange);
  color: #111;
  text-decoration: none;
  border: 1px solid var(--orange);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  transition: transform .18s ease, background .18s ease;
}

.header-subscribe:hover {
  transform: translateY(-1px);
  background: #ff7a24;
}

.cta-logo,
.footer-logo-only img {
  filter: drop-shadow(0 12px 24px rgba(0,0,0,.40));
}

.footer-logo-only img {
  height: 58px;
  width: auto;
}


/* v7 section layout updates */
.feature-wrap--showcase {
  display: block;
}

.feature-showcase {
  display: grid;
  grid-template-columns: minmax(320px, .92fr) minmax(0, 1.08fr);
  gap: 0;
  align-items: stretch;
  background:
    linear-gradient(90deg, rgba(243,106,34,.08), rgba(243,106,34,0) 34%),
    #0b0b0b;
  border: 1px solid rgba(244,237,225,.10);
  border-radius: 42px;
  overflow: hidden;
  box-shadow: var(--shadow);
}

.feature-showcase-art {
  position: relative;
  min-height: 520px;
  padding: 32px;
  background:
    radial-gradient(circle at 18% 18%, rgba(243,106,34,.22), transparent 36%),
    linear-gradient(180deg, #161616, #070707);
  display: flex;
  align-items: center;
  justify-content: center;
}

.feature-showcase-art img {
  width: 100%;
  max-width: 440px;
  height: auto;
  object-fit: contain;
  border-radius: 18px;
  box-shadow: 0 18px 50px rgba(0,0,0,.38);
}

.featured-chip {
  position: absolute;
  left: 32px;
  bottom: 28px;
  border: 1px solid rgba(244,237,225,.20);
  border-radius: 999px;
  color: rgba(244,237,225,.72);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .18em;
  padding: 10px 18px;
  text-transform: uppercase;
}

.feature-showcase-copy {
  padding: clamp(42px, 5vw, 72px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.feature-showcase-copy h3 {
  margin: 0 0 22px;
  font-family: "Bebas Neue", Impact, sans-serif;
  font-size: clamp(44px, 5.2vw, 82px);
  line-height: .98;
  letter-spacing: .01em;
  text-transform: uppercase;
  color: var(--cream);
}

.feature-showcase-copy p {
  margin: 0 0 28px;
  color: rgba(244,237,225,.76);
  font-size: 17px;
  line-height: 1.72;
  max-width: 840px;
}

.feature-showcase .player {
  max-width: 860px;
}

.dark-section {
  padding-top: 112px;
}

.episode-grid--cards {
  gap: 30px;
}

.episode-grid--cards .episode {
  border-radius: 28px;
  background: #101010;
  border: 1px solid rgba(244,237,225,.10);
  box-shadow: 0 18px 46px rgba(0,0,0,.22);
  overflow: hidden;
}

.episode-grid--cards .episode-top {
  height: 285px;
  background:
    radial-gradient(circle at 50% 0%, rgba(243,106,34,.13), transparent 34%),
    linear-gradient(180deg, rgba(44,24,19,.58), rgba(8,8,8,.98));
}

.episode-grid--cards .episode-top::before,
.episode-grid--cards .episode-top::after {
  display: none;
}

.episode-category {
  position: absolute;
  left: 28px;
  bottom: 28px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  padding: 0 20px;
  border-radius: 999px;
  background: var(--orange);
  color: #111;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.episode-play {
  position: absolute;
  right: 28px;
  bottom: 28px;
  z-index: 3;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  border: 1px solid rgba(244,237,225,.22);
  background: rgba(0,0,0,.28);
}

.episode-play::after {
  content: "";
  position: absolute;
  left: 21px;
  top: 16px;
  border-left: 15px solid var(--cream);
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}

.episode-grid--cards .episode-body {
  min-height: 286px;
  padding: 30px 30px 34px;
  background: linear-gradient(180deg, #151515, #101010);
}

.episode-grid--cards .ep-kicker {
  color: rgba(244,237,225,.58);
}

.episode-grid--cards .episode h3 {
  font-size: 36px;
}

.about-current-layout {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: 42px;
  align-items: start;
}

.about-current-copy h2 {
  margin: 0 0 26px;
  color: var(--cream);
  font-family: "Bebas Neue", Impact, sans-serif;
  font-size: clamp(54px, 6vw, 96px);
  line-height: .94;
  letter-spacing: .01em;
  text-transform: uppercase;
}

.about-current-copy p {
  margin: 0 0 20px;
  color: rgba(244,237,225,.72);
  font-size: 17px;
  line-height: 1.74;
  max-width: 720px;
}

.info-grid--current .info {
  background: linear-gradient(135deg, rgba(243,106,34,.10), rgba(255,255,255,.02));
  border: 1px solid rgba(244,237,225,.10);
  color: var(--cream);
}

.info-grid--current .info p {
  color: rgba(244,237,225,.70);
}

.hosts-section {
  position: relative;
  padding: 108px 0 116px;
  background: #070707;
  color: var(--cream);
}

.hosts-section::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: -54px;
  height: 54px;
  background: #070707;
  clip-path: polygon(0 100%, 100% 20%, 100% 100%);
}

.hosts-section-head {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: 48px;
  align-items: end;
  margin-bottom: 54px;
}

.hosts-section-head h2 {
  margin: 0;
  font-family: "Bebas Neue", Impact, sans-serif;
  font-size: clamp(56px, 6.2vw, 104px);
  line-height: .94;
  letter-spacing: .01em;
  text-transform: uppercase;
}

.hosts-section-head p {
  margin: 0;
  color: rgba(244,237,225,.74);
  font-size: 18px;
  line-height: 1.7;
  max-width: 760px;
}

.host-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 28px;
}

.host-card {
  min-height: 470px;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(244,237,225,.10);
  border-radius: 26px;
  background:
    radial-gradient(circle at 50% -6%, rgba(243,106,34,.12), transparent 36%),
    linear-gradient(180deg, #151515, #0b0b0b);
  box-shadow: 0 18px 46px rgba(0,0,0,.22);
  padding: 30px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.host-card-figure {
  position: absolute;
  left: 50%;
  top: 40px;
  transform: translateX(-50%);
  width: 72%;
  height: 260px;
  opacity: .42;
  background:
    radial-gradient(circle at 50% 20%, rgba(66,42,35,.70) 0 16%, transparent 17%),
    radial-gradient(ellipse at 50% 70%, rgba(10,10,10,.92) 0 42%, transparent 43%);
}

.host-card h3 {
  position: relative;
  z-index: 2;
  margin: 0 0 10px;
  font-family: "Bebas Neue", Impact, sans-serif;
  font-size: 38px;
  line-height: 1;
  letter-spacing: .01em;
  text-transform: uppercase;
}

.host-card p {
  position: relative;
  z-index: 2;
  margin: 0;
  color: rgba(244,237,225,.72);
  font-size: 15px;
  line-height: 1.55;
}

.email-cta-section::before {
  background: #111;
}

@media (max-width: 1100px) {
  .feature-showcase {
    grid-template-columns: 1fr;
  }

  .feature-showcase-art {
    min-height: auto;
  }

  .about-current-layout,
  .hosts-section-head {
    grid-template-columns: 1fr;
  }

  .host-card-grid {
    grid-template-columns: 1fr;
  }
}


/* v8 readability + divider cleanup */
.about-zone {
  overflow: hidden;
}

.about-current-copy h2 {
  color: #111;
}

.about-current-copy p {
  color: #4f4841;
}

.info-grid--current .info {
  background: #f7ece0;
  border: 1px solid rgba(17,17,17,.08);
  box-shadow: 10px 10px 0 rgba(17,17,17,.08);
}

.info-grid--current .info h3 {
  color: var(--orange);
}

.info-grid--current .info p {
  color: #6a6159;
}

/* remove the faint separator line look */
.dark-section,
.reviews-section,
.about-zone,
.hosts-section,
.email-cta-section {
  overflow: hidden;
  border-top: 0 !important;
}

.dark-section::before,
.reviews-section::before,
.about-zone::before,
.hosts-section::before,
.email-cta-section::before {
  box-shadow: none !important;
  outline: 0 !important;
}

/* alternate section slopes */
.dark-section::before {
  top: -56px;
  height: 58px;
  background: #0b0b0b;
  clip-path: polygon(0 100%, 100% 16%, 100% 100%, 0 100%);
}

.reviews-section::before {
  top: -56px;
  height: 58px;
  background: #121010;
  border-radius: 0;
  clip-path: polygon(0 16%, 100% 100%, 100% 100%, 0 100%);
}

.about-zone::before {
  top: -56px;
  height: 58px;
  background: var(--cream);
  border-radius: 0;
  clip-path: polygon(0 100%, 100% 16%, 100% 100%, 0 100%);
}

.hosts-section::before {
  top: -56px;
  height: 58px;
  background: #070707;
  clip-path: polygon(0 16%, 100% 100%, 100% 100%, 0 100%);
}

.email-cta-section::before {
  top: -56px;
  height: 58px;
  background: #111;
  clip-path: polygon(0 100%, 100% 16%, 100% 100%, 0 100%);
}


/* v9 straight divider lines */
.wave-divider {
  height: 82px;
  margin-top: 0;
  background: #090504;
}

.wave-divider::after {
  display: none !important;
}

.wave-divider svg {
  display: block;
  width: 100%;
  height: 100%;
}

.wave-divider path {
  fill: var(--cream);
}

/* Simple single-line diagonal dividers, alternating direction */
.dark-section::before {
  top: -58px;
  height: 58px;
  border-radius: 0 !important;
  background: #0b0b0b;
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
}

.reviews-section::before {
  top: -58px;
  height: 58px;
  border-radius: 0 !important;
  background: #121010;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
}

.about-zone::before {
  top: -58px;
  height: 58px;
  border-radius: 0 !important;
  background: var(--cream);
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
}

.hosts-section::before {
  top: -58px;
  height: 58px;
  border-radius: 0 !important;
  background: #070707;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
}

.email-cta-section::before {
  top: -58px;
  height: 58px;
  border-radius: 0 !important;
  background: #111;
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
}


/* v10 steeper section slopes */
.wave-divider {
  height: 110px;
}

.wave-divider path {
  fill: var(--cream);
}

/* increase the angle contrast so the dividers slope more */
.dark-section::before {
  top: -88px;
  height: 88px;
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
}

.reviews-section::before {
  top: -88px;
  height: 88px;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
}

.about-zone::before {
  top: -88px;
  height: 88px;
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
}

.hosts-section::before {
  top: -88px;
  height: 88px;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
}

.email-cta-section::before {
  top: -88px;
  height: 88px;
  clip-path: polygon(0 100%, 100% 0, 100% 100%);
}


/* v11 fix section divider visibility */
.dark-section,
.reviews-section,
.about-zone,
.hosts-section,
.email-cta-section {
  position: relative;
  overflow: visible !important;
  z-index: 1;
}

.dark-section > .container,
.reviews-section > .container,
.about-zone > .container,
.hosts-section > .container,
.email-cta-section > .container {
  position: relative;
  z-index: 2;
}

/* make the sloped dividers actually visible above each section */
.dark-section::before,
.reviews-section::before,
.about-zone::before,
.hosts-section::before,
.email-cta-section::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  z-index: 1;
  display: block;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* alternate slope directions, with stronger rise/fall */
.dark-section::before {
  top: -92px;
  height: 92px;
  background: #0b0b0b;
  clip-path: polygon(0 100%, 100% 8%, 100% 100%);
}

.reviews-section::before {
  top: -92px;
  height: 92px;
  background: #121010;
  clip-path: polygon(0 8%, 100% 100%, 0 100%);
}

.about-zone::before {
  top: -92px;
  height: 92px;
  background: var(--cream);
  clip-path: polygon(0 100%, 100% 8%, 100% 100%);
}

.hosts-section::before {
  top: -92px;
  height: 92px;
  background: #070707;
  clip-path: polygon(0 8%, 100% 100%, 0 100%);
}

.email-cta-section::before {
  top: -92px;
  height: 92px;
  background: #111;
  clip-path: polygon(0 100%, 100% 8%, 100% 100%);
}


/* v12 remove seam above hosts section */
.hosts-section {
  margin-top: -2px;
}

.hosts-section::before {
  top: -94px;
  height: 96px;
}