/* Nuestra esencia: estilos independientes y acotados a la sección.
   Reutiliza tipografía/reset globales. Flexbox permite crecer y saltar de fila. */
.about-essence { color: var(--color-white); }
.about-essence__container { width: min(88%, 75rem); margin-inline: auto; }
.about-essence__principles { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(2rem, 4vw, 3.5rem); background: linear-gradient(115deg, #001d3b, #011629 75%, #03264b); }
/* Círculos decorativos recortados dentro del bloque, sin afectar el contenido. */
.about-essence__principles::before { content: ''; position: absolute; z-index: -1; width: 20rem; height: 20rem; left: -17rem; bottom: -15rem; border: 3rem solid #076be92b; border-radius: 50%; box-shadow: 0 0 0 3rem #0751a312; }
.about-essence__principles-row { display: flex; align-items: flex-start; gap: clamp(1.5rem, 3vw, 3rem); }
.about-essence__intro { flex: 0 1 16rem; min-width: 0; padding-top: .1rem; }
.about-essence__eyebrow { display: flex; align-items: center; gap: .45rem; margin-bottom: .6rem; color: #5eb9f8; text-transform: uppercase; font-size: .68rem; font-weight: 700; letter-spacing: .07em; }
.about-essence__eyebrow::before { content: ''; width: 1.1rem; height: .125rem; background: currentColor; }
.about-essence h2 { font-size: clamp(1.6rem, 2.6vw, 2.35rem); line-height: 1.15; letter-spacing: -.035em; }
.about-essence__principles-content { flex: 1 1 45rem; min-width: 0; }
.about-essence__lead { text-align: right; color: #a8bdd5; font-size: .85rem; margin-bottom: 1.2rem; }
.about-essence__cards { display: flex; flex-wrap: wrap; gap: .85rem; align-items: stretch; }
.about-essence__card { flex: 1 1 12rem; min-width: 0; padding: 1.45rem; border: .0625rem solid #087de51c; border-radius: .85rem; background: linear-gradient(130deg, #043b73aa, #032a52aa); }
.about-essence__icon { display: flex; align-items: center; justify-content: center; width: 2.4rem; height: 2.4rem; color: #009dff; flex-shrink: 0; }
.about-essence__icon svg { width: 90%; height: 90%; }
.about-essence h3 { font-size: 1rem; font-weight: 700; line-height: 1.25; }
.about-essence__card > h3 { margin: 1rem 0 .7rem; }
.about-essence__card p { color: #b7cbe1; font-size: .85rem; line-height: 1.5; }
.about-essence__values-heading { display: flex; align-items: center; gap: .6rem; margin-bottom: .65rem; }
.about-essence__values { list-style: none; display: flex; flex-direction: column; gap: .65rem; padding-left: 1.4rem; }
.about-essence__values li { display: flex; align-items: flex-start; gap: .6rem; font-size: .8rem; color: #c6d8ec; }
.about-essence__values li::before { content: '✓'; display: flex; align-items: center; justify-content: center; flex: 0 0 .95rem; height: .95rem; margin-top: .1rem; border-radius: 50%; background: linear-gradient(135deg, #43d3ff, #007bfa); color: white; font-size: .65rem; font-weight: 800; }
/* Segundo bloque: degradado luminoso, ondas y cinco diferenciales. */
.about-essence__difference { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(2rem, 4vw, 3rem); background: radial-gradient(ellipse at 0 0, #008cf2aa, transparent 65%), linear-gradient(115deg, #064ba3, #043c89 60%, #032559); }
.about-essence__difference::before { content: ''; position: absolute; z-index: -1; width: 26rem; height: 26rem; border-radius: 50%; top: -19rem; left: -19rem; background: #419bff; box-shadow: 0 0 0 2.5rem #168dfccc, 0 0 0 5rem #008fff77; }
.about-essence__difference::after { content: ''; position: absolute; z-index: -1; width: 90%; height: 22rem; right: -8%; top: -16rem; border-radius: 50%; border: .125rem solid #0086ff40; transform: rotate(-22deg); box-shadow: 0 1.5rem 0 #007bf00c, 0 3rem 0 #007bf00c; }
.about-essence__difference-header { text-align: center; }
.about-essence__difference-header .about-essence__eyebrow { justify-content: center; color: #a4d9ff; }
.about-essence__difference-header > p:last-child { margin-top: .65rem; color: #b3d3ef; font-size: .85rem; }
.about-essence__features { display: flex; flex-wrap: wrap; justify-content: center; gap: 2rem 1.5rem; list-style: none; margin-top: 2rem; }
.about-essence__features li { flex: 1 1 10rem; min-width: 0; max-width: 15rem; text-align: center; }
.about-essence__icon--round { width: 4rem; height: 4rem; margin: 0 auto 1rem; border-radius: 50%; background: linear-gradient(135deg, #00b3ff, #0057e6); color: white; box-shadow: inset .1rem .1rem .3rem #58c9ff70, 0 .5rem 1rem #002a6620; }
.about-essence__icon--round svg { width: 52%; height: 52%; }
.about-essence__features h3 { margin-bottom: .65rem; }
.about-essence__features p { color: #b3d3ef; font-size: .8rem; line-height: 1.4; max-width: 12rem; margin-inline: auto; }
/* En tablet y móvil, el encabezado pasa arriba y las tarjetas fluyen sin alturas fijas. */
@media (max-width: 60rem) { .about-essence__principles-row { flex-direction: column; } .about-essence__intro, .about-essence__principles-content { flex-basis: auto; width: 100%; } .about-essence__lead { text-align: left; } }
@media (max-width: 35rem) { .about-essence__card { flex-basis: 100%; } .about-essence__features { gap: 2rem 1rem; } .about-essence__features li { flex-basis: 8rem; } }