/* ASYLUM RADIO LIVE — home Ads & Sponsors professional layout.
   Isolated to .ad-zone: do not affect global header/footer or video/chat. */
.home-page .ad-zone {
  box-sizing:border-box;
  width:100%; max-width:100%;
  margin:24px auto 38px;
  padding:clamp(20px,2.5vw,34px);
  border:1px solid #354754;
  border-radius:20px;
  background:linear-gradient(155deg,#111b24 0%,#0e151c 100%);
  box-shadow:0 12px 32px rgba(0,0,0,.18);
}
.home-page .ad-zone .ad-zone-head {
  box-sizing:border-box;
  width:100%; max-width:none; margin:0 0 20px;
  display:flex; gap:18px; flex-wrap:wrap; align-items:end; justify-content:space-between;
}
.home-page .ad-zone .ad-zone-head .eyebrow {
  margin:0 0 5px; color:#8cdfe1; font-size:.74rem; font-weight:800;
  letter-spacing:.14em; text-transform:uppercase;
}
.home-page .ad-zone .ad-zone-head h2 {
  margin:0; font-size:clamp(1.8rem,3.1vw,2.7rem);
  line-height:1.08; font-weight:900; letter-spacing:-.025em;
  text-transform:uppercase; color:#f5f8fa;
}
.home-page .ad-zone .ad-zone-actions {display:flex; align-items:center; flex-wrap:wrap; gap:10px; justify-content:flex-start}
.home-page .ad-zone .ad-zone-actions .button {
  box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center;
  min-height:42px; padding:10px 17px; border-radius:9px;
  font-size:.85rem; font-weight:800; line-height:1.2; text-align:center;
  white-space:normal; text-decoration:none;
}
.home-page .ad-zone .sponsor-ticker {
  width:100%;max-width:none; margin:0 0 18px;
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;
}
.home-page .ad-zone .sponsor-ticker span {
  box-sizing:border-box; display:flex;align-items:center;justify-content:center;
  min-width:0;min-height:48px; padding:10px 9px;
  border:1px solid #3c5260;border-radius:10px;
  background:#182631; color:#e3eef0; font-size:.74rem; font-weight:800;
  line-height:1.3; letter-spacing:.045em; text-align:center;
  text-wrap:balance;white-space:normal; text-transform:uppercase;
}
/* Four matching cards: the two promotional images above, support and music below. */
.home-page .ad-zone .promo-grid {
  box-sizing:border-box;display:grid!important;
  width:100%!important;max-width:none!important;margin:0!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  grid-template-areas:'host submit' 'support music';
  gap:16px!important;align-items:stretch!important;
}
.home-page .ad-zone .promo-grid > * {min-width:0!important;max-width:100%;box-sizing:border-box;}
.home-page .ad-zone .promo-grid > .promo-host {grid-area:host;}
.home-page .ad-zone .promo-grid > .promo-community-ad {grid-area:submit;}
.home-page .ad-zone .promo-grid > .donation-card {grid-area:support;}
.home-page .ad-zone .promo-grid > .promo-music {grid-area:music;}
.home-page .ad-zone .promo-grid > a.promo {
  display:flex!important;flex-direction:column!important;
  overflow:hidden;min-height:286px!important;height:auto!important;
  border:1px solid #405460;border-radius:15px;
  background:linear-gradient(145deg,#172530,#101a23);
  text-decoration:none; transition:border-color .18s ease, transform .18s ease;
}
.home-page .ad-zone .promo-grid > a.promo:is(:hover,:focus-visible) {
  border-color:#6fc8d3;transform:translateY(-2px);
}
.home-page .ad-zone .promo-grid > a.promo .promo-label {
  box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;
  flex:0 0 auto;min-height:50px;padding:13px 18px;
  border-bottom:1px solid #2b414e;
  color:#f3f8f9;font-size:.87rem;font-weight:900;
  letter-spacing:.06em;line-height:1.25;text-transform:uppercase;
}
.home-page .ad-zone .promo-grid > a.promo img,
.home-page .ad-zone .promo-grid > a.promo video {
  box-sizing:border-box;display:block;
  flex:1 1 auto!important;width:100%!important;height:222px!important;
  min-height:222px!important;max-height:265px!important;
  padding:12px!important;aspect-ratio:auto!important;
  background:#0c131a;object-fit:contain!important;
}
.home-page .ad-zone .promo-grid > .donation-card,
.home-page .ad-zone .promo-grid > .promo-music {
  display:flex!important;flex-direction:column!important;align-items:stretch!important;
  height:100%!important;min-height:266px!important;
  padding:24px!important;gap:0!important;
  border:1px solid #405460;border-radius:15px;
  box-shadow:none;
}
.home-page .ad-zone .promo-grid > .donation-card {
  justify-content:flex-start!important;
  background:linear-gradient(145deg,#1a2b32,#122027);
}
.home-page .ad-zone .donation-card .eyebrow,
.home-page .ad-zone .promo-music .eyebrow {
  margin:0 0 7px;color:#b5e9d1;font-size:.74rem;font-weight:850;letter-spacing:.11em;
  line-height:1.2;text-transform:uppercase;
}
.home-page .ad-zone .donation-card h3,
.home-page .ad-zone .promo-music h2 {
  margin:0;color:#f5f8f9;font-size:clamp(1.45rem,2.2vw,1.88rem);
  line-height:1.13;font-weight:900;letter-spacing:-.015em;text-transform:uppercase;
}
.home-page .ad-zone .donation-card p:not(.eyebrow),
.home-page .ad-zone .promo-music p:not(.eyebrow) {
  margin:12px 0 20px; color:#cbd8dc;
  font-size:.95rem;line-height:1.5;
}
.home-page .ad-zone .donation-amounts {
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;
  margin-top:auto;
}
.home-page .ad-zone .donation-amounts button {min-width:0;min-height:43px;font-size:.91rem;}
.home-page .ad-zone .donation-action {
  display:inline-flex;justify-content:center;align-items:center;
  width:100%;min-height:43px;margin-top:12px;
  border-radius:9px;font-size:.9rem;
}
.home-page .ad-zone .donation-card small {margin-top:10px;font-size:.74rem;line-height:1.4;}
.home-page .ad-zone .promo-grid > .promo-music {
  background:linear-gradient(145deg,#1e2836,#121c29);
}
.home-page .ad-zone .promo-music > div {width:100%;min-width:0;}
.home-page .ad-zone .promo-music .button {
  align-self:flex-start;min-height:43px;display:inline-flex;align-items:center;
  justify-content:center;margin-top:auto;padding:10px 18px;
  font-size:.9rem;font-weight:850;border-radius:9px;
  white-space:normal;
}
@media(max-width:760px){
  .home-page .ad-zone {padding:18px 14px;border-radius:15px;}
  .home-page .ad-zone .ad-zone-head {align-items:start;gap:14px;}
  .home-page .ad-zone .ad-zone-actions {width:100%;}
  .home-page .ad-zone .sponsor-ticker {grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
  .home-page .ad-zone .sponsor-ticker span {min-height:42px;}
  .home-page .ad-zone .promo-grid {
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-areas:'host' 'submit' 'support' 'music'!important;
    gap:12px!important;
  }
  .home-page .ad-zone .promo-grid > a.promo {min-height:0!important;}
  .home-page .ad-zone .promo-grid > a.promo img,
  .home-page .ad-zone .promo-grid > a.promo video {height:195px!important;min-height:195px!important;max-height:250px!important;}
  .home-page .ad-zone .promo-grid > .donation-card,
  .home-page .ad-zone .promo-grid > .promo-music {min-height:0!important;padding:20px!important;}
  .home-page .ad-zone .promo-music .button {margin-top:4px;}
}
@media(max-width:385px){
  .home-page .ad-zone .ad-zone-actions {flex-direction:column;align-items:stretch;}
  .home-page .ad-zone .ad-zone-actions .button {width:100%;}
  .home-page .ad-zone .sponsor-ticker span {font-size:.66rem;}
  .home-page .ad-zone .donation-amounts {gap:5px;}
}
@media(prefers-reduced-motion:reduce){
  .home-page .ad-zone .promo-grid > a.promo {transition:none;}
  .home-page .ad-zone .promo-grid > a.promo:is(:hover,:focus-visible){transform:none;}
}

/* 2026-10-12: Ads & Sponsors artwork-only rotating banner slots.
   The promo label strips are removed from the HTML. These styles only
   affect the first two ad slots, not the donation or music CTA cards. */
.home-page .ad-zone .promo-grid > a.promo.promo-host,
.home-page .ad-zone .promo-grid > a.promo.promo-community-ad {
  position:relative;
  display:flex!important;
  align-items:center;
  justify-content:center;
  aspect-ratio:2.6/1;
  min-height:0!important;
  height:auto!important;
  padding:0!important;
  background:#0a1118;
  overflow:hidden;
}
.home-page .ad-zone .promo-grid > a.promo.promo-host img,
.home-page .ad-zone .promo-grid > a.promo.promo-host video,
.home-page .ad-zone .promo-grid > a.promo.promo-community-ad img,
.home-page .ad-zone .promo-grid > a.promo.promo-community-ad video {
  display:block;
  flex:1 1 auto!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  padding:0!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  background:#0a1118!important;
}
.home-page .ad-zone .promo-grid > a.promo img[hidden],
.home-page .ad-zone .promo-grid > a.promo video[hidden] {display:none!important;}
@media(max-width:760px){
  .home-page .ad-zone .promo-grid > a.promo.promo-host,
  .home-page .ad-zone .promo-grid > a.promo.promo-community-ad {
    aspect-ratio:2/1;
    min-height:170px!important;
  }
}