/* SCAREAGA.COM — performance portfolio (dark / mint / Jost) */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:#0a0e0f;color:#F2EFE7;
  font-family:"Jost", "Futura PT", "Futura", -apple-system, sans-serif;
  font-weight:400;font-size:16px;line-height:1.5;letter-spacing:-0.005em;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{margin:0;padding:0;list-style:none}
em{font-style:italic;font-weight:300;color:var(--mint)}

:root{
  --bg:#0a0e0f;
  --bg-2:#11181a;
  --bg-3:#182022;
  --ink:#F2EFE7;
  --ink-2:#cfcdc6;
  --gray:#7d8484;
  --gray-2:#3a4244;
  --line:rgba(242,239,231,.08);
  --line-2:rgba(242,239,231,.16);
  --mint:#5DE5C9;
  --mint-2:#3FB89E;
  --mint-glow:rgba(93,229,201,.25);
  --max:1480px;
  --pad:48px;
}

.eyebrow{font-family:"Geist Mono", monospace;font-size:11px;text-transform:uppercase;letter-spacing:0.18em;color:var(--gray);font-weight:500}
.section{max-width:var(--max);margin:0 auto;padding:140px var(--pad) 80px;position:relative}
.section__head{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:18px;margin-bottom:60px}
.section__title{
  font-family:"Jost", sans-serif;font-weight:300;
  font-size:clamp(48px, 8vw, 124px);line-height:0.95;letter-spacing:-0.035em;
  margin:0 0 80px;color:var(--ink);
}
.section__title em{color:var(--mint);font-weight:300}
.section__title--narrow{max-width:14ch}

.status__dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--mint);margin-right:8px;box-shadow:0 0 0 4px rgba(93,229,201,.18);animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(93,229,201,.4)}50%{box-shadow:0 0 0 6px rgba(93,229,201,0)}}

/* NAV */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:18px var(--pad);background:rgba(10,14,15,.78);backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid transparent;transition:border-color .3s, padding .3s}
.nav.is-scrolled{border-color:var(--line);padding:14px var(--pad)}
.nav__mark{display:flex;align-items:center;gap:14px;font-family:"Geist Mono",monospace;font-size:12px;text-transform:uppercase;letter-spacing:.1em}
.nav__monogram{width:34px;height:34px;border-radius:50%;background:var(--mint);color:var(--bg);display:grid;place-items:center;font-family:"Jost",sans-serif;font-weight:600;font-size:14px;letter-spacing:0}
.nav__name em{color:var(--gray);margin-left:8px;text-transform:none;letter-spacing:0;font-style:normal}
.nav__dot{margin:0 8px;color:var(--gray-2)}
/* Pill nav container */
.nav__links{display:flex;align-items:center;gap:3px;background:rgba(17,24,26,.85);border:1px solid var(--line);border-radius:999px;padding:4px}

/* Individual pill items */
.nav__pill{display:flex;align-items:center;padding:6px 10px;border-radius:999px;color:var(--gray);transition:background .22s,color .22s;white-space:nowrap;min-height:36px;text-decoration:none}
.nav__pill img{width:22px;height:22px;object-fit:contain;flex-shrink:0;filter:drop-shadow(0 1px 3px rgba(0,0,0,.4))}
.nav__pill span{display:inline-block;max-width:0;overflow:hidden;opacity:0;margin-left:0;font-family:"Geist Mono",monospace;font-size:10px;text-transform:uppercase;letter-spacing:.12em;transition:max-width .32s cubic-bezier(.34,1.56,.64,1),opacity .18s ease,margin-left .18s ease}
.nav__pill:hover,.nav__pill.is-active{background:rgba(93,229,201,.1);color:var(--mint)}
.nav__pill:hover span,.nav__pill.is-active span{max-width:80px;opacity:1;margin-left:6px}
.nav__cta{background:var(--mint);color:var(--bg)!important;padding:11px 18px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;transition:background .25s, transform .25s;font-weight:500}
.nav__cta:hover{background:#7FF0D9;transform:translateY(-1px)}
.nav__arrow{font-family:"Jost",sans-serif;font-size:13px}
.nav__menu{display:none;flex-direction:column;gap:5px}
.nav__menu span{display:block;width:22px;height:1.5px;background:var(--ink)}

/* ── Language switcher ───────────────────────────────────────────── */
.lang-sw{display:flex;flex-direction:column;align-items:center;gap:2px;margin-left:auto;margin-right:12px;flex-shrink:0}
.lang-sw__balls{position:relative;width:72px;height:54px}
.lang-sw__img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:2;pointer-events:none}
.lang-sw__glow{
  position:absolute;border-radius:50%;
  background:radial-gradient(circle,rgba(93,229,201,.55) 0%,rgba(93,229,201,.12) 50%,transparent 70%);
  z-index:1;opacity:0;pointer-events:none;
  transition:opacity .4s ease;
}
.lang-sw__glow--esp{width:42px;height:42px;top:3px;left:-3px}
.lang-sw__glow--eng{width:35px;height:35px;top:8px;right:-3px}
.lang-sw[data-lang="es"] .lang-sw__glow--esp{opacity:1}
.lang-sw[data-lang="en"] .lang-sw__glow--eng{opacity:1}
.lang-sw__btn{position:absolute;top:0;bottom:0;width:50%;background:none;border:none;cursor:pointer;z-index:3}
.lang-sw__btn--esp{left:0}
.lang-sw__btn--eng{right:0}
.lang-sw__labels{display:flex;gap:16px}
.lang-sw__lbl{font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--gray);transition:color .3s;line-height:1}
.lang-sw__lbl.is-active{color:var(--mint)}
@media(max-width:980px){.lang-sw{margin:0 6px}.lang-sw__balls{width:60px;height:45px}.lang-sw__glow--esp{width:34px;height:34px}.lang-sw__glow--eng{width:28px;height:28px;top:6px}}
@media(max-width:560px){.lang-sw{margin:0 3px}.lang-sw__balls{width:50px;height:37px}.lang-sw__glow--esp{width:28px;height:28px;top:2px;left:-2px}.lang-sw__glow--eng{width:24px;height:24px;top:5px;right:-2px}.lang-sw__labels{gap:10px}.lang-sw__lbl{font-size:8px}}

/* HERO */
.hero{max-width:var(--max);margin:0 auto;padding:140px var(--pad) 0;position:relative}

/* Geometric floating shapes */
.hero-shapes{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.geo-shape{position:absolute;opacity:0;filter:drop-shadow(0 24px 48px rgba(0,0,0,.55));pointer-events:none;user-select:none}
.hero__meta,.hero__title,.hero__bottom,.hero__ticker{position:relative;z-index:1}
.hero__meta{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:18px}
.hero__metaCol{display:flex;flex-direction:column;gap:6px}
.hero__metaCol--right{text-align:right;align-items:flex-end}

.hero__title{
  font-family:"Jost",sans-serif;font-weight:300;
  font-size:clamp(72px, 13vw, 224px);line-height:.88;letter-spacing:-0.045em;
  margin:48px 0 0;
}
.hero__title .line{display:block}
.hero__title em{color:var(--mint);font-weight:300}
.hero__title strong{font-weight:600}

.hero__bottom{display:grid;grid-template-columns:1fr 1.05fr;gap:60px;align-items:end;margin-top:80px;padding-bottom:40px}
.hero__id{max-width:42ch}
.hero__lede{font-size:19px;line-height:1.4;color:var(--ink-2);margin:0 0 32px;letter-spacing:-0.005em}
.hero__lede strong{color:var(--ink);font-weight:500}
.hero__ctas{display:flex;gap:12px;flex-wrap:wrap}

.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 22px;border-radius:999px;font-family:"Geist Mono",monospace;font-size:11px;text-transform:uppercase;letter-spacing:.16em;border:1px solid currentColor;transition:transform .25s, background .25s, color .25s, border-color .25s;font-weight:500}
.btn--mint{background:var(--mint);color:var(--bg);border-color:var(--mint)}
.btn--ghost{background:transparent;color:var(--ink);border-color:rgba(242,239,231,.4)}
.btn:hover{transform:translateY(-2px)}
.btn--mint:hover{background:#7FF0D9;border-color:#7FF0D9}
.btn--ghost:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.btn__arrow{font-family:"Jost",sans-serif;font-size:14px}

/* hero photo + panel composition */
.hero__visual{position:relative;display:grid;grid-template-columns:1fr 1.2fr;gap:18px;align-items:end}
.hero__photo{
  position:relative;aspect-ratio:3/4;border-radius:14px;overflow:hidden;
  background:var(--bg-2);border:1px solid var(--line);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.6);
}
.hero__photo image-slot{display:block;width:100%;height:100%}
.hero__photo::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, transparent 60%, rgba(10,14,15,.6) 100%);
}
.hero__photoLabel{
  position:absolute;left:14px;bottom:14px;z-index:2;
  font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--mint);
  display:flex;flex-direction:column;gap:2px;
  text-shadow:0 2px 8px rgba(0,0,0,.6);
}
.hero__photoLabel strong{font-family:"Jost",sans-serif;font-weight:400;font-size:13px;color:var(--ink);letter-spacing:.05em}

