* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    :root {
      --bg: #f5f2ef;
      --text: #2b2222;
      --muted: #6f6464;
      --primary: #cf7fff;
      --dark: #1d1313;
      --brown: #5b4747;
      --card: #ffffff;
      --border: #e7dddd;
    }

    body {
  font-family: 'Merriweather', Georgia, serif;
  background: var(--bg);
      color: var(--text);
      line-height: 1.7;
    }

    img {
      width: 100%;
      display: block;
    }

    a {
      text-decoration: none;
      color: inherit;
    }

    .container {
      width: min(1180px, 92%);
      margin: auto;
    }

    header {
      background: #faf9f8;
      border-bottom: 1px solid #e8e1e1;
      position: sticky;
      top: 0;
      z-index: 999;
    }

    .nav {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 2rem 0;
      gap: 2rem;
    }

    .logo {
      font-family: 'Cinzel', serif;
      font-size: clamp(1rem, 2vw, 3rem);
      font-weight: 600;
      letter-spacing: 1px;
    }

    .menu {
      display: flex;
      list-style: none;
      gap: 1.7rem;
      flex-wrap: wrap;
    }

    .menu a {
      font-size: 0.86rem;
      font-weight: 600;
      text-transform: uppercase;
      transition: .3s;
    }

    .menu a:hover,
    .menu .active {
      color: var(--primary);
    }

    .hero {
      padding: 5rem 0;
    }

    .hero-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 4rem;
      align-items: center;
    }

    .placeholder {
      background: linear-gradient(135deg, #ddd, #bdbdbd);
      min-height: 320px;
      border-radius: 4px;
      position: relative;
      overflow: hidden;
    }

    .placeholder::before {
      content: 'IMAGE PLACEHOLDER';
      position: absolute;
      inset: 0;
      display: grid;
      place-items: center;
      font-weight: 700;
      color: #666;
      letter-spacing: 2px;
    }

    .hero h1,
    .section-title {
        font-family: 'Merriweather', Georgia, serif;
      font-size: clamp(2rem, 4vw, 3.3rem);
      line-height: 1.2;
      margin-bottom: 1rem;
    }

    .hero p,
    .about-text,
    .card p {
      color: var(--muted);
      font-size: .97rem;
    }

    .btn {
      display: inline-block;
      margin-top: 1.5rem;
      background: var(--primary);
      color: white;
      padding: .9rem 1.6rem;
      font-size: .85rem;
      font-weight: 600;
      border-radius: 2px;
      transition: .3s;
    }

    .btn:hover {
      transform: translateY(-2px);
      opacity: .9;
    }

    section {
      padding: 5rem 0;
    }

    .section-header {
      text-align: center;
      margin-bottom: 3rem;
    }

    .section-header p {
      color: var(--muted);
      max-width: 650px;
      margin: auto;
    }

    .banner {
      background: var(--brown);
      color: white;
      padding: 3rem;
      border-radius: 10px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 2rem;
      flex-wrap: wrap;
    }

    .banner h2 {
      font-family: 'Playfair Display', serif;
      font-size: 2rem;
    }

    .about-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 3rem;
      align-items: start;
    }

    .quote-box {
      background: #fff;
      border-left: 4px solid var(--primary);
      padding: 1.4rem;
      margin-top: 1.5rem;
      box-shadow: 0 5px 15px rgba(0,0,0,.05);
    }

    .sermon-list {
      display: grid;
      gap: 1rem;
      margin-top: 2rem;
    }

    .sermon-item {
      background: white;
      border: 1px solid var(--border);
      padding: 1rem;
      border-radius: 8px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 1rem;
    }

    .event-banner {
      position: relative;
      overflow: hidden;
      border-radius: 10px;
    }

    .event-banner .overlay {
      position: absolute;
      inset: 0;
      background: rgba(0,0,0,.35);
      display: flex;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      color: white;
      text-align: center;
    }

    .cards {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 2rem;
    }

    .card {
      background: var(--card);
      border-radius: 10px;
      overflow: hidden;
      box-shadow: 0 5px 18px rgba(0,0,0,.05);
    }

    .card-body {
      padding: 1.5rem;
    }

    .card h3 {
      font-family: 'Playfair Display', serif;
      margin-bottom: 1rem;
      font-size: 1.5rem;
    }

    .audio-box {
      display: grid;
      gap: 1rem;
    }

    audio {
      width: 100%;
    }

    .blog-layout {
      display: grid;
      grid-template-columns: 2fr 1fr;
      gap: 2rem;
      align-items: start;
    }

    .blog-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 1.5rem;
    }

    .post {
      background: white;
      border-radius: 10px;
      overflow: hidden;
      box-shadow: 0 5px 18px rgba(0,0,0,.05);
    }

    .post-content {
      padding: 1.3rem;
    }

    .post h4 {
      font-family: 'Playfair Display', serif;
      margin-bottom: .7rem;
      font-size: 1.2rem;
    }

    .sidebar {
      background: white;
      padding: 1.5rem;
      border-radius: 10px;
      box-shadow: 0 5px 18px rgba(0,0,0,.05);
    }

    .sidebar h3 {
      margin-bottom: 1rem;
      font-family: 'Playfair Display', serif;
    }

    .archive-list {
      list-style: none;
      display: grid;
      gap: .8rem;
      color: var(--muted);
    }

    footer {
      background: var(--dark);
      color: #e5dede;
      padding-top: 5rem;
    }

    .footer-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 3rem;
    }

    footer h3 {
      margin-bottom: 1rem;
      font-family: 'Playfair Display', serif;
      color: white;
    }

    .youtube {
      background: #000;
      border-radius: 10px;
      overflow: hidden;
      aspect-ratio: 16 / 9;
      display: grid;
      place-items: center;
      font-size: 4rem;
      color: red;
    }

    .copyright {
      border-top: 1px solid rgba(255,255,255,.1);
      margin-top: 3rem;
      padding: 1.5rem 0;
      text-align: center;
      font-size: .9rem;
      color: #b9abab;
    }

    .mobile-toggle {
      display: none;
      font-size: 1.6rem;
      cursor: pointer;
    }

    @media (max-width: 992px) {
      .hero-grid,
      .about-grid,
      .cards,
      .blog-layout,
      .footer-grid,
      .blog-grid {
        grid-template-columns: 1fr;
      }

      .menu {
        position: fixed;
        top: 90px;
        right: -100%;
        background: white;
        width: 280px;
        height: calc(100vh - 90px);
        flex-direction: column;
        padding: 2rem;
        transition: .3s ease;
        box-shadow: -10px 0 30px rgba(0,0,0,.08);
      }

      .menu.active {
        right: 0;
      }

      .mobile-toggle {
        display: block;
      }

      .nav {
        padding: 1.3rem 0;
      }
    }

    @media (max-width: 600px) {
      section {
        padding: 4rem 0;
      }

      .hero {
        padding: 3rem 0;
      }

      .banner {
        padding: 2rem;
      }

      .hero h1,
      .section-title {
        font-size: 2rem;
      }
    }

