/* ============================================================================
   Adriana V. Marquez — tokens
   Una capa base (la constitucion) y tres dialectos. Elige UNO:
   <body class="dialecto-creatividad2">  |  .dialecto-creadora  |  .dialecto-social
   ========================================================================== */

/* --- Fuentes. Las 6 familias del sistema, nada mas. ---------------------- */
@font-face{font-family:'Archivo';src:url(assets/fonts/archivo-var.woff2) format('woff2');
  font-weight:100 900;font-stretch:62% 125%;font-display:swap}
@font-face{font-family:'Poppins';src:url(assets/fonts/poppins-regular.woff2) format('woff2');
  font-weight:400;font-display:swap}
@font-face{font-family:'Poppins';src:url(assets/fonts/poppins-semibold.woff2) format('woff2');
  font-weight:600;font-display:swap}
@font-face{font-family:'Poppins';src:url(assets/fonts/poppins-bold.woff2) format('woff2');
  font-weight:700;font-display:swap}
@font-face{font-family:'Plunct';src:url(assets/fonts/plunct.woff2) format('woff2');font-display:swap}
@font-face{font-family:'Plact';src:url(assets/fonts/plact.woff2) format('woff2');font-display:swap}

/* --- La constitucion: los 6 hex. Iguales en los tres dialectos. ---------- */
:root{
  --negro:#000000; --blanco:#FFFFFF;
  --rojo:#D72323; --lavanda:#F2E9FF; --amarillo:#FFBA35; --azul:#3846C4;
  --sombra-dura:6px 6px 0 currentColor;
}

/* --- Dialecto CREATIVIDAD2 ---------------------------------------------- */
/* Superficie de lectura larga: el negro y el blanco se suavizan. Un negro
   puro sobre blanco puro cansa en un documento de treinta paginas. */
.dialecto-creatividad2{
  --negro:#080808; --papel:#FAF7F2; --crema:#EDEAE3;
  --gris:#5a554f; --gris-fuerte:#3a352f; --neutro:#D8D2C6;
  --linea:rgba(8,8,8,.14);
  --acento:var(--amarillo);          /* UNO por pantalla. Se hereda. */
  background:var(--papel); color:var(--negro);
  font-family:'Poppins',sans-serif; font-size:15.5px; line-height:1.62;
}
.dialecto-creatividad2 h1,.dialecto-creatividad2 h2,.dialecto-creatividad2 h3{
  font-family:'Archivo',sans-serif; font-weight:800; font-stretch:88%;
  letter-spacing:-.03em; line-height:1.04;
}
.dialecto-creatividad2 blockquote{ font-family:'Scholar',serif }

/* --- Dialecto CREADORA --------------------------------------------------- */
/* Piezas de impacto y pantalla compartida, no de lectura larga: el negro es
   puro. Los neutros van sesgados a lavanda; un gris puro se ve sin decidir. */
.dialecto-creadora{
  --ink:#15131c; --muted:#6b6677; --line:#e3d9f3;
  --cream:#FFF6E2; --darksub:#bdb6cc;
  background:var(--blanco); color:var(--ink);
  font-family:'Poppins',sans-serif;
}
.dialecto-creadora h1,.dialecto-creadora h2{ font-family:'Poppins',sans-serif; font-weight:700 }
.dialecto-creadora .eyebrow{ font-family:'Plunct',cursive; color:var(--rojo) }
/* La barra roja del hero y la estrellita del pie: firma, no decoracion. */
.dialecto-creadora .hero{ background:var(--negro); color:var(--blanco);
  border-bottom:5px solid var(--rojo) }
.dialecto-creadora table th{ background:var(--azul); color:var(--amarillo);
  text-transform:uppercase; font-weight:700; font-size:10pt }
.dialecto-creadora .note{ background:var(--lavanda) }
.dialecto-creadora .bonus{ background:var(--cream); border-left:4px solid var(--amarillo) }

/* --- Dialecto SOCIAL ----------------------------------------------------- */
/* El unico dialecto donde varios acentos pueden convivir en la misma pieza. */
.dialecto-social{
  background:var(--negro); color:var(--blanco);
  font-family:'Poppins',sans-serif;
}
.dialecto-social h1,.dialecto-social h2{ font-family:'Poppins',sans-serif;
  font-weight:700; text-transform:uppercase }
.dialecto-social .sub{ font-family:'Scholar',serif }
.dialecto-social .caption{ font-family:'Glenda Sans',sans-serif }
.dialecto-social .mano{ font-family:'Plunct',cursive }

/* --- El wordmark. Norma de marca, igual en los tres. --------------------- */
.wordmark{font-family:'Archivo',sans-serif;font-weight:800;font-stretch:88%;
  letter-spacing:-.035em}
.wordmark .wm-2{font-family:'Plact',cursive;font-weight:400;font-size:.40em;
  vertical-align:super;margin-left:.03em;line-height:0}
.wordmark--sm .wm-2{font-size:.54em}   /* a tamano chico el 2 se pierde */

/* --- El marcador: el gesto de Creatividad2 ------------------------------- */
.marcador{position:relative;display:inline-block;z-index:0}
.marcador::before{content:"";position:absolute;z-index:-1;
  left:-.06em;right:-.06em;top:.14em;bottom:.06em;background:var(--acento)}