html,
body{
margin:0;
padding:0;
overflow-x:hidden;
font-family:Arial, Helvetica, sans-serif;
}

*{
box-sizing:border-box;
}

img{
max-width:100%;
height:auto;
}

.container_oracoes{
width:100%;
max-width:1100px;
margin:0 auto;
padding:28px 20px 34px 20px;
font-family:Arial, Helvetica, sans-serif;
}

.topo_oracoes{
margin-bottom:22px;
}

.barra_topo_oracoes{
display:flex;
align-items:center;
justify-content:space-between;
gap:16px;
flex-wrap:wrap;
border-bottom:3px solid #d8a327;
padding-bottom:10px;
}

.titulo_pagina_oracoes{
margin:0;
display:flex;
align-items:center;
gap:12px;
font-size:34px;
color:#1a3e6e;
font-family:Georgia,"Times New Roman",serif;
font-weight:700;
line-height:1.1;
white-space:nowrap;
}

.icone_titulo_oracoes{
width:42px;
height:42px;
object-fit:contain;
display:block;
flex:0 0 auto;
}

.subtopo_oracoes{
margin-top:12px;
padding:14px 18px;
background:linear-gradient(135deg,#f8fbff,#eef4fb);
border:1px solid #dde7f4;
border-radius:14px;
color:#4d6076;
font-size:15px;
line-height:1.7;
box-shadow:0 4px 12px rgba(0,0,0,.04);
}

.lista_oracoes{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:10px;
margin-top:22px;
align-items:start;
}

.item_oracao{
background:#fff;
padding:12px 12px;
border-radius:12px;
box-shadow:0 3px 10px rgba(0,0,0,.07);
text-decoration:none;
color:#1a3e6e;
text-align:center;
border:1px solid #e7edf5;
transition:all .15s ease;
display:flex;
flex-direction:column;
justify-content:center;
}

.item_oracao:hover{
background:#eef5ff;
color:#0f2f57;
border-color:#bfd2ea;
box-shadow:0 6px 14px rgba(26,62,110,.12);
transform:translateY(-2px);
}

.nome_oracao{
display:flex;
align-items:center;
justify-content:center;
gap:8px;
font-size:17px;
line-height:1.1;
font-family:Georgia,"Times New Roman",serif;
font-weight:700;
margin-bottom:4px;
}

.icone_item_oracao{
width:22px;
height:22px;
flex:0 0 22px;
object-fit:contain;
display:block;
margin-right:3px;
}

.desc_oracao{
display:block;
font-size:11px;
line-height:1.3;
font-weight:400;
color:#667688;
}

.item_oracao:hover .desc_oracao{
color:#44586e;
}

.bloco_oracoes_info{
margin-top:28px;
padding:18px 20px;
border-radius:14px;
background:linear-gradient(135deg,#f8fbff,#eef4fb);
border:1px solid #dde7f4;
color:#1a3e6e;
box-shadow:0 4px 12px rgba(0,0,0,.04);
text-align:center;
line-height:1.7;
}

/* ESCURO */

body.modo-escuro .titulo_pagina_oracoes{
color:#e7eef7;
}

body.modo-escuro .subtopo_oracoes,
body.modo-escuro .bloco_oracoes_info{
background:#182230;
border-color:#2b3a4d;
color:#b8c6d6;
box-shadow:0 8px 24px rgba(0,0,0,.22);
}

body.modo-escuro .item_oracao{
background:#182230;
color:#e7eef7;
border-color:#2b3a4d;
box-shadow:0 8px 24px rgba(0,0,0,.22);
}

body.modo-escuro .item_oracao:hover{
background:#1d2a3b;
color:#fff;
border-color:#3a4c63;
}

body.modo-escuro .desc_oracao{
color:#aebccc;
}

body.modo-escuro .item_oracao:hover .desc_oracao{
color:#d5e1ee;
}

@media(max-width:900px){

.lista_oracoes{
grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:600px){

.container_oracoes{
max-width:100%;
padding:22px 10px 28px 10px;
}

.barra_topo_oracoes{
justify-content:center;
text-align:center;
padding-bottom:8px;
}

.titulo_pagina_oracoes{
font-size:28px;
gap:10px;
white-space:normal;
justify-content:center;
}

.icone_titulo_oracoes{
width:34px;
height:34px;
}

.subtopo_oracoes{
font-size:14px;
padding:12px 14px;
text-align:center;
}

.lista_oracoes{
grid-template-columns:1fr;
gap:12px;
}

.item_oracao{
padding:13px 10px;
}

.nome_oracao{
font-size:18px;
}

.icone_item_oracao{
width:20px;
height:20px;
flex:0 0 20px;
}

.desc_oracao{
font-size:12px;
}

}