.panel{background:var(--bg-2);border:1px solid var(--line);border-radius:14px;box-shadow:0 30px 60px -30px rgba(0,0,0,.6);overflow:hidden}
.panel__head{display:flex;align-items:center;gap:8px;padding:14px 18px;border-bottom:1px solid var(--line);font-family:"Geist Mono",monospace;font-size:11px;color:var(--gray)}
.panel__dot{width:9px;height:9px;border-radius:50%;background:#2a3133}
.panel__dot--mid{background:var(--gray-2)}
.panel__path{flex:1;text-align:center;letter-spacing:.04em}
.panel__pill{background:var(--mint);color:var(--bg);font-size:9px;letter-spacing:.16em;padding:3px 8px;border-radius:999px;font-weight:600}
.panel__body{padding:22px}
.panel__kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:22px}
.kpi{display:flex;flex-direction:column;gap:6px}
.kpi__label{font-family:"Geist Mono",monospace;font-size:10px;text-transform:uppercase;letter-spacing:.16em;color:var(--gray)}
.kpi__value{font-family:"Jost",sans-serif;font-weight:300;font-size:42px;line-height:1;letter-spacing:-.03em;color:var(--ink)}
.kpi__value sup{font-size:.5em;vertical-align:.6em;color:var(--mint)}
.kpi__delta{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.05em}
.kpi__delta.up{color:var(--mint)}

.panel__chart svg{width:100%;height:110px;display:block}
.panel__legend{display:flex;align-items:center;gap:14px;font-family:"Geist Mono",monospace;font-size:10px;color:var(--gray);text-transform:uppercase;letter-spacing:.12em;padding-top:8px;border-top:1px solid var(--line);margin-top:6px}
.panel__legend i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:middle}
.panel__legend-r{margin-left:auto}

.panel__rows{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.row{display:grid;grid-template-columns:90px 1fr 28px;align-items:center;gap:12px;font-family:"Geist Mono",monospace;font-size:11px;color:var(--ink-2)}
.row__bar{height:6px;background:var(--bg-3);border-radius:6px;overflow:hidden}
.row__bar i{display:block;height:100%;width:var(--w);background:linear-gradient(90deg,var(--mint),var(--mint-2));border-radius:6px;animation:grow 1.6s ease-out}
@keyframes grow{from{width:0}}
.row__num{text-align:right;color:var(--gray)}

.hero__ticker{margin-top:80px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0;display:flex;overflow:hidden}
.ticker{display:flex;align-items:center;gap:32px;flex-shrink:0;font-family:"Jost",sans-serif;font-weight:300;font-style:italic;font-size:34px;color:var(--ink);white-space:nowrap;animation:scroll 40s linear infinite;padding-right:32px}
.ticker span:nth-child(even){color:var(--mint);font-style:normal;font-size:18px;font-weight:400}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-100%)}}

/* LOGO TICKER */
.hero__ticker--logos{border-bottom:1px solid var(--line);padding:13px 0;display:flex;overflow:hidden}
.ticker--logos{display:flex;align-items:center;gap:44px;flex-shrink:0;white-space:nowrap;animation:scroll 40s linear infinite;padding-right:44px}
.tl-item{display:inline-flex;align-items:center;gap:9px;color:var(--ink);opacity:.82}
.tl-item svg{height:26px;width:auto;flex-shrink:0;fill:currentColor}
.tl-item .tl-txt{font-family:"Jost",sans-serif;font-size:15px;font-weight:600;letter-spacing:.04em;color:var(--ink)}
.tl-dot{color:var(--mint);font-size:14px}

/* PLATFORMS strip */
.platforms{max-width:var(--max);margin:0 auto;padding:60px var(--pad) 40px}
.platforms__head{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:18px;margin-bottom:48px;align-items:baseline}
.platforms__head h2{font-family:"Jost",sans-serif;font-weight:300;font-size:clamp(28px,3.6vw,52px);letter-spacing:-.025em;margin:0;max-width:24ch}
.platforms__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.plat{
  position:relative;aspect-ratio:1/1;border-radius:18px;
  background:linear-gradient(155deg, #182022 0%, #0d1314 60%, #0a0e0f 100%);
  border:1px solid var(--line-2);
  display:grid;place-items:center;
  transition:transform .5s cubic-bezier(.2,.8,.2,1), box-shadow .5s, border-color .35s;
  overflow:hidden;
}
.plat::before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(circle at 30% 20%, rgba(93,229,201,.18), transparent 60%);
  opacity:.7;transition:opacity .4s;
}
.plat::after{
  content:"";position:absolute;inset:auto -20% -40% -20%;height:80%;pointer-events:none;
  background:radial-gradient(ellipse at center top, rgba(93,229,201,.35), transparent 65%);
  filter:blur(20px);opacity:.0;transition:opacity .4s;
}
.plat:hover{transform:translateY(-4px);border-color:rgba(93,229,201,.4);box-shadow:0 30px 60px -30px rgba(93,229,201,.3)}
.plat:hover::after{opacity:1}
.plat:hover::before{opacity:1}
.plat__inner{
  position:relative;z-index:1;
  width:62%;height:62%;border-radius:14px;
  background:linear-gradient(155deg, rgba(255,255,255,.08), rgba(255,255,255,0) 50%), linear-gradient(180deg, #1d2628, #0e1415);
  border:1px solid rgba(93,229,201,.3);
  box-shadow:0 14px 26px -10px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.08), inset 0 0 0 1px rgba(93,229,201,.05);
  display:grid;place-items:center;color:var(--mint);
  filter:drop-shadow(0 4px 12px rgba(93,229,201,.2));
}
.plat__name{
  position:absolute;left:0;right:0;bottom:14px;text-align:center;z-index:2;
  font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);
}

.plat__inner svg{width:58%;height:58%;display:block}

/* Custom logo styling for the inner cube */
.plat__glyph{
  font-family:"Jost",sans-serif;font-weight:600;font-size:36px;color:var(--mint);
  text-shadow:0 0 14px var(--mint-glow);letter-spacing:-.04em;
}

/* ABOUT */
.about__grid{display:grid;grid-template-columns:5fr 7fr;gap:80px;align-items:start}
.about__lhs{position:sticky;top:120px}
.about__icon{width:140px;height:140px;margin-bottom:32px;filter:drop-shadow(0 14px 24px rgba(0,0,0,.5))}
.about__icon img{width:100%;height:100%;object-fit:contain;animation:bob 6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-6px) rotate(3deg)}}
.about__kicker{font-family:"Jost",sans-serif;font-style:italic;font-weight:300;font-size:28px;line-height:1.2;color:var(--ink-2);max-width:18ch;margin:0;letter-spacing:-.01em}
.about__quote{font-family:"Jost",sans-serif;font-weight:300;font-size:clamp(32px, 4vw, 56px);line-height:1.1;letter-spacing:-.03em;color:var(--ink);margin:0 0 80px}
.about__quote em{color:var(--mint);font-weight:300}
.about__pillars{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.about__pillars > div{background:var(--bg-2);padding:32px 28px}
.about__pillars span{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.18em;color:var(--mint)}
.about__pillars h4{font-family:"Jost",sans-serif;font-weight:400;font-size:26px;line-height:1.1;margin:8px 0;color:var(--ink);letter-spacing:-.015em}
.about__pillars p{font-size:14.5px;line-height:1.5;color:var(--ink-2);margin:0}

/* EXPERTISE */
.exp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.exp{background:var(--bg-2);padding:36px 32px 32px;display:flex;flex-direction:column;position:relative;transition:background .35s;min-height:280px}
.exp:hover{background:var(--bg-3)}
.exp__icon{width:78px;height:78px;margin-bottom:20px;transition:transform .5s cubic-bezier(.2,.8,.2,1);filter:drop-shadow(0 10px 18px rgba(0,0,0,.5)) brightness(1.1) contrast(1.1)}
.exp:hover .exp__icon{transform:translateY(-4px) rotate(-6deg)}
.exp__icon img{width:100%;height:100%;object-fit:contain}
.exp h3{font-family:"Jost",sans-serif;font-weight:400;font-size:28px;line-height:1.05;margin:0 0 10px;letter-spacing:-.02em;color:var(--ink)}
.exp p{font-size:14.5px;line-height:1.5;color:var(--ink-2);margin:0 0 20px;max-width:30ch}
.exp__tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto}
.exp__tags li{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line-2);padding:4px 10px;border-radius:999px;color:var(--gray)}

