/*!
 * cobayka — plano.css
 * Sistema visual "plano de taller": la web como plano técnico del encargo.
 * Papel de delinear, tinta prusia, lápiz rojo. Cotas, cajetín, retícula.
 * Autónomo (no depende de enhanced.css). CSP-safe (sin JS inline; la interacción
 * la sirven enhanced.js / i18n.js / search.js / form.js por clase/id).
 * -------------------------------------------------------------------------- */

@font-face{
  font-family:'Barlow Condensed';font-style:normal;font-weight:500;
  src:url(/assets/fonts/barlow-condensed-500-latin.woff2) format('woff2');font-display:swap;
}
@font-face{
  font-family:'Barlow Condensed';font-style:normal;font-weight:600;
  src:url(/assets/fonts/barlow-condensed-600-latin.woff2) format('woff2');font-display:swap;
}

:root{
  --paper:#EDF1F4;         /* papel de delinear */
  --paper-2:#E3E9EE;       /* bandas apagadas */
  --paper-3:#F4F7F9;       /* fichas/cajas claras */
  --ink:#152A3D;           /* tinta prusia (texto) */
  --ink-2:#43596E;         /* secundario (AA sobre papel) */
  --line:#2E5E8C;          /* línea de plano */
  --grid:rgba(46,94,140,.13);
  --grid-fine:rgba(46,94,140,.055);
  --red:#BE3A28;           /* lápiz rojo (texto pequeño AA) */
  --red-line:#C7402D;      /* lápiz rojo (líneas/flechas, más vivo) */
  --red-deep:#9E2F20;      /* hover del rojo */
  --hair:rgba(21,42,61,.20);
  --hair-2:rgba(21,42,61,.12);
  --disp:'Barlow Condensed',"Arial Narrow",Arimo,sans-serif;
  --mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,"Liberation Mono",monospace;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --maxw:1180px;
  --pad:clamp(20px,4.5vw,52px);

  /* Fluid typography (ratio ~1.2) */
  --step--1: clamp(0.83rem, calc(0.78rem + 0.26vw), 1.00rem);
  --step-0: clamp(1.00rem, calc(0.91rem + 0.43vw), 1.25rem);
  --step-1: clamp(1.20rem, calc(1.07rem + 0.65vw), 1.56rem);
  --step-2: clamp(1.44rem, calc(1.24rem + 0.98vw), 1.95rem);
  --step-3: clamp(1.73rem, calc(1.43rem + 1.48vw), 2.44rem);
  --step-4: clamp(2.07rem, calc(1.64rem + 2.16vw), 3.05rem);
  --step-5: clamp(2.49rem, calc(1.87rem + 3.10vw), 3.82rem);
  --step-6: clamp(2.99rem, calc(2.11rem + 4.39vw), 4.77rem);

  /* Fluid spacing */
  --space-2xs: clamp(0.25rem, calc(0.23rem + 0.11vw), 0.31rem);
  --space-xs: clamp(0.50rem, calc(0.46rem + 0.22vw), 0.63rem);
  --space-s: clamp(0.75rem, calc(0.68rem + 0.33vw), 0.94rem);
  --space-m: clamp(1.00rem, calc(0.91rem + 0.43vw), 1.25rem);
  --space-l: clamp(1.50rem, calc(1.37rem + 0.65vw), 1.88rem);
  --space-xl: clamp(2.00rem, calc(1.83rem + 0.87vw), 2.50rem);
  --space-2xl: clamp(3.00rem, calc(2.74rem + 1.30vw), 3.75rem);
  
  /* Elevación */
  --elev-0: none;
  --elev-1: 0 1px 2px rgba(0,0,0,0.1);
  --elev-2: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06);
  --elev-3: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
  --elev-4: 0 20px 25px -5px rgba(0,0,0,0.1), 0 10px 10px -5px rgba(0,0,0,0.04);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--sans);font-size:var(--step-0);line-height:1.55;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg{max-width:100%}
a{color:inherit}
h1,h2,h3{text-wrap:balance}
:focus-visible{outline:2.5px solid var(--red-line);outline-offset:3px}
.container,.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
:where(section,[id]){scroll-margin-top:var(--space-2xl)}

.skip-link{
  position:absolute;left:12px;top:-60px;z-index:60;background:var(--ink);color:var(--paper);
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.06em;padding:var(--space-xs) var(--space-m);text-decoration:none;
  transition:top .18s;
}
.skip-link:focus{top:12px}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}

/* Un plano no se desvanece: el contenido está siempre visible (estático, on-brand
   y robusto). Las clases .reveal/.delay-* se conservan por compatibilidad con el JS,
   pero no ocultan nada. */
.reveal,.reveal.is-revealed{opacity:1;transform:none}

/* Transiciones entre páginas (View Transitions API): al navegar de una página a otra,
   el cuerpo hace un cambio suave mientras la CABECERA permanece — el gesto "premium" de
   las webs inmersivas, pero en CSS puro: sin librerías, progresivo (los navegadores sin
   soporte navegan igual que siempre) y respetando prefers-reduced-motion. */
@view-transition{navigation:auto}
.cbk-header{view-transition-name:cbk-header}
@media (prefers-reduced-motion: reduce){@view-transition{navigation:none}}

/* ============================================================= CABECERA */
.cbk-header{position:sticky;top:0;z-index:40;background:var(--paper)}
.cbk-header-inner{
  border-bottom:1.5px solid var(--ink);background:var(--ink);
  display:grid;gap:1.5px;align-items:stretch;
  grid-template-columns:1fr auto auto auto auto auto;
}
.cbk-header-inner>*{background:var(--paper);display:flex;align-items:center;min-height:56px;padding:0 clamp(var(--space-s),1.6vw,var(--space-m))}
.cbk-brand{
  font-family:var(--disp);font-weight:600;font-size:var(--step-2);letter-spacing:.03em;line-height:1;
  text-decoration:none;color:var(--ink);gap:var(--space-s);
}
.cbk-brand::before{
  content:"";width:0;height:0;flex:none;
  border-left:15px solid transparent;border-bottom:15px solid var(--ink);
  transform:translateY(1px);
}
.cbk-nav{display:flex;padding:0}
.cbk-menu{list-style:none;display:flex;gap:0;margin:0;padding:0;height:100%}
.cbk-menu .menu-item{display:flex}
.menu-link{
  display:flex;align-items:center;gap:var(--space-xs);padding:0 clamp(var(--space-xs),1.1vw,var(--space-m));height:100%;
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-2);text-decoration:none;position:relative;transition:color .14s,background .14s;
}
.menu-link:hover{color:var(--ink);background:var(--paper-2)}
.menu-link--games{color:var(--red)}
.menu-link--games:hover{color:var(--red-deep)}
.menu-glyph{display:inline-flex}
.cbk-search-trigger{
  border:none;background:var(--paper);color:var(--ink-2);cursor:pointer;
  padding:0 clamp(var(--space-s),1.3vw,var(--space-m));transition:color .14s,background .14s;
}
.cbk-search-trigger:hover{color:var(--ink);background:var(--paper-2)}
.cbk-lang{gap:0;padding:0!important;font-family:var(--mono);font-size:var(--step--1);letter-spacing:.1em}
.cbk-lang a{
  display:flex;align-items:center;padding:0 var(--space-s);height:100%;text-decoration:none;color:var(--ink-2);
  transition:color .14s,background .14s;
}
.cbk-lang a:hover{color:var(--ink);background:var(--paper-2)}
.cbk-lang a[aria-current="true"]{color:var(--red);font-weight:600}
.cbk-cta{
  font-family:var(--mono);font-size:var(--step--1);font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  background:var(--red);color:var(--paper);text-decoration:none;white-space:nowrap;
  padding:0 clamp(var(--space-s),1.6vw,var(--space-l))!important;transition:background .14s;
}
.cbk-cta:hover{background:var(--red-deep)}
.cbk-menu-toggle{display:none}
.cbk-header.is-stuck .cbk-header-inner{box-shadow:var(--elev-1)}