.prophet-section{
  padding:6rem 0;
  background:#f5f2ef;
}

.prophet-heading{
  margin-bottom:4rem;
}

.prophet-heading h2{
  font-family: 'Merriweather', Georgia, serif;
  font-size:4.5rem;
  color:#2d2222;
  margin-bottom:1rem;
  line-height:1.1;
}

.prophet-heading p{
  font-family: 'Merriweather', Georgia, serif;
  font-style:italic;
  font-size:2rem;
  color:#7d7070;
}

.prophet-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:5rem;
  align-items:center;
}

.prophet-image-wrapper{
  position:relative;
  width:100%;
  max-width:520px;
}

.prophet-image{
  position:relative;
  z-index:2;
  min-height:560px;
  background:linear-gradient(135deg,#c8b4d5,#8f5cae);
}

.yellow-border{
  position:absolute;
  right:-40px;
  bottom:-40px;
  width:100%;
  height:100%;
  border:4px solid #e4c56e;
  z-index:1;
}

.purple-line{
  position:absolute;
  left:-50px;
  top:120px;
  width:120px;
  height:5px;
  background:#cf7fff;
  z-index:3;
}

.prophet-content{
  font-family: 'Merriweather', Georgia, serif;
  color:#5e5454;
  font-size:1.25rem;
  line-height:2.1;
}

.prophet-content p{
  margin-bottom:2rem;
}

@media(max-width:992px){

  .prophet-grid{
    grid-template-columns:1fr;
    gap:4rem;
  }

  .prophet-image-wrapper{
    margin:auto;
  }

  .prophet-heading h2{
    font-size:3rem;
  }

  .prophet-heading p{
    font-size:1.5rem;
  }

}

@media(max-width:768px){

  .prophet-section{
    padding:4rem 0;
  }

  .prophet-image{
    min-height:380px;
  }

  .yellow-border{
    right:-20px;
    bottom:-20px;
  }

  .purple-line{
    left:-20px;
    width:70px;
  }

  .prophet-content{
    font-size:1rem;
    line-height:2;
  }

  .prophet-heading h2{
    font-size:2.4rem;
  }

}

.truth-section{
  padding:6rem 0 3rem;
  background:#ebf6fa;
}

.truth-grid{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:5rem;
  align-items:start;
}

.truth-image{
  position:relative;
}

.truth-placeholder{
  min-height:700px;
  background:linear-gradient(135deg,#d6d1cc,#bbb);
}

.floating-icon{
  position:absolute;
  top:20px;
  left:50%;
  transform:translateX(-50%);
  width:44px;
  height:44px;
  background:#f5f2ef;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.3rem;
  color:#6f6464;
  box-shadow:0 5px 15px rgba(0,0,0,.08);
}

.truth-content{
  color:#5e5454;
  font-size:1.05rem;
  line-height:2.2;
  font-family: 'Merriweather', Georgia, serif;
}

.truth-content p{
  margin:0;
}

@media(max-width:992px){

  .truth-grid{
    grid-template-columns:1fr;
    gap:3rem;
  }

  .truth-placeholder{
    min-height:400px;
  }

}

@media(max-width:768px){

  .truth-section{
    padding:4rem 0 2rem;
  }

  .truth-content{
    font-size:1rem;
    line-height:2;
  }

}

#about{
  padding:6rem 0;
  background:#ebd3f1;
}

.about-grid{
  display:grid;
  grid-template-columns:1fr;
}

.about-top{
  display:grid;
  grid-template-columns:1.2fr 620px;
  gap:2rem;
  align-items:start;
  margin-bottom:5rem;
}

.section-title{
  font-family:'Merriweather', Georgia, serif;
  font-size:3rem;
  margin-bottom:1.5rem;
  color:#2d2222;
}

.about-text{
  font-style:italic;
  font-family:'Merriweather', Georgia, serif;
  line-height:2;
  color:#6f6464;
  font-size:1.4rem;
}

.about-image{
  width:100%;
}

.image-large .placeholder{
  min-height:320px;
}

.placeholder{
  background:linear-gradient(135deg,#d8d8d8,#bdbdbd);
  position:relative;
  overflow:hidden;
}

.placeholder::before{
  content:'IMAGE';
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:700;
  color:#666;
  letter-spacing:2px;
}

.service-times{
  display:grid;
  gap:3rem;
}

.service-item{
  display:grid;
  grid-template-columns:1fr 580px;
  gap:3rem;
  align-items:center;
}

.service-left{
  display:flex;
  align-items:flex-start;
  gap:2rem;
}

.service-icon{
  width:56px;
  height:56px;
  border:2px solid #e0d1c0;
  color:#c7a37c;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.5rem;
  flex-shrink:0;
  margin-top:.4rem;
}

.service-item h3{
  font-family:'Merriweather', Georgia, serif;
  font-size:2rem;
  line-height:1.6;
  margin-bottom:.5rem;
  color:#2d2222;
  font-weight:700;
}

.service-item p{
  font-size:1.7rem;
  color:#6f6464;
  font-family:'Merriweather', Georgia, serif;
}

.service-image .placeholder{
  min-height:180px;
}

@media(max-width:1300px){

  .about-top{
    grid-template-columns:1fr;
  }

  .service-item{
    grid-template-columns:1fr;
  }

}

@media(max-width:768px){

  #about{
    padding:4rem 0;
  }

  .section-title{
    font-size:2.2rem;
  }

  .about-text{
    font-size:1.1rem;
    line-height:1.9;
  }

  .service-left{
    gap:1rem;
  }

  .service-item h3{
    font-size:1.2rem;
  }

  .service-item p{
    font-size:1rem;
  }

  .service-icon{
    width:42px;
    height:42px;
    font-size:1rem;
  }

  .service-image .placeholder{
    min-height:140px;
  }

}

#footer{
  background:#160d0d;
  color:#d8cfcf;
  padding-top:6rem;
}

