/* =========================================================
   COMUNICADO INSTITUCIONAL PRIORITARIO
   I.E. BOSQUES DE PINARES
   ========================================================= */

.comunicado-prioritario{
  width:100%;
  padding:14px 0;
  background:#fff9df;
  border-top:1px solid #f1df91;
  border-bottom:1px solid #ead477;
  box-sizing:border-box;
}

.comunicado-prioritario-contenido{
  width:min(1180px, calc(100% - 40px));
  margin:0 auto;

  display:grid;
  grid-template-columns:54px minmax(0, 1fr) auto;
  gap:18px;
  align-items:center;
}

/* ICONO */

.comunicado-prioritario-icono{
  width:54px;
  height:54px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:14px;

  background:#0b6b35;
  color:#ffffff;

  font-family:"Poppins", sans-serif;
  font-size:1.7rem;
  font-weight:800;
}

/* TEXTO */

.comunicado-prioritario-texto{
  min-width:0;
}

.comunicado-prioritario-etiqueta{
  display:block;

  margin-bottom:3px;

  color:#8b6800;

  font-size:.70rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.comunicado-prioritario-texto h2{
  margin:0 0 4px;

  color:#075b30;

  font-size:1.16rem;
  line-height:1.3;
}

.comunicado-prioritario-texto p{
  margin:0;

  color:#5f685f;

  font-size:.88rem;
  line-height:1.5;
}

.comunicado-prioritario-fecha{
  color:#384b40;
  font-weight:700;
}

/* BOTÓN */

.comunicado-prioritario-boton{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;

  padding:11px 18px;

  border-radius:999px;

  background:#0b6b35;
  color:#ffffff;

  font-size:.84rem;
  font-weight:800;

  text-decoration:none;
  white-space:nowrap;

  transition:
    background .2s ease,
    transform .2s ease;
}

.comunicado-prioritario-boton:hover,
.comunicado-prioritario-boton:focus-visible{
  background:#064d29;
  color:#ffffff;
  transform:translateY(-1px);
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width:800px){

  .comunicado-prioritario-contenido{
    grid-template-columns:48px minmax(0,1fr);
  }

  .comunicado-prioritario-icono{
    width:48px;
    height:48px;
  }

  .comunicado-prioritario-boton{
    grid-column:1 / -1;
    width:100%;
    box-sizing:border-box;
  }

}


/* =========================================================
   CELULAR
   ========================================================= */

@media (max-width:520px){

  .comunicado-prioritario{
    padding:12px 0;
  }

  .comunicado-prioritario-contenido{
    width:calc(100% - 28px);
    gap:11px;
  }

  .comunicado-prioritario-icono{
    width:43px;
    height:43px;
    border-radius:11px;
    font-size:1.35rem;
  }

  .comunicado-prioritario-texto h2{
    font-size:1rem;
  }

  .comunicado-prioritario-texto p{
    font-size:.80rem;
  }

}