@media(max-width:1040px){
  .cbk-header-inner{grid-template-columns:1fr auto auto auto}
  .cbk-brand{font-size:var(--step-1)}
  .cbk-header .cbk-cta{display:none}   /* solo el CTA del header (el menú lo sustituye); NO los botones de contenido (descarga de ficha, hero) */
  .cbk-nav{
    position:absolute;top:100%;left:0;right:0;background:var(--paper);
    border-bottom:1.5px solid var(--ink);display:none;z-index:5;
  }
  .cbk-nav.is-open{display:block}
  .cbk-menu{flex-direction:column}
  .cbk-menu .menu-item{border-top:1px solid var(--hair)}
  .menu-link{height:auto;padding:var(--space-m) var(--pad);font-size:var(--step--1);width:100%}
  .cbk-menu-toggle{
    display:flex;align-items:center;justify-content:center;border:none;background:var(--paper);
    cursor:pointer;width:54px;
  }
  .cbk-burger,.cbk-burger::before,.cbk-burger::after{
    content:"";display:block;width:20px;height:1.8px;background:var(--ink);position:relative;transition:transform .18s,opacity .18s;
  }
  .cbk-burger::before{position:absolute;top:-6px}
  .cbk-burger::after{position:absolute;top:6px}
  .cbk-menu-toggle[aria-expanded="true"] .cbk-burger{background:transparent}
  .cbk-menu-toggle[aria-expanded="true"] .cbk-burger::before{transform:translateY(6px) rotate(45deg)}
  .cbk-menu-toggle[aria-expanded="true"] .cbk-burger::after{transform:translateY(-6px) rotate(-45deg)}
}
@media(min-width:1041px){.cbk-menu-toggle{display:none}}

/* regla milimetrada bajo la cabecera */
.regla{
  height:14px;border-bottom:1px solid var(--hair);background:var(--paper);
  background-image:
    repeating-linear-gradient(90deg,transparent 0 49px,rgba(21,42,61,.4) 49px 50px),
    repeating-linear-gradient(90deg,transparent 0 9px,rgba(21,42,61,.28) 9px 10px);
  background-size:100% 10px,100% 6px;background-position:bottom,bottom;background-repeat:repeat-x;
}

/* ================================================================= HERO */
.hero{position:relative;padding:clamp(var(--space-2xl),6.5vw,var(--space-2xl)) 0 clamp(var(--space-xl),5vw,var(--space-2xl));overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(var(--grid) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid) 1px,transparent 1px),
    linear-gradient(var(--grid-fine) 1px,transparent 1px),
    linear-gradient(90deg,var(--grid-fine) 1px,transparent 1px);
  background-size:40px 40px,40px 40px,8px 8px,8px 8px;
  -webkit-mask-image:linear-gradient(180deg,#000 42%,transparent 94%);
  mask-image:linear-gradient(180deg,#000 42%,transparent 94%);
}
.hero .container{position:relative;z-index:2}
/* plano vivo: lienzo CAD reactivo al cursor (lo dibuja plano.js; sin él, no molesta) */
.hero-cad{position:absolute;inset:0;z-index:1;pointer-events:none;display:block}
.eyebrow{
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.15em;text-transform:uppercase;
  color:var(--ink-2);margin:0 0 var(--space-l);
}
.eyebrow b{color:var(--red);font-weight:400}
.hero h1{
  font-family:var(--disp);font-weight:600;text-transform:uppercase;
  font-size:clamp(2.9rem,6.6vw,6.4rem);line-height:.95;letter-spacing:.012em;
  margin:0 0 var(--space-2xl);color:var(--ink);
}
.hero h1 .ln{display:block}

/* cota que mide "a medida" */
.dim{position:relative;display:inline-block;white-space:nowrap}
.cota{position:absolute;left:.03em;right:.03em;top:calc(100% + 8px);height:40px;pointer-events:none}
.cota .ext{position:absolute;top:0;width:1.5px;height:16px;background:var(--red-line)}
.cota .ext.l{left:0}.cota .ext.r{right:0}
.cota .dl{position:absolute;top:9px;left:1px;right:1px;height:1.5px;background:var(--red-line)}
.cota .dl::before,.cota .dl::after{content:"";position:absolute;top:-3.5px;width:0;height:0;border-top:4.5px solid transparent;border-bottom:4.5px solid transparent}
.cota .dl::before{left:0;border-right:10px solid var(--red-line)}
.cota .dl::after{right:0;border-left:10px solid var(--red-line)}
.cota .lab{
  position:absolute;top:9.5px;left:50%;transform:translate(-50%,-50%);
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.14em;text-transform:uppercase;
  color:var(--red);background:var(--paper);padding:1px var(--space-xs);white-space:nowrap;
}

.hero-grid{display:grid;grid-template-columns:1fr;gap:var(--space-xl);align-items:start;max-width:1060px}
@media(min-width:840px){.hero-grid{grid-template-columns:1.2fr .95fr;gap:var(--space-2xl)}}
/* columna derecha del hero: nota de margen (anotación a lápiz) + ficha */
.hero-side{display:flex;flex-direction:column;gap:var(--space-m)}
.hero-note{
  font-family:var(--mono);font-size:var(--step--1);line-height:1.6;letter-spacing:.07em;text-transform:uppercase;
  color:var(--red);border-left:2px solid var(--red-line);padding:2px 0 2px var(--space-s);margin:0;
}
.hero-copy{min-width:0}
.hero-text{margin:0 0 var(--space-l);color:var(--ink-2);font-size:1.09rem;max-width:52ch}
.hero-points{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-xs)}
.hero-points li{
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.03em;color:var(--ink);
  padding-left:var(--space-m);position:relative;
}
.hero-points li::before{content:"—";position:absolute;left:0;color:var(--red)}

/* ficha técnica del hero (panel derecho) */
.hero-ficha{border:1.5px solid var(--ink);background:var(--paper-3)}
.hero-ficha .fh{
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-2);padding:var(--space-s) var(--space-m);border-bottom:1.5px solid var(--ink);background:var(--paper-2);
}
.hero-ficha .fbody{padding:var(--space-m) var(--space-m)}
.hero-ficha h2{font-family:var(--disp);font-weight:600;text-transform:uppercase;font-size:1.5rem;line-height:1.02;letter-spacing:.01em;margin:0 0 var(--space-xs)}
.hero-ficha p{margin:0 0 var(--space-m);color:var(--ink-2);font-size:.96rem}
.hero-ficha .fspec{display:grid;gap:1px;background:var(--hair-2);border:1px solid var(--hair-2);margin-bottom:var(--space-m)}
.hero-ficha .fspec div{background:var(--paper-3);padding:var(--space-xs) var(--space-s);display:flex;flex-direction:column;gap:2px}
.hero-ficha .fspec strong{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.03em;color:var(--ink)}
.hero-ficha .fspec span{font-size:.82rem;color:var(--ink-2)}
@media(min-width:460px){.hero-ficha .fspec{grid-template-columns:repeat(3,1fr)}}
.hero-ficha .fchan{
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.05em;color:var(--ink);
  border-top:1px solid var(--hair);padding-top:var(--space-s);display:flex;flex-wrap:wrap;gap:var(--space-2xs) var(--space-m);
}
.hero-ficha .fchan span::before{content:"› ";color:var(--red)}

.hero-actions{display:flex;gap:var(--space-s);margin-top:var(--space-xl);flex-wrap:wrap}
.button{
  font-family:var(--mono);font-size:var(--step--1);font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  text-decoration:none;padding:var(--space-m) var(--space-l);display:inline-flex;align-items:center;gap:var(--space-xs);
  transition:background .14s,color .14s,border-color .14s;border:1.5px solid transparent;cursor:pointer;
}
.button-primary{background:var(--red);color:var(--paper);border-color:var(--red)}
.button-primary::before{content:"→";opacity:.75}
.button-primary:hover{background:var(--red-deep);border-color:var(--red-deep)}
.button-secondary{border-color:var(--ink);color:var(--ink);background:transparent}
.button-secondary:hover{background:var(--ink);color:var(--paper)}

/* ============================================================ SECCIONES */
.section{border-top:1.5px solid var(--ink);padding:clamp(var(--space-2xl),6vw,var(--space-2xl)) 0}
.hero.section{border-top:none}
.section-heading{margin-bottom:var(--space-xl);max-width:var(--maxw)}
.section-kicker,.sec-ref{
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.15em;text-transform:uppercase;
  color:var(--red);margin:0 0 var(--space-m);
}
.section h2{
  font-family:var(--disp);font-weight:600;text-transform:uppercase;
  font-size:clamp(1.85rem,3.4vw,3rem);line-height:.99;letter-spacing:.012em;
  margin:0 0 var(--space-s);max-width:30ch;color:var(--ink);
}
.section-subcopy{color:var(--ink-2);max-width:64ch;margin:0 0 var(--space-2xs);font-size:1.02rem}
.section-subcopy a{color:var(--red);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .14s}
.section-subcopy a:hover{border-color:var(--red)}