/* PORTFOLIO */
.port-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:80px 60px}
.case{display:flex;flex-direction:column;gap:28px;position:relative}
.case--lg{grid-column:span 2;display:grid;grid-template-columns:1.4fr 1fr;gap:60px;align-items:center}
.case__visual{position:relative;border:1px solid var(--line);border-radius:14px;background:var(--bg-2);aspect-ratio:4/3;overflow:hidden;display:grid;place-items:center;transition:transform .5s, box-shadow .5s, border-color .35s}
.case:hover .case__visual{transform:translateY(-4px);border-color:rgba(93,229,201,.3);box-shadow:0 30px 60px -30px rgba(93,229,201,.18)}
.case__floatIcon{position:absolute;width:90px;height:90px;bottom:18px;right:18px;filter:drop-shadow(0 10px 20px rgba(0,0,0,.5)) brightness(1.1);animation:bob 6s ease-in-out infinite}
.case--dark .case__visual{background:var(--bg-3);border-color:var(--line-2)}
.case__meta{display:flex;flex-direction:column;gap:10px;padding-top:4px}
.case__num{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.18em;color:var(--mint)}
.case__title{font-family:"Jost",sans-serif;font-weight:300;font-size:42px;line-height:1.05;letter-spacing:-.025em;margin:0;color:var(--ink)}
.case__type{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--mint);margin:0}
.case__insight{font-size:15.5px;line-height:1.5;color:var(--ink-2);margin:6px 0;max-width:42ch}
.case__tags{display:flex;gap:6px;flex-wrap:wrap}
.case__tags li{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line-2);padding:4px 10px;border-radius:999px;color:var(--gray)}
.case__cta{display:inline-flex;align-items:center;gap:8px;font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin-top:6px;align-self:flex-start;padding:10px 0;border-bottom:1px solid var(--ink);transition:gap .25s, color .25s, border-color .25s;font-weight:500}
.case__cta:hover{gap:14px;color:var(--mint);border-color:var(--mint)}

.case__mockup{position:relative;width:88%;height:88%;display:flex;align-items:center;justify-content:center}
/* Card 01 — single composed image */
.case__single{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.case__single--mia{
  object-fit:contain;
  object-position:center;
  padding:20px 12px 12px;
  filter:drop-shadow(0 8px 32px rgba(93,229,201,.18)) drop-shadow(0 20px 40px rgba(0,0,0,.6));
}
.case__single--thd{
  object-fit:contain;
  object-position:center;
  padding:16px 16px 8px;
  filter:drop-shadow(0 8px 32px rgba(93,229,201,.15)) drop-shadow(0 20px 40px rgba(0,0,0,.65));
}
.case__single--consolide{
  object-fit:contain;
  object-position:center;
  padding:14px 10px 10px;
  filter:drop-shadow(0 8px 28px rgba(93,229,201,.12)) drop-shadow(0 18px 36px rgba(0,0,0,.6));
}
.case__single--freelance{
  object-fit:contain;
  object-position:center;
  padding:12px 8px 8px;
  filter:drop-shadow(0 8px 28px rgba(93,229,201,.13)) drop-shadow(0 20px 40px rgba(0,0,0,.55));
}
.mockup-card{background:var(--bg-3);border-radius:12px;width:90%;box-shadow:0 24px 50px -20px rgba(0,0,0,.6);overflow:hidden;border:1px solid var(--line-2)}
.mockup-card__head{display:flex;justify-content:space-between;padding:10px 14px;font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;border-bottom:1px solid var(--line);color:var(--gray);text-transform:uppercase}
.mockup-card__body{padding:16px;display:grid;gap:14px}
.mockup-tile{display:grid;grid-template-columns:60px 1fr auto;align-items:center;gap:12px;padding:10px;background:rgba(255,255,255,.04);border-radius:8px}
.mockup-tile__img{width:60px;height:60px;border-radius:6px;background:repeating-linear-gradient(45deg,#222b2d 0,#222b2d 6px,#1a2122 6px,#1a2122 12px)}
.mockup-tile__name{font-family:"Jost",sans-serif;font-size:18px;line-height:1;font-weight:400}
.mockup-tile__price{font-family:"Geist Mono",monospace;font-size:12px;color:var(--mint)}
.mockup-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.mockup-stats > div{display:flex;flex-direction:column;gap:2px}
.mockup-stats span{font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray)}
.mockup-stats strong{font-family:"Jost",sans-serif;font-weight:400;font-size:18px;letter-spacing:-.01em}
.mockup-stats i{font-family:"Geist Mono",monospace;font-size:9px;color:var(--mint);font-style:normal}

.hosp-stack{position:relative;width:80%;height:80%;display:grid;place-items:center}
.hosp-card{background:var(--bg-3);border:1px solid var(--line-2);border-radius:10px;padding:14px 16px;display:flex;flex-direction:column;gap:8px;width:80%;position:absolute;box-shadow:0 18px 40px -20px rgba(0,0,0,.5)}
.hosp-card{top:20%;left:8%;transform:rotate(-3deg)}
.hosp-card--alt{top:46%;left:24%;transform:rotate(2deg);background:var(--mint);color:var(--bg);border-color:var(--mint)}
.hosp-card__head{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.hosp-card__price{font-family:"Jost",sans-serif;font-weight:300;font-size:30px;line-height:1;letter-spacing:-.02em}
.hosp-card__bar{display:block;height:5px;background:rgba(255,255,255,.08);border-radius:5px;overflow:hidden}
.hosp-card--alt .hosp-card__bar{background:rgba(0,0,0,.18)}
.hosp-card__bar b{display:block;height:100%;width:var(--w);background:var(--mint)}
.hosp-card--alt .hosp-card__bar b{background:var(--bg)}
.hosp-card__foot{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;opacity:.7;text-transform:uppercase}

/* ── CRM Hub mockup (Card 04 Consolidé) ── */
.crm-hub{width:88%;background:var(--bg-3);border:1px solid var(--line-2);border-radius:12px;padding:16px;box-shadow:0 24px 50px -20px rgba(0,0,0,.6)}
.crm-hub__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--gray)}
.crm-hub__live{color:var(--mint);font-size:8px;border:1px solid rgba(93,229,201,.4);padding:2px 7px;border-radius:99px}
.crm-hub__kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-bottom:13px}
.crm-kpi{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:8px;padding:10px 6px;text-align:center}
.crm-kpi span{display:block;font-family:"Geist Mono",monospace;font-size:8px;letter-spacing:.1em;color:var(--gray);text-transform:uppercase;margin-bottom:4px}
.crm-kpi strong{display:block;font-size:20px;font-weight:600;color:var(--ink);line-height:1}
.crm-kpi i{display:block;font-style:normal;font-size:9px;color:var(--mint);margin-top:3px}
.crm-channels{display:flex;flex-direction:column;gap:6px}
.crm-ch{display:flex;align-items:center;gap:8px}
.crm-ch span{font-family:"Geist Mono",monospace;font-size:8px;color:var(--gray);width:48px;text-transform:uppercase;letter-spacing:.08em;flex-shrink:0}
.crm-ch__bar{flex:1;height:4px;background:rgba(255,255,255,.08);border-radius:99px;overflow:hidden}
.crm-ch__bar b{display:block;height:100%;width:var(--w,50%);background:var(--mint);border-radius:99px}
.crm-ch em{font-style:normal;font-family:"Geist Mono",monospace;font-size:8px;color:rgba(242,239,231,.35);width:26px;text-align:right}
.crm-hub__foot{margin-top:12px;padding-top:10px;border-top:1px solid var(--line);font-family:"Geist Mono",monospace;font-size:8px;color:rgba(242,239,231,.28);letter-spacing:.08em;text-align:center}
/* ── Inbound System mockup (Card 05 Consolidé) ── */
.inbound-sys{width:88%;background:var(--bg-3);border:1px solid var(--line-2);border-radius:12px;padding:14px 16px;box-shadow:0 24px 50px -20px rgba(0,0,0,.6);display:flex;flex-direction:column;gap:10px}
.inbound-sys__head{font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--gray)}
.inbound-lp-mock{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.inbound-lp-mock__tag{font-family:"Geist Mono",monospace;font-size:7px;color:var(--mint);letter-spacing:.12em;text-transform:uppercase;margin-bottom:4px}
.inbound-lp-mock__title{font-size:12px;font-weight:600;color:var(--ink);margin-bottom:8px}
.inbound-lp-mock__fields{display:flex;flex-direction:column;gap:4px;margin-bottom:8px}
.inbound-fld{height:16px;background:rgba(255,255,255,.08);border-radius:4px;border:1px solid var(--line)}
.inbound-lp-mock__btn{display:inline-block;background:var(--mint);color:#0a0e0f;font-family:"Geist Mono",monospace;font-size:8px;letter-spacing:.1em;text-transform:uppercase;border-radius:4px;padding:5px 10px;font-weight:600}
.inbound-steps{display:flex;align-items:center;gap:5px;justify-content:center;flex-wrap:wrap}
.inbound-step{font-family:"Geist Mono",monospace;font-size:7px;letter-spacing:.06em;text-transform:uppercase;color:rgba(242,239,231,.45);background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:6px;padding:5px 7px;text-align:center}
.inbound-step--mint{color:var(--mint);border-color:rgba(93,229,201,.3);background:rgba(93,229,201,.08)}
.inbound-arrow{color:rgba(93,229,201,.5);font-size:11px;flex-shrink:0}
.inbound-stats{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.inbound-stats span{font-family:"Geist Mono",monospace;font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:rgba(242,239,231,.35);background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:99px;padding:3px 8px}
/* ── Agency Dashboard mockup (Card 06 ABCW Global) ── */
.agency-dash{width:88%;background:var(--bg-3);border:1px solid var(--line-2);border-radius:12px;padding:16px;box-shadow:0 24px 50px -20px rgba(0,0,0,.6);display:flex;flex-direction:column;gap:12px}
.agency-dash__head{display:flex;justify-content:space-between;align-items:center;font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--gray)}
.agency-dash__badge{font-family:"Geist Mono",monospace;font-size:8px;font-weight:600;color:#0a0e0f;background:var(--mint);border-radius:4px;padding:2px 7px;letter-spacing:.08em}
.agency-accounts{display:flex;flex-direction:column;gap:6px}
.agency-acc{display:flex;align-items:center;gap:8px}
.agency-acc span{font-family:"Geist Mono",monospace;font-size:8px;color:var(--gray);text-transform:uppercase;letter-spacing:.08em;width:64px;flex-shrink:0}
.agency-acc__bar{flex:1;height:4px;background:rgba(255,255,255,.08);border-radius:99px;overflow:hidden}
.agency-acc__bar b{display:block;height:100%;width:var(--w,60%);background:var(--mint);border-radius:99px}
.agency-acc em{font-style:normal;font-family:"Geist Mono",monospace;font-size:8px;color:rgba(242,239,231,.4);width:52px;text-align:right;flex-shrink:0}
.agency-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.agency-kpi{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:8px;padding:8px 6px;text-align:center}
.agency-kpi span{display:block;font-family:"Geist Mono",monospace;font-size:7px;letter-spacing:.1em;color:var(--gray);text-transform:uppercase;margin-bottom:4px}
.agency-kpi strong{display:block;font-size:18px;font-weight:600;color:var(--ink);line-height:1}
.agency-stack-row{display:flex;gap:5px;flex-wrap:wrap;padding-top:4px;border-top:1px solid var(--line)}
.agency-stack-row span{font-family:"Geist Mono",monospace;font-size:7px;letter-spacing:.08em;text-transform:uppercase;color:rgba(242,239,231,.3);background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:99px;padding:3px 7px}
/* ── Full-Stack Freelance mockup (Card 09) ── */
.fs-system{width:88%;background:var(--bg-3);border:1px solid var(--line-2);border-radius:12px;padding:14px;box-shadow:0 24px 50px -20px rgba(0,0,0,.6);display:flex;flex-direction:column;gap:10px}
.fs-system__dash{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.fs-dash__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-family:"Geist Mono",monospace;font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray)}
.fs-dash__live{color:var(--mint);font-size:7px;border:1px solid rgba(93,229,201,.4);padding:2px 6px;border-radius:99px}
.fs-dash__metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:8px}
.fs-metric{text-align:center}
.fs-metric span{display:block;font-family:"Geist Mono",monospace;font-size:7px;letter-spacing:.08em;text-transform:uppercase;color:var(--gray);margin-bottom:2px}
.fs-metric strong{display:block;font-size:14px;font-weight:600;color:var(--ink);line-height:1}
.fs-metric i{display:block;font-style:normal;font-size:8px;color:var(--mint);margin-top:1px}
.fs-dash__chart{height:28px}
.fs-dash__chart svg{width:100%;height:100%}
.fs-system__lp{background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:8px;padding:10px 12px}
.fs-lp__tag{font-family:"Geist Mono",monospace;font-size:7px;color:var(--mint);letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}
.fs-lp__row{display:flex;gap:10px;align-items:flex-start}
.fs-lp__copy{flex:1;display:flex;flex-direction:column;gap:5px}
.fs-lp__line{height:6px;background:rgba(255,255,255,.14);border-radius:3px}
.fs-lp__line--wide{width:90%}
.fs-lp__line--mid{width:65%}
.fs-lp__btn{display:inline-block;background:var(--mint);color:#0a0e0f;font-family:"Geist Mono",monospace;font-size:7px;letter-spacing:.08em;text-transform:uppercase;border-radius:4px;padding:4px 9px;font-weight:600;margin-top:2px}
.fs-lp__products{display:flex;gap:6px;flex-shrink:0}
.fs-product{width:36px;height:44px;background:rgba(255,255,255,.08);border:1px solid var(--line);border-radius:6px}
.fs-product--alt{background:rgba(93,229,201,.1);border-color:rgba(93,229,201,.25)}
.fs-stack{display:flex;gap:5px;flex-wrap:wrap;padding-top:4px;border-top:1px solid var(--line)}
.fs-stack span{font-family:"Geist Mono",monospace;font-size:7px;letter-spacing:.08em;text-transform:uppercase;color:rgba(242,239,231,.3);background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:99px;padding:3px 7px}
/* ── Legacy b2b-board ── */
.b2b-board{width:84%;height:84%;background:var(--bg-3);border:1px solid var(--line-2);border-radius:12px;padding:18px;display:flex;flex-direction:column;position:relative;box-shadow:0 24px 50px -20px rgba(0,0,0,.5)}
.b2b-board__head{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gray);margin-bottom:14px}
.b2b-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;flex:1}
.b2b-col{display:flex;flex-direction:column;gap:5px;padding:10px;background:rgba(255,255,255,.04);border-radius:8px}
.b2b-col span{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray);margin-bottom:4px}
.b2b-col i{display:block;height:8px;background:var(--mint);border-radius:3px;width:88%;opacity:.85}
.b2b-col i:nth-child(3){width:74%}.b2b-col i:nth-child(4){width:60%}.b2b-col i:nth-child(5){width:46%}
.b2b-col b{margin-top:auto;font-family:"Jost",sans-serif;font-weight:400;font-size:24px;color:var(--ink)}
.b2b-foot{margin-top:14px;font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray)}

