/* Cooper Design System - tokens
   Fuente unica de verdad en CSS. Generado, no editar a mano.
   Los colores y tipografia tambien viven en el Kit de Elementor (globales).
   Esta hoja cubre lo que el Kit no puede expresar. */

:root{
  /* superficies */
  --surface-base:#020617;
  --surface-raised:#0B1224;
  --surface-overlay:#1A1F3A;

  /* marca */
  --brand-primary:#306BFF;        /* identidad. NUNCA texto, NUNCA relleno de boton */
  --brand-primary-text:#5A8FFF;   /* 6.54:1 sobre base */
  --brand-primary-fill:#1E4FCC;   /* 6.90:1 con texto blanco */
  --brand-accent:#7A5CFF;

  /* texto */
  --text-primary:#FFFFFF;         /* 20.17:1 */
  --text-secondary:#A8B2C1;       /*  9.42:1 */
  --text-tertiary:#8A93A5;        /*  6.53:1 */
  --text-disabled:#4B5563;        /*  2.67:1 - solo estados inertes */

  /* bordes */
  --border-subtle:rgba(255,255,255,.10);
  --border-strong:rgba(255,255,255,.20);
  --border-focus:#5A8FFF;

  /* categorias - degradado o acento, nunca parrafo */
  --cat-coopercards-from:#306BFF; --cat-coopercards-to:#7A5CFF;
  --cat-growthlab-from:#1EE5B4;   --cat-growthlab-to:#7CFD8A;
  --cat-posts-from:#005F73;       --cat-posts-to:#0A9396;
  --cat-challenges-from:#6C3AFF;  --cat-challenges-to:#D13AFF;
  --cat-coopups-from:#FF914D;     --cat-coopups-to:#FF6F61;
  --cat-announcements-from:#3BAFDA; --cat-announcements-to:#A8C7FF;

  --grad-coopercards:linear-gradient(180deg,#0B1224 0%,var(--cat-coopercards-from) 60%,var(--cat-coopercards-to) 100%);
  --grad-growthlab:linear-gradient(180deg,#0B1224 0%,var(--cat-growthlab-from) 60%,var(--cat-growthlab-to) 100%);
  --grad-posts:linear-gradient(180deg,#0B1224 0%,var(--cat-posts-from) 50%,var(--cat-posts-to) 100%);
  --grad-challenges:linear-gradient(180deg,#0B1224 0%,var(--cat-challenges-from) 60%,var(--cat-challenges-to) 100%);
  --grad-coopups:linear-gradient(180deg,#0B1224 0%,var(--cat-coopups-from) 60%,var(--cat-coopups-to) 100%);
  --grad-announcements:linear-gradient(180deg,#0B1224 0%,var(--cat-announcements-from) 60%,var(--cat-announcements-to) 100%);

  /* semanticos */
  --semantic-success:#10B981; --semantic-error:#EF4444;
  --semantic-warning:#F59E0B; --semantic-info:#3B82F6;

  /* espaciado base-4 */
  --space-1:4px;  --space-2:8px;  --space-3:12px; --space-4:16px;
  --space-6:24px; --space-8:32px; --space-12:48px; --space-16:64px;
  --space-20:80px; --space-24:96px; --space-32:128px; --space-40:160px;
  --container-max:1200px;

  /* radio */
  --radius-1:4px; --radius-2:8px; --radius-3:12px; --radius-4:16px;
  --radius-5:20px; --radius-6:24px; --radius-8:32px; --radius-pill:9999px;
  --radius-button:var(--radius-pill);
  --radius-card:var(--radius-6);
  --radius-input:var(--radius-3);
  --radius-media:var(--radius-4);

  /* elevacion: borde + sombra, nunca sombra sola */
  --elev-1:0 1px 2px rgba(0,0,0,.40);
  --elev-2:0 8px 24px rgba(0,0,0,.35);
  --elev-3:0 20px 60px rgba(0,0,0,.50);
  --glow-primary:0 0 48px rgba(48,107,255,.35);
  --glow-accent:0 0 48px rgba(30,229,180,.30);

  /* glass */
  --glass-bg:linear-gradient(180deg,rgba(31,46,77,.40) 0%,rgba(15,23,42,.60) 100%);
  --glass-blur:blur(24px) saturate(140%);
  --glass-border:1px solid rgba(255,255,255,.10);

  /* movimiento */
  --motion-ambient-dur:5000ms;
  --motion-ambient-ease:cubic-bezier(.42,0,.58,1);
  --motion-base-dur:240ms;
  --motion-base-ease:cubic-bezier(.4,0,.2,1);
  --motion-enter-dur:400ms;
  --motion-enter-ease:cubic-bezier(.16,1,.3,1);
}

/* Foco visible en todo lo interactivo */
:where(a,button,input,textarea,select,[tabindex]):focus-visible{
  outline:2px solid var(--border-focus);
  outline-offset:2px;
}

/* Glass, con fallback opaco obligatorio */
.cooper-glass{
  background:var(--surface-raised);
  border:var(--glass-border);
  border-radius:var(--radius-card);
}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .cooper-glass{
    background:var(--glass-bg);
    -webkit-backdrop-filter:var(--glass-blur);
    backdrop-filter:var(--glass-blur);
  }
}

/* Cifras tabulares */
.cooper-stat{ font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1; }

/* Blobs ambientales - la firma de movimiento de Cooper, portada de la app */
.cooper-blob{ position:absolute; pointer-events:none; border-radius:50%; filter:blur(60px); will-change:transform; }
.cooper-blob--a{ animation:cooper-drift-a var(--motion-ambient-dur) var(--motion-ambient-ease) infinite alternate; }
.cooper-blob--b{ animation:cooper-drift-b calc(var(--motion-ambient-dur) * 1.3) var(--motion-ambient-ease) infinite alternate; }
@keyframes cooper-drift-a{ from{transform:translate3d(-50px,-30px,0) scale(1);} to{transform:translate3d(50px,30px,0) scale(1.2);} }
@keyframes cooper-drift-b{ from{transform:translate3d(40px,60px,0) scale(1);} to{transform:translate3d(-60px,-40px,0) scale(1.3);} }

@media (prefers-reduced-motion:reduce){
  .cooper-blob--a,.cooper-blob--b{ animation:none !important; }
  *,*::before,*::after{ animation-duration:.001ms !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}
/* ============ TIPOGRAFIA (portado 1:1 de tokens/typography.css) ============ */
:root{
  --font-sans:"Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --fw-extralight:200; --fw-light:300; --fw-regular:400; --fw-medium:500;
  --fw-semibold:600; --fw-bold:700; --fw-extrabold:800;

  --display-1-size:76px; --display-1-weight:800; --display-1-tracking:-2.5px; --display-1-leading:1.02;
  --display-2-size:56px; --display-2-weight:800; --display-2-tracking:-1.5px; --display-2-leading:1.08;
  --h1-size:44px; --h1-weight:700; --h1-tracking:-1px;   --h1-leading:1.15;
  --h2-size:34px; --h2-weight:700; --h2-tracking:-0.6px; --h2-leading:1.20;
  --h3-size:26px; --h3-weight:600; --h3-tracking:-0.3px; --h3-leading:1.30;
  --h4-size:20px; --h4-weight:600; --h4-tracking:0;      --h4-leading:1.40;
  --body-lg-size:18px; --body-lg-weight:400; --body-lg-leading:1.60;
  --body-size:16px;    --body-weight:400;    --body-leading:1.60;
  --body-sm-size:14px; --body-sm-weight:400; --body-sm-leading:1.55;
  --label-size:14px;   --label-weight:600;   --label-leading:1.40;
  --overline-size:12px; --overline-weight:500; --overline-tracking:1.2px; --overline-leading:1.30;
  --button-size:16px;  --button-weight:600;  --button-leading:1.40;
  --stat-size:44px;    --stat-weight:700;    --stat-tracking:-1px; --stat-leading:1.10;
}
@media (max-width:1024px){ :root{
  --display-1-size:56px; --display-2-size:44px; --h1-size:38px; --h2-size:30px;
  --h3-size:24px; --h4-size:19px; --body-lg-size:18px; --stat-size:38px; } }
@media (max-width:767px){ :root{
  --display-1-size:40px; --display-2-size:34px; --h1-size:31px; --h2-size:26px;
  --h3-size:22px; --h4-size:18px; --body-lg-size:17px; --stat-size:32px; } }

/* Animacion de entrada de la CooperCard, portada del original */
@keyframes ccIn{
  0%{ opacity:0; transform:rotateY(0deg) rotateX(0deg) scale(.95) translateY(18px); }
  100%{ opacity:1; transform:rotateY(-6deg) rotateX(2.5deg) scale(1) translateY(0); }
}
@media (prefers-reduced-motion:reduce){
  [data-card]{ animation:none !important; transform:none !important; }
}