/* ---------- پالت و متغیّرهای تازه ---------- */
:root{
  --accent:#ff5a5f;           /* رنگ امضای ثابت */
  --accent-light:#ff9297;
  --accent-dark:#c42f3a;
  --radius:28px;
  --shadow:0 24px 45px rgba(0,0,0,.08);
  --glass:rgba(255,255,255,.32);
}

/* ---------- افکت بلور (الهام از Ravkadeh) ---------- */
header,
.quick-link-card,
.mag-left{
  backdrop-filter:blur(14px) saturate(120%);
  background:var(--glass);
}

/* ---------- گرادینت Hero ---------- */
.featured-podcast-section::before{
  content:"";
  position:absolute;inset:0;
  z-index:-1;
  opacity:.7;
}

/* ---------- کارت‌ها: عمق و انیمیشن ---------- */
.card,
.feat-card,
.podcast-player,
.audio-poem-item{
  transition:transform .35s ease, box-shadow .35s ease;
}
.card:hover,
.feat-card:hover,
.podcast-player:hover,
.audio-poem-item:hover{
  transform:translateY(-8px) scale(1.02);
  box-shadow:0 32px 60px rgba(0,0,0,.12);
}

/* ---------- دکمه‌های پخش (micro-interaction) ---------- */
.play-btn, .audio-play-btn, .featured-podcast-card .play-icon{
  transition:transform .25s cubic-bezier(.4,1.6,.4,1),
             background .25s;
}
.play-btn:hover, .audio-play-btn:hover{
  transform:scale(1.15) rotate(4deg);
}
.featured-podcast-card:hover .play-icon{
  transform:translate(-50%,-50%) scale(1.2);
  opacity:1!important;
}

/* ---------- انیمیشن ورود عناصر در اسکرول ---------- */
[data-animate]{opacity:0;transform:translateY(40px);transition:.7s ease-out;}
[data-animate].show{opacity:1;transform:none;}

/* ---------- تایپوگرافی نرم‌تر (الهام از ChannelB) ---------- */
body{font-family:'Vazirmatn', 'Noto Sans Arabic', sans-serif;}
h2,h3{letter-spacing:-.3px;font-weight:800;}

@media (min-width:900px){
  .feat-card--hero .feat-card__img{
    aspect-ratio: 2 / 1;   /* نسبت ۱:۱ */
    height:auto;           /* می‌تواند بماند */
  }
}
/* ============ Featured Episode Card (کامل) ============ */
:root{
  --dark-bg: #0f1232;          /* رنگ پس زمینهٔ کارت */
  --primary-color: #ff6d2f;    /* نارنجی تم */
  --radius-xl: 24px;
}

/* ظرف اصلی */
.featured-episode-wrapper{
  position:relative;
  margin:120px auto 0;
  max-width:1200px;
  padding: 10px;
}

/* برچسب‌ها */
.episode-tag{
  position:absolute;
  top:-22px;
  background:var(--primary-color);
  color:#fff;
  padding:.45rem 1.2rem;
  border-radius:12px;
  display:flex;
  align-items:center;
  gap:.5rem;
  font-weight:600;
  font-size:.95rem;
  box-shadow:0 4px 12px rgba(0,0,0,.08);
  z-index:3;
}
.episode-tag.left {left:25px;}
.episode-tag.right{right:25px; cursor:pointer;}   /* اگر بعداً خواستید روی آن اسکرول کنید */

/* کارت تیره */
.featured-episode{
  position:relative;
  display:flex;
  gap:2rem;
  padding:2.5rem 2rem;
  border-radius:var(--radius-xl);
  background:var(--dark-bg);
  color:#fff;
  overflow:hidden;
}

/* لایهٔ بلوریِ پس‌زمینه برای عمق */
.featured-episode::before{
  content:"";
  position:absolute;
  inset:0;
  background:url("images/1.png") center/cover no-repeat;
  filter:blur(8px);
  opacity:.1;
}
.featured-episode::after{               /* آیکون هدفون محو گوشه چپ پایین */
  content:"\f025";
  font-family:"Font Awesome 5 Free";
  font-weight:900;
  position:absolute;
  left:38px; bottom:38px;
  font-size:60px;
  opacity:.05; color:#fff;
}
.featured-episode>*{position:relative; z-index:1;} /* لایه محتوا بالای بلور */

/* بخش متن */
.episode-content{flex:1;}
.episode-title{
  font-size:2.1rem;
  font-weight:800;
  margin-bottom:1.2rem;
  display:flex;
  align-items:center;
  gap:.6rem;
}
.episode-content p{
  line-height:2.3;
  font-size:1.05rem;
  margin:0;
}
.episode-sponsor{
  margin-top:2rem;
  display:flex;
  align-items:center;
  gap:.45rem;
  font-weight:700;
}

/* کاور سمت راست */
.episode-cover{
  position:relative;
  width:340px;
  max-width:40%;
  border-radius:var(--radius-xl);
  overflow:hidden;
  box-shadow:0 6px 18px rgba(0,0,0,.14);
}
.episode-cover img{width:100%; display:block;}



.cover-wave.top   { top:0;    transform:translateY(-1px); }
.cover-wave.bottom{ bottom:0; transform:rotate(180deg) translateY(-1px); }

