/* eAula — About page restyle (v0 inspired) */

/* About hero with gradient + wave */
.eax-about-hero{
  position:relative;
  background:linear-gradient(135deg,#2C1654 0%,#3d1e73 50%,#2C1654 100%);
  color:#fff;
  padding:4rem 0 6rem;
  overflow:hidden;
  text-align:center;
}
@media(min-width:768px){.eax-about-hero{padding:6rem 0 8rem}}
.eax-about-hero::before{
  content:'';position:absolute;inset:0;
  background-image:radial-gradient(circle at 20% 30%,rgba(255,71,87,.15),transparent 40%),radial-gradient(circle at 80% 70%,rgba(139,92,246,.15),transparent 40%);
  pointer-events:none;
}
.eax-about-hero h1{
  font-size:2.25rem;font-weight:800;margin:0 0 1rem;line-height:1.15;
  text-wrap:balance;letter-spacing:-.02em;color:#fff;
}
@media(min-width:768px){.eax-about-hero h1{font-size:3.75rem}}
.eax-about-hero p{
  font-size:1.05rem;max-width:42rem;margin:0 auto;
  opacity:.92;line-height:1.65;text-wrap:balance;
}
@media(min-width:768px){.eax-about-hero p{font-size:1.35rem}}
.eax-about-hero .eax-container{position:relative;z-index:1}

/* Story section */
.eax-story-grid{
  display:grid;grid-template-columns:1fr;gap:2.5rem;align-items:center;
}
@media(min-width:1024px){.eax-story-grid{grid-template-columns:1fr 1fr;gap:4rem}}

.eax-pill-badge{
  display:inline-flex;align-items:center;gap:.5rem;
  background:linear-gradient(90deg,#FF4757,#2C1654);
  color:#fff;padding:.5rem 1rem;border-radius:9999px;
  font-size:.825rem;font-weight:600;margin-bottom:1rem;
}
.eax-pill-badge i{font-size:.875rem}

.eax-story h2{
  font-size:1.75rem;font-weight:800;line-height:1.2;
  margin:0 0 1.25rem;text-wrap:balance;letter-spacing:-.01em;
}
@media(min-width:768px){.eax-story h2{font-size:2.5rem}}
.eax-story-text{display:flex;flex-direction:column;gap:1rem}
.eax-story-text p{
  font-size:1rem;color:#6b7280;line-height:1.7;margin:0;
}
@media(min-width:768px){.eax-story-text p{font-size:1.05rem}}

.eax-story-img-wrap{position:relative}
.eax-story-img-wrap > div{
  position:relative;border-radius:1.25rem;overflow:hidden;
  box-shadow:0 35px 70px -15px rgba(44,22,84,.45);
}
.eax-story-img-wrap img{
  width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;
  transition:transform .7s ease;
}
.eax-story-img-wrap > div:hover img{transform:scale(1.05)}
.eax-story-img-wrap > div::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(to top,rgba(44,22,84,.5),transparent);
  pointer-events:none;
}
/* Pillars (3 cards with top border) */
.eax-pillars{display:grid;grid-template-columns:1fr;gap:1.5rem}
@media(min-width:768px){.eax-pillars{grid-template-columns:repeat(3,1fr);gap:2rem}}
.eax-pillar{
  background:#fff;border-radius:.85rem;padding:2rem;height:100%;
  border:1px solid var(--eax-border,#e5e7eb);
  border-top:4px solid var(--pillar-accent,#FF4757);
  display:flex;flex-direction:column;gap:1.25rem;
  transition:all .3s ease;
}
.eax-pillar:hover{
  transform:translateY(-.5rem);
  box-shadow:0 25px 50px -12px rgba(44,22,84,.25);
}
.eax-pillar-icon{
  width:4rem;height:4rem;border-radius:1rem;
  display:flex;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 8px 20px -6px rgba(44,22,84,.3);
}
.eax-pillar-icon i{font-size:1.65rem}
.eax-pillar h3{font-size:1.5rem;font-weight:800;margin:0;color:var(--eax-fg,#2c1654)}
.eax-pillar p{margin:0;color:#6b7280;line-height:1.7;font-size:.975rem}

/* Differentials */
.eax-diffs{display:grid;grid-template-columns:1fr;gap:1.5rem}
@media(min-width:768px){.eax-diffs{grid-template-columns:repeat(2,1fr);gap:2rem}}
@media(min-width:1024px){.eax-diffs{grid-template-columns:repeat(3,1fr)}}
.eax-diff{
  background:#fff;border:1px solid var(--eax-border,#e5e7eb);
  border-radius:.85rem;padding:1.5rem;height:100%;
  display:flex;flex-direction:column;gap:1rem;
  transition:all .3s ease;
}
.eax-diff:hover{
  transform:translateY(-.25rem);
  box-shadow:0 20px 40px -12px rgba(44,22,84,.2);
}
.eax-diff-icon{
  width:3.25rem;height:3.25rem;border-radius:.75rem;
  display:flex;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 6px 14px -4px rgba(44,22,84,.25);
  transition:transform .3s ease;
}
.eax-diff:hover .eax-diff-icon{transform:scale(1.1) rotate(3deg)}
.eax-diff-icon i{font-size:1.5rem}
.eax-diff h3{font-size:1.2rem;font-weight:700;margin:0;color:var(--eax-fg,#2c1654)}
.eax-diff p{margin:0;color:#6b7280;line-height:1.65;font-size:.9rem}

/* Numbers (purple bg) */
.eax-numbers{
  position:relative;background:#2d005d;color:#fff;
  padding:4rem 0;overflow:hidden;
}
@media(min-width:768px){.eax-numbers{padding:6rem 0}}
.eax-numbers::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 30% 20%,rgba(255,71,87,.12),transparent 40%),radial-gradient(circle at 70% 80%,rgba(139,92,246,.15),transparent 45%);
  pointer-events:none;
}
.eax-numbers .eax-container{position:relative;z-index:1}
.eax-numbers .eax-section-head h2{color:#fff;font-size:1.75rem}
@media(min-width:768px){.eax-numbers .eax-section-head h2{font-size:2.5rem}}
.eax-numbers .eax-section-head p{color:rgba(255,255,255,.92)}
.eax-numbers-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem}
@media(min-width:1024px){.eax-numbers-grid{grid-template-columns:repeat(4,1fr)}}
.eax-number-item{text-align:center;display:flex;flex-direction:column;align-items:center;gap:1rem}
.eax-number-icon{
  width:5rem;height:5rem;border-radius:1.15rem;color:#fff;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 20px 40px -10px rgba(0,0,0,.4);
  transition:transform .3s ease;
}
.eax-number-item:hover .eax-number-icon{transform:scale(1.1)}
.eax-number-icon i{font-size:2rem}
.eax-number-num{
  font-size:2.75rem;font-weight:800;color:#fff;line-height:1;letter-spacing:-.02em;
}
@media(min-width:768px){.eax-number-num{font-size:3.5rem}}
.eax-number-lbl{font-size:1rem;color:rgba(255,255,255,.92)}

/* Infrastructure gallery */
.eax-infra{display:grid;grid-template-columns:1fr;gap:1.5rem}
@media(min-width:768px){.eax-infra{grid-template-columns:repeat(3,1fr)}}
.eax-infra-card{
  position:relative;border-radius:1.15rem;overflow:hidden;
  box-shadow:0 20px 40px -12px rgba(44,22,84,.2);
  transition:all .5s ease;
}
.eax-infra-card:hover{box-shadow:0 30px 60px -15px rgba(44,22,84,.35)}
.eax-infra-card img{
  width:100%;height:20rem;object-fit:cover;display:block;
  transition:transform .7s ease;
}
.eax-infra-card:hover img{transform:scale(1.1)}
.eax-infra-card-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.85),rgba(0,0,0,.3) 50%,transparent);
  display:flex;align-items:flex-end;padding:1.5rem;
}
.eax-infra-card h3{font-size:1.25rem;font-weight:700;color:#fff;margin:0 0 .25rem}
.eax-infra-card p{font-size:.875rem;color:rgba(255,255,255,.92);margin:0}

/* CTA gradient (about-specific) */
.eax-about-cta{
  position:relative;
  background:linear-gradient(90deg,#FF4757,#ff5a6a 50%,#2C1654);
  color:#fff;text-align:center;
  padding:4rem 0;overflow:hidden;
}
@media(min-width:768px){.eax-about-cta{padding:6rem 0}}
.eax-about-cta::before{
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 20% 50%,rgba(255,255,255,.08),transparent 40%);
  pointer-events:none;
}
.eax-about-cta .eax-container{position:relative;z-index:1}
.eax-about-cta h2{
  font-size:1.85rem;font-weight:800;margin:0 0 1.25rem;line-height:1.2;text-wrap:balance;
}
@media(min-width:768px){.eax-about-cta h2{font-size:2.75rem}}
.eax-about-cta p{
  font-size:1.05rem;max-width:42rem;margin:0 auto 2rem;opacity:.95;line-height:1.6;text-wrap:balance;
}
@media(min-width:768px){.eax-about-cta p{font-size:1.2rem}}
.eax-about-cta-actions{display:flex;flex-direction:column;gap:.75rem;justify-content:center;align-items:center}
@media(min-width:640px){.eax-about-cta-actions{flex-direction:row}}
.eax-about-cta .eax-btn-outline{border-color:#fff;color:#fff;background:transparent}
.eax-about-cta .eax-btn-outline:hover{background:#fff;color:#2C1654}