.creative-grid{width:84%;height:84%;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:10px;position:relative}
.cg{background:var(--bg-3);border:1px solid var(--line-2);border-radius:10px;padding:14px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 14px 30px -18px rgba(0,0,0,.4)}
.cg span{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray)}
.cg b{font-family:"Jost",sans-serif;font-weight:400;font-size:22px;color:var(--ink)}
.cg--3{background:var(--mint);color:var(--bg);border-color:var(--mint)}
.cg--3 span,.cg--3 b{color:var(--bg)}

.lp-mock{width:80%;height:84%;background:var(--bg-3);border:1px solid var(--line-2);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 50px -20px rgba(0,0,0,.5);position:relative}
.lp-mock__hero{background:var(--bg-2);color:var(--mint);padding:14px 18px;font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid var(--line)}
.lp-mock__rows{padding:18px;display:flex;flex-direction:column;gap:8px}
.lp-mock__rows i{display:block;height:6px;background:rgba(255,255,255,.08);border-radius:3px;width:var(--w)}
.lp-mock__cta{margin:0 18px;background:var(--mint);color:var(--bg);text-align:center;padding:8px;border-radius:6px;font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;font-weight:600}
.lp-mock__stats{margin-top:auto;padding:10px 18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;color:var(--gray)}

.looker{width:90%;height:90%;display:flex;flex-direction:column;padding:22px 24px;color:var(--ink);position:relative}
.looker__head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.looker__head span{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gray)}
.looker__tag{background:var(--mint);color:var(--bg)!important;padding:3px 8px;border-radius:999px;font-size:9px!important;font-weight:600}
.looker__grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;flex:1}
.looker__grid .lk-card--chart{grid-column:span 3;margin-top:10px}
.lk-card{background:rgba(93,229,201,.04);border:1px solid var(--line-2);padding:14px;border-radius:8px;display:flex;flex-direction:column;gap:4px}
.lk-card span{font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--gray)}
.lk-card strong{font-family:"Jost",sans-serif;font-weight:300;font-size:30px;letter-spacing:-.025em}
.lk-card i{font-family:"Geist Mono",monospace;font-size:10px;color:var(--mint);font-style:normal}
.lk-card--chart{padding:10px 14px;flex-direction:row;align-items:center;gap:14px}
.lk-card--chart svg{flex:1;height:50px}

