/* ESTILOS GENERALES */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
:root {
  --azul-principal: #004171;
  --azul-secundario1: #0d5575;
  --azul-secundario2: #297ba2;
  --azul-secundario3: #389eb0;
  --color-destacado: #FF9154;
  --gris-fondo: #f9f9f9;
}
/* Estilos generales */
body {
  margin: 0;
  font-family: 'Roboto', sans-serif;
  max-width: 100%;
  font-size: 1rem;
  line-height: 1.5;
  overflow-x: hidden;
}

html {
  font-size: 16px;
  max-width: 100%;
  overflow-x: hidden;
}

header, footer {
  color: #fff;
  max-width: 100%;
}

main {
  margin: 0 auto;
}

main,
body,
html {
  height: auto;
  min-height: unset;
}

article {
  margin-bottom: 1rem;
  border-radius: 8px;
}

.content-sidebar-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 2rem;
}

#sidebar {
  flex: 1 1 30%;
  background-color: #f1f1f1;
  padding: 1rem;
  border-radius: 10px;
}

.widget {
  margin-bottom: 1.5rem;
}

.widget-title {
  font-size: 1.2rem;
  margin-bottom: 0.5rem;
}

.has-azul-principal-color {
  color: var(--azul-principal);
}

.has-azul-principal-background-color {
  background-color: var(--azul-principal);
}

.has-azul-secundario1-color {
  color: var(--azul-secundario1);
}

.has-azul-secundario1-background-color {
  background-color: var(--azul-secundario1);
}

.has-azul-secundario2-color {
  color: var(--azul-secundario2);
}

.has-azul-secundario2-background-color {
  background-color: var(--azul-secundario2);
}

.has-azul-secundario3-color {
  color: var(--azul-secundario3);
}

.has-azul-secundario3-background-color {
  background-color: var(--azul-secundario3);
}

.has-color-destacado-color {
  color: var(--color-destacado);
}

.has-color-destacado-background-color {
  background-color: var(--color-destacado);
}

.has-gris-fondo-color {
  color: var(--gris-fondo);
}

.has-gris-fondo-background-color {
  background-color: var(--gris-fondo);
}

/* Details Bloque Gutemberg */
.wp-block-details {
  border: 1px solid #dcdcdc;
  border-radius: 6px;
  margin-bottom: .8rem;
  background: #fafafa;
  overflow: hidden;
}

/* summary */
.wp-block-details summary {
  display: flex;
  align-items: center;
  gap: .5rem;
  cursor: pointer;
  list-style: none;
  padding: .9rem 1rem;
  font-weight: 600;
  font-size: 1.05rem;
  background: var(--azul-principal);
  color: white;
  border-radius: 6px 6px 0 0;
}

.wp-block-details:not([open]) summary {
  border-radius: 6px;
}

/* eliminar marcador nativo */
.wp-block-details summary::-webkit-details-marker {
  display: none;
}

.wp-block-details summary::marker {
  display: none;
}

/* icono base */
.wp-block-details summary::before {
  content: "+";
  font-weight: bold;
  font-size: 1rem;
  margin-right: .4rem;
}

/* icono cuando está abierto */
.wp-block-details[open] summary::before {
  content: "-";
}

/* hover */
.wp-block-details summary:hover {
  background: var(--azul-secundario1);
}

/* contenido */
.wp-block-details > *:not(summary) {
  padding: .9rem 1rem;
  font-size: .95rem;
  line-height: 1.6;
  background: var(--gris-fondo);
}

/* links dentro del encabezado */
.wp-block-details summary a {
  color: var(--azul-principal);
  text-decoration: underline;
  font-weight:bold ;
}

.wp-block-details summary a:hover {
  text-decoration: none;
}

/* Details anidados */
.wp-block-details .wp-block-details {
  margin-top: .6rem;
  border-left: 3px solid var(--azul-principal);
  background: #f4f6f8;
}

/* icono base en anidados */
.wp-block-details .wp-block-details summary::before {
  content: "+";
}

/* icono cuando el anidado está abierto */
.wp-block-details .wp-block-details[open] summary::before {
  content: "-";
}

.wp-block-details .wp-block-details summary {
  background: #e9eef4;
  color: #2b2b2b;
  font-size: .95rem;
}

.wp-block-details .wp-block-details summary:hover {
  background: #dde6ef;
}

.wp-block-details .wp-block-details > *:not(summary) {
  background: #f8f9fb;
}

/*Paginas padre */
.intro-padre{
  background:#f5f8fc;
  border-left:4px solid #004171;
  padding:20px;
  margin-bottom:30px;
  border-radius:6px;
}

.intro-padre-titulo{
  margin-top:0;
  color:#004171;
}

.cards-hijas{
    max-width:1500px;
    margin:50px auto 0;
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(360px,1fr));
    gap:26px;
}

/* eliminar marcador nativo */
.wp-block-details summary {
  list-style: none;
}

.wp-block-details summary::-webkit-details-marker {
  display: none;
}

.wp-block-details summary::marker {
  display: none;
}

.card-hija{
  display:flex;
  align-items:center;
  gap:16px;
  padding:22px 24px;
  background:#fff;
  border-radius:10px;
  border:1px solid #e5e5e5;
  text-decoration:none;
  color:#222;
  transition:all .25s ease;
}

.card-hija::before{
  content:"📄";   
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#f3f4f6;
  font-size:1.2rem;
}

.card-hija h3{
  font-size:1.05rem;
  font-weight:600;
  margin:0;
  flex:1;
}

.card-hija::after{
  content:"→";
  font-size:1.1rem;
  opacity:.5;
  transition:transform .2s ease;
}

