/* =====================================================================================
 * /pages/about_us/about_us.css
 * Estilos de la página "About Us". Namespaced bajo .abt-page con clases abt-*
 * para no colisionar con Bootstrap ni el CSS global.
 * VERSION: 1.0.0 · DATE: 2026-06-06
 * ===================================================================================== */

.abt-page{
  --abt-blue:#1656c4;--abt-blue-dark:#0e3c8c;--abt-orange:#f5821f;--abt-orange-light:#ff9d3f;
  --abt-purple:#7a2bd6;--abt-teal:#0e8f9c;--abt-pink:#e1308b;--abt-green:#1f9d55;
  --abt-ink:#15192b;--abt-body:#3a4156;--abt-muted:#6b7287;--abt-line:#e6eaf2;--abt-bg:#f6f8fc;--abt-white:#fff;
  --abt-radius:18px;--abt-shadow:0 12px 34px rgba(20,30,60,.10);--abt-shadow-sm:0 6px 18px rgba(20,30,60,.08);
  font-family:"Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
  color:var(--abt-body);background:var(--abt-white);line-height:1.6;-webkit-font-smoothing:antialiased;
}
.abt-page *{box-sizing:border-box}
.abt-page a{color:var(--abt-blue);text-decoration:none}
.abt-page section[id]{scroll-margin-top:120px}