.footer-wrapper{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:2rem;
  align-items:start;
}

.footer-col{
  min-width:0;
}

.footer-logo{
  color:#c100ff;
  font-size:2rem;
  margin-bottom:2rem;
  font-family:'Cinzel', serif;
}

.footer-title{
  color:#f1e6e6;
  font-size:2rem;
  line-height:1.5;
  margin-bottom:2rem;
  letter-spacing:3px;
  font-family: 'Merriweather', Georgia, serif;
}

.footer-text{
  font-size:1.7rem;
  line-height:2;
  margin-bottom:2rem;
  color:#d5c8c8;
  font-family: 'Merriweather', Georgia, serif;
}

.footer-contact{
  list-style:none;
  display:grid;
  gap:1rem;
  color:#d5c8c8;
  font-size:1.3rem;
}

.youtube-frame{
  position:relative;
  overflow:hidden;
  background:#000;
}

.youtube-frame img{
  width:100%;
  display:block;
}

.youtube-play{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:7rem;
  color:red;
}

.recent-posts{
  display:grid;
  gap:2rem;
}

.recent-post{
  display:grid;
  grid-template-columns:90px 1fr;
  gap:1.5rem;
  align-items:start;
}

.recent-post img{
  width:90px;
  height:90px;
  object-fit:cover;
}