/* SHOWCASE */
.showcase__stage{display:grid;grid-template-columns:1.6fr 1fr;gap:60px;align-items:center;margin-top:60px}
.bw{background:var(--bg-2);border:1px solid var(--line);border-radius:12px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.6)}
.bw__bar{display:flex;align-items:center;gap:6px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--bg-3)}
.bw__dot{width:10px;height:10px;border-radius:50%;background:var(--gray-2)}
.bw__url{margin-left:auto;font-family:"Geist Mono",monospace;font-size:11px;color:var(--gray);background:var(--bg-2);padding:5px 14px;border-radius:6px}
.bw__viewport{display:grid;grid-template-columns:1.4fr 1fr;min-height:340px;padding:36px;gap:32px;align-items:end}
.bw__hero h4{font-family:"Jost",sans-serif;font-weight:300;font-size:54px;line-height:.95;letter-spacing:-.03em;margin:14px 0 22px;color:var(--ink)}
.bw__hero h4 em{color:var(--mint);font-weight:300}
.bw__row{display:flex;gap:8px}
.bw__btn{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;padding:10px 14px;border-radius:999px;background:var(--mint);color:var(--bg);font-weight:600}
.bw__btn--ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.bw__panel{background:var(--bg-3);color:var(--ink);border-radius:10px;padding:18px;display:flex;flex-direction:column;justify-content:space-between;height:200px;border:1px solid var(--line-2)}
.bw__panel span{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--gray)}
.bw__panel strong{font-family:"Jost",sans-serif;font-weight:300;font-size:74px;letter-spacing:-.04em;color:var(--mint)}

.phone{width:280px;margin:0 auto;background:#000;border-radius:42px;padding:8px;position:relative;box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}
.phone__notch{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:90px;height:24px;background:#000;border-radius:14px;z-index:2}
.phone__screen{background:var(--bg-2);border-radius:34px;height:560px;overflow:hidden;display:flex;flex-direction:column;padding:22px 18px 24px;position:relative;color:var(--ink)}
.phone__top{display:flex;justify-content:space-between;font-family:"Geist Mono",monospace;font-size:10px;margin-bottom:32px;color:var(--ink);padding:0 6px}
.phone__hero{flex:0 0 auto;margin-bottom:24px}
.phone__hero h5{font-family:"Jost",sans-serif;font-weight:300;font-size:30px;line-height:1.02;letter-spacing:-.025em;margin:8px 0 18px}
.phone__hero h5 em{color:var(--mint);font-weight:300}
.phone__btn{display:inline-flex;align-items:center;gap:6px;background:var(--mint);color:var(--bg);padding:10px 14px;border-radius:999px;font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;font-weight:600}
.phone__cards{display:flex;flex-direction:column;gap:8px}
.phone__card{background:var(--bg-3);padding:12px 14px;border-radius:10px;display:flex;justify-content:space-between;align-items:center}
.phone__card span{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray)}
.phone__card strong{font-family:"Jost",sans-serif;font-weight:400;font-size:18px;color:var(--ink)}
.phone__card--accent{background:var(--mint);color:var(--bg)}
.phone__card--accent strong,.phone__card--accent span{color:var(--bg);opacity:1}
.phone__home{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);width:120px;height:4px;background:rgba(255,255,255,.2);border-radius:4px}

/* EXPERIENCE — dynamic CV */
.exp-stage{display:grid;grid-template-columns:1.05fr 1fr;gap:60px;align-items:start;border-top:1px solid var(--line);padding-top:40px}
.exp-stage__visual{position:sticky;top:120px;aspect-ratio:5/6;background:var(--bg-2);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:grid;place-items:center;transition:background .5s}
.expVis{position:relative;width:100%;height:100%;display:grid;place-items:center;padding:40px;color:var(--ink);text-align:center}
.expVis--dark{background:#000}
.expVis--mint{background:radial-gradient(circle at 50% 30%, rgba(93,229,201,.25), transparent 60%), var(--bg-2)}
.expVis__inner{display:flex;flex-direction:column;align-items:center;gap:18px;width:100%;max-width:380px;z-index:2;position:relative}
.expVis__hero{
  width:170px;height:170px;border-radius:50%;
  background:linear-gradient(155deg, #182022, #0e1314);
  border:1px solid var(--line-2);
  display:grid;place-items:center;overflow:hidden;
  box-shadow:0 20px 40px -10px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.06);
  position:relative;
}
.expVis__hero::before{content:"";position:absolute;inset:-2px;border-radius:inherit;background:radial-gradient(circle at 30% 20%, rgba(93,229,201,.3), transparent 60%);pointer-events:none}
.expVis__hero img{width:88%;height:88%;object-fit:contain;position:relative;z-index:1;filter:drop-shadow(0 10px 20px rgba(0,0,0,.5))}
.expVis__hero--full img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
/* pop-out variants — imagen se sale levemente del círculo manteniendo el círculo */
.expVis__hero--pop{overflow:visible;}
.expVis__hero--pop img{width:108%;height:108%;object-fit:cover;border-radius:50%;filter:drop-shadow(0 14px 28px rgba(0,0,0,.6));transform:translateY(-5%)}
.expVis__hero--pop-tilt{overflow:visible;}
.expVis__hero--pop-tilt img{width:110%;height:110%;object-fit:cover;border-radius:50%;filter:drop-shadow(0 14px 28px rgba(0,0,0,.55));transform:rotate(8deg) translateY(-4%)}
.expVis__lanyard{
  position:absolute;
  top:-20px;right:-18px;
  width:148px;
  object-fit:contain;
  filter:drop-shadow(0 12px 32px rgba(0,0,0,.6));
  transform:rotate(4deg);
  pointer-events:none;
  z-index:10;
}
.expVis__role{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mint)}
.expVis__name{font-family:"Jost",sans-serif;font-weight:300;font-size:54px;line-height:1;letter-spacing:-.03em;margin:0;color:var(--ink)}
.expVis__focus{font-size:15.5px;line-height:1.45;color:var(--ink-2);margin:0;max-width:32ch}
.expVis__kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;margin-top:14px}
.expVis__kpis div{border:1px solid var(--line-2);padding:10px 8px;border-radius:8px;background:rgba(0,0,0,.2)}
.expVis__kpis span{display:block;font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray)}
.expVis__kpis strong{font-family:"Jost",sans-serif;font-weight:400;font-size:20px;letter-spacing:-.01em;color:var(--mint)}

.exp-stage__list{display:flex;flex-direction:column}
.expRow{display:grid;grid-template-columns:40px 1fr auto;gap:24px;padding:28px 0;border-bottom:1px solid var(--line);cursor:pointer;transition:padding-left .35s ease;position:relative}
.expRow:first-child{border-top:1px solid var(--line)}
.expRow__num{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.18em;color:var(--gray);padding-top:8px}
.expRow__main h3{font-family:"Jost",sans-serif;font-weight:400;font-size:34px;line-height:1.05;letter-spacing:-.02em;margin:0 0 4px;color:var(--ink);transition:color .25s}
.expRow__main p.role{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mint);margin:0}
.expRow__channels{display:none;flex-wrap:wrap;gap:6px;margin-top:14px}
.expRow__channels li{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--line-2);padding:4px 10px;border-radius:999px;color:var(--gray)}
.expRow__date{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.06em;color:var(--gray);padding-top:10px;text-align:right;white-space:nowrap}
.expRow.is-active{padding-left:24px}
.expRow.is-active::before{content:"";position:absolute;left:0;top:30px;width:14px;height:1px;background:var(--mint)}
.expRow.is-active .expRow__main h3{color:var(--mint)}
.expRow.is-active .expRow__channels{display:flex}
.expRow:hover .expRow__main h3{color:var(--mint)}
/* dual-dates column for merged Vicari */
.expRow__dates{display:flex;flex-direction:column;align-items:flex-end;gap:4px;padding-top:10px}
.expRow__dates .expRow__date{padding-top:0}
.expRow__date--dim{opacity:0.4;font-size:10px!important}
/* second sub-entry inside Vicari row */
.expRow__entry2{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}
.expRow__entry2 .role--dim{color:rgba(242,239,231,.38);margin:0}
.expRow__entry2__chips{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--gray);margin:6px 0 0}

/* BRANDS */
.brands__intro{display:grid;grid-template-columns:1.3fr 1fr;gap:60px;align-items:end;margin-bottom:32px}

/* Filter buttons */
.brands__filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:32px}
.bf{font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:7px 16px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--gray);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.bf:hover{background:rgba(93,229,201,.08);border-color:rgba(93,229,201,.35);color:var(--mint)}
.bf.is-active{background:rgba(93,229,201,.12);border-color:rgba(93,229,201,.5);color:var(--mint)}

/* Hidden brand (filtered out) */
.brand.is-hidden{display:none}
.brands__copy{font-size:18px;line-height:1.4;color:var(--ink-2);max-width:42ch;margin:0;letter-spacing:-.005em}