.abt-wrap{max-width:1180px;margin:0 auto;padding:0 24px}
.abt-section{padding:70px 0}
.abt-center{text-align:center}
.abt-eyebrow{display:inline-block;font-size:.8rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--abt-orange);margin-bottom:12px}
.abt-title{font-size:2.1rem;font-weight:800;color:var(--abt-ink);letter-spacing:-.02em;line-height:1.15}
.abt-lead{color:var(--abt-muted);font-size:1.12rem;max-width:680px;margin:14px auto 0}
.abt-btn{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:1rem;padding:14px 28px;border-radius:50px;border:none;cursor:pointer;transition:.15s}
.abt-page .abt-btn-primary{background:linear-gradient(135deg,var(--abt-orange),var(--abt-orange-light));color:#fff;box-shadow:0 10px 24px rgba(245,130,31,.4)}
.abt-page .abt-btn-primary:hover{transform:translateY(-2px)}
.abt-page .abt-btn-ghost{background:rgba(255,255,255,.14);color:#fff;border:1.5px solid rgba(255,255,255,.55)}
.abt-page .abt-btn-ghost:hover{background:rgba(255,255,255,.24)}
.abt-page .abt-btn-blue{background:var(--abt-blue);color:#fff;box-shadow:0 10px 24px rgba(22,86,196,.3)}
.abt-page .abt-btn-blue:hover{transform:translateY(-2px)}
.abt-page .abt-btn-white{background:#fff;color:#d2691e}
.abt-page .abt-btn-white:hover{transform:translateY(-2px)}

/* hero */
.abt-hero{position:relative;overflow:hidden;color:#fff;background:linear-gradient(125deg,#0e3c8c 0%,#1656c4 45%,#7a2bd6 100%);text-align:center;padding:84px 0 90px}
.abt-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 15%,rgba(245,130,31,.5),transparent 42%),radial-gradient(circle at 15% 90%,rgba(225,48,139,.45),transparent 45%)}
.abt-hero-inner{position:relative;z-index:2}
.abt-hero h1{font-size:3.2rem;line-height:1.05;font-weight:800;letter-spacing:-.025em}
.abt-hero h1 .abt-hl{background:linear-gradient(90deg,var(--abt-orange-light),#ffd28a);-webkit-background-clip:text;background-clip:text;color:transparent}
.abt-hero p{font-size:1.25rem;color:#dfe7fb;margin:22px auto 30px;max-width:880px}
.abt-hero-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
@media(max-width:680px){.abt-hero{padding:60px 0 64px}.abt-hero h1{font-size:2.3rem}}

/* mission */
.abt-mission{text-align:center}
.abt-mission p.abt-big{font-size:1.6rem;line-height:1.5;font-weight:600;color:var(--abt-ink);max-width:880px;margin:0 auto}

/* stats band */
.abt-stats{background:linear-gradient(120deg,#0e3c8c,#1656c4 70%);color:#fff}
.abt-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
.abt-stats-grid .abt-num{font-size:2.4rem;font-weight:800;background:linear-gradient(90deg,#ffd28a,var(--abt-orange-light));-webkit-background-clip:text;background-clip:text;color:transparent}
.abt-stats-grid .abt-lbl{font-size:.95rem;color:#cdd9f6;margin-top:6px;font-weight:600}
@media(max-width:680px){.abt-stats-grid{grid-template-columns:repeat(2,1fr);gap:30px 20px}}

/* story */
.abt-story{background:var(--abt-bg)}
.abt-story-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
@media(max-width:860px){.abt-story-grid{grid-template-columns:1fr;gap:32px}}
.abt-story h2{font-size:2rem;font-weight:800;color:var(--abt-ink);margin-bottom:16px;letter-spacing:-.02em}
.abt-story p{margin:12px 0;font-size:1.04rem}
.abt-story-visual{position:relative;height:360px}
.abt-story-visual .abt-tile{position:absolute;border-radius:16px;box-shadow:0 16px 38px rgba(0,0,0,.18);display:flex;align-items:flex-end;padding:14px;color:#fff;font-weight:700;font-size:.92rem}
.abt-story-visual .abt-tile span{position:relative;z-index:2;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.abt-story-visual .abt-tile::after{content:"";position:absolute;inset:0;border-radius:16px;background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.5))}
.abt-sv1{top:0;left:4%;width:52%;height:52%;background:linear-gradient(135deg,#ff7a59,#f5821f)}
.abt-sv2{top:6%;right:0;width:42%;height:42%;background:linear-gradient(135deg,#7a2bd6,#b15cff)}
.abt-sv3{bottom:0;left:0;width:44%;height:44%;background:linear-gradient(135deg,#13b6a8,#0e8f9c)}
.abt-sv4{bottom:3%;right:3%;width:50%;height:50%;background:linear-gradient(135deg,#1656c4,#3b82f6)}

/* values */
.abt-vgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:46px}
@media(max-width:920px){.abt-vgrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:540px){.abt-vgrid{grid-template-columns:1fr}}
.abt-vcard{background:#fff;border:1px solid var(--abt-line);border-radius:var(--abt-radius);padding:28px 24px;box-shadow:var(--abt-shadow-sm);text-align:center;transition:.18s}
.abt-vcard:hover{transform:translateY(-4px);box-shadow:var(--abt-shadow)}
.abt-vcard .abt-ico{width:58px;height:58px;border-radius:16px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.abt-vcard .abt-ico svg{width:30px;height:30px;color:#fff}
.abt-vcard h3{font-size:1.1rem;font-weight:800;color:var(--abt-ink);margin-bottom:8px}
.abt-vcard p{font-size:.96rem;color:var(--abt-body)}
.abt-v1{background:linear-gradient(135deg,var(--abt-orange),var(--abt-orange-light))}
.abt-v2{background:linear-gradient(135deg,var(--abt-pink),#ff5fa2)}
.abt-v3{background:linear-gradient(135deg,var(--abt-blue),#3b82f6)}
.abt-v4{background:linear-gradient(135deg,var(--abt-purple),#b15cff)}

/* categories */
.abt-cats{background:var(--abt-bg)}
.abt-cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:44px}
@media(max-width:920px){.abt-cat-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:620px){.abt-cat-grid{grid-template-columns:repeat(2,1fr)}}
.abt-cat{border-radius:16px;padding:26px 18px;color:#fff;font-weight:800;font-size:1.02rem;min-height:118px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--abt-shadow-sm);transition:.16s}
.abt-cat:hover{transform:translateY(-3px);box-shadow:var(--abt-shadow)}
.abt-cat svg{width:28px;height:28px;opacity:.95}
.abt-c1{background:linear-gradient(135deg,#e1308b,#ff5fa2)}
.abt-c2{background:linear-gradient(135deg,#1656c4,#3b82f6)}
.abt-c3{background:linear-gradient(135deg,#0e8f9c,#13b6a8)}
.abt-c4{background:linear-gradient(135deg,#7a2bd6,#b15cff)}
.abt-c5{background:linear-gradient(135deg,#f5821f,#ff9d3f)}
.abt-c6{background:linear-gradient(135deg,#1f9d55,#34c172)}
.abt-c7{background:linear-gradient(135deg,#d6452b,#ff7a59)}
.abt-c8{background:linear-gradient(135deg,#3b3f8c,#6a6fd6)}

/* two audiences */
.abt-aud-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:46px}
@media(max-width:820px){.abt-aud-grid{grid-template-columns:1fr}}
.abt-aud{border-radius:var(--abt-radius);padding:34px 30px;box-shadow:var(--abt-shadow-sm);border:1px solid var(--abt-line);background:#fff}
.abt-aud .abt-tag{display:inline-block;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:5px 12px;border-radius:50px;margin-bottom:14px}
.abt-aud.abt-fans .abt-tag{background:#fdeaf3;color:var(--abt-pink)}
.abt-aud.abt-prov .abt-tag{background:#e7f0ff;color:var(--abt-blue)}
.abt-aud h3{font-size:1.45rem;font-weight:800;color:var(--abt-ink);margin-bottom:8px}
.abt-aud>p{color:var(--abt-body);margin-bottom:16px}
.abt-aud ul{list-style:none;margin:0;padding:0}
.abt-aud li{display:flex;gap:11px;align-items:flex-start;margin:11px 0;font-size:.98rem}
.abt-aud li svg{flex:0 0 auto;width:20px;height:20px;margin-top:3px}
.abt-aud.abt-fans li svg{color:var(--abt-pink)}
.abt-aud.abt-prov li svg{color:var(--abt-blue)}
.abt-aud li b{color:var(--abt-ink)}
.abt-aud .abt-cta{margin-top:22px}

/* closing */
.abt-closing{text-align:center}
.abt-closing .abt-box{background:linear-gradient(135deg,var(--abt-orange),#ff6a3d);border-radius:26px;padding:60px 30px;color:#fff;box-shadow:0 24px 50px rgba(245,130,31,.35)}
.abt-closing h2{font-size:2.3rem;color:#fff;font-weight:800}
.abt-closing p{font-size:1.15rem;color:#fff5ec;margin:14px auto 28px;max-width:560px}