/* ریسپانسیو – ستون در موبایل */
@media (max-width: 700px){
  .featured-episode{flex-direction:column;}
  .episode-cover{width:100%; max-width:100%;}
  .episode-tag.left{top:-18px; left:50%; transform:translateX(-50%);}
  .episode-tag.right{display:none;} /* برچسب راست روی موبایل پنهان می‌شود */
}
/* ============ Newsletter Card (کامل) ============ */
:root{
  --newsletter-bg: #f6f9fc;
  --newsletter-shadow: 0 12px 34px rgba(0,0,0,.06);
  --newsletter-radius: 28px;
  --headline-color:#061742;   /* سرمه‌ای تیتر */
  --primary-color:#cfcfcf;    /* نارنجی تم (قبلاً تعریف شده) */
}
.newsletter-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2.5rem;
  margin:70px auto 70px;
  max-width:1200px;
  background:var(--newsletter-bg);
  border-radius:var(--newsletter-radius);
  box-shadow:var(--newsletter-shadow);
  padding:3rem 4rem;
  flex-wrap:wrap-reverse;     /* برای رسپانسیو RTL */
}
.newsletter-body{flex:1; min-width:260px;}
.newsletter-title{
  color:var(--headline-color);
  font-size:2.3rem;
  font-weight:900;
  margin:0 0 1.2rem;
  text-align:center;
}
.newsletter-sub{
  font-size:1.08rem;
  text-align:center;
  margin-bottom:2.4rem;
  line-height:2.1;
}
/* فرم */
.newsletter-form{
  display:flex;
  flex-direction:row-reverse;     /* دکمۀ نارنجی سمت راست دیده شود در RTL */
  gap:0;
  width:100%;
}
.newsletter-form input{
  flex:1;
  padding:.9rem 1.2rem;
  border:1px solid #e3e8f0;
  border-inline-start:none;       /* حذف خط بین دکمه و اینپوت */
  border-radius:0 var(--newsletter-radius) var(--newsletter-radius) 0;
  font-size:1rem;
  outline:none;
}
.newsletter-form input::placeholder{color:#cfcfcf;}
.newsletter-form button{
  display:flex;
  gap:.4rem;
  align-items:center;
  justify-content:center;
  background:#cfcfcf;
  color:#fff;
  border:none;
  padding:.95rem 2.2rem;
  font-size:1rem;
  font-weight:600;
  border-radius:var(--newsletter-radius) 0 0 var(--newsletter-radius);
  cursor:pointer;
  transition:background .3s;
}
.newsletter-form button:hover{background:#787878;}
/* آیکون میکروفن در دایره نارنجی */
.newsletter-icon{
  position:relative;
  width:170px; aspect-ratio:1/1;
  display:flex; align-items:center; justify-content:center;
}
.newsletter-icon .circle{
  position:absolute; inset:0;
  background:#cfcfcf;
  border-radius:50%;
}
.newsletter-icon i{
  position:relative;
  font-size:5.2rem;
  color:#ffffff;
}
/* رسپانسیو */
@media (max-width: 700px){
  .newsletter-card{padding:2.5rem 1.5rem;}
  .newsletter-icon{width:120px;}
  .newsletter-title{font-size:1.8rem;}
  .newsletter-sub{font-size:1rem;}
}
/* ===== Revamped Newsletter Card (27 Jun 25) ===== */

/* سرپوش شیشه‌ای با گرادینت ملایم و سایه‌ی عمیق‌تر */
.newsletter-card{
  background:#fff;
  border:1px solid rgba(255,255,255,.7);
  backdrop-filter:saturate(180%) blur(8px);
  box-shadow:0 20px 40px -12px rgba(15,23,56,.15);
  transition:transform .3s cubic-bezier(.25,.8,.25,1);
  margin: 10px;
  justify-self: center;
}
.newsletter-card:hover{transform:translateY(-4px);}   /* تکان نرم هنگام هاور */

/* عنوان و زیرعنوان با فونت سیال (clamp)؛ روی هر نمایشگر اندازه می‌گیرد */
.newsletter-title{font-size:clamp(1.9rem,2.2vw+1rem,2.9rem);}
.newsletter-sub  {font-size:clamp(1rem,1vw+.8rem,1.22rem);}

/* آیکون میکروفن حرکت شناورِ ملایم */
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.newsletter-icon{animation:float 6s ease-in-out infinite;}

/* دکمه: موج سفید هنگام هاور */
.newsletter-form button{position:relative;overflow:hidden;}
.newsletter-form button::after{
  content:"";position:absolute;inset:0;
  background:rgba(255,255,255,.15);
  transform:translateX(-100%);transition:transform .4s ease;
}
.newsletter-form button:hover::after{transform:translateX(0);}

/* اینپوت: رینگ رنگی در فوکوس */
.newsletter-form input:focus{
  border-color:var(--primary-color);
  box-shadow:0 0 0 3px rgba(255,109,47,.25);
}

/* چینش کاملاً ستونی و مرکزچین برای موبایل باریک */
@media(max-width:500px){
  .newsletter-card{flex-direction:column;text-align:center;padding:2.2rem 1.4rem;}
  .newsletter-icon{order:-1;margin-bottom:1.5rem;width:120px;}
  .newsletter-form{flex-direction:column-reverse;align-items:stretch;}
  .newsletter-form button,
  .newsletter-form input{border-radius:var(--newsletter-radius);}
  .newsletter-form button{width:100%;}
  .newsletter-form input{
     border-inline-start:1px solid #e3e8f0;
     margin-bottom:1rem;
  }
}