/* DETALLES (áreas de servicio) */
.detalles{border-top:1.5px solid var(--ink);margin-top:var(--space-xs)}
.det-row{
  display:grid;grid-template-columns:auto 1fr;gap:var(--space-2xs) var(--space-m);
  padding:var(--space-m) 0 var(--space-l);border-bottom:1px solid var(--hair);align-items:start;transition:background .14s;
}
@media(min-width:760px){.det-row{grid-template-columns:52px 320px 1fr;gap:var(--space-xl);padding:var(--space-l) 0;align-items:baseline}}
.det-row:hover{background:rgba(46,94,140,.045)}
.det-mark{
  width:29px;height:29px;border:1.5px solid var(--ink);border-radius:50%;flex:none;
  display:flex;align-items:center;justify-content:center;align-self:center;
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.02em;color:var(--ink);
}
@media(min-width:760px){.det-mark{transform:translateY(4px)}}
.det-row h3{font-family:var(--sans);font-weight:700;font-size:1.12rem;letter-spacing:-.01em;margin:0}
.det-row p{margin:0;color:var(--ink-2);font-size:.98rem;grid-column:1/-1}
@media(min-width:760px){.det-row p{grid-column:auto}}

/* SUPUESTOS (para quién es) — rejilla de fichas planas */
.plano-grid{display:grid;grid-template-columns:1fr;gap:1.5px;background:var(--ink);border:1.5px solid var(--ink)}
@media(min-width:640px){.plano-grid.cols-2{grid-template-columns:1fr 1fr}}
@media(min-width:820px){.plano-grid.cols-3{grid-template-columns:repeat(3,1fr)}}
.plano-cell{background:var(--paper);padding:var(--space-l) var(--space-l) var(--space-l);position:relative}
.plano-cell .cref{
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.12em;text-transform:uppercase;color:var(--red);
  display:block;margin-bottom:var(--space-xs);
}
.plano-cell h3{font-family:var(--sans);font-weight:700;font-size:1.08rem;margin:0 0 var(--space-xs)}
.plano-cell p{margin:0;color:var(--ink-2);font-size:.96rem}

/* FASES (proceso) */
.fases-band{background:var(--paper-2)}
.fases{display:grid;grid-template-columns:1fr;border-top:1.5px solid var(--ink);margin-top:var(--space-xs)}
@media(min-width:900px){.fases{grid-template-columns:repeat(4,1fr)}}
.fase{padding:var(--space-l) 0 var(--space-xs);border-bottom:1px solid var(--hair)}
@media(min-width:900px){
  .fase{padding:var(--space-xl) var(--space-l) var(--space-s) 0;border-bottom:0}
  .fase+.fase{border-left:1px solid var(--hair);padding-left:var(--space-l)}
}
.fase .num{font-family:var(--disp);font-weight:500;font-size:clamp(3rem,4.4vw,4rem);line-height:1;color:var(--line);display:block;margin-bottom:var(--space-s)}
.fase h3{font-family:var(--sans);font-weight:700;font-size:1.08rem;margin:0 0 var(--space-xs)}
.fase p{margin:0;color:var(--ink-2);font-size:.96rem}

