/* WP AI Mastery — Global Styles */

/* Hero Banner (all pages) */
.pg-hero,
.wpaim-hero,
.about-hero {
  background: linear-gradient(135deg, #040037 0%, #032075 60%, #E21E51 100%);
  padding: 120px 25px 100px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.pg-hero::before,
.wpaim-hero::before,
.about-hero::before {
  content: '';
  position: absolute;
  top: -50%; left: -50%;
  width: 200%; height: 200%;
  background: radial-gradient(circle, rgba(255,255,255,0.03) 0%, transparent 70%);
}
.pg-hero h1,
.wpaim-hero h1,
.about-hero h1 {
  color: #fff;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  font-weight: 800;
  line-height: 1.2;
  max-width: 700px;
  margin: 0 auto 14px;
  position: relative;
}
.wpaim-hero h1 {
  font-size: clamp(2rem, 5vw, 3.4rem);
  max-width: 800px;
}
.pg-hero p,
.wpaim-hero p,
.about-hero p {
  color: rgba(255,255,255,0.8);
  font-size: 1.1rem;
  max-width: 560px;
  margin: 0 auto;
  position: relative;
  line-height: 1.6;
}
.wpaim-hero p {
  font-size: clamp(1rem, 2vw, 1.3rem);
  max-width: 640px;
  margin-bottom: 35px;
}
.wpaim-hero h1 span {
  color: #E21E51;
  background: rgba(226,30,81,0.15);
  padding: 0 8px;
  border-radius: 4px;
}

/* Hero Buttons */
.wpaim-btns {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  position: relative;
}
.wpaim-btns a {
  display: inline-block;
  padding: 16px 36px;
  border-radius: 6px;
  font-weight: 700;
  font-size: 17px;
  text-decoration: none;
  transition: all .3s;
}
.wpaim-btn-primary {
  background: #E21E51;
  color: #fff !important;
}
.wpaim-btn-primary:hover {
  background: #c4173f;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(226,30,81,0.4);
}
.wpaim-btn-secondary {
  background: rgba(255,255,255,0.12);
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.25);
}
.wpaim-btn-secondary:hover {
  background: rgba(255,255,255,0.2);
}

/* CTA Banner (bottom of pages) */
.pg-cta,
.wpaim-cta {
  background: linear-gradient(135deg, #E21E51 0%, #040037 100%);
  padding: 60px 25px;
  text-align: center;
}
.pg-cta h2,
.wpaim-cta h2 {
  color: #fff;
  font-size: 1.6rem;
  font-weight: 800;
  margin-bottom: 12px;
}
.wpaim-cta h2 {
  font-size: clamp(1.6rem, 3.5vw, 2.2rem);
}
.pg-cta p,
.wpaim-cta p {
  color: rgba(255,255,255,0.85);
  font-size: 1rem;
  max-width: 500px;
  margin: 0 auto 20px;
}
.wpaim-cta p {
  font-size: 1.1rem;
  max-width: 560px;
  margin-bottom: 30px;
}
.pg-cta a,
.wpaim-cta a {
  display: inline-block;
  padding: 16px 36px;
  background: #fff;
  color: #E21E51;
  border-radius: 6px;
  font-weight: 700;
  text-decoration: none;
  font-size: 17px;
  transition: all .3s;
}
.pg-cta a:hover,
.wpaim-cta a:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.3);
}
.pg-cta .pg-sub,
.wpaim-cta .wpaim-cta-sub {
  color: rgba(255,255,255,0.5);
  font-size: 13px;
  margin-top: 12px;
}

/* Section Patterns */
.wpaim-section { padding: 80px 25px; max-width: 1100px; margin: 0 auto; }
.wpaim-section-alt { background: #efeff5; padding: 80px 25px; }
.wpaim-section-alt .wpaim-inner { max-width: 1100px; margin: 0 auto; }
.wpaim-label { text-transform: uppercase; font-size: 13px; font-weight: 700; letter-spacing: 2px; color: #E21E51; margin-bottom: 12px; }
.wpaim-h2 { font-size: clamp(1.6rem,3.5vw,2.4rem); font-weight: 800; color: #040037; line-height: 1.2; margin-bottom: 16px; }
.wpaim-h2 span { color: #E21E51; }
.wpaim-subtitle { font-size: 1.1rem; color: #514d7c; line-height: 1.7; max-width: 660px; margin-bottom: 40px; }
.wpaim-centered { text-align: center; }
.wpaim-centered .wpaim-subtitle { margin-left: auto; margin-right: auto; }

/* Mobile */
@media (max-width: 768px) {
  .pg-hero, .wpaim-hero, .about-hero { padding: 100px 20px 70px; }
}

/* Remove default content padding for full-width pages */
.entry-content-wrap {
  padding: 0 !important;
  max-width: 100% !important;
}

/* 3.1 Blog Archive — Container fix */
.post-archive-wrapper .entry-content-wrap,
.archive .site-container .content-wrap,
body.blog .site-container .content-wrap,
body.archive .site-container .content-wrap {
  max-width: 1200px !important;
  margin: 0 auto;
  padding-left: 25px !important;
  padding-right: 25px !important;
}

/* 5.1 Section transitions — background + subtle dividers */
.wpaim-section.wpaim-centered {
  background-color: #f8f9fa;
}
.wpaim-section + .wpaim-section-alt,
.wpaim-section-alt + .wpaim-section,
.wpaim-section.wpaim-centered + .wpaim-section-alt {
  border-top: 1px solid rgba(4, 0, 55, 0.06);
}

/* Course Content & Blog — top/bottom spacing */
.cw {
  padding-top: 60px;
  padding-bottom: 60px;
}
body.blog .content-wrap,
body.archive .content-wrap {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
}