.brands__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-bottom:40px}
.brand{background:var(--bg-2);padding:32px 24px;display:flex;flex-direction:column;gap:14px;position:relative;transition:background .35s;min-height:200px;align-items:center;justify-content:center;text-align:center}
.brand:hover{background:var(--bg-3)}
.brand__logo{
  width:100%;height:80px;
  display:grid;place-items:center;
  margin-bottom:6px;
}
.brand__logo img{max-width:88%;max-height:80px;object-fit:contain;filter:brightness(0) invert(1);opacity:.85;transition:opacity .35s, filter .35s;mix-blend-mode:screen}
.brand__logo img.no-recolor{filter:none;mix-blend-mode:normal}
.brand:hover .brand__logo img{opacity:1}
.brand__logo image-slot{width:100%;height:100%}
.brand__name{font-family:"Jost",sans-serif;font-weight:400;font-size:18px;letter-spacing:-.005em;color:var(--ink)}
.brand__type{font-family:"Geist Mono",monospace;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--gray)}
.brand__num{display:none}

.brands__marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0;display:flex;overflow:hidden;margin-top:40px}
.mq{display:flex;gap:32px;flex-shrink:0;font-family:"Jost",sans-serif;font-style:italic;font-weight:300;font-size:48px;line-height:1;white-space:nowrap;animation:scroll 50s linear infinite;padding-right:32px;color:var(--ink)}
.mq span:nth-child(even){color:var(--mint);font-size:24px;align-self:center;font-style:normal}

/* CONTACT */
.contact__grid{display:grid;grid-template-columns:1.4fr 1fr;gap:80px;align-items:end}
.contact__title{font-family:"Jost",sans-serif;font-weight:300;font-size:clamp(64px, 10vw, 168px);line-height:.92;letter-spacing:-.04em;margin:0 0 40px;color:var(--ink)}
.contact__title em{color:var(--mint);font-weight:300}
.contact__mail{display:inline-flex;align-items:center;gap:12px;font-family:"Jost",sans-serif;font-style:italic;font-weight:300;font-size:36px;line-height:1;border-bottom:1px solid var(--ink);padding:8px 0;transition:color .25s, border-color .25s, gap .25s;color:var(--ink)}
.contact__mail:hover{color:var(--mint);border-color:var(--mint);gap:18px}
.contact__mail-arrow{font-style:normal;font-size:24px}

.contact__rhs{position:relative}
.contact__row{display:grid;grid-template-columns:120px 1fr;gap:24px;padding:18px 0;border-bottom:1px solid var(--line)}
.contact__row:first-child{border-top:1px solid var(--line)}
.contact__label{font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gray)}
.contact__val{font-family:"Jost",sans-serif;font-size:15px;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px}
.contact__val.link{transition:color .25s}
.contact__val.link:hover{color:var(--mint)}

