:root{
  --ivory:#FBF7EF;
  --ivory-2:#F4EDE0;
  --plum:#5C1F3B;
  --plum-2:#7A2C4C;
  --plum-dark:#200B14;
  --plum-dark-2:#331020;
  --gold:#C69A2C;
  --gold-light:#E7CE84;
  --ink:#241A18;
  --ink-soft:#5E5450;
  --rose:#EADFD1;
  --radius:14px;
  --shadow-soft: 0 18px 40px -18px rgba(32,11,20,0.25);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter',sans-serif;
  color:var(--ink);
  background:var(--ivory);
  -webkit-font-smoothing:antialiased;
}html, body {
  overflow-x: hidden;
}
h1,h2,h3,h4,.font-display{
  font-family:'Fraunces',serif;
  letter-spacing:-0.01em;
}
.eyebrow{
  font-family:'Inter',sans-serif;
  font-weight:700;
  font-size:.72rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold);
}
.eyebrow.on-dark{color:var(--gold-light);}
a{text-decoration:none;}
.section{padding:5.5rem 0;}
.section-tight{padding:3.5rem 0;}
.bg-ivory-2{background:var(--ivory-2);}
.btn-plum{
  background:var(--plum);
  border:1px solid var(--plum);
  color:#fff;
  font-weight:600;
  border-radius:999px;
  padding:.7rem 1.6rem;
  transition:.25s ease;
}
.btn-plum:hover{background:var(--plum-2);border-color:var(--plum-2);color:#fff;}
.btn-gold{
  background:var(--gold);
  border:1px solid var(--gold);
  color:var(--plum-dark);
  font-weight:700;
  border-radius:999px;
  padding:.7rem 1.6rem;
  transition:.25s ease;
}
.btn-gold:hover{background:var(--gold-light);border-color:var(--gold-light);color:var(--plum-dark);}
.btn-outline-cream{
  background:transparent;
  border:1px solid rgba(255,255,255,.55);
  color:#fff;
  font-weight:600;
  border-radius:999px;
  padding:.65rem 1.5rem;
  transition:.25s ease;
}
.btn-outline-cream:hover{background:rgba(255,255,255,.12);color:#fff;}

/* ===== NAVBAR ===== */
.navbar-major{
  padding:.85rem 0;
  background:rgba(251,247,239,.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(32,11,20,.06);
  transition:.3s ease;
}
.navbar-major .navbar-brand img{height:44px;width:auto;}
.navbar-major .navbar-brand .brand-word{
  font-family:'Fraunces',serif;
  font-weight:600;
  font-size:1.15rem;
  color:var(--plum);
  margin-left:.6rem;
}
.navbar-major .nav-link{
  font-weight:600;
  font-size:.92rem;
  color:var(--ink)!important;
  margin:0 .55rem;
  position:relative;
  padding:.4rem .2rem!important;
}
.navbar-major .nav-link::after{
  content:"";
  position:absolute;left:0;bottom:0;
  width:0;height:2px;background:var(--gold);
  transition:.25s ease;
}
.navbar-major .nav-link:hover::after,
.navbar-major .nav-link.active::after{width:100%;}
.nav-icon-btn{
  width:40px;height:40px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(32,11,20,.12);
  color:var(--ink);position:relative;
  transition:.25s ease;
}
.nav-icon-btn:hover{background:var(--plum);color:#fff;border-color:var(--plum);}
button.nav-icon-btn{background:transparent;padding:0;cursor:pointer;}
.cart-badge{
  position:absolute;top:-6px;right:-6px;
  background:var(--gold);color:var(--plum-dark);
  font-size:.65rem;font-weight:800;
  width:19px;height:19px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:2px solid var(--ivory);
}
.btn-ringtone-top{
  border-radius:999px;font-weight:700;font-size:.82rem;
  padding:.5rem 1.1rem;background:var(--plum);color:#fff;border:none;
  display:inline-flex;align-items:center;gap:.4rem;
}
.btn-ringtone-top:hover{background:var(--plum-2);color:#fff;}

/* ===== HERO / BANNER (dark) ===== */
.hero-carousel{position:relative;margin-top:74px;}
.hero-slide{
  min-height:88vh;
  display:flex;align-items:center;
  position:relative;overflow:hidden;
  background:radial-gradient(120% 140% at 15% 15%, var(--plum-2) 0%, var(--plum-dark-2) 45%, var(--plum-dark) 100%);
}
.hero-slide.slide-b{background:radial-gradient(120% 140% at 85% 20%, var(--plum-2) 0%, var(--plum-dark-2) 48%, var(--plum-dark) 100%);}
.hero-slide.slide-c{background:radial-gradient(120% 140% at 50% 85%, var(--plum-2) 0%, var(--plum-dark-2) 48%, var(--plum-dark) 100%);}

.sunrise-rays{
  position:absolute;left:50%;bottom:-25%;
  width:1400px;height:1400px;
  transform:translateX(-50%);
  opacity:.35;
  animation:raySpin 90s linear infinite;
  pointer-events:none;
}
@keyframes raySpin{from{transform:translateX(-50%) rotate(0deg);}to{transform:translateX(-50%) rotate(360deg);}}
@media (prefers-reduced-motion:reduce){.sunrise-rays{animation:none;}}

.hero-slide::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 100%, rgba(198,154,44,.25), transparent 60%);
}
.hero-content{position:relative;z-index:2;color:#fff;padding:2rem 0;}
.hero-content .eyebrow-line{
  display:inline-flex;align-items:center;gap:.6rem;
  color:var(--gold-light);font-weight:700;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;
  margin-bottom:1rem;
}
.hero-content .eyebrow-line::before{content:"";width:34px;height:1px;background:var(--gold-light);}
.hero-title{
  font-size:clamp(2.1rem,4.6vw,3.6rem);
  font-weight:600;
  line-height:1.08;
  margin-bottom:1.1rem;
}
.hero-title em{font-style:italic;color:var(--gold-light);}
.hero-sub{
  font-size:1.05rem;color:rgba(255,255,255,.78);
  max-width:560px;margin-bottom:2rem;font-weight:400;
}
/* swipe caption animation, re-triggers on every active slide */
.carousel-item .hero-content > *{
  opacity:0;transform:translateY(26px);
}
.carousel-item.active .hero-content .eyebrow-line{animation:capUp .7s .15s ease forwards;}
.carousel-item.active .hero-content .hero-title{animation:capUp .8s .3s ease forwards;}
.carousel-item.active .hero-content .hero-sub{animation:capUp .8s .48s ease forwards;}
.carousel-item.active .hero-content .hero-cta{animation:capUp .8s .64s ease forwards;}
@keyframes capUp{to{opacity:1;transform:translateY(0);}}

.hero-carousel .carousel-control-prev,
.hero-carousel .carousel-control-next{width:5%;opacity:.6;}
.hero-carousel .carousel-control-prev:hover,
.hero-carousel .carousel-control-next:hover{opacity:1;}
.hero-carousel .carousel-indicators{bottom:26px;}
.hero-carousel .carousel-indicators [data-bs-target]{
  width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.4);border:none;margin:0 5px;
}
.hero-carousel .carousel-indicators .active{background:var(--gold);}

/* Album art disc in hero */
.disc-wrap{position:relative;z-index:2;display:flex;justify-content:center;}
.disc{
  /*width:280px;height:280px;*/width:auto;height:auto;border-radius:50%;
  background:conic-gradient(from 0deg, #1a0910, #3a1424, #1a0910 40%, #3a1424 60%, #1a0910);
  box-shadow:0 30px 60px -18px rgba(0,0,0,.55), 0 0 0 10px rgba(255,255,255,.03);
  display:flex;align-items:center;justify-content:center;
  animation:spinDisc 14s linear infinite;
}
@media (prefers-reduced-motion:reduce){.disc{animation:none;}}
@keyframes spinDisc{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.disc-inner{
  width:90px;height:90px;border-radius:50%;
  background:var(--gold);
  display:flex;align-items:center;justify-content:center;
  color:var(--plum-dark);font-size:1.6rem;
  box-shadow:inset 0 0 0 3px rgba(0,0,0,.15);
}

/* ===== HOME MESSAGE PANEL (spotlight, right after hero) ===== */
.spotlight-section{
  padding-top:3.5rem;
  background:linear-gradient(180deg, var(--plum-dark) 0%, var(--plum-dark) 40%, var(--ivory) 40%, var(--ivory) 100%);
}
.message-panel{
  background:linear-gradient(135deg, var(--plum-dark-2) 0%, var(--plum) 55%, var(--plum-2) 100%);
  border:1px solid rgba(231,206,132,.25);
  border-radius:24px;
  box-shadow:0 30px 70px -20px rgba(32,11,20,.55), 0 0 0 1px rgba(231,206,132,.08);
  padding:3.2rem 3.2rem;
  position:relative;
  overflow:hidden;
  color:#fff;
}
.message-panel::before{
  content:"";position:absolute;top:0;left:0;width:7px;height:100%;background:var(--gold);
}
.message-panel .msg-rays{
  position:absolute;left:50%;bottom:-60%;width:1100px;height:1100px;
  transform:translateX(-50%);opacity:.22;pointer-events:none;
}
.message-ribbon{
  position:absolute;top:0;right:0;
  background:var(--gold);color:var(--plum-dark);
  font-weight:800;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;
  padding:.55rem 1.4rem;border-bottom-left-radius:14px;
  display:flex;align-items:center;gap:.4rem;
  z-index:2;
}
.message-kicker{
  font-family:'Fraunces',serif;font-style:italic;font-weight:500;
  color:var(--gold-light);font-size:1.15rem;margin-bottom:.5rem;position:relative;z-index:2;
}
.message-title{
  font-size:clamp(1.8rem,3.4vw,2.6rem);
  color:#fff;
  font-weight:700;line-height:1.18;margin-bottom:1.1rem;
  position:relative;z-index:2;
}
.message-desc{color:rgba(255,255,255,.82);position:relative;z-index:2;}
.price-pill{
  display:inline-flex;align-items:baseline;gap:.35rem;
  background:var(--gold);color:var(--plum-dark);border-radius:999px;
  padding:.6rem 1.4rem;font-weight:800;
  box-shadow:0 0 0 6px rgba(198,154,44,.18);
  animation:pillPulse 2.4s ease-in-out infinite;
  position:relative;z-index:2;
}
@keyframes pillPulse{
  0%,100%{box-shadow:0 0 0 6px rgba(198,154,44,.18);}
  50%{box-shadow:0 0 0 12px rgba(198,154,44,.06);}
}
@media (prefers-reduced-motion:reduce){.price-pill{animation:none;}}
.price-pill .amt{font-family:'Fraunces',serif;font-size:1.6rem;}
.price-pill .tag{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--plum-dark);opacity:.75;}
.countdown-box{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  border-radius:14px;padding:1rem 1.2rem;
  display:flex;gap:1.4rem;flex-wrap:wrap;position:relative;z-index:2;
}
.countdown-box .cd-item{text-align:center;min-width:56px;}
.countdown-box .cd-num{font-family:'Fraunces',serif;font-size:1.6rem;color:var(--gold-light);font-weight:700;line-height:1;}
.countdown-box .cd-label{font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.65);}

.countdown-box-lg{
  justify-content:center;
  gap:clamp(1.4rem,4vw,3.4rem);
  padding:2.2rem clamp(1.4rem,5vw,3rem);
  border-radius:20px;
  background:rgba(255,255,255,.1);
  border:1px solid rgba(231,206,132,.3);
  box-shadow:0 0 0 8px rgba(231,206,132,.06);
}
.countdown-box-lg .cd-item{min-width:80px;}
.countdown-box-lg .cd-num{font-size:clamp(2.6rem,6vw,4.2rem);}
.countdown-box-lg .cd-label{font-size:.8rem;}

/* ===== FEATURED RELEASE ===== */
.featured-cover{
  max-width:640px;border-radius:20px;overflow:hidden;
  box-shadow:var(--shadow-soft);border:1px solid rgba(32,11,20,.08);
}
.featured-cover img{width:100%;height:auto;display:block;}
.featured-text{max-width:640px;}
.featured-note{
  font-weight:700;color:var(--plum-2);text-transform:uppercase;
  letter-spacing:.04em;font-size:.95rem;
}
.featured-song-title{
  font-family:'Fraunces',serif;font-weight:700;color:var(--plum);font-size:clamp(1.3rem,2.4vw,1.7rem);
}
.featured-audio{max-width:520px;}
.featured-audio audio{border-radius:999px;}

/* ===== FEATURES / RINGTONE LIST ===== */
.ringtone-row{
  display:flex;align-items:center;gap:1.1rem;
  padding:1.1rem 1.3rem;
  border-radius:14px;
  border:1px solid rgba(32,11,20,.07);
  background:#fff;
  transition:.25s ease;
}
.ringtone-row:hover{
  border-color:var(--gold);
  box-shadow:var(--shadow-soft);
  transform:translateY(-2px);
}
.rt-index{
  font-family:'Fraunces',serif;font-weight:600;color:var(--gold);
  font-size:1.1rem;width:34px;flex-shrink:0;
}
.rt-play-text-btn{
  border-radius:999px;border:1px solid var(--gold);color:var(--plum-dark);
  background:var(--gold-light);font-weight:700;font-size:.82rem;
  padding:.45rem 1rem;display:inline-flex;align-items:center;gap:.4rem;
  transition:.2s ease;white-space:nowrap;flex-shrink:0;
}
.rt-play-text-btn:hover{background:var(--gold);border-color:var(--gold);}
.rt-play-text-btn.playing{background:var(--plum);border-color:var(--plum);color:#fff;}
.rt-info{flex:1;min-width:0;}
.rt-title{font-weight:700;color:var(--ink);margin-bottom:.1rem;}
.rt-sub{font-size:.78rem;color:var(--ink-soft);}
.rt-price{
  font-family:'Fraunces',serif;font-weight:700;color:var(--plum);
  font-size:1.05rem;min-width:64px;text-align:right;
}
.rt-free-badge{
  font-family:'Inter',sans-serif;font-weight:800;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;
  color:var(--plum);background:var(--ivory-2);border:1px solid rgba(92,31,59,.18);
  border-radius:999px;padding:.35rem .8rem;min-width:64px;text-align:center;flex-shrink:0;
}
.view-all-bar{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;
  margin-bottom:1.8rem;
}
.btn-view-all{
  border-radius:999px;border:1px solid var(--plum);color:var(--plum);background:transparent;
  font-weight:700;font-size:.85rem;padding:.6rem 1.3rem;display:inline-flex;align-items:center;gap:.4rem;
  transition:.2s ease;white-space:nowrap;
}
.btn-view-all:hover{background:var(--plum);color:#fff;}
.rt-dl-btn{
  border-radius:999px;border:1px solid var(--plum);color:var(--plum);
  background:transparent;font-weight:600;font-size:.82rem;
  padding:.45rem 1rem;display:inline-flex;align-items:center;gap:.4rem;
  transition:.2s ease;white-space:nowrap;
}
.rt-dl-btn:hover{background:var(--plum);color:#fff;}

/* ===== SHOP ===== */
.shop-card{
  background:#fff;border-radius:18px;overflow:hidden;
  border:1px solid rgba(32,11,20,.07);
  box-shadow:var(--shadow-soft);
  height:100%;display:flex;flex-direction:column;
}
.shop-card .shop-img-wrap{
  aspect-ratio:1/1;overflow:hidden;background:var(--ivory-2);position:relative;
}
.shop-card .shop-img-wrap img{
  width:100%;height:100%;object-fit:cover;transition:.5s ease;
}
.shop-card:hover .shop-img-wrap img{transform:scale(1.06);}
.shop-badge{
  position:absolute;top:14px;left:14px;
  background:var(--gold);color:var(--plum-dark);
  font-size:.7rem;font-weight:800;letter-spacing:.05em;
  padding:.3rem .65rem;border-radius:999px;text-transform:uppercase;
}
.shop-body{padding:1.4rem;display:flex;flex-direction:column;gap:.6rem;flex:1;}
.shop-title{font-weight:700;font-size:1.02rem;color:var(--ink);}
.shop-genre{font-size:.78rem;color:var(--ink-soft);}
.shop-foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;}
.shop-price{font-family:'Fraunces',serif;font-weight:700;color:var(--plum);font-size:1.25rem;}

/* ===== ABOUT ===== */
.about-figure{
  border-radius:20px;overflow:hidden;position:relative;
  background:linear-gradient(160deg,var(--plum) 0%, var(--plum-dark) 100%);
  aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;
}
.about-figure .sunrise-rays{opacity:.4;}
.about-stats{display:flex;gap:2.2rem;flex-wrap:wrap;margin-top:1.8rem;}
.about-stats .stat-num{font-family:'Fraunces',serif;font-size:2rem;color:var(--plum);font-weight:700;}
.about-stats .stat-label{font-size:.78rem;color:var(--ink-soft);letter-spacing:.03em;}

/* ===== SERVICES ===== */
.service-card{
  background:#fff;border-radius:16px;padding:2rem 1.6rem;
  border:1px solid rgba(32,11,20,.07);height:100%;
  transition:.25s ease;
}
.service-card:hover{border-color:var(--gold);box-shadow:var(--shadow-soft);transform:translateY(-3px);}
.service-icon{
  width:52px;height:52px;border-radius:14px;
  background:var(--plum);color:var(--gold-light);
  display:flex;align-items:center;justify-content:center;font-size:1.3rem;
  margin-bottom:1.1rem;
}

/* ===== STUDIO GEAR MARQUEE ===== */
.logo-marquee-section{background:var(--ivory);}
.logo-marquee{
  overflow:hidden;position:relative;width:100%;
  -webkit-mask-image:linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
  mask-image:linear-gradient(to right, transparent 0, #000 8%, #000 92%, transparent 100%);
}
.logo-track{
  display:flex;align-items:center;width:max-content;
  animation:logoScroll 26s linear infinite;
}
.logo-marquee:hover .logo-track{animation-play-state:paused;}
@keyframes logoScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.logo-track{animation:none;}}
.logo-chip{
  display:inline-flex;align-items:center;gap:.6rem;
  white-space:nowrap;padding:0 2.4rem;
  font-family:'Fraunces',serif;font-weight:700;font-size:1.35rem;
  color:var(--plum);opacity:1;letter-spacing:.01em;
  transition:.25s ease;
}
.logo-chip i{font-size:1.1rem;color:var(--gold);}
.logo-chip:hover{color:var(--plum-2);transform:scale(1.05);}

/* ===== NEWSLETTER ===== */
.newsletter-band{
  background:linear-gradient(120deg,var(--plum-dark) 0%, var(--plum) 100%);
  border-radius:24px;padding:3rem;color:#fff;position:relative;overflow:hidden;
}
.newsletter-band .sunrise-rays{width:900px;height:900px;bottom:-45%;opacity:.25;}
.newsletter-form .form-control{
  border-radius:999px;border:none;padding:.85rem 1.3rem;
}
.newsletter-form .btn-gold{padding:.85rem 1.6rem;}

/* ===== CONTACT ===== */
.contact-info-item{display:flex;gap:1rem;align-items:flex-start;margin-bottom:1.4rem;}
.contact-info-item i{
  width:42px;height:42px;border-radius:50%;background:var(--ivory-2);
  display:flex;align-items:center;justify-content:center;color:var(--plum);flex-shrink:0;
}
.contact-form .form-control{
  border-radius:10px;border:1px solid rgba(32,11,20,.15);padding:.75rem 1rem;
}
.contact-form .form-control:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(198,154,44,.15);}

/* ===== FOOTER (dark) ===== */
footer.site-footer{
  background:var(--plum-dark);color:rgba(255,255,255,.72);padding:3.5rem 0 1.5rem;
}
.site-footer .footer-logo{
  height:40px;margin-bottom:1rem;
  background:var(--ivory);border-radius:8px;padding:.4rem .7rem;display:inline-block;
}
.site-footer h6{color:#fff;font-weight:700;letter-spacing:.05em;font-size:.85rem;text-transform:uppercase;margin-bottom:1.1rem;}
.site-footer a{color:rgba(255,255,255,.68);}
.site-footer a:hover{color:var(--gold-light);}
.footer-social a{
  width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.18);
  display:inline-flex;align-items:center;justify-content:center;margin-right:.5rem;
}
.footer-social a:hover{background:var(--gold);color:var(--plum-dark);border-color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:2.4rem;padding-top:1.3rem;font-size:.82rem;}

/* ===== MODALS ===== */
.modal-content.modal-major{border-radius:20px;border:none;overflow:hidden;}
.modal-song-header{
  background:linear-gradient(120deg,var(--plum-dark) 0%, var(--plum) 100%);
  color:#fff;padding:2rem;position:relative;
}
.modal-song-header .sunrise-rays{width:700px;height:700px;bottom:-55%;opacity:.3;}
.modal-song-header .btn-close{filter:invert(1);position:relative;z-index:2;}
.modal-album-disc{
  width:74px;height:74px;border-radius:50%;
  background:conic-gradient(from 0deg,#1a0910,#3a1424,#1a0910 40%,#3a1424 60%,#1a0910);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  animation:spinDisc 10s linear infinite;
}
@media (prefers-reduced-motion:reduce){.modal-album-disc{animation:none;}}
.modal-album-disc span{
  width:24px;height:24px;border-radius:50%;background:var(--gold);
}
.section-title-wrap{margin-bottom:2.6rem;}
.section-title{color:var(--plum);font-weight:700;font-size:clamp(1.6rem,3vw,2.2rem);}
.section-desc{color:var(--ink-soft);max-width:560px;}
/* ===== HAPPY BIRTHDAY 1-MORE TIME CAMPAIGN ===== */
.hb-record-wrap{
  display:inline-block;padding:1rem;border-radius:50%;
  background:radial-gradient(circle at 30% 30%, rgba(198,154,44,.18), transparent 65%);
}
.hb-record-img{
  width:100%;max-width:420px;border-radius:50%;
  box-shadow:0 30px 60px -20px rgba(32,11,20,.45);
}
.hb-songs-panel{
  background:linear-gradient(135deg, var(--plum-dark-2) 0%, var(--plum) 55%, var(--plum-2) 100%);
  border:1px solid rgba(231,206,132,.25);
  border-radius:24px;
  box-shadow:0 30px 70px -20px rgba(32,11,20,.55);
  padding:2.8rem clamp(1.6rem,4vw,3.2rem);
  color:#fff;
}
.hb-songs-title{
  font-family:'Fraunces',serif;font-weight:700;
  font-size:clamp(1.4rem,2.6vw,1.9rem);color:var(--gold-light);
}
.hb-info-card{
  height:100%;background:#fff;border:1px solid rgba(92,31,59,.1);
  border-radius:18px;padding:2rem;box-shadow:0 20px 40px -28px rgba(36,26,24,.25);
}
.hb-info-icon{font-size:1.8rem;color:var(--gold);margin-bottom:.8rem;display:block;}
.hb-info-card h4{color:var(--plum);font-weight:700;margin-bottom:.6rem;}
.hb-info-card p{color:var(--ink-soft);margin-bottom:0;font-size:.95rem;}
.hb-offer-banner{
  margin-top:2.5rem;background:var(--ivory-2);border:1px dashed var(--gold);
  border-radius:18px;padding:2rem clamp(1.4rem,4vw,2.4rem);
}
.hb-offer-banner h4{color:var(--plum);}
.hb-offer-banner p{color:var(--ink-soft);font-size:.95rem;}
.hb-contact-strip{margin-top:2.5rem;padding-top:2rem;border-top:1px solid rgba(92,31,59,.12);}
.hb-contact-item{display:flex;align-items:center;gap:.9rem;}
.hb-contact-item i{font-size:1.4rem;color:var(--gold);flex-shrink:0;}
.hb-contact-item span{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);}
.hb-contact-item a{color:var(--plum);font-weight:700;text-decoration:none;}
.hb-contact-item a:hover{color:var(--gold);}
.hb-signoff{color:var(--ink-soft);font-style:italic;max-width:640px;margin-left:auto;margin-right:auto;}

/* ======================================================================
   RESPONSIVE / MOBILE & TABLET
   Breakpoints follow Bootstrap 5: <576 phones, 576-767 large phones,
   768-991 tablets, >=992 the existing (already-fine) desktop layout is
   untouched.
   ====================================================================== */

/* ---- Global: a bit more breathing room off the screen edges on phones,
   Bootstrap's default 12px container gutter reads as "text touching the
   edge" once headings get big. ---- */
@media (max-width:575.98px){
  .container{padding-left:1.35rem;padding-right:1.35rem;}
}

/* ---- NAVBAR ---- */
@media (max-width:991.98px){
  .navbar-major{padding:.65rem 0;}
  .navbar-major .navbar-brand img{height:36px;}
  .nav-icon-btn{width:38px;height:38px;flex-shrink:0;}

  /* The collapsing menu previously had no background, so it floated as
     transparent text on top of whatever section sat underneath it. Give it
     a solid card so it reads as an actual menu. */
  .navbar-major .navbar-collapse{
    background:var(--ivory);
    margin-top:.85rem;
    padding:1.1rem 1.25rem 1.4rem;
    border-radius:var(--radius);
    box-shadow:var(--shadow-soft);
    border:1px solid rgba(32,11,20,.08);
    max-height:calc(100vh - 90px);
    overflow-y:auto;
  }
  .navbar-major .navbar-nav{width:100%;}
  .navbar-major .nav-link{
    margin:0;
    padding:.7rem .3rem!important;
    border-bottom:1px solid rgba(32,11,20,.07);
  }
  .navbar-major .navbar-nav .nav-item:last-child .nav-link{border-bottom:none;}
  .navbar-major .navbar-nav .nav-link::after{display:none;} /* underline hover effect is a desktop-only affordance */
  .navbar-major .btn-ringtone-top{width:100%;justify-content:center;}
}
@media (max-width:400px){
  .navbar-major .navbar-brand img{height:32px;}
}

/* ---- HERO ---- */
@media (max-width:991.98px){
  .hero-carousel{margin-top:64px;}
  .hero-slide{min-height:0;padding:3.5rem 0 3rem;}
  .hero-content{padding:1rem 0;text-align:center;}
  .hero-content .eyebrow-line{justify-content:center;}
  .hero-cta{justify-content:center;}
  .disc-wrap{margin-top:1rem;}
  .disc-wrap .disc{width:220px;height:220px;}
}
@media (max-width:575.98px){
  .hero-slide{padding:2.75rem 0 2.5rem;}
  .hero-title{font-size:clamp(1.9rem,9vw,2.4rem);}
  .hero-sub{font-size:.95rem;margin-left:auto;margin-right:auto;}
  .hero-cta{flex-direction:column;align-items:stretch;gap:.75rem!important;}
  .hero-cta .btn-gold,
  .hero-cta .btn-outline-cream{width:100%;justify-content:center;text-align:center;}
  .disc-wrap .disc{width:170px;height:170px;}
  .disc-inner{width:64px;height:64px;font-size:1.2rem;}
}

/* ---- SECTION SPACING ---- */
@media (max-width:767.98px){
  .section{padding:3.5rem 0;}
  .section-tight{padding:2.25rem 0;}
  .section-title-wrap{margin-bottom:1.8rem;}
}

/* ---- MESSAGE / COUNTDOWN PANEL ---- */
@media (max-width:767.98px){
  .message-panel{padding:2.2rem 1.4rem;}
  .message-ribbon{
    position:static;
    display:inline-flex;
    border-radius:999px;
    margin-bottom:1rem;
  }
}
@media (max-width:575.98px){
  .countdown-box-lg{gap:.9rem;padding:1.4rem 1rem;}
  .countdown-box-lg .cd-item{min-width:56px;}
  .countdown-box-lg .cd-num{font-size:clamp(1.9rem,9vw,2.6rem);}
}

/* ---- HB CAMPAIGN PANEL ---- */
@media (max-width:575.98px){
  .hb-songs-panel{padding:2rem 1.25rem;}
  .hb-offer-banner{padding:1.5rem 1.25rem;}
  .hb-record-img{max-width:260px;}
}

/* ---- RINGTONE LIST ---- */
@media (max-width:575.98px){
  .ringtone-row{flex-wrap:wrap;row-gap:.7rem;padding:1rem;}
  .rt-index{display:none;}
  .rt-info{flex:1 1 100%;}
  .rt-free-badge{order:1;}
  .rt-play-text-btn{order:2;flex:1 1 auto;justify-content:center;white-space:normal;}
  .rt-dl-btn{order:3;flex:1 1 auto;justify-content:center;white-space:normal;}
}

/* ---- NEWSLETTER ---- */
@media (max-width:575.98px){
  .newsletter-band{padding:2rem 1.25rem;border-radius:18px;}
}

/* ---- MODALS ---- */
@media (max-width:575.98px){
  .modal-song-header{padding:1.4rem;}
}

/* ---- FOOTER ---- */
@media (max-width:767.98px){
  footer.site-footer{padding:2.75rem 0 1.25rem;text-align:left;}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:.5rem;}
}

/* ======================================================================
   ULTRA-WIDE / LARGE DESKTOP (>=1400px)
   Bootstrap freezes .container at max-width:1320px from 1400px upward, so
   on anything wider than ~1600px the container stays put and the rest of
   the viewport just becomes empty side margins that keep growing — the
   layout reads as "squeezed" into a shrinking band in the middle of the
   screen. This keeps the container scaling with the viewport (roughly the
   same edge-to-content ratio you get at 1600px) instead of capping out,
   up to a generous ceiling so text lines don't get unreadably wide on very
   large monitors. Below 1400px this has no effect — untouched. ---- */
@media (min-width:1400px){
  .container{
    max-width:clamp(1320px, 84vw, 2400px);
  }
}