/* GARANTÍAS (confianza) — tira de 4 con etiqueta mono */
.garantias{display:grid;grid-template-columns:1fr;gap:1.5px;background:var(--ink);border:1.5px solid var(--ink);margin-top:var(--space-xl)}
@media(min-width:560px){.garantias{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.garantias{grid-template-columns:repeat(4,1fr)}}
.gar{background:var(--paper);padding:var(--space-l) var(--space-l) var(--space-l)}
.gar h3{font-family:var(--disp);font-weight:600;text-transform:uppercase;font-size:1.35rem;letter-spacing:.01em;margin:0 0 var(--space-xs)}
.gar p{margin:0;color:var(--ink-2);font-size:.92rem}

/* PRUEBA (banda invertida) */
.invert{background:var(--ink);color:var(--paper);position:relative;overflow:hidden}
.invert::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(159,194,224,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(159,194,224,.06) 1px,transparent 1px);
  background-size:40px 40px;
  -webkit-mask-image:linear-gradient(180deg,transparent 3%,#000 55%);
  mask-image:linear-gradient(180deg,transparent 3%,#000 55%);
}
.invert .container{position:relative}
.invert .section-kicker,.invert .sec-ref{color:#E0917F}
.invert h2{color:var(--paper)}
.invert .section-subcopy{color:#AEBFCF}
.proof{display:grid;grid-template-columns:1fr;gap:1.5px;background:#2E4256;border:1.5px solid #2E4256;margin-top:var(--space-xs)}
@media(min-width:760px){.proof{grid-template-columns:repeat(3,1fr)}}
.proof-cell{background:var(--ink);padding:var(--space-l) var(--space-l) var(--space-l)}
.proof-cell .h{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.15em;text-transform:uppercase;color:#9FC2E0;margin-bottom:var(--space-s)}
.proof-cell h3{font-family:var(--sans);font-weight:700;font-size:1.1rem;margin:0 0 var(--space-xs);color:var(--paper)}
.proof-cell p{margin:0;color:#AEBFCF;font-size:.95rem}
.proof-cell code{font-family:var(--mono);font-size:.88em;color:#9FC2E0}
.proof-evidence{margin-top:var(--space-xl);border-top:1px solid #2E4256;padding-top:var(--space-l)}
.proof-evidence-lead{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.06em;color:#9FC2E0;margin:0 0 var(--space-s);text-transform:uppercase}
.proof-links{list-style:none;margin:0;padding:0;display:grid;gap:var(--space-xs)}
.proof-links a{
  display:flex;align-items:baseline;gap:var(--space-s);text-decoration:none;color:var(--paper);font-size:.98rem;
  border-bottom:1px solid transparent;transition:color .14s;width:max-content;max-width:100%;
}
.proof-links a:hover{color:#9FC2E0}
.proof-links small{color:#8FA3B6;font-family:var(--mono);font-size:var(--step--1);letter-spacing:.04em}
.proof-dot{width:7px;height:7px;flex:none;background:var(--red-line);align-self:center}

/* FAQ */
.faq-list{border-top:1.5px solid var(--ink);margin-top:var(--space-xs)}
.faq-item{
  display:grid;grid-template-columns:auto 1fr;gap:var(--space-2xs) var(--space-l);
  padding:var(--space-l) 0;border-bottom:1px solid var(--hair);align-items:baseline;
}
.faq-item::before{
  content:"P";font-family:var(--mono);font-size:var(--step--1);letter-spacing:.06em;color:var(--red);
  border:1.5px solid var(--hair);width:26px;height:26px;display:flex;align-items:center;justify-content:center;align-self:start;
}
.faq-item h3{font-family:var(--sans);font-weight:700;font-size:1.1rem;margin:0 0 var(--space-2xs);grid-column:2}
.faq-item p{margin:0;color:var(--ink-2);font-size:.98rem;grid-column:2}

/* CONTACTO (sello alrededor del formulario) */
.contact-shell{border:3px solid var(--ink);padding:var(--space-2xs)}
.contact-inner{border:1px solid var(--ink);padding:clamp(var(--space-l),4vw,var(--space-2xl))}
.contact-layout{display:grid;grid-template-columns:1fr;gap:var(--space-xl)}
@media(min-width:900px){.contact-layout{grid-template-columns:.85fr 1.15fr;gap:var(--space-2xl)}}
.contact-copy h2{margin-bottom:var(--space-m)}
.contact-copy>p{color:var(--ink-2);margin:0 0 var(--space-l);max-width:46ch}
.micro-list{list-style:none;margin:0 0 var(--space-l);padding:0;display:grid;gap:var(--space-xs)}
.micro-list li{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.03em;color:var(--ink);padding-left:var(--space-m);position:relative}
.micro-list li::before{content:"—";position:absolute;left:0;color:var(--red)}
.contact-actions{display:flex;gap:var(--space-s);flex-wrap:wrap}

/* --- formulario (ff-*): reestilizado en plano, markup intacto --- */
.form-stage{min-width:0}
.form-kicker{margin-bottom:var(--space-s)}
.form-stage>h3{font-family:var(--disp);font-weight:600;text-transform:uppercase;font-size:1.55rem;line-height:1.02;letter-spacing:.01em;margin:0 0 var(--space-xs)}
.form-stage>p{color:var(--ink-2);margin:0 0 var(--space-l);font-size:.98rem}
.hp-field{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.fluentform{--ff-red:var(--red)}
.ff-el-group{margin-bottom:var(--space-m)}
.ff-t-container{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-m)}
@media(max-width:520px){.ff-t-container{grid-template-columns:1fr;gap:0}}
.ff-el-input--label label,.ff-el-input--label>label{
  display:block;font-family:var(--mono);font-size:var(--step--1);letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-2);margin:0 0 var(--space-xs);
}
.ff-el-is-required.asterisk-right label::after,.ff-el-input--label.ff-el-is-required label::after{content:" *";color:var(--red)}
.ff-el-form-control{
  width:100%;font-family:var(--sans);font-size:var(--step-0);color:var(--ink);background:var(--paper-3);
  border:1.5px solid var(--hair);padding:var(--space-s) var(--space-s);transition:border-color .14s,background .14s;
}
.ff-el-form-control::placeholder{color:#5d6c7b}
.ff-el-form-control:focus{outline:none;border-color:var(--line);background:#fff}
.ff-el-form-control:focus-visible{outline:2.5px solid var(--red-line);outline-offset:2px}
select.ff-el-form-control{
  appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:var(--space-xl);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%232E5E8C' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;
}
.ff-el-input--content[role="radiogroup"]{display:grid;gap:var(--space-xs)}
.ff-el-form-check{margin:0}
.ff-el-form-check-label{
  display:flex;align-items:flex-start;gap:var(--space-s);cursor:pointer;
  border:1.5px solid var(--hair);padding:var(--space-s) var(--space-s);transition:border-color .14s,background .14s;
  font-size:.96rem;color:var(--ink);
}
.ff-el-form-check-label:hover{border-color:var(--line);background:var(--paper-3)}
.ff-el-form-check-input{accent-color:var(--red);width:17px;height:17px;margin:1px 0 0;flex:none}
.ff-el-form-check-input:checked+span,.ff-el-form-check-label:has(:checked){color:var(--ink)}
.ff-el-form-check-label:has(:checked){border-color:var(--line);background:rgba(46,94,140,.06)}
.ff-el-tc{align-items:flex-start}
.ff_t_c{font-size:.86rem;color:var(--ink-2);line-height:1.5}
.ff_t_c a{color:var(--red);text-decoration:underline}
.ff-btn-submit{
  font-family:var(--mono);font-size:var(--step--1);font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  background:var(--red);color:var(--paper);border:1.5px solid var(--red);padding:var(--space-m) var(--space-xl);cursor:pointer;
  width:100%;transition:background .14s;
}
.ff-btn-submit:hover{background:var(--red-deep);border-color:var(--red-deep)}
.ff_submit_btn_wrapper{margin-top:var(--space-l)}
.ff-message-success{
  border:1.5px solid var(--line);background:var(--paper-3);padding:var(--space-m) var(--space-m);color:var(--ink);
  font-size:.98rem;
}
.ff-el-is-error .ff-el-form-control{border-color:var(--red)}
.error,.ff-el-form-error,.text-danger{color:var(--red);font-family:var(--mono);font-size:var(--step--1);letter-spacing:.02em;margin-top:var(--space-2xs);display:block}
.ff-errors-in-stack{color:var(--red);font-family:var(--mono);font-size:var(--step--1);margin-top:var(--space-s)}
.form-note{font-size:.84rem;color:var(--ink-2);margin:var(--space-s) 0 0}
.form-note a{color:var(--red)}

/* PRIVACIDAD (teaser) — usa .plano-grid.cols-3 con .plano-cell (compartido) */

/* MUESTRA DE TALLER (fragmento de código «ploteado») */
.muestra-band{background:var(--paper-2)}
.code-plot{border:1.5px solid var(--ink);background:#fff;max-width:780px;margin:var(--space-xs) 0 0}
.cp-head{
  display:flex;justify-content:space-between;align-items:center;gap:var(--space-s);padding:var(--space-s) var(--space-m);
  border-bottom:1.5px solid var(--ink);background:var(--paper-2);
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2);
}
.cp-file{color:var(--ink)}
.cp-body{margin:0;padding:var(--space-m) var(--space-m);overflow-x:auto}
.cp-body code{font-family:var(--mono);font-size:var(--step--1);line-height:1.8;color:var(--ink)}
.cl{display:block;white-space:pre}
.cl .k{color:var(--line)}                 /* palabras clave */
.cl .v{color:var(--ink);font-weight:600}  /* valores */
.cl .s{color:var(--ink-2)}                /* cadenas */
.cl .c{color:var(--red)}                  /* el comentario: la clave del asunto */
.cp-caret{display:none;width:8px;height:15px;background:var(--red);vertical-align:-2px;margin-left:1px}

@media (prefers-reduced-motion: no-preference){
  @keyframes cbk-blink{50%{opacity:0}}
  .code-plot.armed .cl{opacity:0;clip-path:inset(0 100% 0 0)}
  .code-plot.armed .cl.drawn{opacity:1;clip-path:inset(0 0 0 0);transition:clip-path .16s linear,opacity .1s linear}
  .code-plot.armed .cp-caret{display:inline-block;animation:cbk-blink 1s step-end infinite}
  .code-plot.armed.done .cp-caret{display:none}
}

/* AUDITORÍA EN VIVO (pieza estrella: nota A–F que se recalcula) */
.audit{border:1.5px solid var(--ink);background:#fff;max-width:900px;margin:var(--space-xs) 0 0}
.aud-head{display:flex;justify-content:space-between;align-items:center;gap:var(--space-s);padding:var(--space-s) var(--space-m);border-bottom:1.5px solid var(--ink);background:var(--paper-2);font-family:var(--mono);font-size:var(--step--1);letter-spacing:.09em;text-transform:uppercase;color:var(--ink-2)}
.aud-head b{color:var(--ink);font-weight:600}
.aud-body{padding:var(--space-l) var(--space-m)}
.aud-top{display:flex;gap:var(--space-l);align-items:center;border-bottom:1px solid var(--hair);padding-bottom:var(--space-m);margin-bottom:var(--space-m)}
.grade-badge{width:92px;height:92px;flex:none;border:2.5px solid var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--disp);font-weight:600;font-size:var(--step-6);line-height:1;color:var(--line);transition:color .25s,border-color .25s,background .25s}
.grade-badge.g-a,.grade-badge.g-b{color:#1B7A54;border-color:#1B7A54;background:rgba(27,122,84,.06)}
.grade-badge.g-c,.grade-badge.g-d{color:#B0741A;border-color:#B0741A;background:rgba(176,116,26,.08)}
.grade-badge.g-e,.grade-badge.g-f{color:var(--red);border-color:var(--red);background:rgba(190,58,40,.06)}
.grade-badge.pulse{animation:cbk-pulse .42s ease}
.grade-meta{min-width:0}
.grade-meta .score{font-family:var(--disp);font-weight:600;font-size:2.5rem;line-height:1;color:var(--ink)}
.grade-meta .of{font-family:var(--mono);font-size:var(--step--1);color:var(--ink-2);margin-left:var(--space-2xs)}
.grade-meta p{margin:var(--space-xs) 0 0;font-size:.9rem;color:var(--ink-2);font-family:var(--mono);letter-spacing:.02em}
.aud-findings{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--hair-2);border:1px solid var(--hair-2)}
.finding{background:#fff;display:grid;grid-template-columns:20px 1fr auto;gap:3px var(--space-s);align-items:center;padding:var(--space-s) var(--space-s)}
.finding .f-st{width:17px;height:17px;display:flex;align-items:center;justify-content:center;font-size:var(--step--1);font-weight:700;color:#fff;background:#1B7A54}
.finding.fail .f-st{background:var(--red)}
.finding .f-st::before{content:"✓"}
.finding.fail .f-st::before{content:"✕"}
.finding .f-name{font-weight:600;font-size:.98rem;color:var(--ink)}
.finding .f-sev{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.07em;text-transform:uppercase;padding:3px var(--space-xs);border:1px solid;white-space:nowrap}
.f-sev.ok{color:#1B7A54;border-color:rgba(27,122,84,.45)}
.f-sev.bajo{color:var(--ink-2);border-color:var(--hair)}
.f-sev.medio{color:#B0741A;border-color:rgba(176,116,26,.5)}
.f-sev.alto{color:var(--red);border-color:rgba(190,58,40,.5)}
.f-sev.critico{color:#fff;background:var(--red);border-color:var(--red)}
.finding .f-note{grid-column:2/-1;margin:2px 0 0;font-size:.86rem;color:var(--ink-2)}
.aud-controls{margin-top:var(--space-m);border-top:1px solid var(--hair);padding-top:var(--space-m)}
.ac-lead{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.08em;text-transform:uppercase;color:var(--red);margin:0 0 var(--space-s)}
.ac-row{display:flex;flex-wrap:wrap;gap:var(--space-s)}
.seg{display:inline-flex;border:1.5px solid var(--ink)}
.seg .seg-lab{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.05em;text-transform:uppercase;color:var(--ink-2);display:flex;align-items:center;padding:0 var(--space-s);border-right:1.5px solid var(--ink);background:var(--paper-2)}
.seg-opt{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.03em;background:#fff;color:var(--ink-2);border:none;padding:var(--space-xs) var(--space-s);cursor:pointer;transition:background .14s,color .14s}
.seg-opt+.seg-opt{border-left:1px solid var(--hair)}
.seg-opt[aria-pressed="true"]{background:var(--ink);color:var(--paper)}
.seg-opt.risk[aria-pressed="true"]{background:var(--red);color:#fff}
.seg-opt:focus-visible{outline:2.5px solid var(--red-line);outline-offset:2px;position:relative;z-index:1}
@keyframes cbk-pulse{0%{transform:scale(1)}42%{transform:scale(1.08)}100%{transform:scale(1)}}
@media(max-width:560px){
  .aud-top{flex-direction:row}
  .finding{grid-template-columns:20px 1fr}
  .finding .f-sev{grid-column:2;justify-self:start;margin-top:2px}
  .seg{width:100%}.seg .seg-opt{flex:1;text-align:center}
}
@media (prefers-reduced-motion: no-preference){
  .audit.run .finding{opacity:0;transform:translateY(10px);animation:cbk-rise .5s ease forwards}
  .audit.run .finding:nth-child(2){animation-delay:.06s}
  .audit.run .finding:nth-child(3){animation-delay:.12s}
  .audit.run .finding:nth-child(4){animation-delay:.18s}
  .audit.run .finding:nth-child(5){animation-delay:.24s}
  .audit.run .finding:nth-child(6){animation-delay:.30s}
  .audit.run .finding:nth-child(7){animation-delay:.36s}
  /* scroll draw-in también en páginas internas */
  html.js-reveal-ready .cbk-page .reveal{opacity:0;transform:translateY(22px)}
  html.js-reveal-ready .cbk-page .reveal.is-revealed{opacity:1;transform:none;transition:opacity .6s ease,transform .66s cubic-bezier(.2,.78,.2,1);transition-delay:var(--rd,0s)}
}

/* ============================================================ PÁGINAS INTERNAS
   guías/recursos, catálogo de juegos, fichas de plugin, privacidad y 404.
   Comparten la cáscara plano (cabecera/pie) del home; aquí va su cuerpo. */
.cbk-page{padding:clamp(var(--space-xl),6vw,var(--space-2xl)) 0}
.cbk-page-inner{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.cbk-legal .cbk-page-inner{max-width:860px}
.cbk-page-title{font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.012em;line-height:1;font-size:clamp(2.2rem,5vw,3.7rem);margin:0 0 var(--space-m);color:var(--ink)}
.cbk-lead{font-size:1.12rem;line-height:1.55;color:var(--ink-2);max-width:64ch;margin:0 0 var(--space-2xs)}
.cbk-lead a{color:var(--red);text-decoration:none;border-bottom:1px solid transparent}
.cbk-lead a:hover{border-color:var(--red)}
.grad-text{color:var(--red);-webkit-text-fill-color:currentColor}

/* migas */
.cbk-breadcrumb{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-2);margin:0 0 var(--space-l)}
.cbk-breadcrumb a{color:var(--ink-2);text-decoration:none}
.cbk-breadcrumb a:hover{color:var(--red)}
.cbk-breadcrumb [aria-current],.cbk-breadcrumb .cbk-bc-here{color:var(--red)}

/* artículos / legal / privacidad */
.cbk-legal-block{border-top:1px solid var(--hair);padding-top:var(--space-l);margin-top:var(--space-xl)}
.cbk-legal-block:first-of-type{border-top:0;padding-top:0;margin-top:var(--space-l)}
.cbk-legal-block h2{font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.01em;line-height:1.05;font-size:clamp(1.5rem,3vw,2.15rem);margin:0 0 var(--space-s);color:var(--ink);position:relative;padding-left:var(--space-m)}
.cbk-legal-block h2::before{content:"";position:absolute;left:0;top:.12em;bottom:.12em;width:3px;background:var(--red)}
.cbk-legal-block h3{font-family:var(--sans);font-weight:700;font-size:1.16rem;margin:var(--space-l) 0 var(--space-xs);color:var(--ink)}
.cbk-legal-block p,.cbk-legal-block li{color:var(--ink-2);line-height:1.62}
.cbk-legal-block p{margin:0 0 var(--space-s)}
.cbk-legal-block ul,.cbk-legal-block ol{margin:0 0 var(--space-m);padding-left:1.25em}
.cbk-legal-block li{margin:var(--space-2xs) 0}
.cbk-legal-block a{color:var(--red);text-decoration:underline;text-underline-offset:2px}
.cbk-legal-block strong{color:var(--ink)}
.cbk-legal-block code{font-family:var(--mono);font-size:.9em;background:var(--paper-2);border:1px solid var(--hair);padding:1px var(--space-2xs);color:var(--ink)}
.cbk-legal-block blockquote{border-left:2px solid var(--red);margin:0 0 var(--space-m);padding:2px 0 2px var(--space-m);color:var(--ink-2);font-family:var(--mono);font-size:.95rem}
.cbk-legal-foot{border:1.5px solid var(--ink);background:var(--paper-3);padding:var(--space-l) var(--space-l);margin-top:var(--space-xl)}
.cbk-legal-foot h2,.cbk-legal-foot h3{font-family:var(--disp);font-weight:600;text-transform:uppercase;font-size:1.5rem;margin:0 0 var(--space-xs);color:var(--ink)}
.cbk-legal-foot p{color:var(--ink-2);margin:0 0 var(--space-m)}
.cbk-legal-foot a{color:var(--red)}

/* hub /recursos/ */
.cbk-res-group{margin-top:var(--space-xl)}
.cbk-band-head{display:flex;align-items:center;gap:var(--space-s);border-top:1.5px solid var(--ink);padding-top:var(--space-s);margin:0 0 var(--space-m)}
.cbk-band-title{font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.01em;font-size:1.45rem;margin:0;color:var(--ink)}
.cbk-res-feature{border:1.5px solid var(--ink);background:var(--paper-3);padding:var(--space-l) var(--space-m);margin-top:0}
.cbk-res-feature h2::before{display:none}
.cbk-res-feature h2{padding-left:0}

/* insignias mono (compartidas: hub, catálogo, fichas) */
.plug-badge{display:inline-flex;align-items:center;gap:var(--space-2xs);font-family:var(--mono);font-size:var(--step--1);letter-spacing:.06em;text-transform:uppercase;padding:3px var(--space-xs);border:1px solid var(--hair);color:var(--ink-2);background:var(--paper-2);white-space:nowrap}
.plug-badge.plug-tele,.plug-badge.plug-kind-free{color:var(--line);border-color:rgba(46,94,140,.4)}
.plug-badge.cbk-game-soon-badge{color:var(--ink-2)}
.cbk-band-count{margin-left:auto}

/* 404 */
.cbk-error-hero{text-align:center;padding:clamp(var(--space-xl),7vw,var(--space-2xl)) 0}
.cbk-error-code{font-family:var(--disp);font-weight:600;line-height:.9;font-size:clamp(5rem,20vw,12rem);color:var(--red);margin:0 0 var(--space-xs)}

/* ---- catálogo de JUEGOS (/recursos/plugins/) ---- */
.cbk-game-band{margin-top:var(--space-xl)}
.cbk-game-grid{display:grid;grid-template-columns:1fr;gap:var(--space-m)}
@media(min-width:600px){.cbk-game-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:920px){.cbk-game-grid{grid-template-columns:repeat(3,1fr)}}
.cbk-game-card{border:1.5px solid var(--ink);background:#fff;overflow:hidden;position:relative;transition:transform .15s,box-shadow .15s}
.cbk-game-link{display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit}
.cbk-game-card:not(.is-soon):hover{transform:translateY(-2px);box-shadow:var(--elev-2)}
.cbk-game-cover{position:relative;display:block;border-bottom:1.5px solid var(--ink);background:var(--paper-2);overflow:hidden}
.cbk-game-art{display:block;width:100%;height:auto;aspect-ratio:5/4;object-fit:cover}
.cbk-game-enter,.cbk-game-lock{position:absolute;left:0;right:0;bottom:0;margin:0;padding:var(--space-xs) var(--space-s);font-family:var(--mono);font-size:var(--step--1);letter-spacing:.06em;text-transform:uppercase;display:flex;align-items:center;gap:var(--space-xs);background:var(--paper);border-top:1.5px solid var(--ink)}
.cbk-game-enter{color:var(--red)}
.cbk-game-lock{color:var(--ink-2)}
.cbk-game-enter-ar{transition:transform .15s;display:inline-block}
.cbk-game-card:hover .cbk-game-enter-ar{transform:translateX(3px)}
.cbk-game-meta{display:grid;grid-template-columns:auto 1fr auto;grid-template-areas:"icon name badge" "icon tag tag";gap:3px var(--space-s);align-items:center;padding:var(--space-s) var(--space-m) var(--space-m)}
.cbk-game-icon,.plug-icon{width:24px;height:24px;flex:none}
.cbk-game-icon{grid-area:icon;align-self:start;margin-top:2px}
.cbk-game-text{display:contents}
.cbk-game-name{grid-area:name;font-family:var(--disp);font-weight:600;text-transform:uppercase;font-size:1.35rem;letter-spacing:.01em;line-height:1;margin:0;color:var(--ink)}
.cbk-game-tagline{grid-area:tag;color:var(--ink-2);font-size:.9rem;line-height:1.35;margin:0}
.cbk-game-count{grid-area:badge;align-self:start}
.cbk-game-card.is-soon{opacity:.7}
.cbk-game-lock-ico{width:12px;height:12px;flex:none;border:1.5px solid currentColor;border-radius:2px}

/* ---- catálogo de un juego (filtro) — CONTRATO INTACTO ---- */
.plug-filters{border:1.5px solid var(--ink);background:var(--paper-2);padding:var(--space-m) var(--space-m);margin:var(--space-l) 0 var(--space-l);display:flex;flex-wrap:wrap;gap:var(--space-m) var(--space-l);align-items:flex-end}
.plug-filters label,.plug-loaders legend{font-family:var(--mono);font-size:var(--step--1);font-weight:400;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);display:block;margin-bottom:var(--space-2xs)}
.plug-floader{display:flex;flex-direction:column}
.plug-filters select{font-family:var(--sans);font-size:var(--step--1);color:var(--ink);background:#fff;border:1.5px solid var(--hair);padding:var(--space-xs) var(--space-xl) var(--space-xs) var(--space-s);appearance:none;-webkit-appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%232E5E8C' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.plug-filters select:focus-visible{outline:none;border-color:var(--line)}
.plug-loaders{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--space-xs);align-items:center}
.plug-loaders legend{width:100%;margin-bottom:var(--space-2xs);padding:0}
.plug-chk{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.03em;color:var(--ink-2);border:1.5px solid var(--hair);padding:var(--space-2xs) var(--space-s);cursor:pointer;display:inline-flex;align-items:center;user-select:none;transition:border-color .14s,color .14s,background .14s}
.plug-chk input{position:absolute;opacity:0;width:0;height:0}
@supports selector(:has(*)){
  .plug-chk:has(input:checked){border-color:var(--line);color:var(--ink);background:#fff}
  .plug-chk:has(input:checked)::after{content:"✓";margin-left:var(--space-2xs);color:var(--red);font-weight:700}
  .plug-chk:has(input:focus-visible){outline:2.5px solid var(--red-line);outline-offset:2px}
}
.plug-count{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.04em;color:var(--ink-2);margin:0 0 var(--space-m)}
.plug-count[hidden]{display:none}
.plug-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-m)}
@media(max-width:560px){.plug-grid{grid-template-columns:1fr}}
.plug-cat{display:contents}
.plug-cat-head{grid-column:1/-1;display:flex;align-items:center;gap:var(--space-xs);margin:var(--space-m) 0 2px;font-family:var(--mono);font-size:var(--step--1);font-weight:400;letter-spacing:.12em;text-transform:uppercase;color:var(--red)}
.plug-cat-head::before{content:"";flex:none;width:16px;height:2px;background:var(--red)}
.plug-cat-n{font-family:var(--mono);font-size:var(--step--1);color:var(--ink-2)}
@supports selector(:has(*)){.plug-cat:not(:has(.plug-card:not([hidden]))){display:none}}
.plug-card{border:1.5px solid var(--ink);background:#fff;transition:transform .15s,box-shadow .15s}
.plug-card[hidden]{display:none}
.plug-card:hover{transform:translateY(-2px);box-shadow:var(--elev-2)}
.plug-card-link{display:flex;flex-direction:column;gap:var(--space-xs);height:100%;text-decoration:none;color:inherit;padding:var(--space-m) var(--space-m) var(--space-m)}
.plug-card-body{display:flex;flex-direction:column;gap:var(--space-xs)}
.plug-name{font-family:var(--disp);font-weight:600;text-transform:uppercase;font-size:1.28rem;letter-spacing:.01em;margin:0;color:var(--ink);display:flex;align-items:center;gap:var(--space-xs)}
.plug-summary{color:var(--ink-2);font-size:.94rem;margin:0;flex:1}
.plug-badges{display:flex;flex-wrap:wrap;gap:var(--space-2xs);margin-top:auto}
.plug-none{display:flex;flex-direction:column;align-items:center;justify-content:center;border:1.5px dashed var(--hair);padding:var(--space-2xl) var(--space-l);text-align:center;color:var(--ink-2);font-family:var(--mono);font-size:var(--step--1);margin-top:var(--space-l)}
.plug-none[hidden]{display:none}

/* ---- ficha de plugin ---- */
.plug-detail-hero{border-bottom:1.5px solid var(--ink);padding-bottom:clamp(var(--space-l),4vw,var(--space-2xl));margin-bottom:clamp(var(--space-l),4vw,var(--space-xl))}
.plug-hero-kicker{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin:0 0 var(--space-s)}
.plug-hero-main{display:grid;grid-template-columns:1fr;gap:var(--space-l);align-items:start}
@media(min-width:820px){.plug-hero-main{grid-template-columns:1.3fr .9fr;gap:var(--space-2xl)}}
.plug-hero-h1{margin:0 0 var(--space-s)}
.plug-hero-lead{margin:0 0 var(--space-m)}
.plug-hero-specs{display:flex;flex-wrap:wrap;gap:var(--space-xs);margin:0 0 var(--space-m)}
.plug-hero-ver{font-family:var(--mono);font-size:var(--step--1);color:var(--ink-2);letter-spacing:.03em}
.plug-hero-art{border:1.5px solid var(--ink);background:var(--paper-2);padding:clamp(var(--space-s),2.5vw,var(--space-l));overflow:hidden}
.plug-hero-art svg,.plug-hero-art img{width:100%;height:auto;display:block}
.plug-reassure{border-color:rgba(27,122,84,.45);color:#1B7A54}
.plug-cmds{margin:var(--space-xs) 0 0}
.plug-cmd-intro{color:var(--ink-2);margin:0 0 var(--space-s)}
.plug-cmd{display:grid;grid-template-columns:1fr;gap:2px var(--space-m);padding:var(--space-s) 0;border-bottom:1px solid var(--hair)}
@media(min-width:640px){.plug-cmd{grid-template-columns:230px 1fr;align-items:baseline}}
.plug-cmd code{font-family:var(--mono);font-size:var(--step--1);color:var(--red);background:none;border:0;padding:0}
.plug-cmd span{color:var(--ink-2);font-size:.95rem}
.plug-versions{border-top:1.5px solid var(--ink);margin-top:var(--space-xs)}
.plug-log{display:grid;grid-template-columns:auto 1fr;gap:var(--space-2xs) var(--space-l);padding:var(--space-m) 0;border-bottom:1px solid var(--hair)}
.plug-log-v{font-family:var(--disp);font-weight:600;font-size:1.3rem;color:var(--line);line-height:1}
.plug-log-d{font-family:var(--mono);font-size:var(--step--1);color:var(--ink-2);letter-spacing:.04em}
.plug-log-h{grid-column:2;font-weight:700;margin:0 0 var(--space-2xs);color:var(--ink)}
.plug-log ul{grid-column:2;margin:0;padding-left:1.2em;color:var(--ink-2)}
/* regla de lectura de la ficha: la crea ficha-motion.js (sin JS no existe); se traza con el scroll */
.plug-progress{position:fixed;top:0;left:0;width:100%;height:3px;background:var(--red-line);transform:scaleX(0);transform-origin:0 50%;z-index:45;pointer-events:none}
/* ficha: chips de especificación clave/valor (el contenedor .plug-hero-specs ya es flex-wrap) */
.plug-spec{display:flex;flex-direction:column;gap:2px;padding:var(--space-xs) var(--space-s);border:1px solid var(--hair);background:var(--paper-2)}
.plug-spec-k{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
.plug-spec-v{font-size:.92rem;color:var(--ink);line-height:1.25}
.plug-spec-price.plug-kind-free{color:#1B7A54;font-weight:600}
.plug-spec-price.plug-kind-paid{color:var(--red);font-weight:600}
/* ficha: fila de acción (descargar + garantía + reportar bug) */
.plug-cta-row{display:flex;flex-wrap:wrap;gap:var(--space-s) var(--space-m);align-items:center;margin:2px 0 0}
.plug-cta{padding:var(--space-s) var(--space-l);font-size:var(--step--1)}
.plug-report{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.04em;color:var(--ink-2);text-decoration:none;border-bottom:1px solid var(--hair);transition:color .14s,border-color .14s}
.plug-report:hover{color:var(--red);border-color:var(--red-line)}
/* ficha: descripción en profundidad + contenedor de changelog */
.plug-desc{color:var(--ink);line-height:1.7;white-space:pre-line;margin:0}
.plug-changelog{border-top:1.5px solid var(--ink);margin-top:var(--space-xs)}
.cbk-footer-mail{font-weight:600}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ================================================================ PIE */
.cbk-footer{border-top:1.5px solid var(--ink)}
.cbk-footer-inner{display:grid;grid-template-columns:1.5fr 2fr;border-bottom:1.5px solid var(--ink)}
.cbk-footer-brand-col{padding:var(--space-l) var(--space-l) var(--space-l);border-right:1.5px solid var(--ink)}
.cbk-footer-cols{display:grid;grid-template-columns:repeat(3,1fr)}
.cbk-footer-cols .cbk-footer-col{padding:var(--space-l) var(--space-m) var(--space-l)}
.cbk-footer-cols .cbk-footer-col+.cbk-footer-col{border-left:1.5px solid var(--ink)}
@media(max-width:760px){
  .cbk-footer-inner{grid-template-columns:1fr}
  .cbk-footer-brand-col{border-right:0;border-bottom:1.5px solid var(--ink)}
}
@media(max-width:520px){
  .cbk-footer-cols{grid-template-columns:1fr}
  .cbk-footer-cols .cbk-footer-col+.cbk-footer-col{border-left:0;border-top:1.5px solid var(--ink)}
}
.cbk-footer-brand{font-family:var(--disp);font-weight:600;text-transform:uppercase;font-size:1.8rem;letter-spacing:.02em;margin:0 0 var(--space-xs)}
.cbk-footer-tag{color:var(--ink-2);font-size:.9rem;margin:0 0 var(--space-s);max-width:34ch}
.cbk-footer-sec{
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.02em;color:var(--ink);
  display:flex;align-items:flex-start;gap:var(--space-xs);margin:0;
}
.cbk-footer-sec svg{flex:none;color:var(--red);margin-top:1px}
.cbk-footer-sec a{color:var(--red);text-decoration:none}
.cbk-footer-col{display:flex;flex-direction:column;gap:2px}
.cbk-footer-h{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.16em;text-transform:uppercase;color:var(--ink-2);margin-bottom:var(--space-xs)}
.cbk-footer-col a{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.03em;color:var(--ink);text-decoration:none;padding:3px 0;transition:color .14s}
.cbk-footer-col a:hover{color:var(--red)}
.cbk-footer-bar{
  display:flex;justify-content:space-between;gap:var(--space-m);flex-wrap:wrap;padding:var(--space-s) var(--pad);
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2);
}

/* volver arriba */
.cbk-scroll-top{
  position:fixed;right:20px;bottom:20px;z-index:35;width:44px;height:44px;
  border:1.5px solid var(--ink);background:var(--paper);color:var(--ink);cursor:pointer;
  display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(8px);
  pointer-events:none;transition:opacity .18s,transform .18s,background .14s;
}
.cbk-scroll-top.is-visible{opacity:1;transform:none;pointer-events:auto}
.cbk-scroll-top:hover{background:var(--ink);color:var(--paper)}

/* ======================================================= BUSCADOR (overlay) */
html.cbk-search-open{overflow:hidden}
.cbk-search{position:fixed;inset:0;z-index:80;display:flex;justify-content:center;align-items:flex-start}
.cbk-search-backdrop{position:absolute;inset:0;background:rgba(21,42,61,.55)}
.cbk-search-dialog{
  position:relative;margin-top:11vh;width:min(620px,92vw);background:var(--paper);
  border:1.5px solid var(--ink);box-shadow:var(--elev-2);
}
.cbk-search-bar{display:flex;align-items:center;gap:var(--space-s);padding:var(--space-s) var(--space-m);border-bottom:1.5px solid var(--ink);background:var(--paper-2)}
.cbk-search-ico{color:var(--ink-2);flex:none}
.cbk-search-input{flex:1;border:none;background:transparent;font-family:var(--sans);font-size:var(--step-0);color:var(--ink);outline:none}
.cbk-search-close{
  font-family:var(--mono);font-size:var(--step--1);letter-spacing:.05em;color:var(--ink-2);
  border:1.5px solid var(--hair);background:var(--paper);padding:var(--space-2xs) var(--space-xs);cursor:pointer;
}
.cbk-search-close:hover{color:var(--ink);border-color:var(--ink)}
.cbk-search-results{list-style:none;margin:0;padding:var(--space-2xs);max-height:56vh;overflow:auto}
.cbk-search-link{
  display:flex;align-items:center;justify-content:space-between;gap:var(--space-s);text-decoration:none;color:var(--ink);
  padding:var(--space-s) var(--space-s);border:1.5px solid transparent;
}
.cbk-search-link.is-active{border-color:var(--line);background:var(--paper-3)}
.cbk-sr-main{display:flex;flex-direction:column;gap:2px;min-width:0}
.cbk-sr-path{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-2)}
.cbk-sr-title{font-weight:600;font-size:.98rem}
.cbk-sr-type{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.08em;text-transform:uppercase;color:var(--red);flex:none}
.cbk-search-status{padding:var(--space-s) var(--space-m);color:var(--ink-2);font-size:.92rem;margin:0}
.cbk-search-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--space-2xl) var(--space-m);text-align:center}
.cbk-search-hint{padding:var(--space-xs) var(--space-m);border-top:1px solid var(--hair);font-family:var(--mono);font-size:var(--step--1);letter-spacing:.06em;color:var(--ink-2);margin:0}

/* =========================================== TRAZADO DEL PLANO (movimiento)
   El plano se dibuja al cargar: retícula → titular entintado → la cota se mide.
   Todo bajo no-preference: con reduced-motion (o sin JS) aparece ya dibujado. */
@media (prefers-reduced-motion: no-preference){
  @keyframes cbk-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
  @keyframes cbk-ink{from{opacity:0;transform:translateY(24px);clip-path:inset(0 100% 0 0)}to{opacity:1;transform:none;clip-path:inset(0 0 0 0)}}
  @keyframes cbk-grid{from{opacity:0;transform:scale(1.015)}to{opacity:1;transform:none}}
  @keyframes cbk-drop{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}
  @keyframes cbk-dropY{from{transform:scaleY(0)}to{transform:scaleY(1)}}
  @keyframes cbk-wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}

  .cbk-header-inner{animation:cbk-drop .55s cubic-bezier(.2,.7,.2,1) both}
  .hero::before{animation:cbk-grid 1.15s cubic-bezier(.2,.7,.2,1) both}
  .regla{animation:cbk-wipe 1s ease both .1s}
  .hero .eyebrow{animation:cbk-rise .6s ease both .14s}
  .hero h1 .ln{animation:cbk-ink .72s cubic-bezier(.2,.7,.15,1) both}
  .hero h1 .ln:nth-child(1){animation-delay:.24s}
  .hero h1 .ln:nth-child(2){animation-delay:.40s}
  /* la línea 3 lleva la cota colgando por debajo: si la recortara el clip
     desaparecería, así que entra sin clip (solo sube) */
  .hero h1 .ln:nth-child(3){animation:cbk-rise .6s ease both .56s}

  /* la cota se traza cuando el titular ya está entintado */
  .cota .ext{animation:cbk-dropY .26s ease both 1.12s;transform-origin:top}
  .cota .ext.r{animation-delay:1.20s}
  .cota .dl{animation:cbk-wipe .55s cubic-bezier(.3,.7,.15,1) both 1.30s}
  .cota .lab{animation:cbk-rise .4s ease both 1.78s}

  .hero-text{animation:cbk-rise .6s ease both .72s}
  .hero-points li{animation:cbk-rise .5s ease both;opacity:0}
  .hero-points li:nth-child(1){animation-delay:.86s}
  .hero-points li:nth-child(2){animation-delay:.96s}
  .hero-points li:nth-child(3){animation-delay:1.06s}
  .hero-side{animation:cbk-rise .7s ease both 1.02s}
  .hero-actions{animation:cbk-rise .6s ease both 1.92s}

  /* trazado por scroll de las secciones bajo el hero (enhanced.js añade .is-revealed) */
  html.js-reveal-ready .section:not(.hero) .reveal{opacity:0;transform:translateY(24px)}
  html.js-reveal-ready .section:not(.hero) .reveal.is-revealed{
    opacity:1;transform:none;
    transition:opacity .6s ease,transform .68s cubic-bezier(.2,.78,.2,1);
    transition-delay:var(--rd,0s);
  }
  /* cascada: los elementos de una rejilla/lista se trazan uno tras otro */
  .det-row:nth-child(2),.plano-cell:nth-child(2),.fase:nth-child(2),.gar:nth-child(2),.proof-cell:nth-child(2),.faq-item:nth-child(2){--rd:.06s}
  .det-row:nth-child(3),.plano-cell:nth-child(3),.fase:nth-child(3),.gar:nth-child(3),.proof-cell:nth-child(3),.faq-item:nth-child(3){--rd:.12s}
  .det-row:nth-child(4),.plano-cell:nth-child(4),.fase:nth-child(4),.gar:nth-child(4),.faq-item:nth-child(4){--rd:.18s}
  .det-row:nth-child(5),.plano-cell:nth-child(5),.faq-item:nth-child(5){--rd:.24s}
  .det-row:nth-child(6),.plano-cell:nth-child(6){--rd:.30s}
}

/* ===== CAPA DE VIDA — micro-interacciones consistentes en todo el sitio (2026-07-04) ===== */
/* tarjetas: misma firma "sticker lift" que ya usan las de juegos/plugins, para coherencia */
.plano-cell,.gar{outline:1.5px solid transparent;outline-offset:-1.5px;transition:transform .16s,box-shadow .16s,outline-color .16s}
.cbk-res-feature{transition:transform .16s,box-shadow .16s}
.proof-cell{transition:transform .16s,box-shadow .16s}
.cbk-legal-block a,.cbk-footer-links a,.cbk-footer-col a{transition:color .2s,background-color .2s}
.fase{transition:border-color .22s}
.fase .num{transition:color .2s}
/* color/borde: activos también en movimiento reducido */
.cbk-legal-block a:hover{background:rgba(199,64,45,.10)}
.cbk-footer-links a:hover,.cbk-footer-col a:hover{color:var(--red)}
.fase:hover{border-bottom-color:var(--red)}
.fase:hover .num{color:var(--red)}
@media (prefers-reduced-motion: no-preference){
	.plano-cell:hover,.gar:hover{transform:translateY(-2px);box-shadow:var(--elev-2);outline-color:var(--ink)}
	.cbk-res-feature:hover{transform:translateY(-2px);box-shadow:var(--elev-2)}
	.proof-cell:hover{transform:translateY(-2px);box-shadow:var(--elev-2)}
}

/* mini-hero ANIMADO de las fichas de plugins (canvas sobre el SVG estático de fallback) */
.plug-hero-art{position:relative}
.plug-hero-canvas{display:block;width:100%;aspect-ratio:500/330}
.plug-hero-art.is-live{background-image:linear-gradient(rgba(46,94,140,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(46,94,140,.05) 1px,transparent 1px);background-size:28px 28px}
.plug-hero-art.is-live .plug-art-svg{display:none}

/* ===== home: sección Servicios visible (recap tras la obra) + pasos del contacto (2026-07-04) ===== */
.svc-block{padding:clamp(var(--space-2xl),8vh,var(--space-2xl)) 0;border-top:1.5px solid var(--ink)}
.svc-block .of-svc{list-style:none;padding:0;margin:var(--space-l) 0 0;display:grid;gap:var(--space-l);grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.svc-block .of-svc h3{font-family:var(--disp);font-weight:600;text-transform:uppercase;font-size:1.3rem;letter-spacing:.01em;margin:0 0 var(--space-2xs);color:var(--ink)}
.svc-block .of-svc p{color:var(--ink-2);line-height:1.55;margin:0}
.contact-next{margin:var(--space-m) 0 var(--space-2xs);color:var(--ink);font-size:.95rem}
.contact-steps{margin:var(--space-2xs) 0 var(--space-m);padding-left:1.15em;color:var(--ink-2);line-height:1.6}
.contact-steps li{margin:0 0 var(--space-2xs)}

/* ===== Contraste AA — pasada F2 (revisión adversarial): badge «medio», sec-ref en bandas, foco sobre tinta prusia ===== */
.f-sev.medio{color:#8A5A12}
.fases-band .sec-ref,.muestra-band .sec-ref{color:#A82F1D}
.invert a:focus-visible,.seg-opt[aria-pressed="true"]:focus-visible{outline-color:#EDF1F4}

/* ===== Guías: artefactos que enseñan (F2) — tabla de dimensionado, checklist, diagrama de capas, flujo ===== */
/* Tabla */
.cbk-legal-block table.g-table{width:100%;border-collapse:collapse;margin:var(--space-xs) 0 var(--space-m);font-size:.94rem}
.g-table caption{caption-side:top;text-align:left;font-family:var(--mono);font-size:var(--step--1);letter-spacing:.04em;color:var(--ink-2);text-transform:uppercase;padding:0 0 var(--space-xs)}
.g-table th,.g-table td{border:1px solid var(--hair);padding:var(--space-xs) var(--space-s);text-align:left;vertical-align:top}
.g-table thead th{background:var(--paper-2);font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.02em;font-size:.8rem;color:var(--ink)}
.g-table tbody th{font-family:var(--sans);font-weight:700;color:var(--ink);background:var(--paper-2)}
.g-table td{color:var(--ink-2)}
.g-table tbody tr:hover td,.g-table tbody tr:hover th{background:rgba(46,94,140,.05)}
/* Checklist (casilla vacía = por verificar) */
ul.g-check{list-style:none;padding-left:0;margin:var(--space-xs) 0 var(--space-m)}
ul.g-check li{position:relative;padding-left:var(--space-xl);margin:var(--space-s) 0;color:var(--ink-2);line-height:1.55}
ul.g-check li::before{content:"";position:absolute;left:0;top:3px;width:15px;height:15px;border:1.6px solid var(--ink);background:var(--paper)}
ul.g-check li b{color:var(--ink)}
/* Diagrama de capas (defensa por capas / puertas de un servidor) */
.g-layers{margin:var(--space-xs) 0 var(--space-m);display:flex;flex-direction:column;gap:0}
.g-layer{border:1.5px solid var(--ink);background:var(--paper);padding:var(--space-s) var(--space-s);color:var(--ink-2);position:relative;font-size:.95rem}
.g-layer + .g-layer{margin-top:var(--space-m)}
.g-layer + .g-layer::before{content:"";position:absolute;left:50%;top:-15px;width:1.5px;height:11px;background:var(--ink)}
.g-layer + .g-layer::after{content:"";position:absolute;left:calc(50% - 4px);top:-8px;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid var(--ink)}
.g-layer .g-tag{font-family:var(--disp);font-weight:600;text-transform:uppercase;letter-spacing:.02em;color:var(--ink);margin-right:var(--space-xs)}
.g-layer.g-base{background:var(--paper-2);border-style:dashed}
/* Flujo con nodo de decisión */
ol.g-flow{list-style:none;counter-reset:gf;padding-left:0;margin:var(--space-xs) 0 var(--space-m);display:flex;flex-direction:column;gap:0}
ol.g-flow li{position:relative;border:1.5px solid var(--ink);background:var(--paper);padding:var(--space-s) var(--space-s) var(--space-s) var(--space-2xl);color:var(--ink-2);font-size:.95rem}
ol.g-flow li::before{counter-increment:gf;content:counter(gf,decimal-leading-zero);position:absolute;left:12px;top:11px;font-family:var(--disp);font-weight:600;color:var(--red);font-size:1rem}
ol.g-flow li + li{margin-top:var(--space-m)}
ol.g-flow li + li::after{content:"";position:absolute;left:22px;top:-15px;width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:6px solid var(--ink)}
ol.g-flow li.g-pivot{border-style:dashed;background:var(--paper-2)}
ol.g-flow li b{color:var(--ink)}
/* Hub: meta editorial por guía (tiempo de lectura · actualizada) */
.cbk-guide-meta{font-family:var(--mono);font-size:var(--step--1);letter-spacing:.04em;color:var(--ink-2);text-transform:uppercase;margin:-var(--space-2xs) 0 var(--space-xs)}

/* --- Fase 2: Landing Page Plugins --- */
.plug-overview { text-align: center; }
.plug-desc-large { font-size: clamp(1.1rem, 2vw, 1.25rem); color: var(--ink-2); max-width: 800px; margin:0 auto; line-height: 1.6; }
.bg-alt { background: var(--paper-2); }
.plug-features { padding:clamp(var(--space-xl), 6vw, var(--space-2xl)) 0; }
.plug-report-demo { padding:clamp(var(--space-xl), 6vw, var(--space-2xl)) 0; text-align: center; }
.report-demo-box { display: inline-flex; flex-direction: column; align-items: center; border: 1.5px solid var(--ink); padding:clamp(var(--space-l), 4vw, var(--space-xl)); background: #fff; max-width: 800px; text-align: center; box-shadow:var(--elev-2); }
.report-demo-text h2 { font-family: var(--disp); font-size: 1.8rem; letter-spacing: 0.02em; margin:0 0 var(--space-m); color: var(--ink); text-transform: uppercase; }
.report-demo-text p { color: var(--ink-2); margin-bottom:var(--space-l); font-size: 1.05rem; }
.plug-commands { padding:clamp(var(--space-xl), 6vw, var(--space-2xl)) 0; }
.plug-meta { padding:clamp(var(--space-xl), 6vw, var(--space-2xl)) 0; }
.meta-block { display: flex; flex-direction: column; gap:var(--space-m); }
.meta-block h2 { font-family: var(--disp); font-size: 1.4rem; font-weight: 600; text-transform: uppercase; color: var(--ink); margin:0; }