/* FOOTER */
.footer{max-width:var(--max);margin:80px auto 0;padding:60px var(--pad) 40px;border-top:1px solid var(--line)}
.footer__row{display:flex;gap:32px;align-items:flex-start;margin-bottom:60px}
.footer__mark{width:42px;height:42px;border-radius:50%;background:var(--mint);color:var(--bg);display:grid;place-items:center;font-family:"Jost",sans-serif;font-weight:600;font-size:16px}
.footer__big{font-family:"Jost",sans-serif;font-weight:300;font-size:clamp(64px, 12vw, 160px);line-height:.86;letter-spacing:-.035em;margin:0;color:var(--ink)}
.footer__meta{display:flex;justify-content:space-between;font-family:"Geist Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray);flex-wrap:wrap;gap:18px}
.footer__meta a:hover{color:var(--mint)}

/* RESPONSIVE */
@media (max-width: 980px){
  :root{--pad:24px}
  .nav__links{display:none}
  .nav__menu{display:flex}
  .hero{padding-top:100px}
  .hero__title{font-size:clamp(48px, 14vw, 96px)}
  .hero__bottom{grid-template-columns:1fr;gap:60px;margin-top:48px}
  .hero__visual{grid-template-columns:1fr 1fr;gap:14px}
  .section{padding:90px var(--pad) 40px}
  .section__title{font-size:clamp(40px, 10vw, 72px);margin-bottom:50px}
  .platforms__grid{grid-template-columns:repeat(4,1fr)}
  .about__grid{grid-template-columns:1fr;gap:40px}
  .about__lhs{position:relative;top:auto}
  .about__icon{width:96px;height:96px}
  .about__pillars{grid-template-columns:1fr 1fr}
  .about__pillars > div{padding:14px 12px}
  .about__pillars span{font-size:9px}
  .about__pillars h4{font-size:15px;margin:4px 0 6px}
  .about__pillars p{font-size:11.5px;line-height:1.4}
  .exp-grid{grid-template-columns:1fr 1fr}
  .port-grid{grid-template-columns:1fr;gap:60px}
  .case--lg{grid-template-columns:1fr;grid-column:span 1;gap:24px}
  .case__title{font-size:30px}
  .showcase__stage{grid-template-columns:1fr;gap:40px}
  .bw__viewport{grid-template-columns:1fr;padding:24px}
  .bw__panel{height:auto;min-height:140px}
  .bw__hero h4{font-size:34px}
  .exp-stage{grid-template-columns:1fr;gap:30px}
  .exp-stage__visual{position:relative;top:auto;aspect-ratio:4/3}
  .expVis__name{font-size:36px}
  .expRow{grid-template-columns:30px 1fr;gap:14px}
  .expRow__date{grid-column:2;text-align:left;padding-top:0}
  .expRow__main h3{font-size:24px}
  .brands__intro{grid-template-columns:1fr;gap:24px;align-items:flex-start}
  .brands__grid{grid-template-columns:repeat(3,1fr)}
  .brand{padding:18px 10px;min-height:140px;gap:8px}
  .brand__logo{height:52px}
  .brand__logo img{max-height:52px}
  .brand__logo img.brand-logo--mobile-sm{max-height:36px!important;max-width:36px!important;width:36px!important;height:auto!important}
  .brand__name{font-size:11px;letter-spacing:-.01em}
  .brand__type{font-size:7.5px;letter-spacing:.12em}
  .brand__name{font-size:16px}
  .mq{font-size:32px}
  .mq span:nth-child(even){font-size:18px}
  .contact__grid{grid-template-columns:1fr;gap:48px}
  .contact__mail{font-size:24px}
  .contact__row{grid-template-columns:90px 1fr}
  .footer__row{flex-direction:column;gap:18px;margin-bottom:40px}
  .footer__meta{flex-direction:column;gap:8px}
}
@media (max-width: 560px){
  /* ── Mobile pill nav — replace hamburger ── */
  .nav__menu{display:none!important}
  .nav__cta{display:none}
  .nav__links{
    display:flex!important;
    position:static!important;top:auto!important;
    background:rgba(17,24,26,.9);
    overflow-x:auto;scrollbar-width:none;
    flex-shrink:1;
  }
  .nav__links::-webkit-scrollbar{display:none}
  .nav{padding:10px 14px;gap:10px}
  .nav.is-scrolled{padding:8px 14px}
  .nav__pill{padding:5px 7px;min-height:30px}
  .nav__pill img{width:19px;height:19px}
  /* tap = focus → expand label */
  .nav__pill:focus{background:rgba(93,229,201,.1);color:var(--mint);outline:none}
  .nav__pill:focus span{max-width:90px;opacity:1;margin-left:6px}
  /* more room for long labels like EDUCACIÓN */
  .nav__pill.is-active span,.nav__pill:hover span{max-width:90px}
  .nav__pill span{font-size:9px;letter-spacing:.09em}

  .platforms__grid{grid-template-columns:repeat(3,1fr)}
  /* exp-grid overridden by carousel below */
  .nav__name{display:none}
  .panel__kpi{grid-template-columns:1fr 1fr}
  .panel__kpi .kpi:last-child{grid-column:span 2}
  .ticker{font-size:24px}
  .ticker span:nth-child(even){font-size:14px}
}

/* ── Experience carousel (mobile only) ──────────────────────────── */
@media(max-width:560px){
  /* Hide the list; show only the visual card, full-screen */
  .exp-stage__list{display:none!important}
  .exp-stage{display:block;position:relative;padding-top:0}
  .exp-stage__visual{
    aspect-ratio:unset;
    height:calc(100dvh - 200px);
    max-height:600px;
    min-height:320px;
    border-radius:14px;
    overflow:hidden;
  }

  /* Fix expVis overflow: override grid sizing so content respects card width */
  .exp-stage__visual{display:flex;flex-direction:column;justify-content:center;align-items:stretch}
  .expVis{padding:20px;overflow:hidden;max-width:100%}
  .expVis__inner{max-width:100%;min-width:0;width:100%}
  .expVis__role{white-space:normal;line-height:1.4}
  .expVis__name{font-size:30px}
  .expVis__kpis strong{font-size:16px}

  /* Wrapper for arrows + visual + dots */
  .exp-mob-wrap{position:relative}

  /* Arrows */
  .exp-mob-arrow{
    position:absolute;top:50%;transform:translateY(-50%);
    z-index:10;width:40px;height:40px;border-radius:50%;
    border:1px solid rgba(242,239,231,.18);
    background:rgba(10,14,15,.82);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    color:var(--ink);font-size:17px;
    display:grid;place-items:center;cursor:pointer;
    transition:background .2s,border-color .2s,color .2s;
  }
  .exp-mob-arrow--prev{left:8px}
  .exp-mob-arrow--next{right:8px}
  .exp-mob-arrow:hover{background:rgba(93,229,201,.12);border-color:rgba(93,229,201,.45);color:var(--mint)}

  /* Dots */
  .exp-mob-dots{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:14px}
  .exp-mob-dot{
    width:8px;height:8px;border-radius:50%;padding:0;
    background:rgba(242,239,231,.2);border:none;cursor:pointer;
    transition:background .2s,transform .2s;
  }
  .exp-mob-dot.is-active{background:var(--mint);transform:scale(1.35)}
  .exp-mob-dot:hover:not(.is-active){background:rgba(242,239,231,.45)}
}

/* ── Expertise carousel (mobile only) ───────────────────────────── */
@media(max-width:560px){
  .exp-carousel-wrap{position:relative}

  /* Horizontal scroll container */
  .exp-grid{
    display:flex!important;
    flex-direction:row;
    overflow-x:scroll;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:12px;
    background:transparent!important;
    border:none!important;
    border-radius:0!important;
    padding:0 20px 4px;
  }
  .exp-grid::-webkit-scrollbar{display:none}

  /* Each card snaps & keeps its design */
  .exp{
    min-width:82vw;max-width:82vw;
    scroll-snap-align:center;
    flex-shrink:0;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    min-height:260px;
  }

  /* Arrows */
  .exp-arrow{
    position:absolute;top:45%;transform:translateY(-50%);
    z-index:10;width:38px;height:38px;border-radius:50%;
    border:1px solid rgba(242,239,231,.18);
    background:rgba(10,14,15,.8);
    backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
    color:var(--ink);font-size:16px;
    display:grid;place-items:center;cursor:pointer;
    transition:background .2s,border-color .2s,color .2s;
  }
  .exp-arrow--prev{left:0}
  .exp-arrow--next{right:0}
  .exp-arrow:hover{background:rgba(93,229,201,.12);border-color:rgba(93,229,201,.45);color:var(--mint)}

  /* Dots */
  .exp-dots{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:16px}
  .exp-dot{
    width:8px;height:8px;border-radius:50%;padding:0;
    background:rgba(242,239,231,.2);border:none;cursor:pointer;
    transition:background .2s,transform .2s;
  }
  .exp-dot.is-active{background:var(--ink);transform:scale(1.4)}
  .exp-dot:hover:not(.is-active){background:rgba(242,239,231,.4)}
}

/* ── Expertise shortcut chips ────────────────────────────────────── */
.exp-shortcuts{display:none}
@media(max-width:560px){
  .exp-shortcuts{
    display:flex;flex-wrap:wrap;gap:8px;
    padding:16px 20px 4px;
  }
  .exp-sc{
    display:flex;align-items:center;gap:6px;
    padding:6px 12px;border-radius:999px;
    border:1px solid var(--line);
    background:rgba(17,24,26,.7);
    color:var(--gray);
    font-family:"Geist Mono",monospace;font-size:9px;
    letter-spacing:.1em;text-transform:uppercase;
    cursor:pointer;white-space:nowrap;
    transition:background .2s,border-color .2s,color .2s;
  }
  .exp-sc img{
    width:16px;height:16px;object-fit:contain;
    filter:brightness(.55) saturate(.4);
    transition:filter .2s;
  }
  .exp-sc.is-active{
    border-color:rgba(93,229,201,.5);
    background:rgba(93,229,201,.1);
    color:var(--mint);
  }
  .exp-sc.is-active img{filter:none}
  .exp-sc:hover:not(.is-active){
    border-color:rgba(93,229,201,.25);
    color:var(--ink-2);
  }
}

/* ── Card Stack (Casos que movieron negocio) ─────────────────────── */
.card-stack{width:100%}
.card-stack__stage{position:relative;width:100%;height:480px}
.card-stack__inner{
  position:absolute;inset:0;
  display:flex;align-items:flex-end;justify-content:center;
  perspective:1100px;
}
.stack-card{
  position:absolute;bottom:0;
  width:520px;height:400px;
  border-radius:20px;
  border:1px solid rgba(242,239,231,.1);
  overflow:hidden;
  will-change:transform;user-select:none;
  transition:transform .5s cubic-bezier(.23,.86,.39,.96), opacity .3s ease, box-shadow .4s ease;
  box-shadow:0 24px 60px rgba(0,0,0,.55);
  cursor:pointer;opacity:0;
}
.stack-card.is-active{
  cursor:grab;
  box-shadow:0 32px 80px rgba(0,0,0,.7), 0 0 0 1px rgba(93,229,201,.18);
}
.stack-card.is-active:active{cursor:grabbing}

.stack-card__visual{
  position:absolute;inset:0;
  background:var(--bg-2);
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.stack-card__scale{
  transform:scale(.82);transform-origin:center center;
  width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
}
.stack-card__overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(10,14,15,.93) 0%,rgba(10,14,15,.45) 42%,transparent 68%);
  pointer-events:none;z-index:1;
}
.stack-card__meta{
  position:absolute;bottom:0;left:0;right:0;
  padding:22px 26px;z-index:2;
  display:flex;flex-direction:column;gap:5px;
}
.stack-card__num{
  font-family:"Geist Mono",monospace;font-size:10px;
  letter-spacing:.18em;color:var(--mint);text-transform:uppercase;
}
.stack-card__title{
  font-family:"Jost",sans-serif;font-weight:600;
  font-size:20px;line-height:1.15;color:var(--ink);
}
.stack-card__type{
  font-family:"Geist Mono",monospace;font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;color:rgba(242,239,231,.42);
}
.stack-card__tags{display:flex;gap:5px;flex-wrap:wrap;margin-top:4px}
.stack-card__tag{
  font-family:"Geist Mono",monospace;font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;
  padding:3px 9px;border-radius:999px;
  border:1px solid rgba(242,239,231,.18);color:rgba(242,239,231,.52);
}
.stack-card__desc{
  font-family:"Jost",sans-serif;font-size:12px;line-height:1.65;
  color:rgba(242,239,231,.58);margin-top:10px;
}
.stack-card__link{
  font-family:"Geist Mono",monospace;font-size:10px;letter-spacing:.12em;
  text-transform:lowercase;color:var(--mint);text-decoration:none;
  margin-top:4px;opacity:.8;transition:opacity .18s;
}
.stack-card__link:hover{opacity:1;}

/* Arrow buttons */
.cs-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  z-index:200;
  width:48px;height:48px;border-radius:50%;
  border:1px solid rgba(242,239,231,.18);
  background:rgba(10,14,15,.72);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  color:var(--ink);font-size:20px;
  display:grid;place-items:center;
  cursor:pointer;
  transition:background .2s,border-color .2s,transform .2s;
}
.cs-arrow--prev{left:0}
.cs-arrow--next{right:0}
.cs-arrow:hover{
  background:rgba(93,229,201,.12);
  border-color:rgba(93,229,201,.45);
  color:var(--mint);
  transform:translateY(-50%) scale(1.08);
}
.cs-arrow:active{transform:translateY(-50%) scale(.96)}

/* Dots */
.cs-desc{
  text-align:center;
  font-family:"Jost",sans-serif;
  font-weight:300;
  font-size:14px;
  line-height:1.72;
  letter-spacing:0;
  color:rgba(242,239,231,.45);
  max-width:600px;
  margin:28px auto 0;
  padding:0 24px;
  opacity:1;
  transition:opacity .18s ease;
  min-height:3.5em;
}
.card-stack__dots{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:18px}
.cs-dot{
  width:8px;height:8px;border-radius:50%;padding:0;
  background:rgba(242,239,231,.2);border:none;cursor:pointer;
  transition:background .2s,transform .2s;
}
.cs-dot.is-active{background:var(--ink);transform:scale(1.3)}
.cs-dot:hover:not(.is-active){background:rgba(242,239,231,.4)}