.recent-post a{
  color:#f1e6e6;
  font-size:1.2rem;
  line-height:1.7;
  font-weight:700;
  text-decoration:none;
  transition:.3s;
}

.recent-post a:hover{
  color:#cf7fff;
}

.footer-bottom{
  margin-top:5rem;
  border-top:1px solid rgba(255,255,255,.08);
  padding:2rem 0;
  color:#c4b8b8;
  font-size:1.1rem;
}

@media(max-width:1100px){

  .footer-wrapper{
    grid-template-columns:1fr;
    gap:4rem;
  }

}

@media(max-width:768px){

  #footer{
    padding-top:4rem;
  }

  .footer-logo{
    font-size:1.5rem;
  }

  .footer-title{
    font-size:1.4rem;
  }

  .footer-text{
    font-size:1.1rem;
  }

  .footer-contact{
    font-size:1rem;
  }

  .recent-post{
    grid-template-columns:70px 1fr;
  }

  .recent-post img{
    width:70px;
    height:70px;
  }

  .recent-post a{
    font-size:1rem;
  }

  .youtube-play{
    font-size:4rem;
  }

}


.page-banner { background:var(--brown); color:white; padding:3.5rem 0; }
.page-banner h1 { font-family:'Playfair Display',serif; font-size:3rem; }
.page-banner-inner { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1rem; }
.posts-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:2rem; }
.post-card { background:white; border-radius:10px; overflow:hidden; box-shadow:0 5px 18px rgba(0,0,0,.05); }
.post-card img { width:100%; height:200px; object-fit:cover; display:block; }
.post-card-body { padding:1.5rem; }
.post-card h3 { font-family:'Playfair Display',serif; font-size:1.2rem; margin-bottom:.7rem; line-height:1.4; }
.post-card .meta { font-size:.8rem; color:var(--muted); margin-bottom:.8rem; }
.post-card p { color:var(--muted); font-size:.9rem; margin-bottom:1rem; }
.pagination { display:flex; justify-content:center; gap:1rem; margin-top:3rem; flex-wrap:wrap; }
.pagination a, .pagination span { padding:.6rem 1.2rem; background:white; border-radius:4px; font-weight:600; font-size:.9rem; box-shadow:0 2px 8px rgba(0,0,0,.06); transition:.3s; }
.pagination .active { background:var(--primary); color:white; }
.pagination a:hover { background:var(--primary); color:white; }
.single-post-content { max-width:800px; margin:auto; }
.single-post-content img { max-width:100%; height:auto; border-radius:8px; margin:1.5rem 0; }
.post-nav { display:grid; grid-template-columns:1fr 1fr; gap:2rem; margin-top:3rem; padding-top:2rem; border-top:1px solid var(--border); }
.post-nav a { background:white; padding:1.5rem; border-radius:8px; box-shadow:0 3px 12px rgba(0,0,0,.06); font-size:.9rem; color:var(--muted); }
.post-nav a strong { display:block; color:var(--text); font-family:'Playfair Display',serif; margin-top:.4rem; }
.contact-grid { display:grid; grid-template-columns:1fr 1.2fr; gap:4rem; align-items:start; }
.contact-form { background:white; padding:2.5rem; border-radius:10px; box-shadow:0 5px 18px rgba(0,0,0,.06); }
.form-group { margin-bottom:1.5rem; }
.form-group label { display:block; font-weight:600; font-size:.9rem; margin-bottom:.5rem; }
.form-group input, .form-group textarea, .form-group select { width:100%; padding:.9rem 1rem; border:1px solid var(--border); border-radius:4px; font-family:inherit; font-size:.95rem; background:#faf9f8; transition:.3s; }
.form-group input:focus, .form-group textarea:focus { outline:none; border-color:var(--primary); box-shadow:0 0 0 3px rgba(207,127,255,.12); }
.form-group textarea { min-height:140px; resize:vertical; }
.alert { padding:1rem 1.5rem; border-radius:6px; margin-bottom:1.5rem; font-size:.95rem; }
.alert-success { background:#e8f5e9; color:#2e7d32; border:1px solid #c8e6c9; }
.alert-error { background:#ffebee; color:#c62828; border:1px solid #ffcdd2; }
.related-posts { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:2rem; margin-top:2rem; }
.admin-wrap { max-width:520px; margin:5rem auto; background:#fff; border-radius:10px; padding:2rem; box-shadow:0 5px 18px rgba(0,0,0,.08); }
.admin-links { display:grid; gap:1rem; }
.admin-links a { background:#faf9f8; border:1px solid var(--border); padding:1rem; border-radius:6px; }
@media(max-width:768px) { .contact-grid { grid-template-columns:1fr; } .post-nav { grid-template-columns:1fr; } .page-banner h1{font-size:2rem;} }
