/* ============================================================
   GLOBI — tokens de marca
   Shanghai GLOBI Heavy Machinery Group Limited · globimachinery.com

   Paleta tomada del MANUAL DE MARCA GLOBI INTERNATIONAL (52 pág).
   OJO: el manual imprime mal dos HEX. Los valores de acá son los
   reales, muestreados del PDF a 200 dpi:
     · Rich Black       manual dice #00DF81 → real #021B1A (RGB 2,27,26)
     · Caribbean Green  manual dice #000F81 → real #00DF82 (RGB 0,223,130)
   ============================================================ */

/* ---- Tipografía self-host (nada de CDN: China + cadena de suministro) ---- */
@font-face {
  font-family: "General Sans";
  src: url("fonts/GeneralSans-Variable.woff2") format("woff2-variations");
  font-weight: 200 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ====== PALETA OFICIAL — primarios ====== */
  --rich-black:        #021B1A;
  --dark-green:        #032221;
  --bangladesh-green:  #03624C;
  --mountain-meadow:   #2CC295;
  --caribbean-green:   #00DF82;
  --anti-flash-white:  #F1F7F6;

  /* ====== PALETA OFICIAL — secundarios ====== */
  --pine:      #06302B;
  --basil:     #0B453A;
  --forest:    #095544;
  --frog:      #17876D;
  --mint:      #2FA98C;
  --pistachio: #AACBC4;

  /* ====== Roles semánticos (los que consume bloques.css) ====== */
  --bg:         var(--rich-black);
  --surface:    var(--dark-green);
  --surface-2:  var(--pine);
  --card:       #07322B;

  /* Contrastes medidos sobre --bg #021B1A (no estimados): */
  --ink:        var(--anti-flash-white);  /* 16.50:1  AAA */
  --ink-soft:   #B9CFC9;                  /* 10.93:1  AAA — cuerpo de texto */
  --ink-faint:  #7FA097;                  /*  6.28:1  AA  — solo labels ≥15px */

  /* ⚠ --brand-1 es 2.43:1 sobre --bg: es color de RELLENO/superficie.
     Nunca usarlo como color de texto sobre fondo oscuro. */
  --brand-1:    var(--bangladesh-green);
  --accent:     var(--caribbean-green);   /* 10.11:1  AAA */
  --accent-2:   var(--mountain-meadow);   /*  7.88:1  AAA */
  --accent-ink: var(--rich-black);        /* sobre --accent: 10.11:1  AAA */

  --line:       #0E3B33;
  --line-soft:  #0A2C27;

  /* ====== Tipografía ====== */
  --font-display: "General Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-body:    "General Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  /* 中文: stack del sistema. Noto Sans SC pesa 17,7 MB y el brief pide
     velocidad por encima de todo (97% del tráfico es móvil). */
  --font-cjk: "General Sans", "PingFang SC", "Hiragino Sans GB",
              "Microsoft YaHei", "Noto Sans SC", system-ui, sans-serif;

  /* Escala tipográfica fluida — mobile-first real */
  --fs-hero:  clamp(2.05rem, 1.15rem + 3.35vw, 4.25rem);
  --fs-h2:    clamp(1.65rem, 1.2rem + 2.1vw, 2.75rem);
  --fs-h3:    clamp(1.2rem, 1.05rem + 0.7vw, 1.5rem);
  --fs-body:  clamp(1rem, 0.97rem + 0.16vw, 1.0625rem);   /* nunca < 16px */
  --fs-small: 0.9375rem;                                   /* 15px piso */

  --lh-tight: 1.06;
  --lh-head:  1.18;
  --lh-body:  1.65;
  --tracking-hero: -0.028em;
  --tracking-label: 0.14em;

  /* ====== Forma ====== */
  /* El isotipo GA es de cortes rectos y biseles: radios chicos, nada de pill salvo CTA. */
  --radius:    10px;
  --radius-sm: 6px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  --shadow:    0 1px 2px rgba(0,0,0,.5), 0 12px 32px -12px rgba(0,0,0,.75);
  --shadow-lg: 0 2px 4px rgba(0,0,0,.5), 0 32px 64px -24px rgba(0,0,0,.85);
  --glow:      0 0 0 1px rgba(0,223,130,.28), 0 8px 28px -10px rgba(0,223,130,.35);

  /* ====== Ritmo ====== */
  --gap:       clamp(1rem, 0.8rem + 1vw, 1.5rem);
  /* Padding vertical de sección. Ojo: entre dos secciones seguidas el hueco es el DOBLE
     de este valor. Con 7.5rem daba 240 px de vacío entre bloque y bloque en escritorio —
     medido, entre el 26 % y el 33 % del alto de cada página era aire, y la página se
     recorría a puro scroll. Con 4.75rem el hueco queda en 152 px: sigue respirando y se
     recorta el desplazamiento casi a la mitad. La referencia que pasó el cliente
     (boomandbucket.com) tiene ese ritmo denso de marketplace, no el de una landing. */
  --pad-sec:   clamp(2.5rem, 2rem + 2.2vw, 4rem);
  --maxw:      1240px;
  --maxw-prose: 68ch;

  /* ====== Movimiento — corto, sin parallax (el brief pide velocidad) ====== */
  --ease:     cubic-bezier(.2, .7, .3, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --dur:      .22s;
  --dur-slow: .4s;
}

/* El cliente pidió velocidad por encima de efectos: respetamos la preferencia del SO. */
@media (prefers-reduced-motion: reduce) {
  :root { --dur: .01ms; --dur-slow: .01ms; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}

/* Página en chino: cambia sólo la familia, no los roles de color. */
:root:lang(zh), [lang="zh"], [lang="zh-CN"] {
  --font-display: var(--font-cjk);
  --font-body:    var(--font-cjk);
  --tracking-hero: 0;
}