/* Responsive */
@media(max-width:600px){
  /* Stage — clip cards that peek outside */
  .card-stack{overflow:hidden}
  .card-stack__stage{height:380px;overflow:hidden}
  .card-stack__inner{overflow:hidden}

  /* Active card fills most of the screen width */
  .stack-card{width:86vw;height:330px}

  /* Title smaller so it fits */
  .stack-card__title{font-size:16px}
  .stack-card__type{font-size:9px}

  /* Arrows — inside padding, bigger tap target */
  .cs-arrow{width:38px;height:38px;font-size:16px}
  .cs-arrow--prev{left:4px}
  .cs-arrow--next{right:4px}

  /* Dots — bigger tap target */
  .card-stack__dots{gap:10px;margin-top:20px}
  .cs-dot{width:10px;height:10px}
  .cs-dot.is-active{transform:scale(1.4)}

  /* Description text smaller */
  .cs-desc{font-size:13px;margin-top:20px;padding:0 16px;min-height:4em}
}

/* ── Contact Rocket ─────────────────────────── */
.contact__rocket{
  width:160px;
  transform:rotate(20deg);
  filter:drop-shadow(0 20px 48px rgba(0,0,0,.55));
  margin-bottom:28px;
  display:block;
}

/* ── Contact Form ───────────────────────────── */
.cform{display:flex;flex-direction:column;gap:20px}
.cform__row--2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cform__field{display:flex;flex-direction:column;gap:8px}
.cform__label{
  font-family:"Geist Mono",monospace;font-size:10px;
  text-transform:uppercase;letter-spacing:.16em;color:var(--gray);
}
.cform__label span{color:var(--gray-2);text-transform:none;letter-spacing:0;font-size:10px}
.cform__input,.cform__select,.cform__textarea{
  background:var(--bg-2);
  border:1px solid var(--line-2);
  border-radius:10px;
  color:var(--ink);
  font-family:"Jost",sans-serif;font-size:15px;
  padding:13px 16px;
  outline:none;
  transition:border-color .2s, box-shadow .2s;
  width:100%;
}
.cform__input:focus,.cform__select:focus,.cform__textarea:focus{
  border-color:var(--mint);
  box-shadow:0 0 0 3px rgba(93,229,201,.1);
}
.cform__textarea{resize:vertical;min-height:110px}
.cform__telrow{display:grid;grid-template-columns:100px 1fr;gap:10px}
.cform__select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237d8484' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:32px}
.cform__btn{
  background:var(--mint);color:var(--bg);border:none;
  border-radius:999px;
  font-family:"Geist Mono",monospace;font-size:11px;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;
  padding:16px 32px;cursor:pointer;width:100%;
  transition:background .2s, transform .2s, box-shadow .2s;
  margin-top:4px;
}
.cform__btn:hover{background:#7FF0D9;transform:translateY(-2px);box-shadow:0 12px 32px rgba(93,229,201,.25)}

/* ── Floating WhatsApp ──────────────────────── */
.wa-float{
  position:fixed;bottom:32px;right:32px;z-index:999;
  width:68px;height:68px;border-radius:50%;
  background:var(--mint);
  display:grid;place-items:center;
  transition:transform .22s, filter .22s, background .22s;
  text-decoration:none;
  filter:drop-shadow(0 8px 20px rgba(93,229,201,.35));
}
.wa-float:hover{transform:scale(1.1) translateY(-3px);background:#4dd4b8;filter:drop-shadow(0 14px 28px rgba(93,229,201,.50))}

/* ── Education Bento Grid ── */
.edu-bento{
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:auto auto;
  gap:14px;
  width:100%;
}
/* Tec spans both rows on left */
.edu-card--tec{ grid-column:1; grid-row:1; }
.edu-card--esic{ grid-column:1; grid-row:2; }
.edu-card--skills{ grid-column:2; grid-row:1; }
.edu-card--certs{ grid-column:2; grid-row:2; }

.edu-card{
  background:var(--bg-2);
  border:1px solid var(--line);
  border-radius:20px;
  padding:26px 28px;
  display:flex;
  flex-direction:column;
  gap:14px;
  transition:border-color .22s, transform .22s, box-shadow .22s;
  position:relative;
  overflow:hidden;
}
.edu-card:hover{
  border-color:rgba(93,229,201,.3);
  transform:translateY(-2px);
  box-shadow:0 8px 32px rgba(0,0,0,.35);
}
/* Subtle dot grid on hover */
.edu-card::before{
  content:'';
  position:absolute;inset:0;
  background:radial-gradient(circle,rgba(93,229,201,.04) 1px,transparent 1px);
  background-size:18px 18px;
  opacity:0;transition:opacity .3s;
  pointer-events:none;
}
.edu-card:hover::before{ opacity:1; }

/* Header row */
.edu-card__header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.edu-card__logo{
  height:34px;
  object-fit:contain;
  object-position:left;
  filter:brightness(1.1);
  max-width:140px;
}
.edu-card__logo--esic{
  border-radius:6px;
  height:30px;
}
.edu-card__icon{
  font-size:22px;
  line-height:1;
}
.edu-card__meta{
  font-family:"Geist Mono",monospace;
  font-size:10px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gray);
  white-space:nowrap;
}
.edu-card__badge{
  font-family:"Geist Mono",monospace;
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#0a0e0f;
  background:var(--mint);
  padding:3px 9px;
  border-radius:99px;
  font-weight:600;
}

/* Graduation photo */
.edu-card__img-wrap{
  width:100%;
  height:180px;
  border-radius:14px;
  overflow:hidden;
  flex-shrink:0;
}
.edu-card__photo{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center 33%;
  filter:brightness(.92);
  transition:transform .4s;
}
.edu-card:hover .edu-card__photo{ transform:scale(1.03); }
.edu-card__photo--esic{ object-position:center 35%; }

/* Platform logos strip — Skills card */
.edu-card__platforms{
  width:100%;
  padding:10px 0 4px;
}
.edu-card__platforms-img{
  width:100%;
  height:auto;
  object-fit:contain;
  opacity:.9;
  filter:drop-shadow(0 1px 4px rgba(0,0,0,.3));
}

/* Text */
.edu-card__title{
  font-family:"Jost",sans-serif;
  font-weight:500;
  font-size:18px;
  line-height:1.2;
  color:var(--ink);
  margin:0;
}
.edu-card__sub{
  font-family:"Geist Mono",monospace;
  font-size:10px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--mint);
  margin:0;
}
.edu-card__degree{
  font-size:13.5px;
  line-height:1.55;
  color:rgba(242,239,231,.65);
  margin:0;
}
.edu-card__avg{
  display:flex;
  align-items:baseline;
  gap:8px;
  margin:0;
}
.edu-card__avg span{
  font-family:"Geist Mono",monospace;
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--gray);
}
.edu-card__avg strong{
  font-family:"Jost",sans-serif;
  font-size:28px;
  font-weight:600;
  color:var(--mint);
  line-height:1;
}

/* Bullets */
.edu-card__bullets{
  margin:0;
  padding:0 0 0 14px;
  display:flex;
  flex-direction:column;
  gap:6px;
  list-style:none;
}
.edu-card__bullets li{
  font-size:12.5px;
  line-height:1.55;
  color:rgba(242,239,231,.55);
  position:relative;
  padding-left:14px;
}
.edu-card__bullets li::before{
  content:'·';
  position:absolute;left:0;
  color:var(--mint);
  font-size:16px;
  line-height:1.2;
}

/* Tags */
.edu-card__tags{
  display:flex;
  gap:6px;
  flex-wrap:nowrap;
  margin-top:auto;
}
.edu-card__tags--wrap{ flex-wrap:wrap; }
.edu-card__tags span{
  font-family:"Geist Mono",monospace;
  font-size:10px;
  letter-spacing:.08em;
  color:rgba(242,239,231,.45);
  background:rgba(255,255,255,.05);
  border:1px solid var(--line);
  border-radius:99px;
  padding:4px 10px;
  transition:border-color .2s, color .2s;
  white-space:nowrap;
}
.edu-card:hover .edu-card__tags span{
  border-color:rgba(93,229,201,.2);
  color:rgba(242,239,231,.65);
}

/* Certs list */
.edu-card__certs{
  margin:0;padding:0;
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:10px;
  flex:1;
}
.edu-card__certs li{
  font-size:12.5px;
  line-height:1.5;
  color:rgba(242,239,231,.58);
  display:flex;
  flex-direction:column;
  gap:1px;
  padding-bottom:10px;
  border-bottom:1px solid var(--line);
}
.edu-card__certs li:last-child{ border-bottom:none; padding-bottom:0; }
.cert-org{
  font-family:"Geist Mono",monospace;
  font-size:9px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--mint);
}

/* Skills card layout */
.edu-card--skills{ justify-content:flex-start; }

/* Responsive */
@media(max-width:860px){
  .edu-bento{
    grid-template-columns:1fr;
    grid-template-rows:auto;
  }
  .edu-card--tec,
  .edu-card--esic,
  .edu-card--skills,
  .edu-card--certs{
    grid-column:1;
    grid-row:auto;
  }
}