.card-hija:hover{
  border-color:#d6d6d6;
  box-shadow:0 8px 22px rgba(0,0,0,0.08);
  transform:translateY(-3px);
}

.card-hija:hover::after{
  transform:translateX(4px);
}

.lista-documentos{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:20px;
}

.doc-item{
  display:flex;
  align-items:center;
  gap:8px;
  padding:12px 16px;
  border:1px solid #e3e3e3;
  border-radius:6px;
  text-decoration:none;
  color:#222;
  font-weight:500;
  transition:all .2s ease;
}

.doc-item:hover{
  background:#f5f5f5;
  border-color:#d0d0d0;
}
/* Estilos titulos generales */

h2, h3, h4, h5, h6 {
  position: relative;
  width: fit-content; 
  padding-bottom: .4rem;
  margin-top: 1.6rem;
  margin-bottom: .8rem;
  font-weight: 700;
}
/* H2 */
h2 {
  font-size: 1.6rem;
  color: #1f2a36;
}

h2::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px;
  background: var(--azul-principal);
}

/* H3 */
h3 {
  font-size: 1.35rem;
}

h3::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: var(--azul-principal);
}

/* H4 */
h4 {
  font-size: 1.15rem;
}

h4::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: #cfd6df;
}

/* H5 */
h5 {
  font-size: 1rem;
}

h5::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: #d9dee5;
}

/* H6 */
h6 {
  font-size: .9rem;
  text-transform: uppercase;
  letter-spacing: .04em;
}

h6::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: #d9dee5;
}

.entry-content ul li {
  display: flex;
  align-items: center;
  gap: .5rem;
}
.entry-content ul li {
  font-size: 1rem;
}

.entry-content ul li::first-letter {
  font-size: 1.2rem;
}

p a {
  display: inline;         
  vertical-align: middle;   
  gap: 0.4rem;        
  background: #f7f9fb;
  border-radius: 5px;
  text-decoration: underline; 
  text-underline-offset: 2px; 
  color: var(--azul-principal); 
  font-weight: 500;
  transition: 
    background 0.2s ease,
    transform 0.15s ease,
    box-shadow 0.2s ease,
    color 0.2s ease;
}

p a:hover {
  background: #e1e8f0;
  transform: translateY(-1px);
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
  color: var(--azul-secundario1); 
}

p a:active {
  transform: translateX(2px);
}

p {
  margin-bottom: .35rem;
}

/* Botones (estilos Gutemberg) */
.wp-block-button__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.65rem 1.3rem;
  font-size:.95rem;
  font-weight:600;
  border-radius:8px;
  background:var(--azul-principal);
  color:white;
  text-decoration:none;
  transition:
  background .25s ease,
  transform .15s ease,
  box-shadow .2s ease;
  box-shadow:0 2px 6px rgba(0,0,0,.12);
}

.wp-block-button__link:hover{
  background:var(--azul-secundario1);
  transform:translateY(-2px);
  box-shadow:0 6px 16px rgba(0,0,0,.18);
}

.wp-block-button__link:active{
  transform:translateY(0);
  box-shadow:none;
}
.is-style-outline .wp-block-button__link{
  background:transparent;
  border:2px solid var(--azul-principal);
  color:var(--azul-principal);
}

.is-style-outline .wp-block-button__link:hover{
  background:var(--azul-principal);
  color:white;
}

/*Error 404*/
.color-institucional{
  display: flex;
  width: auto;
  height: 100px;
  background-color: var(--azul-principal);
}

.pagina-404 {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 5rem 1rem;
  background-color: white;
  min-height: 70vh;
  text-align: center;
}

.contenedor-404 {
  max-width: 600px;
}

.logo-404 {
  max-width: 500px;
  height: auto;
  margin-bottom: 2rem;
}

.titulo-404 {
  font-size: 2.5rem;
  color: var(--azul-principal);
  margin-bottom: 1rem;
}

.texto-404 {
  font-size: 1.2rem;
  margin-bottom: 2rem;
  color: #333;
}

.boton-404 {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background-color: var(--azul-principal);
  color: white;
  text-decoration: none;
  border-radius: 4px;
  transition: background-color 0.3s;
}

.boton-404:hover {
  background-color: var(--azul-secundario1);
}

.texto-404 span#contador {
  font-weight: bold;
  color: var(--azul-principal);
}
a{
  color: var(--color-destacado);
}

/* Mobile */
@media (max-width:1024px){
  .content-sidebar-wrap{
    flex-direction:column;
  }

  #sidebar{
    flex:1 1 100%;
  }

  .cards-hijas{
    grid-template-columns:repeat(auto-fit, minmax(280px,1fr));
    gap:22px;
    margin-top:40px;
  }

  .card-hija{
    padding:18px 20px;
  }

  h2{
    font-size:1.45rem;
  }

  h3{
    font-size:1.25rem;
  }
  p{
    font-size:1rem;
  }
}


@media (max-width:768px){
  html{
    font-size:15px;
  }

  .cards-hijas{
    grid-template-columns:1fr;
    gap:18px;
    margin-top:30px;
  }

  .card-hija{
    gap:12px;
    padding:16px;
  }

  .card-hija::before{
    width:36px;
    height:36px;
    font-size:1rem;
  }

  h2{
    font-size:1.35rem;
  }

  h3{
    font-size:1.15rem;
  }

  h4{
    font-size:1rem;
  }

  .wp-block-details summary{
    font-size:1rem;
    padding:.8rem .9rem;
  }

  .wp-block-details > *:not(summary){
    font-size:.9rem;
  }

  .intro-padre{
    padding:16px;
  }
}