:root{
  --red:#e3063b;
  --dark-blue:#001e5a;
  --light-gray:#f5f5f5;
  --text:#222;
  --dark-blue-h: 216;   /* Ejemplo para #001e5a */
  --dark-blue-s: 100%;
  --dark-blue-l: 18%;
  --paragraph: clamp(15px, 3vw, 20px);
  --lists: clamp(13px, 3vw, 18px);
}

.head-title {
  width: 100%;
  height: clamp(30vh, 43vh, 45vh);
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  border-bottom: solid 21px var(--dark-blue);
  background-size: cover;
  background-position: center;
}

.head-title h1 {
    color: white;
    font-weight: bold;
    font-size: clamp(2rem, 4vw, 3.5rem);
    max-width: 800px;
}

.pe-wrapper {
    width: 98%;
    max-width: 1280px;
    margin: 0px auto;
    padding: 10px;
}

.pe-col-50 {
    width: calc(50% - 20px);
}

.pe-col-100 {
    width: calc(100% - 20px);
}

.pe-flex-a {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    justify-content: center;
}

.pe-flex-b {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: stretch;
    justify-content: center;
    align-items: center;
}

.pe-blue-box img {
    position: absolute;
    width: 70px;
    height: 70px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    top: -35px;
    left: calc(50% - 35px);
}

.pe-blue-box, .pe-featured-blue-box {
    margin: 35px 10px;
    border-radius: 15px;
    color: white;
    padding: clamp(2.4rem, 12vw, 3rem) clamp(1rem, 5vw, 2rem);
    position: relative;
    display: flex; 
    align-items: center;
    background: linear-gradient(to right,hsl(var(--dark-blue-h) var(--dark-blue-s) var(--dark-blue-l)),hsl(var(--dark-blue-h)var(--dark-blue-s)calc(var(--dark-blue-l) - 10%)));
}

.pe-blue-box p, .pe-featured-blue-box p {
	margin: 0px !important;
}

.pe-blue-box p strong, .pe-featured-blue-box p strong {
display: block;
}

.pe-featured-blue-box img {
    width: 85px;
    height: 85px;
    margin-left: 10px;
}

.pe-featured-blue-box h2 {
    font-size: clamp(1.2rem, 3vw, 2.6rem);
    text-align: center;
}

.pe-fbb-inside {
    max-width: 700px;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
    margin: auto;
}

.pe-two-cols-full-img [class^="pe-col-"] {
      padding: 16px;
  }

.full-img img {
    object-fit: cover;
    width: 100%;
}

.pe-two-cols-full-img h3 {
    font-size: clamp(1rem, 3vw, 2rem);
}

.pe-blue-box p, .pe-blue-box b, .pe-two-cols-full-img ol, .pe-two-cols-full-img ul {
    padding-left: 1rem;
    font-size: var(--lists);
    margin: 0px 0px 40px 0px;
}
.pe-blue-box ol {
   padding-left: 1rem;
   font-size: var(--lists);   
}
.pe-blue-box ol > li:first-child {
 font-weight: bold;
}
.pe-blue-box ul {
font-weight: normal;
}
.pe-two-cols-full-img {
  color: var(--dark-blue);
}

.pe-two-cols-full-img li {
    margin: 10px 0px 10px 0px;
}

.pe-two-cols-full-img ol li::marker {
    font-weight: bold;
}

.pe-text-center {
  text-align: center;
}

.pe-titulo-destacado h2, .pe-titulo-destacado h3 {
    color: white;
    font-size: clamp(1.5rem, 3vw, 2.4rem);
    font-weight: bold;
}

.simple-p h3 {
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  color: var(--red);
  font-weight: bold;
  margin: 10px 0px;
}

.simple-p h2 {
  font-size: clamp(1.5rem, 3vw, 2.4rem);
  color: var(--dark-blue);
  font-weight: bold;
  margin: 10px 0px 20px 0px;
}

.simple-p li::marker {
font-weight: bold;
}

.simple-p p, .simple-p ol, .simple-p ul {
    font-size: var(--paragraph);
    color: var(--dark-blue);
    line-height: 154%;
}

.simple-p {
    padding: 5vh 0px;
}

.pe-titulo-destacado {
    background-color: var(--dark-blue);
    text-align: center;
    padding: 2vh 0px; 
}

.pe-blue-button {
    text-align: center;
    margin: 15px 10px;
    border-radius: 15px;
    color: white;
    padding: clamp(1rem, 2vw, 1.2rem) clamp(1rem, 2vw, 1.2rem);
    position: relative;
    background: linear-gradient(to right,hsl(var(--dark-blue-h) var(--dark-blue-s) var(--dark-blue-l)),hsl(var(--dark-blue-h)var(--dark-blue-s)calc(var(--dark-blue-l) - 10%)));
}

.pe-blue-button h3 {
    font-size: 13px;
}

.pe-blue-button a {
    color: white;
    margin: 0px;
}

.pe-blue-button img {
    width: 50px;
    margin-bottom: 15px;
}

@media only screen and (max-width: 1200px) { 
	.nav-link {
	    font-size: 12px;
	}
}

@media only screen and (max-width: 780px) {
  .head-title h1 {
    margin: auto;
    text-align: center;
  }

  .no-mobile {display: none;}

  .pe-col-10, .pe-col-20, .pe-col-30, .pe-col-33, .pe-col-40, .pe-col-50, .pe-col-60, .pe-col-70, .pe-col-80, .pe-col-90 {
      width: calc(100% - 20px);
  }

  .pe-fbb-inside {
      flex-direction: column;
  }

  .pe-featured-blue-box img {
      width: 50px;
      height: 50px;
      margin-left: 0px;
      margin-bottom: 13px;
  }
}