*{box-sizing:border-box;margin:0;padding:0}
img{display:block;max-width:100%}

body{
  font-family:"Segoe UI",sans-serif;
  background:#fff;
  color:#000;
}
header,section,footer,aside{
  border:1px solid #888;
  margin:5px;
  padding:10px;
  box-sizing:border-box;
}

/* ===================== NAVBAR ===================== */
header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  flex-wrap:wrap;
  position:relative;
}
.navbar{
  display:flex;
  gap:15px;
  align-items:center;
}
.navbar a{
  text-decoration:none;
  color:green;
  font-weight:600;
}
.navbar-toggle{
  display:none;
  font-size:24px;
  background:none;
  border:none;
  cursor:pointer;
  color:green;
}
header .note{
  color:red;
  font-weight:bold;
  margin-top:5px;
}

/* ===================== MENU UNIFICADO (sidebar + nav) ===================== */
.mobile-menu{
  display:none;
  flex-direction:column;
  background:#f8f8f8;
  width:100%;
  padding:10px 0;
  border-top:1px solid #ccc;
}
.mobile-menu a{
  padding:8px 15px;
  border-top:1px solid #ddd;
  color:#333;
  text-decoration:none;
}
.mobile-menu a:hover{
  background:#e6f1e6;
}
.mobile-menu.show{display:flex;}

/* ===================== BANNER ===================== */
.banner-aviso{
  text-align:center;
  min-height:250px;
}
.banner-aviso img{
  width:100%;
  height:auto;
  max-height:250px;
  object-fit:cover;
  border:1px solid #ccc;
}

/* ===================== BLOCO PRINCIPAL ===================== */
.main-content{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:5px;
}
.pastores,.youtube,.birthday{
  border:1px solid #888;
  padding:10px;
}
.pastores h3,.birthday h3{color:red;}

.pastor-card{
  display:flex;
  align-items:center;
  margin:10px 0;
  border:1px solid #ccc;
  padding:8px;
  border-radius:8px;
  flex-wrap:wrap;
}
.pastor-card img{
  width:60px;
  height:60px;
  border-radius:50%;
  margin-right:10px;
}
.youtube{text-align:center;}
.youtube .icon{font-size:40px;color:red;margin:10px 0;}
.birthday{text-align:center;}
.birthday img{
  width:100px;
  height:100px;
  border-radius:50%;
}

/* ===================== DEVOCIONAL ===================== */
.sidebar-block{
  display:flex;
  border:1px solid #888;
  margin-top:5px;
  flex-wrap:wrap;
}
.block-content{
  flex:1;
  padding:20px;
  font-size:15px;
  position:relative;
  box-sizing:border-box;
  display:flex;
  flex-direction:row;
  align-items:flex-start;
  gap:20px;
}
.autor-box{
  flex-shrink:0;
  width:80px;
  text-align:center;
}
.autor-foto{
  width:70px;
  height:90px;
  border-radius:6px;
  object-fit:cover;
  border:1px solid #ccc;
}
.autor-nome{
  font-size:12px;
  color:#666;
  margin-top:6px;
  line-height:1.2;
}
.block-text{
  flex:1;
  column-count:2;
  column-gap:40px;
  text-align:justify;
  overflow:hidden;
  transition:max-height .5s ease;
}
.block-text.collapsed{max-height:250px;}
.leia-mais{
  display:inline-block;
  margin-top:10px;
  color:#007bff;
  cursor:pointer;
  font-weight:600;
}

/* ===================== FOOTER ===================== */
footer{
  text-align:center;
  background:#f8f8f8;
  font-size:14px;
}
footer p{margin:4px 0;}
footer a{color:#555;margin:0 4px;}
.section-label{
  color:red;
  font-style:italic;
  font-size:13px;
}

/* ===================== RESPONSIVIDADE ===================== */
@media (max-width:992px){
  .block-text{column-count:1;}
}
@media (max-width:768px){
  header{flex-direction:column;align-items:flex-start;}
  .navbar{display:none;}
  .navbar-toggle{display:block;align-self:flex-end;}
  .main-content{grid-template-columns:1fr;} /* cada bloco em uma linha */
  .sidebar-block{flex-direction:column;}
  .block-content{
    flex-direction:column;
    align-items:center;
  }
  .autor-box{
    width:100%;
    text-align:center;
    margin-bottom:15px;
  }
  .block-text{
    width:100%;
    column-count:1;
  }
}