/* ==========================================================================
   Olpa Group — Clusters custom (HTML por cluster, layouts únicos)
   Este archivo se carga SOLO en clusters con HTML manual.
   ========================================================================== */

/* ==========================================================================
   MEJORAS GLOBALES DE ALINEAMIENTO Y TRANSICIONES (aplican a todos los clusters)
   ========================================================================== */

/* Hero grid mejor alineado vertical y con gap más aire */
.pillar-hero-home .hero-grid{align-items:center;gap:70px}
@media(max-width:1024px){.pillar-hero-home .hero-grid{gap:48px}}

/* Hero visual siempre centrado vertical + horizontal */
.pillar-hero-home .hero-viz{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:520px;
  position:relative;
}
@media(max-width:1024px){.pillar-hero-home .hero-viz{min-height:auto}}

/* Contenedor de mockups con max-width coherente y margen centrador */
.pillar-hero-home .hero-viz>*{
  margin-left:auto;
  margin-right:auto;
  max-width:100%;
}

/* Hero stats — mejor contenedor cuando está al lado del visual
   (antes se veían "sueltos" sin anclaje visual) */
.pillar-hero-home .hero-stats{
  margin-top:46px;
  padding-top:32px;
  border-top:1px solid var(--border);
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:20px;
  position:relative;
}
.pillar-hero-home .hero-stats::before{
  content:'';
  position:absolute;
  top:-1px;
  left:0;
  width:60px;
  height:2px;
  background:linear-gradient(90deg,var(--olpa),transparent);
  border-radius:2px;
}
@media(max-width:640px){.pillar-hero-home .hero-stats{grid-template-columns:repeat(2,1fr);gap:22px}}

.pillar-hero-home .hero-stats .stat{
  display:flex;
  flex-direction:column;
  gap:6px;
  position:relative;
}
.pillar-hero-home .hero-stats .stat .n{
  font-family:var(--font-display);
  font-size:clamp(1.6rem,2.4vw,2.1rem);
  font-weight:700;
  background:linear-gradient(135deg,var(--olpa),var(--olpa-soft));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  line-height:1;
  letter-spacing:-.02em;
}
.pillar-hero-home .hero-stats .stat .l{
  font-size:10px;
  color:var(--muted);
  font-family:var(--font-mono);
  text-transform:uppercase;
  letter-spacing:.08em;
  line-height:1.4;
}

/* ==========================================================================
   SECTION DIVIDERS — marcar cambio de sección con algo sutil pero visible
   Se aplica automáticamente a cada <section> dentro de los clusters
   ========================================================================== */

/* Line divider arriba de cada section principal */
.cl-compare-section,.cl-abilities,.cl-build,.cl-cross,.cl-faq,
.cl-stack,.cl-decision,.cl-price,.cl-deliverables,.cl-context,
.cl-localization,.cl-odoo-apps,.cl-custom-dev,.cl-methods,.cl-by-industry,
.cl-regulation,.cl-tech-depth,.cl-sales-methods,.cl-crm-profiles,
.cl-tasks-table,.cl-antes-despues,.cl-providers,.cl-flows-make,
.cl-models,.cl-perf,.cl-stacks,.cl-wp-stack,.cl-shop-apps,
.cl-tn-integrations{
  position:relative;
}

/* Marker visual de sección: línea gradient horizontal + punto central */
.cl-compare-section::before,.cl-abilities::before,.cl-build::before,
.cl-cross::before,.cl-stack::before,.cl-decision::before,.cl-price::before,
.cl-deliverables::before,.cl-context::before,.cl-custom-dev::before,
.cl-methods::before,.cl-by-industry::before,.cl-regulation::before,
.cl-tech-depth::before,.cl-sales-methods::before,.cl-crm-profiles::before,
.cl-tasks-table::before,.cl-antes-despues::before,.cl-providers::before,
.cl-flows-make::before,.cl-models::before,.cl-perf::before,.cl-stacks::before,
.cl-wp-stack::before,.cl-shop-apps::before,.cl-tn-integrations::before,
.cl-odoo-apps::before,.cl-localization::before{
  content:'';
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:180px;
  height:1px;
  background:linear-gradient(90deg,transparent 0%,rgba(255,214,10,.4) 50%,transparent 100%);
  opacity:.5;
}

/* Punto central del divider que pulsa */
.cl-compare-section::after,.cl-abilities::after,.cl-build::after,
.cl-cross::after,.cl-stack::after,.cl-decision::after,.cl-price::after,
.cl-deliverables::after,.cl-context::after,.cl-custom-dev::after,
.cl-methods::after,.cl-by-industry::after,.cl-regulation::after,
.cl-tech-depth::after,.cl-sales-methods::after,.cl-crm-profiles::after,
.cl-tasks-table::after,.cl-antes-despues::after,.cl-providers::after,
.cl-flows-make::after,.cl-models::after,.cl-perf::after,.cl-stacks::after,
.cl-wp-stack::after,.cl-shop-apps::after,.cl-tn-integrations::after,
.cl-odoo-apps::after,.cl-localization::after{
  content:'';
  position:absolute;
  top:-3px;
  left:50%;
  transform:translateX(-50%);
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--olpa);
  box-shadow:0 0 14px rgba(255,214,10,.6),0 0 3px rgba(255,214,10,.9);
  animation:dividerPulse 3s ease-in-out infinite;
}
@keyframes dividerPulse{
  0%,100%{transform:translateX(-50%) scale(1);box-shadow:0 0 14px rgba(255,214,10,.6),0 0 3px rgba(255,214,10,.9)}
  50%{transform:translateX(-50%) scale(1.3);box-shadow:0 0 22px rgba(255,214,10,.9),0 0 6px rgba(255,214,10,1)}
}

/* ==========================================================================
   SECTION HEAD mejorado — más aire, animación de entrada notoria
   ========================================================================== */

.section-head{
  position:relative;
  padding-top:16px;
}

/* Section-tag más llamativo con pulso sutil */
.section-head .section-tag{
  position:relative;
  margin-bottom:24px;
  transition:transform .4s var(--ease),box-shadow .4s ease;
}
.section-head .section-tag:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(0,229,255,.15);
}

/* Pequeña línea vertical bajo el section-tag */
.section-head .section-tag::after{
  content:'';
  position:absolute;
  left:50%;
  top:calc(100% + 6px);
  transform:translateX(-50%);
  width:1px;
  height:14px;
  background:linear-gradient(180deg,var(--accent),transparent);
  opacity:.5;
}

/* H2 con letter-spacing más definido y entrada animada */
.section-head h2{
  margin-bottom:20px;
  position:relative;
}

/* ==========================================================================
   HERO VIZ CENTRADO específico por tipo (uniformiza altura de cards mockup)
   ========================================================================== */

.chat-mockup,
.task-inbox,
.make-scenario,
.clock-24,
.odoo-mockup,
.kanban-mockup,
.trace-timeline,
.ladder-mockup,
.bpmn-mockup,
.iphone-mockup,
.browser-mockup,
.wp-mockup,
.shop-mockup,
.tn-mockup,
.lh-mockup,
.brand-mockup,
.journey-mockup,
.viz-code,
.viz-metrics{
  margin:0 auto;
  max-width:500px;
  width:100%;
}

/* Svgs de visual temático (viz-flow, viz-gear, etc) también centrados */
.hero-viz>.viz-svg{
  max-width:460px;
  width:100%;
  margin:0 auto;
  display:block;
}

/* ==========================================================================
   LABEL DE SECCIÓN: contador de secciones automático con counter-reset
   No altera el DOM; solo es una señal visual en el lado derecho del section-tag
   ========================================================================== */

/* Body (main con clusters) arranca un counter */
main#cluster-root,
main#pillar-root,
main#tool-root,
body{counter-reset:cl-sec}

/* Cada section-head incrementa el counter y muestra el número */
.cl-abilities .section-head::before,
.cl-compare-section .section-head::before,
.cl-build .section-head::before,
.cl-cross .section-head::before,
.cl-stack .section-head::before,
.cl-decision .section-head::before,
.cl-price .section-head::before,
.cl-deliverables .section-head::before,
.cl-faq .section-head::before,
.cl-methods .section-head::before,
.cl-by-industry .section-head::before,
.cl-regulation .section-head::before,
.cl-tech-depth .section-head::before,
.cl-sales-methods .section-head::before,
.cl-crm-profiles .section-head::before,
.cl-tasks-table .section-head::before,
.cl-antes-despues .section-head::before,
.cl-providers .section-head::before,
.cl-flows-make .section-head::before,
.cl-models .section-head::before,
.cl-perf .section-head::before,
.cl-stacks .section-head::before,
.cl-wp-stack .section-head::before,
.cl-shop-apps .section-head::before,
.cl-tn-integrations .section-head::before,
.cl-odoo-apps .section-head::before,
.cl-localization .section-head::before,
.cl-custom-dev .section-head::before,
.cl-context .section-head::before{
  counter-increment:cl-sec;
  content:'§ ' counter(cl-sec,decimal-leading-zero);
  position:absolute;
  top:-4px;
  left:50%;
  transform:translateX(-50%);
  font-family:var(--font-mono);
  font-size:10px;
  color:var(--olpa);
  letter-spacing:.3em;
  opacity:.6;
  background:var(--bg);
  padding:0 14px;
}

/* ==========================================================================
   SCROLL INVITATION — micro-flecha animada al tope de cada section-head
   que invita a seguir leyendo (solo visible al hover de la sección)
   ========================================================================== */

.cl-abilities .section-head h2::after,
.cl-compare-section .section-head h2::after,
.cl-build .section-head h2::after,
.cl-cross .section-head h2::after{
  content:'';
  display:block;
  width:40px;
  height:2px;
  background:linear-gradient(90deg,var(--olpa),transparent);
  margin:18px auto 0;
  border-radius:2px;
  opacity:.7;
}

/* ==========================================================================
   Micro-interacciones que invitan a leer
   ========================================================================== */

/* Cards con un micro-hover más notorio */
.ability-card:hover,
.flow-card:hover,
.sm-card:hover,
.method-card:hover,
.ip-row:hover,
.reg-card:hover,
.td-card:hover,
.tool-card:hover,
.crm-profile:hover,
.price-card:hover,
.loc-card:hover,
.sector-card:hover,
.channel-card:hover,
.perf-card:hover,
.plugin-card:hover,
.model-card:hover,
.stack-item-card:hover{
  transform:translateY(-6px);
  transition:transform .45s var(--ease),border-color .45s ease,box-shadow .45s ease;
}

/* Los chips y app-chip también con micro-interacción */
.app-chip:hover{
  transform:translateX(3px);
  border-color:rgba(255,214,10,.4);
}

/* FAQ items: cuando se abren tienen una pequeña barra de progreso gradient */
.faq-item[open] summary::before{
  content:'';
  position:absolute;
  left:0;
  top:0;
  width:3px;
  height:100%;
  background:linear-gradient(180deg,var(--olpa),var(--accent));
  border-radius:3px 0 0 3px;
}
.faq-item summary{position:relative}

/* ==========================================================================
   HERO visual — pequeño badge inferior derecho "↓ ver más"
   ========================================================================== */

.pillar-hero-home::after{
  content:'scroll ↓';
  position:absolute;
  bottom:28px;
  left:50%;
  transform:translateX(-50%);
  font-family:var(--font-mono);
  font-size:10px;
  color:var(--muted);
  letter-spacing:.25em;
  text-transform:uppercase;
  opacity:.4;
  animation:scrollHint 2.5s ease-in-out infinite;
  pointer-events:none;
  z-index:10;
}
@keyframes scrollHint{
  0%,100%{transform:translate(-50%,0);opacity:.4}
  50%{transform:translate(-50%,6px);opacity:.8}
}
@media(max-width:768px){.pillar-hero-home::after{display:none}}


/* ===== CHAT MOCKUP (agentes-de-ia) ===== */
.chat-mockup{padding:0;overflow:hidden;max-width:460px;margin:0 auto;border-radius:22px;background:rgba(12,12,22,.95)!important;border:1px solid rgba(37,211,102,.25)!important}
.chat-head{display:flex;align-items:center;gap:14px;padding:18px 22px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.chat-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--olpa),var(--olpa-deep));display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 0 20px rgba(255,214,10,.3)}
.chat-info{flex:1;min-width:0}
.chat-name{font-family:var(--font-display);font-weight:600;font-size:14px;color:var(--text)}
.chat-status{font-size:11px;color:#22c55e;font-family:var(--font-mono);margin-top:2px}
.chat-body{padding:22px 20px;display:flex;flex-direction:column;gap:10px;min-height:300px;background:rgba(5,5,10,.6)}
.msg{max-width:78%;padding:11px 15px;border-radius:16px;font-size:13px;line-height:1.5;position:relative;display:flex;flex-direction:column;gap:4px}
.msg-in{align-self:flex-start;background:var(--surface-2);border:1px solid var(--border);border-bottom-left-radius:4px}
.msg-out{align-self:flex-end;background:linear-gradient(135deg,#25d366,#128c7e);color:#fff;border-bottom-right-radius:4px}
.msg time{font-size:9px;opacity:.65;font-family:var(--font-mono);align-self:flex-end}
.msg strong{color:var(--olpa)}
.msg-out strong{color:#fff}
.msg-typing{animation:typingGlow 2s ease-in-out infinite}
@keyframes typingGlow{0%,100%{box-shadow:0 0 0 0 rgba(37,211,102,.4)}50%{box-shadow:0 0 0 6px rgba(37,211,102,0)}}
.chat-footer{padding:12px 20px;background:rgba(255,255,255,.02);border-top:1px solid var(--border);font-size:10px;color:var(--muted);text-align:center;font-family:var(--font-mono);letter-spacing:.05em}

/* ===== VS GRID (chatbot vs agente) ===== */
.vs-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:30px;align-items:stretch;max-width:1100px;margin:0 auto}
@media(max-width:900px){.vs-grid{grid-template-columns:1fr;gap:20px}}
.vs-col{padding:38px 36px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border)}
.vs-left{border-color:rgba(248,113,113,.25);background:linear-gradient(180deg,rgba(248,113,113,.04),transparent)}
.vs-right{border-color:rgba(34,197,94,.28);background:linear-gradient(180deg,rgba(34,197,94,.05),transparent);box-shadow:0 0 40px rgba(34,197,94,.08)}
.vs-label{font-family:var(--font-mono);font-size:11px;color:#f87171;text-transform:uppercase;letter-spacing:.2em;margin-bottom:26px;padding-bottom:14px;border-bottom:1px solid rgba(248,113,113,.15)}
.vs-label-right{color:#22c55e;border-bottom-color:rgba(34,197,94,.18)}
.vs-list{list-style:none;display:flex;flex-direction:column;gap:14px}
.vs-list li{display:flex;gap:14px;font-size:.96rem;color:var(--text-2);line-height:1.55;align-items:flex-start}
.vs-list .bad,.vs-list .ok{flex-shrink:0;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;margin-top:1px}
.vs-list .bad{background:rgba(248,113,113,.12);border:1px solid rgba(248,113,113,.35);color:#f87171}
.vs-list .ok{background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.4);color:#22c55e}
.vs-sep{font-family:var(--font-display);font-weight:700;font-size:1.6rem;color:var(--olpa);align-self:center;padding:0 10px}
@media(max-width:900px){.vs-sep{text-align:center}}

/* ===== ABILITY CARDS (3 columnas con offset zig-zag) ===== */
.ability-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;max-width:1200px;margin:0 auto}
@media(max-width:1024px){.ability-grid{grid-template-columns:1fr;gap:20px}}
.ability-card{padding:38px 34px;position:relative;display:flex;flex-direction:column;gap:14px;border-radius:var(--r-lg)}
.ability-card.ability-offset{transform:translateY(40px)}
@media(max-width:1024px){.ability-card.ability-offset{transform:none}}
.ability-card .ability-icon{font-size:40px;line-height:1;margin-bottom:6px}
.ability-card .ability-num{position:absolute;top:30px;right:34px;font-family:var(--font-display);font-weight:700;font-size:3rem;color:transparent;-webkit-text-stroke:1.5px rgba(255,214,10,.25);line-height:1}
.ability-card h3{font-size:1.25rem;font-family:var(--font-display)}
.ability-card>p{font-size:.95rem;color:var(--muted);line-height:1.6}
.ability-card .ability-example{margin-top:16px;padding:18px 20px;background:rgba(0,229,255,.05);border:1px solid rgba(0,229,255,.2);border-left:3px solid var(--accent);border-radius:12px}
.ability-card .ability-example .ex-label{font-family:var(--font-mono);font-size:9px;color:var(--accent);text-transform:uppercase;letter-spacing:.18em;margin-bottom:8px;display:block}
.ability-card .ability-example p{font-size:.86rem;color:var(--text-2);line-height:1.55;margin:0}

/* ===== BUILD TIMELINE (6 pasos) ===== */
.build-timeline{max-width:900px;margin:0 auto;position:relative;padding-left:80px}
.build-timeline::before{content:'';position:absolute;left:26px;top:14px;bottom:14px;width:2px;background:linear-gradient(180deg,var(--olpa),var(--accent),var(--olpa))}
.build-step{display:flex;gap:28px;padding-bottom:34px;position:relative}
.build-step:last-child{padding-bottom:0}
.build-num{position:absolute;left:-80px;width:54px;height:54px;border-radius:50%;background:var(--bg);border:2px solid var(--olpa);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:13px;font-weight:700;color:var(--olpa);box-shadow:0 0 22px rgba(255,214,10,.25);z-index:2}
.build-body{flex:1;padding:22px 28px;background:var(--surface);border:1px solid var(--border);border-radius:16px;transition:all .3s}
.build-body:hover{border-color:rgba(255,214,10,.3);transform:translateX(6px)}
.build-body h4{font-family:var(--font-display);font-size:1.15rem;margin-bottom:8px}
.build-body p{font-size:.92rem;color:var(--text-2);line-height:1.6;margin:0}
@media(max-width:640px){.build-timeline{padding-left:60px}.build-num{left:-60px;width:44px;height:44px;font-size:11px}.build-timeline::before{left:20px}}

/* ===== CASE BIG (destacado grande con metrics lateral) ===== */
.case-big{max-width:1100px;margin:0 auto;padding:0;overflow:hidden;border-radius:var(--r-xl)}
.case-big-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:0}
@media(max-width:1024px){.case-big-grid{grid-template-columns:1fr}}
.case-big-grid>div:first-child{padding:50px 48px;border-right:1px solid var(--border)}
@media(max-width:1024px){.case-big-grid>div:first-child{border-right:none;border-bottom:1px solid var(--border);padding:38px 28px}}
.case-big-grid .case-tag{font-family:var(--font-mono);font-size:11px;color:var(--accent);letter-spacing:.15em;text-transform:uppercase;margin-bottom:14px}
.case-big-grid h3{font-size:clamp(1.4rem,3vw,2rem);font-family:var(--font-display);margin-bottom:22px;line-height:1.25}
.case-big-grid p{font-size:.96rem;color:var(--text-2);line-height:1.65;margin-bottom:14px}
.case-big-time{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;padding-top:24px;border-top:1px dashed var(--border)}
.case-big-time .case-tl{font-family:var(--font-mono);font-size:11px;color:var(--muted);background:rgba(255,214,10,.05);border:1px solid rgba(255,214,10,.15);padding:10px 14px;border-radius:10px;line-height:1.45}
.case-big-time .case-tl strong{color:var(--olpa);font-size:12px;display:block;margin-bottom:2px}
.case-big-metrics{padding:50px 42px;display:grid;grid-template-columns:1fr 1fr;gap:24px;align-content:center;background:linear-gradient(180deg,rgba(255,214,10,.04),rgba(0,229,255,.03))}
@media(max-width:1024px){.case-big-metrics{padding:36px 28px}}
.big-metric{text-align:center;padding:18px 14px;background:rgba(10,10,18,.4);border-radius:14px;border:1px solid var(--border)}
.big-metric-n{font-family:var(--font-display);font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:700;background:linear-gradient(135deg,var(--olpa),var(--olpa-soft));-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.big-metric-l{font-size:11px;color:var(--muted);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;margin-top:8px}

/* ===== TECH GRID 3/4 COLUMNAS (stack técnico) ===== */
.tech-grid-3{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;max-width:1100px;margin:0 auto}
@media(max-width:1024px){.tech-grid-3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.tech-grid-3{grid-template-columns:1fr}}
.tech-col{padding:30px 26px;background:var(--surface);border:1px solid var(--border);border-radius:16px}
.tech-col h5{font-family:var(--font-mono);font-size:11px;color:var(--accent);text-transform:uppercase;letter-spacing:.18em;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.tech-col ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.tech-col ul li{font-size:.9rem;color:var(--text-2);padding-left:18px;position:relative}
.tech-col ul li::before{content:'▸';position:absolute;left:0;color:var(--olpa)}

/* ===== CROSS BOXES (4 cards de cómo se combina con otras áreas) ===== */
.cross-boxes{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:1200px;margin:0 auto}
@media(max-width:1024px){.cross-boxes{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.cross-boxes{grid-template-columns:1fr}}
.cross-box{padding:28px 26px;display:flex;flex-direction:column;gap:12px;min-height:200px}
.cross-box .cx-pillar-tag{font-family:var(--font-mono);font-size:10px;color:var(--accent);text-transform:uppercase;letter-spacing:.18em;padding-bottom:10px;border-bottom:1px solid var(--border);display:inline-block;width:fit-content;transition:color .3s}
.cross-box:hover .cx-pillar-tag{color:var(--olpa)}
.cross-box h4{font-family:var(--font-display);font-size:1.08rem;margin-top:6px}
.cross-box p{font-size:.87rem;color:var(--muted);line-height:1.55;margin:0}

/* ===== PRICE COLUMNS (3 tiers) ===== */
.price-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1200px;margin:0 auto}
@media(max-width:1024px){.price-columns{grid-template-columns:1fr;gap:20px}}
.price-card{padding:42px 36px;display:flex;flex-direction:column;gap:14px;position:relative;border-radius:var(--r-xl)}
.price-card-featured{background:linear-gradient(180deg,rgba(255,214,10,.08),rgba(255,214,10,.02))!important;border-color:rgba(255,214,10,.4)!important;transform:translateY(-8px);box-shadow:0 30px 80px rgba(255,214,10,.12)}
@media(max-width:1024px){.price-card-featured{transform:none}}
.price-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--olpa);color:#000;font-family:var(--font-mono);font-size:10px;font-weight:700;padding:6px 14px;border-radius:999px;letter-spacing:.1em;white-space:nowrap;box-shadow:0 8px 24px rgba(255,214,10,.4)}
.price-label{font-family:var(--font-mono);font-size:11px;color:var(--accent);text-transform:uppercase;letter-spacing:.18em}
.price-value{font-family:var(--font-display);font-size:2.2rem;font-weight:700;background:linear-gradient(135deg,var(--olpa),var(--olpa-soft));-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.price-value span{font-size:1.1rem;color:var(--muted);-webkit-text-fill-color:var(--muted);margin-left:4px}
.price-op{font-size:.8rem;color:var(--muted);font-family:var(--font-mono);margin-top:-4px}
.price-card ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin:18px 0 22px;padding-top:18px;border-top:1px solid var(--border)}
.price-card ul li{font-size:.9rem;color:var(--text-2);padding-left:22px;position:relative;line-height:1.5}
.price-card ul li::before{content:'✓';position:absolute;left:0;color:var(--olpa);font-weight:700}
.price-card .btn-primary,.price-card .btn-ghost{margin-top:auto}

/* ===== TABLA COMPARATIVA (n8n vs Zapier vs Make) ===== */
.compare-table{max-width:1100px;margin:0 auto;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border);overflow:hidden;overflow-x:auto}
.compare-table table{width:100%;border-collapse:collapse;min-width:700px}
.compare-table th,.compare-table td{padding:18px 22px;text-align:left;border-bottom:1px solid var(--border);font-size:.92rem;color:var(--text-2)}
.compare-table th{font-family:var(--font-display);font-size:1rem;color:var(--text);background:rgba(255,255,255,.02);font-weight:600;position:relative}
.compare-table td.t-label{font-family:var(--font-mono);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;white-space:nowrap}
.compare-table th.t-highlight,.compare-table td.t-highlight{background:rgba(255,214,10,.06);color:var(--olpa);font-weight:600;position:relative}
.compare-table th.t-highlight{color:var(--olpa)}
.compare-table .t-badge{display:block;font-family:var(--font-mono);font-size:9px;color:#000;background:var(--olpa);padding:3px 9px;border-radius:999px;letter-spacing:.08em;margin-top:6px;font-weight:700;width:fit-content}
.compare-table tbody tr:hover td{background:rgba(255,255,255,.02)}
.compare-table tbody tr:hover td.t-highlight{background:rgba(255,214,10,.1)}
.compare-verdict{max-width:920px;margin:36px auto 0;padding:26px 32px;background:var(--surface-2);border:1px solid var(--border);border-left:3px solid var(--olpa);border-radius:14px}
.compare-verdict p{font-size:.96rem;color:var(--text-2);line-height:1.7;margin:0}

/* ===== CALCULADORA DE AHORRO (savings) ===== */
.savings-compare{display:grid;grid-template-columns:1fr auto 1fr;gap:26px;align-items:stretch;max-width:1100px;margin:0 auto}
@media(max-width:900px){.savings-compare{grid-template-columns:1fr;gap:20px}}
.savings-col{padding:40px 36px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border);display:flex;flex-direction:column;gap:18px}
.savings-bad{border-color:rgba(248,113,113,.22);background:linear-gradient(180deg,rgba(248,113,113,.04),transparent)}
.savings-good{border-color:rgba(34,197,94,.3);background:linear-gradient(180deg,rgba(34,197,94,.06),transparent);box-shadow:0 0 50px rgba(34,197,94,.1)}
.savings-label{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;letter-spacing:.18em;color:var(--muted)}
.savings-amount{font-family:var(--font-display);font-size:1.4rem;color:var(--text);line-height:1}
.savings-amount .big{font-size:2.8rem;color:var(--olpa);display:block;margin:6px 0}
.savings-bad .savings-amount .big{color:#f87171}
.savings-good .savings-amount .big{color:#22c55e}
.savings-col ul{list-style:none;display:flex;flex-direction:column;gap:10px;margin:14px 0;padding-top:14px;border-top:1px solid var(--border)}
.savings-col li{font-size:.88rem;color:var(--text-2);padding-left:18px;position:relative;line-height:1.5}
.savings-col li::before{content:'•';position:absolute;left:0;color:var(--muted)}
.savings-tag{margin-top:auto;padding:10px 16px;border-radius:999px;font-family:var(--font-mono);font-size:10px;text-align:center;text-transform:uppercase;letter-spacing:.12em;font-weight:700}
.savings-tag.bad{background:rgba(248,113,113,.12);color:#f87171;border:1px solid rgba(248,113,113,.3)}
.savings-tag.good{background:rgba(34,197,94,.14);color:#22c55e;border:1px solid rgba(34,197,94,.35)}
.savings-vs{font-family:var(--font-display);font-weight:700;font-size:1.8rem;color:var(--olpa);align-self:center;padding:0 14px}
@media(max-width:900px){.savings-vs{text-align:center;padding:6px 0}}
.savings-total{margin-top:48px;display:flex;justify-content:center}
.savings-delta{display:flex;flex-direction:column;align-items:center;padding:32px 60px;background:linear-gradient(135deg,rgba(255,214,10,.12),rgba(34,197,94,.08));border:1px solid rgba(255,214,10,.35);border-radius:var(--r-lg);box-shadow:0 0 60px rgba(255,214,10,.15)}
.delta-label{font-family:var(--font-mono);font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.2em}
.delta-value{font-family:var(--font-display);font-size:clamp(2.4rem,5vw,3.6rem);font-weight:700;background:linear-gradient(135deg,var(--olpa),#22c55e);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1;margin:8px 0}
.delta-pct{font-family:var(--font-mono);font-size:1.1rem;color:#22c55e;font-weight:700}

/* ===== FLOWS GRID (9 cards de automatizaciones típicas) ===== */
.flows-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1200px;margin:0 auto}
@media(max-width:1024px){.flows-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.flows-grid{grid-template-columns:1fr}}
.flow-card{padding:28px 26px;display:flex;flex-direction:column;gap:12px;min-height:180px;border-radius:var(--r-lg)}
.flow-card .flow-ico{font-size:32px;line-height:1}
.flow-card h4{font-family:var(--font-display);font-size:1.05rem}
.flow-card p{font-size:.88rem;color:var(--muted);line-height:1.55;margin:0}

/* ===== TASK INBOX (agentes-de-ia nuevo) ===== */
.task-inbox{padding:0;overflow:hidden;max-width:480px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.25)!important}
.ti-head{display:flex;align-items:center;gap:14px;padding:18px 22px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.ti-avatar{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,var(--olpa),var(--olpa-deep));display:flex;align-items:center;justify-content:center;font-size:20px;box-shadow:0 0 20px rgba(255,214,10,.35)}
.ti-info{flex:1;min-width:0}
.ti-name{font-family:var(--font-display);font-weight:600;font-size:14px;color:var(--text)}
.ti-status{font-size:11px;color:var(--accent);font-family:var(--font-mono);margin-top:2px}
.ti-badge{font-family:var(--font-mono);font-size:9px;color:#22c55e;background:rgba(34,197,94,.12);padding:4px 9px;border-radius:999px;letter-spacing:.1em;border:1px solid rgba(34,197,94,.3);font-weight:700}
.ti-body{padding:18px 18px;display:flex;flex-direction:column;gap:10px;min-height:320px;background:rgba(5,5,10,.6)}
.ti-task{display:flex;align-items:center;gap:14px;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:12px;transition:all .3s}
.ti-task.ti-done{opacity:.7}
.ti-task.ti-done:hover{opacity:1}
.ti-task.ti-running{border-color:rgba(255,214,10,.4);background:linear-gradient(135deg,rgba(255,214,10,.05),var(--surface));box-shadow:0 0 20px rgba(255,214,10,.1)}
.ti-task:hover{transform:translateX(4px);border-color:rgba(255,214,10,.3)}
.ti-icon{flex-shrink:0;width:26px;height:26px;border-radius:50%;background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.35);display:flex;align-items:center;justify-content:center;color:#22c55e;font-weight:700;font-size:13px}
.ti-running .ti-icon{background:rgba(255,214,10,.14);border-color:rgba(255,214,10,.4);color:var(--olpa)}
.ti-task:not(.ti-done):not(.ti-running) .ti-icon{background:transparent;border-color:var(--border);color:var(--muted)}
.ti-spin{animation:spin 2s linear infinite}
.ti-main{flex:1;min-width:0}
.ti-title{font-size:13px;color:var(--text);font-weight:500;line-height:1.35;margin-bottom:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ti-meta{font-size:10px;color:var(--muted);font-family:var(--font-mono)}
.ti-tag{flex-shrink:0;font-family:var(--font-mono);font-size:9px;padding:4px 9px;border-radius:999px;letter-spacing:.08em;font-weight:700}
.ti-tag-done{background:rgba(34,197,94,.1);color:#22c55e;border:1px solid rgba(34,197,94,.25)}
.ti-tag-run{background:rgba(255,214,10,.1);color:var(--olpa);border:1px solid rgba(255,214,10,.3)}
.ti-tag-queue{background:rgba(138,138,153,.08);color:var(--muted);border:1px solid var(--border-strong)}
.ti-footer{padding:12px 20px;background:rgba(255,255,255,.02);border-top:1px solid var(--border);font-size:10px;color:var(--muted);text-align:center;font-family:var(--font-mono)}

/* ===== MAKE SCENARIO MOCKUP ===== */
.make-scenario{padding:0;overflow:hidden;max-width:460px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(139,92,246,.3)!important}
.make-head{display:flex;align-items:center;gap:8px;padding:14px 18px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.make-head .make-dot{width:12px;height:12px;border-radius:50%;background:#ff5f57}
.make-head-title{margin-left:12px;font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.make-canvas{position:relative;padding:30px;min-height:380px}
.make-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.make-path{stroke-dashoffset:10;animation:dashFlow 3s linear infinite}
.make-mod{position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px;z-index:2}
.make-mod .mod-icon{width:56px;height:56px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:24px;box-shadow:0 10px 30px rgba(0,0,0,.4);border:2px solid rgba(255,255,255,.1)}
.make-mod .mod-label{font-family:var(--font-display);font-weight:600;font-size:12px;color:var(--text)}
.make-mod .mod-sub{font-family:var(--font-mono);font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.make-mod-tl{top:30px;left:30px}
.make-mod-center{top:160px;left:50%;transform:translateX(-50%)}
.make-mod-br{bottom:20px;right:30px}
.make-mod-bl{bottom:20px;left:30px}
.make-footer{padding:14px 20px;background:rgba(139,92,246,.05);border-top:1px solid var(--border);text-align:center}
.make-status{font-family:var(--font-mono);font-size:11px;color:#8b5cf6;letter-spacing:.05em}

/* ===== DECISION GRID (Make vs n8n) ===== */
.decision-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;max-width:1200px;margin:0 auto}
@media(max-width:900px){.decision-grid{grid-template-columns:1fr}}
.decision-col{padding:42px 38px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border);display:flex;flex-direction:column;gap:18px}
.decision-make{border-color:rgba(139,92,246,.3);background:linear-gradient(180deg,rgba(139,92,246,.04),transparent)}
.decision-n8n{border-color:rgba(255,214,10,.3);background:linear-gradient(180deg,rgba(255,214,10,.04),transparent)}
.dec-head{display:flex;align-items:center;gap:16px;padding-bottom:20px;border-bottom:1px solid var(--border)}
.dec-icon{width:48px;height:48px;border-radius:14px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:22px;border:1px solid var(--border-strong)}
.decision-make .dec-icon{background:rgba(139,92,246,.1);border-color:rgba(139,92,246,.3);color:#8b5cf6}
.decision-n8n .dec-icon{background:rgba(255,214,10,.1);border-color:rgba(255,214,10,.3);color:var(--olpa)}
.dec-title{font-family:var(--font-display);font-size:1.2rem;font-weight:600}
.dec-list{list-style:none;display:flex;flex-direction:column;gap:14px;flex:1}
.dec-list li{padding:14px 16px;background:var(--bg-2);border:1px solid var(--border);border-radius:12px;font-size:.9rem;color:var(--text-2);line-height:1.55;transition:all .3s}
.dec-list li:hover{border-color:rgba(255,214,10,.25);transform:translateX(4px)}
.dec-list strong{color:var(--text)}
.dec-verdict{margin-top:8px;padding:14px 18px;background:rgba(255,214,10,.06);border:1px solid rgba(255,214,10,.25);border-radius:12px;text-align:center;font-family:var(--font-mono);font-size:11px;color:var(--olpa);letter-spacing:.05em;text-transform:uppercase;font-weight:700}
.decision-make .dec-verdict{background:rgba(139,92,246,.08);border-color:rgba(139,92,246,.3);color:#8b5cf6}
.decision-rule{max-width:900px;margin:44px auto 0;padding:26px 32px;background:var(--surface-2);border:1px solid var(--border);border-left:3px solid var(--olpa);border-radius:14px;display:flex;align-items:center;gap:22px}
@media(max-width:640px){.decision-rule{flex-direction:column;text-align:center}}
.dec-rule-icon{font-size:40px;flex-shrink:0}
.decision-rule p{font-size:.96rem;color:var(--text-2);line-height:1.7;margin:0}

/* ===== SCENARIOS LIST (Make top 5) ===== */
.scenarios-list{display:flex;flex-direction:column;gap:16px;max-width:1100px;margin:0 auto}
.scenario-row{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;padding:28px 32px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);transition:all .35s var(--ease)}
@media(max-width:768px){.scenario-row{grid-template-columns:1fr;gap:14px;padding:22px 22px}}
.scenario-row:hover{border-color:rgba(139,92,246,.3);transform:translateX(6px);background:linear-gradient(135deg,rgba(139,92,246,.03),var(--surface))}
.sc-num{font-family:var(--font-display);font-size:2.2rem;font-weight:700;color:transparent;-webkit-text-stroke:1.5px rgba(139,92,246,.4);line-height:1;width:50px}
.sc-body h3{font-family:var(--font-display);font-size:1.15rem;margin-bottom:6px;line-height:1.35}
.sc-body p{font-size:.9rem;color:var(--muted);line-height:1.55;margin:0}
.sc-stack{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:768px){.sc-stack{justify-content:flex-start}}
.sc-stack span{font-family:var(--font-mono);font-size:10px;padding:5px 11px;background:rgba(139,92,246,.08);border:1px solid rgba(139,92,246,.25);border-radius:999px;color:#8b5cf6;white-space:nowrap}

/* ===== PROVIDERS GRID (WhatsApp) ===== */
.providers-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;max-width:1200px;margin:0 auto}
@media(max-width:1024px){.providers-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.providers-grid{grid-template-columns:1fr}}
.provider-card{padding:30px 28px;display:flex;flex-direction:column;gap:12px;min-height:240px;border-radius:var(--r-lg)}
.provider-card .prov-name{font-family:var(--font-display);font-size:1.4rem;font-weight:700;background:linear-gradient(135deg,#25d366,var(--olpa));-webkit-background-clip:text;background-clip:text;color:transparent}
.provider-card .prov-tag{font-family:var(--font-mono);font-size:10px;color:var(--accent);text-transform:uppercase;letter-spacing:.15em;padding-bottom:10px;border-bottom:1px solid var(--border)}
.provider-card p{font-size:.88rem;color:var(--muted);line-height:1.6;flex:1;margin:0}
.provider-card .card-link{font-size:12px;color:var(--olpa);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em}

/* ===== CLOCK 24H (tareas programadas) ===== */
.clock-24{padding:0;overflow:hidden;max-width:480px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.25)!important}
.clock-head{padding:16px 22px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px}
.clock-dot-live{width:10px;height:10px;border-radius:50%;background:#22c55e;box-shadow:0 0 10px #22c55e;animation:pulse 2s infinite}
.clock-title{font-family:var(--font-mono);font-size:12px;color:var(--text-2)}
.clock-svg{width:100%;height:auto;display:block;padding:20px}
.clock-hand{transform-origin:200px 200px;animation:clockSpin 60s linear infinite}
@keyframes clockSpin{to{transform:rotate(360deg)}}
.clock-tasks circle{animation:clockPulse 2.5s ease-in-out infinite}
.clock-tasks circle:nth-child(2n){animation-delay:.4s}
.clock-tasks circle:nth-child(3n){animation-delay:.8s}
.clock-tasks circle:nth-child(5n){animation-delay:1.2s}
@keyframes clockPulse{0%,100%{opacity:.6}50%{opacity:1;filter:drop-shadow(0 0 8px currentColor)}}
.clock-legend{display:flex;justify-content:center;gap:22px;padding:14px 20px;background:rgba(255,255,255,.02);border-top:1px solid var(--border);flex-wrap:wrap}
.clock-legend>div{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.clock-legend .lg-d{width:8px;height:8px;border-radius:50%}

/* ===== TASKS TABLE (tareas programadas) ===== */
.tasks-table-wrap{max-width:1100px;margin:0 auto;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border);overflow:hidden;overflow-x:auto}
.tasks-table{width:100%;border-collapse:collapse;min-width:700px}
.tasks-table th,.tasks-table td{padding:18px 22px;text-align:left;border-bottom:1px solid var(--border);font-size:.9rem;color:var(--text-2);vertical-align:middle}
.tasks-table th{font-family:var(--font-display);font-size:.95rem;color:var(--text);background:rgba(255,255,255,.02);font-weight:600}
.tasks-table tbody tr{transition:background .25s}
.tasks-table tbody tr:hover{background:rgba(255,214,10,.03)}
.tasks-table tbody tr:last-child td{border-bottom:none}
.tk-hour{font-family:var(--font-mono);font-size:.85rem;color:var(--olpa);white-space:nowrap;font-weight:600}
.tk-name strong{color:var(--text);font-size:.95rem;display:block;margin-bottom:2px}
.tk-sub{font-family:var(--font-mono);font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}

/* ===== ANTES / DESPUES ===== */
.ad-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;max-width:1100px;margin:0 auto}
@media(max-width:900px){.ad-grid{grid-template-columns:1fr}}
.ad-col{padding:40px 36px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border);display:flex;flex-direction:column;gap:16px}
.ad-antes{border-color:rgba(248,113,113,.25);background:linear-gradient(180deg,rgba(248,113,113,.04),transparent)}
.ad-despues{border-color:rgba(34,197,94,.3);background:linear-gradient(180deg,rgba(34,197,94,.06),transparent);box-shadow:0 0 60px rgba(34,197,94,.08)}
.ad-label{font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:700}
.ad-antes .ad-label{color:#f87171}
.ad-despues .ad-label{color:#22c55e}
.ad-time{font-family:var(--font-display);font-size:1.4rem;color:var(--text);margin-bottom:6px}
.ad-list{list-style:none;display:flex;flex-direction:column;gap:11px;padding-top:14px;border-top:1px solid var(--border);flex:1}
.ad-list li{padding-left:22px;position:relative;font-size:.92rem;color:var(--text-2);line-height:1.55}
.ad-antes .ad-list li::before{content:'•';position:absolute;left:0;color:#f87171}
.ad-despues .ad-list li::before{content:'✓';position:absolute;left:0;color:#22c55e;font-weight:700}
.ad-total{margin-top:auto;padding:14px 18px;background:var(--bg-2);border-radius:12px;text-align:center;font-family:var(--font-display);font-weight:700;font-size:1rem;border:1px solid var(--border)}
.ad-antes .ad-total{color:#f87171;background:rgba(248,113,113,.06);border-color:rgba(248,113,113,.25)}
.ad-despues .ad-total{color:#22c55e;background:rgba(34,197,94,.08);border-color:rgba(34,197,94,.3)}

/* ==========================================================================
   PROCESOS CLUSTERS — visuales únicos
   ========================================================================== */

/* ===== BPMN flowchart (mejora-de-procesos) ===== */
.bpmn-mockup{padding:0;overflow:hidden;max-width:500px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.25)!important}
.bpmn-head{display:flex;align-items:center;gap:8px;padding:14px 18px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.bpmn-head .make-dot{width:12px;height:12px;border-radius:50%;background:#ff5f57}
.bpmn-title{margin-left:12px;font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.bpmn-canvas{position:relative;padding:20px;min-height:400px}
.bpmn-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.bpmn-flow{stroke-dashoffset:10;animation:dashFlow 3.5s linear infinite}
.bpmn-node{position:absolute;display:flex;flex-direction:column;align-items:center;gap:4px;z-index:2}
.bpmn-circle{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;border:3px solid var(--olpa);background:var(--surface-2);color:var(--olpa);box-shadow:0 0 20px rgba(255,214,10,.25)}
.bpmn-circle-start{border-color:#22c55e;color:#22c55e;box-shadow:0 0 20px rgba(34,197,94,.3)}
.bpmn-circle-end{border-color:#f87171;color:#f87171;box-shadow:0 0 20px rgba(248,113,113,.3)}
.bpmn-box{width:80px;padding:10px 8px;background:var(--surface);border:1px solid rgba(255,214,10,.35);border-radius:10px;text-align:center;font-family:var(--font-display);font-size:11px;font-weight:600;color:var(--text);box-shadow:0 8px 20px rgba(0,0,0,.3)}
.bpmn-box small{display:block;font-family:var(--font-mono);font-size:9px;color:var(--muted);font-weight:400;margin-top:3px}
.bpmn-task-alt{border-color:rgba(0,229,255,.35);box-shadow:0 0 18px rgba(0,229,255,.12)}
.bpmn-diamond{width:76px;height:76px;background:rgba(255,214,10,.08);border:2px solid var(--olpa);transform:rotate(45deg);display:flex;align-items:center;justify-content:center;box-shadow:0 0 20px rgba(255,214,10,.2)}
.bpmn-diamond::after{content:'¿Califica?';position:absolute;transform:rotate(-45deg);font-family:var(--font-display);font-size:11px;color:var(--olpa);font-weight:600}
.bpmn-label{font-family:var(--font-mono);font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.bpmn-footer{padding:12px 20px;background:rgba(255,214,10,.04);border-top:1px solid var(--border);font-size:10px;color:var(--muted);text-align:center;font-family:var(--font-mono)}

/* ===== ODOO DASHBOARD MOCKUP ===== */
.cluster-odoo-impl .odoo-mockup{padding:0;overflow:hidden;max-width:500px;margin:0 auto;border-radius:16px;background:#fff;border:1px solid rgba(255,214,10,.3);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.odoo-head{display:flex;align-items:center;gap:18px;padding:14px 20px;background:#714B67;border-bottom:1px solid rgba(0,0,0,.1)}
.odoo-logo{font-family:var(--font-display);font-weight:700;font-size:16px;color:#fff;letter-spacing:.02em}
.odoo-nav{display:flex;gap:6px;flex:1;overflow-x:auto}
.on-item{font-family:var(--font-display);font-size:11px;color:rgba(255,255,255,.75);padding:6px 10px;border-radius:6px;white-space:nowrap}
.on-item.on-active{background:rgba(255,255,255,.15);color:#fff}
.odoo-user{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px}
.odoo-body{padding:22px;background:#F7F7F7;color:#2c2c2c;display:flex;flex-direction:column;gap:18px}
.odoo-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.okpi{padding:14px 12px;background:#fff;border:1px solid #e5e5e5;border-radius:10px}
.okpi-label{font-size:10px;color:#888;text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px;font-weight:500}
.okpi-val{font-family:var(--font-display);font-size:1rem;font-weight:700;color:#2c2c2c;line-height:1.2}
.okpi-delta{font-size:10px;margin-top:4px;font-weight:600}
.okpi-delta.up{color:#22c55e}
.okpi-delta.down{color:#f87171}
.odoo-chart{padding:14px 16px;background:#fff;border:1px solid #e5e5e5;border-radius:10px}
.oc-label{font-size:11px;color:#888;margin-bottom:10px;font-weight:500}
.oc-bars{display:flex;align-items:flex-end;gap:8px;height:60px}
.oc-bar{flex:1;background:linear-gradient(180deg,#8e6395,#714B67);border-radius:4px 4px 0 0;transition:opacity .3s}
.oc-bar-active{background:linear-gradient(180deg,#FFD60A,#E6BC00)}
.odoo-list{padding:12px 14px;background:#fff;border:1px solid #e5e5e5;border-radius:10px;display:flex;flex-direction:column;gap:10px}
.ol-item{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid #f0f0f0}
.ol-item:last-child{border-bottom:none}
.ol-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.ol-dot.ok{background:#22c55e}
.ol-dot.mid{background:#FFD60A}
.ol-dot.new{background:#3b82f6}
.ol-main{flex:1;min-width:0}
.ol-title{font-size:12px;color:#2c2c2c;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ol-meta{font-size:10px;color:#888;margin-top:2px}
.ol-tag{font-family:var(--font-mono);font-size:9px;padding:3px 8px;background:#F7F7F7;border-radius:999px;color:#714B67;font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.odoo-footer{padding:12px 20px;background:rgba(255,214,10,.05);color:var(--muted);font-size:10px;text-align:center;font-family:var(--font-mono);border-top:1px solid var(--border)}

/* ===== KANBAN MOCKUP (CRM) ===== */
.kanban-mockup{padding:0;overflow:hidden;max-width:520px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(0,229,255,.25)!important}
.kanban-head{display:flex;align-items:center;gap:8px;padding:14px 18px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.kanban-title{margin-left:12px;font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.kanban-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:18px 16px;min-height:360px}
.kcol{display:flex;flex-direction:column;gap:8px;background:rgba(255,255,255,.02);border-radius:12px;padding:10px 8px;border:1px solid var(--border)}
.kcol-head{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;font-family:var(--font-mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;border-bottom:1px solid var(--border);margin-bottom:4px}
.kcol-head.kcol-new{color:var(--accent)}
.kcol-head.kcol-mid{color:var(--olpa)}
.kcol-head.kcol-won{color:#22c55e}
.kcol-num{background:rgba(255,255,255,.08);padding:2px 7px;border-radius:999px;font-size:9px}
.kcard{padding:10px 11px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;font-family:var(--font-mono);cursor:grab;transition:all .3s}
.kcard:hover{transform:translateY(-2px);border-color:rgba(255,214,10,.3)}
.kcard.kc-warm{border-color:rgba(255,214,10,.3);background:linear-gradient(135deg,rgba(255,214,10,.06),var(--surface-2))}
.kcard.kc-won{border-color:rgba(34,197,94,.3);background:linear-gradient(135deg,rgba(34,197,94,.06),var(--surface-2))}
.kc-top{display:flex;justify-content:space-between;align-items:baseline;gap:6px;margin-bottom:4px}
.kc-title{font-family:var(--font-display);font-size:11px;font-weight:600;color:var(--text)}
.kc-val{font-size:10px;color:var(--olpa);font-weight:700;white-space:nowrap}
.kc-meta{font-size:9px;color:var(--muted)}
.kanban-footer{padding:12px 20px;background:rgba(0,229,255,.03);border-top:1px solid var(--border);font-size:10px;color:var(--muted);text-align:center;font-family:var(--font-mono)}

/* ===== TRACE TIMELINE (trazabilidad) ===== */
.trace-timeline{padding:0;overflow:hidden;max-width:500px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(34,197,94,.3)!important}
.trace-head{display:flex;align-items:center;gap:14px;padding:18px 22px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.trace-qr{flex-shrink:0;padding:4px;background:#fff;border-radius:6px;display:flex;align-items:center;justify-content:center}
.trace-info{flex:1;min-width:0}
.trace-lot{font-family:var(--font-mono);font-size:11px;color:var(--olpa);font-weight:700;letter-spacing:.05em}
.trace-sku{font-family:var(--font-display);font-size:13px;color:var(--text);margin-top:3px}
.trace-steps{padding:22px 24px;display:flex;flex-direction:column;gap:18px;position:relative}
.trace-steps::before{content:'';position:absolute;left:32px;top:22px;bottom:22px;width:2px;background:linear-gradient(180deg,#22c55e 0%,#22c55e 50%,rgba(138,138,153,0.25) 50%,rgba(138,138,153,0.25) 100%)}
.tstep{display:flex;gap:16px;position:relative}
.tstep-dot{width:16px;height:16px;border-radius:50%;background:var(--surface-2);border:2px solid var(--muted);flex-shrink:0;position:relative;z-index:2;margin-top:4px}
.tstep-done .tstep-dot{background:#22c55e;border-color:#22c55e;box-shadow:0 0 12px rgba(34,197,94,.4)}
.tstep-active .tstep-dot{background:var(--olpa);border-color:var(--olpa);box-shadow:0 0 0 6px rgba(255,214,10,.2);animation:pulseTrace 2s ease-in-out infinite}
@keyframes pulseTrace{0%,100%{box-shadow:0 0 0 6px rgba(255,214,10,.2)}50%{box-shadow:0 0 0 10px rgba(255,214,10,.08)}}
.tstep-body{flex:1}
.tstep-title{font-family:var(--font-display);font-size:13px;font-weight:600;color:var(--text);margin-bottom:3px}
.tstep-done .tstep-title{color:#22c55e}
.tstep-active .tstep-title{color:var(--olpa)}
.tstep:not(.tstep-done):not(.tstep-active) .tstep-title{color:var(--muted)}
.tstep-meta{font-family:var(--font-mono);font-size:10px;color:var(--muted);line-height:1.5}
.trace-footer{padding:12px 20px;background:rgba(34,197,94,.04);border-top:1px solid var(--border);font-size:10px;color:var(--muted);text-align:center;font-family:var(--font-mono)}

/* ===== LADDER MOCKUP (coaching comercial) ===== */
.ladder-mockup{padding:0;overflow:hidden;max-width:500px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.25)!important}
.ladder-head{display:flex;align-items:center;gap:8px;padding:14px 18px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.ladder-title{margin-left:12px;font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.ladder-body{padding:22px 24px;display:flex;flex-direction:column;gap:8px}
.lstep{display:flex;gap:16px;align-items:center;padding:14px 16px;background:var(--surface);border:1px solid var(--border);border-radius:12px;position:relative;transition:all .3s}
.lstep-1{margin-left:48px}
.lstep-2{margin-left:36px}
.lstep-3{margin-left:24px}
.lstep-4{margin-left:12px}
.lstep-5{margin-left:0}
.lstep-badge{width:38px;height:38px;border-radius:50%;background:var(--surface-2);border:2px solid var(--border-strong);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:16px;color:var(--muted);flex-shrink:0}
.lstep-5 .lstep-badge{background:rgba(34,197,94,.12);border-color:#22c55e;color:#22c55e;box-shadow:0 0 16px rgba(34,197,94,.3)}
.lstep-4.lstep-current .lstep-badge{background:rgba(255,214,10,.14);border-color:var(--olpa);color:var(--olpa);box-shadow:0 0 16px rgba(255,214,10,.3)}
.lstep-info{flex:1}
.lstep-name{font-family:var(--font-display);font-size:13px;font-weight:600;color:var(--text);margin-bottom:2px}
.lstep-desc{font-size:10px;color:var(--muted);font-family:var(--font-mono);line-height:1.4}
.lstep-mark{position:absolute;right:-8px;top:50%;transform:translateY(-50%);font-family:var(--font-mono);font-size:9px;color:var(--olpa);background:rgba(255,214,10,.15);padding:4px 10px;border-radius:999px;border:1px solid rgba(255,214,10,.4);letter-spacing:.05em;white-space:nowrap;box-shadow:0 0 20px rgba(255,214,10,.25);animation:pulseTag 2s ease-in-out infinite}
@keyframes pulseTag{0%,100%{transform:translateY(-50%) scale(1)}50%{transform:translateY(-50%) scale(1.05)}}
.lstep.lstep-current{border-color:rgba(255,214,10,.4);background:linear-gradient(135deg,rgba(255,214,10,.06),var(--surface));box-shadow:0 0 30px rgba(255,214,10,.1)}
.ladder-footer{padding:12px 20px;background:rgba(255,214,10,.04);border-top:1px solid var(--border);font-size:10px;color:var(--olpa);text-align:center;font-family:var(--font-mono)}

/* ===== ODOO extra: context + apps + localization + sectors ===== */
.context-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;max-width:1200px;margin:0 auto}
@media(max-width:1024px){.context-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.context-grid{grid-template-columns:1fr}}
.ctx-box{padding:30px 26px;display:flex;flex-direction:column;gap:10px;border-radius:var(--r-lg)}
.ctx-box .ctx-n{font-family:var(--font-display);font-size:2.4rem;font-weight:700;background:linear-gradient(135deg,var(--olpa),var(--olpa-soft));-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.ctx-box .ctx-l{font-family:var(--font-mono);font-size:10px;color:var(--accent);text-transform:uppercase;letter-spacing:.15em;padding-bottom:12px;border-bottom:1px solid var(--border)}
.ctx-box p{font-size:.88rem;color:var(--muted);line-height:1.6;margin:0}

.apps-group{margin-bottom:40px;padding:32px 32px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);transition:all .35s}
.apps-group:hover{border-color:rgba(255,214,10,.25);background:linear-gradient(180deg,rgba(255,214,10,.03),var(--surface))}
.apps-group-head{display:flex;align-items:center;gap:22px;margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--border)}
.apps-group-icon{width:56px;height:56px;border-radius:14px;background:rgba(255,214,10,.1);border:1px solid rgba(255,214,10,.3);display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0}
.apps-group-head h3{font-family:var(--font-display);font-size:1.4rem;margin-bottom:4px}
.apps-group-head p{font-size:.9rem;color:var(--muted);margin:0}
.apps-list{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
@media(max-width:900px){.apps-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.apps-list{grid-template-columns:1fr}}
.app-chip{padding:14px 16px;background:var(--bg-2);border:1px solid var(--border);border-radius:10px;transition:all .3s;display:flex;flex-direction:column;gap:3px}
.app-chip:hover{border-color:var(--olpa);background:rgba(255,214,10,.05);transform:translateY(-2px)}
.app-chip strong{font-family:var(--font-display);font-size:.95rem;color:var(--text)}
.app-chip span{font-size:.78rem;color:var(--muted);font-family:var(--font-mono)}

.localization-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1200px;margin:0 auto}
@media(max-width:1024px){.localization-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.localization-grid{grid-template-columns:1fr}}
.loc-card{padding:30px 28px;display:flex;flex-direction:column;gap:10px;border-radius:var(--r-lg)}
.loc-card .loc-icon{font-size:32px;margin-bottom:6px}
.loc-card h4{font-family:var(--font-display);font-size:1.1rem;line-height:1.3}
.loc-card p{font-size:.88rem;color:var(--muted);line-height:1.55;margin:0}

.custom-sectors{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1300px;margin:0 auto}
@media(max-width:1024px){.custom-sectors{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.custom-sectors{grid-template-columns:1fr}}
.sector-card{padding:36px 32px;display:flex;flex-direction:column;gap:12px;position:relative;border-radius:var(--r-lg);min-height:440px}
.sector-card .sector-icon{font-size:42px;line-height:1}
.sector-card .sector-tag{position:absolute;top:30px;right:30px;font-family:var(--font-mono);font-size:9px;color:var(--accent);background:rgba(0,229,255,.08);padding:5px 11px;border-radius:999px;letter-spacing:.15em;font-weight:700;border:1px solid rgba(0,229,255,.25)}
.sector-card h3{font-family:var(--font-display);font-size:1.3rem;margin-top:6px}
.sector-card>p{font-size:.88rem;color:var(--muted);margin:0}
.sector-features{list-style:none;display:flex;flex-direction:column;gap:10px;padding-top:16px;margin-top:6px;border-top:1px solid var(--border);flex:1}
.sector-features li{display:flex;gap:10px;font-size:.86rem;color:var(--text-2);line-height:1.5}
.sector-features li span{color:var(--olpa);font-weight:700;flex-shrink:0}
.custom-note{max-width:900px;margin:50px auto 0;padding:24px 30px;background:linear-gradient(135deg,rgba(255,214,10,.08),rgba(0,229,255,.04));border:1px solid rgba(255,214,10,.3);border-radius:14px;text-align:center}
.custom-note p{font-size:1rem;color:var(--text-2);line-height:1.7;margin:0}

/* ===== CRM PROFILES (5 perfiles detallados) ===== */
.crm-profile{padding:0;overflow:hidden;border-radius:var(--r-xl);margin-bottom:32px}
.crm-profile-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:0}
@media(max-width:1024px){.crm-profile-grid{grid-template-columns:1fr}}
.crm-left{padding:44px 44px;border-right:1px solid var(--border)}
@media(max-width:1024px){.crm-left{border-right:none;border-bottom:1px solid var(--border);padding:36px 28px}}
.crm-tag{font-family:var(--font-mono);font-size:11px;color:var(--accent);letter-spacing:.15em;text-transform:uppercase;margin-bottom:14px;padding:6px 14px;background:rgba(0,229,255,.06);border:1px solid rgba(0,229,255,.25);border-radius:999px;display:inline-block}
.crm-left h3{font-family:var(--font-display);font-size:clamp(1.6rem,3.2vw,2.2rem);margin:0 0 10px;background:linear-gradient(135deg,var(--olpa),var(--olpa-soft));-webkit-background-clip:text;background-clip:text;color:transparent}
.crm-origin{font-family:var(--font-mono);font-size:11px;color:var(--muted);margin-bottom:18px;text-transform:uppercase;letter-spacing:.05em}
.crm-desc{font-size:.96rem;color:var(--text-2);line-height:1.65;margin-bottom:18px}
.crm-ideal{padding:16px 20px;background:rgba(255,214,10,.06);border:1px solid rgba(255,214,10,.25);border-left:3px solid var(--olpa);border-radius:12px;font-size:.92rem;color:var(--text-2);line-height:1.6}
.crm-ideal strong{color:var(--olpa)}
.crm-right{padding:44px 40px;background:linear-gradient(180deg,rgba(255,214,10,.03),rgba(0,229,255,.02))}
@media(max-width:1024px){.crm-right{padding:32px 28px}}
.crm-right h5{font-family:var(--font-mono);font-size:11px;color:var(--accent);letter-spacing:.15em;text-transform:uppercase;margin-bottom:18px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.crm-features{list-style:none;display:flex;flex-direction:column;gap:11px}
.crm-features li{display:flex;gap:12px;font-size:.88rem;color:var(--text-2);line-height:1.5;align-items:flex-start}
.crm-features li span{flex-shrink:0;width:18px;height:18px;border-radius:50%;background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.4);color:#22c55e;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;margin-top:1px}
.crm-features strong{color:var(--text)}

/* ===== METHODS GRID (mejora procesos + coaching) ===== */
.methods-grid,.sales-methods-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1300px;margin:0 auto}
@media(max-width:1024px){.methods-grid,.sales-methods-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.methods-grid,.sales-methods-grid{grid-template-columns:1fr}}
.method-card,.sm-card{padding:34px 30px;display:flex;flex-direction:column;gap:12px;border-radius:var(--r-lg);min-height:380px}
.method-tag,.sm-tag{font-family:var(--font-mono);font-size:9px;color:var(--accent);letter-spacing:.18em;text-transform:uppercase;padding:5px 11px;background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.25);border-radius:999px;font-weight:700;width:fit-content}
.method-card h3,.sm-card h3{font-family:var(--font-display);font-size:1.4rem;background:linear-gradient(135deg,var(--olpa),var(--olpa-soft));-webkit-background-clip:text;background-clip:text;color:transparent}
.method-origin,.sm-origin{font-family:var(--font-mono);font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;padding-bottom:10px;border-bottom:1px solid var(--border)}
.method-card>p,.sm-card>p{font-size:.9rem;color:var(--text-2);line-height:1.6;margin:0}
.method-use,.sm-when{padding:12px 16px;background:var(--bg-2);border:1px solid var(--border);border-left:3px solid var(--olpa);border-radius:10px;font-size:.85rem;color:var(--text-2);line-height:1.55;margin-top:auto}
.method-use strong,.sm-when strong{color:var(--olpa)}
.method-tools{font-family:var(--font-mono);font-size:10px;color:var(--muted);padding-top:8px;border-top:1px dashed var(--border)}
.methods-note{max-width:900px;margin:50px auto 0;padding:24px 30px;background:linear-gradient(135deg,rgba(255,214,10,.06),rgba(0,229,255,.04));border:1px solid rgba(255,214,10,.3);border-radius:14px;text-align:center}
.methods-note p{font-size:.96rem;color:var(--text-2);line-height:1.7;margin:0}

/* ===== INDUSTRY PROCESSES (mejora procesos) ===== */
.industry-processes{display:flex;flex-direction:column;gap:18px;max-width:1100px;margin:0 auto}
.ip-row{display:grid;grid-template-columns:240px 1fr;gap:30px;align-items:start;padding:30px 32px;background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);transition:all .35s}
@media(max-width:768px){.ip-row{grid-template-columns:1fr;gap:18px}}
.ip-row:hover{border-color:rgba(255,214,10,.3);transform:translateX(4px)}
.ip-head{display:flex;align-items:center;gap:16px}
.ip-head .ip-icon{font-size:36px;line-height:1}
.ip-head h3{font-family:var(--font-display);font-size:1.25rem;margin:0}
.ip-list{display:flex;flex-direction:column;gap:8px}
.ip-list span{padding-left:18px;position:relative;font-size:.9rem;color:var(--text-2);line-height:1.55}
.ip-list span::before{content:'→';position:absolute;left:0;color:var(--olpa);font-weight:700}

/* ===== REGULATION GRID (trazabilidad) ===== */
.reg-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:1200px;margin:0 auto}
@media(max-width:900px){.reg-grid{grid-template-columns:1fr}}
.reg-card{padding:36px 34px;display:flex;flex-direction:column;gap:14px;border-radius:var(--r-lg)}
.reg-logo{font-family:var(--font-display);font-size:1.4rem;font-weight:700;color:var(--olpa);padding:8px 16px;background:rgba(255,214,10,.08);border:1px solid rgba(255,214,10,.3);border-radius:10px;width:fit-content;letter-spacing:.05em}
.reg-card h3{font-family:var(--font-display);font-size:1.3rem;margin:0}
.reg-card>p{font-size:.92rem;color:var(--text-2);line-height:1.6;margin:0}
.reg-items{list-style:none;display:flex;flex-direction:column;gap:9px;padding-top:14px;border-top:1px solid var(--border)}
.reg-items li{padding-left:20px;position:relative;font-size:.86rem;color:var(--muted);line-height:1.5}
.reg-items li::before{content:'▸';position:absolute;left:0;color:var(--olpa)}

/* ===== TECH DEPTH GRID (trazabilidad) ===== */
.tech-depth-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1300px;margin:0 auto}
@media(max-width:1024px){.tech-depth-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.tech-depth-grid{grid-template-columns:1fr}}
.td-card{padding:32px 30px;display:flex;flex-direction:column;gap:14px;border-radius:var(--r-lg)}
.td-head{display:flex;align-items:center;gap:16px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.td-icon{width:50px;height:50px;border-radius:12px;background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.25);display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--accent);font-family:var(--font-mono);font-weight:700;flex-shrink:0}
.td-head h3{font-family:var(--font-display);font-size:1.2rem;margin:0 0 4px}
.td-tag{font-family:var(--font-mono);font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.td-card>p{font-size:.88rem;color:var(--text-2);line-height:1.6;margin:0}
.td-pros,.td-cons{display:flex;flex-direction:column;gap:5px;padding:14px 16px;border-radius:10px}
.td-pros{background:rgba(34,197,94,.05);border:1px solid rgba(34,197,94,.2)}
.td-cons{background:rgba(248,113,113,.04);border:1px solid rgba(248,113,113,.2)}
.td-pros strong{font-family:var(--font-mono);font-size:10px;color:#22c55e;letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px}
.td-cons strong{font-family:var(--font-mono);font-size:10px;color:#f87171;letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px}
.td-pros span,.td-cons span{font-size:.82rem;color:var(--text-2);padding-left:14px;position:relative;line-height:1.5}
.td-pros span::before{content:'+';position:absolute;left:0;color:#22c55e;font-weight:700}
.td-cons span::before{content:'−';position:absolute;left:0;color:#f87171;font-weight:700}

/* ==========================================================================
   DESARROLLO CLUSTERS — mockups únicos
   ========================================================================== */

/* ===== iPHONE MOCKUP (apps-a-medida) ===== */
.iphone-mockup{width:100%;max-width:360px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:14px}
.iphone-frame{width:290px;height:590px;background:#0a0a12;border-radius:46px;padding:10px;position:relative;border:10px solid #1a1a26;box-shadow:0 30px 80px rgba(0,0,0,.6),inset 0 0 0 2px rgba(255,255,255,.04)}
.iphone-notch{position:absolute;top:12px;left:50%;transform:translateX(-50%);width:110px;height:28px;background:#000;border-radius:14px;z-index:5}
.iphone-screen{width:100%;height:100%;background:linear-gradient(180deg,#10101a,#07070c);border-radius:36px;overflow:hidden;padding:38px 18px 14px;display:flex;flex-direction:column}
.iphone-status{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:10px;color:var(--text);padding:0 4px 12px}
.iphone-appname{display:flex;align-items:center;gap:12px;padding:10px 4px 18px}
.appname-avatar{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--olpa),var(--olpa-deep));display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:13px;color:#000}
.app-title{font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--text)}
.app-sub{font-family:var(--font-mono);font-size:9px;color:var(--muted);margin-top:1px}
.iphone-cards{display:flex;flex-direction:column;gap:8px;flex:1}
.app-card{padding:11px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:12px;display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.app-card-done{opacity:.6}
.app-card-now{border-color:rgba(255,214,10,.4);background:linear-gradient(135deg,rgba(255,214,10,.06),var(--surface-2));box-shadow:0 0 16px rgba(255,214,10,.15)}
.appc-left{flex:1;min-width:0}
.appc-status{font-family:var(--font-mono);font-size:8px;color:#22c55e;text-transform:uppercase;letter-spacing:.1em;margin-bottom:3px}
.appc-running{color:var(--olpa)}
.appc-pend{color:var(--muted)}
.appc-addr{font-size:11px;color:var(--text);font-weight:600;line-height:1.2}
.appc-cust{font-size:9px;color:var(--muted);margin-top:2px}
.appc-time{font-family:var(--font-mono);font-size:9px;color:var(--olpa);flex-shrink:0}
.iphone-tabs{display:flex;justify-content:space-around;padding:10px 0 0;margin-top:10px;border-top:1px solid var(--border)}
.app-tab{font-family:var(--font-mono);font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.app-tab-active{color:var(--olpa)}
.iphone-caption{font-family:var(--font-mono);font-size:10px;color:var(--muted);text-align:center}

/* ===== BROWSER MOCKUP (desarrollo-web) ===== */
.browser-mockup{padding:0;overflow:hidden;max-width:520px;margin:0 auto;border-radius:18px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(0,229,255,.25)!important}
.browser-head{display:flex;align-items:center;gap:8px;padding:12px 14px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.browser-bar{flex:1;margin-left:12px;display:flex;align-items:center;gap:8px;padding:6px 14px;background:var(--surface);border:1px solid var(--border);border-radius:999px;font-family:var(--font-mono);font-size:11px;color:var(--text-2)}
.br-lock{font-size:10px;opacity:.7}
.br-url{color:var(--olpa)}
.browser-body{padding:20px 22px;display:flex;flex-direction:column;gap:18px;background:linear-gradient(180deg,rgba(255,214,10,.02),transparent)}
.browser-nav{display:flex;align-items:center;justify-content:space-between;padding-bottom:14px;border-bottom:1px solid var(--border)}
.bn-logo{font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--olpa)}
.bn-items{display:flex;gap:14px}
.bn-items span{font-size:10px;color:var(--text-2)}
.bn-cta{font-size:10px;padding:5px 12px;background:var(--olpa);color:#000;border-radius:999px;font-weight:700}
.browser-hero{padding:14px 0 18px;border-bottom:1px solid var(--border)}
.bh-badge{font-family:var(--font-mono);font-size:8px;color:var(--olpa);padding:4px 10px;background:rgba(255,214,10,.1);border:1px solid rgba(255,214,10,.3);border-radius:999px;display:inline-block;letter-spacing:.1em;margin-bottom:10px}
.bh-title{font-family:var(--font-display);font-size:1.15rem;font-weight:700;color:var(--text);line-height:1.2}
.bh-title span{color:var(--olpa)}
.bh-btns{display:flex;gap:8px;margin-top:12px}
.bh-btn{font-size:9px;padding:6px 12px;border-radius:999px;font-weight:700;font-family:var(--font-mono);letter-spacing:.05em}
.bh-btn-prim{background:var(--olpa);color:#000}
.bh-btn:not(.bh-btn-prim){border:1px solid var(--border-strong);color:var(--text-2)}
.browser-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding-top:10px}
.bm-item{text-align:center;padding:10px 6px;background:rgba(34,197,94,.06);border:1px solid rgba(34,197,94,.25);border-radius:10px}
.bm-n{font-family:var(--font-display);font-weight:700;font-size:1.4rem;color:#22c55e;line-height:1}
.bm-l{font-family:var(--font-mono);font-size:8px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-top:3px}

/* ===== WP ADMIN MOCKUP ===== */
.cluster-wp-dev .wp-mockup,.clusters-wordpress .wp-mockup{padding:0;overflow:hidden;max-width:520px;margin:0 auto;border-radius:14px;background:#1e1e1e;border:1px solid rgba(33,117,155,.4);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.wp-head{display:flex;align-items:center;gap:14px;padding:10px 16px;background:#23282d;border-bottom:1px solid #1a1a1a}
.wp-logo{width:28px;height:28px;border-radius:4px;background:#21759b;display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--font-display);font-weight:700;font-size:15px}
.wp-title{flex:1;font-family:var(--font-display);font-size:13px;color:#eee}
.wp-user{font-size:11px;color:#ccc}
.wp-body{display:grid;grid-template-columns:130px 1fr;min-height:320px}
.wp-side{background:#23282d;border-right:1px solid #1a1a1a;padding:10px 0}
.wp-menu{padding:8px 14px;font-size:11px;color:#b4b9be;font-family:var(--font-body);cursor:pointer;transition:all .2s}
.wp-menu:hover{background:#191e23;color:var(--olpa)}
.wp-menu-active{background:#0073aa;color:#fff}
.wp-main{padding:18px 22px;background:#f1f1f1;color:#2c2c2c;display:flex;flex-direction:column;gap:14px}
.wp-kpi-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.wp-kpi{padding:12px 8px;background:#fff;border:1px solid #ddd;border-radius:8px;text-align:center}
.wp-kn{font-family:var(--font-display);font-size:1.6rem;font-weight:700;color:#22c55e;line-height:1}
.wp-kl{font-size:9px;color:#888;margin-top:3px;text-transform:uppercase;letter-spacing:.05em;font-family:var(--font-mono)}
.wp-chart{padding:10px 12px;background:#fff;border:1px solid #ddd;border-radius:8px}
.wpc-label{font-size:9px;color:#888;margin-bottom:8px;font-family:var(--font-mono);text-transform:uppercase}
.wpc-bars{display:flex;align-items:flex-end;gap:6px;height:40px}
.wpc-bar{flex:1;background:linear-gradient(180deg,#0073aa,#005177);border-radius:3px 3px 0 0}
.wpc-bar-active{background:linear-gradient(180deg,#FFD60A,#E6BC00)}
.wp-rows{padding:10px 12px;background:#fff;border:1px solid #ddd;border-radius:8px;display:flex;flex-direction:column;gap:8px}
.wp-row{display:flex;align-items:center;gap:8px;padding:4px 0;border-bottom:1px solid #f0f0f0;font-size:10px;color:#2c2c2c}
.wp-row:last-child{border:none}
.wp-row div{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wp-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.wp-dot.ok{background:#22c55e}.wp-dot.mid{background:#FFD60A}.wp-dot.new{background:#3b82f6}
.wp-meta{font-family:var(--font-mono);font-size:9px;color:#888}
.wp-footer{padding:10px 16px;background:#0073aa;color:#fff;font-size:10px;text-align:center;font-family:var(--font-mono)}

/* ===== SHOPIFY PRODUCT MOCKUP ===== */
.shop-mockup{padding:0;overflow:hidden;max-width:520px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(150,191,72,.3)!important}
.shop-head{display:flex;align-items:center;gap:8px;padding:10px 14px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.shop-bar{flex:1;margin-left:10px;padding:5px 12px;background:var(--surface);border-radius:6px;font-family:var(--font-mono);font-size:10px;color:var(--muted)}
.shop-body{padding:16px 18px;display:flex;flex-direction:column;gap:14px;background:linear-gradient(180deg,rgba(150,191,72,.03),transparent)}
.shop-nav{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid var(--border)}
.sn-logo{font-family:var(--font-display);font-weight:800;font-size:14px;letter-spacing:.1em;color:var(--text)}
.sn-menu{display:flex;gap:12px}
.sn-menu span{font-size:10px;color:var(--text-2);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.05em}
.sn-cart{font-size:10px;color:var(--olpa);font-family:var(--font-mono)}
.shop-product{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.sp-img{display:flex;flex-direction:column;gap:6px}
.sp-img-main{aspect-ratio:1;background:linear-gradient(135deg,#3a3a4a,#222);border-radius:8px;position:relative;overflow:hidden}
.sp-img-main::after{content:'';position:absolute;inset:30% 25%;background:linear-gradient(135deg,#888,#555);border-radius:50%;opacity:.4}
.sp-thumbs{display:flex;gap:4px}
.sp-thumb{flex:1;aspect-ratio:1;background:#2a2a36;border-radius:5px;border:1px solid var(--border)}
.sp-thumb-active{border-color:var(--olpa)}
.sp-info{display:flex;flex-direction:column;gap:8px}
.sp-brand{font-family:var(--font-mono);font-size:9px;color:var(--accent);text-transform:uppercase;letter-spacing:.1em}
.sp-title{font-family:var(--font-display);font-size:.9rem;color:var(--text);font-weight:600;line-height:1.3}
.sp-rating{font-size:9px;color:var(--olpa)}
.sp-rating span{color:var(--muted);margin-left:4px}
.sp-price{font-family:var(--font-display);font-size:1.3rem;font-weight:700;color:var(--text);line-height:1}
.sp-price small{font-size:.7rem;color:var(--muted)}
.sp-variants{display:flex;gap:4px;margin-top:4px}
.sp-var{width:22px;height:22px;border:1px solid var(--border-strong);border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:9px;font-family:var(--font-mono);color:var(--text-2)}
.sp-var-active{border-color:var(--olpa);background:rgba(255,214,10,.1);color:var(--olpa)}
.sp-btn-add{margin-top:4px;padding:8px 0;background:var(--olpa);color:#000;text-align:center;font-size:10px;font-weight:700;border-radius:6px;font-family:var(--font-display)}
.sp-btn-buy{padding:8px 0;background:var(--text);color:#000;text-align:center;font-size:10px;font-weight:700;border-radius:6px;font-family:var(--font-display)}

/* ===== TIENDANUBE CATALOG MOCKUP ===== */
.cluster-tn-dev .tn-mockup,.clusters-tiendanube .tn-mockup{padding:0;overflow:hidden;max-width:520px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95);border:1px solid rgba(46,125,215,.3)}
.tn-head{display:flex;align-items:center;gap:8px;padding:10px 14px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.tn-bar{flex:1;margin-left:10px;padding:5px 12px;background:var(--surface);border-radius:6px;font-family:var(--font-mono);font-size:10px;color:var(--muted)}
.tn-body{padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.tn-nav{display:flex;align-items:center;justify-content:space-between;padding-bottom:10px;border-bottom:1px solid var(--border)}
.tn-logo{font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:.08em;color:#2e7dd7}
.tn-menu{display:flex;gap:12px}
.tn-menu span{font-size:10px;color:var(--text-2);font-family:var(--font-mono);text-transform:uppercase}
.tn-cart{font-size:10px;color:var(--olpa);font-family:var(--font-mono)}
.tn-cat-head{display:flex;justify-content:space-between;align-items:baseline}
.tn-cat-title{font-family:var(--font-display);font-size:.95rem;color:var(--text);font-weight:700}
.tn-cat-filter{font-family:var(--font-mono);font-size:9px;color:var(--muted)}
.tn-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.tn-prod{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.tn-img{aspect-ratio:1;background:linear-gradient(135deg,#2a5a8a,#1a3a5a)}
.tn-img-2{background:linear-gradient(135deg,#8a5a2a,#5a3a1a)}
.tn-img-3{background:linear-gradient(135deg,#5a8a5a,#3a5a3a)}
.tn-img-4{background:linear-gradient(135deg,#8a2a5a,#5a1a3a)}
.tn-prod .tn-title{padding:6px 10px 0;font-size:10px;color:var(--text);font-family:var(--font-display);font-weight:600;line-height:1.3}
.tn-prod .tn-price{padding:3px 10px 10px;font-size:11px;color:var(--olpa);font-family:var(--font-display);font-weight:700}
.tn-prod .tn-price small{font-size:8px;color:var(--muted);font-weight:400;display:block;margin-top:2px}

/* ===== LIGHTHOUSE SCORE MOCKUP ===== */
.lh-mockup{padding:30px 32px;max-width:480px;margin:0 auto;border-radius:20px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(34,197,94,.3)!important;display:flex;flex-direction:column;gap:20px}
.lh-head{display:flex;flex-direction:column;gap:4px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.lh-tag{font-family:var(--font-mono);font-size:10px;color:#22c55e;letter-spacing:.15em;font-weight:700}
.lh-url{font-family:var(--font-mono);font-size:13px;color:var(--text)}
.lh-scores{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.lh-score{text-align:center;position:relative}
.lh-ring{width:72px;height:72px;margin:0 auto}
.lh-num{font-family:var(--font-display);font-weight:700;font-size:1.4rem;color:#22c55e;position:absolute;top:26px;left:0;right:0}
.lh-lbl{font-family:var(--font-mono);font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin-top:6px}
.lh-vitals{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding-top:16px;border-top:1px solid var(--border)}
.lh-vital{text-align:center;padding:10px 6px;background:rgba(34,197,94,.05);border:1px solid rgba(34,197,94,.2);border-radius:10px}
.lhv-k{font-family:var(--font-mono);font-size:9px;color:var(--muted);text-transform:uppercase}
.lhv-v{font-family:var(--font-display);font-size:1.1rem;color:#22c55e;font-weight:700;margin-top:3px}

/* ===== BRAND BOOK MOCKUP ===== */
.brand-mockup{padding:0;overflow:hidden;max-width:460px;margin:0 auto;border-radius:18px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.3)!important}
.brand-head{padding:18px 22px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.brand-title{font-family:var(--font-display);font-weight:700;font-size:16px;color:var(--olpa);letter-spacing:.1em}
.brand-sub{font-family:var(--font-mono);font-size:10px;color:var(--muted);margin-top:2px}
.brand-body{padding:22px;display:flex;flex-direction:column;gap:20px}
.brand-section{display:flex;flex-direction:column;gap:10px}
.bs-label{font-family:var(--font-mono);font-size:9px;color:var(--accent);letter-spacing:.18em;text-transform:uppercase;padding-bottom:8px;border-bottom:1px dashed var(--border)}
.brand-logo{display:flex;align-items:center;gap:16px;padding:16px;background:var(--surface-2);border-radius:12px}
.bl-shape{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--olpa),var(--olpa-deep));position:relative}
.bl-shape::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:20px;border:3px solid #000;border-radius:50%;border-right-color:transparent}
.bl-name{font-family:var(--font-display);font-size:1.3rem;font-weight:700;color:var(--text);letter-spacing:.02em}
.brand-palette{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.bp-color{aspect-ratio:1;border-radius:10px;display:flex;align-items:flex-end;padding:8px;font-family:var(--font-mono);font-size:9px;font-weight:700}
.bp-1{background:#FFD60A;color:#000}
.bp-2{background:#00E5FF;color:#000}
.bp-3{background:#0A0A12;color:#FFD60A;border:1px solid var(--border)}
.bp-4{background:#F5F5F7;color:#000}
.brand-type{display:flex;align-items:center;gap:16px;padding:16px;background:var(--surface-2);border-radius:12px}
.bt-big{font-family:var(--font-display);font-size:3rem;font-weight:700;color:var(--olpa);line-height:.9}
.bt-info{flex:1}
.bt-name{font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--text)}
.bt-sample{font-size:10px;color:var(--muted);font-family:var(--font-mono);margin-top:2px}

/* ===== USER JOURNEY MOCKUP (UX) ===== */
.journey-mockup{padding:0;overflow:hidden;max-width:500px;margin:0 auto;border-radius:18px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(0,229,255,.3)!important}
.j-head{display:flex;align-items:center;gap:8px;padding:12px 16px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.j-title{margin-left:12px;font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.j-canvas{position:relative;padding:14px;min-height:340px}
.j-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.j-flow{stroke-dashoffset:10;animation:dashFlow 3s linear infinite;stroke-dasharray:4 4}
.j-screen{position:absolute;width:70px;padding:8px 6px;background:var(--surface-2);border:1px solid var(--border-strong);border-radius:8px;display:flex;flex-direction:column;gap:4px;z-index:2}
.js-lbl{font-family:var(--font-mono);font-size:8px;color:var(--accent);text-transform:uppercase;text-align:center;padding-bottom:4px;border-bottom:1px dashed var(--border)}
.js-line{height:2px;background:var(--muted);border-radius:2px;opacity:.5}
.js-line.short{width:60%}
.js-shape{height:14px;background:linear-gradient(135deg,var(--olpa),var(--olpa-deep));border-radius:3px;opacity:.7}
.js-btn{height:6px;background:var(--olpa);border-radius:3px;margin-top:2px}
.js-circle{width:14px;height:14px;border-radius:50%;background:var(--accent);margin:0 auto;opacity:.7}
.js-check{width:8px;height:8px;border-radius:50%;background:#22c55e;align-self:flex-end}
.js-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.js-grid div{height:6px;background:var(--accent);opacity:.4;border-radius:1px}
.j-s1{top:30px;left:10px}
.j-s2{top:30px;left:160px}
.j-s3{top:30px;left:310px}
.j-s4{top:150px;left:310px}
.j-s5{top:150px;left:160px}
.j-s6{top:150px;left:10px}
.j-footer{padding:12px 20px;background:rgba(0,229,255,.04);border-top:1px solid var(--border);font-size:10px;color:var(--muted);text-align:center;font-family:var(--font-mono)}

/* ===== STACKS GRID (desarrollo-web) ===== */
.stacks-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1300px;margin:0 auto}
@media(max-width:1024px){.stacks-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.stacks-grid{grid-template-columns:1fr}}
.stack-item-card{padding:32px 30px;display:flex;flex-direction:column;gap:12px;min-height:300px;border-radius:var(--r-lg);text-decoration:none;transition:all .3s}
.stack-item-card:hover{transform:translateY(-4px)}
.stack-item-card .si-tag{font-family:var(--font-mono);font-size:10px;color:var(--accent);text-transform:uppercase;letter-spacing:.15em;padding:5px 12px;background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.25);border-radius:999px;width:fit-content;font-weight:700}
.stack-item-card h3{font-family:var(--font-display);font-size:1.25rem;margin:0;color:var(--text)}
.stack-item-card>p{font-size:.9rem;color:var(--text-2);line-height:1.55;margin:0;flex:1}
.stack-item-card .si-when{padding:12px 14px;background:var(--bg-2);border:1px solid var(--border);border-left:3px solid var(--olpa);border-radius:10px;font-size:.82rem;color:var(--muted);line-height:1.5}
.stack-item-card .si-when strong{color:var(--olpa)}
.stack-item-card .si-link{font-family:var(--font-mono);font-size:11px;color:var(--olpa);text-transform:uppercase;letter-spacing:.1em;margin-top:auto}

/* ===== PERF GRID (sitios a medida) ===== */
.perf-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;max-width:1100px;margin:0 auto}
@media(max-width:900px){.perf-grid{grid-template-columns:1fr}}
.perf-card{padding:32px 30px;display:flex;flex-direction:column;gap:12px;border-radius:var(--r-lg)}
.perf-label{font-family:var(--font-mono);font-size:10px;color:var(--accent);letter-spacing:.18em;text-transform:uppercase;font-weight:700}
.perf-card h3{font-family:var(--font-display);font-size:1.25rem;margin:0 0 8px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.perf-list{list-style:none;display:flex;flex-direction:column;gap:9px}
.perf-list li{padding-left:20px;position:relative;font-size:.88rem;color:var(--text-2);line-height:1.55}
.perf-list li::before{content:'✓';position:absolute;left:0;color:#22c55e;font-weight:700}
.perf-list strong{color:var(--olpa)}

/* ===== PLUGINS GRID (WordPress) ===== */
.plugins-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:1300px;margin:0 auto}
@media(max-width:1100px){.plugins-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.plugins-grid{grid-template-columns:1fr}}
.plugin-card{padding:28px 26px;display:flex;flex-direction:column;gap:10px;border-radius:var(--r-lg);min-height:280px}
.plugin-cat{font-family:var(--font-mono);font-size:9px;color:var(--accent);text-transform:uppercase;letter-spacing:.15em;padding:4px 10px;background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.25);border-radius:999px;width:fit-content;font-weight:700}
.plugin-card h3{font-family:var(--font-display);font-size:1.1rem;margin:4px 0 0}
.plugin-card>p{font-size:.86rem;color:var(--text-2);line-height:1.55;margin:0;flex:1}
.plugin-why{padding:12px 14px;background:var(--bg-2);border:1px solid var(--border);border-left:3px solid var(--olpa);border-radius:10px;font-size:.82rem;color:var(--muted);line-height:1.5}
.plugin-why strong{color:var(--olpa)}

/* ===== MODELS GRID (software con IA) ===== */
.models-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1300px;margin:0 auto}
@media(max-width:1024px){.models-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.models-grid{grid-template-columns:1fr}}
.model-card{padding:30px 28px;display:flex;flex-direction:column;gap:10px;border-radius:var(--r-lg);min-height:320px}
.model-label{font-family:var(--font-mono);font-size:9px;color:var(--accent);letter-spacing:.18em;text-transform:uppercase;padding:4px 10px;background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.25);border-radius:999px;width:fit-content;font-weight:700}
.model-card h3{font-family:var(--font-display);font-size:1.3rem;margin:4px 0 0;background:linear-gradient(135deg,var(--olpa),var(--olpa-soft));-webkit-background-clip:text;background-clip:text;color:transparent}
.model-maker{font-family:var(--font-mono);font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;padding-bottom:10px;border-bottom:1px solid var(--border)}
.model-card>p{font-size:.88rem;color:var(--text-2);line-height:1.55;margin:0;flex:1}
.model-strengths{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.model-strengths span{font-family:var(--font-mono);font-size:9px;color:var(--olpa);padding:4px 9px;background:rgba(255,214,10,.08);border:1px solid rgba(255,214,10,.25);border-radius:999px;letter-spacing:.05em}

/* ==========================================================================
   MARKETING CLUSTERS — mockups únicos (9 visuales)
   ========================================================================== */

/* ===== SERP MOCKUP (seo-cordoba) ===== */
.serp-mockup{padding:0;overflow:hidden;max-width:500px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(34,197,94,.25)!important}
.serp-head{display:flex;align-items:center;gap:8px;padding:10px 14px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.serp-bar{flex:1;margin-left:10px;display:flex;align-items:center;gap:10px;padding:8px 14px;background:var(--surface);border:1px solid var(--border);border-radius:999px;font-family:var(--font-mono);font-size:12px}
.sg-ico{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#4285f4 25%,#ea4335 25% 50%,#fbbc05 50% 75%,#34a853 75%);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:12px}
.sg-q{color:var(--text);flex:1}
.serp-body{padding:20px 22px}
.serp-stats{font-family:var(--font-mono);font-size:10px;color:var(--muted);margin-bottom:16px}
.serp-stats strong{color:var(--text)}
.serp-res{display:flex;gap:14px;padding:14px 12px;border-radius:10px;margin-bottom:10px;transition:all .3s}
.serp-res-top{background:linear-gradient(135deg,rgba(34,197,94,.08),rgba(255,214,10,.04));border:1px solid rgba(34,197,94,.3);box-shadow:0 0 25px rgba(34,197,94,.1)}
.serp-res:not(.serp-res-top){opacity:.55}
.sr-rank{font-family:var(--font-display);font-size:1.4rem;font-weight:700;color:var(--olpa);width:32px;line-height:1;flex-shrink:0}
.serp-res-top .sr-rank{color:#22c55e;text-shadow:0 0 12px rgba(34,197,94,.5)}
.sr-body{flex:1;min-width:0}
.sr-url{font-family:var(--font-mono);font-size:10px;color:var(--muted);margin-bottom:3px}
.sr-title{font-family:var(--font-display);font-size:13px;color:#4285f4;font-weight:600;line-height:1.3;margin-bottom:3px}
.serp-res-top .sr-title{color:var(--olpa)}
.sr-desc{font-size:11px;color:var(--text-2);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sr-rich{font-family:var(--font-mono);font-size:9px;color:#22c55e;margin-top:6px;letter-spacing:.03em}
.serp-footer{padding:12px 20px;background:rgba(34,197,94,.04);border-top:1px solid var(--border);font-size:10px;color:var(--muted);text-align:center;font-family:var(--font-mono)}

/* ===== AI CHAT MOCKUP (geo-posicionamiento-ia) ===== */
.ai-chat-mockup{padding:0;overflow:hidden;max-width:500px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(0,229,255,.25)!important}
.aic-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.aic-brand{display:flex;align-items:center;gap:12px}
.aic-logo{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#d97706,#b45309);display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--font-display);font-weight:700;font-size:16px}
.aic-name{font-family:var(--font-display);font-weight:600;font-size:14px;color:var(--text)}
.aic-ver{font-family:var(--font-mono);font-size:10px;color:var(--muted);margin-top:2px}
.aic-tag{font-family:var(--font-mono);font-size:9px;color:var(--accent);padding:4px 10px;background:rgba(0,229,255,.08);border:1px solid rgba(0,229,255,.25);border-radius:999px;letter-spacing:.1em}
.aic-body{padding:20px 22px;display:flex;flex-direction:column;gap:18px;min-height:320px}
.aic-q,.aic-a{display:flex;gap:12px}
.aic-you,.aic-ai{flex-shrink:0;width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:9px;font-weight:700;color:#fff}
.aic-you{background:var(--surface-2);border:1px solid var(--border)}
.aic-ai{background:linear-gradient(135deg,#d97706,#b45309)}
.aic-q .aic-text{flex:1;padding:10px 14px;background:var(--surface);border-radius:12px;font-size:12px;color:var(--text);line-height:1.5}
.aic-a{flex-direction:column;gap:10px}
.aic-a .aic-text{padding:12px 16px;background:linear-gradient(135deg,rgba(255,214,10,.06),rgba(0,229,255,.04));border:1px solid rgba(255,214,10,.2);border-radius:12px;font-size:12px;color:var(--text-2);line-height:1.55}
.aic-hl{color:var(--olpa);font-weight:700;background:rgba(255,214,10,.15);padding:1px 5px;border-radius:3px}
.aic-text sup{color:var(--accent);font-size:9px;font-family:var(--font-mono)}
.aic-citations{display:flex;flex-direction:column;gap:6px;padding:12px 16px;background:var(--bg-2);border-radius:10px;border-left:3px solid var(--accent)}
.aic-cit{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:10px}
.cit-n{width:18px;height:18px;border-radius:50%;background:rgba(0,229,255,.15);border:1px solid rgba(0,229,255,.4);color:var(--accent);display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0}
.cit-src{color:var(--muted)}
.aic-footer{padding:12px 20px;background:rgba(0,229,255,.04);border-top:1px solid var(--border);font-size:10px;color:var(--muted);text-align:center;font-family:var(--font-mono)}

/* ===== GOOGLE ADS DASHBOARD (google-ads-cordoba) ===== */
.cluster-gads-cordoba .gads-mockup{padding:0;overflow:hidden;max-width:500px;margin:0 auto;border-radius:14px;background:#fff;border:1px solid rgba(66,133,244,.3);box-shadow:0 30px 80px rgba(0,0,0,.4)}
.gads-head{padding:14px 20px;background:#f8f9fa;border-bottom:1px solid #e8eaed}
.gads-logo{font-family:var(--font-display);font-weight:700;font-size:15px;color:#202124;letter-spacing:-.01em}
.gads-campaign{font-size:11px;color:#5f6368;margin-top:3px;font-family:var(--font-mono)}
.gads-body{padding:20px;background:#fff;color:#202124;display:flex;flex-direction:column;gap:16px}
.gads-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.gk{padding:12px 8px;background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;text-align:center}
.gk-l{font-size:9px;color:#5f6368;text-transform:uppercase;letter-spacing:.03em;font-family:var(--font-mono)}
.gk-v{font-family:var(--font-display);font-size:1.15rem;font-weight:700;color:#202124;line-height:1;margin:4px 0 2px}
.gk-d{font-size:9px;font-weight:700}
.gk-d.up{color:#0d7f3e}
.gk-d.down{color:#c5221f}
.gads-chart{padding:12px 14px;background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px}
.gc-label{font-size:10px;color:#5f6368;margin-bottom:10px;font-family:var(--font-mono)}
.gc-bars{display:flex;align-items:flex-end;gap:4px;height:50px}
.gc-bar{flex:1;background:linear-gradient(180deg,#4285f4,#1a73e8);border-radius:3px 3px 0 0}
.gc-bar-active{background:linear-gradient(180deg,#FFD60A,#E6BC00)}
.gads-kws{padding:12px 14px;background:#f8f9fa;border:1px solid #e8eaed;border-radius:8px;display:flex;flex-direction:column;gap:8px}
.gk-row{display:flex;align-items:center;gap:10px;padding:4px 0;font-size:10px;color:#202124}
.gk-dot{width:6px;height:6px;border-radius:50%}
.gk-dot.ok{background:#0d7f3e}
.gk-dot.mid{background:#f9ab00}
.gk-term{flex:1;font-family:var(--font-mono);color:#4285f4;font-weight:500}
.gk-stat{font-family:var(--font-mono);font-size:9px;color:#5f6368}
.gads-footer{padding:10px 20px;background:#4285f4;color:#fff;font-size:10px;text-align:center;font-family:var(--font-mono);font-weight:600}

/* ===== INSTAGRAM AD MOCKUP (meta-ads) ===== */
.ig-ad-mockup{padding:0;overflow:hidden;max-width:380px;margin:0 auto;border-radius:18px;background:#000!important;border:1px solid rgba(228,64,95,.3)!important}
.iga-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:#000;border-bottom:1px solid #262626}
.iga-profile{display:flex;align-items:center;gap:10px}
.iga-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5);display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--font-display);font-weight:700;font-size:13px;padding:2px}
.iga-user{font-family:var(--font-display);font-weight:600;font-size:12px;color:#fff}
.iga-spons{font-weight:400;color:#a8a8a8;font-size:11px}
.iga-loc{font-size:10px;color:#a8a8a8;margin-top:1px}
.iga-more{color:#fff;font-weight:700}
.iga-media{position:relative;aspect-ratio:1/1;background:linear-gradient(135deg,#FFD60A,#E6BC00,#d97706);display:flex;align-items:center;justify-content:center;overflow:hidden}
.iga-img{position:absolute;inset:0;background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.25),transparent 50%)}
.iga-overlay{position:relative;z-index:5;text-align:center;padding:20px;color:#000}
.iga-headline{font-family:var(--font-display);font-weight:800;font-size:1.5rem;line-height:1;letter-spacing:-.02em;text-shadow:0 2px 10px rgba(0,0,0,.15)}
.iga-sub{font-family:var(--font-mono);font-size:11px;margin-top:8px;letter-spacing:.1em}
.iga-actions{display:flex;justify-content:space-between;padding:10px 14px;background:#000;color:#fff;font-size:18px}
.iga-left{display:flex;gap:14px}
.iga-cta{padding:0 14px 10px;background:#000}
.iga-cta-text{font-size:11px;color:#fff;line-height:1.4}
.iga-cta-text strong{font-weight:700}
.iga-cta-text span{color:#a8a8a8}
.iga-cta-btn{margin-top:10px;padding:10px 14px;background:#0095f6;color:#fff;text-align:center;font-size:11px;font-weight:700;border-radius:8px;font-family:var(--font-display)}
.iga-likes{padding:10px 14px;background:#000;border-top:1px solid #262626;color:#fff;font-size:11px;font-weight:600}

/* ===== LINKEDIN PROFILE + LGF (linkedin-ads) ===== */
.linkedin-mockup{padding:0;overflow:hidden;max-width:460px;margin:0 auto;border-radius:14px;background:#1b1f23!important;border:1px solid rgba(10,102,194,.35)!important}
.lin-head{display:flex;align-items:center;gap:12px;padding:10px 16px;background:#fff}
.lin-logo{width:32px;height:32px;border-radius:6px;background:#0a66c2;display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--font-display);font-weight:800;font-size:14px}
.lin-search{flex:1;padding:7px 12px;background:#eef3f8;border-radius:4px;font-size:11px;color:#666}
.lin-card{position:relative;background:#fff;padding-bottom:16px}
.lin-cover{height:60px;background:linear-gradient(135deg,#0a66c2,#004182)}
.lin-avatar{position:absolute;top:30px;left:16px;width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,var(--olpa),var(--olpa-deep));border:3px solid #fff;display:flex;align-items:center;justify-content:center;color:#000;font-family:var(--font-display);font-weight:700;font-size:22px}
.lin-content{padding:40px 16px 0 90px}
.lin-name{font-family:var(--font-display);font-weight:700;font-size:14px;color:#000}
.lin-role{font-size:12px;color:#333;margin-top:2px}
.lin-loc{font-size:10px;color:#666;margin-top:3px}
.lin-ad{background:#fff;margin-top:8px;padding:14px 16px;border-top:8px solid #eef3f8}
.lin-ad-tag{font-family:var(--font-mono);font-size:9px;color:#666;letter-spacing:.05em;margin-bottom:10px}
.lin-ad-brand{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.lin-ad-avatar{width:32px;height:32px;border-radius:4px;background:#0a66c2;display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--font-display);font-weight:700;font-size:11px}
.lin-ad-name{font-family:var(--font-display);font-weight:700;font-size:12px;color:#000}
.lin-ad-foll{font-size:9px;color:#666;margin-top:1px}
.lin-ad-text{font-size:11px;color:#000;line-height:1.5;margin-bottom:12px}
.lin-ad-media{height:80px;background:linear-gradient(135deg,#0a66c2,#004182);border-radius:6px;margin-bottom:12px}
.lin-ad-form{background:#f3f2ef;border:1px solid #e0e0e0;border-radius:6px;padding:12px}
.lin-ad-form-title{font-family:var(--font-display);font-weight:700;font-size:10px;color:#000;margin-bottom:10px;letter-spacing:.05em}
.lin-ad-form-field{font-size:10px;color:#666;padding:8px 10px;background:#fff;border:1px solid #e0e0e0;border-radius:4px;margin-bottom:6px;font-family:var(--font-mono)}
.lin-ad-form-btn{margin-top:8px;padding:9px 14px;background:#0a66c2;color:#fff;text-align:center;font-size:11px;font-weight:700;border-radius:16px;font-family:var(--font-display)}

/* ===== INSTAGRAM GRID (social-media) ===== */
.iggrid-mockup{padding:0;overflow:hidden;max-width:380px;margin:0 auto;border-radius:16px;background:#000!important;border:1px solid rgba(228,64,95,.3)!important}
.igg-head{display:flex;align-items:center;gap:14px;padding:16px 18px;background:#000;border-bottom:1px solid #262626}
.igg-avatar{width:54px;height:54px;border-radius:50%;background:linear-gradient(135deg,#feda75,#fa7e1e,#d62976,#962fbf);display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--font-display);font-weight:700;font-size:20px}
.igg-info{flex:1}
.igg-user{font-family:var(--font-display);font-weight:700;font-size:14px;color:#fff}
.igg-stats{font-size:10px;color:#a8a8a8;margin-top:3px}
.igg-stats strong{color:#fff;font-weight:600}
.igg-bio{padding:12px 18px;background:#000}
.igg-name{font-family:var(--font-display);font-weight:600;font-size:12px;color:#fff}
.igg-desc{font-size:11px;color:#a8a8a8;margin-top:4px;line-height:1.4}
.igg-tabs{display:flex;border-top:1px solid #262626;background:#000}
.igg-tab{flex:1;padding:10px 0;text-align:center;font-size:10px;color:#a8a8a8;font-family:var(--font-mono);text-transform:uppercase}
.igg-tab-active{color:#fff;border-bottom:1px solid #fff}
.igg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:#000}
.igg-post{aspect-ratio:1;position:relative;overflow:hidden}
.igg-p1{background:linear-gradient(135deg,#FFD60A,#fa7e1e)}
.igg-p2{background:linear-gradient(135deg,#00E5FF,#0099FF)}
.igg-p3{background:linear-gradient(135deg,#d62976,#962fbf)}
.igg-p4{background:linear-gradient(135deg,#22c55e,#0d7f3e)}
.igg-p5{background:linear-gradient(135deg,#f97316,#c2410c)}
.igg-p6{background:linear-gradient(135deg,#8b5cf6,#6d28d9)}
.igg-p7{background:linear-gradient(135deg,#ef4444,#991b1b)}
.igg-p8{background:linear-gradient(135deg,#06b6d4,#0e7490)}
.igg-p9{background:linear-gradient(135deg,#feda75,#d97706)}
.igg-plays{position:absolute;top:6px;right:6px;font-family:var(--font-mono);font-size:9px;color:#fff;background:rgba(0,0,0,.5);padding:2px 6px;border-radius:4px;font-weight:700}

/* ===== EMAIL PREVIEW (email-marketing) ===== */
.cluster-email-mkt .email-mockup{padding:0;overflow:hidden;max-width:460px;margin:0 auto;border-radius:14px;background:#fff;border:1px solid rgba(255,214,10,.3);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.em-head{display:flex;align-items:center;gap:12px;padding:14px 18px;background:#f5f5f7;border-bottom:1px solid #e5e5e7}
.em-head-logo{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,var(--olpa),var(--olpa-deep));display:flex;align-items:center;justify-content:center;color:#000;font-size:18px;flex-shrink:0}
.em-head-info{flex:1;min-width:0}
.em-from{font-family:var(--font-mono);font-size:10px;color:#5f6368;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.em-subj{font-family:var(--font-display);font-weight:600;font-size:12px;color:#202124;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.em-time{font-family:var(--font-mono);font-size:10px;color:#5f6368;flex-shrink:0}
.em-body{background:#fff;color:#202124}
.em-banner{padding:26px 20px;background:linear-gradient(135deg,var(--olpa),var(--olpa-deep));color:#000;text-align:center;font-family:var(--font-display);font-weight:800;font-size:1.2rem;letter-spacing:.1em}
.em-content{padding:22px 22px 26px}
.em-greet{font-family:var(--font-display);font-weight:600;font-size:13px;color:#202124;margin-bottom:10px}
.em-text{font-size:11px;color:#5f6368;line-height:1.55;margin-bottom:14px}
.em-text strong{color:#202124}
.em-text-sm{font-size:10px;margin-top:6px}
.em-cta-btn{padding:11px 18px;background:#202124;color:#fff;text-align:center;font-size:11px;font-weight:700;border-radius:6px;font-family:var(--font-display);margin-bottom:18px}
.em-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.em-card{padding:10px 6px;background:#f5f5f7;border:1px solid #e5e5e7;border-radius:6px;text-align:center;font-size:9px;color:#5f6368;font-family:var(--font-mono)}
.em-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:12px 16px;background:linear-gradient(135deg,rgba(255,214,10,.08),rgba(0,229,255,.04));border-top:1px solid #e5e5e7}
.em-stat{text-align:center}
.ems-k{font-family:var(--font-mono);font-size:9px;color:#5f6368;text-transform:uppercase;letter-spacing:.05em}
.ems-v{font-family:var(--font-display);font-weight:700;font-size:13px;color:#22c55e;margin-top:2px}

/* ===== PAUTA MULTICHANNEL DASHBOARD ===== */
.pauta-mockup{padding:0;overflow:hidden;max-width:480px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.3)!important;display:flex;flex-direction:column}
.pauta-mockup>*{padding-left:26px;padding-right:26px}
.pauta-mockup>*:first-child{padding-top:22px}
.pauta-mockup>*:last-child{padding-bottom:18px}
.pm-head{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:14px;border-bottom:1px solid var(--border);margin-bottom:14px}
.pm-title{font-family:var(--font-display);font-weight:700;font-size:14px;color:var(--olpa);letter-spacing:.05em}
.pm-period{font-family:var(--font-mono);font-size:10px;color:var(--muted)}
.pm-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pmk{padding:12px 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;text-align:center}
.pmk-l{font-family:var(--font-mono);font-size:9px;color:var(--muted);text-transform:uppercase}
.pmk-v{font-family:var(--font-display);font-weight:700;font-size:1.2rem;color:var(--text);line-height:1;margin:4px 0 2px}
.pmk-d{font-size:9px;font-weight:700;font-family:var(--font-mono)}
.pmk-d.up{color:#22c55e}
.pm-channels{display:flex;flex-direction:column;gap:10px;padding-top:12px;border-top:1px solid var(--border)}
.pm-ch{display:flex;flex-direction:column;gap:4px}
.pm-ch-name{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--text);font-family:var(--font-mono)}
.pm-dot{width:8px;height:8px;border-radius:50%}
.pm-dot.g{background:#4285f4}
.pm-dot.m{background:#e4405f}
.pm-dot.l{background:#0a66c2}
.pm-dot.t{background:#ff0050}
.pm-dot.y{background:#ff0000}
.pm-ch-bar{height:6px;background:rgba(255,255,255,.05);border-radius:3px;overflow:hidden}
.pm-ch-bar span{display:block;height:100%;border-radius:3px;animation:fillBar 1.5s ease-out}
.pm-ch-stats{font-family:var(--font-mono);font-size:9px;color:var(--muted)}
.pm-footer{padding-top:12px;border-top:1px solid var(--border);font-family:var(--font-mono);font-size:10px;color:var(--olpa);text-align:center;letter-spacing:.03em}

/* ===== VIDEO STORYBOARD (produccion-audiovisual) ===== */
.video-mockup{padding:0;overflow:hidden;max-width:480px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(239,68,68,.3)!important}
.vm-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.vm-rec{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:10px;color:#ef4444;font-weight:700;letter-spacing:.1em}
.vm-rec-dot{width:8px;height:8px;border-radius:50%;background:#ef4444;box-shadow:0 0 10px #ef4444;animation:pulse 1s ease-in-out infinite}
.vm-title{font-family:var(--font-mono);font-size:11px;color:var(--muted)}
.vm-menu{color:var(--muted);font-size:14px}
.vm-preview{position:relative;aspect-ratio:16/9;background:linear-gradient(135deg,#1a1a26,#0a0a12);display:flex;align-items:center;justify-content:center}
.vm-frame{display:flex;flex-direction:column;align-items:center;gap:14px}
.vm-play{width:60px;height:60px;border-radius:50%;background:rgba(255,255,255,.15);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;color:#fff;font-size:22px;padding-left:5px;border:2px solid rgba(255,255,255,.3)}
.vm-timer{font-family:var(--font-mono);font-size:11px;color:#fff;background:rgba(0,0,0,.6);padding:4px 10px;border-radius:4px}
.vm-progress{position:absolute;bottom:0;left:0;right:0;padding:10px 14px}
.vmp-bar{height:4px;background:rgba(255,255,255,.2);border-radius:2px;overflow:hidden}
.vmp-bar span{display:block;height:100%;background:#ef4444;border-radius:2px}
.vm-storyboard{padding:16px 18px;background:rgba(255,255,255,.02);border-top:1px solid var(--border)}
.vm-sb-label{font-family:var(--font-mono);font-size:9px;color:var(--muted);letter-spacing:.15em;margin-bottom:10px}
.vm-sb-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.vm-sb{padding:10px 6px;background:var(--surface-2);border:1px solid var(--border);border-radius:6px;text-align:center;display:flex;flex-direction:column;gap:4px;transition:all .3s}
.vm-sb-done{border-color:rgba(34,197,94,.4);background:rgba(34,197,94,.04);opacity:.7}
.vm-sb-now{border-color:rgba(239,68,68,.5);background:linear-gradient(135deg,rgba(239,68,68,.1),var(--surface-2));box-shadow:0 0 16px rgba(239,68,68,.2)}
.vm-sb-n{font-family:var(--font-mono);font-size:9px;color:var(--muted);font-weight:700}
.vm-sb-done .vm-sb-n{color:#22c55e}
.vm-sb-now .vm-sb-n{color:#ef4444}
.vm-sb-t{font-family:var(--font-display);font-size:9px;color:var(--text);font-weight:600}
.vm-footer{padding:12px 18px;background:rgba(239,68,68,.04);border-top:1px solid var(--border);font-family:var(--font-mono);font-size:10px;color:var(--muted);text-align:center}

/* ==========================================================================
   MARKETING ESTRATÉGICO + TRADICIONAL — mockups (5 visuales)
   ========================================================================== */

/* ===== MARKET MAP (TAM/SAM/SOM) · estrategia-de-mercado ===== */
.mktstr-mockup{padding:0;overflow:hidden;max-width:480px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(0,229,255,.3)!important}
.ms-head{display:flex;justify-content:space-between;align-items:baseline;padding:14px 18px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.ms-label{font-family:var(--font-mono);font-size:11px;color:var(--accent);letter-spacing:.12em;font-weight:700}
.ms-date{font-family:var(--font-mono);font-size:10px;color:var(--muted)}
.ms-body{padding:30px 24px;display:flex;flex-direction:column;align-items:center;gap:26px}
.ms-tam{position:relative;width:260px;height:260px;display:flex;align-items:center;justify-content:center}
.ms-tam-ring{position:absolute;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:14px;transition:all .4s}
.ms-tam-tam{width:260px;height:260px;background:radial-gradient(circle,rgba(0,229,255,.05),rgba(0,229,255,.15));border:1.5px solid rgba(0,229,255,.4)}
.ms-tam-sam{width:180px;height:180px;background:radial-gradient(circle,rgba(255,214,10,.08),rgba(255,214,10,.18));border:1.5px solid rgba(255,214,10,.4)}
.ms-tam-som{width:100px;height:100px;background:radial-gradient(circle,rgba(255,214,10,.25),rgba(255,214,10,.5));border:2px solid var(--olpa);box-shadow:0 0 24px rgba(255,214,10,.3)}
.ms-tam-lbl{font-family:var(--font-mono);font-size:10px;color:#fff;letter-spacing:.15em;font-weight:700}
.ms-tam-val{font-family:var(--font-display);font-size:13px;color:#fff;font-weight:600;margin-top:2px}
.ms-tam-som .ms-tam-val{font-size:14px;color:#000}
.ms-tam-som .ms-tam-lbl{color:#000}
.ms-legend{display:flex;flex-direction:column;gap:8px;width:100%}
.ms-lg{display:flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:10px;color:var(--text-2)}
.ms-lg-dot{width:10px;height:10px;border-radius:50%}
.ms-lg-dot.ms-lg-1{background:rgba(0,229,255,.4);border:1px solid var(--accent)}
.ms-lg-dot.ms-lg-2{background:rgba(255,214,10,.4);border:1px solid rgba(255,214,10,.6)}
.ms-lg-dot.ms-lg-3{background:var(--olpa);box-shadow:0 0 8px rgba(255,214,10,.5)}
.ms-footer{padding:12px 20px;background:rgba(0,229,255,.04);border-top:1px solid var(--border);font-family:var(--font-mono);font-size:10px;color:var(--accent);text-align:center;letter-spacing:.03em}

/* ===== PRICING TIERS · estrategia-de-precios ===== */
.pricing-mockup{padding:0;overflow:hidden;max-width:480px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.3)!important}
.pg-head{padding:18px 22px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.pg-title{font-family:var(--font-display);font-weight:700;font-size:13px;color:var(--text);letter-spacing:.03em}
.pg-sub{font-family:var(--font-mono);font-size:10px;color:var(--muted);margin-top:3px}
.pg-tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:22px 20px}
.pg-tier{padding:14px 10px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;transition:all .3s}
.pg-tier-best{border-color:rgba(255,214,10,.5);background:linear-gradient(180deg,rgba(255,214,10,.08),var(--surface-2));transform:translateY(-6px);box-shadow:0 12px 32px rgba(255,214,10,.15)}
.pg-tier-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);font-family:var(--font-mono);font-size:8px;font-weight:700;padding:4px 8px;background:var(--olpa);color:#000;border-radius:999px;letter-spacing:.1em;white-space:nowrap}
.pg-tier-name{font-family:var(--font-display);font-size:12px;color:var(--text);font-weight:700}
.pg-tier-best .pg-tier-name{color:var(--olpa)}
.pg-tier-price{font-family:var(--font-display);font-size:1.4rem;font-weight:700;color:var(--text);line-height:1}
.pg-tier-best .pg-tier-price{color:var(--olpa)}
.pg-tier-price span{font-size:.7rem;color:var(--muted);font-weight:400}
.pg-tier-note{font-family:var(--font-mono);font-size:9px;color:var(--muted);letter-spacing:.05em;text-transform:uppercase}
.pg-tier-bar{width:24px;height:40px;background:rgba(255,255,255,.05);border-radius:2px;overflow:hidden;display:flex;align-items:flex-end;margin-top:6px}
.pg-tier-bar span{display:block;width:100%;border-radius:2px;animation:fillBar 1.2s ease-out}
.pg-insight{padding:14px 20px;background:linear-gradient(135deg,rgba(255,214,10,.06),rgba(0,229,255,.03));border-top:1px solid var(--border);display:flex;flex-direction:column;gap:4px}
.pg-insight-label{font-family:var(--font-mono);font-size:9px;color:var(--olpa);letter-spacing:.15em;font-weight:700}
.pg-insight-text{font-size:10px;color:var(--text-2);line-height:1.5}

/* ===== PERCEPTUAL MAP · posicionamiento-de-marca ===== */
.posm-mockup{padding:0;overflow:hidden;max-width:440px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(0,229,255,.3)!important}
.posm-head{padding:14px 18px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.posm-title{font-family:var(--font-mono);font-size:11px;color:var(--accent);letter-spacing:.12em;font-weight:700}
.posm-sub{font-family:var(--font-mono);font-size:9px;color:var(--muted);margin-top:3px}
.posm-chart{padding:20px 14px 14px;display:grid;grid-template-columns:28px 1fr;gap:8px;position:relative}
.posm-axis-y{font-family:var(--font-mono);font-size:8px;color:var(--muted);letter-spacing:.1em;display:flex;align-items:center;justify-content:center;text-align:center;line-height:1.3;font-weight:700}
.posm-grid{position:relative;aspect-ratio:1;background:rgba(255,255,255,.02);border:1px solid var(--border);border-radius:10px;overflow:hidden}
.posm-q{position:absolute;width:50%;height:50%}
.posm-q.q-tl{top:0;left:0;background:linear-gradient(135deg,rgba(34,197,94,.05),transparent)}
.posm-q.q-tr{top:0;right:0;background:linear-gradient(225deg,rgba(255,214,10,.05),transparent)}
.posm-q.q-bl{bottom:0;left:0;background:linear-gradient(45deg,rgba(248,113,113,.04),transparent)}
.posm-q.q-br{bottom:0;right:0;background:linear-gradient(315deg,rgba(0,229,255,.05),transparent)}
.posm-cross-h{position:absolute;top:50%;left:0;right:0;height:1px;background:rgba(255,255,255,.1);border-top:1px dashed rgba(255,255,255,.1)}
.posm-cross-v{position:absolute;left:50%;top:0;bottom:0;width:1px;background:rgba(255,255,255,.1);border-left:1px dashed rgba(255,255,255,.1)}
.posm-dot{position:absolute;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:8px;font-weight:700;transform:translate(-50%,-50%);background:var(--surface-2);border:1.5px solid var(--muted);color:var(--text-2)}
.posm-you{background:var(--olpa)!important;border-color:var(--olpa)!important;color:#000!important;box-shadow:0 0 18px rgba(255,214,10,.6);z-index:5}
.posm-target{position:absolute;width:48px;height:48px;border-radius:50%;border:2px dashed var(--olpa);transform:translate(-50%,-50%);animation:pulse 2s ease-in-out infinite;z-index:4}
.posm-axis-x{position:absolute;bottom:-4px;left:34px;right:14px;font-family:var(--font-mono);font-size:8px;color:var(--muted);letter-spacing:.1em;text-align:center;font-weight:700;padding-top:8px}
.posm-insight{padding:14px 18px;background:rgba(255,214,10,.04);border-top:1px solid var(--border);display:flex;flex-direction:column;gap:4px}
.posm-ins-label{font-family:var(--font-mono);font-size:9px;color:var(--olpa);letter-spacing:.12em;font-weight:700}
.posm-ins-text{font-size:10px;color:var(--text-2);line-height:1.5}

/* ===== FOCUS GROUP ROOM · focus-group-cordoba ===== */
.fg-mockup{padding:0;overflow:hidden;max-width:480px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(239,68,68,.3)!important}
.fg-head{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.fg-rec{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11px;color:#ef4444;font-weight:700;letter-spacing:.05em}
.fg-rec-dot{width:8px;height:8px;border-radius:50%;background:#ef4444;box-shadow:0 0 10px #ef4444;animation:pulse 1s ease-in-out infinite}
.fg-time{font-family:var(--font-mono);font-size:11px;color:var(--text)}
.fg-room{aspect-ratio:1;padding:12px;position:relative}
.fg-svg{width:100%;height:100%}
.fg-person circle{transition:all .3s}
.fg-person:hover circle{fill:rgba(34,197,94,.15)}
.fg-mod circle:nth-child(2){animation:pulseModer 2.5s ease-in-out infinite}
@keyframes pulseModer{0%,100%{filter:drop-shadow(0 0 10px rgba(255,214,10,.4))}50%{filter:drop-shadow(0 0 22px rgba(255,214,10,.9))}}
.fg-transcript{padding:14px 18px;background:rgba(0,0,0,.3);border-top:1px solid var(--border);display:flex;flex-direction:column;gap:6px;max-height:90px;overflow:hidden}
.fg-ts-line{display:flex;gap:8px;font-size:10px;line-height:1.5}
.fg-ts-line.fg-ts-new{animation:fadeInTs .8s ease-out}
@keyframes fadeInTs{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
.fg-ts-speaker{font-family:var(--font-mono);color:var(--accent);font-weight:700;flex-shrink:0}
.fg-ts-text{color:var(--text-2);font-style:italic}
.fg-footer{padding:12px 20px;background:rgba(239,68,68,.03);border-top:1px solid var(--border);font-family:var(--font-mono);font-size:10px;color:var(--muted);text-align:center}

/* ===== MYSTERY SHOPPING CHECKLIST · mystery-shopping-argentina ===== */
.mystery-mockup{padding:0;overflow:hidden;max-width:440px;margin:0 auto;border-radius:16px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(139,92,246,.35)!important;display:flex;flex-direction:column}
.my-head{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background:linear-gradient(135deg,rgba(139,92,246,.08),transparent);border-bottom:1px solid var(--border)}
.my-title{font-family:var(--font-display);font-size:12px;font-weight:700;color:#8b5cf6;letter-spacing:.08em}
.my-id{font-family:var(--font-mono);font-size:10px;color:var(--muted)}
.my-meta{padding:12px 20px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;border-bottom:1px solid var(--border)}
.my-meta-row{display:flex;flex-direction:column;gap:2px}
.my-meta-row span{font-family:var(--font-mono);font-size:8px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.my-meta-row strong{font-size:11px;color:var(--text);font-family:var(--font-display)}
.my-score{padding:18px 20px;display:flex;align-items:center;gap:18px;border-bottom:1px solid var(--border);background:rgba(255,214,10,.03)}
.my-score-circle{position:relative;width:72px;height:72px;flex-shrink:0}
.my-score-circle svg{width:72px;height:72px}
.my-score-num{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family:var(--font-display);font-size:1.4rem;font-weight:700;color:var(--olpa)}
.my-score-info{flex:1}
.my-score-label{font-family:var(--font-mono);font-size:9px;color:var(--muted);letter-spacing:.12em;font-weight:700}
.my-score-val{font-family:var(--font-display);font-size:1rem;color:var(--text);margin-top:2px}
.my-score-delta{font-family:var(--font-mono);font-size:9px;color:#22c55e;margin-top:3px}
.my-checks{padding:14px 20px;display:flex;flex-direction:column;gap:7px}
.my-check{display:flex;align-items:center;gap:10px;font-size:11px;color:var(--text-2);padding:4px 0}
.myc-icon{width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px;flex-shrink:0}
.my-check.ok .myc-icon{background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.4);color:#22c55e}
.my-check.warn .myc-icon{background:rgba(255,214,10,.15);border:1px solid rgba(255,214,10,.4);color:var(--olpa)}
.my-check.bad .myc-icon{background:rgba(248,113,113,.15);border:1px solid rgba(248,113,113,.4);color:#f87171}
.myc-text{flex:1}
.my-check.bad .myc-text{opacity:.75;text-decoration:line-through}
.my-footer{padding:12px 20px;background:rgba(139,92,246,.04);border-top:1px solid var(--border);font-family:var(--font-mono);font-size:10px;color:var(--muted);text-align:center}

/* ===== Mobile adjustments: mockups más angostos legibles ===== */
@media(max-width:640px){
  .ig-ad-mockup,.iggrid-mockup{max-width:340px}
  .linkedin-mockup,.email-mockup{max-width:340px}
  .posm-mockup,.mystery-mockup{max-width:340px}
  .pricing-mockup,.mktstr-mockup{max-width:340px}
  .pauta-mockup>*{padding-left:18px;padding-right:18px}
  .bsia-mockup,.course-catalog,.training-plan{max-width:340px}
}

/* ==============================================================
   BUSINESS SCHOOL IA — mockups (programas / cursos / in-company)
   ============================================================== */

/* ----- .bsia-mockup : program curriculum timeline ----- */
.bsia-mockup{
  max-width:460px;margin:0 auto;padding:24px;border-radius:20px;
  background:linear-gradient(155deg,rgba(255,214,10,.05),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
}
.bsia-mockup .bs-head{
  border-bottom:1px dashed rgba(255,255,255,.1);padding-bottom:12px;margin-bottom:16px;
}
.bsia-mockup .bs-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:4px;
}
.bsia-mockup .bs-sub{
  font-size:11px;color:var(--text-2);font-family:var(--font-mono);
}
.bsia-mockup .bs-timeline{display:flex;flex-direction:column;gap:10px}
.bsia-mockup .bs-week{
  display:grid;grid-template-columns:34px 1fr 24px;gap:12px;align-items:center;
  padding:10px 12px;border-radius:10px;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);
  transition:all .25s;
}
.bsia-mockup .bs-week.bs-done{
  background:rgba(0,229,255,.06);border-color:rgba(0,229,255,.2);
}
.bsia-mockup .bs-week.bs-now{
  background:rgba(255,214,10,.08);border-color:rgba(255,214,10,.35);
  box-shadow:0 0 0 1px rgba(255,214,10,.15),0 4px 16px rgba(255,214,10,.08);
}
.bsia-mockup .bs-wk-n{
  font-family:var(--font-mono);font-size:14px;font-weight:700;
  color:var(--text-2);text-align:center;
}
.bsia-mockup .bs-week.bs-done .bs-wk-n{color:var(--accent)}
.bsia-mockup .bs-week.bs-now .bs-wk-n{color:var(--olpa)}
.bsia-mockup .bs-wk-title{
  font-size:12.5px;font-weight:600;color:var(--text);margin-bottom:2px;
}
.bsia-mockup .bs-wk-topics{
  font-size:10px;color:var(--text-2);font-family:var(--font-mono);
}
.bsia-mockup .bs-wk-status{
  font-size:14px;text-align:center;color:var(--text-3);
}
.bsia-mockup .bs-week.bs-done .bs-wk-status{color:var(--accent)}
.bsia-mockup .bs-week.bs-now .bs-wk-status{
  color:var(--olpa);animation:pulse 1.6s infinite;
}
.bsia-mockup .bs-footer{
  margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);text-align:center;
}

/* ----- .course-catalog : open courses catalog (cursos-ia) ----- */
.course-catalog{
  max-width:460px;margin:0 auto;padding:24px;border-radius:20px;
  background:linear-gradient(155deg,rgba(0,229,255,.05),rgba(255,214,10,.04));
  border:1px solid rgba(255,255,255,.08);
}
.course-catalog .cc-head{
  display:flex;justify-content:space-between;align-items:baseline;
  border-bottom:1px dashed rgba(255,255,255,.1);padding-bottom:12px;margin-bottom:16px;
  gap:10px;flex-wrap:wrap;
}
.course-catalog .cc-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  color:var(--accent);text-transform:uppercase;
}
.course-catalog .cc-filter{
  font-family:var(--font-mono);font-size:9px;color:var(--text-3);
  padding:3px 8px;border:1px solid rgba(255,255,255,.08);border-radius:20px;
}
.course-catalog .cc-list{display:flex;flex-direction:column;gap:10px}
.course-catalog .cc-card{
  display:grid;grid-template-columns:64px 1fr auto;gap:10px;align-items:center;
  padding:12px;border-radius:12px;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);
}
.course-catalog .cc-card.cc-featured{
  background:rgba(255,214,10,.06);border-color:rgba(255,214,10,.25);
  box-shadow:0 0 0 1px rgba(255,214,10,.1);
}
.course-catalog .cc-level{
  font-family:var(--font-mono);font-size:8px;font-weight:700;
  letter-spacing:.1em;color:var(--accent);text-align:center;
  padding:4px 6px;background:rgba(0,229,255,.1);border-radius:6px;
}
.course-catalog .cc-featured .cc-level{
  color:var(--olpa);background:rgba(255,214,10,.15);
}
.course-catalog .cc-info{grid-column:2;min-width:0}
.course-catalog .cc-name{
  font-size:12px;font-weight:600;color:var(--text);margin-bottom:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.course-catalog .cc-meta{
  font-size:10px;color:var(--text-2);font-family:var(--font-mono);
}
.course-catalog .cc-bar{
  grid-column:2;height:3px;background:rgba(255,255,255,.06);
  border-radius:2px;overflow:hidden;margin-top:6px;
}
.course-catalog .cc-bar-fill{
  height:100%;background:linear-gradient(90deg,var(--accent),var(--olpa));
  border-radius:2px;
}
.course-catalog .cc-slots{
  grid-column:3;grid-row:1/span 2;font-family:var(--font-mono);
  font-size:11px;font-weight:700;color:var(--text-2);text-align:right;
}
.course-catalog .cc-footer{
  margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);text-align:center;
}

/* ----- .training-plan : multi-track in-company plan ----- */
.training-plan{
  max-width:460px;margin:0 auto;padding:24px;border-radius:20px;
  background:linear-gradient(155deg,rgba(255,214,10,.04),rgba(0,229,255,.05));
  border:1px solid rgba(255,255,255,.08);
}
.training-plan .tp-head{
  border-bottom:1px dashed rgba(255,255,255,.1);padding-bottom:12px;margin-bottom:16px;
}
.training-plan .tp-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:4px;
}
.training-plan .tp-sub{
  font-size:11px;color:var(--text-2);font-family:var(--font-mono);
}
.training-plan .tp-tracks{display:flex;flex-direction:column;gap:14px}
.training-plan .tp-track{
  padding:12px;border-radius:12px;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);
}
.training-plan .tp-track-head{
  display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;
}
.training-plan .tp-track-name{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;
  font-weight:700;color:var(--accent);
}
.training-plan .tp-track-n{
  font-size:10px;color:var(--text-2);font-family:var(--font-mono);
}
.training-plan .tp-track-sessions{
  display:flex;gap:6px;margin-bottom:8px;
}
.training-plan .tp-dot{
  flex:1;height:6px;border-radius:3px;
  background:rgba(255,255,255,.08);
}
.training-plan .tp-dot.tp-done{background:var(--accent)}
.training-plan .tp-dot.tp-now{
  background:var(--olpa);box-shadow:0 0 10px rgba(255,214,10,.5);
  animation:pulse 1.8s infinite;
}
.training-plan .tp-track-meta{
  font-size:9.5px;color:var(--text-3);font-family:var(--font-mono);
}
.training-plan .tp-footer{
  margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);text-align:center;
}

/* ==========================================================================
   HERRAMIENTAS · Tool-specific hero mockups
   ========================================================================== */

/* --- ODOO mockup: ERP dashboard --- */
.odoo-mockup{
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,214,10,.05),transparent 60%),
    radial-gradient(100% 80% at 100% 100%,rgba(0,229,255,.04),transparent 60%),
    rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.odoo-mockup .odoo-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:14px;margin-bottom:16px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.odoo-mockup .odoo-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;
  color:var(--text-2);text-transform:uppercase;
}
.odoo-mockup .odoo-badge{
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;
  padding:5px 10px;border-radius:999px;
  background:rgba(255,214,10,.1);border:1px solid rgba(255,214,10,.35);
  color:var(--olpa);text-transform:uppercase;
}
.odoo-mockup .odoo-star{color:var(--olpa);font-size:11px}
.odoo-mockup .odoo-modules{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;
}
.odoo-mockup .odoo-mod{
  padding:12px;border-radius:12px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
}
.odoo-mockup .odoo-mod-head{
  display:flex;align-items:center;gap:8px;
  padding-bottom:8px;margin-bottom:8px;
  border-bottom:1px dashed rgba(255,255,255,.08);
}
.odoo-mockup .odoo-mod-n{
  font-family:var(--font-mono);font-size:9px;
  padding:2px 6px;border-radius:4px;
  background:rgba(255,214,10,.1);color:var(--olpa);
}
.odoo-mockup .odoo-mod-name{
  font-size:12px;font-weight:600;color:var(--text);
}
.odoo-mockup .odoo-mod-row{
  display:flex;justify-content:space-between;align-items:center;
  font-size:10px;color:var(--text-3);padding:3px 0;
  font-family:var(--font-mono);
}
.odoo-mockup .odoo-mod-val{color:var(--text-2);font-weight:600}
.odoo-mockup .odoo-mod-val.odoo-ok{color:#7efaa8}
.odoo-mockup .odoo-foot{
  margin-top:14px;padding-top:12px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);
  text-align:center;
}

/* --- ODOO: App grid hero visual (inspired by Odoo's own module grid) --- */
.odoo-appgrid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,214,10,.06),transparent 60%),
    radial-gradient(100% 80% at 100% 100%,rgba(0,229,255,.05),transparent 60%),
    rgba(10,12,16,.6);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.odoo-app{
  aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;padding:10px;border-radius:12px;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.07);
  transition:transform .25s ease,border-color .25s ease,background .25s ease;
}
.odoo-app:hover{transform:translateY(-2px);border-color:rgba(255,214,10,.35);background:rgba(255,214,10,.04)}
.odoo-app-ic{
  width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:11px;font-weight:700;color:#07070C;
  background:linear-gradient(135deg,var(--olpa),#ffe566);
}
.odoo-app.cy .odoo-app-ic{background:linear-gradient(135deg,#00E5FF,#66f2ff);color:#07070C}
.odoo-app.mg .odoo-app-ic{background:linear-gradient(135deg,#ff7ab6,#ffb3d1);color:#07070C}
.odoo-app-lbl{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-2);font-family:var(--font-mono)}
.odoo-appgrid-foot{
  grid-column:1/-1;margin-top:6px;padding-top:12px;
  border-top:1px dashed rgba(255,255,255,.1);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);
  display:flex;justify-content:space-between;
}
.odoo-appgrid-foot .star{color:var(--olpa)}

/* --- ODOO: Mini module mockups (Sales kanban / Inventory / POS) --- */
.odoo-mini{
  padding:18px;border-radius:16px;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,214,10,.05),transparent 60%),
    rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
}
.odoo-mini-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:10px;margin-bottom:12px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.odoo-mini-title{font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-2)}
.odoo-mini-dot{width:7px;height:7px;border-radius:50%;background:#7efaa8;box-shadow:0 0 8px #7efaa8}

/* Sales kanban */
.odoo-kanban{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.odoo-kan-col{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:8px;min-height:120px}
.odoo-kan-lbl{font-family:var(--font-mono);font-size:8px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);margin-bottom:6px;display:flex;justify-content:space-between}
.odoo-kan-card{background:rgba(255,214,10,.05);border:1px solid rgba(255,214,10,.2);border-radius:6px;padding:6px;margin-bottom:5px;font-size:9px;color:var(--text-2);font-family:var(--font-mono)}
.odoo-kan-card strong{color:var(--olpa);font-weight:700;display:block;font-size:10px}

/* Inventory rows */
.odoo-inv-row{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;border-radius:8px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);margin-bottom:6px;font-family:var(--font-mono);font-size:10px}
.odoo-inv-row .sku{color:var(--text-3)}
.odoo-inv-row .name{color:var(--text);flex:1;margin:0 10px}
.odoo-inv-row .qty{color:#7efaa8;font-weight:700}
.odoo-inv-row.low .qty{color:#ff7a7a}

/* POS tiles */
.odoo-pos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.odoo-pos-tile{aspect-ratio:1;display:flex;flex-direction:column;justify-content:space-between;padding:10px;border-radius:10px;background:linear-gradient(160deg,rgba(0,229,255,.08),rgba(0,229,255,.02));border:1px solid rgba(0,229,255,.2);font-family:var(--font-mono)}
.odoo-pos-tile .n{font-size:9px;color:var(--text-3)}
.odoo-pos-tile .nm{font-size:11px;color:var(--text);font-weight:600}
.odoo-pos-tile .pr{font-size:10px;color:#00E5FF;font-weight:700}

/* Accounting chart */
.odoo-acc-bars{display:flex;align-items:flex-end;gap:8px;height:120px;padding:10px 4px}
.odoo-acc-bars .bar{flex:1;background:linear-gradient(180deg,var(--olpa),rgba(255,214,10,.2));border-radius:4px 4px 0 0;position:relative}
.odoo-acc-bars .bar::after{content:attr(data-m);position:absolute;bottom:-16px;left:0;right:0;text-align:center;font-size:8px;color:var(--text-3);font-family:var(--font-mono)}
.odoo-acc-foot{display:flex;justify-content:space-between;margin-top:20px;font-family:var(--font-mono);font-size:10px;color:var(--text-2)}
.odoo-acc-foot strong{color:var(--olpa)}

/* --- ODOO: Modules grid (full section) --- */
.odoo-modgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px}
.odoo-modcard{
  padding:22px;border-radius:16px;
  background:rgba(10,12,16,.5);
  border:1px solid rgba(255,255,255,.08);
  transition:transform .3s ease,border-color .3s ease;
  position:relative;overflow:hidden;
}
.odoo-modcard::before{
  content:"";position:absolute;inset:0 0 auto 0;height:2px;
  background:linear-gradient(90deg,var(--olpa),transparent);opacity:.5;
}
.odoo-modcard:hover{transform:translateY(-3px);border-color:rgba(255,214,10,.3)}
.odoo-modcard .mc-n{font-family:var(--font-mono);font-size:10px;color:var(--olpa);letter-spacing:.15em}
.odoo-modcard h4{margin:8px 0 10px;font-size:16px;color:var(--text)}
.odoo-modcard p{font-size:13px;color:var(--text-2);line-height:1.55}
.odoo-modcard .mc-tag{display:inline-block;margin-top:10px;padding:3px 8px;border-radius:4px;background:rgba(0,229,255,.08);color:#00E5FF;font-family:var(--font-mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase}

/* --- ODOO: Pricing transparency block --- */
.odoo-pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:860px){.odoo-pricing{grid-template-columns:1fr}}
.odoo-price-card{
  padding:26px;border-radius:18px;
  background:rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;
}
.odoo-price-card.featured{border-color:rgba(255,214,10,.4);background:linear-gradient(180deg,rgba(255,214,10,.05),rgba(10,12,16,.55))}
.odoo-price-card .pc-lbl{font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;color:var(--text-3);text-transform:uppercase}
.odoo-price-card h3{margin:8px 0 6px;font-size:22px;color:var(--text)}
.odoo-price-card .pc-price{font-family:var(--font-display);font-size:32px;color:var(--olpa);margin:10px 0}
.odoo-price-card .pc-price small{font-size:12px;color:var(--text-3);font-family:var(--font-mono)}
.odoo-price-card ul{list-style:none;padding:0;margin:16px 0 0;flex:1}
.odoo-price-card li{font-size:13px;color:var(--text-2);padding:6px 0;border-bottom:1px dashed rgba(255,255,255,.06);display:flex;gap:8px}
.odoo-price-card li::before{content:"→";color:var(--olpa);font-family:var(--font-mono)}
.odoo-price-card .btn-primary,.odoo-price-card .btn-ghost{margin-top:18px;text-align:center}

@media(max-width:560px){
  .odoo-appgrid{grid-template-columns:repeat(3,1fr)}
  .odoo-kanban{grid-template-columns:1fr}
  .odoo-pos{grid-template-columns:repeat(2,1fr)}
}

/* --- N8N mockup: workflow nodes --- */
.n8n-mockup{
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,214,10,.05),transparent 60%),
    radial-gradient(100% 80% at 100% 100%,rgba(0,229,255,.04),transparent 60%),
    rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.n8n-mockup .n8n-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:14px;margin-bottom:18px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.n8n-mockup .n8n-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;
  color:var(--text-2);text-transform:uppercase;
}
.n8n-mockup .n8n-sub{
  font-family:var(--font-mono);font-size:10px;color:var(--accent);
}
.n8n-mockup .n8n-flow{
  display:flex;flex-direction:column;align-items:stretch;gap:0;
}
.n8n-mockup .n8n-node{
  position:relative;display:flex;align-items:center;gap:12px;
  padding:12px 14px;border-radius:12px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);
}
.n8n-mockup .n8n-node-trigger{
  background:rgba(255,214,10,.06);
  border-color:rgba(255,214,10,.3);
}
.n8n-mockup .n8n-node-n{
  font-family:var(--font-mono);font-size:10px;
  padding:4px 8px;border-radius:6px;
  background:rgba(255,214,10,.12);color:var(--olpa);
}
.n8n-mockup .n8n-node-name{
  flex:1;font-size:12px;font-weight:600;color:var(--text);
}
.n8n-mockup .n8n-node-meta{
  font-family:var(--font-mono);font-size:9px;color:var(--text-3);
}
.n8n-mockup .n8n-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--text-3);
}
.n8n-mockup .n8n-dot-ok{background:#7efaa8;box-shadow:0 0 10px rgba(126,250,168,.6)}
.n8n-mockup .n8n-dot-run{background:var(--accent);box-shadow:0 0 10px var(--accent);animation:pulse 1.4s infinite}
.n8n-mockup .n8n-line{
  height:18px;width:2px;margin:2px 0 2px 30px;
  background:linear-gradient(180deg,rgba(255,214,10,.3),rgba(0,229,255,.25));
}
.n8n-mockup .n8n-foot{
  margin-top:16px;padding-top:12px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);
  text-align:center;
}

/* --- MAKE mockup: circular scenario --- */
.make-mockup{
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,214,10,.05),transparent 60%),
    radial-gradient(100% 80% at 100% 100%,rgba(0,229,255,.04),transparent 60%),
    rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.make-mockup .make-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:14px;margin-bottom:10px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.make-mockup .make-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;
  color:var(--text-2);text-transform:uppercase;
}
.make-mockup .make-sub{
  font-family:var(--font-mono);font-size:10px;color:#7efaa8;
}
.make-mockup .make-circle{
  position:relative;width:100%;aspect-ratio:1/1;max-width:360px;
  margin:6px auto 0;
}
.make-mockup .make-svg{
  position:absolute;inset:0;width:100%;height:100%;
}
.make-mockup .make-bubble{
  position:absolute;display:flex;flex-direction:column;align-items:center;
  padding:10px 12px;border-radius:12px;min-width:74px;
  background:rgba(10,12,16,.85);
  border:1px solid rgba(255,214,10,.35);
  transform:translate(-50%,-50%);
}
.make-mockup .make-n{
  font-family:var(--font-mono);font-size:9px;color:var(--olpa);
  padding:1px 5px;border-radius:4px;background:rgba(255,214,10,.1);
  margin-bottom:4px;
}
.make-mockup .make-name{
  font-size:11px;font-weight:600;color:var(--text);
}
.make-mockup .make-b1{left:50%;top:6%}
.make-mockup .make-b2{left:92%;top:35%}
.make-mockup .make-b3{left:78%;top:86%}
.make-mockup .make-b4{left:22%;top:86%}
.make-mockup .make-b5{left:8%;top:35%}
.make-mockup .make-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  display:flex;flex-direction:column;align-items:center;
  padding:14px 18px;border-radius:14px;
  background:rgba(255,214,10,.08);
  border:1px solid rgba(255,214,10,.4);
}
.make-mockup .make-ops{
  font-family:var(--font-mono);font-size:20px;font-weight:700;
  color:var(--olpa);
}
.make-mockup .make-ops-l{
  font-family:var(--font-mono);font-size:9px;color:var(--text-3);
  text-transform:uppercase;letter-spacing:.12em;
}
.make-mockup .make-foot{
  margin-top:14px;padding-top:12px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);
  text-align:center;
}

/* --- WORDPRESS mockup: admin dashboard --- */
.wp-mockup{
  max-width:460px;margin:0 auto;padding:0;border-radius:20px;overflow:hidden;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,214,10,.05),transparent 60%),
    radial-gradient(100% 80% at 100% 100%,rgba(0,229,255,.04),transparent 60%),
    rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.wp-mockup .wp-head{
  display:flex;align-items:center;gap:10px;
  padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.02);
}
.wp-mockup .wp-dots{display:flex;gap:5px}
.wp-mockup .wp-dots span{
  width:9px;height:9px;border-radius:50%;
  background:rgba(255,255,255,.18);
}
.wp-mockup .wp-url{
  flex:1;font-family:var(--font-mono);font-size:10px;color:var(--text-3);
  padding:5px 10px;border-radius:6px;
  background:rgba(255,255,255,.03);text-align:center;
}
.wp-mockup .wp-body{
  display:grid;grid-template-columns:140px 1fr;gap:0;
}
.wp-mockup .wp-side{
  padding:16px 10px;border-right:1px dashed rgba(255,255,255,.08);
  display:flex;flex-direction:column;gap:4px;
}
.wp-mockup .wp-side-item{
  display:flex;align-items:center;gap:8px;
  padding:7px 9px;border-radius:8px;
  font-size:11px;color:var(--text-3);
}
.wp-mockup .wp-side-item.wp-active{
  background:rgba(255,214,10,.1);color:var(--olpa);
  border:1px solid rgba(255,214,10,.28);
}
.wp-mockup .wp-n{
  font-family:var(--font-mono);font-size:9px;
  padding:1px 5px;border-radius:4px;
  background:rgba(255,255,255,.05);color:var(--text-2);
}
.wp-mockup .wp-side-item.wp-active .wp-n{
  background:rgba(255,214,10,.2);color:var(--olpa);
}
.wp-mockup .wp-main{padding:16px}
.wp-mockup .wp-card-hero{
  padding:14px;border-radius:12px;
  background:rgba(255,214,10,.06);
  border:1px solid rgba(255,214,10,.25);
  margin-bottom:12px;
}
.wp-mockup .wp-card-l{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;
  color:var(--text-3);text-transform:uppercase;margin-bottom:6px;
}
.wp-mockup .wp-card-big{
  font-family:var(--font-mono);font-size:32px;font-weight:700;
  color:var(--olpa);line-height:1;
}
.wp-mockup .wp-card-unit{
  font-size:14px;color:var(--text-3);margin-left:3px;
}
.wp-mockup .wp-card-bar{
  margin-top:10px;height:5px;border-radius:3px;
  background:rgba(255,255,255,.06);overflow:hidden;
}
.wp-mockup .wp-card-bar span{
  display:block;height:100%;
  background:linear-gradient(90deg,var(--olpa),var(--accent));
}
.wp-mockup .wp-row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
.wp-mockup .wp-stat{
  padding:9px;border-radius:10px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
  text-align:center;
}
.wp-mockup .wp-stat-n{
  font-family:var(--font-mono);font-size:13px;font-weight:700;color:var(--text);
}
.wp-mockup .wp-stat-l{
  font-family:var(--font-mono);font-size:9px;color:var(--text-3);
  text-transform:uppercase;letter-spacing:.1em;margin-top:2px;
}
.wp-mockup .wp-foot{
  padding:10px 16px 14px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);
  text-align:center;
}
@media (max-width:640px){
  .wp-mockup .wp-body{grid-template-columns:1fr}
  .wp-mockup .wp-side{flex-direction:row;flex-wrap:wrap;border-right:none;border-bottom:1px dashed rgba(255,255,255,.08)}
}

/* --- KOMMO mockup: CRM + WhatsApp pipeline --- */
.kommo-mockup{
  max-width:460px;margin:0 auto;padding:20px;border-radius:20px;
  background:linear-gradient(155deg,rgba(255,214,10,.05),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.kommo-mockup .km-head{
  border-bottom:1px dashed rgba(255,255,255,.1);padding-bottom:12px;margin-bottom:14px;
}
.kommo-mockup .km-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:4px;
}
.kommo-mockup .km-sub{font-size:11px;color:var(--text-2);font-family:var(--font-mono)}
.kommo-mockup .km-body{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kommo-mockup .km-chats-label{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;
  color:var(--text-3);text-transform:uppercase;margin-bottom:8px;
}
.kommo-mockup .km-chats{display:flex;flex-direction:column;gap:6px}
.kommo-mockup .km-chat{
  display:grid;grid-template-columns:26px 1fr;gap:8px;align-items:center;
  padding:7px 8px;border-radius:8px;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);
}
.kommo-mockup .km-chat-active{
  background:rgba(255,214,10,.06);border-color:rgba(255,214,10,.25);
}
.kommo-mockup .km-av{
  width:26px;height:26px;border-radius:50%;
  background:linear-gradient(135deg,rgba(255,214,10,.2),rgba(0,229,255,.15));
  border:1px solid rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:9px;font-weight:700;color:var(--text);
}
.kommo-mockup .km-chat-name{
  font-size:11px;font-weight:600;color:var(--text);
  display:flex;align-items:center;gap:6px;margin-bottom:1px;
}
.kommo-mockup .km-chat-msg{
  font-size:9.5px;color:var(--text-2);font-family:var(--font-mono);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px;
}
.kommo-mockup .km-badge{
  font-family:var(--font-mono);font-size:7.5px;font-weight:700;
  padding:1px 5px;border-radius:4px;letter-spacing:.05em;
}
.kommo-mockup .km-badge.km-wa{
  background:rgba(37,211,102,.15);color:#25d366;border:1px solid rgba(37,211,102,.35);
}
.kommo-mockup .km-badge.km-ig{
  background:rgba(225,48,108,.15);color:#e1306c;border:1px solid rgba(225,48,108,.35);
}
.kommo-mockup .km-pipeline{display:flex;flex-direction:column;gap:6px}
.kommo-mockup .km-stage{
  padding:7px 9px;border-radius:8px;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);
}
.kommo-mockup .km-stage-head{
  display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;
}
.kommo-mockup .km-stage-name{
  font-family:var(--font-mono);font-size:8.5px;letter-spacing:.08em;
  font-weight:700;color:var(--text-2);text-transform:uppercase;
}
.kommo-mockup .km-stage-n{font-family:var(--font-mono);font-size:9px;color:var(--text-3)}
.kommo-mockup .km-stage-now{background:rgba(255,214,10,.07);border-color:rgba(255,214,10,.3)}
.kommo-mockup .km-stage-now .km-stage-name{color:var(--olpa)}
.kommo-mockup .km-stage-done{background:rgba(0,229,255,.06);border-color:rgba(0,229,255,.25)}
.kommo-mockup .km-stage-done .km-stage-name{color:var(--accent)}
.kommo-mockup .km-deal{font-size:9.5px;color:var(--text-2);font-family:var(--font-mono);padding:2px 0}
.kommo-mockup .km-deal-hot{color:var(--olpa);font-weight:700}
.kommo-mockup .km-footer{
  margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);text-align:center;
}

/* --- DOPPLER mockup: email campaign builder --- */
.doppler-mockup{
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:linear-gradient(155deg,rgba(255,214,10,.05),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.doppler-mockup .dp-head{
  border-bottom:1px dashed rgba(255,255,255,.1);padding-bottom:12px;margin-bottom:14px;
}
.doppler-mockup .dp-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:4px;
}
.doppler-mockup .dp-sub{font-size:11px;color:var(--text-2);font-family:var(--font-mono)}
.doppler-mockup .dp-meta{
  display:flex;flex-direction:column;gap:6px;margin-bottom:14px;
  padding:10px 12px;border-radius:10px;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);
}
.doppler-mockup .dp-meta-row{display:flex;gap:10px;align-items:baseline}
.doppler-mockup .dp-meta-row span{
  font-family:var(--font-mono);font-size:8px;letter-spacing:.12em;
  color:var(--text-3);text-transform:uppercase;min-width:52px;
}
.doppler-mockup .dp-meta-row strong{
  font-size:11px;color:var(--text);font-family:var(--font-display);font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.doppler-mockup .dp-preview{
  border-radius:10px;overflow:hidden;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);
  margin-bottom:14px;
}
.doppler-mockup .dp-prev-hero{padding:10px 12px 0}
.doppler-mockup .dp-prev-logo{
  font-family:var(--font-display);font-size:11px;font-weight:800;
  color:var(--olpa);letter-spacing:.12em;margin-bottom:8px;
}
.doppler-mockup .dp-prev-img{
  height:74px;border-radius:6px;
  background:linear-gradient(135deg,rgba(255,214,10,.12),rgba(0,229,255,.1));
  border:1px dashed rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;
}
.doppler-mockup .dp-prev-img-tag{
  font-family:var(--font-mono);font-size:9px;color:var(--text-3);letter-spacing:.1em;
}
.doppler-mockup .dp-prev-body{padding:12px}
.doppler-mockup .dp-prev-h{
  font-size:13px;font-weight:700;color:var(--text);margin-bottom:4px;
}
.doppler-mockup .dp-prev-p{font-size:10px;color:var(--text-2);margin-bottom:10px}
.doppler-mockup .dp-prev-cta{
  display:inline-block;padding:6px 12px;border-radius:6px;
  background:var(--olpa);color:#0a0a0a;font-family:var(--font-mono);
  font-size:9px;font-weight:700;letter-spacing:.08em;
}
.doppler-mockup .dp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.doppler-mockup .dp-stat{
  padding:8px 6px;border-radius:8px;text-align:center;
  background:rgba(0,229,255,.05);border:1px solid rgba(0,229,255,.18);
}
.doppler-mockup .dp-stat span{
  display:block;font-family:var(--font-mono);font-size:8px;
  color:var(--text-3);letter-spacing:.12em;margin-bottom:3px;
}
.doppler-mockup .dp-stat strong{
  font-family:var(--font-display);font-size:14px;font-weight:700;color:var(--accent);
}
.doppler-mockup .dp-footer{
  margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);text-align:center;
}

/* --- CALLBELL mockup: multichannel inbox --- */
.callbell-mockup{
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:linear-gradient(155deg,rgba(255,214,10,.05),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.callbell-mockup .cb-head{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  border-bottom:1px dashed rgba(255,255,255,.1);padding-bottom:12px;margin-bottom:14px;
}
.callbell-mockup .cb-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:4px;
}
.callbell-mockup .cb-sub{font-size:11px;color:var(--text-2);font-family:var(--font-mono)}
.callbell-mockup .cb-status-dot{
  width:8px;height:8px;border-radius:50%;background:#22c55e;
  box-shadow:0 0 10px rgba(34,197,94,.6);animation:pulse 2s infinite;
}
.callbell-mockup .cb-inbox{display:flex;flex-direction:column;gap:8px}
.callbell-mockup .cb-conv{
  display:grid;grid-template-columns:6px 1fr auto;gap:10px;align-items:center;
  padding:10px 12px;border-radius:10px;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);
  transition:all .25s;
}
.callbell-mockup .cb-conv-active{
  background:rgba(255,214,10,.06);border-color:rgba(255,214,10,.25);
  box-shadow:0 0 0 1px rgba(255,214,10,.12);
}
.callbell-mockup .cb-ch{
  width:6px;align-self:stretch;border-radius:3px;min-height:36px;
}
.callbell-mockup .cb-ch-wa{background:#25d366;box-shadow:0 0 8px rgba(37,211,102,.5)}
.callbell-mockup .cb-ch-ig{background:#e1306c;box-shadow:0 0 8px rgba(225,48,108,.5)}
.callbell-mockup .cb-ch-tg{background:#2aabee;box-shadow:0 0 8px rgba(42,171,238,.5)}
.callbell-mockup .cb-ch-msg{background:#0084ff;box-shadow:0 0 8px rgba(0,132,255,.5)}
.callbell-mockup .cb-conv-info{min-width:0}
.callbell-mockup .cb-conv-name{font-size:12px;font-weight:600;color:var(--text);margin-bottom:2px}
.callbell-mockup .cb-conv-msg{
  font-size:10px;color:var(--text-2);font-family:var(--font-mono);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px;
}
.callbell-mockup .cb-conv-side{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.callbell-mockup .cb-agent{
  width:26px;height:26px;border-radius:50%;
  background:linear-gradient(135deg,rgba(0,229,255,.25),rgba(255,214,10,.15));
  border:1px solid rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:8.5px;font-weight:700;color:var(--text);
  letter-spacing:.04em;
}
.callbell-mockup .cb-badge{
  font-family:var(--font-mono);font-size:7.5px;font-weight:700;
  padding:2px 6px;border-radius:4px;letter-spacing:.08em;
  background:rgba(255,255,255,.06);color:var(--text-3);
  border:1px solid rgba(255,255,255,.08);
}
.callbell-mockup .cb-badge-now{
  background:rgba(255,214,10,.15);color:var(--olpa);border-color:rgba(255,214,10,.4);
}
.callbell-mockup .cb-badge-ok{
  background:rgba(34,197,94,.12);color:#22c55e;border-color:rgba(34,197,94,.35);
}
.callbell-mockup .cb-footer{
  margin-top:14px;padding-top:12px;border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);text-align:center;
}

@media (max-width:640px){
  .kommo-mockup,.doppler-mockup,.callbell-mockup{max-width:340px}
  .kommo-mockup .km-body{grid-template-columns:1fr}
}

/* ======================================================================
   HERRAMIENTAS · SHOPIFY · TIENDANUBE · GOOGLE ADS mockups
   ====================================================================== */

/* ---------- SHOPIFY ADMIN MOCKUP ---------- */
.shopify-mockup{
  max-width:460px;margin:0 auto;padding:18px;border-radius:20px;
  background:linear-gradient(160deg,rgba(255,214,10,.05),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
  font-family:var(--font-mono);backdrop-filter:blur(14px);
}
.shopify-mockup .sh-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding-bottom:12px;margin-bottom:14px;
  border-bottom:1px dashed rgba(255,255,255,.08);
}
.shopify-mockup .sh-logo{font-size:14px;font-weight:700;color:var(--olpa);letter-spacing:.02em}
.shopify-mockup .sh-store{font-size:10px;color:var(--text-3)}
.shopify-mockup .sh-currency{
  font-size:9px;color:var(--accent);padding:3px 8px;
  border:1px solid rgba(0,229,255,.25);border-radius:20px;
  background:rgba(0,229,255,.05);
}
.shopify-mockup .sh-body{display:grid;grid-template-columns:110px 1fr;gap:14px}
.shopify-mockup .sh-side{
  display:flex;flex-direction:column;gap:6px;
  padding-right:10px;border-right:1px dashed rgba(255,255,255,.06);
}
.shopify-mockup .sh-nav{font-size:10px;color:var(--text-2);padding:6px 8px;border-radius:6px}
.shopify-mockup .sh-nav-active{
  background:rgba(255,214,10,.08);color:var(--olpa);
  border-left:2px solid var(--olpa);
}
.shopify-mockup .sh-main{display:flex;flex-direction:column;gap:10px}
.shopify-mockup .sh-metric{padding:10px 0 4px}
.shopify-mockup .sh-metric-label{font-size:9px;color:var(--text-3);letter-spacing:.12em}
.shopify-mockup .sh-metric-value{font-size:22px;font-weight:700;color:var(--text);margin-top:4px}
.shopify-mockup .sh-metric-delta{font-size:10px;color:var(--accent);margin-top:3px}
.shopify-mockup .sh-chart{width:100%;height:56px;margin-top:4px}
.shopify-mockup .sh-orders-head{font-size:9px;color:var(--text-3);letter-spacing:.12em;margin-top:8px}
.shopify-mockup .sh-orders{display:flex;flex-direction:column;gap:4px}
.shopify-mockup .sh-order{
  display:grid;grid-template-columns:42px 1fr auto 44px;gap:6px;
  font-size:10px;color:var(--text-2);
  padding:5px 8px;border-radius:6px;
  background:rgba(0,229,255,.04);
  border-left:2px solid #3bd37a;
}
.shopify-mockup .sh-oid{color:var(--text-3)}
.shopify-mockup .sh-oname{color:var(--text-2)}
.shopify-mockup .sh-oprice{color:var(--text);font-weight:600}
.shopify-mockup .sh-ostat{font-size:8px;color:#3bd37a;text-align:right;text-transform:uppercase}
.shopify-mockup .sh-foot{
  margin-top:14px;padding-top:10px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-size:9px;color:var(--text-3);text-align:center;
}

/* ---------- TIENDANUBE STOREFRONT MOCKUP ---------- */
.tn-mockup{
  max-width:460px;margin:0 auto;padding:18px;border-radius:20px;
  background:linear-gradient(160deg,rgba(255,214,10,.05),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
  font-family:var(--font-mono);backdrop-filter:blur(14px);
}
.tn-mockup .tn-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding-bottom:10px;
}
.tn-mockup .tn-logo{font-size:13px;font-weight:700;color:var(--olpa)}
.tn-mockup .tn-store{font-size:9px;color:var(--text-3)}
.tn-mockup .tn-cart{
  font-size:9px;color:var(--accent);
  padding:3px 8px;border:1px solid rgba(0,229,255,.25);
  border-radius:20px;background:rgba(0,229,255,.05);
}
.tn-mockup .tn-nav{
  display:flex;gap:14px;
  padding:8px 0;margin-bottom:12px;
  border-top:1px dashed rgba(255,255,255,.08);
  border-bottom:1px dashed rgba(255,255,255,.08);
  font-size:9px;color:var(--text-2);text-transform:uppercase;letter-spacing:.1em;
}
.tn-mockup .tn-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tn-mockup .tn-card{
  padding:8px;border-radius:8px;
  background:rgba(0,229,255,.04);
  border:1px solid rgba(255,255,255,.05);
}
.tn-mockup .tn-img{aspect-ratio:1/1;border-radius:6px;margin-bottom:6px}
.tn-mockup .tn-img-1{background:linear-gradient(135deg,#2a2f3a,#1a1f2a)}
.tn-mockup .tn-img-2{background:linear-gradient(135deg,#3a2a2a,#2a1a1a)}
.tn-mockup .tn-img-3{background:linear-gradient(135deg,#2a3a2f,#1a2a1f)}
.tn-mockup .tn-name{font-size:9px;color:var(--text);font-weight:600}
.tn-mockup .tn-price{font-size:10px;color:var(--olpa);font-weight:700;margin-top:2px}
.tn-mockup .tn-cuotas{font-size:8px;color:var(--accent);margin-top:2px}
.tn-mockup .tn-badges{display:flex;flex-direction:column;gap:5px;margin-top:12px}
.tn-mockup .tn-badge{
  font-size:9px;padding:6px 10px;border-radius:6px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(0,229,255,.04);color:var(--text-2);
}
.tn-mockup .tn-mp{border-left:2px solid #00b1ea}
.tn-mockup .tn-me{border-left:2px solid #ffd60a}
.tn-mockup .tn-afip{border-left:2px solid #3bd37a}
.tn-mockup .tn-foot{
  margin-top:12px;padding-top:10px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-size:9px;color:var(--text-3);text-align:center;
}

/* ---------- GOOGLE ADS DASHBOARD MOCKUP ---------- */
.gads-mockup{
  max-width:460px;margin:0 auto;padding:18px;border-radius:20px;
  background:linear-gradient(160deg,rgba(255,214,10,.05),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
  font-family:var(--font-mono);backdrop-filter:blur(14px);
}
.gads-mockup .gads-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding-bottom:10px;border-bottom:1px dashed rgba(255,255,255,.08);
}
.gads-mockup .gads-logo{
  display:flex;align-items:center;gap:4px;
  font-size:12px;font-weight:700;color:var(--text);
}
.gads-mockup .gads-logo span{width:7px;height:7px;border-radius:50%;display:inline-block}
.gads-mockup .gads-dot-b{background:#4285f4}
.gads-mockup .gads-dot-r{background:#ea4335}
.gads-mockup .gads-dot-y{background:#fbbc04}
.gads-mockup .gads-dot-g{background:#34a853;margin-right:6px}
.gads-mockup .gads-acct{font-size:9px;color:var(--text-3)}
.gads-mockup .gads-range{
  font-size:9px;color:var(--accent);
  padding:3px 8px;border:1px solid rgba(0,229,255,.25);
  border-radius:20px;background:rgba(0,229,255,.05);
}
.gads-mockup .gads-tabs{
  display:flex;gap:12px;margin:12px 0 10px;
  font-size:9px;color:var(--text-3);text-transform:uppercase;letter-spacing:.1em;
}
.gads-mockup .gads-tab-active{
  color:var(--olpa);border-bottom:2px solid var(--olpa);padding-bottom:4px;
}
.gads-mockup .gads-table{display:flex;flex-direction:column;gap:5px}
.gads-mockup .gads-row{
  display:grid;grid-template-columns:1.8fr 1fr 50px 50px;gap:8px;
  align-items:center;padding:8px 10px;border-radius:6px;
  background:rgba(0,229,255,.04);
  border:1px solid rgba(255,255,255,.05);
  font-size:10px;color:var(--text-2);
}
.gads-mockup .gads-row-h{
  background:transparent;border:none;
  font-size:9px;color:var(--text-3);text-transform:uppercase;letter-spacing:.1em;
  padding:2px 10px 0;
}
.gads-mockup .gads-c1{
  display:flex;align-items:center;gap:8px;color:var(--text);font-weight:600;
}
.gads-mockup .gads-type{
  font-size:8px;padding:2px 6px;border-radius:3px;
  background:rgba(66,133,244,.15);color:#4285f4;
  text-transform:uppercase;letter-spacing:.08em;
}
.gads-mockup .gads-type-pmax{background:rgba(255,214,10,.15);color:var(--olpa)}
.gads-mockup .gads-type-shop{background:rgba(59,211,122,.15);color:#3bd37a}
.gads-mockup .gads-c2{display:flex;align-items:center;gap:6px}
.gads-mockup .gads-bar{
  height:4px;border-radius:2px;
  background:linear-gradient(90deg,var(--accent),var(--olpa));
  min-width:6px;max-width:60px;
}
.gads-mockup .gads-c3{color:var(--accent);font-weight:600;text-align:right}
.gads-mockup .gads-c4{color:var(--olpa);font-weight:700;text-align:right}
.gads-mockup .gads-foot{
  margin-top:14px;padding-top:10px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-2);text-align:center;font-weight:600;
}

/* ==========================================================================
   HERRAMIENTAS · META BUSINESS · BITRIX24 · PIPEDRIVE mockups
   ========================================================================== */

/* ---------- META BUSINESS · ADS MANAGER MOCKUP ---------- */
.meta-mockup{
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,214,10,.05),transparent 60%),
    radial-gradient(100% 80% at 100% 100%,rgba(0,229,255,.04),transparent 60%),
    rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.meta-mockup .mm-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:14px;margin-bottom:14px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.meta-mockup .mm-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;
  color:var(--text-2);text-transform:uppercase;
}
.meta-mockup .mm-sub{
  font-family:var(--font-mono);font-size:9px;color:var(--accent);
}
.meta-mockup .mm-sets{display:flex;flex-direction:column;gap:8px}
.meta-mockup .mm-set{
  padding:10px 12px;border-radius:10px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
}
.meta-mockup .mm-set-row{
  display:flex;align-items:center;gap:8px;margin-bottom:8px;
}
.meta-mockup .mm-tag{
  font-family:var(--font-mono);font-size:8px;letter-spacing:.1em;
  padding:3px 7px;border-radius:4px;text-transform:uppercase;font-weight:700;
}
.meta-mockup .mm-tag-feed{background:rgba(255,214,10,.12);color:var(--olpa)}
.meta-mockup .mm-tag-reels{background:rgba(0,229,255,.12);color:var(--accent)}
.meta-mockup .mm-tag-stories{background:rgba(234,67,53,.15);color:#ea6a5e}
.meta-mockup .mm-set-name{
  flex:1;font-size:11px;color:var(--text);font-weight:600;
}
.meta-mockup .mm-dot{width:8px;height:8px;border-radius:50%;background:var(--text-3)}
.meta-mockup .mm-dot-on{background:#7efaa8;box-shadow:0 0 8px rgba(126,250,168,.6)}
.meta-mockup .mm-dot-warn{background:#ffd60a;box-shadow:0 0 8px rgba(255,214,10,.5)}
.meta-mockup .mm-metrics{
  display:grid;grid-template-columns:repeat(3,1fr);gap:6px;
}
.meta-mockup .mm-metrics>div{
  display:flex;flex-direction:column;gap:2px;
  padding:5px 7px;border-radius:6px;
  background:rgba(255,255,255,.025);
}
.meta-mockup .mm-k{
  font-family:var(--font-mono);font-size:8px;
  color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;
}
.meta-mockup .mm-v{
  font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--text);
}
.meta-mockup .mm-chart{
  margin-top:14px;padding-top:12px;
  border-top:1px dashed rgba(255,255,255,.08);
}
.meta-mockup .mm-bars{
  display:flex;align-items:flex-end;gap:6px;height:48px;
}
.meta-mockup .mm-bars span{
  flex:1;border-radius:3px 3px 0 0;
  background:linear-gradient(180deg,var(--olpa),var(--accent));
  opacity:.85;
}
.meta-mockup .mm-chart-foot{
  margin-top:10px;font-family:var(--font-mono);font-size:10px;
  color:var(--text-2);text-align:center;font-weight:600;
}

/* ---------- BITRIX24 · UNIFIED WORKSPACE MOCKUP ---------- */
.bitrix-mockup{
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,214,10,.05),transparent 60%),
    radial-gradient(100% 80% at 100% 100%,rgba(0,229,255,.04),transparent 60%),
    rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.bitrix-mockup .bx-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:12px;margin-bottom:14px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.bitrix-mockup .bx-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;
  color:var(--text-2);text-transform:uppercase;
}
.bitrix-mockup .bx-tabs{display:flex;gap:8px}
.bitrix-mockup .bx-tab{
  font-family:var(--font-mono);font-size:9px;
  padding:4px 9px;border-radius:4px;
  background:rgba(255,255,255,.04);color:var(--text-3);
}
.bitrix-mockup .bx-tab-on{
  background:rgba(255,214,10,.12);color:var(--olpa);
  border:1px solid rgba(255,214,10,.3);
}
.bitrix-mockup .bx-body{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px;
}
.bitrix-mockup .bx-col{
  padding:10px;border-radius:10px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);
}
.bitrix-mockup .bx-col-title{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;
  color:var(--text-3);text-transform:uppercase;margin-bottom:8px;
}
.bitrix-mockup .bx-deal{
  padding:7px 9px;border-radius:7px;margin-bottom:6px;
  background:rgba(10,12,16,.5);
  border:1px solid rgba(255,255,255,.05);
  border-left:2px solid var(--accent);
}
.bitrix-mockup .bx-deal-hot{
  border-left-color:var(--olpa);
  background:rgba(255,214,10,.06);
}
.bitrix-mockup .bx-deal-name{
  font-size:10px;color:var(--text);font-weight:600;
}
.bitrix-mockup .bx-deal-amt{
  font-family:var(--font-mono);font-size:10px;
  color:var(--olpa);font-weight:700;margin-top:2px;
}
.bitrix-mockup .bx-calls{
  padding:10px;border-radius:10px;margin-bottom:10px;
  background:rgba(0,229,255,.04);
  border:1px solid rgba(0,229,255,.12);
  display:flex;flex-direction:column;gap:6px;
}
.bitrix-mockup .bx-call{
  display:flex;align-items:center;gap:8px;
  font-size:10px;color:var(--text-2);
  font-family:var(--font-mono);
}
.bitrix-mockup .bx-call-ic{
  width:16px;height:16px;border-radius:4px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(126,250,168,.15);color:#7efaa8;font-size:10px;
}
.bitrix-mockup .bx-call-out{background:rgba(0,229,255,.15);color:var(--accent)}
.bitrix-mockup .bx-call-name{flex:1;color:var(--text)}
.bitrix-mockup .bx-call-time{color:var(--text-3);font-size:9px}
.bitrix-mockup .bx-tasks{
  padding:10px;border-radius:10px;
  background:rgba(255,214,10,.04);
  border:1px solid rgba(255,214,10,.14);
  display:flex;flex-direction:column;gap:5px;
}
.bitrix-mockup .bx-task{
  display:flex;align-items:center;gap:8px;
  font-size:10px;color:var(--text-2);
}
.bitrix-mockup .bx-chk{
  width:14px;height:14px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(126,250,168,.18);color:#7efaa8;
  font-size:9px;font-weight:700;
}
.bitrix-mockup .bx-chk-off{
  background:transparent;color:var(--text-3);
  border:1px solid rgba(255,255,255,.15);
}
.bitrix-mockup .bx-footer{
  margin-top:12px;padding-top:10px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-3);text-align:center;
}

/* ---------- PIPEDRIVE · KANBAN PIPELINE MOCKUP ---------- */
.pipedrive-mockup{
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:
    radial-gradient(120% 80% at 20% 0%,rgba(255,214,10,.05),transparent 60%),
    radial-gradient(100% 80% at 100% 100%,rgba(0,229,255,.04),transparent 60%),
    rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.pipedrive-mockup .pd-head{
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:12px;margin-bottom:14px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.pipedrive-mockup .pd-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;
  color:var(--text-2);text-transform:uppercase;
}
.pipedrive-mockup .pd-sub{
  font-family:var(--font-mono);font-size:9px;color:var(--olpa);font-weight:600;
}
.pipedrive-mockup .pd-kanban{
  display:grid;grid-template-columns:repeat(5,1fr);gap:6px;
}
.pipedrive-mockup .pd-col{
  padding:8px 6px;border-radius:8px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.05);
  display:flex;flex-direction:column;gap:5px;
}
.pipedrive-mockup .pd-col-head{
  display:flex;align-items:center;justify-content:space-between;
  padding-bottom:6px;margin-bottom:2px;
  border-bottom:1px dashed rgba(255,255,255,.08);
  font-family:var(--font-mono);font-size:7px;
  color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;
}
.pipedrive-mockup .pd-col-n{
  background:rgba(255,255,255,.06);
  padding:1px 5px;border-radius:3px;color:var(--text-2);
}
.pipedrive-mockup .pd-card{
  padding:6px 7px;border-radius:6px;
  background:rgba(10,12,16,.5);
  border:1px solid rgba(255,255,255,.05);
  border-left:2px solid var(--accent);
}
.pipedrive-mockup .pd-card-hot{
  border-left-color:var(--olpa);
  background:rgba(255,214,10,.05);
}
.pipedrive-mockup .pd-card-won{
  border-left-color:#7efaa8;
  background:rgba(126,250,168,.05);
}
.pipedrive-mockup .pd-amt{
  font-family:var(--font-mono);font-size:10px;
  color:var(--olpa);font-weight:700;
}
.pipedrive-mockup .pd-card-won .pd-amt{color:#7efaa8}
.pipedrive-mockup .pd-owner{
  display:flex;align-items:center;gap:5px;margin-top:4px;
  font-size:8px;color:var(--text-2);font-family:var(--font-mono);
}
.pipedrive-mockup .pd-av{
  width:14px;height:14px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--olpa),var(--accent));
  color:#0a0c10;font-size:7px;font-weight:700;
}
.pipedrive-mockup .pd-footer{
  margin-top:14px;padding-top:12px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-3);text-align:center;
}
@media (max-width:640px){
  .pipedrive-mockup .pd-kanban{grid-template-columns:repeat(3,1fr)}
}

/* ============================================================
   N8N HERO CANVAS — rich multi-branch workflow mockup
   ============================================================ */
.n8n-mockup-hero{
  position:relative;max-width:560px;margin:0 auto;padding:24px 22px 22px;
  border-radius:22px;
  background:
    radial-gradient(120% 80% at 15% 0%,rgba(255,214,10,.07),transparent 55%),
    radial-gradient(100% 80% at 100% 100%,rgba(0,229,255,.06),transparent 55%),
    linear-gradient(180deg,rgba(14,16,22,.82),rgba(10,12,16,.72));
  border:1px solid rgba(255,255,255,.09);
  backdrop-filter:blur(16px);
  box-shadow:0 40px 90px -40px rgba(0,0,0,.7),0 0 0 1px rgba(255,214,10,.04) inset;
  overflow:hidden;
}
.n8n-mockup-hero::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:22px 22px;
  mask-image:radial-gradient(circle at 50% 50%,#000 40%,transparent 85%);
}
.n8n-mockup-hero .nh-head{
  position:relative;display:flex;justify-content:space-between;align-items:center;
  padding-bottom:12px;margin-bottom:18px;
  border-bottom:1px dashed rgba(255,255,255,.11);
}
.n8n-mockup-hero .nh-dots{display:flex;gap:6px}
.n8n-mockup-hero .nh-dots span{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.12)}
.n8n-mockup-hero .nh-dots span:nth-child(1){background:#ff5f57}
.n8n-mockup-hero .nh-dots span:nth-child(2){background:#ffbd2e}
.n8n-mockup-hero .nh-dots span:nth-child(3){background:#28c841}
.n8n-mockup-hero .nh-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;
  color:var(--text-2);text-transform:uppercase;
}
.n8n-mockup-hero .nh-tag{
  font-family:var(--font-mono);font-size:9px;color:var(--accent);
  padding:3px 8px;border-radius:999px;background:rgba(0,229,255,.08);
  border:1px solid rgba(0,229,255,.25);
}
.n8n-mockup-hero .nh-canvas{
  position:relative;display:grid;grid-template-columns:1fr 1fr;gap:14px 28px;
  padding:10px 4px 6px;
}
.n8n-mockup-hero .nh-row{display:flex;flex-direction:column;gap:10px;position:relative}
.n8n-mockup-hero .nh-col-sep{
  position:absolute;top:10px;bottom:10px;left:50%;width:2px;
  background:linear-gradient(180deg,rgba(255,214,10,.25),rgba(0,229,255,.22));
  transform:translateX(-50%);opacity:.55;
}
.n8n-mockup-hero .nh-node{
  position:relative;display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:12px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.09);
  transition:transform .3s ease;
}
.n8n-mockup-hero .nh-node.is-trigger{
  background:linear-gradient(135deg,rgba(255,214,10,.1),rgba(255,214,10,.03));
  border-color:rgba(255,214,10,.35);
}
.n8n-mockup-hero .nh-node.is-ai{
  background:linear-gradient(135deg,rgba(0,229,255,.08),rgba(0,229,255,.02));
  border-color:rgba(0,229,255,.3);
}
.n8n-mockup-hero .nh-node.is-branch{
  background:rgba(255,214,10,.04);
  border-style:dashed;border-color:rgba(255,214,10,.28);
}
.n8n-mockup-hero .nh-icon{
  width:26px;height:26px;border-radius:7px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-mono);font-size:10px;font-weight:700;
  background:rgba(255,214,10,.14);color:var(--olpa);
  border:1px solid rgba(255,214,10,.3);
}
.n8n-mockup-hero .nh-node.is-ai .nh-icon{
  background:rgba(0,229,255,.14);color:var(--accent);
  border-color:rgba(0,229,255,.32);
}
.n8n-mockup-hero .nh-body{flex:1;min-width:0}
.n8n-mockup-hero .nh-name{
  font-size:12px;font-weight:600;color:var(--text);line-height:1.25;
}
.n8n-mockup-hero .nh-meta{
  font-family:var(--font-mono);font-size:9px;color:var(--text-3);
  margin-top:2px;letter-spacing:.04em;
}
.n8n-mockup-hero .nh-status{
  width:8px;height:8px;border-radius:50%;flex-shrink:0;
}
.n8n-mockup-hero .nh-status.ok{background:#7efaa8;box-shadow:0 0 8px rgba(126,250,168,.6)}
.n8n-mockup-hero .nh-status.run{background:var(--accent);box-shadow:0 0 10px var(--accent);animation:pulse 1.4s infinite}
.n8n-mockup-hero .nh-status.idle{background:rgba(255,255,255,.2)}
.n8n-mockup-hero .nh-preview{
  margin-top:6px;padding:8px 10px;border-radius:8px;
  background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.06);
  font-family:var(--font-mono);font-size:9px;color:var(--text-2);
  line-height:1.5;
}
.n8n-mockup-hero .nh-preview b{color:var(--olpa);font-weight:600}
.n8n-mockup-hero .nh-preview i{color:var(--accent);font-style:normal}
.n8n-mockup-hero .nh-edge-label{
  align-self:center;font-family:var(--font-mono);font-size:9px;
  color:var(--text-3);padding:2px 8px;border-radius:999px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  width:max-content;margin:0 auto;
}
.n8n-mockup-hero .nh-foot{
  margin-top:16px;padding-top:12px;display:flex;justify-content:space-between;
  border-top:1px dashed rgba(255,255,255,.09);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);
}
.n8n-mockup-hero .nh-foot b{color:#7efaa8;font-weight:600}

/* ============================================================
   N8N SECONDARY CANVAS — AI agent flow (mid-page)
   ============================================================ */
.n8n-canvas-agent{
  position:relative;max-width:880px;margin:0 auto;padding:28px;
  border-radius:24px;
  background:
    radial-gradient(60% 100% at 0% 0%,rgba(255,214,10,.05),transparent 60%),
    radial-gradient(80% 100% at 100% 100%,rgba(0,229,255,.05),transparent 60%),
    rgba(10,12,16,.6);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
  overflow:hidden;
}
.n8n-canvas-agent::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.28;
  background-image:
    radial-gradient(rgba(255,255,255,.08) 1px,transparent 1px);
  background-size:18px 18px;
  mask-image:radial-gradient(ellipse at 50% 50%,#000 30%,transparent 85%);
}
.n8n-canvas-agent .ag-head{
  position:relative;display:flex;justify-content:space-between;align-items:center;
  margin-bottom:22px;padding-bottom:14px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.n8n-canvas-agent .ag-title{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.2em;
  color:var(--text-2);text-transform:uppercase;
}
.n8n-canvas-agent .ag-live{
  font-family:var(--font-mono);font-size:10px;color:#7efaa8;
  display:flex;align-items:center;gap:6px;
}
.n8n-canvas-agent .ag-live::before{
  content:"";width:7px;height:7px;border-radius:50%;
  background:#7efaa8;box-shadow:0 0 8px rgba(126,250,168,.8);
  animation:pulse 1.6s infinite;
}
.n8n-canvas-agent .ag-grid{
  position:relative;display:grid;
  grid-template-columns:repeat(3,1fr);gap:16px 20px;
}
.n8n-canvas-agent .ag-cell{display:flex;flex-direction:column;gap:10px}
.n8n-canvas-agent .ag-cell.center{gap:14px}
.n8n-canvas-agent .ag-node{
  position:relative;padding:12px 14px;border-radius:12px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.1);
}
.n8n-canvas-agent .ag-node.is-in{
  border-color:rgba(255,214,10,.3);background:rgba(255,214,10,.05);
}
.n8n-canvas-agent .ag-node.is-core{
  border-color:rgba(0,229,255,.4);background:rgba(0,229,255,.06);
  box-shadow:0 0 28px -6px rgba(0,229,255,.35);
}
.n8n-canvas-agent .ag-node.is-out{
  border-color:rgba(126,250,168,.3);background:rgba(126,250,168,.04);
}
.n8n-canvas-agent .ag-node .ag-kind{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--text-3);
}
.n8n-canvas-agent .ag-node.is-in .ag-kind{color:var(--olpa)}
.n8n-canvas-agent .ag-node.is-core .ag-kind{color:var(--accent)}
.n8n-canvas-agent .ag-node.is-out .ag-kind{color:#7efaa8}
.n8n-canvas-agent .ag-node .ag-name{
  font-size:13px;font-weight:600;color:var(--text);margin-top:4px;
}
.n8n-canvas-agent .ag-node .ag-desc{
  font-family:var(--font-mono);font-size:9px;color:var(--text-3);
  margin-top:4px;line-height:1.5;
}
.n8n-canvas-agent .ag-mid{
  display:flex;flex-direction:column;justify-content:center;
}
.n8n-canvas-agent .ag-core-ring{
  position:relative;padding:18px;border-radius:16px;
  background:
    radial-gradient(circle at 50% 50%,rgba(0,229,255,.18),rgba(0,229,255,.02) 70%);
  border:1px dashed rgba(0,229,255,.35);
  text-align:center;
}
.n8n-canvas-agent .ag-core-ring .r-label{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--accent);
}
.n8n-canvas-agent .ag-core-ring .r-name{
  font-size:15px;font-weight:700;color:var(--text);margin-top:6px;
}
.n8n-canvas-agent .ag-core-ring .r-tools{
  margin-top:10px;display:flex;gap:6px;flex-wrap:wrap;justify-content:center;
}
.n8n-canvas-agent .ag-core-ring .r-tools span{
  font-family:var(--font-mono);font-size:9px;padding:3px 8px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);
  color:var(--text-2);
}
.n8n-canvas-agent .ag-foot{
  margin-top:22px;padding-top:16px;border-top:1px dashed rgba(255,255,255,.09);
  display:flex;justify-content:space-between;font-family:var(--font-mono);
  font-size:10px;color:var(--text-3);flex-wrap:wrap;gap:10px;
}
.n8n-canvas-agent .ag-foot b{color:var(--olpa);font-weight:600}
@media (max-width:780px){
  .n8n-canvas-agent .ag-grid{grid-template-columns:1fr}
  .n8n-mockup-hero .nh-canvas{grid-template-columns:1fr;gap:10px}
  .n8n-mockup-hero .nh-col-sep{display:none}
}

/* ============================================================
   N8N page extras — self-host/cloud, integrations marquee, pricing
   ============================================================ */
.n8n-hostsplit{
  display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:stretch;
}
.n8n-hostsplit .hs-card{
  position:relative;padding:28px;border-radius:20px;
  background:rgba(10,12,16,.55);
  border:1px solid rgba(255,255,255,.09);backdrop-filter:blur(14px);
}
.n8n-hostsplit .hs-card.is-self{
  background:
    radial-gradient(80% 100% at 0% 0%,rgba(255,214,10,.08),transparent 60%),
    rgba(10,12,16,.6);
  border-color:rgba(255,214,10,.25);
}
.n8n-hostsplit .hs-card.is-cloud{
  background:
    radial-gradient(80% 100% at 100% 0%,rgba(0,229,255,.08),transparent 60%),
    rgba(10,12,16,.6);
  border-color:rgba(0,229,255,.22);
}
.n8n-hostsplit .hs-kind{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--text-3);
}
.n8n-hostsplit .hs-card.is-self .hs-kind{color:var(--olpa)}
.n8n-hostsplit .hs-card.is-cloud .hs-kind{color:var(--accent)}
.n8n-hostsplit .hs-title{
  font-family:var(--font-display);font-size:28px;line-height:1.1;
  color:var(--text);margin:6px 0 14px;
}
.n8n-hostsplit .hs-price{
  font-family:var(--font-mono);font-size:12px;color:var(--text-2);
  padding:6px 12px;border-radius:999px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  display:inline-block;margin-bottom:18px;
}
.n8n-hostsplit .hs-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.n8n-hostsplit .hs-list li{
  display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--text-2);
  line-height:1.5;
}
.n8n-hostsplit .hs-list li::before{
  content:"";flex-shrink:0;width:14px;height:14px;margin-top:4px;border-radius:4px;
  background:rgba(255,214,10,.15);border:1px solid rgba(255,214,10,.35);
}
.n8n-hostsplit .hs-card.is-cloud .hs-list li::before{
  background:rgba(0,229,255,.12);border-color:rgba(0,229,255,.32);
}
.n8n-hostsplit .hs-verdict{
  margin-top:20px;padding-top:16px;border-top:1px dashed rgba(255,255,255,.1);
  font-family:var(--font-mono);font-size:10px;color:var(--text-3);
  line-height:1.6;
}
.n8n-hostsplit .hs-verdict b{color:var(--text-2)}
@media (max-width:780px){.n8n-hostsplit{grid-template-columns:1fr}}

.n8n-marquee{
  position:relative;overflow:hidden;padding:22px 0;
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
  background:rgba(10,12,16,.45);
  mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
}
.n8n-marquee .mq-track{
  display:flex;gap:14px;width:max-content;
  animation:mq-scroll 38s linear infinite;
}
.n8n-marquee .mq-chip{
  flex-shrink:0;padding:10px 16px;border-radius:10px;
  background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.09);
  font-family:var(--font-mono);font-size:12px;color:var(--text-2);
  display:flex;align-items:center;gap:8px;
}
.n8n-marquee .mq-chip .dot{width:7px;height:7px;border-radius:50%;background:var(--olpa);opacity:.8}
.n8n-marquee .mq-chip:nth-child(3n) .dot{background:var(--accent)}
.n8n-marquee .mq-chip:nth-child(5n) .dot{background:#7efaa8}
@keyframes mq-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

.n8n-infra{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
}
.n8n-infra .inf-card{
  padding:22px;border-radius:16px;
  background:rgba(10,12,16,.55);border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(12px);
}
.n8n-infra .inf-n{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.16em;
  color:var(--olpa);padding:4px 9px;border-radius:6px;
  background:rgba(255,214,10,.1);border:1px solid rgba(255,214,10,.28);
  display:inline-block;margin-bottom:12px;
}
.n8n-infra .inf-card h4{
  font-size:15px;color:var(--text);margin:0 0 8px;line-height:1.25;
}
.n8n-infra .inf-card p{font-size:12px;color:var(--text-2);line-height:1.55;margin:0}
.n8n-infra .inf-card code{
  display:block;margin-top:10px;padding:8px 10px;border-radius:8px;
  background:rgba(0,0,0,.4);border:1px solid rgba(255,255,255,.06);
  font-family:var(--font-mono);font-size:10px;color:var(--accent);
  word-break:break-all;
}
@media (max-width:900px){.n8n-infra{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.n8n-infra{grid-template-columns:1fr}}

.n8n-pricing{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
}
.n8n-pricing .pc{
  padding:26px;border-radius:18px;
  background:rgba(10,12,16,.55);border:1px solid rgba(255,255,255,.09);
  backdrop-filter:blur(12px);display:flex;flex-direction:column;
}
.n8n-pricing .pc.is-reco{
  border-color:rgba(255,214,10,.4);
  background:
    radial-gradient(90% 100% at 0% 0%,rgba(255,214,10,.08),transparent 60%),
    rgba(10,12,16,.6);
  box-shadow:0 30px 80px -40px rgba(255,214,10,.3);
}
.n8n-pricing .pc .pc-tag{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-3);
}
.n8n-pricing .pc.is-reco .pc-tag{color:var(--olpa)}
.n8n-pricing .pc .pc-name{
  font-family:var(--font-display);font-size:22px;margin:6px 0 4px;color:var(--text);
}
.n8n-pricing .pc .pc-price{
  font-size:15px;color:var(--text-2);margin-bottom:16px;font-family:var(--font-mono);
}
.n8n-pricing .pc .pc-price b{color:var(--olpa);font-size:20px}
.n8n-pricing .pc ul{list-style:none;margin:0 0 20px;padding:0;display:flex;flex-direction:column;gap:8px;flex:1}
.n8n-pricing .pc ul li{font-size:12px;color:var(--text-2);padding-left:18px;position:relative;line-height:1.5}
.n8n-pricing .pc ul li::before{
  content:"";position:absolute;left:0;top:7px;width:8px;height:8px;border-radius:2px;
  background:rgba(255,214,10,.4);
}
.n8n-pricing .pc.is-cloud ul li::before{background:rgba(0,229,255,.4)}
@media (max-width:900px){.n8n-pricing{grid-template-columns:1fr}}

/* ============================================================
   SHOPIFY PAGE — extra mockups & sections
   ============================================================ */

/* Extra product rows in hero shopify-mockup */
.shopify-mockup .sh-products-head{
  font-size:9px;color:var(--text-3);letter-spacing:.12em;margin-top:10px;
}
.shopify-mockup .sh-products{display:flex;flex-direction:column;gap:6px;margin-top:4px}
.shopify-mockup .sh-prod{
  display:flex;align-items:center;gap:10px;
  padding:8px;border-radius:8px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.05);
}
.shopify-mockup .sh-prod-img{
  width:30px;height:30px;border-radius:6px;flex-shrink:0;
  box-shadow:0 2px 8px rgba(0,0,0,.3);
}
.shopify-mockup .sh-prod-info{flex:1;min-width:0}
.shopify-mockup .sh-prod-name{
  font-size:11px;color:var(--text);font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.shopify-mockup .sh-prod-price{
  font-family:var(--font-mono);font-size:10px;color:var(--olpa);margin-top:2px;
}
.shopify-mockup .sh-prod-price span{color:var(--text-3);font-weight:400}

/* ---------- Checkout showcase ---------- */
.cl-checkout-showcase{padding:110px 0;position:relative}
.cl-checkout-showcase::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(255,214,10,.04),transparent 60%);
}
.shopify-checkout-mockup{
  display:grid;
  grid-template-columns:1fr auto 1fr auto 1fr;
  gap:18px;align-items:stretch;
  max-width:1180px;margin:60px auto 0;position:relative;z-index:2;
}
.sh-co-card{
  padding:22px;border-radius:18px;
  display:flex;flex-direction:column;gap:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
}
.sh-co-badge{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.18em;
  color:var(--accent);text-transform:uppercase;
}
.sh-co-title{font-size:16px;font-weight:700;color:var(--text);margin-bottom:4px}
.sh-co-line{
  display:flex;align-items:center;gap:10px;
  padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05);
}
.sh-co-thumb{width:36px;height:36px;border-radius:8px;flex-shrink:0}
.sh-co-info{flex:1;min-width:0}
.sh-co-name{font-size:12px;color:var(--text);font-weight:600}
.sh-co-meta{font-size:10px;color:var(--text-3);margin-top:2px}
.sh-co-price{font-family:var(--font-mono);font-size:12px;color:var(--olpa);font-weight:700}
.sh-co-sep{height:1px;background:rgba(255,255,255,.08);margin:8px 0}
.sh-co-total{
  display:flex;justify-content:space-between;align-items:center;
  font-size:13px;color:var(--text);font-weight:600;margin-bottom:4px;
}
.sh-co-total-val{font-family:var(--font-mono);color:var(--olpa);font-size:16px}
.sh-co-btn{
  border:none;padding:11px 14px;border-radius:10px;
  font-size:12px;font-weight:700;cursor:default;
  font-family:inherit;margin-top:4px;
}
.sh-co-btn-shop{
  background:linear-gradient(135deg,#5a31f4,#7a4ad6);color:#fff;
  box-shadow:0 4px 14px rgba(90,49,244,.35);
}
.sh-co-btn-alt{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);
  color:var(--text-2);
}
.sh-co-field{display:flex;flex-direction:column;gap:4px;margin-top:4px}
.sh-co-field label{
  font-size:9px;color:var(--text-3);letter-spacing:.1em;
  text-transform:uppercase;display:flex;gap:6px;align-items:center;
}
.sh-co-auto{
  font-size:8px;color:var(--accent);padding:1px 5px;
  background:rgba(0,229,255,.08);border-radius:3px;
}
.sh-co-input{
  font-size:11px;color:var(--text);
  padding:8px 10px;border-radius:8px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
}
.sh-co-field-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sh-co-wallets{display:flex;gap:6px;margin-top:8px}
.sh-co-wallet{
  flex:1;text-align:center;padding:7px 4px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;font-size:10px;color:var(--text-2);font-weight:600;
}
.sh-co-check{
  width:52px;height:52px;border-radius:50%;
  background:linear-gradient(135deg,var(--olpa),#e89b3a);
  color:#0b0b0f;font-size:28px;font-weight:900;
  display:flex;align-items:center;justify-content:center;
  margin:6px auto 6px;box-shadow:0 0 24px rgba(255,214,10,.35);
}
.sh-co-meta-sm{
  text-align:center;font-size:10px;color:var(--text-3);
  font-family:var(--font-mono);
}
.sh-co-row{
  display:flex;justify-content:space-between;
  font-size:11px;color:var(--text-2);padding:4px 0;
}
.sh-co-accent{color:var(--accent);font-weight:700}
.sh-co-upsell{
  margin-top:10px;padding:10px;border-radius:8px;
  background:rgba(0,229,255,.04);
  border:1px solid rgba(0,229,255,.12);
}
.sh-co-upsell-label{
  font-size:8px;letter-spacing:.12em;color:var(--accent);
}
.sh-co-upsell-name{
  font-size:11px;color:var(--text);font-weight:600;margin-top:4px;
}
.sh-co-arrow{
  display:flex;align-items:center;justify-content:center;
  font-size:24px;color:var(--olpa);opacity:.5;
}
.sh-co-footnote{
  text-align:center;color:var(--text-3);font-size:12px;
  margin-top:40px;max-width:680px;margin-left:auto;margin-right:auto;
}
@media (max-width:1000px){
  .shopify-checkout-mockup{grid-template-columns:1fr;gap:16px}
  .sh-co-arrow{transform:rotate(90deg);font-size:20px;padding:4px 0}
}

/* ---------- Markets grid ---------- */
.cl-markets{padding:100px 0;position:relative}
.markets-grid{
  display:grid;grid-template-columns:repeat(6,1fr);gap:14px;
  max-width:1180px;margin:50px auto 0;
}
.market-card{
  padding:18px 14px;border-radius:14px;text-align:center;
  display:flex;flex-direction:column;gap:4px;
  transition:transform .3s,border-color .3s;
}
.market-card:hover{transform:translateY(-4px);border-color:rgba(255,214,10,.3)}
.market-flag{font-size:28px;line-height:1}
.market-code{
  font-family:var(--font-mono);font-size:9px;
  color:var(--text-3);letter-spacing:.15em;margin-top:4px;
}
.market-name{font-size:12px;color:var(--text);font-weight:700}
.market-price{
  font-family:var(--font-mono);font-size:12px;
  color:var(--olpa);font-weight:700;margin-top:6px;
}
.market-meta{font-size:9px;color:var(--text-3);margin-top:2px}
@media (max-width:900px){.markets-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.markets-grid{grid-template-columns:repeat(2,1fr)}}

/* ---------- How Olpa implements ---------- */
.cl-how-olpa{padding:110px 0}
.how-olpa-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px;
  max-width:1180px;margin:50px auto 0;
}
.how-olpa-card{
  padding:30px 26px;border-radius:18px;
  display:flex;flex-direction:column;gap:12px;position:relative;
}
.how-olpa-num{
  font-family:var(--font-mono);font-size:11px;
  color:var(--text-3);letter-spacing:.18em;
}
.how-olpa-card h3{
  font-size:22px;color:var(--text);font-weight:700;margin:0;
}
.how-olpa-time{
  display:inline-block;align-self:flex-start;
  font-family:var(--font-mono);font-size:10px;
  padding:4px 10px;border-radius:20px;
  background:rgba(0,229,255,.08);color:var(--accent);
  border:1px solid rgba(0,229,255,.2);letter-spacing:.1em;
}
.how-olpa-card p{color:var(--text-2);font-size:14px;line-height:1.6}
.how-olpa-list{
  list-style:none;padding:0;margin:8px 0 0;
  display:flex;flex-direction:column;gap:6px;
}
.how-olpa-list li{
  font-size:12px;color:var(--text-2);padding-left:18px;position:relative;
}
.how-olpa-list li::before{
  content:"→";position:absolute;left:0;color:var(--olpa);font-weight:700;
}
.how-olpa-hl{
  border-color:rgba(255,214,10,.3);
  box-shadow:0 0 0 1px rgba(255,214,10,.15),0 20px 60px rgba(255,214,10,.05);
}
@media (max-width:900px){.how-olpa-grid{grid-template-columns:1fr}}

/* ---------- Pros & Cons ---------- */
.cl-proscons{padding:100px 0}
.pc-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:24px;
  max-width:1100px;margin:50px auto 0;
}
.pc-col{
  padding:30px;border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
}
.pc-head,.pc-label{
  font-family:var(--font-mono);font-size:11px;
  letter-spacing:.18em;text-transform:uppercase;
  padding-bottom:14px;margin-bottom:16px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.pc-pro .pc-head,.pc-pros .pc-head,.pc-pros .pc-label,.pc-pro .pc-label{color:var(--olpa)}
.pc-con .pc-head,.pc-cons .pc-head,.pc-cons .pc-label,.pc-con .pc-label{color:#ff6b6b}
.pc-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
.pc-col li{
  font-size:14px;color:var(--text-2);line-height:1.55;
  display:flex;align-items:flex-start;gap:12px;
}
.pc-col li .ok,.pc-col li .bad{
  flex-shrink:0;width:22px;height:22px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;line-height:1;margin-top:1px;
}
.pc-col li .ok{
  background:rgba(255,214,10,.14);
  border:1px solid rgba(255,214,10,.4);color:var(--olpa);
}
.pc-col li .bad{
  background:rgba(255,107,107,.12);
  border:1px solid rgba(255,107,107,.35);color:#ff6b6b;
}
@media (max-width:800px){.pc-grid{grid-template-columns:1fr}}

/* ---------- Shopify pricing grid (4 tiers) ---------- */
.cl-pricing{padding:110px 0;position:relative}
.shopify-pricing-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;
  max-width:1200px;margin:50px auto 0;
}
.sh-pr-card{
  padding:28px 22px;border-radius:18px;position:relative;
  display:flex;flex-direction:column;gap:10px;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));
  border:1px solid rgba(255,255,255,.08);
  transition:transform .3s,border-color .3s;
}
.sh-pr-card:hover{transform:translateY(-6px)}
.sh-pr-badge{
  position:absolute;top:-11px;left:50%;transform:translateX(-50%);
  background:var(--olpa);color:#0b0b0f;
  font-size:10px;font-weight:700;
  padding:5px 12px;border-radius:20px;
  letter-spacing:.08em;text-transform:uppercase;
  white-space:nowrap;
}
.sh-pr-badge-plus{
  background:linear-gradient(135deg,#5a31f4,#00e5ff);color:#fff;
}
.sh-pr-name{
  font-size:20px;color:var(--text);font-weight:800;
}
.sh-pr-for{
  font-size:12px;color:var(--text-3);
  font-family:var(--font-mono);letter-spacing:.05em;
}
.sh-pr-price{
  display:flex;align-items:baseline;gap:6px;
  padding:14px 0;
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
  margin:6px 0;
}
.sh-pr-amount{
  font-family:var(--font-mono);font-size:26px;
  color:var(--olpa);font-weight:800;
}
.sh-pr-per{font-size:12px;color:var(--text-3)}
.sh-pr-feats{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:8px;flex:1;
}
.sh-pr-feats li{
  font-size:13px;color:var(--text-2);padding-left:18px;position:relative;
}
.sh-pr-feats li::before{
  content:"·";position:absolute;left:6px;color:var(--olpa);
  font-size:20px;line-height:.8;top:2px;font-weight:900;
}
.sh-pr-fee{
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-3);letter-spacing:.05em;
  padding-top:12px;margin-top:6px;
  border-top:1px solid rgba(255,255,255,.06);
}
.sh-pr-hl{
  border-color:rgba(255,214,10,.35);
  box-shadow:0 0 0 1px rgba(255,214,10,.2),0 24px 60px rgba(255,214,10,.06);
}
.sh-pr-plus{
  border-color:rgba(90,49,244,.35);
  background:linear-gradient(180deg,rgba(90,49,244,.06),rgba(0,229,255,.02));
}
.sh-pr-note{
  text-align:center;color:var(--text-3);font-size:12px;margin-top:30px;
}
.sh-pr-note a{color:var(--accent);text-decoration:none}
@media (max-width:1000px){.shopify-pricing-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.shopify-pricing-grid{grid-template-columns:1fr}}

/* ---------- whatis helper ---------- */
.cl-whatis{padding:90px 0}
.whatis-body{
  max-width:820px;margin:40px auto 0;
  font-size:16px;line-height:1.75;color:var(--text-2);
  display:flex;flex-direction:column;gap:18px;
}
.whatis-body a{color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(0,229,255,.3)}

/* =========================================================
   TOOL HERO MOCKUPS · extended variants
   Added for herramientas/make · wordpress · tiendanube
   ========================================================= */

/* -------- Make scenario (hero big · circular) -------- */
.make-scenario-big{
  position:relative;max-width:520px;margin:0 auto;
  border-radius:24px;padding:28px 22px 22px;
  background:linear-gradient(180deg,rgba(10,10,18,.95),rgba(18,14,28,.95));
  border:1px solid rgba(139,92,246,.28);
  box-shadow:0 40px 120px rgba(0,0,0,.5),0 0 0 1px rgba(255,214,10,.06) inset;
  font-family:var(--font-mono);
}
.make-scenario-big .mkb-head{
  display:flex;justify-content:space-between;align-items:center;
  font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-3);
  padding-bottom:14px;border-bottom:1px dashed rgba(255,255,255,.08);margin-bottom:14px;
}
.make-scenario-big .mkb-head .mkb-live{
  color:#9cffb0;display:inline-flex;align-items:center;gap:6px;
}
.make-scenario-big .mkb-head .mkb-live::before{
  content:"";width:6px;height:6px;border-radius:50%;background:#9cffb0;
  box-shadow:0 0 10px #9cffb0;animation:pulse 1.8s infinite;
}
.make-scenario-big .mkb-stage{
  position:relative;aspect-ratio:1/1;max-width:360px;margin:6px auto;
}
.make-scenario-big .mkb-orbit{
  position:absolute;inset:0;border-radius:50%;
  border:1px dashed rgba(139,92,246,.35);
  animation:mkbSpin 40s linear infinite;
}
.make-scenario-big .mkb-orbit::before{
  content:"";position:absolute;inset:14px;border-radius:50%;
  border:1px solid rgba(0,229,255,.12);
}
@keyframes mkbSpin{to{transform:rotate(360deg)}}
.make-scenario-big .mkb-core{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:96px;height:96px;border-radius:50%;
  background:radial-gradient(circle at 30% 30%,#8b5cf6,#5b21b6 70%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:#fff;text-align:center;font-weight:800;font-size:11px;
  letter-spacing:.12em;text-transform:uppercase;
  box-shadow:0 0 50px rgba(139,92,246,.55),0 0 0 6px rgba(139,92,246,.12);
}
.make-scenario-big .mkb-core b{font-size:16px;color:var(--olpa);margin-top:3px}
.make-scenario-big .mkb-bubble{
  position:absolute;width:72px;height:72px;border-radius:50%;
  background:rgba(20,18,34,.92);border:1px solid rgba(139,92,246,.45);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-size:9px;color:var(--text);gap:2px;
  box-shadow:0 12px 28px rgba(0,0,0,.5);
  transform:translate(-50%,-50%);
}
.make-scenario-big .mkb-bubble b{color:var(--olpa);font-size:11px}
.make-scenario-big .mkb-bubble.is-ok{border-color:rgba(0,229,255,.55)}
.make-scenario-big .mkb-b1{left:50%;top:4%}
.make-scenario-big .mkb-b2{left:96%;top:30%}
.make-scenario-big .mkb-b3{left:85%;top:82%}
.make-scenario-big .mkb-b4{left:15%;top:82%}
.make-scenario-big .mkb-b5{left:4%;top:30%}
.make-scenario-big .mkb-foot{
  display:flex;justify-content:space-between;align-items:center;margin-top:14px;
  padding-top:12px;border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);letter-spacing:.08em;text-transform:uppercase;
}
.make-scenario-big .mkb-foot b{color:var(--olpa)}

/* Operaciones bar-chart mini (secondary block) */
.make-ops-chart{
  display:grid;grid-template-columns:repeat(12,1fr);gap:6px;align-items:end;
  height:120px;margin-top:18px;padding:14px;
  background:rgba(10,10,18,.6);border:1px solid rgba(255,255,255,.06);border-radius:14px;
}
.make-ops-chart span{
  background:linear-gradient(180deg,var(--olpa),#8b5cf6);
  border-radius:3px 3px 0 0;box-shadow:0 0 12px rgba(255,214,10,.3);
}

/* -------- WordPress editor hero (wp-admin + Gutenberg) -------- */
.wp-editor{
  max-width:560px;margin:0 auto;border-radius:14px;overflow:hidden;
  background:#1e1e1e;border:1px solid rgba(33,117,155,.35);
  box-shadow:0 40px 100px rgba(0,0,0,.55);
  font-family:var(--font-sans,system-ui);
}
.wp-editor .we-bar{
  display:flex;align-items:center;gap:10px;padding:10px 14px;
  background:#1d2327;border-bottom:1px solid rgba(255,255,255,.05);
}
.wp-editor .we-dots{display:flex;gap:5px}
.wp-editor .we-dots span{width:9px;height:9px;border-radius:50%;background:#3c434a}
.wp-editor .we-dots span:nth-child(1){background:#ff5f57}
.wp-editor .we-dots span:nth-child(2){background:#ffbd2e}
.wp-editor .we-dots span:nth-child(3){background:#28c840}
.wp-editor .we-url{
  flex:1;font-family:var(--font-mono);font-size:10px;color:#8c8f94;
  background:#2c3338;padding:5px 10px;border-radius:4px;
}
.wp-editor .we-toolbar{
  display:flex;gap:8px;padding:8px 14px;background:#2c3338;
  border-bottom:1px solid rgba(255,255,255,.06);font-size:11px;color:#c3c4c7;
}
.wp-editor .we-toolbar .we-pill{
  padding:4px 10px;background:rgba(255,255,255,.04);border-radius:3px;
  border:1px solid rgba(255,255,255,.06);
}
.wp-editor .we-toolbar .we-pill.is-on{background:var(--olpa);color:#000;border-color:var(--olpa)}
.wp-editor .we-canvas{
  padding:24px 22px 22px;background:#fff;color:#1e1e1e;min-height:260px;
}
.wp-editor .we-title{
  font-size:22px;font-weight:700;color:#1e1e1e;margin-bottom:14px;
  padding-bottom:10px;border-bottom:2px dashed rgba(0,0,0,.08);
}
.wp-editor .we-block{
  position:relative;padding:10px 12px;border:1px solid transparent;
  margin-bottom:8px;font-size:12px;color:#3c434a;line-height:1.55;
}
.wp-editor .we-block.is-sel{
  border-color:#2271b1;box-shadow:0 0 0 1px #2271b1;
}
.wp-editor .we-block.is-sel::before{
  content:"¶";position:absolute;left:-22px;top:8px;
  width:18px;height:18px;background:#2271b1;color:#fff;
  border-radius:2px;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;
}
.wp-editor .we-h2{font-size:16px;font-weight:700;color:#1e1e1e}
.wp-editor .we-cols{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.wp-editor .we-col{
  background:#f6f7f7;border-radius:4px;padding:10px;font-size:10px;color:#50575e;
  border:1px solid #dcdcde;
}
.wp-editor .we-col b{color:#2271b1;display:block;margin-bottom:4px}
.wp-editor .we-foot{
  display:flex;justify-content:space-between;padding:8px 14px;
  background:#1d2327;font-family:var(--font-mono);font-size:9px;
  color:#8c8f94;text-transform:uppercase;letter-spacing:.1em;
}
.wp-editor .we-foot b{color:var(--olpa)}

/* -------- Tiendanube storefront hero (big) -------- */
.tn-storefront-big{
  max-width:540px;margin:0 auto;border-radius:18px;overflow:hidden;
  background:#fff;border:1px solid rgba(46,125,215,.25);
  box-shadow:0 40px 120px rgba(0,0,0,.5);
  color:#1a1f2a;font-family:var(--font-sans,system-ui);
}
.tn-storefront-big .tns-bar{
  display:flex;align-items:center;gap:10px;padding:9px 14px;
  background:#f5f6f8;border-bottom:1px solid #e4e6eb;
}
.tn-storefront-big .tns-bar span:first-child{
  font-family:var(--font-mono);font-size:10px;color:#6b7380;flex:1;
}
.tn-storefront-big .tns-top{
  display:flex;justify-content:space-between;align-items:center;
  padding:14px 18px;background:#fff;border-bottom:1px solid #eef0f3;
}
.tn-storefront-big .tns-logo{
  font-weight:800;font-size:15px;color:#1a1f2a;letter-spacing:-.02em;
}
.tn-storefront-big .tns-logo i{color:#2e7dd7;font-style:normal}
.tn-storefront-big .tns-nav{
  display:flex;gap:14px;font-size:10px;color:#6b7380;text-transform:uppercase;letter-spacing:.08em;
}
.tn-storefront-big .tns-cart{
  background:#1a1f2a;color:#fff;font-size:10px;padding:6px 12px;border-radius:20px;
}
.tn-storefront-big .tns-hero{
  padding:20px 18px 12px;background:linear-gradient(135deg,#eef4fb,#fff);
  font-size:11px;color:#6b7380;
}
.tn-storefront-big .tns-hero b{display:block;font-size:16px;color:#1a1f2a;margin-bottom:4px}
.tn-storefront-big .tns-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px 18px 6px;
}
.tn-storefront-big .tns-prod{
  border:1px solid #eef0f3;border-radius:10px;overflow:hidden;background:#fff;
}
.tn-storefront-big .tns-img{
  aspect-ratio:1/1;background:linear-gradient(135deg,#f5f6f8,#e4e6eb);
  position:relative;
}
.tn-storefront-big .tns-img.is-1{background:linear-gradient(135deg,#dce6f3,#a8c1de)}
.tn-storefront-big .tns-img.is-2{background:linear-gradient(135deg,#f3dcdc,#deb4b4)}
.tn-storefront-big .tns-img.is-3{background:linear-gradient(135deg,#dcf3df,#b4deb8)}
.tn-storefront-big .tns-tag{
  position:absolute;top:6px;left:6px;background:#ffd60a;color:#1a1f2a;
  font-size:8px;font-weight:800;padding:2px 6px;border-radius:3px;
  text-transform:uppercase;letter-spacing:.08em;
}
.tn-storefront-big .tns-info{padding:8px 10px 10px}
.tn-storefront-big .tns-name{font-size:10px;color:#1a1f2a;font-weight:600;line-height:1.2}
.tn-storefront-big .tns-price{font-size:12px;font-weight:800;color:#1a1f2a;margin-top:4px}
.tn-storefront-big .tns-cuotas{font-size:8px;color:#2e7dd7;margin-top:2px;font-weight:600}
.tn-storefront-big .tns-badges{
  display:flex;gap:6px;padding:10px 18px 14px;flex-wrap:wrap;
  border-top:1px solid #eef0f3;margin-top:6px;background:#fafbfc;
}
.tn-storefront-big .tns-pill{
  font-size:8px;padding:4px 8px;border-radius:12px;font-weight:700;
  text-transform:uppercase;letter-spacing:.05em;
  background:#eef4fb;color:#2e7dd7;border:1px solid #d6e3f3;
}
.tn-storefront-big .tns-pill.is-mp{background:#009ee3;color:#fff;border-color:#009ee3}
.tn-storefront-big .tns-pill.is-me{background:#ffe600;color:#1a1f2a;border-color:#ffe600}
.tn-storefront-big .tns-pill.is-afip{background:#3bd37a;color:#fff;border-color:#3bd37a}

/* -------- Shared: YouTube embed block -------- */
.yt-embed{
  position:relative;max-width:880px;margin:30px auto 0;aspect-ratio:16/9;
  border-radius:16px;overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 40px 120px rgba(0,0,0,.6);
  background:#000;
}
.yt-embed iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;
}
.yt-note{
  text-align:center;font-size:11px;color:var(--text-3);
  font-family:var(--font-mono);margin-top:14px;letter-spacing:.08em;text-transform:uppercase;
}

/* -------- Shared: Recursos oficiales block -------- */
.official-res{
  margin:60px auto 0;max-width:860px;padding:26px 28px;
  border-radius:16px;background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.07);backdrop-filter:blur(10px);
}
.official-res h3{
  font-size:12px;text-transform:uppercase;letter-spacing:.15em;
  color:var(--text-3);font-family:var(--font-mono);margin-bottom:14px;
}
.official-res .or-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;
}
.official-res a{
  display:block;padding:12px 14px;border-radius:10px;
  background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);
  font-size:13px;color:var(--text);text-decoration:none;transition:all .2s;
}
.official-res a:hover{border-color:var(--olpa);color:var(--olpa)}
.official-res a small{
  display:block;font-family:var(--font-mono);font-size:9px;
  color:var(--text-3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;
}

/* -------- Stack grid (WordPress / Tiendanube sections) -------- */
.stack-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:18px;margin-top:40px;
}
.stack-card{
  padding:22px;border-radius:14px;
  background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);
  backdrop-filter:blur(8px);
}
.stack-card .sc-num{
  font-family:var(--font-mono);font-size:10px;color:var(--olpa);
  letter-spacing:.12em;margin-bottom:8px;
}
.stack-card h4{font-size:15px;color:var(--text);margin-bottom:6px}
.stack-card p{font-size:13px;color:var(--text-2);line-height:1.55}

/* -------- Pricing table (tool pricing transparency) -------- */
.tool-pricing{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;margin-top:40px;
}
.tool-pricing .tp-card{
  padding:24px;border-radius:14px;
  background:rgba(10,10,18,.4);border:1px solid rgba(255,255,255,.06);
}
.tool-pricing .tp-card.is-hi{border-color:var(--olpa);box-shadow:0 0 0 1px rgba(255,214,10,.15)}
.tool-pricing .tp-kind{
  font-family:var(--font-mono);font-size:10px;text-transform:uppercase;
  letter-spacing:.12em;color:var(--text-3);margin-bottom:10px;
}
.tool-pricing .tp-price{
  font-size:24px;font-weight:800;color:var(--olpa);margin-bottom:4px;
}
.tool-pricing .tp-suffix{font-size:12px;color:var(--text-3);margin-bottom:14px}
.tool-pricing .tp-list{
  list-style:none;padding:0;margin:0;font-size:12px;color:var(--text-2);line-height:1.7;
}
.tool-pricing .tp-list li::before{content:"› ";color:var(--accent)}

/* ============================================================
   Demo oficial (YouTube embed) + Recursos oficiales (resource grid)
   ============================================================ */
.cl-demo .youtube-embed{
  position:relative;max-width:920px;margin:0 auto;aspect-ratio:16/9;
  border-radius:20px;overflow:hidden;border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.5);box-shadow:0 20px 80px rgba(0,0,0,.5);
}
.cl-demo .youtube-embed iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;
}
.cl-resources .resource-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:18px;max-width:1000px;margin:0 auto;
}
.cl-resources .resource-card{
  padding:24px;border-radius:16px;display:flex;flex-direction:column;
  gap:8px;text-decoration:none;color:inherit;transition:all .3s;
  border:1px solid rgba(255,255,255,.08);position:relative;
}
.cl-resources .resource-card:hover{
  border-color:rgba(255,214,10,.4);transform:translateY(-2px);
  box-shadow:0 10px 30px rgba(255,214,10,.1);
}
.cl-resources .resource-label{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  color:var(--accent);text-transform:uppercase;
}
.cl-resources .resource-card h4{
  font-size:18px;font-weight:600;color:var(--text);margin:0;
}
.cl-resources .resource-arrow{
  position:absolute;top:20px;right:20px;color:var(--text-3);
  font-size:18px;transition:all .3s;
}
.cl-resources .resource-card:hover .resource-arrow{
  color:var(--olpa);transform:translate(2px,-2px);
}

/* ==========================================================================
   HERRAMIENTAS · Google Ads dashboard mockup (ga-* dark theme)
   ========================================================================== */
.ga-dashboard{
  max-width:460px;margin:0 auto;padding:22px;border-radius:20px;
  background:linear-gradient(160deg,rgba(255,214,10,.05),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(14px);
}
.ga-dashboard .ga-head{
  padding-bottom:12px;margin-bottom:14px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.ga-dashboard .ga-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:4px;
}
.ga-dashboard .ga-sub{
  font-size:11px;color:var(--text-2);font-family:var(--font-mono);
}
.ga-dashboard .ga-kpis{
  display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:14px;
}
.ga-dashboard .ga-kpi{
  padding:10px 12px;border-radius:10px;
  background:rgba(0,229,255,.04);
  border:1px solid rgba(255,255,255,.06);
  display:flex;flex-direction:column;gap:3px;
}
.ga-dashboard .ga-kpi span{
  font-family:var(--font-mono);font-size:8px;letter-spacing:.1em;
  color:var(--text-3);text-transform:uppercase;
}
.ga-dashboard .ga-kpi strong{
  font-family:var(--font-display);font-size:14px;font-weight:700;
  color:var(--text);line-height:1;
}
.ga-dashboard .ga-kw{
  display:flex;flex-direction:column;gap:6px;margin-bottom:14px;
}
.ga-dashboard .ga-kw-row{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:7px 10px;border-radius:6px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.05);
  font-size:10px;
}
.ga-dashboard .ga-kw-row span{
  color:var(--accent);font-family:var(--font-mono);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;
}
.ga-dashboard .ga-kw-row strong{
  color:var(--olpa);font-family:var(--font-mono);
  font-size:9px;font-weight:700;flex-shrink:0;
}
.ga-dashboard .ga-footer{
  padding-top:10px;border-top:1px dashed rgba(255,255,255,.08);
  font-size:10px;color:var(--text-3);font-family:var(--font-mono);
  text-align:center;
}
@media(max-width:640px){.ga-dashboard{max-width:340px}}

/* ==========================================================================
   BSAI · PROGRAMAS IA EMPRESAS · SYLLABUS LAYOUT
   Estructura tipo carátula de programa académico + sidebar sticky + 8 semanas
   ========================================================================== */

.syllabus-body{background:#050509}

/* ----- COVER (portada) ----- */
.syl-cover{
  position:relative;padding:140px 8% 100px;min-height:100vh;
  display:flex;flex-direction:column;justify-content:center;
  overflow:hidden;
}
.syl-cover-bg{
  position:absolute;inset:0;pointer-events:none;opacity:.6;
}
.syl-cover-grid{
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,214,10,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,214,10,.04) 1px,transparent 1px);
  background-size:80px 80px;
  mask-image:radial-gradient(ellipse at 50% 40%,#000 10%,transparent 70%);
}
.syl-cover-stamp{
  position:absolute;top:140px;right:8%;color:rgba(255,214,10,.35);
  animation:syl-spin 40s linear infinite;
}
@keyframes syl-spin{to{transform:rotate(360deg)}}

.syl-breadcrumb{
  position:relative;z-index:5;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;
  color:var(--text-3);margin-bottom:60px;text-transform:uppercase;
}
.syl-breadcrumb a{color:var(--text-2);text-decoration:none}
.syl-breadcrumb a:hover{color:var(--olpa)}
.syl-breadcrumb span{margin:0 10px;color:var(--text-3)}
.syl-breadcrumb .current{color:var(--olpa)}

.syl-cover-meta{
  position:relative;z-index:5;
  display:grid;grid-template-columns:repeat(4,auto);gap:60px;
  padding-bottom:50px;margin-bottom:60px;
  border-bottom:1px solid rgba(255,255,255,.08);
  font-family:var(--font-mono);
}
.syl-cover-meta > div{display:flex;flex-direction:column;gap:6px}
.meta-k{font-size:9px;letter-spacing:.18em;color:var(--text-3);text-transform:uppercase}
.meta-v{font-size:13px;color:var(--olpa);font-weight:600}

.syl-cover-title{
  position:relative;z-index:5;
  font-family:var(--font-display);font-weight:700;
  line-height:.92;letter-spacing:-.035em;color:var(--text);
  display:flex;flex-direction:column;gap:4px;
  max-width:1100px;margin-bottom:70px;
}
.syl-prefix{
  font-family:var(--font-mono);font-size:13px;font-weight:400;
  letter-spacing:.25em;color:var(--text-3);
  text-transform:uppercase;margin-bottom:28px;
}
.syl-line-1{font-size:clamp(56px,9vw,130px)}
.syl-line-2{
  font-size:clamp(56px,9vw,130px);
  padding-left:8%;color:var(--text);
}
.syl-line-2 em{
  font-family: var(--font-display);
  font-style:italic;color:var(--olpa);font-weight:400;
}
.syl-line-3{
  font-size:clamp(28px,4vw,54px);
  padding-left:16%;color:var(--text-2);font-weight:400;
  margin-top:18px;
}
.syl-line-3 em{
  font-family: var(--font-display);
  font-style:italic;color:var(--accent);font-weight:400;
}

.syl-cover-foot{
  position:relative;z-index:5;
  max-width:720px;padding-left:16%;
}
.syl-desc{
  font-size:17px;line-height:1.7;color:var(--text-2);
  margin-bottom:32px;
  border-left:2px solid rgba(255,214,10,.35);
  padding-left:22px;
}
.syl-cover-cta{display:flex;gap:14px;flex-wrap:wrap}

/* ----- BODY: sidebar + main ----- */
.syl-body{padding:0 0 120px;background:#050509}
.syl-container{
  display:grid;grid-template-columns:260px 1fr;gap:80px;
  max-width:1280px;
}
.syl-sidebar{
  position:sticky;top:120px;align-self:start;
  padding:32px 0;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
}
.syl-sidebar-head{margin-bottom:26px}
.syl-sidebar-label{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:4px;
}
.syl-sidebar-sub{
  font-family:var(--font-mono);font-size:11px;color:var(--text-3);
}
.syl-weeks-nav{
  list-style:none;padding:0;margin:0;
  display:flex;flex-direction:column;gap:2px;
}
.syl-weeks-nav li a{
  display:grid;grid-template-columns:42px 1fr;gap:12px;
  padding:11px 4px;text-decoration:none;
  border-left:2px solid transparent;padding-left:14px;
  transition:all .2s;
}
.syl-weeks-nav li a:hover{
  border-left-color:rgba(255,214,10,.5);
  background:rgba(255,214,10,.03);
}
.syl-weeks-nav .wk-n{
  font-family:var(--font-mono);font-size:11px;font-weight:700;
  color:var(--text-3);
}
.syl-weeks-nav .wk-t{
  font-size:12.5px;color:var(--text-2);line-height:1.35;
}
.syl-weeks-nav li a:hover .wk-n{color:var(--olpa)}
.syl-weeks-nav li a:hover .wk-t{color:var(--text)}
.syl-sidebar-foot{
  margin-top:32px;padding-top:24px;
  border-top:1px dashed rgba(255,255,255,.08);
}
.fac{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.18em;
  color:var(--text-3);text-transform:uppercase;margin-bottom:6px;
}
.fac-name{font-size:14px;color:var(--text);font-weight:600;line-height:1.2}
.fac-role{font-size:11px;color:var(--text-3);margin-top:3px}

/* ----- MAIN: weeks ----- */
.syl-main{padding-top:20px;min-width:0}
.syl-week{
  padding:90px 0;
  border-bottom:1px dashed rgba(255,255,255,.08);
  position:relative;
}
.syl-week:first-child{padding-top:50px}
.syl-week:last-child{border-bottom:none}

.wk-head{margin-bottom:44px}
.wk-numberbig{
  font-family:var(--font-display);font-size:140px;font-weight:800;
  line-height:.8;letter-spacing:-.04em;
  color:transparent;
  -webkit-text-stroke:1.5px rgba(255,214,10,.3);
  margin-bottom:18px;
}
.wk-meta{
  display:flex;gap:20px;align-items:center;
  font-family:var(--font-mono);font-size:10px;
  letter-spacing:.18em;text-transform:uppercase;
  margin-bottom:18px;
}
.wk-chapter{color:var(--olpa)}
.wk-sessions{
  color:var(--text-3);
  padding-left:20px;border-left:1px solid rgba(255,255,255,.12);
}
.wk-title{
  font-family:var(--font-display);font-size:clamp(34px,4.5vw,58px);
  font-weight:700;letter-spacing:-.025em;line-height:1;
  color:var(--text);margin-bottom:20px;
}
.wk-title em{
  font-family: var(--font-display);
  font-style:italic;color:var(--olpa);font-weight:400;
}
.wk-lead{
  font-size:17px;line-height:1.65;color:var(--text-2);
  max-width:720px;
}

.wk-viz{
  margin:40px 0;padding:36px;
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(255,255,255,.005));
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
}

.wk-topics{
  list-style:none;padding:0;margin-top:40px;
  display:flex;flex-direction:column;gap:14px;
  counter-reset:topic;
}
.wk-topics li{
  position:relative;padding-left:44px;
  font-size:15px;line-height:1.55;color:var(--text-2);
  counter-increment:topic;
}
.wk-topics li::before{
  content:"· " counter(topic);
  position:absolute;left:0;top:0;
  font-family:var(--font-mono);font-size:11px;
  color:var(--olpa);letter-spacing:.1em;font-weight:600;
  padding-top:3px;
}

/* ----- VIZ: semana 01 — matriz ----- */
.wk-viz-fundamentos .fv-title{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.15em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:24px;text-align:center;
}
.wk-viz-fundamentos .fv-matrix{
  position:relative;
  display:grid;grid-template-columns:1fr 1fr;gap:12px;
  max-width:560px;margin:0 auto;padding:40px 50px 50px;
  border:1px dashed rgba(255,255,255,.15);border-radius:8px;
}
.wk-viz-fundamentos .fv-quad{
  padding:20px 16px;background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.06);border-radius:8px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  font-size:13px;color:var(--text);font-weight:500;
}
.wk-viz-fundamentos .fv-dot{
  width:10px;height:10px;border-radius:50%;
  flex-shrink:0;
}
.wk-viz-fundamentos .fv-dot.ok{background:var(--olpa);box-shadow:0 0 10px var(--olpa)}
.wk-viz-fundamentos .fv-dot.no{background:#ff6b6b;box-shadow:0 0 10px #ff6b6b}
.wk-viz-fundamentos .fv-axis-x,
.wk-viz-fundamentos .fv-axis-y{
  position:absolute;font-family:var(--font-mono);font-size:9px;
  color:var(--text-3);letter-spacing:.1em;text-transform:uppercase;
}
.wk-viz-fundamentos .fv-axis-x{bottom:14px;left:50%;transform:translateX(-50%)}
.wk-viz-fundamentos .fv-axis-y{
  top:50%;left:10px;transform:translateY(-50%) rotate(-90deg);
  transform-origin:left center;white-space:nowrap;
}

/* ----- VIZ: semana 02 — prompt sheet ----- */
.wk-viz-prompts .pv-sheet{
  max-width:640px;margin:0 auto;
  background:rgba(0,0,0,.4);
  border:1px solid rgba(255,255,255,.1);border-radius:10px;
  overflow:hidden;
}
.wk-viz-prompts .pv-sheet-head{
  padding:14px 20px;display:flex;justify-content:space-between;
  background:rgba(255,214,10,.04);
  border-bottom:1px solid rgba(255,255,255,.08);
  font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;
}
.wk-viz-prompts .pv-sheet-label{color:var(--olpa)}
.wk-viz-prompts .pv-sheet-count{color:var(--text-3)}
.wk-viz-prompts .pv-sheet-rows{padding:10px 0}
.wk-viz-prompts .pv-row{
  display:grid;grid-template-columns:48px 1fr auto;gap:14px;
  padding:11px 20px;align-items:center;font-size:13px;
  border-bottom:1px solid rgba(255,255,255,.03);
}
.wk-viz-prompts .pv-row:last-child{border-bottom:none}
.wk-viz-prompts .pv-id{
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-3);letter-spacing:.08em;
}
.wk-viz-prompts .pv-name{color:var(--text-2)}
.wk-viz-prompts .pv-tag{
  font-family:var(--font-mono);font-size:9px;
  color:var(--text-3);
}
.wk-viz-prompts .pv-row-active{
  background:rgba(255,214,10,.06);
}
.wk-viz-prompts .pv-row-active .pv-id{color:var(--olpa)}
.wk-viz-prompts .pv-row-active .pv-name{color:var(--olpa);font-weight:600}
.wk-viz-prompts .pv-row-active .pv-tag{color:var(--accent)}

/* ----- VIZ: semana 03 — ecosystem map ----- */
.wk-viz-ecosystem .ev-map{
  position:relative;max-width:640px;margin:0 auto;
  min-height:320px;
}
.wk-viz-ecosystem .ev-center{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  padding:16px 22px;background:rgba(255,214,10,.08);
  border:1.5px solid rgba(255,214,10,.4);border-radius:50px;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;
  color:var(--olpa);text-transform:uppercase;font-weight:700;
}
.wk-viz-ecosystem .ev-branch{
  position:absolute;padding:12px 16px;
  background:rgba(0,229,255,.04);
  border:1px solid rgba(0,229,255,.15);border-radius:10px;
  display:flex;flex-direction:column;gap:4px;
  font-family:var(--font-mono);font-size:10px;
}
.wk-viz-ecosystem .ev-branch span{color:var(--text-3);font-size:9px;letter-spacing:.08em;text-transform:uppercase}
.wk-viz-ecosystem .ev-branch strong{color:var(--accent);font-size:12px;font-weight:700}
.wk-viz-ecosystem .ev-b1{top:20px;left:0}
.wk-viz-ecosystem .ev-b2{top:20px;right:0}
.wk-viz-ecosystem .ev-b3{top:50%;left:0;transform:translateY(-50%)}
.wk-viz-ecosystem .ev-b4{top:50%;right:0;transform:translateY(-50%)}
.wk-viz-ecosystem .ev-b5{bottom:20px;left:0}
.wk-viz-ecosystem .ev-b6{bottom:20px;right:0}

/* ----- VIZ: semana 04 — agent flow ----- */
.wk-viz-agent .av-flow{
  display:grid;grid-template-columns:1fr auto 1.2fr auto 1fr;
  gap:14px;align-items:center;max-width:780px;margin:0 auto;
}
.wk-viz-agent .av-node{
  padding:18px 16px;border-radius:12px;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);
  display:flex;flex-direction:column;gap:6px;
}
.wk-viz-agent .av-ic{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.12em;
  color:var(--text-3);font-weight:700;
}
.wk-viz-agent .av-name{
  font-size:14px;color:var(--text);font-weight:600;
}
.wk-viz-agent .av-desc{
  font-size:11px;color:var(--text-3);font-family:var(--font-mono);line-height:1.4;
}
.wk-viz-agent .av-core{
  background:rgba(255,214,10,.05);
  border-color:rgba(255,214,10,.3);
}
.wk-viz-agent .av-core .av-ic{color:var(--olpa)}
.wk-viz-agent .av-core .av-name{color:var(--olpa)}
.wk-viz-agent .av-tools{
  display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;
}
.wk-viz-agent .av-tools span{
  font-family:var(--font-mono);font-size:9px;
  padding:2px 7px;background:rgba(0,229,255,.08);
  border:1px solid rgba(0,229,255,.2);border-radius:4px;
  color:var(--accent);
}
.wk-viz-agent .av-arrow{
  color:var(--olpa);font-size:20px;font-weight:700;
}

/* ----- VIZ: semana 05 — n8n code ----- */
.wk-viz-n8n .nv-code{
  max-width:720px;margin:0 auto;
  background:rgba(0,0,0,.5);
  border:1px solid rgba(0,229,255,.2);border-radius:10px;
  padding:24px 28px;
  font-family:var(--font-mono);font-size:12.5px;line-height:1.9;
  color:var(--text-2);overflow:auto;
}
.wk-viz-n8n .nv-c{color:var(--text-3);font-style:italic;display:block;margin-bottom:8px}
.wk-viz-n8n .nv-k{color:var(--olpa);font-weight:700}
.wk-viz-n8n .nv-n{color:var(--accent);font-weight:600}

/* ----- VIZ: semana 06 — RAG diagram ----- */
.wk-viz-rag .rv-diagram{
  display:grid;grid-template-columns:1fr 30px 1fr 30px 1.2fr;gap:8px;
  align-items:center;max-width:860px;margin:0 auto;
}
.wk-viz-rag .rv-col{
  padding:18px 14px;background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.08);border-radius:12px;
  display:flex;flex-direction:column;gap:8px;min-height:200px;
}
.wk-viz-rag .rv-label{
  font-family:var(--font-mono);font-size:9px;letter-spacing:.15em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:4px;
}
.wk-viz-rag .rv-label-sub{
  font-family:var(--font-mono);font-size:9px;color:var(--text-3);
  text-align:center;margin-top:4px;
}
.wk-viz-rag .rv-doc{
  font-size:11px;padding:7px 10px;
  background:rgba(0,229,255,.05);
  border:1px solid rgba(0,229,255,.15);
  border-radius:5px;color:var(--accent);
  font-family:var(--font-mono);
}
.wk-viz-rag .rv-chunks{
  display:grid;grid-template-columns:repeat(5,1fr);gap:4px;flex:1;
}
.wk-viz-rag .rv-chunks span{
  aspect-ratio:1;background:rgba(255,214,10,.08);
  border:1px solid rgba(255,214,10,.2);border-radius:2px;
}
.wk-viz-rag .rv-chunks span:nth-child(even){background:rgba(0,229,255,.08);border-color:rgba(0,229,255,.2)}
.wk-viz-rag .rv-col-q{gap:10px}
.wk-viz-rag .rv-q{
  font-size:12px;color:var(--text-2);line-height:1.5;font-style:italic;
  padding:10px;border-left:2px solid var(--accent);
}
.wk-viz-rag .rv-ans{
  font-size:12px;color:var(--olpa);line-height:1.5;
  padding:10px;background:rgba(255,214,10,.05);
  border-radius:6px;margin-top:auto;
}
.wk-viz-rag .rv-arrow{color:var(--olpa);font-size:20px;text-align:center}

/* ----- VIZ: semana 07 — adoption calendar ----- */
.wk-viz-adoption .adv-calendar{
  max-width:680px;margin:0 auto;
  background:rgba(0,0,0,.4);
  border:1px solid rgba(255,255,255,.08);border-radius:12px;
  overflow:hidden;
}
.wk-viz-adoption .adv-head{
  padding:16px 20px;background:rgba(255,214,10,.04);
  border-bottom:1px solid rgba(255,255,255,.08);
  font-family:var(--font-mono);font-size:10px;letter-spacing:.15em;
  color:var(--olpa);text-transform:uppercase;
}
.wk-viz-adoption .adv-grid{
  display:grid;grid-template-columns:repeat(7,1fr);
}
.wk-viz-adoption .adv-day{
  padding:18px 10px;min-height:90px;
  border-right:1px solid rgba(255,255,255,.05);
  display:flex;flex-direction:column;gap:8px;
}
.wk-viz-adoption .adv-day:last-child{border-right:none}
.wk-viz-adoption .adv-d{
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-3);font-weight:700;
}
.wk-viz-adoption .adv-ev{
  font-size:10px;color:var(--accent);line-height:1.3;
  padding:5px 7px;background:rgba(0,229,255,.06);
  border:1px solid rgba(0,229,255,.18);border-radius:4px;
  font-family:var(--font-mono);
}
.wk-viz-adoption .adv-off{opacity:.3}
.wk-viz-adoption .adv-foot{
  padding:12px 20px;font-family:var(--font-mono);font-size:10px;
  color:var(--text-3);border-top:1px dashed rgba(255,255,255,.08);
  text-align:center;
}

/* ----- VIZ: semana 08 — diploma ----- */
.wk-viz-graduation .gv-diploma{
  max-width:480px;margin:0 auto;padding:48px 40px;
  background:
    radial-gradient(120% 80% at 50% 0%,rgba(255,214,10,.08),transparent 70%),
    rgba(0,0,0,.5);
  border:1.5px solid rgba(255,214,10,.3);border-radius:4px;
  text-align:center;position:relative;
}
.wk-viz-graduation .gv-diploma::before,
.wk-viz-graduation .gv-diploma::after{
  content:"";position:absolute;width:20px;height:20px;
  border:1.5px solid rgba(255,214,10,.3);
}
.wk-viz-graduation .gv-diploma::before{top:10px;left:10px;border-right:none;border-bottom:none}
.wk-viz-graduation .gv-diploma::after{bottom:10px;right:10px;border-left:none;border-top:none}
.wk-viz-graduation .gv-seal{
  color:var(--olpa);margin-bottom:16px;display:flex;justify-content:center;
}
.wk-viz-graduation .gv-title{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.25em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:22px;
}
.wk-viz-graduation .gv-name{
  font-family: var(--font-display);font-style:italic;
  font-size:22px;color:var(--text);margin-bottom:14px;letter-spacing:.05em;
}
.wk-viz-graduation .gv-prog{
  font-size:12px;color:var(--text-2);margin-bottom:26px;
}
.wk-viz-graduation .gv-meta{
  display:flex;justify-content:space-between;
  font-family:var(--font-mono);font-size:9px;
  color:var(--text-3);letter-spacing:.1em;text-transform:uppercase;
  padding-top:16px;border-top:1px dashed rgba(255,214,10,.2);
}

/* ----- CASE (editorial testimonial) ----- */
.syl-case{
  padding:140px 0;background:#050509;
  border-top:1px solid rgba(255,255,255,.08);
}
.case-tag-big{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:40px;text-align:center;
}
.case-quote{
  max-width:880px;margin:0 auto 60px;padding:0;
  border:none;
}
.case-quote p{
  font-family: var(--font-display);
  font-size:clamp(22px,3vw,34px);line-height:1.45;
  color:var(--text);font-style:normal;font-weight:400;
  letter-spacing:-.005em;text-align:center;
}
.case-quote p::before{content:"«";color:var(--olpa);margin-right:10px;font-size:1.2em}
.case-quote p::after{content:"»";color:var(--olpa);margin-left:10px;font-size:1.2em}
.case-quote p em{color:var(--olpa);font-style:italic;font-weight:500}
.case-quote footer{
  margin-top:30px;text-align:center;
  font-family:var(--font-mono);font-size:11px;
  color:var(--text-3);letter-spacing:.08em;
  display:flex;flex-direction:column;gap:4px;
}
.case-quote .q-name{color:var(--text-2);font-weight:600;text-transform:uppercase;letter-spacing:.15em}
.case-metrics{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
  max-width:980px;margin:0 auto;padding-top:50px;
  border-top:1px dashed rgba(255,255,255,.08);
}
.cm{text-align:center;padding:24px 10px}
.cm-n{
  display:block;
  font-family:var(--font-display);font-size:clamp(32px,4vw,52px);
  font-weight:800;color:var(--olpa);line-height:1;margin-bottom:8px;
}
.cm-l{
  font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;
  color:var(--text-3);text-transform:uppercase;
}

/* ----- FAQ (apéndice) ----- */
.syl-faq{padding:120px 0;background:#050509}
.syl-faq .faq-head{text-align:center;margin-bottom:60px}
.syl-faq .faq-label{
  display:inline-block;
  font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;
  color:var(--olpa);text-transform:uppercase;margin-bottom:14px;
}
.syl-faq h2{
  font-family:var(--font-display);font-size:clamp(32px,4vw,48px);
  font-weight:700;letter-spacing:-.02em;color:var(--text);
}
.syl-faq .faq-list{max-width:840px;margin:0 auto;display:flex;flex-direction:column}
.syl-faq .faq-item{
  border-bottom:1px solid rgba(255,255,255,.08);
}
.syl-faq .faq-item[open]{background:rgba(255,214,10,.02)}
.syl-faq .faq-item summary{
  list-style:none;cursor:pointer;padding:26px 20px;
  font-size:17px;color:var(--text);font-weight:500;
  display:flex;justify-content:space-between;align-items:center;
  transition:all .2s;
}
.syl-faq .faq-item summary::-webkit-details-marker{display:none}
.syl-faq .faq-item summary::after{
  content:"+";color:var(--olpa);font-size:22px;font-weight:400;
  transition:transform .25s;
}
.syl-faq .faq-item[open] summary::after{content:"−"}
.syl-faq .faq-item summary:hover{color:var(--olpa)}
.syl-faq .faq-body{
  padding:0 20px 26px;color:var(--text-2);line-height:1.7;font-size:15px;
  max-width:720px;
}

/* ----- CTA (diploma final) ----- */
.syl-cta{
  padding:140px 0;
  background:
    radial-gradient(ellipse 60% 70% at 50% 50%,rgba(255,214,10,.08),transparent 70%),
    #050509;
  border-top:1px solid rgba(255,255,255,.08);
}
.syl-cta-inner{
  max-width:720px;text-align:center;
}
.cta-stamp{
  color:var(--olpa);margin:0 auto 30px;display:flex;justify-content:center;
}
.syl-cta h2{
  font-family:var(--font-display);font-size:clamp(34px,4.5vw,56px);
  font-weight:700;letter-spacing:-.02em;line-height:1.1;
  color:var(--text);margin-bottom:22px;
}
.syl-cta h2 em{
  font-family: var(--font-display);
  font-style:italic;color:var(--olpa);font-weight:400;
}
.syl-cta p{
  font-size:17px;line-height:1.7;color:var(--text-2);
  margin-bottom:38px;max-width:600px;margin-left:auto;margin-right:auto;
}
.syl-cta-buttons{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ----- Responsive ----- */
@media (max-width:960px){
  .syl-container{grid-template-columns:1fr;gap:40px}
  .syl-sidebar{position:static;padding:24px 0}
  .syl-weeks-nav{
    display:grid;grid-template-columns:repeat(2,1fr);gap:6px;
  }
  .syl-cover{padding:100px 6% 60px}
  .syl-cover-meta{grid-template-columns:repeat(2,auto);gap:28px}
  .syl-line-2{padding-left:4%}
  .syl-line-3{padding-left:8%}
  .syl-cover-foot{padding-left:0}
  .wk-numberbig{font-size:80px}
  .case-metrics{grid-template-columns:repeat(2,1fr)}
  .wk-viz-rag .rv-diagram{grid-template-columns:1fr;gap:14px}
  .wk-viz-rag .rv-arrow{transform:rotate(90deg)}
  .wk-viz-agent .av-flow{grid-template-columns:1fr;gap:10px}
  .wk-viz-agent .av-arrow{transform:rotate(90deg);text-align:center}
  .wk-viz-adoption .adv-grid{grid-template-columns:repeat(4,1fr)}
  .wk-viz-ecosystem .ev-map{min-height:auto}
  .wk-viz-ecosystem .ev-center{position:static;transform:none;margin:0 auto 20px;display:block;text-align:center;max-width:200px}
  .wk-viz-ecosystem .ev-branch{position:static;transform:none;margin-bottom:8px}
}

/* ================================================================
   CANV — n8n developer/IDE skeleton (prefix .canv-*)
   Paleta: dark #050509, olpa #FFD60A, cyan, term-green #50fa7b, red #ff5555
   Font: JetBrains Mono dominante
   ================================================================ */
.canv-body{
  --canv-bg:#050509;
  --canv-bg-2:#0a0a13;
  --canv-bg-3:#10101c;
  --canv-panel:#0d0d17;
  --canv-border:#1e1e2e;
  --canv-border-hi:#2a2a3e;
  --canv-text:#e4e4ef;
  --canv-dim:#8a8aa0;
  --canv-mute:#5a5a70;
  --canv-olpa:#FFD60A;
  --canv-cyan:#7ee7ff;
  --canv-green:#50fa7b;
  --canv-red:#ff5555;
  --canv-yellow:#f1fa8c;
  --canv-mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  background:var(--canv-bg);
  color:var(--canv-text);
  font-family:var(--canv-mono);
  font-feature-settings:"liga" 0,"calt" 0;
}
.canv-body *{font-family:var(--canv-mono)}
.canv-body .canv-h1,.canv-body .canv-cta-h{font-family:"Space Grotesk","JetBrains Mono",sans-serif}

/* dots */
.canv-dots{display:inline-flex;gap:6px;align-items:center}
.canv-dot{width:11px;height:11px;border-radius:50%;display:inline-block;flex-shrink:0}
.canv-dot-r{background:#ff5f56;box-shadow:0 0 0 .5px rgba(0,0,0,.25) inset}
.canv-dot-y{background:#ffbd2e;box-shadow:0 0 0 .5px rgba(0,0,0,.25) inset}
.canv-dot-g{background:#27c93f;box-shadow:0 0 0 .5px rgba(0,0,0,.25) inset}

/* ---------- Top chrome (VSCode tab bar) ---------- */
.canv-chrome{
  background:linear-gradient(180deg,#0c0c18,#08080f);
  border-bottom:1px solid var(--canv-border);
  position:sticky;top:0;z-index:40;
}
.canv-chrome-inner{
  display:flex;align-items:center;gap:18px;
  padding:10px 18px 0;max-width:1400px;margin:0 auto;
}
.canv-chrome-inner .canv-dots{margin-right:4px}
.canv-tabs{display:flex;gap:2px;flex:1;min-width:0;overflow:hidden}
.canv-tab{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 14px 8px;font-size:12px;color:var(--canv-dim);
  background:#0a0a14;border:1px solid var(--canv-border);
  border-bottom:none;border-radius:6px 6px 0 0;
  white-space:nowrap;
}
.canv-tab-active{background:var(--canv-bg);color:var(--canv-text);border-top:2px solid var(--canv-olpa);padding-top:6px}
.canv-tab-icon{color:var(--canv-green);font-size:10px}
.canv-tab-x{color:var(--canv-mute);font-size:14px;margin-left:4px}
.canv-menu{display:flex;gap:14px;font-size:11px;color:var(--canv-dim);text-transform:lowercase;letter-spacing:.05em}
.canv-menu span{cursor:default}
.canv-menu span:hover{color:var(--canv-olpa)}
.canv-pathbar{
  max-width:1400px;margin:0 auto;
  display:flex;align-items:center;gap:8px;
  padding:8px 18px;font-size:11px;color:var(--canv-dim);
  border-top:1px solid var(--canv-border);
  background:var(--canv-bg);
}
.canv-path-chev{color:var(--canv-green)}
.canv-path-seg{color:var(--canv-dim)}
.canv-path-sep{color:var(--canv-mute)}
.canv-path-file{color:var(--canv-olpa)}
.canv-path-status{margin-left:auto;color:var(--canv-mute);font-size:10px;letter-spacing:.08em;text-transform:uppercase}

/* ---------- Section wrapper ---------- */
.canv-section{
  max-width:1400px;margin:0 auto;
  padding:64px 24px;
  position:relative;
}
.canv-section-head{margin-bottom:32px;max-width:760px}
.canv-badge{
  display:inline-block;font-size:11px;color:var(--canv-green);
  letter-spacing:.08em;margin-bottom:10px;
}
.canv-h2{
  font-size:clamp(24px,3vw,34px);margin:0 0 10px;
  color:var(--canv-text);font-weight:600;letter-spacing:-.01em;
}
.canv-lead{color:var(--canv-dim);font-size:14px;line-height:1.65;margin:0}

/* ---------- Hero ---------- */
.canv-hero{
  max-width:1400px;margin:0 auto;
  padding:36px 24px 56px;
}
.canv-crumb{
  font-size:11px;color:var(--canv-mute);
  letter-spacing:.06em;margin-bottom:22px;
}
.canv-crumb a{color:var(--canv-dim);text-decoration:none}
.canv-crumb a:hover{color:var(--canv-olpa)}
.canv-crumb span{margin:0 6px;color:var(--canv-mute)}
.canv-crumb-cur{color:var(--canv-olpa)}
.canv-hero-grid{
  display:grid;grid-template-columns:60% 40%;gap:20px;align-items:stretch;
}
@media (max-width:960px){.canv-hero-grid{grid-template-columns:1fr}}

/* Terminal window */
.canv-term{
  background:#07070e;border:1px solid var(--canv-border);
  border-radius:8px;overflow:hidden;
  box-shadow:0 24px 60px -30px rgba(0,0,0,.8),0 0 0 1px rgba(126,231,255,.03) inset;
}
.canv-term-head{
  display:flex;align-items:center;gap:8px;
  padding:9px 14px;background:#0e0e1a;border-bottom:1px solid var(--canv-border);
}
.canv-term-title{
  margin-left:auto;margin-right:auto;
  font-size:11px;color:var(--canv-dim);letter-spacing:.04em;
}
.canv-term-body{padding:18px 20px 22px;font-size:13px;line-height:1.65}
.canv-ascii{
  color:var(--canv-olpa);font-size:11px;line-height:1.15;margin:0 0 14px;
  white-space:pre;overflow:hidden;
}
.canv-line{white-space:pre-wrap;word-break:break-word}
.canv-prompt{color:var(--canv-green)}
.canv-cwd{color:var(--canv-cyan)}
.canv-sep{color:var(--canv-mute);margin:0 2px}
.canv-out{color:var(--canv-dim)}
.canv-ok{color:var(--canv-green)}
.canv-warn{color:var(--canv-olpa)}
.canv-bad{color:var(--canv-red)}
.canv-cyan{color:var(--canv-cyan)}
.canv-yellow{color:var(--canv-yellow)}
.canv-muted{color:var(--canv-mute)}
.canv-caret{
  display:inline-block;width:8px;height:15px;
  background:var(--canv-green);vertical-align:middle;
  animation:canv-blink 1s steps(2) infinite;margin-left:2px;
}
@keyframes canv-blink{0%,49%{opacity:1}50%,100%{opacity:0}}

/* Cheat sheet */
.canv-cheat{
  background:linear-gradient(180deg,#0e0e1a,#08080f);
  border:1px solid var(--canv-border);border-radius:8px;
  padding:22px 24px 26px;display:flex;flex-direction:column;
}
.canv-cheat-head{
  display:flex;justify-content:space-between;
  font-size:10px;color:var(--canv-mute);letter-spacing:.08em;
  padding-bottom:10px;border-bottom:1px dashed var(--canv-border);margin-bottom:18px;
  text-transform:uppercase;
}
.canv-cheat-mod{color:var(--canv-red)}
.canv-h1{
  font-size:clamp(48px,6vw,78px);margin:0 0 6px;
  color:var(--canv-olpa);font-weight:700;letter-spacing:-.02em;line-height:1;
}
.canv-tag{font-size:13px;color:var(--canv-dim);line-height:1.6;margin:0 0 18px}
.canv-kv{
  display:grid;grid-template-columns:auto 1fr;gap:6px 18px;
  font-size:12px;margin:0 0 22px;
}
.canv-kv dt{color:var(--canv-mute);text-transform:lowercase}
.canv-kv dt::after{content:":"}
.canv-kv dd{margin:0;color:var(--canv-text)}

/* Buttons */
.canv-btn-primary,.canv-btn-ghost{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-size:12px;font-weight:600;letter-spacing:.04em;
  padding:12px 18px;border-radius:6px;text-decoration:none;
  transition:transform .15s,background .15s,border-color .15s;
  text-transform:lowercase;
}
.canv-btn-primary{
  background:var(--canv-olpa);color:#050509;
  border:1px solid var(--canv-olpa);
  margin-bottom:8px;
}
.canv-btn-primary:hover{transform:translateY(-1px);background:#ffe44a}
.canv-btn-ghost{
  background:transparent;color:var(--canv-cyan);
  border:1px solid var(--canv-border-hi);
}
.canv-btn-ghost:hover{border-color:var(--canv-cyan);background:rgba(126,231,255,.05)}
.canv-btn-arrow{font-weight:400}
.canv-btn-lg{padding:15px 24px;font-size:13px}

/* ---------- Window ---------- */
.canv-win{
  background:var(--canv-panel);
  border:1px solid var(--canv-border);
  border-radius:10px;overflow:hidden;
  box-shadow:0 30px 80px -40px rgba(0,0,0,.8);
}
.canv-win-head{
  display:flex;align-items:center;gap:10px;
  padding:10px 16px;background:#0e0e1a;
  border-bottom:1px solid var(--canv-border);
}
.canv-win-title{font-size:12px;color:var(--canv-text);margin-left:8px}
.canv-win-meta{margin-left:auto;font-size:10px;color:var(--canv-mute);letter-spacing:.06em;text-transform:uppercase}
.canv-win-body{padding:32px 40px}
@media (max-width:720px){.canv-win-body{padding:24px 20px}}

/* Markdown body */
.canv-md-h1{color:var(--canv-olpa);font-size:22px;margin:0 0 14px;font-weight:600}
.canv-md-h2{color:var(--canv-cyan);font-size:16px;margin:26px 0 12px;font-weight:600}
.canv-md p{color:var(--canv-dim);line-height:1.75;font-size:13.5px;margin:0 0 14px}
.canv-md strong{color:var(--canv-text)}
.canv-md em{color:var(--canv-yellow);font-style:normal}
.canv-md-ul{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:8px}
.canv-md-ul li{display:flex;gap:10px;font-size:13px;color:var(--canv-dim);line-height:1.65}
.canv-md-bullet{color:var(--canv-green);flex-shrink:0}

.canv-admon{
  margin:22px 0;padding:16px 20px;
  background:rgba(80,250,123,.04);
  border-left:3px solid var(--canv-green);
  border-radius:0 6px 6px 0;
}
.canv-admon-tip .canv-admon-head{color:var(--canv-green)}
.canv-admon-head{font-size:11px;font-weight:700;letter-spacing:.1em;margin-bottom:6px;display:flex;align-items:center;gap:6px}
.canv-admon p{margin:0;font-size:13px;color:var(--canv-text);line-height:1.65}
.canv-admon strong{color:var(--canv-olpa)}

.canv-usecases{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:12px}
@media (max-width:720px){.canv-usecases{grid-template-columns:1fr}}
.canv-uc{
  display:flex;gap:14px;padding:14px 16px;
  background:#09091220;border:1px solid var(--canv-border);border-radius:6px;
}
.canv-uc-key{color:var(--canv-olpa);font-size:11px;font-weight:700;flex-shrink:0}
.canv-uc strong{display:block;color:var(--canv-text);font-size:13px;margin-bottom:3px}
.canv-uc p{margin:0;font-size:12px;color:var(--canv-dim);line-height:1.55}

/* ---------- Workflow canvas ---------- */
.canv-win-flow{background:#06060c}
.canv-flow{
  position:relative;padding:40px 30px;min-height:420px;
  background:#06060c;overflow-x:auto;
}
.canv-flow-grid{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(126,231,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(126,231,255,.04) 1px,transparent 1px);
  background-size:24px 24px;
}
.canv-flow-row{
  position:relative;display:flex;align-items:center;gap:0;
  flex-wrap:nowrap;margin-bottom:32px;z-index:1;min-width:max-content;
}
.canv-flow-row-2{padding-left:80px}
.canv-node{
  display:flex;align-items:center;gap:12px;
  background:#0e0e1a;border:1px solid var(--canv-border-hi);
  border-radius:10px;padding:14px 18px;min-width:200px;
  position:relative;
  box-shadow:0 10px 30px -15px rgba(0,0,0,.8);
}
.canv-node-trigger{border-left:3px solid var(--canv-green)}
.canv-node-ai{border-left:3px solid var(--canv-olpa)}
.canv-node-db{border-left:3px solid var(--canv-cyan)}
.canv-node-if{border-left:3px solid var(--canv-yellow)}
.canv-node-odoo{border-left:3px solid #a78bfa}
.canv-node-wa{border-left:3px solid var(--canv-green)}
.canv-node-ico{
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#05050a;border:1px solid var(--canv-border-hi);
  color:var(--canv-olpa);font-size:14px;flex-shrink:0;
}
.canv-node-body{flex:1;min-width:0}
.canv-node-title{font-size:13px;color:var(--canv-text);font-weight:600}
.canv-node-sub{font-size:10px;color:var(--canv-mute);margin-top:2px;text-transform:lowercase}
.canv-node-preview{
  position:absolute;top:-8px;right:8px;
  font-size:9px;color:var(--canv-green);
  background:#050509;padding:2px 6px;border-radius:3px;
  border:1px solid var(--canv-border);
}
.canv-edge{
  flex-shrink:0;min-width:50px;height:2px;
  background:linear-gradient(90deg,var(--canv-border-hi),var(--canv-cyan),var(--canv-border-hi));
  position:relative;margin:0 4px;
}
.canv-edge-label{
  position:absolute;top:-18px;left:50%;transform:translateX(-50%);
  font-size:9px;color:var(--canv-cyan);background:#06060c;padding:1px 6px;
  border:1px solid var(--canv-border);border-radius:3px;
}

/* ---------- Duo terminals ---------- */
.canv-duo{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:28px}
@media (max-width:860px){.canv-duo{grid-template-columns:1fr}}

/* ---------- Table ---------- */
.canv-table-wrap{
  background:var(--canv-panel);
  border:1px solid var(--canv-border);border-radius:8px;overflow:hidden;
}
.canv-table{width:100%;border-collapse:collapse;font-size:13px}
.canv-table th,.canv-table td{
  padding:14px 18px;text-align:left;
  border-bottom:1px solid var(--canv-border);
}
.canv-table thead th{
  background:#0e0e1a;font-size:11px;color:var(--canv-olpa);
  text-transform:uppercase;letter-spacing:.1em;
}
.canv-table tbody td:first-child{color:var(--canv-dim)}
.canv-table tbody td.canv-ok{color:var(--canv-green)}
.canv-table tbody td.canv-bad{color:var(--canv-red)}
.canv-table tr:last-child td{border-bottom:none}

/* ---------- Marquee ---------- */
.canv-marquee{
  overflow:hidden;
  border-top:1px solid var(--canv-border);
  border-bottom:1px solid var(--canv-border);
  padding:18px 0;
  mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
}
.canv-marquee-track{
  display:flex;gap:10px;width:max-content;
  animation:canv-marquee 60s linear infinite;
}
@keyframes canv-marquee{to{transform:translateX(-50%)}}
.canv-chip{
  display:inline-block;padding:7px 14px;
  background:#0e0e1a;border:1px solid var(--canv-border-hi);
  border-radius:4px;font-size:12px;color:var(--canv-cyan);
  white-space:nowrap;
}
.canv-chip:nth-child(3n){color:var(--canv-olpa)}
.canv-chip:nth-child(5n){color:var(--canv-green)}

/* ---------- Specs ---------- */
.canv-specs{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:960px){.canv-specs{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.canv-specs{grid-template-columns:1fr}}
.canv-spec{
  background:var(--canv-panel);
  border:1px solid var(--canv-border);border-radius:8px;
  padding:20px 22px;
  transition:border-color .2s,transform .2s;
}
.canv-spec:hover{border-color:var(--canv-border-hi);transform:translateY(-2px)}
.canv-spec-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.canv-spec-num{
  font-size:10px;color:var(--canv-green);font-weight:700;
  background:rgba(80,250,123,.08);padding:3px 7px;border-radius:3px;
}
.canv-spec-title{font-size:14px;color:var(--canv-text);font-weight:600}
.canv-spec p{margin:0 0 14px;font-size:12.5px;color:var(--canv-dim);line-height:1.6}
.canv-snip{
  background:#05050a;border:1px solid var(--canv-border);border-radius:5px;
  padding:10px 12px;font-size:11px;color:var(--canv-cyan);
  line-height:1.55;margin:0;overflow-x:auto;white-space:pre;
}

/* ---------- Case study ---------- */
.canv-case{display:grid;grid-template-columns:1.4fr 1fr;gap:28px;padding:32px 40px}
@media (max-width:860px){.canv-case{grid-template-columns:1fr;padding:24px 20px}}
.canv-case-label{font-size:11px;color:var(--canv-green);margin-bottom:8px;letter-spacing:.06em}
.canv-case-title{
  font-size:clamp(20px,2.6vw,28px);margin:0 0 14px;
  color:var(--canv-olpa);font-weight:600;line-height:1.2;
}
.canv-case-body{color:var(--canv-dim);font-size:13.5px;line-height:1.75;margin:0 0 22px}
.canv-case-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:22px}
.canv-metric{
  padding:14px;background:#06060c;border:1px solid var(--canv-border);
  border-radius:6px;text-align:center;
}
.canv-metric strong{display:block;font-size:22px;color:var(--canv-cyan);font-weight:700;margin-bottom:2px}
.canv-metric span{font-size:10px;color:var(--canv-mute);text-transform:uppercase;letter-spacing:.06em}
.canv-case-flow{
  background:#06060c;border:1px solid var(--canv-border);
  border-radius:8px;padding:18px;display:grid;gap:6px;
}
.canv-case-step{
  display:flex;align-items:center;gap:12px;
  padding:10px 12px;background:#0e0e1a;
  border:1px solid var(--canv-border);border-radius:5px;
}
.canv-case-ico{
  width:30px;height:30px;display:flex;align-items:center;justify-content:center;
  background:#05050a;color:var(--canv-olpa);border-radius:50%;
  border:1px solid var(--canv-border-hi);font-size:12px;flex-shrink:0;
}
.canv-case-step strong{display:block;font-size:12px;color:var(--canv-text);font-weight:600}
.canv-case-step span{font-size:10px;color:var(--canv-mute)}
.canv-case-arrow{text-align:center;color:var(--canv-green);font-size:14px;padding:2px 0}

/* ---------- Pricing ---------- */
.canv-pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media (max-width:960px){.canv-pricing{grid-template-columns:1fr}}
.canv-price{
  background:var(--canv-panel);
  border:1px solid var(--canv-border);border-radius:10px;
  padding:28px 26px;display:flex;flex-direction:column;
}
.canv-price-hl{
  border-color:var(--canv-olpa);
  box-shadow:0 0 0 1px var(--canv-olpa),0 30px 60px -30px rgba(255,214,10,.3);
  background:linear-gradient(180deg,rgba(255,214,10,.04),var(--canv-panel) 40%);
  transform:scale(1.02);
}
.canv-price-head{margin-bottom:18px}
.canv-price-tag{
  display:inline-block;font-size:10px;color:var(--canv-green);
  background:rgba(80,250,123,.08);padding:3px 8px;border-radius:3px;
  letter-spacing:.08em;margin-bottom:10px;text-transform:uppercase;
}
.canv-price-tag-hl{color:var(--canv-olpa);background:rgba(255,214,10,.12)}
.canv-price-name{font-size:18px;color:var(--canv-text);margin:0;font-weight:600}
.canv-price-amt{font-size:42px;color:var(--canv-olpa);font-weight:700;line-height:1;margin-bottom:4px}
.canv-price-cur{font-size:22px;vertical-align:top;margin-right:2px}
.canv-price-per{font-size:11px;color:var(--canv-mute);font-weight:400;margin-left:6px}
.canv-price-sub{font-size:11px;color:var(--canv-dim);margin:0 0 18px}
.canv-price-list{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:8px;flex:1}
.canv-price-list li{font-size:12px;color:var(--canv-dim);line-height:1.5}

/* ---------- Video ---------- */
.canv-video{
  background:var(--canv-panel);
  border:1px solid var(--canv-border);border-radius:10px;overflow:hidden;
}
.canv-video-chrome{
  display:flex;align-items:center;gap:10px;
  padding:10px 16px;background:#0e0e1a;border-bottom:1px solid var(--canv-border);
}
.canv-video-title{font-size:11px;color:var(--canv-dim);margin-left:8px}
.canv-video-frame{position:relative;aspect-ratio:16/9;background:#000}
.canv-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- Resources ---------- */
.canv-res{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
@media (max-width:960px){.canv-res{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.canv-res{grid-template-columns:1fr}}
.canv-res-card{
  display:block;padding:22px;
  background:var(--canv-panel);border:1px solid var(--canv-border);
  border-radius:8px;text-decoration:none;position:relative;
  transition:border-color .2s,transform .2s;
}
.canv-res-card:hover{border-color:var(--canv-cyan);transform:translateY(-2px)}
.canv-res-label{font-size:10px;color:var(--canv-green);letter-spacing:.05em;text-transform:lowercase}
.canv-res-card h3{font-size:15px;color:var(--canv-text);margin:8px 0 6px;font-weight:600}
.canv-res-card p{font-size:12px;color:var(--canv-dim);margin:0;line-height:1.5}
.canv-res-arrow{position:absolute;top:20px;right:20px;color:var(--canv-olpa);font-size:16px}

/* ---------- FAQ ---------- */
.canv-faq{display:grid;gap:10px;max-width:900px}
.canv-q{
  background:var(--canv-panel);
  border:1px solid var(--canv-border);border-radius:6px;
  padding:16px 20px;
}
.canv-q[open]{border-color:var(--canv-border-hi);background:#0e0e1a}
.canv-q summary{
  cursor:pointer;display:flex;align-items:center;gap:12px;
  font-size:13.5px;color:var(--canv-text);font-weight:500;
  list-style:none;
}
.canv-q summary::-webkit-details-marker{display:none}
.canv-q-tag{
  display:inline-flex;align-items:center;justify-content:center;
  width:22px;height:22px;border-radius:4px;
  background:rgba(255,214,10,.1);color:var(--canv-olpa);
  font-size:11px;font-weight:700;flex-shrink:0;
}
.canv-q-tag-a{background:rgba(80,250,123,.1);color:var(--canv-green)}
.canv-q-a{display:flex;gap:12px;margin-top:14px;padding-top:14px;border-top:1px dashed var(--canv-border)}
.canv-q-a p{margin:0;font-size:13px;color:var(--canv-dim);line-height:1.7}

/* ---------- CTA ---------- */
.canv-cta-section{padding-bottom:96px}
.canv-cta{
  background:linear-gradient(180deg,#0e0e1a,#08080f);
  border:1px solid var(--canv-olpa);border-radius:12px;overflow:hidden;
  box-shadow:0 40px 100px -40px rgba(255,214,10,.3);
}
.canv-cta-chrome{
  display:flex;align-items:center;gap:10px;
  padding:10px 16px;background:#0e0e1a;border-bottom:1px solid var(--canv-border);
}
.canv-cta-title{font-size:11px;color:var(--canv-dim);margin-left:8px}
.canv-cta-body{padding:40px 48px 48px}
@media (max-width:720px){.canv-cta-body{padding:28px 22px 36px}}
.canv-cta-line{font-size:12px;color:var(--canv-dim);margin-bottom:18px}
.canv-cta-h{
  font-size:clamp(28px,4vw,44px);color:var(--canv-olpa);
  margin:0 0 14px;font-weight:700;line-height:1.1;letter-spacing:-.01em;
}
.canv-cta-p{font-size:14px;color:var(--canv-dim);line-height:1.75;margin:0 0 26px;max-width:700px}
.canv-cta-btns{display:flex;gap:12px;flex-wrap:wrap}

/* ---------- Responsive ---------- */
@media (max-width:720px){
  .canv-chrome-inner{padding:10px 14px 0;gap:10px}
  .canv-menu{display:none}
  .canv-tab:not(.canv-tab-active){display:none}
  .canv-pathbar{padding:8px 14px;font-size:10px}
  .canv-section{padding:44px 16px}
  .canv-hero{padding:24px 16px 40px}
  .canv-term-body{padding:14px 16px 18px;font-size:11.5px}
  .canv-ascii{font-size:9px}
  .canv-h1{font-size:54px}
  .canv-case-metrics{grid-template-columns:1fr 1fr}
  .canv-flow{padding:24px 18px}
  .canv-flow-row-2{padding-left:0}
}


/* ==========================================================================
   CAPACITACIÓN IN-COMPANY — Executive proposal document (.prop-*)
   Unique skeleton: contractual/legal aesthetic, dashed borders, mono-heavy.
   ========================================================================== */
.prop-body{background:#050509;color:#f4f4f2;font-family:'Space Grotesk',system-ui,sans-serif}
.prop-body section{position:relative}

/* ---------- Shared section head ---------- */
.prop-section-head{display:flex;align-items:center;gap:16px;max-width:1200px;margin:0 auto 32px;padding:0 6%}
.prop-section-num{font-family:'JetBrains Mono',monospace;font-size:13px;color:#FFD60A;font-weight:700;letter-spacing:.12em;border:1px solid #FFD60A;padding:6px 10px;background:rgba(255,214,10,.04)}
.prop-section-label{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.28em;color:#e8e8e6;text-transform:uppercase;font-weight:600}
.prop-section-rule{flex:1;height:1px;background:repeating-linear-gradient(90deg,#3a3a44 0 6px,transparent 6px 10px)}
.prop-section-intro{max-width:820px;margin:0 auto 48px;padding:0 6%;font-size:16px;line-height:1.65;color:#b8b8b2;font-family: var(--font-display);font-style:italic}

/* ---------- Cover (portada) ---------- */
.prop-cover{min-height:100vh;padding:120px 6% 80px;position:relative;overflow:hidden;border-bottom:1px dashed #2a2a34}
.prop-cover-corners{position:absolute;inset:100px 6% 60px;pointer-events:none;z-index:2}
.prop-corner{position:absolute;width:28px;height:28px;border:1px solid #FFD60A}
.prop-corner-tl{top:0;left:0;border-right:none;border-bottom:none}
.prop-corner-tr{top:0;right:0;border-left:none;border-bottom:none}
.prop-corner-bl{bottom:0;left:0;border-right:none;border-top:none}
.prop-corner-br{bottom:0;right:0;border-left:none;border-top:none}
.prop-watermark{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) rotate(-30deg);font-family:'JetBrains Mono',monospace;font-size:180px;font-weight:900;letter-spacing:.1em;color:#fff;opacity:.025;pointer-events:none;white-space:nowrap;z-index:1}
.prop-cover-head{position:relative;z-index:3;max-width:1200px;margin:0 auto 60px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 20px;border:1px dashed #3a3a44;background:rgba(255,255,255,.015)}
.prop-tag{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.22em;color:#FFD60A;font-weight:700;text-transform:uppercase}
.prop-dot{color:#555;font-family:'JetBrains Mono',monospace}
.prop-breadcrumb{position:relative;z-index:3;max-width:1200px;margin:0 auto 50px;display:flex;gap:10px;align-items:center;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;color:#7a7a80;text-transform:uppercase}
.prop-breadcrumb a{color:#b8b8b2;text-decoration:none;border-bottom:1px dotted #555}
.prop-breadcrumb a:hover{color:#FFD60A;border-color:#FFD60A}
.prop-breadcrumb .current{color:#FFD60A}
.prop-cover-meta{position:relative;z-index:3;max-width:1200px;margin:0 auto 60px;display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#2a2a34;border:1px solid #2a2a34}
.prop-meta-row{background:#050509;padding:16px 20px;display:flex;flex-direction:column;gap:4px}
.prop-meta-k{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.18em;color:#7a7a80;text-transform:uppercase}
.prop-meta-v{font-family:'JetBrains Mono',monospace;font-size:13px;color:#f4f4f2;font-weight:600}
.prop-cover-title{position:relative;z-index:3;max-width:1200px;margin:0 auto 60px;display:flex;flex-direction:column;gap:18px}
.prop-title-pre{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.22em;color:#00d4ff;text-transform:uppercase;font-weight:600}
.prop-title-main{font-family: var(--font-display);font-style:italic;font-weight:400;font-size:clamp(52px,9vw,128px);line-height:.95;color:#f4f4f2;letter-spacing:-.02em}
.prop-title-sub{font-family: var(--font-display);font-style:normal;font-size:clamp(20px,2.6vw,32px);color:#b8b8b2;line-height:1.35;max-width:780px}
.prop-title-sub em{color:#FFD60A;font-style:italic}
.prop-cover-foot{position:relative;z-index:3;max-width:760px;margin:0 auto 0 auto;padding-top:30px;border-top:1px dashed #2a2a34}
.prop-cover-abstract{font-family: var(--font-display);font-size:16px;line-height:1.75;color:#c8c8c2;font-style:italic}
.prop-seal{position:absolute;bottom:60px;right:6%;color:#FFD60A;opacity:.7;z-index:3}

/* ---------- Executive summary ---------- */
.prop-exec{padding:100px 0 80px;border-bottom:1px dashed #2a2a34}
.prop-exec-numbers{max-width:1200px;margin:0 auto 50px;padding:40px 6%;display:flex;align-items:center;justify-content:space-between;gap:20px;border:1px solid #2a2a34;border-left:3px solid #FFD60A;background:rgba(255,255,255,.01);flex-wrap:wrap}
.prop-exec-num{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.prop-exec-big{font-family: var(--font-display);font-size:clamp(48px,6vw,88px);font-weight:400;color:#FFD60A;line-height:1;letter-spacing:-.03em}
.prop-exec-big em{font-style:normal;font-size:.55em;color:#00d4ff;margin-left:4px}
.prop-exec-cap{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;color:#b8b8b2;text-transform:uppercase}
.prop-exec-sep{color:#3a3a44;font-family:'JetBrains Mono',monospace;font-size:40px;font-weight:100}
.prop-exec-abstract{max-width:880px;margin:0 auto;padding:0 6%;font-family: var(--font-display);font-size:18px;line-height:1.7;color:#d8d8d2;font-style:italic;text-align:center}

/* ---------- TOC ---------- */
.prop-toc{padding:100px 0;border-bottom:1px dashed #2a2a34}
.prop-toc-list{max-width:900px;margin:0 auto;padding:0 6%;list-style:none;display:flex;flex-direction:column;gap:2px}
.prop-toc-list li a{display:flex;align-items:baseline;gap:14px;padding:18px 20px;text-decoration:none;color:#e8e8e6;border-bottom:1px dotted #2a2a34;transition:all .2s ease;font-family:'JetBrains Mono',monospace}
.prop-toc-list li a:hover{background:rgba(255,214,10,.03);color:#FFD60A;padding-left:28px}
.prop-toc-n{color:#FFD60A;font-size:14px;font-weight:700;min-width:44px}
.prop-toc-t{font-family: var(--font-display);font-size:20px;font-style:italic;color:inherit}
.prop-toc-dots{flex:1;border-bottom:1px dotted #3a3a44;margin:0 8px;transform:translateY(-4px)}
.prop-toc-p{font-size:11px;letter-spacing:.14em;color:#7a7a80;text-transform:uppercase}

/* ---------- Sección 1 — Áreas bento ---------- */
.prop-areas{padding:120px 0 100px;border-bottom:1px dashed #2a2a34}
.prop-bento{max-width:1200px;margin:0 auto;padding:0 6%;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(4,auto);gap:18px}
.prop-bento-tile{position:relative;padding:32px 28px;border:1px solid #2a2a34;background:rgba(255,255,255,.015);display:flex;flex-direction:column;gap:14px;transition:all .25s ease}
.prop-bento-tile:hover{border-color:#FFD60A;background:rgba(255,214,10,.03);transform:translateY(-2px)}
.prop-bento-a{grid-column:span 2;grid-row:span 2}
.prop-bento-b{grid-column:span 1;grid-row:span 1}
.prop-bento-c{grid-column:span 1;grid-row:span 2}
.prop-bento-d{grid-column:span 1;grid-row:span 1}
.prop-bento-e{grid-column:span 1;grid-row:span 1}
.prop-bento-f{grid-column:span 2;grid-row:span 1}
.prop-bento-icon{color:#FFD60A;margin-bottom:4px}
.prop-bento-name{font-family: var(--font-display);font-style:italic;font-size:28px;color:#f4f4f2;font-weight:400;margin:0;letter-spacing:-.01em}
.prop-bento-desc{font-size:14px;line-height:1.6;color:#b8b8b2;margin:0}
.prop-bento-ex{font-family:'JetBrains Mono',monospace;font-size:11px;line-height:1.5;color:#00d4ff;margin:auto 0 0;padding-top:14px;border-top:1px dashed #2a2a34}
.prop-ex-k{color:#7a7a80;text-transform:uppercase;letter-spacing:.1em;margin-right:6px}
.prop-bento-id{position:absolute;top:14px;right:16px;font-family:'JetBrains Mono',monospace;font-size:10px;color:#555;letter-spacing:.14em}

/* ---------- Sección 2 — Gantt timeline ---------- */
.prop-metodo{padding:120px 0 100px;border-bottom:1px dashed #2a2a34}
.prop-gantt{max-width:1200px;margin:0 auto;padding:40px 6%;border:1px solid #2a2a34;background:rgba(255,255,255,.01)}
.prop-gantt-axis{display:grid;grid-template-columns:240px repeat(8,1fr);gap:0;padding-bottom:14px;border-bottom:1px dashed #3a3a44;margin-bottom:18px;font-family:'JetBrains Mono',monospace;font-size:10px;color:#7a7a80;letter-spacing:.1em;text-transform:uppercase}
.prop-gantt-axis span:first-child{grid-column:1}
.prop-gantt-axis span{padding-left:6px;border-left:1px dotted #2a2a34}
.prop-gantt-rows{display:flex;flex-direction:column;gap:14px}
.prop-gantt-row{display:grid;grid-template-columns:240px 1fr;gap:20px;align-items:center}
.prop-gantt-label{display:flex;flex-direction:column;gap:4px;padding-right:16px;border-right:1px dashed #3a3a44}
.prop-gantt-num{font-family:'JetBrains Mono',monospace;font-size:10px;color:#FFD60A;letter-spacing:.18em;font-weight:700}
.prop-gantt-name{font-family: var(--font-display);font-style:italic;font-size:22px;color:#f4f4f2}
.prop-gantt-dur{font-family:'JetBrains Mono',monospace;font-size:11px;color:#00d4ff;letter-spacing:.08em}
.prop-gantt-bar{position:relative;height:40px;background:rgba(255,214,10,.12);border:1px solid #FFD60A;margin-left:calc(var(--s) * 1%);width:calc((var(--e) - var(--s)) * 1%);display:flex;align-items:center;padding:0 14px}
.prop-gantt-barlabel{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.08em;color:#FFD60A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.prop-gantt-legend{margin-top:30px;padding-top:20px;border-top:1px dashed #3a3a44;display:flex;flex-wrap:wrap;gap:10px;font-family:'JetBrains Mono',monospace;font-size:11px;color:#b8b8b2;letter-spacing:.06em}
.prop-gantt-lk{color:#FFD60A;text-transform:uppercase;letter-spacing:.14em;font-weight:700;margin-right:10px}

/* ---------- Sección 3 — Modalidades ---------- */
.prop-mods{padding:120px 0 100px;border-bottom:1px dashed #2a2a34}
.prop-mods-grid{max-width:1200px;margin:0 auto;padding:0 6%;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.prop-mod{border:1px solid #2a2a34;background:rgba(255,255,255,.015);padding:30px 28px;display:flex;flex-direction:column;gap:22px;position:relative;transition:all .25s}
.prop-mod:hover{border-color:#FFD60A}
.prop-mod-featured{border-color:#FFD60A;background:rgba(255,214,10,.04)}
.prop-mod-head{padding-bottom:18px;border-bottom:1px dashed #3a3a44;display:flex;flex-direction:column;gap:6px;position:relative}
.prop-mod-code{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.18em;color:#00d4ff;text-transform:uppercase}
.prop-mod-name{font-family: var(--font-display);font-style:italic;font-size:36px;color:#f4f4f2;margin:0;font-weight:400}
.prop-mod-flag{position:absolute;top:0;right:0;font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.16em;color:#050509;background:#FFD60A;padding:4px 8px;text-transform:uppercase;font-weight:700}
.prop-mod-specs{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 14px;font-family:'JetBrains Mono',monospace;font-size:11px}
.prop-mod-specs dt{color:#7a7a80;letter-spacing:.08em;text-transform:uppercase}
.prop-mod-specs dd{color:#e8e8e6;margin:0}
.prop-mod-pc{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-top:18px;border-top:1px dashed #3a3a44}
.prop-mod-pros,.prop-mod-cons{display:flex;flex-direction:column;gap:8px}
.prop-pc-k{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.16em;color:#FFD60A;text-transform:uppercase;font-weight:700}
.prop-mod-cons .prop-pc-k{color:#ff6a5c}
.prop-mod-pros ul,.prop-mod-cons ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:5px;font-size:12px;line-height:1.5;color:#b8b8b2}
.prop-mod-pros li::before{content:"+ ";color:#FFD60A;font-family:'JetBrains Mono',monospace}
.prop-mod-cons li::before{content:"− ";color:#ff6a5c;font-family:'JetBrains Mono',monospace}

/* ---------- Sección 4 — Pricing ---------- */
.prop-pricing{padding:120px 0 100px;border-bottom:1px dashed #2a2a34}
.prop-price-table{max-width:1200px;margin:0 auto;padding:0 6%;width:100%;border-collapse:collapse;font-family:'JetBrains Mono',monospace;box-sizing:border-box}
.prop-price-table thead th{padding:20px 18px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#e8e8e6;border:1px solid #2a2a34;background:rgba(255,255,255,.02);font-weight:700;text-align:left}
.prop-th-label{color:#7a7a80!important;background:transparent!important;border-color:transparent!important}
.prop-th-featured{color:#FFD60A!important;background:rgba(255,214,10,.05)!important;border-color:#FFD60A!important}
.prop-price-table tbody td{padding:18px;font-size:13px;color:#d8d8d2;border:1px solid #2a2a34;vertical-align:top}
.prop-td-label{color:#7a7a80!important;font-size:11px;letter-spacing:.1em;text-transform:uppercase;background:rgba(255,255,255,.01)}
.prop-range{color:#FFD60A;font-size:18px;font-weight:700;letter-spacing:.08em}
.prop-price-row-cta td{background:rgba(255,214,10,.04);border-color:#FFD60A!important}
.prop-td-cta{color:#FFD60A!important;font-size:13px;letter-spacing:.08em;text-align:center;font-weight:700}
.prop-price-fineprint{max-width:1050px;margin:24px auto 0;padding:0 6%;font-family: var(--font-display);font-style:italic;font-size:12px;line-height:1.7;color:#7a7a80}

/* ---------- Sección 5 — Cases ---------- */
.prop-cases{padding:120px 0 100px;border-bottom:1px dashed #2a2a34}
.prop-cases-grid{max-width:1200px;margin:0 auto;padding:0 6%;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.prop-case{border:1px solid #2a2a34;background:rgba(255,255,255,.015);padding:26px 24px;display:flex;flex-direction:column;gap:18px;position:relative}
.prop-case::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:repeating-linear-gradient(90deg,#FFD60A 0 12px,transparent 12px 18px)}
.prop-case-head{display:flex;justify-content:space-between;align-items:baseline;padding-bottom:14px;border-bottom:1px dashed #3a3a44}
.prop-case-ref{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.16em;color:#FFD60A;font-weight:700}
.prop-case-sector{font-family: var(--font-display);font-style:italic;font-size:20px;color:#f4f4f2}
.prop-case-body{display:flex;flex-direction:column;gap:10px}
.prop-case-brief{margin:0;font-size:13px;line-height:1.5;color:#d8d8d2;font-family:'JetBrains Mono',monospace}
.prop-case-k{display:inline-block;min-width:76px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#7a7a80;margin-right:8px}
.prop-case-foot{padding-top:14px;border-top:1px dashed #3a3a44}
.prop-case-check{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#00d4ff}
.prop-case-check::before{content:"[ ✓ ] "}

/* ---------- Sección 6 — Terms ---------- */
.prop-terms{padding:120px 0 100px;border-bottom:1px dashed #2a2a34}
.prop-terms-list{max-width:900px;margin:0 auto;padding:0 6%;list-style:none;display:flex;flex-direction:column;gap:20px;counter-reset:t}
.prop-terms-list li{padding:18px 22px;border-left:2px solid #2a2a34;font-family: var(--font-display);font-size:14px;line-height:1.75;color:#b8b8b2;font-style:italic;background:rgba(255,255,255,.008)}
.prop-terms-n{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;color:#FFD60A;margin-bottom:6px;text-transform:uppercase;font-style:normal;font-weight:700}

/* ---------- Firma CTA ---------- */
.prop-sign{padding:120px 6% 140px}
.prop-sign-box{max-width:900px;margin:0 auto;padding:60px 50px;border:1px solid #FFD60A;background:rgba(255,214,10,.03);position:relative}
.prop-sign-box::before,.prop-sign-box::after{content:"";position:absolute;width:20px;height:20px;border:1px solid #FFD60A}
.prop-sign-box::before{top:-1px;left:-1px;border-right:none;border-bottom:none}
.prop-sign-box::after{bottom:-1px;right:-1px;border-left:none;border-top:none}
.prop-sign-head{display:flex;align-items:center;gap:16px;margin-bottom:30px}
.prop-sign-tag{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.2em;color:#FFD60A;text-transform:uppercase;font-weight:700}
.prop-sign-rule{flex:1;height:1px;background:repeating-linear-gradient(90deg,#FFD60A 0 6px,transparent 6px 10px)}
.prop-sign-lead{font-family: var(--font-display);font-size:18px;line-height:1.6;color:#d8d8d2;font-style:italic;margin:0 0 36px}
.prop-sign-lines{display:flex;flex-direction:column;gap:24px;margin-bottom:40px}
.prop-sign-line{display:flex;flex-direction:column;gap:6px}
.prop-sign-dots{display:block;height:1px;border-bottom:1px dotted #7a7a80;width:100%}
.prop-sign-label{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;color:#7a7a80;text-transform:uppercase}
.prop-sign-cta{display:flex;gap:16px;flex-wrap:wrap;padding-top:30px;border-top:1px dashed #3a3a44}
.prop-btn-main{display:inline-block;padding:20px 34px;background:#FFD60A;color:#050509;font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:700;letter-spacing:.08em;text-decoration:none;text-transform:uppercase;transition:all .2s}
.prop-btn-main:hover{background:#fff;transform:translateY(-2px)}
.prop-btn-ghost{display:inline-block;padding:20px 28px;background:transparent;color:#f4f4f2;font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:600;letter-spacing:.08em;text-decoration:none;text-transform:uppercase;border:1px solid #3a3a44;transition:all .2s}
.prop-btn-ghost:hover{border-color:#FFD60A;color:#FFD60A}
.prop-sign-foot{margin:30px 0 0;padding-top:20px;border-top:1px dashed #2a2a34;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.12em;color:#7a7a80;text-transform:uppercase;display:flex;gap:10px;flex-wrap:wrap}
.prop-sign-sep{color:#3a3a44}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .prop-cover-meta{grid-template-columns:repeat(2,1fr)}
  .prop-bento{grid-template-columns:repeat(2,1fr)}
  .prop-bento-a,.prop-bento-c,.prop-bento-f{grid-column:span 2;grid-row:span 1}
  .prop-mods-grid{grid-template-columns:1fr;gap:18px}
  .prop-cases-grid{grid-template-columns:1fr}
  .prop-gantt-axis{grid-template-columns:160px repeat(8,1fr)}
  .prop-gantt-row{grid-template-columns:160px 1fr;gap:12px}
  .prop-exec-numbers{gap:24px;justify-content:flex-start}
  .prop-exec-sep{display:none}
}
@media (max-width:720px){
  .prop-cover{padding:100px 6% 60px;min-height:auto}
  .prop-cover-corners{inset:80px 6% 40px}
  .prop-watermark{font-size:100px}
  .prop-cover-head{gap:8px;font-size:10px}
  .prop-cover-meta{grid-template-columns:1fr}
  .prop-title-main{font-size:56px}
  .prop-seal{position:static;display:block;margin:40px auto 0}
  .prop-bento{grid-template-columns:1fr}
  .prop-bento-a,.prop-bento-c,.prop-bento-f{grid-column:span 1}
  .prop-exec{padding:80px 0 60px}
  .prop-exec-numbers{flex-direction:column;align-items:flex-start;gap:28px;padding:32px 6%}
  .prop-exec-big{font-size:64px}
  .prop-toc-list li a{flex-wrap:wrap;padding:14px 10px}
  .prop-toc-t{font-size:16px}
  .prop-toc-dots{display:none}
  .prop-gantt{padding:24px 5%}
  .prop-gantt-axis{display:none}
  .prop-gantt-row{grid-template-columns:1fr;gap:8px}
  .prop-gantt-label{border-right:none;border-bottom:1px dashed #3a3a44;padding:0 0 8px}
  .prop-gantt-bar{margin-left:0!important;width:100%!important}
  .prop-price-table,.prop-price-table tbody,.prop-price-table thead,.prop-price-table tr,.prop-price-table td,.prop-price-table th{display:block;width:100%;box-sizing:border-box}
  .prop-price-table thead{display:none}
  .prop-price-table tbody td{border-top:none}
  .prop-price-table tbody tr{margin-bottom:18px;border:1px solid #2a2a34}
  .prop-areas,.prop-metodo,.prop-mods,.prop-pricing,.prop-cases,.prop-terms{padding:80px 0 60px}
  .prop-sign{padding:80px 5% 100px}
  .prop-sign-box{padding:40px 24px}
  .prop-btn-main,.prop-btn-ghost{width:100%;text-align:center}
}

/* ==========================================================================
   CURSOS IA — Editorial catalog magazine (.cat-*)
   ========================================================================== */
.catalog-body{background:#050509;color:#f4f4f6;font-family:var(--font-body,'Inter',system-ui,sans-serif);-webkit-font-smoothing:antialiased}
.catalog-body em{font-family: var(--font-display);font-style:italic;font-weight:400}

/* -------- COVER masthead -------- */
.cat-cover{position:relative;min-height:100vh;padding:140px 6vw 40px;background:#050509;overflow:hidden;border-bottom:1px solid rgba(255,255,255,.08)}
.cat-cover-noise{position:absolute;inset:0;background:
  radial-gradient(circle at 85% 15%,rgba(255,214,10,.08),transparent 40%),
  radial-gradient(circle at 10% 90%,rgba(0,229,255,.06),transparent 45%);pointer-events:none}
.cat-cover::before{content:"";position:absolute;inset:0;background-image:
  linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:60px 60px;pointer-events:none}
.cat-breadcrumb{position:relative;z-index:2;font-family:var(--font-mono,'JetBrains Mono',monospace);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8a8a92;display:flex;gap:10px;align-items:center;margin-bottom:60px}
.cat-breadcrumb a{color:#c4c4cc;text-decoration:none;border-bottom:1px dotted rgba(255,255,255,.2)}
.cat-breadcrumb a:hover{color:#FFD60A}
.cat-sep{opacity:.4}
.cat-crumb-current{color:#FFD60A}
.cat-masthead{position:relative;z-index:2;display:grid;grid-template-columns:minmax(220px,280px) 1fr;gap:60px;align-items:start}

.cat-mast-left{border-top:2px solid #FFD60A;padding-top:20px}
.cat-mast-logo{font-family: var(--font-display);font-size:48px;line-height:.88;letter-spacing:-.02em;color:#fff;margin-bottom:32px;font-weight:700}
.cat-mast-logo em{display:block;color:#FFD60A;font-size:56px;margin-top:-4px}
.cat-mast-meta{border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);padding:14px 0;display:flex;flex-direction:column;gap:6px}
.cat-mast-row{display:flex;justify-content:space-between;gap:12px;font-family:var(--font-mono,monospace);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:4px 0;border-bottom:1px dotted rgba(255,255,255,.08)}
.cat-mast-row:last-child{border-bottom:0}
.cat-mast-k{color:#6e6e78}
.cat-mast-v{color:#f4f4f6;font-weight:600}
.cat-mast-barcode{margin-top:24px;display:flex;gap:2px;align-items:flex-end;height:44px;position:relative;padding-bottom:14px}
.cat-mast-barcode span{display:block;width:3px;background:#f4f4f6;height:100%}
.cat-mast-barcode span:nth-child(odd){width:2px;height:70%}
.cat-mast-barcode span:nth-child(3n){width:4px}
.cat-mast-barcode span:nth-child(5n){height:90%}
.cat-mast-barcode-num{position:absolute;left:0;bottom:0;font-family:var(--font-mono,monospace);font-size:9px;letter-spacing:.15em;color:#8a8a92}

.cat-mast-right{display:flex;flex-direction:column;gap:30px}
.cat-mast-title{font-family:var(--font-display,'Space Grotesk',sans-serif);font-weight:700;line-height:.82;letter-spacing:-.04em;margin:0;color:#fff;display:flex;flex-direction:column}
.cat-mast-line{display:block;font-size:clamp(80px,13vw,200px)}
.cat-mast-line-1{transform:translateX(-2%)}
.cat-mast-line-2{font-family: var(--font-display);font-style:italic;color:#FFD60A;font-weight:400;transform:translateX(12%);font-size:clamp(100px,15vw,240px)}
.cat-mast-line-3{text-align:right;color:#f4f4f6;opacity:.92}
.cat-mast-deck{max-width:560px;font-size:18px;line-height:1.55;color:#b8b8c0;margin:0;border-left:2px solid #FFD60A;padding-left:18px;align-self:flex-end}

.cat-mast-strip{position:absolute;left:-8%;bottom:72px;width:120%;transform:rotate(-3.5deg);background:#FFD60A;color:#050509;padding:14px 0;display:flex;gap:28px;justify-content:center;align-items:center;font-family:var(--font-mono,monospace);font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;box-shadow:0 20px 60px rgba(0,0,0,.5);z-index:3;white-space:nowrap;overflow:hidden}

/* -------- AGENDA headerband -------- */
.cat-agenda{position:sticky;top:0;z-index:20;background:#0a0a12;border-top:1px solid rgba(255,214,10,.25);border-bottom:1px solid rgba(255,255,255,.08);display:flex;align-items:stretch;padding:0;backdrop-filter:blur(8px)}
.cat-agenda-label{flex:0 0 auto;background:#FFD60A;color:#050509;display:flex;align-items:center;gap:10px;padding:0 24px;font-family:var(--font-mono,monospace);font-size:12px;font-weight:700;letter-spacing:.15em}
.cat-agenda-dot{width:8px;height:8px;border-radius:50%;background:#050509;animation:cat-pulse 1.8s ease-in-out infinite}
@keyframes cat-pulse{0%,100%{opacity:1}50%{opacity:.25}}
.cat-agenda-track{flex:1 1 auto;display:flex;overflow-x:auto;scrollbar-width:none}
.cat-agenda-track::-webkit-scrollbar{display:none}
.cat-agenda-item{flex:1 0 auto;min-width:200px;display:grid;grid-template-columns:auto auto 1fr;gap:10px;align-items:center;padding:14px 20px;border-right:1px solid rgba(255,255,255,.06)}
.cat-agenda-item:last-child{border-right:0}
.cat-agenda-active{background:rgba(255,214,10,.06)}
.cat-agenda-month{font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:.12em;color:#8a8a92}
.cat-agenda-day{font-family:var(--font-display,'Space Grotesk',sans-serif);font-size:28px;font-weight:700;line-height:1;color:#fff;letter-spacing:-.02em}
.cat-agenda-active .cat-agenda-day{color:#FFD60A}
.cat-agenda-info{min-width:0}
.cat-agenda-course{font-size:12px;color:#e4e4ea;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cat-agenda-count{font-family:var(--font-mono,monospace);font-size:10px;color:#6e6e78;letter-spacing:.08em;text-transform:uppercase;margin-top:2px}

/* -------- CATÁLOGO masonry -------- */
.cat-catalog{padding:120px 6vw 80px;background:#050509;position:relative}
.cat-catalog-header{max-width:860px;margin:0 auto 70px;text-align:center}
.cat-catalog-kicker{display:inline-flex;gap:14px;align-items:center;font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#8a8a92;margin-bottom:22px}
.cat-catalog-k-num{color:#FFD60A}
.cat-catalog-k-label{border-left:1px solid rgba(255,255,255,.2);padding-left:14px}
.cat-catalog-title{font-family:var(--font-display,'Space Grotesk',sans-serif);font-size:clamp(42px,6vw,76px);line-height:1.02;letter-spacing:-.03em;margin:0 0 18px;color:#fff;font-weight:700}
.cat-catalog-sub{font-size:17px;line-height:1.55;color:#a8a8b2;margin:0;max-width:580px;margin-left:auto;margin-right:auto}

.cat-masonry{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(180px,auto);gap:22px;max-width:1400px;margin:0 auto}
.cat-card{position:relative;border-radius:6px;padding:36px 34px 32px;overflow:hidden;display:flex;flex-direction:column;transition:transform .3s ease,box-shadow .3s ease}
.cat-card:hover{transform:translateY(-4px);box-shadow:0 30px 70px rgba(0,0,0,.5)}
.cat-card-num{position:absolute;top:-8px;right:22px;font-family: var(--font-display);font-size:180px;font-weight:700;line-height:.78;color:rgba(255,255,255,.06);pointer-events:none;letter-spacing:-.05em;z-index:0}
.cat-card-body{position:relative;z-index:1;display:flex;flex-direction:column;gap:16px;flex:1}
.cat-card-tag{display:inline-flex;align-self:flex-start;font-family:var(--font-mono,monospace);font-size:10px;letter-spacing:.12em;text-transform:uppercase;padding:5px 10px;border:1px solid rgba(255,255,255,.2);color:#e4e4ea;border-radius:2px}
.cat-card-tag-accent{border-color:#00E5FF;color:#00E5FF}
.cat-card-tag-dark{border-color:rgba(5,5,9,.4);color:#050509}
.cat-card-title{font-family:var(--font-display,'Space Grotesk',sans-serif);font-size:26px;line-height:1.1;letter-spacing:-.02em;margin:0;color:#fff;font-weight:700}
.cat-card-lede{font-size:14.5px;line-height:1.55;color:#b0b0ba;margin:0}
.cat-card-topics{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;border-top:1px dashed rgba(255,255,255,.12);padding-top:14px}
.cat-card-topics li{font-size:13px;line-height:1.45;color:#d4d4dc;padding-left:18px;position:relative}
.cat-card-topics li::before{content:"›";position:absolute;left:0;color:#FFD60A;font-weight:700}
.cat-card-specs{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin:8px 0 0;padding-top:16px;border-top:1px solid rgba(255,255,255,.1)}
.cat-card-specs div{display:flex;flex-direction:column;gap:2px}
.cat-card-specs dt{font-family:var(--font-mono,monospace);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:#6e6e78;margin:0}
.cat-card-specs dd{margin:0;font-size:13px;color:#f4f4f6;font-weight:600}
.cat-card-cta{align-self:flex-start;margin-top:18px;display:inline-block;padding:12px 20px;background:#FFD60A;color:#050509;text-decoration:none;font-family:var(--font-mono,monospace);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:2px;transition:transform .2s}
.cat-card-cta:hover{transform:translateX(4px)}
.cat-card-cta-accent{background:#00E5FF;color:#050509}
.cat-card-cta-dark{background:#050509;color:#FFD60A}

/* card variants */
.cat-card-hero{grid-column:span 2;grid-row:span 2;background:linear-gradient(140deg,#0f0f1a 0%,#1a1a2e 55%,#050509 100%);border:1px solid rgba(255,214,10,.15)}
.cat-card-hero .cat-card-title{font-size:38px}
.cat-card-hero .cat-card-num{font-size:260px;color:rgba(255,214,10,.08)}
.cat-card-solid{grid-column:span 2;background:#12121c;border:1px solid rgba(255,255,255,.06)}
.cat-card-tall{grid-column:span 2;grid-row:span 2}
.cat-card-outline{background:transparent;border:1px solid #00E5FF;box-shadow:inset 0 0 0 1px rgba(0,229,255,.12)}
.cat-card-outline .cat-card-num{color:rgba(0,229,255,.1)}
.cat-card-outline .cat-card-title em{color:#00E5FF}
.cat-card-yellow{grid-column:span 2;background:#FFD60A;color:#050509;border:1px solid #FFD60A}
.cat-card-yellow .cat-card-num{color:rgba(5,5,9,.1)}
.cat-card-yellow .cat-card-title,.cat-card-yellow .cat-card-lede{color:#050509}
.cat-card-yellow .cat-card-lede{color:rgba(5,5,9,.75)}
.cat-card-yellow .cat-card-topics{border-top-color:rgba(5,5,9,.2)}
.cat-card-yellow .cat-card-topics li{color:rgba(5,5,9,.85)}
.cat-card-yellow .cat-card-topics li::before{color:#050509}
.cat-card-specs-dark{border-top-color:rgba(5,5,9,.2)}
.cat-card-specs-dark dt{color:rgba(5,5,9,.55)}
.cat-card-specs-dark dd{color:#050509}
.cat-card-wide{grid-column:span 2;background:linear-gradient(115deg,#050509,#10101c);border:1px solid rgba(255,255,255,.08)}
.cat-card-mono{grid-column:span 2;background:#0a0a12;border:1px solid rgba(255,255,255,.05)}
.cat-card-mono .cat-card-title{font-family:var(--font-mono,monospace);font-weight:500;font-size:22px}

/* -------- COHORTES list -------- */
.cat-cohorts{padding:100px 6vw 100px;background:#08080f;border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05)}
.cat-cohorts-header{max-width:760px;margin:0 0 60px}
.cat-cohorts-title{font-family:var(--font-display,sans-serif);font-size:clamp(36px,5vw,60px);line-height:1;letter-spacing:-.03em;margin:0 0 14px;color:#fff}
.cat-cohorts-sub{font-size:16px;color:#a8a8b2;margin:0}
.cat-cohorts-list{display:flex;flex-direction:column;gap:0;max-width:1200px;border-top:1px solid rgba(255,255,255,.1)}
.cat-cohort{display:grid;grid-template-columns:100px 1fr 200px auto;gap:28px;align-items:center;padding:28px 8px;border-bottom:1px solid rgba(255,255,255,.08);transition:background .2s}
.cat-cohort:hover{background:rgba(255,214,10,.03)}
.cat-cohort-date{display:flex;flex-direction:column;align-items:center;border-right:1px solid rgba(255,255,255,.12);padding-right:20px}
.cat-cohort-month{font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:.15em;color:#FFD60A;font-weight:700}
.cat-cohort-day{font-family:var(--font-display,sans-serif);font-size:44px;font-weight:700;line-height:1;color:#fff;letter-spacing:-.03em;margin:2px 0}
.cat-cohort-year{font-family:var(--font-mono,monospace);font-size:10px;color:#6e6e78;letter-spacing:.1em}
.cat-cohort-main{min-width:0}
.cat-cohort-course{font-family:var(--font-display,sans-serif);font-size:20px;font-weight:600;color:#fff;margin-bottom:6px;letter-spacing:-.01em}
.cat-cohort-meta{display:flex;flex-wrap:wrap;gap:16px;font-family:var(--font-mono,monospace);font-size:11px;color:#8a8a92;letter-spacing:.04em;text-transform:uppercase}
.cat-cohort-meta span{position:relative;padding-right:16px}
.cat-cohort-meta span:not(:last-child)::after{content:"·";position:absolute;right:4px;color:#4a4a52}
.cat-cohort-slots{display:flex;flex-direction:column;gap:6px}
.cat-cohort-count{font-family:var(--font-mono,monospace);font-size:11px;color:#c4c4cc;letter-spacing:.05em}
.cat-cohort-count strong{color:#FFD60A;font-size:14px}
.cat-cohort-slots-tight .cat-cohort-count strong{color:#ff4d5e}
.cat-cohort-bar{height:4px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden}
.cat-cohort-bar-fill{height:100%;background:linear-gradient(90deg,#FFD60A,#ffe564);border-radius:2px;transition:width .6s ease}
.cat-cohort-slots-tight .cat-cohort-bar-fill{background:linear-gradient(90deg,#ff4d5e,#ff8b55)}
.cat-cohort-cta{padding:12px 24px;background:transparent;border:1px solid #FFD60A;color:#FFD60A;text-decoration:none;font-family:var(--font-mono,monospace);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border-radius:2px;transition:all .2s;white-space:nowrap}
.cat-cohort-cta:hover{background:#FFD60A;color:#050509}

/* -------- VOICES marquee -------- */
.cat-voices{padding:100px 0 80px;background:#050509;overflow:hidden}
.cat-voices-header{max-width:860px;margin:0 auto 50px;padding:0 6vw;text-align:center}
.cat-voices-title{font-family:var(--font-display,sans-serif);font-size:clamp(36px,5vw,56px);margin:0;color:#fff;letter-spacing:-.03em}
.cat-marquee{width:100%;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
.cat-marquee-track{display:flex;gap:24px;width:max-content;animation:cat-scroll 50s linear infinite;padding:0 12px}
.cat-marquee:hover .cat-marquee-track{animation-play-state:paused}
@keyframes cat-scroll{0%{transform:translateX(0)}100%{transform:translateX(-60%)}}
.cat-voice{flex:0 0 360px;display:grid;grid-template-columns:72px 1fr;gap:18px;padding:26px 26px 26px 22px;background:#0d0d18;border:1px solid rgba(255,255,255,.08);border-radius:4px;margin:0}
.cat-voice-avatar{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family: var(--font-display);font-size:32px;font-weight:700;color:#050509;background:#FFD60A;grid-row:span 2}
.cat-voice blockquote{grid-column:2;margin:0;font-family: var(--font-display);font-style:italic;font-size:15px;line-height:1.5;color:#e4e4ea}
.cat-voice figcaption{grid-column:2;display:flex;flex-direction:column;gap:2px;font-family:var(--font-mono,monospace);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#8a8a92}
.cat-voice figcaption strong{color:#FFD60A;font-size:12px;font-weight:700}

/* -------- FAQ magazine index -------- */
.cat-faq{padding:120px 6vw 100px;background:#08080f}
.cat-faq-header{max-width:760px;margin:0 auto 60px;text-align:center}
.cat-faq-title{font-family:var(--font-display,sans-serif);font-size:clamp(42px,6vw,72px);color:#fff;margin:0;letter-spacing:-.03em;line-height:1}
.cat-faq-list{list-style:none;padding:0;margin:0 auto;max-width:900px;counter-reset:cat-faq;border-top:2px solid #FFD60A}
.cat-faq-item{border-bottom:1px solid rgba(255,255,255,.1)}
.cat-faq-item details{width:100%}
.cat-faq-item summary{display:grid;grid-template-columns:90px 1fr 40px;gap:20px;align-items:center;padding:28px 8px;cursor:pointer;list-style:none;transition:background .2s}
.cat-faq-item summary::-webkit-details-marker{display:none}
.cat-faq-item summary:hover{background:rgba(255,214,10,.04)}
.cat-faq-num{font-family:var(--font-mono,monospace);font-size:12px;color:#6e6e78;letter-spacing:.12em;text-transform:uppercase}
.cat-faq-q{font-family:var(--font-display,sans-serif);font-size:22px;font-weight:600;color:#fff;letter-spacing:-.01em}
.cat-faq-plus{font-family: var(--font-display);font-size:32px;font-weight:400;color:#FFD60A;text-align:right;transition:transform .3s}
.cat-faq-item details[open] .cat-faq-plus{transform:rotate(45deg)}
.cat-faq-a{padding:0 8px 28px 118px;font-size:15px;line-height:1.6;color:#b0b0ba;max-width:720px}

/* -------- SUBSCRIBE CTA -------- */
.cat-subscribe{padding:120px 6vw 140px;background:#050509;position:relative}
.cat-subscribe::before{content:"";position:absolute;inset:60px 6vw;border:1px solid rgba(255,214,10,.1);pointer-events:none;border-radius:4px}
.cat-sub-box{position:relative;max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr;gap:60px;padding:70px 60px;background:linear-gradient(135deg,#0f0f1a,#050509);border:1px solid rgba(255,214,10,.2);border-radius:6px;box-shadow:0 40px 120px rgba(0,0,0,.6)}
.cat-sub-left{display:flex;flex-direction:column;gap:22px}
.cat-sub-kicker{font-family:var(--font-mono,monospace);font-size:11px;letter-spacing:.15em;color:#FFD60A;text-transform:uppercase;font-weight:700}
.cat-sub-title{font-family:var(--font-display,sans-serif);font-size:clamp(42px,5vw,64px);line-height:1;letter-spacing:-.03em;margin:0;color:#fff}
.cat-sub-text{font-size:16px;line-height:1.6;color:#b0b0ba;margin:0;max-width:520px}
.cat-sub-form{display:flex;flex-direction:column;gap:10px;margin-top:10px}
.cat-sub-label{font-family:var(--font-mono,monospace);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#6e6e78}
.cat-sub-input-row{display:flex;gap:0;border:1px solid rgba(255,255,255,.15);border-radius:3px;overflow:hidden;background:rgba(255,255,255,.03)}
.cat-sub-input-row:focus-within{border-color:#FFD60A}
.cat-sub-input{flex:1;padding:18px 22px;background:transparent;border:0;outline:0;color:#fff;font-family:var(--font-body,'Inter',sans-serif);font-size:15px}
.cat-sub-input::placeholder{color:#4a4a52}
.cat-sub-btn{padding:18px 28px;background:#FFD60A;color:#050509;border:0;font-family:var(--font-mono,monospace);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:background .2s}
.cat-sub-btn:hover{background:#fff}
.cat-sub-fine{font-size:11px;color:#6e6e78;line-height:1.4}
.cat-sub-or{margin-top:18px;padding-top:22px;border-top:1px dashed rgba(255,255,255,.15);display:flex;flex-direction:column;gap:8px}
.cat-sub-or span{font-family:var(--font-mono,monospace);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#6e6e78}
.cat-sub-wa{font-family:var(--font-mono,monospace);font-size:13px;color:#00E5FF;text-decoration:none;font-weight:700;letter-spacing:.04em}
.cat-sub-wa:hover{color:#FFD60A}
.cat-sub-right{display:flex;flex-direction:column;gap:30px;align-items:flex-end}
.cat-sub-stamp{width:180px;height:180px;border-radius:50%;border:2px solid #FFD60A;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:22px 10px;transform:rotate(-8deg);background:radial-gradient(circle,rgba(255,214,10,.08),transparent 70%);flex-shrink:0}
.cat-sub-stamp-top,.cat-sub-stamp-bot{font-family:var(--font-mono,monospace);font-size:10px;letter-spacing:.15em;color:#FFD60A;text-align:center;font-weight:700}
.cat-sub-stamp-mid{font-family: var(--font-display);font-size:38px;font-weight:700;color:#fff;text-align:center;line-height:.9;font-style:italic}
.cat-sub-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;width:100%}
.cat-sub-list li{display:grid;grid-template-columns:32px 1fr;gap:10px;font-size:13px;color:#c4c4cc;padding:10px 0;border-bottom:1px dotted rgba(255,255,255,.1)}
.cat-sub-list li span{font-family:var(--font-mono,monospace);color:#FFD60A;font-size:11px;font-weight:700}

/* -------- RESPONSIVE -------- */
@media (max-width:1100px){
  .cat-masonry{grid-template-columns:repeat(2,1fr)}
  .cat-card-hero,.cat-card-wide,.cat-card-solid,.cat-card-tall,.cat-card-yellow,.cat-card-mono{grid-column:span 2}
  .cat-card-tall{grid-row:auto}
  .cat-masthead{grid-template-columns:1fr;gap:40px}
  .cat-sub-box{grid-template-columns:1fr;padding:50px 34px}
  .cat-sub-right{align-items:center;flex-direction:row;flex-wrap:wrap;justify-content:center}
}
@media (max-width:768px){
  .cat-cover{padding:120px 5vw 40px;min-height:auto}
  .cat-mast-line{font-size:clamp(56px,18vw,100px)}
  .cat-mast-line-2{font-size:clamp(70px,22vw,120px)}
  .cat-mast-strip{font-size:10px;gap:14px;bottom:30px}
  .cat-breadcrumb{margin-bottom:30px;flex-wrap:wrap}
  .cat-agenda{flex-direction:column}
  .cat-agenda-label{padding:10px 16px;justify-content:center}
  .cat-agenda-item{min-width:180px}
  .cat-catalog,.cat-cohorts,.cat-faq,.cat-subscribe{padding-left:5vw;padding-right:5vw;padding-top:70px;padding-bottom:70px}
  .cat-masonry{grid-template-columns:1fr;gap:16px}
  .cat-card,.cat-card-hero,.cat-card-wide,.cat-card-solid,.cat-card-tall,.cat-card-yellow,.cat-card-mono{grid-column:span 1;grid-row:auto;padding:28px 24px}
  .cat-card-hero .cat-card-title{font-size:28px}
  .cat-card-num{font-size:140px}
  .cat-card-specs{grid-template-columns:1fr 1fr;gap:8px 14px}
  .cat-cohort{grid-template-columns:72px 1fr;gap:16px;padding:22px 4px}
  .cat-cohort-slots{grid-column:1 / -1;margin-top:4px}
  .cat-cohort-cta{grid-column:1 / -1;text-align:center;padding:14px}
  .cat-cohort-day{font-size:32px}
  .cat-cohort-course{font-size:16px}
  .cat-cohort-meta{gap:10px;font-size:10px}
  .cat-voice{flex:0 0 280px;padding:20px}
  .cat-voice-avatar{width:48px;height:48px;font-size:22px}
  .cat-voice blockquote{font-size:13px}
  .cat-faq-item summary{grid-template-columns:60px 1fr 30px;gap:12px;padding:22px 4px}
  .cat-faq-q{font-size:17px}
  .cat-faq-plus{font-size:26px}
  .cat-faq-a{padding:0 4px 22px 76px;font-size:14px}
  .cat-sub-box{padding:40px 22px;gap:32px}
  .cat-sub-title{font-size:34px}
  .cat-sub-input-row{flex-direction:column}
  .cat-sub-btn{padding:16px}
  .cat-sub-stamp{width:140px;height:140px}
  .cat-sub-stamp-mid{font-size:28px}
  .cat-mast-logo{font-size:36px}
  .cat-mast-logo em{font-size:42px}
}
@media (max-width:480px){
  .cat-mast-deck{font-size:15px;padding-left:14px}
  .cat-catalog-title,.cat-cohorts-title,.cat-faq-title{font-size:36px}
  .cat-card-title{font-size:22px}
}

/* ==========================================================================
   ODOO · Bento grid full-page ERP showcase (.erp-*)
   Unique skeleton. No reuse of cl-/ability-/vs-/odoo-/syl- classes.
   ========================================================================== */

:root{
  --erp-bg:#050509;
  --erp-ink:#eef0f6;
  --erp-mute:#9aa0b4;
  --erp-line:rgba(255,255,255,0.08);
  --erp-line-2:rgba(255,255,255,0.14);
  --erp-olpa:#FFD60A;
  --erp-cyan:#6ad0ff;
  --erp-card:rgba(255,255,255,0.035);
  --erp-card-2:rgba(255,255,255,0.06);
  --erp-serif: var(--font-display);
}

body:has(.erp-hero){background:var(--erp-bg);color:var(--erp-ink)}

.erp-hero em,
.erp-partner-h2 em,
.erp-stories-title em,
.erp-case-quote em,
.erp-method-title em,
.erp-demo-title em,
.erp-cta-h2 em{
  font-family:var(--erp-serif);
  font-style:italic;
  font-weight:400;
  color:var(--erp-olpa);
  letter-spacing:-0.01em;
}

/* ---- Top banner -------------------------------------------------------- */
.erp-topbar{
  position:relative;
  background:linear-gradient(90deg,#0a0a14 0%,#11111c 50%,#0a0a14 100%);
  border-bottom:1px solid var(--erp-line);
  font-size:12px;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:#c8cbd8;
}
.erp-topbar-inner{
  max-width:1400px;margin:0 auto;
  padding:10px 28px;
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;
}
.erp-topbar-pill{
  background:var(--erp-olpa);color:#0a0a14;
  padding:4px 12px;border-radius:100px;
  font-weight:700;letter-spacing:0.08em;
}
.erp-topbar-sep{opacity:0.35}
.erp-topbar-link{color:var(--erp-cyan);text-decoration:none;font-weight:600}
.erp-topbar-link:hover{text-decoration:underline}

/* ---- Hero bento -------------------------------------------------------- */
.erp-hero{padding:48px 28px 80px;position:relative;overflow:hidden}
.erp-hero::before{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(800px 400px at 80% 20%,rgba(156,92,255,0.12),transparent 60%),
    radial-gradient(600px 500px at 10% 70%,rgba(106,208,255,0.08),transparent 70%);
  pointer-events:none;
}
.erp-hero-wrap{max-width:1400px;margin:0 auto;position:relative}
.erp-breadcrumb{
  font-size:13px;color:var(--erp-mute);margin-bottom:32px;
  display:flex;gap:8px;align-items:center;letter-spacing:0.02em;
}
.erp-breadcrumb a{color:var(--erp-mute);text-decoration:none}
.erp-breadcrumb a:hover{color:var(--erp-olpa)}
.erp-breadcrumb span{opacity:0.4}
.erp-current{color:var(--erp-ink)}

.erp-hero-grid{
  display:grid;
  grid-template-columns:1.35fr 1fr;
  gap:40px;align-items:stretch;
}

.erp-bento{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  grid-auto-rows:1fr;
  gap:12px;
}
.erp-tile{
  aspect-ratio:1/1;
  background:var(--erp-card);
  border:1px solid var(--erp-line);
  border-radius:18px;
  padding:16px 14px;
  display:flex;flex-direction:column;justify-content:space-between;
  position:relative;overflow:hidden;
  transition:transform 0.35s cubic-bezier(.2,.8,.2,1),border-color 0.3s,background 0.3s;
}
.erp-tile::before{
  content:"";position:absolute;inset:-1px;
  background:radial-gradient(200px 140px at 90% 10%,var(--erp-tone),transparent 65%);
  opacity:0.12;pointer-events:none;transition:opacity 0.3s;
}
.erp-tile:hover{
  transform:translateY(-4px);
  border-color:var(--erp-line-2);
  background:var(--erp-card-2);
}
.erp-tile:hover::before{opacity:0.28}
.erp-tile-icon{
  width:44px;height:44px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,0.04);
  border:1px solid var(--erp-line);
  color:var(--erp-tone);
}
.erp-tile-name{
  font-size:15px;font-weight:600;letter-spacing:-0.01em;margin-top:auto;
}
.erp-tile-metric{
  font-size:11px;color:var(--erp-mute);
  letter-spacing:0.03em;text-transform:uppercase;
  margin-top:4px;
}

.erp-hero-copy{display:flex;flex-direction:column;justify-content:center}
.erp-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:12px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--erp-cyan);margin-bottom:20px;
}
.erp-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--erp-cyan);box-shadow:0 0 12px var(--erp-cyan);
}
.erp-h1{
  font-size:clamp(34px,4vw,54px);
  line-height:1.04;letter-spacing:-0.02em;
  margin:0 0 20px;font-weight:700;
}
.erp-quickanswer{
  font-size:16px;line-height:1.65;color:#c8cbd8;margin:0 0 28px;
}
.erp-quickanswer strong{color:var(--erp-olpa);font-weight:600}
.erp-hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.erp-btn-primary{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 24px;border-radius:100px;
  background:var(--erp-olpa);color:#0a0a14;
  font-weight:700;text-decoration:none;font-size:14px;
  letter-spacing:0.01em;
  transition:transform 0.25s,box-shadow 0.25s;
}
.erp-btn-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 32px rgba(255,214,10,0.35);
}
.erp-btn-ghost{
  display:inline-flex;align-items:center;padding:14px 22px;
  border-radius:100px;border:1px solid var(--erp-line-2);
  color:var(--erp-ink);text-decoration:none;font-size:14px;font-weight:500;
  transition:border-color 0.25s,background 0.25s;
}
.erp-btn-ghost:hover{border-color:var(--erp-olpa);background:rgba(255,214,10,0.05)}
.erp-hero-footnote{
  margin-top:22px;font-size:12px;color:var(--erp-mute);
  letter-spacing:0.03em;
}

/* ---- Partner callout --------------------------------------------------- */
.erp-partner{
  padding:72px 28px;
  background:linear-gradient(180deg,transparent,rgba(255,214,10,0.04),transparent);
  border-top:1px solid var(--erp-line);
  border-bottom:1px solid var(--erp-line);
}
.erp-partner-inner{
  max-width:1200px;margin:0 auto;
  display:grid;grid-template-columns:220px 1fr;gap:56px;align-items:center;
}
.erp-partner-seal{display:flex;justify-content:center}
.erp-seal-ring{
  width:200px;height:200px;border-radius:50%;
  background:conic-gradient(from 0deg,var(--erp-olpa),#ffe669,var(--erp-olpa));
  padding:4px;
  animation:erp-spin 22s linear infinite;
}
@keyframes erp-spin{to{transform:rotate(360deg)}}
.erp-seal-core{
  width:100%;height:100%;border-radius:50%;
  background:#0a0a14;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:var(--erp-olpa);
}
.erp-seal-star{font-size:36px;margin-bottom:6px}
.erp-seal-label{
  font-size:13px;font-weight:700;
  letter-spacing:0.16em;text-align:center;line-height:1.3;
}
.erp-partner-h2{
  font-size:clamp(26px,3vw,40px);
  margin:0 0 16px;line-height:1.1;letter-spacing:-0.02em;
}
.erp-partner-body p{
  color:#c8cbd8;line-height:1.65;font-size:15px;margin:0 0 28px;max-width:56ch;
}
.erp-partner-metrics{
  display:flex;gap:40px;flex-wrap:wrap;margin-bottom:22px;
  padding:20px 0;
  border-top:1px solid var(--erp-line);border-bottom:1px solid var(--erp-line);
}
.erp-pmetric{display:flex;flex-direction:column}
.erp-pnum{
  font-size:38px;font-weight:700;color:var(--erp-olpa);
  font-family:var(--erp-serif);font-style:italic;line-height:1;
}
.erp-plabel{font-size:12px;color:var(--erp-mute);letter-spacing:0.04em;text-transform:uppercase;margin-top:6px}
.erp-partner-link{color:var(--erp-cyan);text-decoration:none;font-weight:600;font-size:14px}
.erp-partner-link:hover{text-decoration:underline}

/* ---- Stories ----------------------------------------------------------- */
.erp-stories{padding:96px 28px 40px;max-width:1300px;margin:0 auto}
.erp-stories-head{text-align:center;margin-bottom:64px}
.erp-stories-tag{
  display:inline-block;font-size:11px;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--erp-cyan);
  padding:6px 14px;border:1px solid var(--erp-line-2);
  border-radius:100px;margin-bottom:18px;
}
.erp-stories-title{
  font-size:clamp(28px,3.4vw,46px);
  margin:0;letter-spacing:-0.02em;line-height:1.1;
}

.erp-story{
  display:grid;grid-template-columns:1fr 1fr;gap:60px;
  align-items:center;padding:56px 0;
  border-top:1px solid var(--erp-line);
}
.erp-story--reverse .erp-story-copy{order:2}
.erp-story--reverse .erp-story-mock{order:1}
.erp-story-copy{padding:0 10px}
.erp-roman{
  font-family:var(--erp-serif);font-style:italic;
  font-size:52px;color:var(--erp-olpa);
  display:block;line-height:1;margin-bottom:14px;
}
.erp-story-copy h3{
  font-size:26px;margin:0 0 14px;letter-spacing:-0.01em;line-height:1.15;
}
.erp-story-copy p{color:#c8cbd8;line-height:1.7;font-size:15px;margin:0 0 22px;max-width:52ch}
.erp-story-bullets{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.erp-story-bullets li{
  position:relative;padding-left:22px;font-size:14px;color:var(--erp-ink);line-height:1.55;
}
.erp-story-bullets li::before{
  content:"→";position:absolute;left:0;color:var(--erp-olpa);font-weight:700;
}

.erp-story-mock{
  background:var(--erp-card);border:1px solid var(--erp-line);
  border-radius:20px;padding:22px;min-height:280px;
  display:flex;flex-direction:column;gap:10px;
  box-shadow:0 30px 80px -30px rgba(0,0,0,0.5);
}

/* CRM mock */
.erp-mock-crm{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.erp-crm-col{display:flex;flex-direction:column;gap:8px}
.erp-crm-col-h{
  font-size:10px;text-transform:uppercase;letter-spacing:0.1em;
  color:var(--erp-mute);padding-bottom:6px;border-bottom:1px dashed var(--erp-line-2);
}
.erp-crm-card{
  background:rgba(255,255,255,0.04);border:1px solid var(--erp-line);
  border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:4px;
}
.erp-crm-card b{font-size:12px}
.erp-crm-card small{font-size:11px;color:var(--erp-mute)}
.erp-crm-win{border-color:rgba(34,201,164,0.5);background:rgba(34,201,164,0.08)}
.erp-crm-win small{color:#22c9a4}

/* Inventory mock */
.erp-mock-inv{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.erp-inv-row{
  display:grid;grid-template-columns:90px 1fr 70px;gap:12px;
  padding:10px 4px;border-bottom:1px solid var(--erp-line);align-items:center;
}
.erp-inv-sku{color:var(--erp-mute)}
.erp-inv-qty{text-align:right;font-weight:700}
.erp-ok{color:#22c9a4}
.erp-warn{color:#ffb03b}
.erp-low{color:#ff6b6b}
.erp-inv-alert{
  margin-top:10px;font-size:11px;color:#ffb03b;
  padding:8px 12px;background:rgba(255,176,59,0.08);
  border:1px dashed rgba(255,176,59,0.35);border-radius:8px;
}

/* Invoice doc */
.erp-mock-inv-doc{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;background:#0b0b14}
.erp-doc-head{
  display:flex;justify-content:space-between;align-items:baseline;
  padding-bottom:14px;border-bottom:2px solid var(--erp-olpa);margin-bottom:14px;
}
.erp-doc-head b{font-size:18px;letter-spacing:0.06em}
.erp-doc-head span{color:var(--erp-mute);font-size:12px}
.erp-doc-row{display:flex;justify-content:space-between;padding:6px 0;font-size:12px}
.erp-doc-row span{color:var(--erp-mute)}
.erp-doc-line{height:1px;background:var(--erp-line);margin:10px 0}
.erp-doc-total{font-size:15px !important;color:var(--erp-olpa)}
.erp-doc-total b{font-size:16px}
.erp-doc-cae{
  margin-top:14px;padding:10px;text-align:center;font-size:11px;
  background:rgba(34,201,164,0.08);border:1px dashed rgba(34,201,164,0.3);
  border-radius:8px;color:#22c9a4;letter-spacing:0.04em;
}

/* POS mock */
.erp-mock-pos{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.erp-pos-prod{
  background:rgba(255,255,255,0.05);border:1px solid var(--erp-line);
  border-radius:10px;padding:14px 10px;font-size:12px;font-weight:600;
  display:flex;flex-direction:column;gap:4px;min-height:68px;justify-content:space-between;
}
.erp-pos-prod span{font-size:11px;color:var(--erp-mute);font-weight:400}
.erp-pos-high{border-color:rgba(255,79,163,0.5);background:rgba(255,79,163,0.1)}
.erp-pos-total{
  grid-column:1 / -1;margin-top:6px;
  padding:12px;background:var(--erp-olpa);color:#0a0a14;
  font-weight:700;text-align:center;border-radius:10px;letter-spacing:0.04em;
}

/* MRP mock */
.erp-mock-mrp{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}
.erp-mrp-order{
  display:flex;gap:12px;align-items:center;
  padding:10px 6px;border-bottom:1px solid var(--erp-line);
}
.erp-mrp-order b{color:var(--erp-olpa);min-width:80px}
.erp-mrp-order span{flex:1;color:var(--erp-ink)}
.erp-mrp-order em{font-style:normal;color:var(--erp-cyan);font-weight:700}
.erp-mrp-sub{
  padding:4px 0 4px 20px;color:var(--erp-mute);
  display:flex;justify-content:space-between;font-size:11px;
}
.erp-mrp-done{color:#22c9a4}
.erp-mrp-run{color:#ffb03b}
.erp-mrp-wait{color:var(--erp-mute)}

/* Web mock */
.erp-mock-web{font-size:13px}
.erp-web-head{
  font-size:11px;color:var(--erp-mute);letter-spacing:0.05em;
  padding-bottom:14px;margin-bottom:10px;border-bottom:1px solid var(--erp-line);
}
.erp-web-item{display:flex;justify-content:space-between;padding:8px 0}
.erp-web-item b{color:var(--erp-ink)}
.erp-web-line{height:1px;background:var(--erp-line);margin:8px 0}
.erp-web-total b{color:var(--erp-olpa);font-size:16px}
.erp-web-pay{font-size:11px;color:var(--erp-cyan);margin:10px 0;letter-spacing:0.02em}
.erp-web-btn{
  width:100%;padding:12px;border-radius:10px;border:0;
  background:var(--erp-olpa);color:#0a0a14;font-weight:700;font-size:13px;cursor:pointer;
}

/* ---- Case editorial ---------------------------------------------------- */
.erp-case{
  padding:96px 28px;
  background:radial-gradient(1000px 500px at 50% 30%,rgba(255,214,10,0.05),transparent 70%);
  border-top:1px solid var(--erp-line);border-bottom:1px solid var(--erp-line);
}
.erp-case-inner{max-width:900px;margin:0 auto;text-align:center}
.erp-case-tag{
  display:inline-block;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--erp-olpa);margin-bottom:14px;
}
.erp-case-industry{
  font-size:15px;color:var(--erp-mute);font-weight:400;
  letter-spacing:0.02em;margin:0 0 32px;
}
.erp-case-quote{
  position:relative;margin:0 0 48px;padding:0 20px;
  font-family:var(--erp-serif);
  font-size:clamp(26px,3.2vw,42px);
  line-height:1.3;color:var(--erp-ink);
}
.erp-case-quote em{font-style:italic;color:var(--erp-ink)}
.erp-case-mark{
  position:absolute;left:-10px;top:-40px;
  font-size:120px;color:var(--erp-olpa);opacity:0.2;line-height:1;
}
.erp-case-author{
  margin-top:22px;font-family:inherit;font-size:13px;
  color:var(--erp-mute);letter-spacing:0.04em;
}
.erp-case-nums{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
  padding-top:36px;border-top:1px solid var(--erp-line);
}
.erp-caseN{display:flex;flex-direction:column;gap:6px}
.erp-caseN-big{
  font-family:var(--erp-serif);font-style:italic;
  font-size:42px;color:var(--erp-olpa);line-height:1;
}
.erp-caseN-lbl{font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--erp-mute)}

/* ---- Method timeline --------------------------------------------------- */
.erp-method{padding:96px 28px;max-width:1100px;margin:0 auto}
.erp-method-head{text-align:center;margin-bottom:56px}
.erp-method-title{
  font-size:clamp(28px,3.4vw,44px);margin:0;letter-spacing:-0.02em;line-height:1.1;
}
.erp-pricing-sub{margin-top:14px;color:var(--erp-mute);font-size:14px}
.erp-timeline{
  list-style:none;padding:0;margin:0;
  position:relative;
}
.erp-timeline::before{
  content:"";position:absolute;left:48px;top:20px;bottom:20px;
  width:2px;background:linear-gradient(180deg,var(--erp-olpa),rgba(255,214,10,0.1));
}
.erp-phase{
  display:grid;grid-template-columns:96px 1fr;gap:24px;
  padding:22px 0;position:relative;
}
.erp-phase-num{
  font-family:var(--erp-serif);font-style:italic;
  font-size:44px;color:var(--erp-olpa);
  width:96px;height:64px;display:flex;align-items:center;justify-content:center;
  background:#0a0a14;border:2px solid var(--erp-olpa);border-radius:16px;
  position:relative;z-index:2;
}
.erp-phase-body h3{font-size:20px;margin:0 0 8px;letter-spacing:-0.01em}
.erp-phase-desc{color:#c8cbd8;line-height:1.6;font-size:14px;margin:0 0 12px;max-width:60ch}
.erp-phase-meta{
  display:flex;gap:18px;font-size:11px;color:var(--erp-mute);
  text-transform:uppercase;letter-spacing:0.06em;
}
.erp-phase-meta span:first-child{color:var(--erp-cyan)}

/* ---- Pricing ----------------------------------------------------------- */
.erp-pricing{padding:96px 28px;max-width:1200px;margin:0 auto}
.erp-pricing-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
}
.erp-price{
  background:var(--erp-card);border:1px solid var(--erp-line);
  border-radius:20px;padding:32px 26px;
  display:flex;flex-direction:column;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  position:relative;
  transition:transform 0.3s,border-color 0.3s;
}
.erp-price:hover{transform:translateY(-4px);border-color:var(--erp-line-2)}
.erp-price--feat{border-color:var(--erp-olpa);background:rgba(255,214,10,0.04)}
.erp-price-badge{
  position:absolute;top:-12px;left:26px;
  background:var(--erp-olpa);color:#0a0a14;
  font-size:11px;font-weight:700;letter-spacing:0.1em;
  padding:4px 12px;border-radius:100px;text-transform:uppercase;
}
.erp-price-head{
  font-size:12px;text-transform:uppercase;letter-spacing:0.1em;
  color:var(--erp-mute);margin-bottom:16px;
}
.erp-price-big{
  font-size:48px;font-weight:700;letter-spacing:-0.02em;line-height:1;
  color:var(--erp-ink);margin-bottom:6px;
}
.erp-price-big span{font-size:14px;color:var(--erp-mute);font-weight:400;margin-left:4px}
.erp-price-lbl{font-size:11px;color:var(--erp-cyan);letter-spacing:0.04em;margin-bottom:22px}
.erp-price-list{
  list-style:none;padding:0;margin:0 0 24px;
  font-family:system-ui,-apple-system,sans-serif;
  display:flex;flex-direction:column;gap:10px;flex:1;
}
.erp-price-list li{
  padding-left:20px;position:relative;font-size:13px;
  color:var(--erp-ink);line-height:1.5;
}
.erp-price-list li::before{content:"▸";position:absolute;left:0;color:var(--erp-olpa)}
.erp-price-foot{
  font-size:11px;color:var(--erp-mute);text-transform:uppercase;
  letter-spacing:0.08em;padding-top:18px;border-top:1px dashed var(--erp-line-2);
  font-family:system-ui;
}

/* ---- Demo video -------------------------------------------------------- */
.erp-demo{padding:96px 28px;max-width:1100px;margin:0 auto;text-align:center}
.erp-demo-title{
  font-size:clamp(28px,3.4vw,44px);margin:0 0 14px;letter-spacing:-0.02em;line-height:1.1;
}
.erp-demo-desc{color:var(--erp-mute);font-size:15px;max-width:60ch;margin:0 auto 40px}
.erp-video{
  position:relative;width:100%;aspect-ratio:16/9;
  border-radius:20px;overflow:hidden;
  border:1px solid var(--erp-line-2);
  box-shadow:0 50px 100px -40px rgba(255,214,10,0.25);
}
.erp-video iframe{position:absolute;inset:0;width:100%;height:100%}

/* ---- Recursos ---------------------------------------------------------- */
.erp-res{padding:96px 28px;max-width:1200px;margin:0 auto}
.erp-res-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
.erp-res-card{
  background:var(--erp-card);border:1px solid var(--erp-line);
  border-radius:18px;padding:24px;
  display:flex;flex-direction:column;gap:10px;
  text-decoration:none;color:var(--erp-ink);
  transition:transform 0.3s,border-color 0.3s,background 0.3s;
}
.erp-res-card:hover{
  transform:translateY(-3px);border-color:var(--erp-olpa);
  background:rgba(255,214,10,0.04);
}
.erp-res-icon{
  width:44px;height:44px;border-radius:12px;
  background:rgba(255,214,10,0.1);color:var(--erp-olpa);
  display:flex;align-items:center;justify-content:center;font-size:20px;
}
.erp-res-name{font-weight:700;font-size:15px}
.erp-res-desc{font-size:12px;color:var(--erp-mute);line-height:1.5}

/* ---- FAQ --------------------------------------------------------------- */
.erp-faq{padding:96px 28px;max-width:900px;margin:0 auto}
.erp-faq-list{display:flex;flex-direction:column;gap:10px}
.erp-faq-item{
  background:var(--erp-card);border:1px solid var(--erp-line);
  border-radius:14px;padding:20px 24px;
}
.erp-faq-item summary{
  cursor:pointer;font-size:16px;font-weight:600;
  list-style:none;display:flex;justify-content:space-between;align-items:center;
  color:var(--erp-ink);
}
.erp-faq-item summary::-webkit-details-marker{display:none}
.erp-faq-item summary::after{
  content:"+";font-size:22px;color:var(--erp-olpa);
  transition:transform 0.25s;
}
.erp-faq-item[open] summary::after{content:"−"}
.erp-faq-item p{
  margin:14px 0 0;color:#c8cbd8;line-height:1.65;font-size:14px;
}

/* ---- CTA final --------------------------------------------------------- */
.erp-cta-final{
  padding:96px 28px;
  background:radial-gradient(700px 400px at 50% 50%,rgba(255,214,10,0.08),transparent 70%);
  border-top:1px solid var(--erp-line);
}
.erp-cta-inner{max-width:760px;margin:0 auto;text-align:center}
.erp-cta-h2{
  font-size:clamp(32px,4vw,52px);margin:14px 0 18px;letter-spacing:-0.02em;line-height:1.05;
}
.erp-cta-desc{color:#c8cbd8;font-size:16px;line-height:1.65;margin:0 0 34px}
.erp-cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}

/* ---- Responsive -------------------------------------------------------- */
@media (max-width:1080px){
  .erp-hero-grid{grid-template-columns:1fr;gap:48px}
  .erp-bento{grid-template-columns:repeat(4,1fr)}
  .erp-partner-inner{grid-template-columns:1fr;gap:32px;text-align:center}
  .erp-partner-seal{order:-1}
  .erp-partner-body p{margin-left:auto;margin-right:auto}
  .erp-partner-metrics{justify-content:center}
  .erp-res-grid{grid-template-columns:repeat(2,1fr)}
  .erp-pricing-grid{grid-template-columns:1fr;max-width:460px;margin:0 auto}
  .erp-story{grid-template-columns:1fr;gap:32px}
  .erp-story--reverse .erp-story-copy{order:0}
  .erp-story--reverse .erp-story-mock{order:0}
  .erp-case-nums{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:720px){
  .erp-topbar-inner{padding:10px 16px;font-size:11px;gap:8px}
  .erp-hero{padding:32px 16px 56px}
  .erp-bento{grid-template-columns:repeat(3,1fr);gap:8px}
  .erp-tile{padding:12px 10px;border-radius:14px}
  .erp-tile-icon{width:36px;height:36px}
  .erp-tile-name{font-size:13px}
  .erp-tile-metric{font-size:10px}
  .erp-h1{font-size:32px}
  .erp-partner{padding:56px 18px}
  .erp-seal-ring{width:160px;height:160px}
  .erp-partner-metrics{gap:22px}
  .erp-pnum{font-size:30px}
  .erp-stories{padding:64px 18px 20px}
  .erp-story{padding:40px 0;gap:24px}
  .erp-roman{font-size:40px}
  .erp-story-copy h3{font-size:21px}
  .erp-story-mock{padding:16px;min-height:auto}
  .erp-mock-crm{grid-template-columns:1fr}
  .erp-mock-pos{grid-template-columns:repeat(2,1fr)}
  .erp-case{padding:64px 18px}
  .erp-case-quote{font-size:22px;padding:0}
  .erp-case-mark{font-size:72px;top:-24px}
  .erp-case-nums{grid-template-columns:repeat(2,1fr);gap:16px}
  .erp-caseN-big{font-size:32px}
  .erp-method{padding:64px 18px}
  .erp-timeline::before{left:32px}
  .erp-phase{grid-template-columns:64px 1fr;gap:16px}
  .erp-phase-num{width:64px;height:52px;font-size:30px;border-radius:12px}
  .erp-pricing{padding:64px 18px}
  .erp-demo{padding:64px 18px}
  .erp-res{padding:64px 18px}
  .erp-res-grid{grid-template-columns:1fr}
  .erp-faq{padding:64px 18px}
  .erp-faq-item{padding:16px 18px}
  .erp-faq-item summary{font-size:14px}
  .erp-cta-final{padding:64px 18px}
}

/* =========================================================
   ORB — Make page (radial orbital composition)
   Prefix: .orb-*
   ========================================================= */
.orb-body{background:#050509;color:#e7e7f0;font-family:'Inter',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
.orb-body .container{max-width:1240px;margin:0 auto;padding:0 28px}

@keyframes orb-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes orb-spin-rev{from{transform:rotate(360deg)}to{transform:rotate(0deg)}}
@keyframes orb-pulse{0%,100%{box-shadow:0 0 60px rgba(255,214,10,.18),0 0 120px rgba(255,214,10,.08)}50%{box-shadow:0 0 90px rgba(255,214,10,.32),0 0 180px rgba(255,214,10,.14)}}
@keyframes orb-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

.orb-crumbs{padding:120px 0 18px;font-size:13px;color:#7d8095}
.orb-crumbs a{color:#9aa0b4;text-decoration:none;transition:color .2s}
.orb-crumbs a:hover{color:#FFD60A}
.orb-crumb-sep{margin:0 10px;color:#3d3f55}
.orb-crumb-now{color:#FFD60A}

/* HERO */
.orb-hero{position:relative;padding:40px 0 100px;overflow:hidden}
.orb-hero-bg{position:absolute;inset:0;background:radial-gradient(circle at 50% 60%,rgba(255,214,10,.10),transparent 55%),radial-gradient(circle at 80% 20%,rgba(34,211,238,.06),transparent 50%);pointer-events:none}
.orb-hero .container{position:relative;text-align:center}
.orb-hero-title{font-size:clamp(48px,7vw,108px);line-height:.95;font-weight:800;letter-spacing:-.04em;margin:20px 0 12px;color:#fff}
.orb-dot-y{color:#FFD60A}
.orb-thin{font-size:.45em;font-weight:300;color:#9aa0b4;letter-spacing:-.01em}
.orb-hero-sub{max-width:640px;margin:0 auto 50px;color:#a4a7bd;font-size:17px;line-height:1.65}

.orb-stage{position:relative;width:min(680px,92vw);height:min(680px,92vw);margin:0 auto}
.orb-ring{position:absolute;top:50%;left:50%;border:1px dashed rgba(255,214,10,.18);border-radius:50%;transform:translate(-50%,-50%)}
.orb-ring-1{width:38%;height:38%;border-color:rgba(255,214,10,.32)}
.orb-ring-2{width:66%;height:66%;border-color:rgba(255,214,10,.18);animation:orb-spin 80s linear infinite}
.orb-ring-3{width:100%;height:100%;border-color:rgba(34,211,238,.14);animation:orb-spin-rev 140s linear infinite}
.orb-sun{position:absolute;top:50%;left:50%;width:30%;height:30%;border-radius:50%;background:radial-gradient(circle at 30% 30%,#FFD60A,#b8970a);transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#0a0a14;font-weight:800;animation:orb-pulse 4s ease-in-out infinite}
.orb-sun strong{font-size:clamp(22px,3vw,38px);letter-spacing:.06em}
.orb-sun-tag{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.18em;opacity:.7}
.orb-sun-foot{font-size:10px;font-weight:500;text-transform:uppercase;letter-spacing:.14em;opacity:.7}

.orb-bubbles{list-style:none;margin:0;padding:0;position:absolute;inset:0}
.orb-bubble{position:absolute;width:84px;height:84px;border-radius:50%;background:rgba(15,15,29,.85);border:1px solid rgba(255,214,10,.32);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px);box-shadow:0 0 30px rgba(255,214,10,.10);animation:orb-float 5s ease-in-out infinite;transition:transform .3s,border-color .3s}
.orb-bubble:hover{transform:scale(1.1);border-color:#FFD60A}
.orb-bubble span{font-size:12px;font-weight:600;color:#e7e7f0;letter-spacing:.02em}
.orb-b1{top:0%;left:50%;transform:translate(-50%,0)}
.orb-b2{top:14%;right:6%}
.orb-b3{top:50%;right:-2%;transform:translate(0,-50%)}
.orb-b4{bottom:14%;right:6%}
.orb-b5{bottom:0%;left:50%;transform:translate(-50%,0)}
.orb-b6{bottom:14%;left:6%}
.orb-b7{top:50%;left:-2%;transform:translate(0,-50%)}
.orb-b8{top:14%;left:6%}
.orb-b2{animation-delay:-.6s}.orb-b3{animation-delay:-1.2s}.orb-b4{animation-delay:-1.8s}.orb-b5{animation-delay:-2.4s}.orb-b6{animation-delay:-3s}.orb-b7{animation-delay:-3.6s}.orb-b8{animation-delay:-4.2s}

.orb-hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:60px}
.orb-btn{display:inline-flex;align-items:center;justify-content:center;padding:16px 30px;border-radius:999px;font-weight:600;font-size:14px;letter-spacing:.02em;text-decoration:none;transition:transform .25s,box-shadow .25s,background .25s;border:1px solid transparent}
.orb-btn-primary{background:#FFD60A;color:#0a0a14;box-shadow:0 0 40px rgba(255,214,10,.3)}
.orb-btn-primary:hover{transform:translateY(-2px);box-shadow:0 0 60px rgba(255,214,10,.5)}
.orb-btn-ghost{border-color:rgba(255,255,255,.18);color:#e7e7f0}
.orb-btn-ghost:hover{border-color:#FFD60A;color:#FFD60A}

/* SECTION HEAD */
.orb-section-head{text-align:center;margin-bottom:60px}
.orb-eyebrow{display:inline-block;font-size:11px;font-weight:600;color:#FFD60A;text-transform:uppercase;letter-spacing:.22em;margin-bottom:18px}
.orb-section-head h2{font-size:clamp(34px,4.5vw,58px);font-weight:800;letter-spacing:-.03em;line-height:1.05;color:#fff;margin:0 0 18px}
.orb-section-head h2 em{font-style:italic;color:#FFD60A;font-weight:400}
.orb-section-desc{max-width:680px;margin:0 auto;color:#9aa0b4;font-size:16px;line-height:1.7}

/* WHATIS */
.orb-whatis{padding:120px 0;border-top:1px solid rgba(255,255,255,.04)}
.orb-whatis-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center;margin-top:30px}
.orb-bigscenario{margin:0}
.orb-svg{width:100%;height:auto;display:block;filter:drop-shadow(0 0 40px rgba(255,214,10,.10))}
.orb-caption{margin-top:18px;font-size:12px;color:#7d8095;text-align:center;font-style:italic;letter-spacing:.02em}
.orb-whatis-text .orb-lead{font-size:20px;line-height:1.55;color:#fff;margin-bottom:20px}
.orb-whatis-text p{color:#a4a7bd;line-height:1.75;margin-bottom:18px}
.orb-bullets{list-style:none;padding:0;margin:24px 0 0}
.orb-bullets li{display:flex;align-items:center;gap:14px;padding:10px 0;color:#cfd2e3;font-size:14px}
.orb-tick{width:10px;height:10px;border-radius:50%;background:#FFD60A;box-shadow:0 0 12px #FFD60A;flex-shrink:0}

/* MODULES — mini scenarios */
.orb-modules{padding:120px 0;background:radial-gradient(ellipse at center top,rgba(34,211,238,.04),transparent 60%)}
.orb-mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:30px}
.orb-mini{background:rgba(15,15,29,.6);border:1px solid rgba(255,255,255,.06);border-radius:24px;padding:30px;transition:border-color .3s,transform .3s}
.orb-mini:hover{border-color:rgba(255,214,10,.35);transform:translateY(-4px)}
.orb-mini-stage{position:relative;width:100%;height:200px;margin-bottom:24px}
.orb-mini-sun{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:74px;height:74px;border-radius:50%;background:#FFD60A;color:#0a0a14;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;box-shadow:0 0 30px rgba(255,214,10,.4);z-index:2}
.orb-mini-mod{position:absolute;background:#0a0a14;border:1px solid rgba(34,211,238,.4);color:#cfd2e3;padding:6px 12px;border-radius:999px;font-size:11px;font-weight:500}
.orb-mm-1{top:6%;left:50%;transform:translateX(-50%)}
.orb-mm-2{top:50%;right:0;transform:translateY(-50%)}
.orb-mm-3{bottom:6%;left:50%;transform:translateX(-50%)}
.orb-mm-4{top:50%;left:0;transform:translateY(-50%)}
.orb-mini h3{font-size:18px;font-weight:700;color:#fff;margin:0 0 8px}
.orb-mini p{font-size:13px;color:#9aa0b4;line-height:1.6;margin:0}

/* OPS — gauge */
.orb-ops{padding:120px 0;border-top:1px solid rgba(255,255,255,.04)}
.orb-gauge-wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;margin-top:30px}
.orb-gauge{position:relative;width:min(440px,80vw);height:min(440px,80vw);margin:0 auto}
.orb-gauge-arc{position:absolute;top:50%;left:50%;border-radius:50%;border:14px solid transparent;transform:translate(-50%,-50%)}
.orb-arc-core{width:34%;height:34%;border-color:#FFD60A;border-right-color:transparent;border-bottom-color:transparent;animation:orb-spin 30s linear infinite}
.orb-arc-pro{width:55%;height:55%;border-color:#22D3EE;border-left-color:transparent;border-top-color:transparent;animation:orb-spin-rev 50s linear infinite}
.orb-arc-teams{width:76%;height:76%;border-color:#FFD60A;border-bottom-color:transparent;border-right-color:transparent;opacity:.6;animation:orb-spin 70s linear infinite}
.orb-arc-ent{width:96%;height:96%;border-color:rgba(255,255,255,.18);border-style:dashed;animation:orb-spin-rev 100s linear infinite}
.orb-gauge-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#fff}
.orb-gauge-num{display:block;font-size:32px;font-weight:800;color:#FFD60A}
.orb-gauge-center strong{font-size:14px;color:#9aa0b4;font-weight:500;letter-spacing:.1em;text-transform:uppercase}
.orb-gauge-legend{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:20px}
.orb-gauge-legend li{display:flex;gap:18px;align-items:flex-start}
.orb-led{width:14px;height:14px;border-radius:50%;flex-shrink:0;margin-top:6px}
.orb-led-core{background:#FFD60A;box-shadow:0 0 14px #FFD60A}
.orb-led-pro{background:#22D3EE;box-shadow:0 0 14px #22D3EE}
.orb-led-teams{background:#FFD60A;opacity:.6;box-shadow:0 0 14px rgba(255,214,10,.5)}
.orb-led-ent{background:#fff;opacity:.4}
.orb-gauge-legend strong{display:block;color:#fff;font-size:15px;margin-bottom:4px}
.orb-gauge-legend p{margin:0;font-size:13px;color:#9aa0b4;line-height:1.6}

/* VERSUS — venn */
.orb-versus{padding:120px 0;background:radial-gradient(ellipse at center,rgba(255,214,10,.04),transparent 60%)}
.orb-venn{position:relative;height:380px;max-width:720px;margin:0 auto 60px}
.orb-venn-circle{position:absolute;width:280px;height:280px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:30px;mix-blend-mode:screen}
.orb-venn-circle h3{font-size:22px;font-weight:700;color:#fff;margin:0 0 8px}
.orb-venn-circle p{font-size:12px;color:#cfd2e3;margin:0;max-width:180px;line-height:1.5}
.orb-venn-make{background:radial-gradient(circle,rgba(255,214,10,.35),rgba(255,214,10,.05) 70%);left:50%;top:0;transform:translateX(-50%);border:1px solid rgba(255,214,10,.4)}
.orb-venn-zap{background:radial-gradient(circle,rgba(255,90,140,.30),rgba(255,90,140,.04) 70%);left:0;bottom:0;border:1px solid rgba(255,90,140,.4)}
.orb-venn-n8n{background:radial-gradient(circle,rgba(34,211,238,.30),rgba(34,211,238,.04) 70%);right:0;bottom:0;border:1px solid rgba(34,211,238,.4)}
.orb-table-wrap{overflow-x:auto;border-radius:18px;border:1px solid rgba(255,255,255,.06)}
.orb-table{width:100%;border-collapse:collapse;background:rgba(10,10,20,.6)}
.orb-table th,.orb-table td{padding:16px 20px;text-align:left;font-size:13px;border-bottom:1px solid rgba(255,255,255,.05)}
.orb-table th{background:rgba(255,214,10,.06);color:#FFD60A;font-weight:600;text-transform:uppercase;letter-spacing:.06em;font-size:11px}
.orb-table td{color:#cfd2e3}
.orb-table tr:last-child td{border-bottom:0}
.orb-table tbody tr:hover{background:rgba(255,214,10,.03)}

/* METHOD — concentric */
.orb-method{padding:120px 0;border-top:1px solid rgba(255,255,255,.04)}
.orb-rings{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;margin-top:30px}
.orb-rings-stage{position:relative;width:min(460px,80vw);height:min(460px,80vw);margin:0 auto}
.orb-ring4{position:absolute;top:50%;left:50%;border-radius:50%;border:1px solid rgba(255,214,10,.2);transform:translate(-50%,-50%)}
.orb-ring4-1{width:30%;height:30%;border-color:rgba(255,214,10,.5)}
.orb-ring4-2{width:55%;height:55%;border-color:rgba(255,214,10,.32)}
.orb-ring4-3{width:78%;height:78%;border-color:rgba(34,211,238,.28)}
.orb-ring4-4{width:100%;height:100%;border-color:rgba(255,255,255,.12);border-style:dashed}
.orb-rings-core{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:18%;height:18%;border-radius:50%;background:#FFD60A;color:#0a0a14;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;letter-spacing:.04em;box-shadow:0 0 30px rgba(255,214,10,.5)}
.orb-phase{position:absolute;background:rgba(15,15,29,.9);border:1px solid rgba(255,214,10,.4);color:#fff;padding:8px 14px;border-radius:999px;font-size:12px;font-weight:500;display:flex;align-items:center;gap:8px;backdrop-filter:blur(6px)}
.orb-phase b{color:#FFD60A;font-size:11px}
.orb-phase-1{top:32%;left:50%;transform:translate(-50%,-50%)}
.orb-phase-2{top:50%;right:8%;transform:translateY(-50%)}
.orb-phase-3{bottom:8%;left:50%;transform:translateX(-50%)}
.orb-phase-4{top:50%;left:8%;transform:translateY(-50%)}
.orb-method-list{list-style:none;padding:0;margin:0;counter-reset:olm}
.orb-method-list li{padding:18px 0;border-bottom:1px solid rgba(255,255,255,.06);color:#a4a7bd;font-size:15px;line-height:1.6}
.orb-method-list li:last-child{border-bottom:0}
.orb-method-list strong{color:#FFD60A;font-weight:700}

/* CASE */
.orb-case{padding:120px 0;background:radial-gradient(ellipse at center,rgba(34,211,238,.05),transparent 60%)}
.orb-case-card{max-width:880px;margin:0 auto;background:rgba(15,15,29,.7);border:1px solid rgba(255,214,10,.18);border-radius:28px;padding:50px;backdrop-filter:blur(10px)}
.orb-case-metric{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-bottom:40px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.08)}
.orb-case-metric div{text-align:center}
.orb-case-metric span{display:block;font-size:54px;font-weight:800;color:#FFD60A;line-height:1;letter-spacing:-.03em}
.orb-case-metric small{display:block;margin-top:10px;font-size:12px;color:#9aa0b4;text-transform:uppercase;letter-spacing:.12em}
.orb-quote{margin:0;padding:0}
.orb-quote p{font-size:20px;line-height:1.6;color:#fff;font-style:italic;margin:0 0 16px}
.orb-quote footer{font-size:13px;color:#9aa0b4}

/* PRICING — planets */
.orb-pricing{padding:120px 0;border-top:1px solid rgba(255,255,255,.04)}
.orb-planets{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin-top:60px}
.orb-planets-sun{position:absolute;top:-32px;left:50%;transform:translateX(-50%);width:64px;height:64px;border-radius:50%;background:#FFD60A;color:#0a0a14;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px;box-shadow:0 0 40px rgba(255,214,10,.5);z-index:2}
.orb-planet{background:rgba(15,15,29,.6);border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:36px 26px;text-align:center;position:relative;transition:transform .3s,border-color .3s}
.orb-planet::before{content:'';position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:24px;background:radial-gradient(circle at top,rgba(255,214,10,.2),transparent 60%);opacity:0;transition:opacity .3s;pointer-events:none}
.orb-planet:hover{transform:translateY(-6px);border-color:rgba(255,214,10,.35)}
.orb-planet:hover::before{opacity:1}
.orb-planet-tag{display:inline-block;font-size:11px;font-weight:600;color:#FFD60A;text-transform:uppercase;letter-spacing:.18em;margin-bottom:18px}
.orb-planet strong{display:block;font-size:36px;font-weight:800;color:#fff;letter-spacing:-.02em}
.orb-planet small{display:block;color:#9aa0b4;font-size:12px;margin:6px 0 18px}
.orb-planet p{font-size:13px;color:#a4a7bd;line-height:1.6;margin:0}
.orb-planet-2{transform:translateY(20px)}
.orb-planet-3{transform:translateY(10px)}
.orb-planet-4{transform:translateY(30px)}
.orb-planet-2:hover,.orb-planet-3:hover,.orb-planet-4:hover{transform:translateY(-6px)}

/* DEMO */
.orb-demo{padding:120px 0;background:radial-gradient(ellipse at center,rgba(255,214,10,.04),transparent 60%)}
.orb-video{max-width:960px;margin:0 auto;position:relative;padding-bottom:56.25%;height:0;border-radius:24px;overflow:hidden;border:1px solid rgba(255,214,10,.18);box-shadow:0 0 80px rgba(255,214,10,.10)}
.orb-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* RESOURCES */
.orb-resources{padding:120px 0;border-top:1px solid rgba(255,255,255,.04)}
.orb-res-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.orb-res{background:rgba(15,15,29,.6);border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:28px;text-decoration:none;color:inherit;transition:transform .3s,border-color .3s;display:block}
.orb-res:hover{transform:translateY(-4px);border-color:#FFD60A}
.orb-res-num{display:block;font-size:11px;font-weight:600;color:#FFD60A;letter-spacing:.18em;margin-bottom:14px}
.orb-res h3{font-size:17px;color:#fff;margin:0 0 8px;font-weight:700}
.orb-res p{font-size:12px;color:#9aa0b4;line-height:1.55;margin:0}

/* FAQ */
.orb-faq{padding:120px 0;background:radial-gradient(ellipse at top,rgba(34,211,238,.04),transparent 50%)}
.orb-faq-list{max-width:780px;margin:0 auto;display:flex;flex-direction:column;gap:14px}
.orb-q{background:rgba(15,15,29,.7);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:20px 26px;transition:border-color .3s}
.orb-q[open]{border-color:rgba(255,214,10,.35)}
.orb-q summary{font-weight:600;color:#fff;cursor:pointer;font-size:15px;list-style:none;display:flex;justify-content:space-between;align-items:center}
.orb-q summary::after{content:'+';color:#FFD60A;font-size:22px;transition:transform .3s}
.orb-q[open] summary::after{transform:rotate(45deg)}
.orb-q p{margin:14px 0 0;color:#a4a7bd;font-size:14px;line-height:1.7}

/* CTA FINAL */
.orb-cta{padding:140px 0 160px;border-top:1px solid rgba(255,255,255,.04)}
.orb-cta-stage{position:relative;max-width:780px;margin:0 auto;text-align:center;padding:80px 30px}
.orb-cta-ring{position:absolute;top:50%;left:50%;width:680px;height:680px;max-width:90vw;max-height:90vw;border:1px dashed rgba(255,214,10,.22);border-radius:50%;transform:translate(-50%,-50%);animation:orb-spin 90s linear infinite;pointer-events:none}
.orb-cta-ring::before{content:'';position:absolute;top:50%;left:50%;width:88%;height:88%;border:1px solid rgba(255,214,10,.10);border-radius:50%;transform:translate(-50%,-50%)}
.orb-cta-core{position:relative}
.orb-cta-core h2{font-size:clamp(38px,5vw,68px);font-weight:800;line-height:1.05;letter-spacing:-.03em;color:#fff;margin:14px 0 18px}
.orb-cta-core p{max-width:520px;margin:0 auto 36px;color:#a4a7bd;font-size:16px;line-height:1.7}
.orb-cta-buttons{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.orb-magnetic{transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.orb-magnetic:hover{transform:translateY(-3px) scale(1.03)}

/* RESPONSIVE — collapse to linear on mobile */
@media (max-width:980px){
  .orb-whatis-grid,.orb-gauge-wrap,.orb-rings{grid-template-columns:1fr;gap:50px}
  .orb-mini-grid{grid-template-columns:repeat(2,1fr)}
  .orb-planets{grid-template-columns:repeat(2,1fr)}
  .orb-planet-2,.orb-planet-3,.orb-planet-4{transform:none}
  .orb-res-grid{grid-template-columns:repeat(2,1fr)}
  .orb-venn{height:520px;max-width:340px}
  .orb-venn-circle{width:240px;height:240px}
  .orb-venn-make{top:0;left:50%;transform:translateX(-50%)}
  .orb-venn-zap{left:0;bottom:0}
  .orb-venn-n8n{right:0;bottom:0}
}
@media (max-width:680px){
  .orb-body .container{padding:0 18px}
  .orb-crumbs{padding:100px 0 14px}
  .orb-hero{padding:20px 0 70px}
  .orb-hero-title{font-size:46px}
  .orb-bubble{width:64px;height:64px}
  .orb-bubble span{font-size:10px}
  .orb-whatis,.orb-modules,.orb-ops,.orb-versus,.orb-method,.orb-case,.orb-pricing,.orb-demo,.orb-resources,.orb-faq{padding:80px 0}
  .orb-cta{padding:100px 0 120px}
  .orb-mini-grid{grid-template-columns:1fr}
  .orb-planets{grid-template-columns:1fr}
  .orb-res-grid{grid-template-columns:1fr}
  .orb-case-metric{grid-template-columns:1fr;gap:24px}
  .orb-case-metric span{font-size:42px}
  .orb-case-card{padding:32px 22px}
  .orb-section-head{margin-bottom:40px}
  .orb-section-head h2{font-size:30px}
  .orb-table th,.orb-table td{padding:12px 14px;font-size:12px}
  .orb-venn{height:auto;display:flex;flex-direction:column;align-items:center;gap:14px;max-width:none}
  .orb-venn-circle{position:static;transform:none;width:240px;height:240px;mix-blend-mode:normal}
  .orb-cta-ring{width:480px;height:480px}
}

/* ============================================================== */
/* SHOPIFY · EDITORIAL MAGAZINE SKELETON  (prefijo .sho-*)          */
/* ============================================================== */
.sho-cover,.sho-toc,.sho-chap,.sho-pricing,.sho-case,.sho-demo,.sho-res,.sho-faq,.sho-sub{
  background:#050509;color:#e8e6e0;font-family:'Space Grotesk',system-ui,sans-serif;
  padding:120px 6vw;position:relative;overflow:hidden;
}
.sho-cover em,.sho-toc em,.sho-chap em,.sho-pricing em,.sho-case em,.sho-demo em,.sho-res em,.sho-faq em,.sho-sub em{
  font-family: var(--font-display);font-style:italic;font-weight:400;color:#FFD60A;
}

/* COVER ----------------------------------------------------------- */
.sho-cover{min-height:100vh;padding:48px 6vw;display:flex;align-items:stretch;}
.sho-cover-grain{position:absolute;inset:0;background:
  radial-gradient(circle at 20% 30%,rgba(255,214,10,.05),transparent 40%),
  radial-gradient(circle at 80% 70%,rgba(34,211,238,.04),transparent 45%);
  pointer-events:none;}
.sho-cover-frame{position:relative;width:100%;border:1px solid rgba(255,255,255,.08);padding:40px 48px;display:flex;flex-direction:column;}
.sho-cover-top{display:flex;justify-content:space-between;align-items:center;font-family:'JetBrains Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.18em;color:#6a6a72;}
.sho-cover-year{color:#FFD60A;}
.sho-cover-crumb a{color:#9a9aa2;text-decoration:none;}
.sho-cover-crumb a:hover{color:#FFD60A;}
.sho-cover-crumb span{margin:0 6px;color:#4a4a52;}
.sho-cover-cur{color:#FFD60A!important;}
.sho-cover-stage{flex:1;display:grid;grid-template-columns:1.5fr 1fr;gap:60px;align-items:center;padding:60px 0;}
.sho-cover-eyebrow{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#9a9aa2;margin-bottom:30px;}
.sho-cover-logotype{font-family: var(--font-display);font-size:clamp(90px,14vw,220px);line-height:.88;letter-spacing:-.04em;margin:0;color:#fff;font-weight:400;}
.sho-cover-italic{font-family: var(--font-display);font-style:italic;font-size:clamp(22px,2.6vw,38px);color:#FFD60A;margin:24px 0 0;max-width:720px;line-height:1.3;}
.sho-cover-meta{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.12em;color:#6a6a72;margin-top:48px;text-transform:uppercase;}
.sho-cover-mock{display:flex;justify-content:center;}
.sho-mock-card{width:100%;max-width:340px;background:#0d0d13;box-shadow:0 40px 80px -20px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.04);}
.sho-mock-photo{aspect-ratio:3/4;background:linear-gradient(145deg,#1a1a24,#0a0a10);position:relative;overflow:hidden;}
.sho-mock-tag{position:absolute;top:16px;left:16px;background:#FFD60A;color:#050509;font-family:'JetBrains Mono',monospace;font-size:10px;padding:5px 10px;letter-spacing:.15em;font-weight:600;z-index:2;}
.sho-mock-shape{position:absolute;border-radius:50%;filter:blur(30px);}
.sho-mock-shape-a{width:160px;height:160px;background:#FFD60A;opacity:.12;top:20%;left:15%;}
.sho-mock-shape-b{width:120px;height:120px;background:#22d3ee;opacity:.1;bottom:20%;right:10%;}
.sho-mock-shape-c{width:80px;height:80px;background:#fff;opacity:.05;top:60%;left:50%;}
.sho-mock-body{padding:24px;}
.sho-mock-brand{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.2em;color:#6a6a72;text-transform:uppercase;margin:0 0 8px;}
.sho-mock-name{font-family: var(--font-display);font-style:italic;font-size:18px;color:#fff;margin:0 0 14px;line-height:1.3;}
.sho-mock-price{font-family: var(--font-display);font-size:22px;color:#FFD60A;margin:0 0 18px;}
.sho-mock-price span{display:block;font-family:'Space Grotesk',sans-serif;font-size:11px;color:#6a6a72;font-style:normal;margin-top:4px;}
.sho-mock-btn{width:100%;background:transparent;color:#fff;border:1px solid rgba(255,255,255,.2);padding:14px;font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:.15em;text-transform:uppercase;cursor:pointer;transition:all .3s;}
.sho-mock-btn:hover{background:#FFD60A;color:#050509;border-color:#FFD60A;}
.sho-cover-bottom{display:flex;align-items:center;gap:24px;font-family:'JetBrains Mono',monospace;font-size:11px;color:#6a6a72;text-transform:uppercase;letter-spacing:.18em;}
.sho-cover-sign{color:#FFD60A;font-family: var(--font-display);font-style:italic;font-size:18px;letter-spacing:0;text-transform:none;}
.sho-cover-line{flex:1;height:1px;background:rgba(255,255,255,.1);}

/* TOC ------------------------------------------------------------- */
.sho-toc-wrap{max-width:1100px;margin:0 auto;}
.sho-toc-kicker{font-family:'JetBrains Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.24em;color:#6a6a72;margin:0 0 16px;}
.sho-toc-title{font-family: var(--font-display);font-style:italic;font-size:clamp(56px,9vw,130px);line-height:.9;margin:0 0 80px;color:#fff;font-weight:400;}
.sho-toc-list{list-style:none;padding:0;margin:0;}
.sho-toc-row{display:grid;grid-template-columns:80px 1fr auto;grid-template-rows:auto auto;gap:4px 30px;padding:36px 0;border-top:1px solid rgba(255,255,255,.08);align-items:baseline;}
.sho-toc-row:last-child{border-bottom:1px solid rgba(255,255,255,.08);}
.sho-toc-num{font-family: var(--font-display);font-style:italic;font-size:48px;color:#FFD60A;grid-row:1/3;align-self:center;}
.sho-toc-name{font-family: var(--font-display);font-size:clamp(30px,4vw,56px);color:#fff;text-decoration:none;line-height:1;transition:color .3s;}
.sho-toc-name:hover{color:#FFD60A;font-style:italic;}
.sho-toc-sub{grid-column:2/4;font-family:'Space Grotesk',sans-serif;font-size:14px;color:#9a9aa2;font-style:italic;}
.sho-toc-dots{display:none;}

/* CHAPTERS common ------------------------------------------------- */
.sho-chap-head{margin:0 auto 80px;max-width:1200px;}
.sho-chap-head-center{text-align:center;}
.sho-chap-num{display:block;font-family:'JetBrains Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.24em;color:#FFD60A;margin-bottom:20px;}
.sho-chap-title{font-family: var(--font-display);font-size:clamp(56px,9vw,140px);line-height:.88;margin:0 0 24px;color:#fff;font-weight:400;letter-spacing:-.02em;}
.sho-chap-deck{font-family: var(--font-display);font-style:italic;font-size:clamp(18px,2vw,26px);color:#9a9aa2;max-width:720px;margin:0;line-height:1.4;}
.sho-chap-head-center .sho-chap-deck{margin:0 auto;}

/* CAP I ----------------------------------------------------------- */
.sho-chap-body{display:grid;grid-template-columns:1.6fr 1fr;gap:80px;max-width:1200px;margin:0 auto;align-items:start;}
.sho-prose{font-family: var(--font-display);font-size:17px;line-height:1.75;color:#c8c6c0;column-count:1;}
.sho-prose p{margin:0 0 20px;}
.sho-prose-lead{font-size:19px;}
.sho-dropcap{font-family: var(--font-display);font-size:78px;float:left;line-height:.8;padding:8px 10px 0 0;color:#FFD60A;font-weight:400;}
.sho-prose-foot{font-family:'JetBrains Mono',monospace;font-size:11px;color:#6a6a72;text-transform:uppercase;letter-spacing:.15em;margin-top:32px!important;}
.sho-flow{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.08);padding:32px;display:flex;flex-direction:column;gap:14px;}
.sho-flow-cap{font-family:'JetBrains Mono',monospace;font-size:10px;color:#6a6a72;text-transform:uppercase;letter-spacing:.2em;margin:0 0 10px;}
.sho-flow-step{display:flex;gap:18px;padding:20px;background:#0b0b12;border:1px solid rgba(255,255,255,.05);}
.sho-flow-step-active{border-color:rgba(255,214,10,.35);background:rgba(255,214,10,.03);}
.sho-flow-step-n{font-family: var(--font-display);font-style:italic;font-size:22px;color:#FFD60A;}
.sho-flow-step-body{flex:1;}
.sho-flow-step-t{font-family: var(--font-display);font-style:italic;font-size:18px;margin:0 0 14px;color:#fff;}
.sho-flow-line{height:8px;background:rgba(255,255,255,.06);margin-bottom:8px;}
.sho-flow-line-sm{width:70%;}
.sho-flow-input{height:34px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);margin-bottom:8px;}
.sho-flow-input-half{width:50%;}
.sho-flow-step-tot{font-family: var(--font-display);font-size:20px;color:#FFD60A;margin:10px 0 0;}
.sho-flow-pay{width:100%;background:#FFD60A;color:#050509;border:0;padding:14px;font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:12px;letter-spacing:.15em;text-transform:uppercase;margin-top:8px;cursor:pointer;}
.sho-flow-check{width:44px;height:44px;border-radius:50%;background:#FFD60A;color:#050509;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;margin:4px 0 10px;}
.sho-flow-msg{font-family: var(--font-display);font-style:italic;font-size:14px;color:#c8c6c0;margin:0;}
.sho-flow-arrow{text-align:center;color:#FFD60A;font-size:18px;opacity:.5;}

/* CAP II Markets -------------------------------------------------- */
.sho-chap-2{padding-left:6vw;padding-right:6vw;}
.sho-markets-head{max-width:560px;margin-bottom:60px;}
.sho-markets-title{font-family: var(--font-display);font-size:clamp(64px,10vw,160px);line-height:.85;color:#fff;font-weight:400;margin:10px 0 24px;letter-spacing:-.03em;}
.sho-markets-deck{font-family: var(--font-display);font-style:italic;font-size:20px;color:#9a9aa2;line-height:1.5;}
.sho-map{position:relative;height:260px;margin:40px 0;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);}
.sho-map-canvas{position:absolute;inset:0;background:
  radial-gradient(ellipse at center,rgba(255,214,10,.03),transparent 60%);}
.sho-map-pin{position:absolute;width:12px;height:12px;border-radius:50%;background:#FFD60A;box-shadow:0 0 0 4px rgba(255,214,10,.15),0 0 20px rgba(255,214,10,.4);animation:shoPulse 3s infinite;}
.sho-map-pin::after{content:'';position:absolute;inset:-14px;border-radius:50%;border:1px solid rgba(255,214,10,.2);animation:shoPulse 3s infinite;}
@keyframes shoPulse{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.25);opacity:.7;}}
.sho-pin-us{top:35%;left:18%;}
.sho-pin-mx{top:50%;left:22%;}
.sho-pin-br{top:70%;left:32%;}
.sho-pin-ar{top:85%;left:30%;}
.sho-pin-uk{top:25%;left:46%;}
.sho-pin-es{top:36%;left:48%;}
.sho-pin-jp{top:38%;left:82%;}
.sho-pin-au{top:80%;left:82%;}
.sho-markets-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(255,255,255,.08);}
.sho-market{padding:32px 24px;border-right:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);}
.sho-market:nth-child(4n){border-right:0;}
.sho-market-flag{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.15em;background:rgba(255,214,10,.1);color:#FFD60A;padding:4px 8px;display:inline-block;margin-bottom:14px;}
.sho-market-c{font-family: var(--font-display);font-style:italic;font-size:22px;color:#fff;margin:0 0 4px;}
.sho-market-cur{font-family: var(--font-display);font-size:36px;color:#FFD60A;margin:0 0 8px;line-height:1;}
.sho-market-pg{font-family:'Space Grotesk',sans-serif;font-size:12px;color:#6a6a72;margin:0;}

/* CAP III Contact sheet ------------------------------------------ */
.sho-contact-sheet{display:grid;grid-template-columns:repeat(5,1fr);grid-auto-rows:200px;gap:2px;max-width:1400px;margin:0 auto;background:rgba(255,255,255,.05);padding:2px;}
.sho-app{background:#0a0a10;padding:24px;display:flex;flex-direction:column;justify-content:space-between;transition:all .3s;position:relative;}
.sho-app:hover{background:#111119;}
.sho-app-tall{grid-row:span 2;}
.sho-app-wide{grid-column:span 2;}
.sho-app-logo{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#FFD60A,#f0b90b);color:#050509;display:flex;align-items:center;justify-content:center;font-family: var(--font-display);font-style:italic;font-weight:700;font-size:24px;}
.sho-app-wide .sho-app-logo,.sho-app-tall .sho-app-logo{background:linear-gradient(135deg,#22d3ee,#0ea5e9);color:#050509;}
.sho-app-name{font-family: var(--font-display);font-style:italic;font-size:18px;color:#fff;margin:0 0 4px;}
.sho-app-cat{font-family:'JetBrains Mono',monospace;font-size:10px;color:#6a6a72;text-transform:uppercase;letter-spacing:.15em;margin:0;}
.sho-contact-foot{text-align:center;margin:40px 0 0;font-family: var(--font-display);font-style:italic;font-size:18px;color:#9a9aa2;}

/* CAP IV Plus ----------------------------------------------------- */
.sho-chap-4{padding:160px 6vw;}
.sho-plus-bg{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-family: var(--font-display);font-size:clamp(140px,22vw,360px);font-weight:400;color:transparent;-webkit-text-stroke:1px rgba(255,214,10,.15);letter-spacing:-.03em;white-space:nowrap;pointer-events:none;line-height:1;}
.sho-plus-front{position:relative;z-index:2;max-width:1200px;margin:0 auto;}
.sho-plus-card{background:rgba(10,10,16,.85);backdrop-filter:blur(10px);border:1px solid #FFD60A;padding:60px;display:grid;grid-template-columns:repeat(2,1fr);gap:50px;}
.sho-plus-feat-n{font-family: var(--font-display);font-style:italic;font-size:32px;color:#FFD60A;margin:0 0 8px;}
.sho-plus-feat-t{font-family: var(--font-display);font-size:26px;color:#fff;margin:0 0 12px;line-height:1.2;}
.sho-plus-feat-d{font-family:'Space Grotesk',sans-serif;font-size:14px;color:#9a9aa2;line-height:1.6;margin:0;}
.sho-plus-foot{text-align:center;margin:50px auto 0;max-width:720px;font-family: var(--font-display);font-style:italic;font-size:17px;color:#9a9aa2;line-height:1.6;}

/* CAP V Storefronts ---------------------------------------------- */
.sho-store-split{display:grid;grid-template-columns:1fr 1.3fr;gap:90px;max-width:1300px;margin:0 auto;align-items:center;}
.sho-polaroid{background:#f4f0e8;padding:20px 20px 70px;box-shadow:0 30px 60px -20px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.05);transform:rotate(-2deg);margin:0;}
.sho-polaroid-photo{aspect-ratio:1;background:#1a1a22;position:relative;overflow:hidden;}
.sho-polaroid-bar{position:absolute;background:#FFD60A;}
.sho-polaroid-bar-a{top:20%;left:15%;width:50%;height:6px;}
.sho-polaroid-bar-b{top:32%;left:15%;width:30%;height:6px;opacity:.6;}
.sho-polaroid-circle{position:absolute;bottom:15%;right:15%;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle at 30% 30%,#22d3ee,#0ea5e9);opacity:.8;}
.sho-polaroid-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:30px 30px;}
.sho-polaroid-cap{font-family:'JetBrains Mono',monospace;font-size:11px;color:#2a2a30;text-align:center;margin:20px 0 0;letter-spacing:.1em;}
.sho-store-text h3.sho-store-h{font-family: var(--font-display);font-size:32px;color:#fff;margin:32px 0 14px;font-weight:400;}
.sho-store-text h3.sho-store-h:first-child{margin-top:0;}
.sho-store-h span{color:#FFD60A;font-style:italic;margin:0 6px;}
.sho-store-text p{font-family: var(--font-display);font-size:16px;line-height:1.7;color:#c8c6c0;margin:0 0 18px;}
.sho-store-text em{font-family: var(--font-display);font-style:italic;color:#FFD60A;}

/* CAP VI Paths ---------------------------------------------------- */
.sho-paths{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;max-width:1300px;margin:0 auto;}
.sho-path{background:#0a0a10;border:1px solid rgba(255,255,255,.08);padding:44px 36px;transition:all .3s;}
.sho-path:hover{border-color:rgba(255,214,10,.3);}
.sho-path-mid{border-color:#FFD60A;background:rgba(255,214,10,.03);transform:translateY(-12px);}
.sho-path-tag{font-family:'JetBrains Mono',monospace;font-size:10px;color:#FFD60A;text-transform:uppercase;letter-spacing:.2em;margin:0 0 20px;}
.sho-path-t{font-family: var(--font-display);font-size:32px;color:#fff;margin:0 0 10px;line-height:1.1;font-weight:400;}
.sho-path-dur{font-family: var(--font-display);font-style:italic;font-size:15px;color:#FFD60A;margin:0 0 28px;padding-bottom:24px;border-bottom:1px solid rgba(255,255,255,.08);}
.sho-path-list{list-style:none;padding:0;margin:0 0 28px;}
.sho-path-list li{font-family:'Space Grotesk',sans-serif;font-size:13.5px;color:#c8c6c0;padding:10px 0 10px 20px;position:relative;line-height:1.5;}
.sho-path-list li::before{content:'—';position:absolute;left:0;color:#FFD60A;}
.sho-path-foot{font-family: var(--font-display);font-style:italic;font-size:13px;color:#6a6a72;margin:0;line-height:1.5;}

/* PRICING --------------------------------------------------------- */
.sho-tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:0;max-width:1300px;margin:0 auto;border-top:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);}
.sho-tier{padding:50px 32px;border-right:1px solid rgba(255,255,255,.08);position:relative;}
.sho-tier:last-child{border-right:0;}
.sho-tier-hi{background:rgba(255,214,10,.04);}
.sho-tier-pill{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:#FFD60A;color:#050509;font-family:'JetBrains Mono',monospace;font-size:10px;padding:5px 14px;letter-spacing:.15em;text-transform:uppercase;white-space:nowrap;}
.sho-tier-name{font-family:'JetBrains Mono',monospace;font-size:11px;color:#6a6a72;text-transform:uppercase;letter-spacing:.2em;margin:0 0 18px;}
.sho-tier-hi .sho-tier-name{color:#FFD60A;}
.sho-tier-price{font-family: var(--font-display);font-size:68px;color:#fff;margin:0 0 28px;line-height:.9;font-weight:400;}
.sho-tier-price span{font-size:18px;color:#6a6a72;display:block;font-style:italic;margin-bottom:6px;}
.sho-tier-price small{font-size:14px;color:#6a6a72;font-style:italic;margin-left:6px;}
.sho-tier-list{list-style:none;padding:0;margin:0 0 28px;}
.sho-tier-list li{font-family: var(--font-display);font-size:14px;color:#c8c6c0;padding:8px 0;border-bottom:1px dashed rgba(255,255,255,.06);}
.sho-tier-for{font-family: var(--font-display);font-style:italic;font-size:13px;color:#9a9aa2;margin:0;}

/* CASE ------------------------------------------------------------ */
.sho-case{padding:140px 6vw;max-width:1100px;margin:0 auto;}
.sho-case-tag{font-family:'JetBrains Mono',monospace;font-size:11px;color:#FFD60A;text-transform:uppercase;letter-spacing:.24em;margin:0 0 40px;text-align:center;}
.sho-case-quote{margin:0 0 60px;text-align:center;}
.sho-case-quote p{font-family: var(--font-display);font-size:clamp(28px,4vw,52px);line-height:1.25;color:#fff;margin:0 0 30px;font-style:normal;}
.sho-case-quote em{color:#FFD60A;}
.sho-case-foot{font-family: var(--font-display);font-style:italic;font-size:16px;color:#6a6a72;}
.sho-case-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid rgba(255,255,255,.08);}
.sho-case-stat{padding:30px 20px;text-align:center;border-right:1px solid rgba(255,255,255,.08);}
.sho-case-stat:last-child{border-right:0;}
.sho-case-num{font-family: var(--font-display);font-size:42px;color:#FFD60A;margin:0 0 6px;font-weight:400;}
.sho-case-lab{font-family:'JetBrains Mono',monospace;font-size:10px;color:#6a6a72;text-transform:uppercase;letter-spacing:.15em;margin:0;}

/* DEMO ------------------------------------------------------------ */
.sho-demo-frame{max-width:1100px;margin:0 auto;aspect-ratio:16/9;border:1px solid rgba(255,255,255,.08);background:#000;}
.sho-demo-frame iframe{width:100%;height:100%;display:block;}

/* RES ------------------------------------------------------------- */
.sho-res-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;max-width:1300px;margin:0 auto;border-top:1px solid rgba(255,255,255,.08);}
.sho-res-card{padding:40px 28px;border-right:1px solid rgba(255,255,255,.08);border-bottom:1px solid rgba(255,255,255,.08);text-decoration:none;color:inherit;display:block;position:relative;transition:all .3s;}
.sho-res-card:last-child{border-right:0;}
.sho-res-card:hover{background:rgba(255,214,10,.04);}
.sho-res-card:hover .sho-res-arrow{transform:translateX(8px);color:#FFD60A;}
.sho-res-host{font-family:'JetBrains Mono',monospace;font-size:11px;color:#FFD60A;margin:0 0 14px;letter-spacing:.1em;}
.sho-res-t{font-family: var(--font-display);font-size:24px;color:#fff;margin:0 0 10px;font-weight:400;}
.sho-res-d{font-family:'Space Grotesk',sans-serif;font-size:13px;color:#9a9aa2;line-height:1.5;margin:0 0 20px;}
.sho-res-arrow{font-family: var(--font-display);font-size:22px;color:#6a6a72;transition:all .3s;display:inline-block;}

/* FAQ ------------------------------------------------------------- */
.sho-faq{padding-left:6vw;padding-right:6vw;}
.sho-faq-list{max-width:900px;margin:0 auto;}
.sho-qa{padding:40px 0;border-top:1px solid rgba(255,255,255,.08);}
.sho-qa:last-child{border-bottom:1px solid rgba(255,255,255,.08);}
.sho-qa-q{font-family: var(--font-display);font-size:24px;color:#fff;margin:0 0 18px;line-height:1.3;font-weight:400;}
.sho-qa-q span{font-style:italic;color:#FFD60A;margin-right:10px;}
.sho-qa-a{font-family: var(--font-display);font-size:16px;line-height:1.7;color:#9a9aa2;margin:0;padding-left:40px;}
.sho-qa-a span{font-style:italic;color:#FFD60A;margin-right:10px;margin-left:-40px;display:inline-block;width:30px;}

/* SUB ------------------------------------------------------------- */
.sho-sub{padding:140px 6vw;}
.sho-sub-box{max-width:900px;margin:0 auto;text-align:center;border:1px solid rgba(255,255,255,.08);padding:80px 60px;background:rgba(255,255,255,.02);}
.sho-sub-kicker{font-family:'JetBrains Mono',monospace;font-size:11px;color:#FFD60A;text-transform:uppercase;letter-spacing:.24em;margin:0 0 24px;}
.sho-sub-h{font-family: var(--font-display);font-size:clamp(40px,6vw,80px);line-height:1;color:#fff;margin:0 0 24px;font-weight:400;}
.sho-sub-d{font-family: var(--font-display);font-style:italic;font-size:19px;color:#9a9aa2;max-width:600px;margin:0 auto 40px;line-height:1.5;}
.sho-sub-actions{display:flex;flex-direction:column;gap:18px;align-items:center;}
.sho-sub-btn{display:inline-block;background:#FFD60A;color:#050509;padding:18px 40px;text-decoration:none;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;transition:all .3s;}
.sho-sub-btn:hover{background:#fff;}
.sho-sub-link{font-family: var(--font-display);font-style:italic;font-size:14px;color:#9a9aa2;text-decoration:none;}
.sho-sub-link:hover{color:#FFD60A;}
.sho-sub-foot{font-family:'JetBrains Mono',monospace;font-size:10px;color:#6a6a72;text-transform:uppercase;letter-spacing:.2em;margin:50px 0 0;}

/* RESPONSIVE ------------------------------------------------------ */
@media (max-width:980px){
  .sho-cover,.sho-toc,.sho-chap,.sho-pricing,.sho-case,.sho-demo,.sho-res,.sho-faq,.sho-sub{padding:80px 5vw;}
  .sho-cover-stage{grid-template-columns:1fr;gap:40px;padding:30px 0;}
  .sho-cover-mock{max-width:300px;margin:0 auto;}
  .sho-chap-body,.sho-store-split{grid-template-columns:1fr;gap:50px;}
  .sho-markets-grid,.sho-tiers,.sho-res-grid,.sho-case-stats{grid-template-columns:repeat(2,1fr);}
  .sho-market:nth-child(2n),.sho-res-card:nth-child(2n),.sho-case-stat:nth-child(2n){border-right:0;}
  .sho-contact-sheet{grid-template-columns:repeat(3,1fr);grid-auto-rows:180px;}
  .sho-app-wide,.sho-app-tall{grid-column:span 1;grid-row:span 1;}
  .sho-plus-card{grid-template-columns:1fr;padding:40px 28px;gap:36px;}
  .sho-paths{grid-template-columns:1fr;gap:20px;}
  .sho-path-mid{transform:none;}
  .sho-toc-row{grid-template-columns:60px 1fr;}
  .sho-toc-num{font-size:36px;}
  .sho-polaroid{transform:none;max-width:420px;margin:0 auto;}
  .sho-qa-a{padding-left:0;}
  .sho-qa-a span{margin-left:0;}
}
@media (max-width:640px){
  .sho-cover-frame{padding:24px;}
  .sho-cover-top{flex-direction:column;gap:14px;align-items:flex-start;}
  .sho-cover-logotype{font-size:72px;}
  .sho-markets-grid,.sho-tiers,.sho-res-grid,.sho-case-stats{grid-template-columns:1fr;}
  .sho-market,.sho-res-card,.sho-case-stat{border-right:0;}
  .sho-contact-sheet{grid-template-columns:repeat(2,1fr);}
  .sho-sub-box{padding:50px 28px;}
}

/* ================================================================= */
/* WORDPRESS · WP-ADMIN SPLIT SHELL (.wa-*)                           */
/* ================================================================= */
.wa-topbar{
  position:relative;z-index:5;background:#1d2327;border-bottom:1px solid #0a0c0e;
  font:500 12px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#c3c4c7;
}
.wa-topbar-inner{
  max-width:1600px;margin:0 auto;padding:0 20px;height:34px;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.wa-topbar-left,.wa-topbar-right{display:flex;align-items:center;gap:10px;}
.wa-topbar-logo{
  width:22px;height:22px;border-radius:3px;background:#2271b1;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:12px;
}
.wa-topbar-brand{color:#fff;text-decoration:none;font-weight:600;}
.wa-topbar-brand:hover{color:#FFD60A;}
.wa-topbar-sep{color:#50575e;}
.wa-topbar-link{color:#c3c4c7;text-decoration:none;}
.wa-topbar-link:hover{color:#FFD60A;}
.wa-topbar-cur{color:#FFD60A;font-weight:600;}
.wa-topbar-hi{color:#c3c4c7;}
.wa-topbar-avatar{
  width:24px;height:24px;border-radius:50%;background:#2271b1;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:10px;
}

.wa-shell{
  background:#050509;color:#e7e7ea;min-height:100vh;
  display:grid;grid-template-columns:300px 1fr;gap:0;
  max-width:1600px;margin:0 auto;border-left:1px solid rgba(255,255,255,0.04);
  border-right:1px solid rgba(255,255,255,0.04);
}

/* --- ADMIN SIDEBAR (sticky) -------------------------------------- */
.wa-admin-sidebar{
  position:sticky;top:60px;align-self:start;height:calc(100vh - 60px);
  background:#1d2327;border-right:1px solid #0a0c0e;overflow-y:auto;
  font:13px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  display:flex;flex-direction:column;
}
.wa-admin-site{
  display:flex;align-items:center;gap:10px;padding:16px 18px;
  border-bottom:1px solid #0a0c0e;background:#16191d;
}
.wa-admin-ico{
  width:36px;height:36px;border-radius:6px;background:#2271b1;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;
}
.wa-admin-site-txt{display:flex;flex-direction:column;gap:2px;}
.wa-admin-site-name{color:#fff;font-weight:600;font-size:13px;}
.wa-admin-site-role{color:#8c8f94;font-size:11px;text-transform:uppercase;letter-spacing:.06em;}
.wa-admin-nav{display:flex;flex-direction:column;padding:8px 0;flex:1;}
.wa-admin-item{
  display:flex;align-items:center;gap:10px;padding:10px 18px;
  color:#c3c4c7;text-decoration:none;font-weight:500;
  border-left:3px solid transparent;transition:all .15s ease;
}
.wa-admin-item:hover{background:#16191d;color:#fff;}
.wa-admin-item.is-active{
  background:#2271b1;color:#fff;border-left-color:#FFD60A;
  box-shadow:inset 0 0 0 1px rgba(255,214,10,0.15);
}
.wa-admin-dot{
  width:6px;height:6px;border-radius:50%;background:#50575e;flex-shrink:0;
}
.wa-admin-item.is-active .wa-admin-dot{background:#FFD60A;}
.wa-admin-foot{
  padding:14px 18px;border-top:1px solid #0a0c0e;background:#16191d;
  display:flex;flex-direction:column;gap:4px;
}
.wa-admin-ver{color:#8c8f94;font-size:11px;font-family:Menlo,Monaco,monospace;}
.wa-admin-env{color:#FFD60A;font-size:11px;font-weight:600;}

/* --- PREVIEW AREA ------------------------------------------------- */
.wa-preview{min-width:0;background:#050509;}
.wa-section{
  padding:72px 56px;border-bottom:1px solid rgba(255,255,255,0.06);
  max-width:1100px;
}
.wa-section:last-child{border-bottom:none;}
.wa-crumb{
  font:500 12px/1 -apple-system,sans-serif;color:#8c8f94;margin-bottom:18px;
  display:flex;gap:8px;align-items:center;flex-wrap:wrap;
}
.wa-crumb a{color:#8c8f94;text-decoration:none;}
.wa-crumb a:hover{color:#FFD60A;}
.wa-crumb span{color:#50575e;}
.wa-crumb span:last-child{color:#FFD60A;font-weight:600;}
.wa-eyebrow{
  display:inline-block;padding:5px 11px;border-radius:3px;
  background:rgba(34,113,177,0.18);color:#7cc0ff;border:1px solid rgba(34,113,177,0.4);
  font:600 10px/1 -apple-system,sans-serif;text-transform:uppercase;letter-spacing:.12em;
  margin-bottom:20px;
}
.wa-h1{
  font:800 clamp(38px,5vw,68px)/1.05 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#fff;margin:0 0 22px 0;letter-spacing:-0.02em;
}
.wa-h1-accent{color:#FFD60A;font-style:italic;font-family: var(--font-display);font-weight:400;}
.wa-sub{
  font:500 19px/1.5 -apple-system,sans-serif;color:#c3c4c7;
  margin:0 0 16px 0;max-width:680px;
}
.wa-lead{
  font:400 15px/1.7 -apple-system,sans-serif;color:#8c8f94;
  margin:0 0 28px 0;max-width:680px;
}
.wa-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px;}
.wa-btn{
  display:inline-flex;align-items:center;gap:8px;padding:14px 22px;border-radius:4px;
  text-decoration:none;font:600 14px/1 -apple-system,sans-serif;
  transition:all .2s ease;border:1px solid transparent;
}
.wa-btn-pri{background:#FFD60A;color:#1d2327;}
.wa-btn-pri:hover{background:#fff;transform:translateY(-1px);}
.wa-btn-sec{background:transparent;color:#fff;border-color:#2271b1;}
.wa-btn-sec:hover{background:#2271b1;}

.wa-hero-meta{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:48px;
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.06);border-radius:4px;
  overflow:hidden;
}
.wa-hero-meta>div{
  background:#0a0c10;padding:18px 16px;display:flex;flex-direction:column;gap:4px;
}
.wa-hero-meta strong{color:#FFD60A;font:700 22px/1 -apple-system,sans-serif;}
.wa-hero-meta span{color:#8c8f94;font-size:11px;line-height:1.4;}

/* --- HEAD block -------------------------------------------------- */
.wa-head{margin-bottom:32px;}
.wa-tag{
  display:inline-block;padding:4px 10px;border-radius:3px;
  background:#1d2327;border:1px solid #2271b1;color:#7cc0ff;
  font:600 10px/1 Menlo,monospace;text-transform:uppercase;letter-spacing:.08em;
  margin-bottom:14px;
}
.wa-h2{
  font:800 clamp(26px,3vw,38px)/1.15 -apple-system,sans-serif;color:#fff;
  margin:0 0 10px 0;letter-spacing:-0.01em;
}
.wa-head-sub{color:#8c8f94;font:400 15px/1.6 -apple-system,sans-serif;max-width:640px;margin:0;}

/* --- SPLIT (qué es) ---------------------------------------------- */
.wa-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;}
.wa-copy p{color:#c3c4c7;font:400 15px/1.7 -apple-system,sans-serif;margin:0 0 14px 0;}
.wa-bul{list-style:none;padding:0;margin:18px 0 0 0;display:flex;flex-direction:column;gap:10px;}
.wa-bul li{
  color:#c3c4c7;font-size:14px;padding-left:22px;position:relative;
}
.wa-bul li::before{
  content:"";position:absolute;left:0;top:8px;width:10px;height:2px;background:#FFD60A;
}

.wa-browser{
  background:#16191d;border:1px solid rgba(255,255,255,0.08);border-radius:8px;overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,0.5);
}
.wa-browser-bar{
  display:flex;align-items:center;gap:6px;padding:10px 14px;
  background:#0a0c10;border-bottom:1px solid rgba(255,255,255,0.06);
}
.wa-browser-bar>span:nth-child(-n+3){width:10px;height:10px;border-radius:50%;background:#3c3f44;}
.wa-browser-bar>span:first-child{background:#ff5f57;}
.wa-browser-bar>span:nth-child(2){background:#febc2e;}
.wa-browser-bar>span:nth-child(3){background:#28c840;}
.wa-browser-url{
  margin-left:10px;padding:3px 12px;background:#16191d;border-radius:3px;
  color:#8c8f94;font:500 11px/1 Menlo,monospace;
}
.wa-browser-body{padding:18px;display:flex;flex-direction:column;gap:16px;}
.wa-mock-nav{
  display:flex;align-items:center;gap:12px;padding-bottom:14px;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.wa-mock-logo{
  width:24px;height:24px;border-radius:4px;background:#2271b1;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;
}
.wa-mock-link{color:#8c8f94;font-size:11px;}
.wa-mock-cta{
  margin-left:auto;padding:5px 10px;border-radius:3px;background:#FFD60A;color:#1d2327;
  font:700 10px/1 sans-serif;
}
.wa-mock-hero{display:flex;flex-direction:column;gap:8px;padding:6px 0;}
.wa-mock-h1{height:14px;background:rgba(255,255,255,0.14);border-radius:3px;width:90%;}
.wa-mock-h1.short{width:60%;}
.wa-mock-sub{height:6px;background:rgba(255,255,255,0.06);border-radius:3px;width:85%;}
.wa-mock-btns{display:flex;gap:8px;margin-top:8px;}
.wa-mock-btn{width:70px;height:22px;border-radius:3px;background:rgba(255,255,255,0.08);}
.wa-mock-btn.pri{background:#FFD60A;}
.wa-mock-blocks{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:4px;}
.wa-mock-block{
  height:56px;border-radius:4px;
  background:linear-gradient(135deg,rgba(34,113,177,0.25),rgba(255,214,10,0.08));
  border:1px solid rgba(255,255,255,0.06);
}

/* --- PLUGINS grid ------------------------------------------------ */
.wa-plugins{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.wa-plug{
  display:flex;gap:14px;padding:18px;background:#0a0c10;
  border:1px solid rgba(255,255,255,0.06);border-radius:6px;
  transition:all .2s ease;
}
.wa-plug:hover{border-color:#2271b1;transform:translateY(-2px);}
.wa-plug-ico{
  flex-shrink:0;width:44px;height:44px;border-radius:6px;background:#1d2327;
  border:1px solid #2271b1;color:#FFD60A;
  display:inline-flex;align-items:center;justify-content:center;
  font:700 16px/1 -apple-system,sans-serif;
}
.wa-plug h3{font:700 14px/1.2 -apple-system,sans-serif;color:#fff;margin:0 0 3px 0;}
.wa-plug-cat{
  display:inline-block;font:500 10px/1 Menlo,monospace;color:#7cc0ff;
  text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;
}
.wa-plug p{color:#8c8f94;font:400 12px/1.5 -apple-system,sans-serif;margin:0;}

/* --- CAPACIDADES ------------------------------------------------- */
.wa-caps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.wa-cap{
  background:#0a0c10;border:1px solid rgba(255,255,255,0.06);border-radius:6px;
  padding:18px;display:flex;flex-direction:column;gap:10px;
}
.wa-cap-prev{
  height:88px;border-radius:4px;padding:10px;background:#16191d;
  border:1px solid rgba(255,255,255,0.06);
  display:flex;flex-direction:column;gap:6px;
}
.wa-cap-prev.alt{background:linear-gradient(135deg,#1d2327,#0a0c10);}
.wa-cap-bar{height:8px;background:#2271b1;border-radius:2px;width:100%;}
.wa-cap-bar.big{height:18px;background:linear-gradient(90deg,#2271b1,#FFD60A);}
.wa-cap-line{height:4px;background:rgba(255,255,255,0.14);border-radius:2px;width:100%;}
.wa-cap-line.short{width:55%;}
.wa-cap-grid-s{
  flex:1;background:
    linear-gradient(rgba(255,255,255,0.06),rgba(255,255,255,0.06)) center/100% 1px no-repeat,
    linear-gradient(90deg,rgba(255,255,255,0.06),rgba(255,255,255,0.06)) center/1px 100% no-repeat;
  background-color:rgba(34,113,177,0.08);border-radius:3px;
}
.wa-cap h3{font:700 15px/1.2 -apple-system,sans-serif;color:#FFD60A;margin:0;}
.wa-cap p{color:#c3c4c7;font:400 13px/1.5 -apple-system,sans-serif;margin:0;}

/* --- PERFORMANCE metrics ---------------------------------------- */
.wa-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:24px;}
.wa-metric{
  background:#0a0c10;border:1px solid rgba(255,255,255,0.06);border-radius:6px;
  padding:18px 16px;display:flex;flex-direction:column;gap:6px;position:relative;overflow:hidden;
}
.wa-metric.ok{border-color:rgba(34,197,94,0.3);}
.wa-metric-label{
  font:700 11px/1 Menlo,monospace;color:#8c8f94;text-transform:uppercase;letter-spacing:.1em;
}
.wa-metric-val{font:800 28px/1 -apple-system,sans-serif;color:#FFD60A;}
.wa-metric-hint{font:400 11px/1.3 -apple-system,sans-serif;color:#8c8f94;}
.wa-metric-bar{display:block;height:4px;background:rgba(255,255,255,0.06);border-radius:2px;overflow:hidden;margin-top:6px;}
.wa-metric-bar i{display:block;height:100%;background:linear-gradient(90deg,#22c55e,#FFD60A);}

.wa-compare{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.wa-compare-col{
  padding:20px;border-radius:6px;background:#0a0c10;
  border:1px solid rgba(255,255,255,0.08);
}
.wa-compare-col.good{border-color:rgba(255,214,10,0.35);}
.wa-compare-col.bad{border-color:rgba(239,68,68,0.25);}
.wa-compare-tag{
  display:inline-block;padding:4px 10px;border-radius:3px;margin-bottom:12px;
  font:700 11px/1 Menlo,monospace;text-transform:uppercase;letter-spacing:.08em;
}
.wa-compare-col.good .wa-compare-tag{background:rgba(255,214,10,0.12);color:#FFD60A;}
.wa-compare-col.bad .wa-compare-tag{background:rgba(239,68,68,0.12);color:#ff6b6b;}
.wa-compare-col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;}
.wa-compare-col li{color:#c3c4c7;font-size:13px;padding-left:18px;position:relative;}
.wa-compare-col.good li::before{content:"+";position:absolute;left:0;color:#FFD60A;font-weight:700;}
.wa-compare-col.bad li::before{content:"-";position:absolute;left:0;color:#ff6b6b;font-weight:700;}

/* --- CONSOLE ----------------------------------------------------- */
.wa-console{
  background:#0a0c10;border:1px solid rgba(255,255,255,0.1);border-radius:6px;overflow:hidden;
  margin-bottom:18px;box-shadow:0 20px 50px rgba(0,0,0,0.5);
}
.wa-console-bar{
  display:flex;align-items:center;gap:6px;padding:10px 14px;
  background:#16191d;border-bottom:1px solid rgba(255,255,255,0.06);
}
.wa-console-dot{width:10px;height:10px;border-radius:50%;}
.wa-console-dot.r{background:#ff5f57;}
.wa-console-dot.y{background:#febc2e;}
.wa-console-dot.g{background:#28c840;}
.wa-console-title{margin-left:10px;color:#8c8f94;font:500 12px/1 Menlo,monospace;}
.wa-console-body{padding:16px 18px;font:13px/1.7 Menlo,Monaco,monospace;}
.wa-console-body p{margin:0;color:#c3c4c7;}
.wa-console-body .t{color:#50575e;margin-right:6px;}
.wa-console-body .ok{
  display:inline-block;padding:1px 7px;border-radius:3px;margin-right:6px;
  background:rgba(34,197,94,0.16);color:#4ade80;font-weight:700;font-size:11px;
}
.wa-console-body .warn{
  display:inline-block;padding:1px 7px;border-radius:3px;margin-right:6px;
  background:rgba(255,214,10,0.14);color:#FFD60A;font-weight:700;font-size:11px;
}
.wa-note{color:#8c8f94;font:400 13px/1.6 -apple-system,sans-serif;}
.wa-note a{color:#FFD60A;}

/* --- METODO fases ------------------------------------------------ */
.wa-phases{
  list-style:none;padding:0;margin:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;counter-reset:wa;
}
.wa-phases li{
  background:#0a0c10;border:1px solid rgba(255,255,255,0.06);border-radius:6px;
  padding:20px 18px;display:flex;flex-direction:column;gap:8px;position:relative;
}
.wa-phase-num{
  font:800 14px/1 Menlo,monospace;color:#2271b1;letter-spacing:.05em;
}
.wa-phases h3{font:700 16px/1.2 -apple-system,sans-serif;color:#FFD60A;margin:0;}
.wa-phases p{color:#c3c4c7;font:400 13px/1.5 -apple-system,sans-serif;margin:0;}

/* --- PRICING ----------------------------------------------------- */
.wa-price{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.wa-price-card{
  background:#0a0c10;border:1px solid rgba(255,255,255,0.08);border-radius:8px;
  padding:24px 22px;display:flex;flex-direction:column;gap:10px;
}
.wa-price-card.is-feat{
  border-color:#FFD60A;background:linear-gradient(180deg,rgba(255,214,10,0.07),#0a0c10 60%);
  box-shadow:0 20px 50px rgba(255,214,10,0.08);
}
.wa-price-tag{
  font:700 11px/1 Menlo,monospace;color:#7cc0ff;text-transform:uppercase;letter-spacing:.08em;
}
.wa-price-card.is-feat .wa-price-tag{color:#FFD60A;}
.wa-price-val{font:800 24px/1.1 -apple-system,sans-serif;color:#fff;margin:4px 0 10px 0;}
.wa-price-card ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;}
.wa-price-card li{
  color:#c3c4c7;font-size:13px;padding-left:18px;position:relative;
}
.wa-price-card li::before{
  content:"";position:absolute;left:0;top:8px;width:8px;height:8px;
  border-radius:2px;background:#2271b1;
}
.wa-price-card.is-feat li::before{background:#FFD60A;}

/* --- VIDEO ------------------------------------------------------- */
.wa-video{
  position:relative;padding-top:56.25%;background:#0a0c10;border-radius:8px;overflow:hidden;
  border:1px solid rgba(255,255,255,0.08);margin-bottom:14px;
}
.wa-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}

/* --- RECURSOS ---------------------------------------------------- */
.wa-res{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.wa-res-card{
  background:#0a0c10;border:1px solid rgba(255,255,255,0.06);border-radius:6px;
  padding:20px 18px;text-decoration:none;display:flex;flex-direction:column;gap:8px;
  transition:all .2s ease;
}
.wa-res-card:hover{border-color:#FFD60A;transform:translateY(-2px);}
.wa-res-ico{
  width:38px;height:38px;border-radius:6px;background:#1d2327;border:1px solid #2271b1;
  color:#FFD60A;display:inline-flex;align-items:center;justify-content:center;
  font:700 14px/1 -apple-system,sans-serif;margin-bottom:4px;
}
.wa-res-card h3{font:700 14px/1.2 -apple-system,sans-serif;color:#fff;margin:0;}
.wa-res-card p{color:#8c8f94;font:400 12px/1.5 -apple-system,sans-serif;margin:0;}

/* --- FAQ --------------------------------------------------------- */
.wa-faq{display:flex;flex-direction:column;gap:10px;}
.wa-faq-item{
  background:#0a0c10;border:1px solid rgba(255,255,255,0.06);border-radius:6px;
  padding:16px 20px;
}
.wa-faq-item summary{
  cursor:pointer;color:#fff;font:600 15px/1.3 -apple-system,sans-serif;
  list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;
}
.wa-faq-item summary::after{
  content:"+";color:#FFD60A;font:800 20px/1 sans-serif;transition:transform .2s ease;
}
.wa-faq-item[open] summary::after{content:"−";}
.wa-faq-item summary::-webkit-details-marker{display:none;}
.wa-faq-item p{
  color:#c3c4c7;font:400 14px/1.6 -apple-system,sans-serif;
  margin:12px 0 0 0;padding-top:12px;border-top:1px solid rgba(255,255,255,0.06);
}

/* --- CTA FINAL --------------------------------------------------- */
.wa-cta-final{
  background:linear-gradient(180deg,rgba(255,214,10,0.05),transparent 80%);
  text-align:left;
}
.wa-cta-final p{color:#c3c4c7;font:400 16px/1.6 -apple-system,sans-serif;max-width:620px;margin:0 0 22px 0;}

/* --- RESPONSIVE -------------------------------------------------- */
@media (max-width:1100px){
  .wa-plugins,.wa-caps,.wa-phases{grid-template-columns:repeat(2,1fr);}
  .wa-metrics{grid-template-columns:repeat(2,1fr);}
  .wa-res{grid-template-columns:repeat(2,1fr);}
  .wa-price{grid-template-columns:1fr;}
  .wa-split{grid-template-columns:1fr;}
  .wa-section{padding:56px 36px;}
}
@media (max-width:900px){
  .wa-shell{grid-template-columns:1fr;}
  .wa-admin-sidebar{
    position:relative;top:auto;height:auto;max-height:none;
    border-right:none;border-bottom:1px solid #0a0c0e;
  }
  .wa-admin-nav{flex-direction:row;overflow-x:auto;padding:6px 10px;gap:4px;}
  .wa-admin-item{
    flex-shrink:0;padding:8px 12px;border-left:none;border-bottom:2px solid transparent;
    border-radius:3px;font-size:12px;
  }
  .wa-admin-item.is-active{border-left:none;border-bottom-color:#FFD60A;}
  .wa-admin-site,.wa-admin-foot{display:none;}
  .wa-hero-meta{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .wa-section{padding:44px 22px;}
  .wa-h1{font-size:34px;}
  .wa-plugins,.wa-caps,.wa-phases,.wa-metrics,.wa-res,.wa-compare{grid-template-columns:1fr;}
  .wa-topbar-hi{display:none;}
  .wa-cta{flex-direction:column;align-items:stretch;}
  .wa-btn{justify-content:center;}
}


/* ================================================================ */
/* TIENDANUBE · STOREFRONT WARMTH (.sto-*)                           */
/* ================================================================ */
:root{
  --sto-bg:#050509;
  --sto-bg2:#0b0a0f;
  --sto-ink:#f6f1e8;
  --sto-mut:#a9a198;
  --sto-yel:#ffd11a;
  --sto-rose:#ff8866;
  --sto-line:rgba(255,241,232,0.10);
  --sto-card:rgba(255,241,232,0.035);
  --sto-warm:rgba(255,136,102,0.08);
}
.sto-hero,.sto-quick,.sto-cohort,.sto-integ,.sto-map,.sto-caps,.sto-vs,.sto-phase,.sto-case,.sto-price,.sto-demo,.sto-res,.sto-faq,.sto-cta{
  background:var(--sto-bg);color:var(--sto-ink);
  font-family:'Inter',system-ui,sans-serif;
  padding:100px 40px;position:relative;
}
.sto-chip{
  display:inline-block;padding:7px 14px;border-radius:100px;
  background:var(--sto-warm);border:1px solid rgba(255,136,102,0.3);
  color:var(--sto-rose);font-size:11px;font-weight:600;letter-spacing:0.14em;
  text-transform:uppercase;margin-bottom:18px;
}

/* HERO */
.sto-hero{min-height:100vh;padding-top:60px;overflow:hidden;}
.sto-hero-bg{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(circle at 30% 20%,rgba(255,136,102,0.12),transparent 50%),
    radial-gradient(circle at 70% 80%,rgba(255,209,26,0.08),transparent 55%);
}
.sto-crumb{
  position:relative;z-index:2;display:flex;gap:10px;align-items:center;
  font-size:12px;color:var(--sto-mut);letter-spacing:0.06em;margin-bottom:40px;
}
.sto-crumb a{color:var(--sto-mut);text-decoration:none;}
.sto-crumb a:hover{color:var(--sto-yel);}
.sto-crumb-cur{color:var(--sto-ink);}
.sto-hero-inner{
  position:relative;z-index:2;max-width:1300px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1.1fr;gap:80px;align-items:center;
}
.sto-hero-eyebrow{
  display:block;font-size:12px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--sto-rose);margin-bottom:22px;font-weight:600;
}
.sto-hero-h1{
  font-size:72px;line-height:1.02;font-weight:800;letter-spacing:-0.03em;
  margin:0 0 30px;color:var(--sto-ink);
}
.sto-hero-h1 em{color:var(--sto-yel);font-style:italic;font-weight:500;}
.sto-hero-sub{
  font-size:18px;line-height:1.65;color:var(--sto-mut);max-width:460px;
}

/* HERO stage (iPhone + labels) */
.sto-hero-stage{
  position:relative;display:flex;justify-content:center;align-items:center;
  min-height:620px;
}
.sto-phone{
  width:290px;height:590px;border-radius:44px;
  background:linear-gradient(160deg,#1a1814,#050509);
  border:2px solid rgba(255,241,232,0.14);
  box-shadow:0 40px 90px rgba(0,0,0,0.55),0 0 0 1px rgba(255,136,102,0.15);
  padding:14px;position:relative;z-index:3;
}
.sto-phone-notch{
  position:absolute;top:14px;left:50%;transform:translateX(-50%);
  width:110px;height:24px;border-radius:0 0 18px 18px;background:#000;
}
.sto-phone-screen{
  width:100%;height:100%;border-radius:32px;background:#faf6ee;
  color:#1a1814;padding:30px 18px 18px;overflow:hidden;
  display:flex;flex-direction:column;
}
.sto-phone-top{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:14px;
}
.sto-phone-brand{font-weight:700;font-size:15px;letter-spacing:-0.01em;}
.sto-phone-cart{
  width:26px;height:26px;border-radius:50%;background:#1a1814;color:#faf6ee;
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;
}
.sto-phone-nav{
  display:flex;gap:14px;font-size:11px;color:#7a6f60;font-weight:500;
  padding-bottom:10px;border-bottom:1px solid rgba(26,24,20,0.08);margin-bottom:14px;
}
.sto-phone-nav-on{color:#1a1814;font-weight:700;border-bottom:2px solid #ff8866;padding-bottom:6px;}
.sto-phone-product{flex:1;display:flex;flex-direction:column;}
.sto-phone-img{
  position:relative;border-radius:14px;overflow:hidden;margin-bottom:12px;
  aspect-ratio:1/1;background:#f5e8d8;
}
.sto-phone-img svg{width:100%;height:100%;display:block;}
.sto-phone-tag{
  position:absolute;top:10px;left:10px;padding:4px 10px;border-radius:100px;
  background:#1a1814;color:#faf6ee;font-size:10px;font-weight:700;letter-spacing:0.08em;
  text-transform:uppercase;
}
.sto-phone-name{font-size:13px;font-weight:600;margin:0 0 6px;line-height:1.3;}
.sto-phone-price{font-size:22px;font-weight:800;margin:0 0 2px;letter-spacing:-0.01em;}
.sto-phone-cuotas{font-size:11px;color:#7a6f60;margin:0 0 12px;}
.sto-phone-cuotas strong{color:#ff8866;font-weight:700;}
.sto-phone-btn{
  background:var(--sto-yel);color:#1a1814;border:0;padding:12px;border-radius:10px;
  font-weight:800;font-size:12px;letter-spacing:0.05em;text-transform:uppercase;
  cursor:pointer;margin-bottom:10px;
}
.sto-phone-pay{
  display:flex;justify-content:space-between;font-size:9px;color:#7a6f60;
}
.sto-phone-pay-mp{color:#00b2e3;font-weight:700;}

.sto-label{
  position:absolute;z-index:4;display:flex;gap:10px;align-items:flex-start;
  padding:12px 16px;border-radius:14px;
  background:rgba(11,10,15,0.94);border:1px solid rgba(255,136,102,0.35);
  backdrop-filter:blur(10px);max-width:210px;
  box-shadow:0 10px 30px rgba(0,0,0,0.4);
}
.sto-label strong{display:block;font-size:12px;color:var(--sto-ink);margin-bottom:3px;}
.sto-label span:not(.sto-label-dot){display:block;font-size:10px;color:var(--sto-mut);line-height:1.4;}
.sto-label-dot{
  width:8px;height:8px;border-radius:50%;background:var(--sto-rose);
  flex-shrink:0;margin-top:4px;box-shadow:0 0 12px var(--sto-rose);
}
.sto-label-a{top:30px;left:-30px;}
.sto-label-b{top:240px;right:-40px;}
.sto-label-c{bottom:50px;left:-10px;}

/* QUICK + STATS */
.sto-quick{display:grid;grid-template-columns:1fr 1.2fr;gap:70px;max-width:1300px;margin:0 auto;align-items:center;}
.sto-quick-h{font-size:40px;line-height:1.1;font-weight:700;letter-spacing:-0.02em;margin:0 0 20px;}
.sto-quick-p{font-size:16px;line-height:1.7;color:var(--sto-mut);}
.sto-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.sto-stat{
  padding:30px 28px;border-radius:18px;
  background:var(--sto-card);border:1px solid var(--sto-line);
  position:relative;overflow:hidden;
}
.sto-stat::before{
  content:"";position:absolute;top:0;left:0;width:40px;height:40px;
  border-top:2px solid var(--sto-rose);border-left:2px solid var(--sto-rose);
  border-radius:18px 0 0 0;
}
.sto-stat-num{display:block;font-size:36px;font-weight:800;color:var(--sto-yel);letter-spacing:-0.02em;margin-bottom:8px;}
.sto-stat-lbl{display:block;font-size:12px;color:var(--sto-mut);line-height:1.5;}

/* COHORT */
.sto-cohort-head,.sto-integ-head,.sto-map-head,.sto-caps-head,.sto-vs-head,.sto-phase-head,.sto-price-head,.sto-demo-head,.sto-res-head,.sto-faq-head{
  max-width:760px;margin:0 auto 60px;text-align:center;
}
.sto-cohort-head h2,.sto-integ-head h2,.sto-map-head h2,.sto-caps-head h2,.sto-vs-head h2,.sto-phase-head h2,.sto-price-head h2,.sto-demo-head h2,.sto-res-head h2,.sto-faq-head h2{
  font-size:38px;line-height:1.15;font-weight:700;letter-spacing:-0.02em;margin:0 0 16px;
}
.sto-cohort-head p,.sto-map-head p,.sto-vs-head p,.sto-demo-head p{color:var(--sto-mut);font-size:16px;line-height:1.6;}
.sto-cohort-rail{
  display:grid;grid-template-columns:repeat(6,minmax(220px,1fr));gap:20px;
  max-width:1400px;margin:0 auto;overflow-x:auto;padding-bottom:14px;
}
.sto-mini{
  background:#faf6ee;color:#1a1814;border-radius:18px;padding:16px;
  border:1px solid rgba(255,136,102,0.25);
  transition:transform 0.3s;
}
.sto-mini:hover{transform:translateY(-6px) rotate(-0.5deg);}
.sto-mini-head{display:flex;justify-content:space-between;align-items:center;font-size:10px;margin-bottom:12px;}
.sto-mini-head span:first-child{font-weight:700;text-transform:lowercase;letter-spacing:0.02em;}
.sto-mini-tn{color:#ff8866;font-weight:700;}
.sto-mini-img{
  aspect-ratio:1/1;border-radius:12px;margin-bottom:12px;
  background:linear-gradient(135deg,var(--c,#e8c9a0),rgba(255,255,255,0.3));
}
.sto-mini-name{font-size:13px;font-weight:600;margin:0 0 6px;line-height:1.3;}
.sto-mini-price{font-size:15px;font-weight:800;margin:0 0 10px;}
.sto-mini-price span{display:block;font-size:10px;font-weight:500;color:#7a6f60;margin-top:2px;}
.sto-mini-cat{display:inline-block;padding:4px 10px;border-radius:100px;background:rgba(26,24,20,0.08);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;}

/* INTEG */
.sto-integ-grid{
  display:grid;grid-template-columns:repeat(6,1fr);gap:0;
  max-width:1300px;margin:0 auto;
  border:1px solid var(--sto-line);border-radius:22px;overflow:hidden;
  background:var(--sto-card);
}
.sto-integ-item{
  padding:32px 24px;border-right:1px solid var(--sto-line);
  transition:background 0.3s;
}
.sto-integ-item:last-child{border-right:0;}
.sto-integ-item:hover{background:rgba(255,136,102,0.06);}
.sto-integ-logo{width:44px;height:44px;margin-bottom:16px;display:block;}
.sto-integ-item strong{display:block;font-size:15px;color:var(--sto-ink);margin-bottom:8px;}
.sto-integ-item p{font-size:12px;color:var(--sto-mut);line-height:1.55;margin:0;}

/* MAP */
.sto-map-wrap{
  display:grid;grid-template-columns:1fr 1.3fr;gap:60px;max-width:1100px;margin:0 auto;align-items:center;
}
.sto-map-svg{width:100%;max-width:380px;margin:0 auto;display:block;}
.sto-map-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:14px;}
.sto-map-list li{
  display:grid;grid-template-columns:1fr auto 1.1fr;gap:20px;align-items:center;
  padding:18px 22px;border-radius:14px;
  background:var(--sto-card);border:1px solid var(--sto-line);
  border-left:3px solid var(--sto-yel);
}
.sto-map-city{font-size:15px;font-weight:700;color:var(--sto-ink);}
.sto-map-time{font-size:20px;font-weight:800;color:var(--sto-rose);letter-spacing:-0.01em;}
.sto-map-note{font-size:12px;color:var(--sto-mut);text-align:right;}

/* CAPS */
.sto-caps-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1300px;margin:0 auto;
}
.sto-cap{
  position:relative;padding:38px 32px;border-radius:20px;
  background:var(--sto-card);border:1px solid var(--sto-line);
  transition:transform 0.3s,border-color 0.3s;
}
.sto-cap:hover{transform:translateY(-4px);border-color:rgba(255,136,102,0.4);}
.sto-cap-corner{position:absolute;width:22px;height:22px;border:2px solid var(--sto-rose);}
.sto-cap-corner-tl{top:-1px;left:-1px;border-right:0;border-bottom:0;border-radius:20px 0 0 0;}
.sto-cap-corner-br{bottom:-1px;right:-1px;border-left:0;border-top:0;border-radius:0 0 20px 0;}
.sto-cap-num{
  display:inline-block;font-family:'JetBrains Mono',monospace;font-size:12px;
  color:var(--sto-rose);font-weight:700;margin-bottom:18px;letter-spacing:0.08em;
}
.sto-cap h3{font-size:19px;line-height:1.25;font-weight:700;margin:0 0 12px;color:var(--sto-ink);}
.sto-cap p{font-size:14px;line-height:1.65;color:var(--sto-mut);margin:0;}

/* VS TABLE */
.sto-vs-table{
  max-width:1100px;margin:0 auto;border-radius:18px;overflow:hidden;
  border:1px solid var(--sto-line);background:var(--sto-card);
}
.sto-vs-row{
  display:grid;grid-template-columns:1fr 1.3fr 1.3fr;gap:30px;
  padding:22px 30px;border-bottom:1px solid var(--sto-line);
  font-size:14px;color:var(--sto-mut);line-height:1.55;
}
.sto-vs-row:last-child{border-bottom:0;}
.sto-vs-row-head{
  background:rgba(255,136,102,0.08);font-weight:700;color:var(--sto-ink);
  font-size:12px;text-transform:uppercase;letter-spacing:0.12em;
}
.sto-vs-tn{color:var(--sto-yel);}
.sto-vs-sh{color:var(--sto-ink);}
.sto-vs-k{font-weight:700;color:var(--sto-ink);}

/* PHASE */
.sto-phase-rail{
  display:grid;grid-template-columns:repeat(5,1fr);gap:20px;max-width:1400px;margin:0 auto;
  position:relative;
}
.sto-phase-rail::before{
  content:"";position:absolute;top:50px;left:5%;right:5%;height:2px;
  background:linear-gradient(90deg,var(--sto-rose),var(--sto-yel));opacity:0.25;
}
.sto-phase-step{
  position:relative;padding:30px 22px;border-radius:18px;
  background:var(--sto-card);border:1px solid var(--sto-line);
}
.sto-phase-num{
  display:inline-block;width:44px;height:44px;border-radius:12px;
  background:var(--sto-yel);color:#1a1814;font-weight:800;font-size:16px;
  display:flex;align-items:center;justify-content:center;margin-bottom:14px;
}
.sto-phase-time{
  display:block;font-size:10px;color:var(--sto-rose);font-weight:700;
  text-transform:uppercase;letter-spacing:0.1em;margin-bottom:8px;
}
.sto-phase-step h3{font-size:17px;font-weight:700;margin:0 0 10px;color:var(--sto-ink);}
.sto-phase-step p{font-size:12px;line-height:1.6;color:var(--sto-mut);margin:0;}

/* CASE */
.sto-case-card{
  max-width:900px;margin:0 auto;padding:60px 56px;border-radius:24px;
  background:linear-gradient(160deg,rgba(255,136,102,0.1),rgba(255,209,26,0.04));
  border:1px solid rgba(255,136,102,0.3);text-align:center;
}
.sto-case-card h2{font-size:28px;font-weight:700;margin:0 0 24px;}
.sto-case-quote{
  font-size:22px;line-height:1.5;font-style:italic;font-weight:300;
  color:var(--sto-ink);margin:0 0 16px;max-width:680px;margin:0 auto 16px;
}
.sto-case-author{font-size:13px;color:var(--sto-rose);font-weight:700;margin-bottom:40px;}
.sto-case-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding-top:30px;border-top:1px solid rgba(255,136,102,0.2);}
.sto-case-num{display:block;font-size:32px;font-weight:800;color:var(--sto-yel);margin-bottom:6px;}
.sto-case-lbl{display:block;font-size:11px;color:var(--sto-mut);line-height:1.45;}

/* PRICE */
.sto-price-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:22px;max-width:1300px;margin:0 auto;
}
.sto-tier{
  position:relative;padding:38px 30px;border-radius:20px;
  background:var(--sto-card);border:1px solid var(--sto-line);
  transition:transform 0.3s;
}
.sto-tier:hover{transform:translateY(-6px);}
.sto-tier-on{border-color:var(--sto-rose);background:rgba(255,136,102,0.06);}
.sto-tier-flag{
  position:absolute;top:-12px;left:50%;transform:translateX(-50%);
  padding:6px 16px;border-radius:100px;background:var(--sto-yel);color:#1a1814;
  font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:0.1em;
}
.sto-tier h3{font-size:20px;font-weight:700;margin:0 0 12px;color:var(--sto-ink);}
.sto-tier-val{font-size:34px;font-weight:800;margin:0 0 6px;color:var(--sto-yel);letter-spacing:-0.02em;}
.sto-tier-val span{font-size:13px;font-weight:500;color:var(--sto-mut);margin-left:4px;}
.sto-tier-com{font-size:11px;color:var(--sto-rose);font-weight:700;text-transform:uppercase;letter-spacing:0.08em;margin:0 0 22px;padding-bottom:18px;border-bottom:1px dashed var(--sto-line);}
.sto-tier ul{list-style:none;padding:0;margin:0;}
.sto-tier li{font-size:13px;color:var(--sto-mut);line-height:1.55;padding:8px 0 8px 20px;position:relative;}
.sto-tier li::before{content:"+";position:absolute;left:0;color:var(--sto-rose);font-weight:800;}

/* DEMO */
.sto-demo-frame{
  max-width:980px;margin:0 auto;aspect-ratio:16/9;border-radius:22px;overflow:hidden;
  border:1px solid var(--sto-line);background:#000;
  box-shadow:0 30px 70px rgba(0,0,0,0.5);
}
.sto-demo-frame iframe{width:100%;height:100%;border:0;display:block;}

/* RES */
.sto-res-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1200px;margin:0 auto;
}
.sto-res-card{
  display:block;padding:32px 26px;border-radius:18px;text-decoration:none;
  background:var(--sto-card);border:1px solid var(--sto-line);color:var(--sto-ink);
  transition:border-color 0.3s,transform 0.3s;
}
.sto-res-card:hover{border-color:var(--sto-rose);transform:translateY(-3px);}
.sto-res-k{display:block;font-size:10px;color:var(--sto-rose);font-weight:700;text-transform:uppercase;letter-spacing:0.12em;margin-bottom:12px;}
.sto-res-card strong{display:block;font-size:15px;margin-bottom:10px;word-break:break-word;}
.sto-res-card p{font-size:12px;color:var(--sto-mut);line-height:1.55;margin:0;}

/* FAQ */
.sto-faq-list{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:12px;}
.sto-faq-q{
  padding:22px 26px;border-radius:16px;
  background:var(--sto-card);border:1px solid var(--sto-line);
  transition:border-color 0.3s;
}
.sto-faq-q[open]{border-color:rgba(255,136,102,0.4);background:rgba(255,136,102,0.04);}
.sto-faq-q summary{
  cursor:pointer;font-size:16px;font-weight:600;color:var(--sto-ink);
  list-style:none;display:flex;justify-content:space-between;align-items:center;
}
.sto-faq-q summary::after{content:"+";color:var(--sto-rose);font-size:22px;font-weight:300;transition:transform 0.3s;}
.sto-faq-q[open] summary::after{content:"−";}
.sto-faq-q p{margin:16px 0 0;font-size:14px;line-height:1.7;color:var(--sto-mut);}

/* CTA */
.sto-cta-card{
  max-width:860px;margin:0 auto;padding:70px 60px;border-radius:26px;text-align:center;
  background:linear-gradient(160deg,rgba(255,136,102,0.12),rgba(255,209,26,0.06));
  border:1px solid rgba(255,136,102,0.35);
}
.sto-cta-card h2{font-size:40px;font-weight:700;margin:0 0 18px;letter-spacing:-0.02em;}
.sto-cta-card p{font-size:16px;line-height:1.6;color:var(--sto-mut);max-width:560px;margin:0 auto 36px;}
.sto-cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:28px;}
.sto-cta-btn{
  display:inline-block;padding:16px 34px;border-radius:12px;
  background:var(--sto-yel);color:#1a1814;text-decoration:none;
  font-weight:800;font-size:14px;letter-spacing:0.05em;text-transform:uppercase;
  transition:transform 0.2s;
}
.sto-cta-btn:hover{transform:translateY(-2px);}
.sto-cta-wa{
  display:inline-block;padding:16px 34px;border-radius:12px;
  background:transparent;border:1px solid var(--sto-rose);color:var(--sto-rose);
  text-decoration:none;font-weight:700;font-size:14px;letter-spacing:0.05em;text-transform:uppercase;
}
.sto-cta-wa:hover{background:rgba(255,136,102,0.1);}
.sto-cta-foot{font-size:11px;color:var(--sto-mut);margin:0;letter-spacing:0.06em;}

/* RESPONSIVE */
@media (max-width:1100px){
  .sto-hero-inner{grid-template-columns:1fr;gap:60px;}
  .sto-hero-h1{font-size:56px;}
  .sto-quick{grid-template-columns:1fr;gap:40px;}
  .sto-cohort-rail{grid-template-columns:repeat(3,minmax(240px,1fr));}
  .sto-integ-grid{grid-template-columns:repeat(3,1fr);}
  .sto-integ-item:nth-child(3){border-right:0;}
  .sto-integ-item:nth-child(-n+3){border-bottom:1px solid var(--sto-line);}
  .sto-caps-grid,.sto-price-grid,.sto-res-grid{grid-template-columns:repeat(2,1fr);}
  .sto-phase-rail{grid-template-columns:repeat(2,1fr);}
  .sto-phase-rail::before{display:none;}
  .sto-map-wrap{grid-template-columns:1fr;gap:40px;}
}
@media (max-width:720px){
  .sto-hero,.sto-quick,.sto-cohort,.sto-integ,.sto-map,.sto-caps,.sto-vs,.sto-phase,.sto-case,.sto-price,.sto-demo,.sto-res,.sto-faq,.sto-cta{padding:70px 22px;}
  .sto-hero-h1{font-size:42px;}
  .sto-quick-h,.sto-cohort-head h2,.sto-integ-head h2,.sto-map-head h2,.sto-caps-head h2,.sto-vs-head h2,.sto-phase-head h2,.sto-price-head h2,.sto-demo-head h2,.sto-res-head h2,.sto-faq-head h2,.sto-cta-card h2{font-size:28px;}
  .sto-stats,.sto-cohort-rail,.sto-integ-grid,.sto-caps-grid,.sto-price-grid,.sto-res-grid,.sto-phase-rail,.sto-case-stats{grid-template-columns:1fr;}
  .sto-integ-item{border-right:0;border-bottom:1px solid var(--sto-line);}
  .sto-integ-item:last-child{border-bottom:0;}
  .sto-vs-row{grid-template-columns:1fr;gap:8px;padding:18px 22px;}
  .sto-label-a{top:10px;left:-10px;max-width:170px;}
  .sto-label-b{top:auto;bottom:260px;right:-10px;max-width:170px;}
  .sto-label-c{bottom:10px;left:-10px;max-width:170px;}
  .sto-phone{width:250px;height:520px;}
  .sto-case-card,.sto-cta-card{padding:40px 26px;}
  .sto-map-list li{grid-template-columns:1fr;gap:4px;}
  .sto-map-note{text-align:left;}
}

/* ============================================================
   BITRIX24 · BENTO WORKSPACE GRID (.bnt-*)
   Skeleton único — suite todo-en-uno como bento asimétrico
   ============================================================ */
.bnt-page{background:#050509;color:#e8e8ee;font-family:var(--font-sans,system-ui);}
.bnt-bx{color:#1974d2;}
.bnt-ol{color:#FFD60A;}
.bnt-mono{font-family:var(--font-mono,ui-monospace);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8a8aa0;}

/* Hero bento */
.bnt-hero{padding:110px 0 60px;position:relative;overflow:hidden;}
.bnt-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 30% 20%,rgba(25,116,210,.12),transparent 60%),radial-gradient(50% 40% at 80% 80%,rgba(255,214,10,.08),transparent 60%);pointer-events:none;}
.bnt-crumb{font-size:12px;color:#8a8aa0;margin-bottom:18px;}
.bnt-crumb a{color:#c8c8d4;text-decoration:none;}
.bnt-crumb a:hover{color:#FFD60A;}
.bnt-head{max-width:780px;margin-bottom:28px;}
.bnt-h1{font-size:clamp(26px,3.2vw,40px);font-weight:700;line-height:1.15;margin:8px 0 10px;letter-spacing:-.01em;}
.bnt-sub{font-size:15px;color:#a8a8b8;max-width:620px;margin:0 0 18px;}
.bnt-qa{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01));border:1px solid rgba(255,255,255,.08);border-left:3px solid #FFD60A;padding:14px 18px;border-radius:10px;max-width:720px;font-size:14px;color:#c8c8d4;margin-bottom:34px;}
.bnt-qa strong{color:#fff;}

.bnt-bento{display:grid;gap:14px;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(4,minmax(130px,auto));grid-template-areas:
  "crm crm crm crm call call"
  "crm crm crm crm call call"
  "crm crm crm crm tasks tasks"
  "chat chat cal cal sites sites";}
.bnt-tile{background:linear-gradient(180deg,#0c0c14,#08080f);border:1px solid rgba(255,255,255,.07);border-radius:16px;padding:16px;position:relative;overflow:hidden;transition:border-color .25s,transform .25s;}
.bnt-tile:hover{border-color:rgba(255,214,10,.3);transform:translateY(-2px);}
.bnt-tile-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.bnt-tile-name{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8a8aa0;}
.bnt-tile-dot{width:8px;height:8px;border-radius:50%;background:#1974d2;box-shadow:0 0 10px #1974d2;}
.bnt-tile h3{font-size:14px;margin:0 0 10px;color:#fff;}

.bnt-t-crm{grid-area:crm;}
.bnt-t-call{grid-area:call;}
.bnt-t-tasks{grid-area:tasks;}
.bnt-t-chat{grid-area:chat;}
.bnt-t-cal{grid-area:cal;}
.bnt-t-sites{grid-area:sites;}

/* CRM kanban mini */
.bnt-kan{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px;}
.bnt-kan-col{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);border-radius:8px;padding:8px 6px;min-height:140px;}
.bnt-kan-col h4{font-size:10px;color:#8a8aa0;margin:0 0 8px;text-transform:uppercase;letter-spacing:.08em;display:flex;justify-content:space-between;}
.bnt-kan-col h4 em{font-style:normal;color:#FFD60A;}
.bnt-card{background:#111118;border:1px solid rgba(255,255,255,.06);border-left:2px solid #1974d2;border-radius:6px;padding:6px 7px;margin-bottom:6px;font-size:10px;color:#c8c8d4;}
.bnt-card b{color:#fff;display:block;font-size:11px;margin-bottom:2px;}
.bnt-card em{color:#FFD60A;font-style:normal;}
.bnt-kan-col:nth-child(2) .bnt-card{border-left-color:#FFD60A;}
.bnt-kan-col:nth-child(3) .bnt-card{border-left-color:#50c878;}

/* Call log */
.bnt-call{display:flex;flex-direction:column;gap:6px;}
.bnt-call-row{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;padding:6px 8px;background:rgba(255,255,255,.02);border-radius:6px;font-size:10px;}
.bnt-call-ic{width:22px;height:22px;border-radius:50%;background:rgba(25,116,210,.15);color:#1974d2;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;}
.bnt-call-ic.out{background:rgba(255,214,10,.12);color:#FFD60A;}
.bnt-call-ic.miss{background:rgba(230,60,60,.12);color:#e63c3c;}
.bnt-call-row b{color:#fff;display:block;font-size:11px;}
.bnt-call-row span{color:#8a8aa0;}
.bnt-call-dur{color:#FFD60A;font-family:var(--font-mono);}

/* Tasks */
.bnt-task{display:flex;flex-direction:column;gap:5px;}
.bnt-task-row{display:grid;grid-template-columns:14px 1fr auto;gap:8px;align-items:center;font-size:10px;padding:5px 0;border-bottom:1px dashed rgba(255,255,255,.06);}
.bnt-task-row:last-child{border:0;}
.bnt-chk{width:12px;height:12px;border:1px solid rgba(255,255,255,.2);border-radius:3px;}
.bnt-chk.on{background:#FFD60A;border-color:#FFD60A;}
.bnt-task-row b{color:#c8c8d4;font-weight:500;}
.bnt-task-row.done b{color:#5a5a6a;text-decoration:line-through;}
.bnt-tag{font-size:9px;padding:2px 6px;border-radius:10px;background:rgba(25,116,210,.15);color:#1974d2;}
.bnt-tag.hi{background:rgba(230,60,60,.14);color:#ff6464;}
.bnt-tag.md{background:rgba(255,214,10,.12);color:#FFD60A;}

/* Chat */
.bnt-chat{display:flex;flex-direction:column;gap:5px;}
.bnt-msg{display:grid;grid-template-columns:22px 1fr;gap:8px;font-size:10px;}
.bnt-ava{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#1974d2,#0a3c70);display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:#fff;}
.bnt-ava.y{background:linear-gradient(135deg,#FFD60A,#8a6f00);color:#111;}
.bnt-msg b{color:#fff;font-size:10px;display:block;margin-bottom:1px;}
.bnt-msg b em{color:#8a8aa0;font-style:normal;font-weight:400;font-size:9px;margin-left:6px;}
.bnt-msg p{margin:0;color:#a8a8b8;line-height:1.3;}

/* Calendar */
.bnt-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;}
.bnt-cal-d{aspect-ratio:1;background:rgba(255,255,255,.02);border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:9px;color:#8a8aa0;position:relative;}
.bnt-cal-d.on{background:rgba(25,116,210,.2);color:#fff;}
.bnt-cal-d.today{background:#FFD60A;color:#111;font-weight:700;}
.bnt-cal-d.hd{color:#5a5a6a;font-size:8px;}

/* Sites */
.bnt-site{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.06);border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:6px;}
.bnt-site-bar{height:8px;background:rgba(25,116,210,.15);border-radius:4px;}
.bnt-site-bar.hero{height:34px;background:linear-gradient(135deg,rgba(25,116,210,.2),rgba(255,214,10,.1));position:relative;}
.bnt-site-bar.hero::after{content:"BUILDER";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:9px;color:#FFD60A;letter-spacing:.2em;}
.bnt-site-bar.w60{width:60%;}
.bnt-site-bar.w40{width:40%;}

/* Highlight bar */
.bnt-band{background:linear-gradient(90deg,#0a1828,#0a0a14,#181008);border-top:1px solid rgba(25,116,210,.2);border-bottom:1px solid rgba(255,214,10,.15);padding:42px 0;margin:30px 0 60px;}
.bnt-band-in{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:26px;align-items:center;}
.bnt-band h2{font-size:22px;margin:0;color:#fff;line-height:1.25;}
.bnt-band h2 b{color:#FFD60A;}
.bnt-stat{border-left:2px solid #1974d2;padding-left:14px;}
.bnt-stat b{display:block;font-size:22px;color:#FFD60A;font-weight:700;margin-bottom:3px;}
.bnt-stat span{font-size:11px;color:#8a8aa0;text-transform:uppercase;letter-spacing:.08em;}

/* Module stories */
.bnt-sec{padding:70px 0;border-top:1px solid rgba(255,255,255,.05);}
.bnt-sec-h{text-align:center;margin-bottom:48px;}
.bnt-sec-h h2{font-size:30px;margin:10px 0 8px;color:#fff;}
.bnt-sec-h p{color:#8a8aa0;font-size:14px;max-width:620px;margin:0 auto;}
.bnt-story{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-bottom:70px;}
.bnt-story:last-child{margin-bottom:0;}
.bnt-story.rev .bnt-story-mk{order:-1;}
.bnt-story-num{font-family:var(--font-mono);font-size:12px;color:#FFD60A;letter-spacing:.15em;margin-bottom:10px;}
.bnt-story h3{font-size:24px;color:#fff;margin:0 0 14px;}
.bnt-story p{color:#a8a8b8;font-size:14px;line-height:1.6;margin:0 0 18px;}
.bnt-feat{list-style:none;padding:0;margin:0;display:grid;gap:10px;}
.bnt-feat li{display:grid;grid-template-columns:18px 1fr;gap:10px;font-size:13px;color:#c8c8d4;align-items:start;}
.bnt-feat li::before{content:"→";color:#1974d2;font-weight:700;}
.bnt-story-mk{background:linear-gradient(180deg,#0d0d16,#08080f);border:1px solid rgba(255,255,255,.07);border-radius:16px;padding:20px;min-height:320px;}

/* Softphone mockup */
.bnt-phone{max-width:260px;margin:0 auto;background:#111118;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:16px;}
.bnt-phone-disp{background:#050509;border-radius:8px;padding:18px 14px;text-align:center;margin-bottom:14px;border:1px solid rgba(25,116,210,.2);}
.bnt-phone-disp .n{font-size:20px;color:#fff;letter-spacing:.05em;}
.bnt-phone-disp .s{font-size:10px;color:#FFD60A;text-transform:uppercase;letter-spacing:.15em;margin-top:4px;}
.bnt-dial{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.bnt-dial b{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:6px;padding:10px 0;text-align:center;font-size:14px;color:#c8c8d4;font-weight:500;}

/* Gantt mini */
.bnt-gantt{display:flex;flex-direction:column;gap:8px;}
.bnt-gantt-row{display:grid;grid-template-columns:90px 1fr;gap:10px;align-items:center;font-size:11px;}
.bnt-gantt-row span{color:#8a8aa0;}
.bnt-gantt-bar{height:14px;border-radius:3px;background:linear-gradient(90deg,#1974d2,#2a8be0);}
.bnt-gantt-bar.y{background:linear-gradient(90deg,#FFD60A,#c9a800);}
.bnt-gantt-bar.g{background:linear-gradient(90deg,#50c878,#2e8d4a);}

/* Doc mockup */
.bnt-doc{background:#f5f5f8;color:#111;padding:18px;border-radius:6px;}
.bnt-doc h4{font-size:14px;margin:0 0 10px;color:#111;}
.bnt-doc .l{height:6px;background:#ddd;border-radius:2px;margin:5px 0;}
.bnt-doc .l.s{width:70%;}
.bnt-doc .l.t{width:50%;background:#1974d2;}

/* Vs table */
.bnt-vs{overflow-x:auto;}
.bnt-vs table{width:100%;border-collapse:collapse;font-size:13px;min-width:560px;}
.bnt-vs th,.bnt-vs td{padding:14px 16px;text-align:left;border-bottom:1px solid rgba(255,255,255,.06);}
.bnt-vs thead th{background:rgba(25,116,210,.08);color:#FFD60A;font-size:11px;text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid rgba(255,214,10,.2);}
.bnt-vs tbody td:first-child{color:#8a8aa0;font-size:12px;text-transform:uppercase;letter-spacing:.06em;}
.bnt-vs .ok{color:#50c878;font-weight:700;}
.bnt-vs .no{color:#e63c3c;font-weight:700;}
.bnt-vs .mid{color:#FFD60A;}

/* Escenarios */
.bnt-esc{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.bnt-esc-card{background:linear-gradient(180deg,#0c0c14,#08080f);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:22px;}
.bnt-esc-card:hover{border-color:rgba(255,214,10,.3);}
.bnt-esc-card h3{font-size:15px;color:#fff;margin:0 0 4px;}
.bnt-esc-card .size{font-size:11px;color:#FFD60A;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em;margin-bottom:14px;display:block;}
.bnt-esc-card p{color:#a8a8b8;font-size:12px;line-height:1.5;margin:0 0 12px;}
.bnt-esc-mods{display:flex;flex-wrap:wrap;gap:5px;}
.bnt-esc-mods span{font-size:10px;padding:3px 8px;background:rgba(25,116,210,.12);color:#6ab0ee;border-radius:10px;border:1px solid rgba(25,116,210,.2);}

/* Fases timeline */
.bnt-timeline{display:grid;grid-template-columns:repeat(6,1fr);gap:0;position:relative;}
.bnt-timeline::before{content:"";position:absolute;top:30px;left:40px;right:40px;height:2px;background:linear-gradient(90deg,#1974d2,#FFD60A);}
.bnt-phase{text-align:center;position:relative;padding:0 8px;}
.bnt-phase-dot{width:60px;height:60px;border-radius:50%;background:#0c0c14;border:2px solid #1974d2;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;color:#FFD60A;margin:0 auto 14px;position:relative;z-index:2;}
.bnt-phase h4{font-size:13px;color:#fff;margin:0 0 6px;}
.bnt-phase p{font-size:11px;color:#8a8aa0;margin:0;line-height:1.4;}
.bnt-phase .w{font-size:10px;color:#FFD60A;font-family:var(--font-mono);display:block;margin-top:8px;}

/* Integraciones */
.bnt-int{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;}
.bnt-int-cell{aspect-ratio:1.4/1;background:linear-gradient(180deg,#0c0c14,#08080f);border:1px solid rgba(255,255,255,.07);border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;transition:border-color .2s;}
.bnt-int-cell:hover{border-color:rgba(255,214,10,.3);}
.bnt-int-cell b{font-size:14px;color:#fff;}
.bnt-int-cell span{font-size:9px;color:#8a8aa0;text-transform:uppercase;letter-spacing:.08em;}

/* Pricing */
.bnt-price{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.bnt-plan{background:linear-gradient(180deg,#0c0c14,#08080f);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:26px 22px;position:relative;}
.bnt-plan.hi{border-color:#FFD60A;background:linear-gradient(180deg,#1a1408,#0a0a14);}
.bnt-plan.hi::before{content:"DIFERENCIAL OLPA";position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:#FFD60A;color:#111;font-size:9px;font-weight:700;padding:4px 10px;border-radius:10px;letter-spacing:.1em;}
.bnt-plan h3{font-size:14px;color:#8a8aa0;margin:0 0 8px;text-transform:uppercase;letter-spacing:.1em;}
.bnt-plan .pr{font-size:26px;color:#fff;font-weight:700;}
.bnt-plan .pr em{font-size:12px;color:#FFD60A;font-style:normal;display:block;margin-top:2px;font-weight:400;}
.bnt-plan ul{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px;}
.bnt-plan li{font-size:12px;color:#c8c8d4;padding-left:16px;position:relative;}
.bnt-plan li::before{content:"•";color:#1974d2;position:absolute;left:0;}

/* Caso */
.bnt-caso{background:linear-gradient(135deg,#0a1828,#0a0a14);border:1px solid rgba(25,116,210,.2);border-radius:16px;padding:44px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
.bnt-caso-lbl{font-family:var(--font-mono);font-size:11px;color:#FFD60A;letter-spacing:.14em;text-transform:uppercase;margin-bottom:12px;}
.bnt-caso h3{font-size:22px;color:#fff;margin:0 0 14px;}
.bnt-caso blockquote{font-size:15px;color:#c8c8d4;font-style:italic;line-height:1.55;margin:0;padding-left:16px;border-left:2px solid #FFD60A;}
.bnt-caso-m{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.bnt-caso-m div{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:18px 14px;text-align:center;}
.bnt-caso-m b{display:block;font-size:24px;color:#FFD60A;font-weight:700;}
.bnt-caso-m span{font-size:10px;color:#8a8aa0;text-transform:uppercase;letter-spacing:.08em;margin-top:4px;display:block;}

/* Demo video */
.bnt-demo{max-width:880px;margin:0 auto;}
.bnt-demo-frame{aspect-ratio:16/9;border-radius:14px;overflow:hidden;border:1px solid rgba(255,255,255,.08);background:#000;}
.bnt-demo-frame iframe{width:100%;height:100%;border:0;}

/* Recursos */
.bnt-res{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.bnt-res a{display:block;background:linear-gradient(180deg,#0c0c14,#08080f);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:20px;text-decoration:none;color:inherit;transition:all .25s;}
.bnt-res a:hover{border-color:#FFD60A;transform:translateY(-2px);}
.bnt-res b{display:block;font-size:14px;color:#fff;margin-bottom:4px;}
.bnt-res span{font-size:11px;color:#8a8aa0;}
.bnt-res em{display:block;font-size:10px;color:#1974d2;font-style:normal;margin-top:10px;font-family:var(--font-mono);letter-spacing:.1em;}

/* FAQ */
.bnt-faq{max-width:820px;margin:0 auto;display:grid;gap:10px;}
.bnt-faq details{background:linear-gradient(180deg,#0c0c14,#08080f);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:16px 20px;}
.bnt-faq details[open]{border-color:rgba(255,214,10,.25);}
.bnt-faq summary{cursor:pointer;font-size:14px;color:#fff;font-weight:500;list-style:none;}
.bnt-faq summary::-webkit-details-marker{display:none;}
.bnt-faq summary::after{content:"+";float:right;color:#FFD60A;font-size:18px;}
.bnt-faq details[open] summary::after{content:"−";}
.bnt-faq p{color:#a8a8b8;font-size:13px;line-height:1.55;margin:14px 0 0;}

/* CTA */
.bnt-cta{text-align:center;padding:70px 0 90px;background:linear-gradient(180deg,transparent,rgba(25,116,210,.06));}
.bnt-cta h2{font-size:32px;color:#fff;margin:0 0 14px;}
.bnt-cta p{color:#a8a8b8;max-width:540px;margin:0 auto 28px;font-size:14px;}
.bnt-cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.bnt-btn{padding:14px 28px;border-radius:10px;text-decoration:none;font-size:14px;font-weight:600;display:inline-block;transition:all .25s;}
.bnt-btn.p{background:#FFD60A;color:#111;}
.bnt-btn.p:hover{background:#fff;}
.bnt-btn.s{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.2);}
.bnt-btn.s:hover{border-color:#FFD60A;color:#FFD60A;}

/* Responsive */
@media(max-width:960px){
  .bnt-bento{grid-template-columns:repeat(2,1fr);grid-template-rows:auto;grid-template-areas:"crm crm" "crm crm" "call tasks" "chat cal" "sites sites";}
  .bnt-band-in,.bnt-esc,.bnt-res,.bnt-price{grid-template-columns:repeat(2,1fr);}
  .bnt-story,.bnt-caso{grid-template-columns:1fr;gap:24px;}
  .bnt-story.rev .bnt-story-mk{order:0;}
  .bnt-int{grid-template-columns:repeat(3,1fr);}
  .bnt-timeline{grid-template-columns:repeat(2,1fr);gap:24px;}
  .bnt-timeline::before{display:none;}
  .bnt-kan{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:560px){
  .bnt-bento{grid-template-columns:1fr;grid-template-areas:"crm" "call" "tasks" "chat" "cal" "sites";}
  .bnt-band-in,.bnt-esc,.bnt-res,.bnt-price,.bnt-int{grid-template-columns:1fr;}
  .bnt-h1{font-size:26px;}
  .bnt-caso{padding:26px;}
  .bnt-caso-m{grid-template-columns:1fr;}
}

/* Bento — hover motion + detail */
.bnt-tile::after{content:"";position:absolute;inset:0;background:radial-gradient(80% 60% at 50% 0%,rgba(25,116,210,.08),transparent 70%);opacity:0;transition:opacity .3s;pointer-events:none;}
.bnt-tile:hover::after{opacity:1;}
.bnt-tile-live{display:inline-flex;align-items:center;gap:5px;font-size:9px;color:#50c878;letter-spacing:.12em;text-transform:uppercase;}
.bnt-tile-live::before{content:"";width:6px;height:6px;border-radius:50%;background:#50c878;box-shadow:0 0 6px #50c878;animation:bntpulse 2s infinite;}
@keyframes bntpulse{0%,100%{opacity:1}50%{opacity:.3}}

/* Kanban hover card lift */
.bnt-card{cursor:default;transition:transform .2s,border-color .2s;}
.bnt-card:hover{transform:translateX(2px);}

/* Call row hover */
.bnt-call-row{transition:background .2s;}
.bnt-call-row:hover{background:rgba(25,116,210,.06);}

/* Stat numbers animated gradient */
.bnt-stat b{background:linear-gradient(90deg,#FFD60A,#ffb700);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* Story mockup inner padding helpers */
.bnt-story-mk h5{font-size:11px;color:#8a8aa0;text-transform:uppercase;letter-spacing:.1em;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.05);}
.bnt-story-mk .row{display:flex;justify-content:space-between;font-size:12px;padding:8px 0;border-bottom:1px dashed rgba(255,255,255,.05);}
.bnt-story-mk .row:last-child{border:0;}
.bnt-story-mk .row span{color:#8a8aa0;}
.bnt-story-mk .row b{color:#fff;}
.bnt-story-mk .row b.y{color:#FFD60A;}

/* Pipeline columns inside CRM story */
.bnt-pipe{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;}
.bnt-pipe-col{background:rgba(255,255,255,.02);border-radius:6px;padding:8px 5px;text-align:center;border-top:2px solid #1974d2;}
.bnt-pipe-col b{display:block;font-size:10px;color:#fff;margin-bottom:2px;}
.bnt-pipe-col span{font-size:9px;color:#8a8aa0;}
.bnt-pipe-col em{display:block;font-size:11px;color:#FFD60A;font-style:normal;margin-top:6px;font-weight:700;}

/* Sitebuilder mockup bars */
.bnt-builder{background:#0a0a12;border:1px solid rgba(255,255,255,.07);border-radius:8px;padding:10px;}
.bnt-builder-h{height:10px;background:rgba(25,116,210,.3);border-radius:3px;margin-bottom:10px;}
.bnt-builder-hero{height:60px;background:linear-gradient(135deg,#1974d2,#0a3c70);border-radius:4px;margin-bottom:8px;display:flex;align-items:center;justify-content:center;color:#FFD60A;font-size:11px;letter-spacing:.2em;}
.bnt-builder-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.bnt-builder-cols div{height:30px;background:rgba(255,255,255,.05);border-radius:3px;}

/* Phase dot numbers tinted */
.bnt-phase:nth-child(2n) .bnt-phase-dot{border-color:#FFD60A;}
.bnt-phase:nth-child(1) .bnt-phase-dot{background:#1974d2;color:#fff;border-color:#1974d2;}
.bnt-phase:last-child .bnt-phase-dot{background:#FFD60A;color:#111;border-color:#FFD60A;}

/* Integrations highlight dot */
.bnt-int-cell b{position:relative;}
.bnt-int-cell b::after{content:"";display:block;width:24px;height:2px;background:#1974d2;margin:6px auto 0;border-radius:2px;}

/* Pricing hi glow */
.bnt-plan.hi{box-shadow:0 0 40px rgba(255,214,10,.08);}

/* Section container */
.bnt-wrap{max-width:1180px;margin:0 auto;padding:0 24px;}
@media(max-width:720px){.bnt-wrap{padding:0 18px;}}

/* Extra bnt polish */
.bnt-sec-eyebrow{display:inline-block;font-family:var(--font-mono);font-size:11px;color:#FFD60A;letter-spacing:.15em;text-transform:uppercase;padding:4px 12px;border:1px solid rgba(255,214,10,.2);border-radius:20px;margin-bottom:10px;}
.bnt-divider{height:1px;background:linear-gradient(90deg,transparent,rgba(255,214,10,.25),transparent);margin:60px 0;}
.bnt-whats{background:#25d366;color:#fff !important;}
.bnt-whats:hover{background:#1fb954;}
.bnt-vs tbody tr:hover{background:rgba(25,116,210,.04);}
.bnt-vs tbody td{color:#c8c8d4;}
.bnt-esc-card b{color:#FFD60A;}
.bnt-cal-legend{display:flex;gap:10px;margin-top:8px;font-size:9px;color:#8a8aa0;}
.bnt-cal-legend span{display:inline-flex;align-items:center;gap:4px;}
.bnt-cal-legend i{width:8px;height:8px;border-radius:2px;font-style:normal;}
.bnt-cal-legend i.m{background:#1974d2;}
.bnt-cal-legend i.y{background:#FFD60A;}
.bnt-feat-hi{color:#FFD60A;font-weight:600;}
.bnt-chat-input{margin-top:10px;padding:8px 10px;background:rgba(255,255,255,.03);border-radius:6px;font-size:10px;color:#5a5a6a;border:1px solid rgba(255,255,255,.05);}
.bnt-bento .bnt-t-crm h3{font-size:15px;}
.bnt-story-mk-label{font-size:9px;color:#5a5a6a;letter-spacing:.14em;text-transform:uppercase;margin-top:14px;text-align:right;}

/* Motion reduced */
@media(prefers-reduced-motion:reduce){.bnt-tile,.bnt-card,.bnt-res a,.bnt-btn{transition:none;}.bnt-tile-live::before{animation:none;}}
/* Print */
@media print{.bnt-page{background:#fff;color:#111;}.bnt-tile,.bnt-plan,.bnt-esc-card{border-color:#ddd;background:#fff;}}
/* Focus visible a11y */
.bnt-btn:focus-visible,.bnt-res a:focus-visible,.bnt-faq summary:focus-visible{outline:2px solid #FFD60A;outline-offset:3px;}
/* Small screens — timeline vertical */
@media(max-width:720px){
  .bnt-timeline{grid-template-columns:1fr;gap:16px;}
  .bnt-phase{text-align:left;display:grid;grid-template-columns:60px 1fr;gap:14px;align-items:center;}
  .bnt-phase-dot{margin:0;}
}
/* Glow accents */
.bnt-t-crm{box-shadow:inset 0 0 0 1px rgba(25,116,210,.12);}
.bnt-t-crm:hover{box-shadow:inset 0 0 0 1px rgba(255,214,10,.3);}

/* ============================================================
   GOOGLE ADS · DASHBOARD TAKEOVER (.dash-*)
   Analytics dashboard skeleton — Looker Studio fullscreen vibe
   ============================================================ */
.dash-body{background:#050509;color:#e8e8ee;font-family:'Inter',system-ui,sans-serif;}
.dash-body section{box-sizing:border-box;}
.dash-body *,.dash-body *::before,.dash-body *::after{box-sizing:border-box;}

/* ---------- top bar ---------- */
.dash-topbar{position:relative;background:linear-gradient(180deg,#0b0b12 0%,#07070c 100%);border-bottom:1px solid #1d1d28;padding:18px 40px 0;}
.dash-topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-bottom:16px;}
.dash-topbar-left{display:flex;align-items:center;gap:14px;}
.dash-logo-dot{width:34px;height:34px;border-radius:8px;background:conic-gradient(from 45deg,#4285f4,#FFD60A,#0d7f3e,#c5221f,#4285f4);box-shadow:0 0 0 1px #1d1d28, 0 0 24px rgba(66,133,244,0.3);}
.dash-topbar-title{font-family:'JetBrains Mono',monospace;font-size:15px;font-weight:500;color:#f4f4f8;letter-spacing:-0.2px;}
.dash-topbar-sub{font-family:'JetBrains Mono',monospace;font-size:11px;color:#6c6c7a;margin-top:3px;letter-spacing:0.3px;}
.dash-topbar-right{display:flex;align-items:center;gap:14px;}
.dash-datepicker{display:flex;align-items:center;gap:10px;background:#10101a;border:1px solid #22222e;padding:8px 14px;border-radius:6px;}
.dash-datepicker-ico{font-family:'JetBrains Mono',monospace;font-size:10px;color:#4285f4;background:rgba(66,133,244,0.08);padding:3px 6px;border-radius:3px;letter-spacing:0.5px;}
.dash-datepicker-main{font-family:'JetBrains Mono',monospace;font-size:12px;color:#f4f4f8;font-weight:500;}
.dash-datepicker-cmp{font-family:'JetBrains Mono',monospace;font-size:10px;color:#6c6c7a;}
.dash-live{display:flex;align-items:center;gap:8px;background:rgba(13,127,62,0.08);border:1px solid rgba(13,127,62,0.4);padding:7px 12px;border-radius:6px;font-family:'JetBrains Mono',monospace;font-size:10px;color:#0d7f3e;letter-spacing:1.2px;font-weight:700;}
.dash-live-dot{width:7px;height:7px;border-radius:50%;background:#0d7f3e;box-shadow:0 0 8px #0d7f3e;animation:dashPulse 2s infinite;}
@keyframes dashPulse{0%,100%{opacity:1;}50%{opacity:0.4;}}
.dash-tabs{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;}
.dash-tabs::-webkit-scrollbar{display:none;}
.dash-tab{font-family:'JetBrains Mono',monospace;font-size:12px;color:#8a8a96;padding:14px 22px;cursor:pointer;border-bottom:2px solid transparent;white-space:nowrap;letter-spacing:0.2px;transition:color .2s,border-color .2s;}
.dash-tab:hover{color:#f4f4f8;}
.dash-tab-on{color:#4285f4;border-bottom-color:#4285f4;}

/* ---------- hero KPI row ---------- */
.dash-kpi-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#1d1d28;padding:1px;border-bottom:1px solid #1d1d28;}
.dash-kpi{background:#0a0a12;padding:32px 36px 28px;position:relative;min-height:200px;display:flex;flex-direction:column;}
.dash-kpi-label{font-family:'JetBrains Mono',monospace;font-size:11px;color:#6c6c7a;letter-spacing:1.4px;text-transform:uppercase;font-weight:500;}
.dash-kpi-value{font-family:'JetBrains Mono',monospace;font-size:54px;font-weight:700;color:#f4f4f8;margin-top:14px;letter-spacing:-2px;line-height:1;}
.dash-kpi-delta{font-family:'JetBrains Mono',monospace;font-size:12px;margin-top:10px;font-weight:500;}
.dash-up{color:#0d7f3e;}
.dash-down{color:#c5221f;}
.dash-spark{margin-top:auto;width:100%;height:40px;}

/* ---------- breadcrumb ---------- */
.dash-breadcrumb{padding:14px 40px;font-family:'JetBrains Mono',monospace;font-size:11px;color:#6c6c7a;border-bottom:1px solid #14141e;letter-spacing:0.3px;}
.dash-breadcrumb a{color:#8a8a96;text-decoration:none;transition:color .2s;}
.dash-breadcrumb a:hover{color:#FFD60A;}
.dash-bc-sep{color:#3a3a46;margin:0 8px;}
.dash-bc-current{color:#FFD60A;}

/* ---------- title block ---------- */
.dash-title-block{padding:72px 40px 60px;max-width:1240px;}
.dash-title-eyebrow{font-family:'JetBrains Mono',monospace;font-size:11px;color:#4285f4;letter-spacing:1.6px;text-transform:uppercase;margin-bottom:24px;}
.dash-h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(48px,7vw,108px);font-weight:700;line-height:0.92;color:#f4f4f8;letter-spacing:-3px;margin:0 0 28px;}
.dash-h1-sep{color:#FFD60A;}
.dash-subtitle{font-size:19px;line-height:1.55;color:#a0a0ac;max-width:720px;margin:0 0 40px;}

.dash-callout{background:#0a0a12;border:1px solid #1d1d28;border-left:3px solid #FFD60A;padding:22px 28px;max-width:820px;border-radius:3px;}
.dash-callout-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.dash-callout-tag{font-family:'JetBrains Mono',monospace;font-size:10px;color:#FFD60A;letter-spacing:1.4px;background:rgba(255,214,10,0.08);padding:4px 9px;border-radius:3px;}
.dash-callout-meta{font-family:'JetBrains Mono',monospace;font-size:10px;color:#6c6c7a;}
.dash-callout-body{margin:0;color:#d4d4dc;line-height:1.6;font-size:15px;}
.dash-callout-body strong{color:#FFD60A;}

/* ---------- section scaffold ---------- */
.dash-section{padding:56px 40px;border-top:1px solid #14141e;max-width:100%;}
.dash-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:34px;padding-bottom:18px;border-bottom:1px solid #1d1d28;flex-wrap:wrap;}
.dash-section-tag{font-family:'JetBrains Mono',monospace;font-size:11px;color:#4285f4;letter-spacing:1.2px;margin-bottom:6px;}
.dash-section-title{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:700;color:#f4f4f8;margin:0;letter-spacing:-0.8px;}
.dash-section-meta{font-family:'JetBrains Mono',monospace;font-size:11px;color:#6c6c7a;letter-spacing:0.3px;}

/* ---------- campaign table ---------- */
.dash-campaign-table{border:1px solid #1d1d28;border-radius:4px;overflow:hidden;background:#0a0a12;}
.dash-campaign-thead{display:grid;grid-template-columns:110px 1.3fr 2fr 140px 1.5fr;padding:14px 20px;background:#10101a;font-family:'JetBrains Mono',monospace;font-size:10px;text-transform:uppercase;color:#6c6c7a;letter-spacing:1.2px;border-bottom:1px solid #1d1d28;}
.dash-campaign-row{display:grid;grid-template-columns:110px 1.3fr 2fr 140px 1.5fr;padding:22px 20px;border-bottom:1px solid #14141e;align-items:center;gap:16px;transition:background .2s;}
.dash-campaign-row:last-child{border-bottom:none;}
.dash-campaign-row:hover{background:#0d0d16;}
.dash-st-on,.dash-st-paused{font-family:'JetBrains Mono',monospace;font-size:10px;padding:4px 9px;border-radius:3px;letter-spacing:1.1px;font-weight:600;display:inline-block;width:fit-content;}
.dash-st-on{background:rgba(13,127,62,0.1);color:#0d7f3e;border:1px solid rgba(13,127,62,0.3);}
.dash-st-paused{background:rgba(197,34,31,0.1);color:#c5221f;border:1px solid rgba(197,34,31,0.3);}
.dash-camp-name{display:flex;align-items:center;gap:12px;}
.dash-camp-thumb{width:42px;height:42px;border-radius:4px;background:linear-gradient(135deg,#4285f4 0%,#FFD60A 100%);display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-weight:700;color:#050509;font-size:15px;}
.dash-camp-name strong{display:block;font-family:'Space Grotesk',sans-serif;font-size:16px;color:#f4f4f8;}
.dash-camp-name em{display:block;font-family:'JetBrains Mono',monospace;font-size:10px;color:#6c6c7a;font-style:normal;margin-top:2px;}
.dash-campaign-row p{margin:0;color:#a0a0ac;font-size:13px;line-height:1.5;}
.dash-camp-cpa{font-family:'JetBrains Mono',monospace;font-size:13px;color:#FFD60A;font-weight:600;}
.dash-camp-when{color:#8a8a96;font-size:12px;line-height:1.5;}

/* ---------- funnel ---------- */
.dash-funnel{background:#0a0a12;border:1px solid #1d1d28;border-radius:4px;padding:36px;}
.dash-funnel-svg{width:100%;height:220px;display:block;margin-bottom:20px;}
.dash-funnel-stages{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;}
.dash-stage{text-align:center;padding:12px 8px;border-left:1px solid #1d1d28;}
.dash-stage:first-child{border-left:none;}
.dash-stage-k{font-family:'JetBrains Mono',monospace;font-size:10px;color:#4285f4;letter-spacing:1.2px;}
.dash-stage-lbl{font-family:'Space Grotesk',sans-serif;font-size:14px;color:#a0a0ac;margin:6px 0 10px;text-transform:uppercase;letter-spacing:0.8px;}
.dash-stage-n{font-family:'JetBrains Mono',monospace;font-size:26px;font-weight:700;color:#f4f4f8;letter-spacing:-1px;}
.dash-stage-d{font-family:'JetBrains Mono',monospace;font-size:11px;color:#6c6c7a;margin-top:6px;}
.dash-down-s{color:#c5221f;}
.dash-funnel-note{margin:24px 0 0;color:#8a8a96;font-size:13px;line-height:1.6;max-width:780px;}

/* ---------- A/B experiment ---------- */
.dash-ab{display:grid;grid-template-columns:1fr 60px 1fr;gap:20px;align-items:stretch;margin-bottom:24px;}
.dash-ab-variant{background:#0a0a12;border:1px solid #1d1d28;border-radius:4px;padding:24px;display:flex;flex-direction:column;gap:18px;}
.dash-ab-loser{opacity:0.72;}
.dash-ab-winner{border-color:rgba(13,127,62,0.6);box-shadow:0 0 0 1px rgba(13,127,62,0.25),0 0 40px rgba(13,127,62,0.08);}
.dash-ab-head{display:flex;align-items:center;gap:12px;}
.dash-ab-letter{width:34px;height:34px;border-radius:50%;background:#14141e;color:#FFD60A;display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:16px;border:1px solid #22222e;}
.dash-ab-state{font-family:'JetBrains Mono',monospace;font-size:10px;color:#6c6c7a;letter-spacing:1.1px;text-transform:uppercase;}
.dash-ab-win{color:#0d7f3e;}
.dash-ab-ad{background:#050509;border:1px solid #14141e;padding:16px;border-radius:3px;}
.dash-ad-url{font-family:'JetBrains Mono',monospace;font-size:11px;color:#8a8a96;margin-bottom:6px;display:flex;gap:10px;align-items:center;}
.dash-ad-url span{background:rgba(255,214,10,0.1);color:#FFD60A;padding:1px 5px;border-radius:2px;font-size:9px;text-transform:uppercase;letter-spacing:0.8px;}
.dash-ad-h{font-family:'Space Grotesk',sans-serif;font-size:17px;color:#4285f4;margin-bottom:6px;line-height:1.3;}
.dash-ad-d{font-size:12px;color:#a0a0ac;line-height:1.5;}
.dash-ab-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.dash-ab-metrics div{background:#050509;border:1px solid #14141e;padding:10px;text-align:center;border-radius:3px;}
.dash-ab-metrics span{font-family:'JetBrains Mono',monospace;font-size:9px;color:#6c6c7a;letter-spacing:1px;text-transform:uppercase;display:block;}
.dash-ab-metrics strong{font-family:'JetBrains Mono',monospace;font-size:18px;color:#f4f4f8;display:block;margin-top:3px;}
.dash-ab-vs{display:flex;align-items:center;justify-content:center;font-family:'Space Grotesk',sans-serif;font-weight:700;color:#FFD60A;font-size:20px;letter-spacing:1px;}

.dash-ab-table{border:1px solid #1d1d28;background:#0a0a12;border-radius:4px;overflow:hidden;}
.dash-abt-row{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;padding:14px 20px;border-bottom:1px solid #14141e;font-family:'JetBrains Mono',monospace;font-size:13px;color:#d4d4dc;}
.dash-abt-row:last-child{border-bottom:none;}
.dash-abt-head{background:#10101a;font-size:10px;color:#6c6c7a;text-transform:uppercase;letter-spacing:1.2px;}
.dash-abt-w{color:#0d7f3e;font-weight:600;}

/* ---------- phases ---------- */
.dash-phases{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#1d1d28;border:1px solid #1d1d28;border-radius:4px;overflow:hidden;}
.dash-phase{background:#0a0a12;padding:26px;position:relative;transition:background .2s;}
.dash-phase:hover{background:#0d0d16;}
.dash-phase-num{font-family:'JetBrains Mono',monospace;font-size:11px;color:#4285f4;letter-spacing:1.2px;}
.dash-phase-ico{width:44px;height:44px;margin:12px 0;}
.dash-phase h3{font-family:'Space Grotesk',sans-serif;font-size:18px;margin:4px 0 10px;color:#f4f4f8;}
.dash-phase p{margin:0 0 18px;font-size:13px;line-height:1.55;color:#9696a3;}
.dash-phase-chart{width:100%;height:30px;display:block;}

/* ---------- invoice ---------- */
.dash-invoice{background:#0a0a12;border:1px solid #1d1d28;border-radius:4px;overflow:hidden;}
.dash-inv-head{display:grid;grid-template-columns:220px 1fr 200px;padding:14px 24px;background:#10101a;font-family:'JetBrains Mono',monospace;font-size:10px;color:#6c6c7a;text-transform:uppercase;letter-spacing:1.2px;border-bottom:1px solid #1d1d28;}
.dash-inv-right{text-align:right;}
.dash-inv-row{display:grid;grid-template-columns:220px 1fr 200px;padding:24px;border-bottom:1px solid #14141e;align-items:center;gap:20px;}
.dash-inv-lbl{font-family:'Space Grotesk',sans-serif;font-size:17px;color:#FFD60A;font-weight:600;}
.dash-inv-row p{margin:0;color:#a0a0ac;font-size:13px;line-height:1.55;}
.dash-inv-amt{font-family:'JetBrains Mono',monospace;font-size:18px;color:#f4f4f8;text-align:right;font-weight:600;}
.dash-inv-amt em{display:block;font-size:10px;color:#6c6c7a;font-style:normal;margin-top:3px;}
.dash-inv-total{display:flex;justify-content:space-between;align-items:center;padding:22px 24px;background:#10101a;border-top:2px solid #FFD60A;}
.dash-inv-total span:first-child{font-family:'JetBrains Mono',monospace;font-size:11px;color:#6c6c7a;text-transform:uppercase;letter-spacing:1.2px;}
.dash-inv-total-amt{font-family:'JetBrains Mono',monospace;font-size:24px;color:#FFD60A;font-weight:700;letter-spacing:-0.8px;}
.dash-inv-foot{margin:18px 0 0;padding:0 24px 24px;color:#8a8a96;font-size:12px;line-height:1.55;}

/* ---------- vs ---------- */
.dash-vs{border:1px solid #1d1d28;border-radius:4px;overflow:hidden;background:#0a0a12;}
.dash-vs-head{display:grid;grid-template-columns:1.6fr 1fr 1fr;padding:14px 20px;background:#10101a;font-family:'JetBrains Mono',monospace;font-size:10px;color:#6c6c7a;text-transform:uppercase;letter-spacing:1.2px;border-bottom:1px solid #1d1d28;}
.dash-vs-row{display:grid;grid-template-columns:1.6fr 1fr 1fr;padding:18px 20px;border-bottom:1px solid #14141e;align-items:center;gap:16px;}
.dash-vs-row:last-child{border-bottom:none;}
.dash-vs-row span{font-size:13px;color:#a0a0ac;}
.dash-vs-row b{font-family:'JetBrains Mono',monospace;font-size:13px;color:#d4d4dc;font-weight:500;}
.dash-vs-win{color:#FFD60A !important;font-weight:700 !important;}
.dash-vs-note{margin:18px 0 0;color:#8a8a96;font-size:13px;line-height:1.6;}

/* ---------- case ---------- */
.dash-case-hero{display:grid;grid-template-columns:1.2fr 2fr;gap:24px;}
.dash-case-intro{background:#0a0a12;border:1px solid #1d1d28;padding:28px;border-radius:4px;}
.dash-case-id{font-family:'JetBrains Mono',monospace;font-size:10px;color:#4285f4;letter-spacing:1.2px;margin-bottom:14px;background:rgba(66,133,244,0.08);padding:5px 9px;border-radius:3px;display:inline-block;}
.dash-case-intro p{margin:0;font-size:14px;line-height:1.65;color:#a0a0ac;}
.dash-case-metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
.dash-case-m{background:#0a0a12;border:1px solid #1d1d28;padding:24px;border-radius:4px;position:relative;}
.dash-case-m::before{content:"";position:absolute;top:0;left:0;width:3px;height:100%;background:#FFD60A;}
.dash-case-m span{font-family:'JetBrains Mono',monospace;font-size:10px;color:#6c6c7a;letter-spacing:1.2px;text-transform:uppercase;}
.dash-case-m strong{font-family:'JetBrains Mono',monospace;font-size:42px;color:#f4f4f8;display:block;margin-top:6px;letter-spacing:-1.5px;line-height:1;}
.dash-case-m em{display:block;font-family:'JetBrains Mono',monospace;font-size:11px;color:#0d7f3e;margin-top:6px;font-style:normal;}

/* ---------- video ---------- */
.dash-video-wrap{background:#0a0a12;border:1px solid #1d1d28;border-radius:4px;padding:20px;}
.dash-video-frame{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;border:1px solid #14141e;border-radius:3px;background:#050509;}
.dash-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;}
.dash-video-note{margin:14px 0 0;font-family:'JetBrains Mono',monospace;font-size:11px;color:#6c6c7a;}

/* ---------- resources ---------- */
.dash-resources{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.dash-res{display:block;background:#0a0a12;border:1px solid #1d1d28;padding:22px;border-radius:4px;text-decoration:none;transition:border-color .2s,transform .2s;}
.dash-res:hover{border-color:#FFD60A;transform:translateY(-2px);}
.dash-res-dot{width:8px;height:8px;border-radius:50%;background:#4285f4;margin-bottom:14px;box-shadow:0 0 10px #4285f4;}
.dash-res-url{font-family:'JetBrains Mono',monospace;font-size:13px;color:#FFD60A;margin-bottom:8px;word-break:break-all;}
.dash-res-desc{font-size:12px;color:#8a8a96;line-height:1.5;}

/* ---------- faq ---------- */
.dash-faq{display:grid;gap:1px;background:#1d1d28;border:1px solid #1d1d28;border-radius:4px;overflow:hidden;}
.dash-faq-item{background:#0a0a12;padding:0;}
.dash-faq-item summary{list-style:none;cursor:pointer;padding:20px 24px;display:flex;justify-content:space-between;align-items:center;gap:16px;transition:background .2s;}
.dash-faq-item summary::-webkit-details-marker{display:none;}
.dash-faq-item summary:hover{background:#0d0d16;}
.dash-faq-q{font-family:'JetBrains Mono',monospace;font-size:13px;color:#f4f4f8;letter-spacing:0.2px;}
.dash-faq-tog{font-family:'JetBrains Mono',monospace;font-size:18px;color:#FFD60A;transition:transform .2s;}
.dash-faq-item[open] .dash-faq-tog{transform:rotate(45deg);}
.dash-faq-item p{margin:0;padding:0 24px 22px;color:#a0a0ac;font-size:13px;line-height:1.65;max-width:820px;}

/* ---------- cta ---------- */
.dash-cta{padding:64px 40px 80px;border-top:1px solid #14141e;}
.dash-cta-inner{display:grid;grid-template-columns:1fr 1.3fr;gap:40px;background:linear-gradient(135deg,#0a0a12 0%,#0d0d18 100%);border:1px solid #1d1d28;border-radius:6px;padding:48px;align-items:center;}
.dash-cta-tag{font-family:'JetBrains Mono',monospace;font-size:10px;color:#4285f4;letter-spacing:1.4px;text-transform:uppercase;background:rgba(66,133,244,0.08);padding:5px 10px;border-radius:3px;display:inline-block;margin-bottom:20px;}
.dash-cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px;}
.dash-cta-mini{background:#050509;border:1px solid #14141e;padding:18px;border-radius:3px;}
.dash-cta-mini span{font-family:'JetBrains Mono',monospace;font-size:10px;color:#6c6c7a;letter-spacing:1.1px;text-transform:uppercase;display:block;}
.dash-cta-mini strong{font-family:'JetBrains Mono',monospace;font-size:28px;color:#FFD60A;display:block;margin-top:6px;}
.dash-cta-line{height:3px;background:repeating-linear-gradient(90deg,#FFD60A 0 12px,transparent 12px 20px);border-radius:2px;}
.dash-cta-copy h2{font-family:'Space Grotesk',sans-serif;font-size:36px;color:#f4f4f8;margin:0 0 16px;letter-spacing:-1px;line-height:1.1;}
.dash-cta-copy p{font-size:15px;line-height:1.6;color:#a0a0ac;margin:0 0 28px;}
.dash-cta-actions{display:flex;gap:12px;flex-wrap:wrap;}
.dash-cta-btn{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:0.8px;padding:14px 22px;border-radius:4px;text-decoration:none;font-weight:600;transition:transform .2s,background .2s;text-transform:uppercase;}
.dash-cta-btn-main{background:#FFD60A;color:#050509;}
.dash-cta-btn-main:hover{transform:translateY(-2px);background:#fde047;}
.dash-cta-btn-ghost{background:transparent;color:#f4f4f8;border:1px solid #22222e;}
.dash-cta-btn-ghost:hover{border-color:#FFD60A;color:#FFD60A;}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .dash-kpi-row{grid-template-columns:repeat(2,1fr);}
  .dash-phases{grid-template-columns:repeat(2,1fr);}
  .dash-resources{grid-template-columns:repeat(2,1fr);}
  .dash-campaign-thead{display:none;}
  .dash-campaign-row{grid-template-columns:1fr;gap:10px;}
  .dash-case-hero{grid-template-columns:1fr;}
  .dash-cta-inner{grid-template-columns:1fr;padding:32px;}
  .dash-funnel-stages{grid-template-columns:repeat(5,1fr);gap:4px;}
  .dash-stage-n{font-size:18px;}
}
@media (max-width:760px){
  .dash-topbar{padding:14px 20px 0;}
  .dash-kpi{padding:24px 22px;min-height:170px;}
  .dash-kpi-value{font-size:40px;}
  .dash-section{padding:44px 20px;}
  .dash-title-block{padding:48px 20px 40px;}
  .dash-h1{font-size:44px;letter-spacing:-1.5px;}
  .dash-section-title{font-size:24px;}
  .dash-phases{grid-template-columns:1fr;}
  .dash-resources{grid-template-columns:1fr;}
  .dash-ab{grid-template-columns:1fr;}
  .dash-ab-vs{padding:8px;}
  .dash-inv-head{display:none;}
  .dash-inv-row{grid-template-columns:1fr;gap:8px;}
  .dash-inv-amt{text-align:left;}
  .dash-vs-head,.dash-vs-row{grid-template-columns:1fr;gap:6px;}
  .dash-case-metrics{grid-template-columns:1fr;}
  .dash-case-m strong{font-size:32px;}
  .dash-cta{padding:44px 20px;}
  .dash-cta-copy h2{font-size:26px;}
  .dash-cta-grid{grid-template-columns:1fr;}
  .dash-funnel{padding:20px;}
  .dash-funnel-svg{height:140px;}
  .dash-stage-lbl{font-size:10px;}
  .dash-stage-n{font-size:14px;}
  .dash-stage-d{font-size:9px;}
  .dash-breadcrumb{padding:12px 20px;}
  .dash-abt-row{grid-template-columns:1fr 1fr;gap:4px;font-size:11px;padding:10px 14px;}
  .dash-abt-row span:nth-child(4){display:none;}
}

/* ============================================================
   CRE-* — Meta Business creative-first skeleton
   Phone mockups, ad formats, creative testing, CAPI, radar
   ============================================================ */
:root{
  --cre-bg:#050509;
  --cre-bg-2:#0b0b12;
  --cre-ink:#f4f4f8;
  --cre-ink-d:#8a8a96;
  --cre-line:rgba(255,255,255,.08);
  --cre-olpa:#FFD60A;
  --cre-cyan:#5ce1ff;
  --cre-meta:#1877f2;
  --cre-like:#ed4956;
  --cre-card:#0f0f16;
}
.cre-hero,.cre-quick,.cre-formats,.cre-board,.cre-tech,.cre-aud,
.cre-phases,.cre-price,.cre-vs,.cre-case,.cre-demo,.cre-res,
.cre-faq,.cre-cta{background:var(--cre-bg);color:var(--cre-ink);
  font-family:'Inter',system-ui,sans-serif;padding:90px 0;position:relative;overflow:hidden}
.cre-hero .container,.cre-quick .container,.cre-formats .container,
.cre-board .container,.cre-tech .container,.cre-aud .container,
.cre-phases .container,.cre-price .container,.cre-vs .container,
.cre-case .container,.cre-demo .container,.cre-res .container,
.cre-faq .container,.cre-cta .container{max-width:1220px;margin:0 auto;padding:0 28px}
.cre-kicker{display:inline-block;font-size:11px;letter-spacing:.22em;
  text-transform:uppercase;color:var(--cre-olpa);font-weight:700;margin-bottom:14px}
.cre-sec-head{text-align:center;max-width:720px;margin:0 auto 56px}
.cre-sec-head h2{font-family: var(--font-display);
  font-size:clamp(30px,4vw,46px);line-height:1.08;font-weight:600;margin:0 0 14px;letter-spacing:-.01em}
.cre-sec-head p{color:var(--cre-ink-d);font-size:16px;line-height:1.6;margin:0}
.cre-serif{font-family: var(--font-display);font-style:italic;font-weight:500}

/* 1. HERO */
.cre-hero{padding:120px 0 80px;background:
  radial-gradient(ellipse at 50% 10%,rgba(255,214,10,.08),transparent 60%),
  radial-gradient(ellipse at 80% 90%,rgba(24,119,242,.10),transparent 55%),
  var(--cre-bg)}
.cre-hero-glow{position:absolute;inset:0;background:
  radial-gradient(circle at 50% 40%,rgba(92,225,255,.06),transparent 50%);pointer-events:none}
.cre-hero-wrap{position:relative;z-index:2;text-align:center}
.cre-crumb{font-size:12px;color:var(--cre-ink-d);letter-spacing:.05em;margin-bottom:24px}
.cre-crumb a{color:var(--cre-ink-d);text-decoration:none}
.cre-crumb a:hover{color:var(--cre-olpa)}
.cre-crumb span{margin:0 8px}
.cre-crumb-now{color:var(--cre-ink)}
.cre-hero-eye{display:inline-flex;align-items:center;gap:10px;
  padding:8px 18px;border:1px solid var(--cre-line);border-radius:999px;
  font-size:11px;letter-spacing:.18em;color:var(--cre-ink-d);margin-bottom:28px}
.cre-dot{width:7px;height:7px;background:var(--cre-olpa);border-radius:50%;
  box-shadow:0 0 14px var(--cre-olpa);animation:crePulse 2s infinite}
@keyframes crePulse{50%{opacity:.4}}
.cre-hero-h1{font-family: var(--font-display);
  font-size:clamp(38px,6vw,74px);line-height:1.02;font-weight:500;
  letter-spacing:-.02em;margin:0 0 22px}
.cre-hero-h1 em{font-style:italic;color:var(--cre-olpa)}
.cre-80{font-size:1.15em;color:var(--cre-olpa);font-weight:700;font-style:italic}
.cre-hero-sub{max-width:680px;margin:0 auto 60px;color:var(--cre-ink-d);
  font-size:17px;line-height:1.65}
.cre-phones{display:flex;justify-content:center;align-items:flex-end;
  gap:28px;perspective:1600px}
.cre-phone{width:220px;flex-shrink:0;transition:transform .4s}
.cre-phone-l{transform:rotateY(14deg) translateY(22px)}
.cre-phone-c{transform:translateY(-18px);z-index:3}
.cre-phone-r{transform:rotateY(-14deg) translateY(22px)}
.cre-phone-frame{position:relative;aspect-ratio:9/19.5;background:#111114;
  border:2px solid #1d1d22;border-radius:38px;padding:9px;
  box-shadow:0 40px 80px -20px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.04) inset}
.cre-phone-notch{position:absolute;top:14px;left:50%;transform:translateX(-50%);
  width:90px;height:22px;background:#000;border-radius:999px;z-index:5}
.cre-phone-screen{position:relative;width:100%;height:100%;background:#0a0a10;
  border-radius:30px;overflow:hidden;display:flex;flex-direction:column}
.cre-screen-fullbleed{position:relative}
.cre-ad-top{display:flex;align-items:center;gap:8px;padding:34px 10px 8px}
.cre-ad-avatar{width:24px;height:24px;border-radius:50%;
  background:linear-gradient(135deg,#ed4956,#c13584)}
.cre-ad-meta{display:flex;flex-direction:column;font-size:9px;line-height:1.2}
.cre-ad-meta b{color:#fff}
.cre-ad-meta span{color:var(--cre-ink-d);font-size:8px}
.cre-ad-img{flex:1;margin:4px 8px 8px;border-radius:8px}
.cre-grad-pink{background:linear-gradient(135deg,#ed4956 0%,#c13584 50%,#833ab4 100%)}
.cre-grad-cyan{background:linear-gradient(160deg,#0f1e40 0%,#1877f2 45%,#5ce1ff 100%)}
.cre-grad-olpa{background:linear-gradient(170deg,#1a1400 0%,#7a5f00 50%,#FFD60A 100%)}
.cre-ad-actions{display:flex;gap:10px;padding:0 10px 6px;font-size:10px;color:#ccc;align-items:center}
.cre-heart{color:var(--cre-like);font-size:14px}
.cre-ad-cta{margin:0 10px 10px;padding:6px;background:var(--cre-meta);
  color:#fff;text-align:center;font-size:9px;font-weight:600;border-radius:4px}
.cre-ad-fmt{position:absolute;top:44px;right:10px;font-size:8px;
  background:rgba(0,0,0,.6);color:var(--cre-olpa);padding:3px 7px;
  border-radius:4px;letter-spacing:.1em;font-weight:700}
.cre-fmt-light{background:rgba(255,255,255,.15);color:#fff}
.cre-reel-bg{position:absolute;inset:0}
.cre-reel-side{position:absolute;right:8px;bottom:60px;display:flex;
  flex-direction:column;gap:12px;align-items:center;color:#fff;font-size:9px;z-index:2}
.cre-reel-side small{font-size:8px;color:#fff;margin-top:-8px}
.cre-reel-foot{position:absolute;left:12px;right:50px;bottom:14px;color:#fff;
  font-size:9px;z-index:2;display:flex;flex-direction:column;gap:2px;text-shadow:0 2px 6px rgba(0,0,0,.5)}
.cre-reel-foot b{font-size:10px}
.cre-reel-foot span{opacity:.85}
.cre-story-bars{position:absolute;top:10px;left:10px;right:10px;display:flex;gap:3px;z-index:4}
.cre-story-bars i{flex:1;height:2px;background:rgba(255,255,255,.3);border-radius:2px}
.cre-story-bars i.cre-on{background:#fff}
.cre-story-head{position:absolute;top:22px;left:10px;right:10px;display:flex;
  align-items:center;gap:6px;color:#fff;font-size:9px;z-index:4}
.cre-story-head b{flex:1}
.cre-story-swipe{position:absolute;bottom:18px;left:0;right:0;text-align:center;
  color:#fff;font-size:10px;opacity:.9;z-index:2}

/* 2. QUICK */
.cre-quick-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:60px;align-items:start}
.cre-quick-text p{font-size:17px;line-height:1.7;color:var(--cre-ink-d);margin:0 0 30px}
.cre-quote{font-family: var(--font-display);font-size:26px;line-height:1.3;
  font-style:italic;color:var(--cre-ink);border-left:3px solid var(--cre-olpa);
  padding:8px 0 8px 24px;margin:0;position:relative}
.cre-quote-mark{font-size:56px;color:var(--cre-olpa);line-height:0;
  position:relative;top:18px;margin-right:4px}
.cre-quick-stat{background:var(--cre-card);border:1px solid var(--cre-line);
  border-radius:18px;padding:36px 30px;text-align:center}
.cre-bignum{font-family: var(--font-display);font-size:140px;line-height:.9;
  color:var(--cre-olpa);font-weight:600;letter-spacing:-.04em}
.cre-bignum span{font-size:60px;vertical-align:top;margin-left:4px}
.cre-quick-stat p{color:var(--cre-ink-d);font-size:14px;line-height:1.5;margin:18px 0 26px}
.cre-stat-ticks{display:flex;justify-content:space-between;gap:10px;
  padding-top:22px;border-top:1px solid var(--cre-line)}
.cre-stat-ticks div{flex:1;display:flex;flex-direction:column;gap:4px}
.cre-stat-ticks b{font-size:22px;color:var(--cre-cyan)}
.cre-stat-ticks span{font-size:10px;color:var(--cre-ink-d);line-height:1.3}

/* 3. FORMATS */
.cre-fmt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.cre-fmt-card{background:var(--cre-card);border:1px solid var(--cre-line);
  border-radius:16px;padding:28px 24px;display:flex;flex-direction:column;
  gap:22px;transition:transform .3s,border-color .3s}
.cre-fmt-card:hover{transform:translateY(-4px);border-color:rgba(255,214,10,.4)}
.cre-mini-phone{margin:0 auto;width:100px;aspect-ratio:9/19.5;background:#111;
  border:1.5px solid #1d1d22;border-radius:18px;padding:5px;position:relative}
.cre-mini-phone::before{content:"";position:absolute;top:7px;left:50%;
  transform:translateX(-50%);width:38px;height:9px;background:#000;border-radius:999px;z-index:3}
.cre-mini-screen{width:100%;height:100%;background:#0a0a10;border-radius:14px;
  overflow:hidden;position:relative;display:flex;flex-direction:column}
.cre-mini-fullbleed{position:relative}
.cre-mini-top{display:flex;align-items:center;gap:4px;padding:18px 6px 4px;font-size:7px;color:#fff}
.cre-mini-top i{width:12px;height:12px;border-radius:50%;background:linear-gradient(135deg,#ed4956,#833ab4)}
.cre-mini-img{flex:1;margin:2px 5px 4px;border-radius:4px}
.cre-mini-bar{display:flex;gap:6px;padding:0 6px 6px;font-size:9px;color:#ccc}
.cre-mini-bg{position:absolute;inset:0}
.cre-mini-rside{position:absolute;right:4px;bottom:18px;display:flex;
  flex-direction:column;gap:5px;color:#fff;font-size:8px;z-index:2}
.cre-mini-foot{position:absolute;left:5px;bottom:5px;color:#fff;font-size:7px;z-index:2}
.cre-mini-bars{position:absolute;top:4px;left:4px;right:4px;display:flex;gap:2px;z-index:3}
.cre-mini-bars i{flex:1;height:1.5px;background:rgba(255,255,255,.3)}
.cre-mini-bars i.cre-on{background:#fff}
.cre-mini-swipe{position:absolute;bottom:8px;left:0;right:0;text-align:center;color:#fff;font-size:10px}
.cre-mini-chat{flex:1;padding:22px 6px 4px;display:flex;flex-direction:column;gap:4px;justify-content:flex-end}
.cre-bubble-l,.cre-bubble-r{height:8px;border-radius:6px}
.cre-bubble-l{width:60%;background:#2a2a32;align-self:flex-start}
.cre-bubble-r{width:50%;background:var(--cre-meta);align-self:flex-end}
.cre-bubble-s{width:40%}
.cre-mini-send{margin:0 5px 5px;padding:4px;background:#1a1a22;border-radius:4px;
  text-align:center;font-size:7px;color:#666}
.cre-mini-net{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:20px 5px 3px;flex:1}
.cre-mini-net i{background:linear-gradient(135deg,#333,#555);border-radius:3px}
.cre-mini-banner{margin:0 5px 5px;padding:4px;background:var(--cre-meta);
  border-radius:3px;text-align:center;font-size:7px;color:#fff}
.cre-shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:2px 5px;flex:1}
.cre-shop-grid i{background:linear-gradient(135deg,#ed4956,#c13584);border-radius:3px}
.cre-fmt-body{text-align:center}
.cre-fmt-body h3{font-family: var(--font-display);font-size:24px;
  font-weight:600;margin:0 0 10px;color:var(--cre-ink)}
.cre-fmt-body p{font-size:13.5px;line-height:1.55;color:var(--cre-ink-d);margin:0 0 14px}
.cre-fmt-tag{display:inline-block;font-size:10px;letter-spacing:.08em;
  color:var(--cre-cyan);padding:5px 12px;border:1px solid rgba(92,225,255,.25);
  border-radius:999px;text-transform:uppercase}

/* 4. BOARD */
.cre-board{background:linear-gradient(180deg,var(--cre-bg) 0%,var(--cre-bg-2) 100%)}
.cre-funnel{display:flex;align-items:center;gap:20px;background:var(--cre-card);
  border:1px solid var(--cre-line);border-radius:20px;padding:40px 30px;
  background-image:
    linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);
  background-size:30px 30px}
.cre-fnl-col{flex:1}
.cre-fnl-wide{flex:2}
.cre-fnl-mid{flex:1.3}
.cre-fnl-thin{flex:1}
.cre-fnl-label{display:block;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cre-ink-d);margin-bottom:16px;font-weight:700}
.cre-thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.cre-thumbs-mid{grid-template-columns:repeat(3,1fr)}
.cre-thumb{aspect-ratio:4/5;background:#1a1a22;border:1px solid var(--cre-line);
  border-radius:8px;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:4px;padding:6px;position:relative;overflow:hidden}
.cre-thumb::before{content:"";position:absolute;inset:0;opacity:.4;z-index:0}
.cre-thumb.cre-t1::before,.cre-thumb.cre-t5::before{background:linear-gradient(135deg,#ed4956,#c13584)}
.cre-thumb.cre-t2::before,.cre-thumb.cre-t6::before{background:linear-gradient(135deg,#1877f2,#5ce1ff)}
.cre-thumb.cre-t3::before,.cre-thumb.cre-t7::before{background:linear-gradient(135deg,#833ab4,#405de6)}
.cre-thumb.cre-t4::before,.cre-thumb.cre-t8::before{background:linear-gradient(135deg,#FFD60A,#ed4956)}
.cre-thumb.cre-t9::before,.cre-thumb.cre-t10::before{background:linear-gradient(135deg,#0f1e40,#1877f2)}
.cre-thumb b,.cre-thumb small{position:relative;z-index:1}
.cre-thumb b{font-family: var(--font-display);font-size:22px;color:#fff}
.cre-thumb small{font-size:9px;color:#fff;opacity:.9;text-align:center}
.cre-win{border-color:var(--cre-olpa);box-shadow:0 0 0 2px rgba(255,214,10,.2)}
.cre-win::before{background:linear-gradient(135deg,#FFD60A,#ff8c00)!important;opacity:.6}
.cre-thumb-big{aspect-ratio:4/5;padding:16px}
.cre-thumb-big b{font-size:48px}
.cre-thumb-big small{font-size:11px;margin-top:4px}
.cre-scale-tag{position:absolute;top:8px;right:8px;background:var(--cre-olpa);
  color:#000;font-size:9px;padding:3px 8px;border-radius:4px;font-weight:700;z-index:2}
.cre-fnl-arrow{font-size:28px;color:var(--cre-olpa);font-weight:300}
.cre-board-note{text-align:center;color:var(--cre-ink-d);font-size:13px;
  font-style:italic;margin:30px auto 0;max-width:640px}

/* 5. TECH */
.cre-tech{background:var(--cre-bg-2)}
.cre-tech-split{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.cre-tech-col{background:var(--cre-card);border:1px solid var(--cre-line);
  border-radius:16px;padding:36px 30px}
.cre-tech-bad{border-color:rgba(237,73,86,.3)}
.cre-tech-good{border-color:rgba(255,214,10,.4)}
.cre-tech-title{display:block;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--cre-olpa);margin-bottom:22px;font-weight:700}
.cre-tech-bad .cre-tech-title{color:var(--cre-like)}
.cre-flow{display:flex;flex-direction:column;align-items:center;gap:0;margin-bottom:24px}
.cre-node{padding:12px 22px;background:#1a1a22;border:1px solid var(--cre-line);
  border-radius:10px;font-size:13px;color:#fff;text-align:center}
.cre-node small{display:block;font-size:10px;color:var(--cre-ink-d);margin-top:2px}
.cre-node-block{border-color:var(--cre-like);color:var(--cre-like)}
.cre-node-x{border-color:var(--cre-like);opacity:.5}
.cre-node-olpa{border-color:var(--cre-olpa);color:var(--cre-olpa)}
.cre-node-ok{border-color:var(--cre-olpa);color:var(--cre-olpa);
  box-shadow:0 0 24px rgba(255,214,10,.15)}
.cre-line{width:2px;height:22px;background:var(--cre-line)}
.cre-line-dead{background:repeating-linear-gradient(180deg,var(--cre-like) 0 4px,transparent 4px 8px)}
.cre-line-ok{background:var(--cre-olpa);box-shadow:0 0 8px rgba(255,214,10,.5)}
.cre-tech-list{list-style:none;padding:0;margin:24px 0 0;border-top:1px solid var(--cre-line);padding-top:20px}
.cre-tech-list li{font-size:13px;color:var(--cre-ink-d);padding:6px 0;padding-left:20px;position:relative}
.cre-tech-list li::before{content:"→";position:absolute;left:0;color:var(--cre-olpa)}

/* 6. AUDIENCE RADAR */
.cre-aud-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.cre-aud-text h2{text-align:left;font-family: var(--font-display);
  font-size:clamp(28px,3.4vw,40px);margin:0 0 16px;line-height:1.1}
.cre-aud-text>p{color:var(--cre-ink-d);font-size:15px;line-height:1.65;margin:0 0 28px}
.cre-aud-legend{list-style:none;padding:0;margin:0}
.cre-aud-legend li{display:flex;align-items:center;gap:14px;padding:10px 0;
  border-bottom:1px solid var(--cre-line);font-size:14px;color:var(--cre-ink-d)}
.cre-aud-legend b{color:var(--cre-ink);margin-right:6px}
.cre-leg{width:14px;height:14px;border-radius:50%;flex-shrink:0}
.cre-leg-1{background:var(--cre-olpa)}
.cre-leg-2{background:var(--cre-cyan)}
.cre-leg-3{background:var(--cre-meta)}
.cre-leg-4{background:#5b2bb4}
.cre-radar{position:relative;width:420px;height:420px;margin:0 auto;max-width:100%}
.cre-ring{position:absolute;border-radius:50%;display:flex;align-items:flex-start;
  justify-content:center;top:50%;left:50%;transform:translate(-50%,-50%);
  border:1px solid;padding-top:6px;font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:700}
.cre-ring-4{width:420px;height:420px;border-color:rgba(91,43,180,.4);color:#8a5cd4}
.cre-ring-3{width:320px;height:320px;border-color:rgba(24,119,242,.5);color:var(--cre-meta)}
.cre-ring-2{width:220px;height:220px;border-color:rgba(92,225,255,.5);color:var(--cre-cyan)}
.cre-ring-1{width:120px;height:120px;border-color:rgba(255,214,10,.6);color:var(--cre-olpa)}
.cre-radar-center{position:absolute;top:50%;left:50%;width:14px;height:14px;
  background:var(--cre-olpa);border-radius:50%;transform:translate(-50%,-50%);
  box-shadow:0 0 30px var(--cre-olpa)}
.cre-radar-cross{position:absolute;inset:0;background:
  linear-gradient(90deg,transparent 49.5%,rgba(255,255,255,.06) 49.5% 50.5%,transparent 50.5%),
  linear-gradient(0deg,transparent 49.5%,rgba(255,255,255,.06) 49.5% 50.5%,transparent 50.5%);
  pointer-events:none}

/* 7. PHASES */
.cre-timeline{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;position:relative}
.cre-timeline::before{content:"";position:absolute;top:40px;left:5%;right:5%;
  height:1px;background:linear-gradient(90deg,transparent,var(--cre-olpa),transparent);z-index:0}
.cre-phase{background:var(--cre-card);border:1px solid var(--cre-line);
  border-radius:14px;padding:22px 16px;text-align:center;position:relative;z-index:1}
.cre-phase-mini{width:48px;height:60px;border-radius:8px;margin:0 auto 14px;
  border:1.5px solid #1d1d22}
.cre-phase b{display:block;font-size:12px;color:var(--cre-olpa);margin-bottom:8px;letter-spacing:.04em}
.cre-phase p{font-size:12px;color:var(--cre-ink-d);line-height:1.45;margin:0}

/* 8+9. TABLES */
.cre-table{width:100%;border-collapse:collapse;background:var(--cre-card);
  border:1px solid var(--cre-line);border-radius:14px;overflow:hidden}
.cre-table th,.cre-table td{padding:18px 22px;text-align:left;
  border-bottom:1px solid var(--cre-line);font-size:14px}
.cre-table th{background:#111119;color:var(--cre-olpa);font-size:11px;
  letter-spacing:.14em;text-transform:uppercase;font-weight:700}
.cre-table td{color:var(--cre-ink-d)}
.cre-table td b{color:var(--cre-ink)}
.cre-table tr:last-child td{border-bottom:none}
.cre-table-vs td:not(:first-child){color:var(--cre-ink)}

/* 10. CASE */
.cre-case-grid{display:grid;grid-template-columns:280px 1fr;gap:60px;align-items:center}
.cre-case-phone .cre-phone{width:260px;transform:rotate(-3deg)}
.cre-case-text h2{font-family: var(--font-display);font-size:clamp(28px,3.4vw,40px);
  margin:0 0 24px;line-height:1.1}
.cre-case-quote{font-family: var(--font-display);font-size:20px;line-height:1.5;
  font-style:italic;color:var(--cre-ink);margin:0 0 30px;padding:0 0 0 24px;
  border-left:3px solid var(--cre-olpa)}
.cre-case-quote footer{font-family:'Inter',sans-serif;font-style:normal;font-size:13px;
  color:var(--cre-ink-d);margin-top:14px;display:block}
.cre-case-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
  padding-top:26px;border-top:1px solid var(--cre-line)}
.cre-case-kpis div{display:flex;flex-direction:column;gap:4px}
.cre-case-kpis b{font-family: var(--font-display);font-size:36px;color:var(--cre-olpa);line-height:1}
.cre-case-kpis span{font-size:11px;color:var(--cre-ink-d);letter-spacing:.05em}

/* 11. DEMO */
.cre-demo-wrap{max-width:900px;margin:0 auto;aspect-ratio:16/9;
  border-radius:16px;overflow:hidden;border:1px solid var(--cre-line);
  box-shadow:0 30px 80px -20px rgba(0,0,0,.6)}
.cre-demo-wrap iframe{width:100%;height:100%;display:block}

/* 12. RESOURCES */
.cre-res-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.cre-res-card{background:var(--cre-card);border:1px solid var(--cre-line);
  border-radius:14px;padding:26px 22px;text-decoration:none;display:flex;
  flex-direction:column;gap:10px;transition:transform .3s,border-color .3s}
.cre-res-card:hover{transform:translateY(-3px);border-color:var(--cre-olpa)}
.cre-res-tag{display:inline-block;font-size:10px;letter-spacing:.14em;
  color:var(--cre-olpa);text-transform:uppercase;font-weight:700;width:fit-content}
.cre-res-card b{color:var(--cre-ink);font-size:14px;word-break:break-all}
.cre-res-card small{color:var(--cre-ink-d);font-size:12px;line-height:1.45}

/* 13. FAQ */
.cre-faq-list{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:12px}
.cre-faq-list details{background:var(--cre-card);border:1px solid var(--cre-line);
  border-radius:12px;padding:22px 26px;transition:border-color .3s}
.cre-faq-list details[open]{border-color:rgba(255,214,10,.4)}
.cre-faq-list summary{cursor:pointer;font-size:15px;font-weight:600;
  color:var(--cre-ink);list-style:none;display:flex;justify-content:space-between;align-items:center}
.cre-faq-list summary::after{content:"+";color:var(--cre-olpa);font-size:22px;font-weight:300}
.cre-faq-list details[open] summary::after{content:"−"}
.cre-faq-list p{margin:14px 0 0;font-size:14px;line-height:1.65;color:var(--cre-ink-d)}

/* 14. CTA */
.cre-cta{background:
  radial-gradient(ellipse at 80% 50%,rgba(255,214,10,.08),transparent 55%),
  var(--cre-bg)}
.cre-cta-grid{display:grid;grid-template-columns:260px 1fr;gap:60px;align-items:center}
.cre-cta-phone .cre-phone{width:240px;transform:rotate(-4deg)}
.cre-cta-text h2{font-family: var(--font-display);font-size:clamp(32px,4vw,48px);
  line-height:1.05;margin:0 0 20px}
.cre-serif-em{font-style:italic;color:var(--cre-olpa)}
.cre-cta-text p{color:var(--cre-ink-d);font-size:16px;line-height:1.65;margin:0 0 30px}
.cre-cta-buttons{display:flex;gap:16px;flex-wrap:wrap}
.cre-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 26px;
  border-radius:10px;font-size:14px;font-weight:600;text-decoration:none;transition:transform .25s}
.cre-btn:hover{transform:translateY(-2px)}
.cre-btn-olpa{background:var(--cre-olpa);color:#000}
.cre-btn-ghost{border:1px solid var(--cre-line);color:var(--cre-ink)}
.cre-btn-ghost:hover{border-color:var(--cre-olpa)}

/* RESPONSIVE */
@media(max-width:960px){
  .cre-hero,.cre-quick,.cre-formats,.cre-board,.cre-tech,.cre-aud,
  .cre-phases,.cre-price,.cre-vs,.cre-case,.cre-demo,.cre-res,
  .cre-faq,.cre-cta{padding:70px 0}
  .cre-quick-grid,.cre-tech-split,.cre-aud-grid,.cre-case-grid,.cre-cta-grid{grid-template-columns:1fr;gap:40px}
  .cre-fmt-grid{grid-template-columns:repeat(2,1fr)}
  .cre-res-grid{grid-template-columns:repeat(2,1fr)}
  .cre-timeline{grid-template-columns:repeat(3,1fr)}
  .cre-timeline::before{display:none}
  .cre-phones{gap:14px;transform:scale(.85)}
  .cre-phone{width:170px}
  .cre-funnel{flex-direction:column;gap:26px}
  .cre-fnl-arrow{transform:rotate(90deg)}
  .cre-thumbs{grid-template-columns:repeat(5,1fr)}
  .cre-radar{width:320px;height:320px}
  .cre-ring-4{width:320px;height:320px}
  .cre-ring-3{width:240px;height:240px}
  .cre-ring-2{width:160px;height:160px}
  .cre-ring-1{width:90px;height:90px}
  .cre-bignum{font-size:100px}
}
@media(max-width:640px){
  .cre-fmt-grid{grid-template-columns:1fr}
  .cre-res-grid{grid-template-columns:1fr}
  .cre-timeline{grid-template-columns:1fr}
  .cre-phones{flex-direction:column;align-items:center;gap:20px}
  .cre-phone{width:200px;transform:none!important}
  .cre-thumbs{grid-template-columns:repeat(3,1fr)}
  .cre-case-kpis{grid-template-columns:1fr;gap:12px}
  .cre-table th,.cre-table td{padding:12px 14px;font-size:13px}
  .cre-hero-h1{font-size:38px}
}

/* ============================================================
   PIPEDRIVE · skeleton horizontal pipeline (.pip-*)
   ============================================================ */
.pip-body{background:#050509;color:#e8e8ef;}
.pip-body .container{max-width:1240px;margin:0 auto;padding:0 24px;}

.pip-breadcrumb{padding:26px 0 8px;font-size:13px;color:#7a7a88;letter-spacing:.02em;}
.pip-breadcrumb a{color:#9a9aa8;text-decoration:none;}
.pip-breadcrumb a:hover{color:#FFD60A;}
.pip-breadcrumb span{margin:0 8px;color:#3a3a48;}
.pip-crumb-current{color:#FFD60A;}

/* hero */
.pip-hero{padding:40px 0 90px;position:relative;overflow:hidden;}
.pip-hero::before{content:"";position:absolute;inset:0;background:
  radial-gradient(1000px 400px at 80% -10%,rgba(1,119,55,.14),transparent 60%),
  radial-gradient(800px 400px at 10% 10%,rgba(255,214,10,.06),transparent 60%);
  pointer-events:none;}
.pip-hero-head{position:relative;z-index:2;max-width:980px;padding-top:20px;padding-bottom:50px;}
.pip-hero-tag{display:inline-block;padding:7px 14px;border:1px solid rgba(1,119,55,.45);border-radius:999px;color:#39c07a;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:24px;background:rgba(1,119,55,.08);}
.pip-hero-title{font-size:clamp(38px,6vw,78px);line-height:1.02;font-weight:800;letter-spacing:-.02em;margin:0 0 22px;}
.pip-title-accent{color:#FFD60A;}
.pip-dot{color:#017737;font-weight:900;}
.pip-hero-sub{font-size:18px;line-height:1.6;color:#b8b8c6;max-width:640px;margin:0 0 30px;}
.pip-hero-ctas{display:flex;gap:14px;flex-wrap:wrap;}
.pip-btn-primary{display:inline-block;background:#FFD60A;color:#050509;padding:14px 24px;border-radius:10px;font-weight:700;text-decoration:none;font-size:15px;transition:transform .15s;}
.pip-btn-primary:hover{transform:translateY(-2px);}
.pip-btn-ghost{display:inline-block;border:1px solid rgba(255,255,255,.16);color:#e8e8ef;padding:14px 24px;border-radius:10px;font-weight:600;text-decoration:none;font-size:15px;}
.pip-btn-ghost:hover{border-color:#FFD60A;color:#FFD60A;}
.pip-btn-wa{display:inline-block;background:#25D366;color:#050509;padding:14px 24px;border-radius:10px;font-weight:700;text-decoration:none;font-size:15px;}
.pip-btn-wa:hover{transform:translateY(-2px);}

/* full-bleed kanban board */
.pip-board{width:100vw;margin-left:calc(-50vw + 50%);display:grid;grid-template-columns:repeat(5,1fr);gap:14px;padding:0 24px;position:relative;z-index:2;}
.pip-col{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:14px;min-height:360px;display:flex;flex-direction:column;gap:10px;}
.pip-col-won{background:linear-gradient(180deg,rgba(1,119,55,.12),rgba(1,119,55,.04));border-color:rgba(1,119,55,.35);}
.pip-col-head{display:flex;align-items:center;gap:10px;padding:4px 4px 12px;border-bottom:1px dashed rgba(255,255,255,.08);margin-bottom:4px;}
.pip-col-head h3{font-size:13px;font-weight:700;margin:0;color:#e8e8ef;letter-spacing:.04em;text-transform:uppercase;flex:1;}
.pip-stage-num{font-size:10px;color:#5a5a68;font-family:monospace;letter-spacing:.1em;}
.pip-col-count{font-size:11px;color:#7a7a88;background:rgba(255,255,255,.05);padding:3px 8px;border-radius:999px;}
.pip-col-won .pip-col-count{background:rgba(1,119,55,.25);color:#7de0a5;}
.pip-card{background:#0f0f16;border:1px solid rgba(255,255,255,.09);border-radius:10px;padding:12px;transition:transform .15s,border-color .15s;cursor:grab;}
.pip-card:hover{transform:translateY(-2px);border-color:rgba(255,214,10,.35);}
.pip-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;}
.pip-avatar{width:28px;height:28px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;color:#050509;letter-spacing:.02em;}
.pip-av-a{background:#FFD60A;}.pip-av-b{background:#7de0a5;}.pip-av-c{background:#ff9f6e;}
.pip-av-d{background:#6ec5ff;}.pip-av-e{background:#d690ff;}.pip-av-f{background:#FFD60A;}
.pip-av-g{background:#7de0a5;}.pip-av-h{background:#ff9f6e;}.pip-av-i{background:#6ec5ff;}
.pip-av-j{background:#d690ff;}.pip-av-k{background:#FFD60A;}.pip-av-l{background:#7de0a5;}
.pip-amount{font-size:12px;font-weight:700;color:#FFD60A;font-variant-numeric:tabular-nums;}
.pip-card-company{font-size:13px;font-weight:600;color:#e8e8ef;margin-bottom:4px;}
.pip-card-meta{font-size:11px;color:#6a6a78;}
.pip-card-won{background:linear-gradient(180deg,rgba(1,119,55,.15),rgba(1,119,55,.05));border-color:rgba(1,119,55,.4);}
.pip-meta-won{color:#7de0a5;font-weight:600;}

/* stage 0 */
.pip-stage0{padding:70px 0;border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05);background:rgba(255,255,255,.015);}
.pip-stage0-grid{display:grid;grid-template-columns:160px 1fr;gap:50px;align-items:start;}
.pip-stage0-label{font-family:monospace;font-size:11px;letter-spacing:.2em;color:#FFD60A;border-left:2px solid #FFD60A;padding-left:14px;}
.pip-stage0-body p{font-size:19px;line-height:1.7;color:#c4c4d2;margin:0;}

/* stage sections */
.pip-stage{padding:110px 0;position:relative;}
.pip-stage-grid{display:grid;grid-template-columns:minmax(280px,380px) 1fr;gap:70px;align-items:start;}
.pip-stage-grid.pip-flip{grid-template-columns:1fr minmax(280px,380px);}
.pip-stage-grid.pip-flip .pip-stage-side{order:2;}
.pip-stage-kicker{font-family:monospace;font-size:11px;letter-spacing:.22em;color:#39c07a;text-transform:uppercase;margin-bottom:10px;}
.pip-stage-big{font-size:clamp(80px,12vw,160px);line-height:.85;font-weight:900;color:transparent;-webkit-text-stroke:1.5px rgba(255,214,10,.35);letter-spacing:-.04em;margin-bottom:14px;}
.pip-stage-h{font-size:clamp(32px,4vw,52px);line-height:1;font-weight:800;margin:0 0 22px;letter-spacing:-.02em;}
.pip-stage-lead{font-size:16px;line-height:1.65;color:#a8a8b8;margin:0 0 20px;}
.pip-bullets{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.pip-bullets li{font-size:14px;color:#b8b8c6;padding-left:22px;position:relative;}
.pip-bullets li::before{content:"";position:absolute;left:0;top:8px;width:12px;height:2px;background:#FFD60A;}

/* stage 1 features */
.pip-feat-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.pip-feat{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:26px 22px;transition:border-color .2s,transform .2s;}
.pip-feat:hover{border-color:rgba(255,214,10,.35);transform:translateY(-3px);}
.pip-feat-num{font-family:monospace;font-size:11px;color:#FFD60A;letter-spacing:.1em;margin-bottom:12px;}
.pip-feat h3{font-size:19px;margin:0 0 10px;font-weight:700;}
.pip-feat p{font-size:14px;line-height:1.6;color:#9a9aa8;margin:0;}

/* stage 2 timeline */
.pip-timeline{background:#0c0c14;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:26px;}
.pip-tl-head{font-size:13px;font-weight:700;color:#FFD60A;letter-spacing:.04em;padding-bottom:14px;margin-bottom:18px;border-bottom:1px solid rgba(255,255,255,.07);}
.pip-tl-list{list-style:none;padding:0;margin:0;position:relative;}
.pip-tl-list::before{content:"";position:absolute;left:8px;top:10px;bottom:10px;width:1px;background:rgba(255,255,255,.1);}
.pip-tl-item{position:relative;padding:0 0 22px 32px;}
.pip-tl-item:last-child{padding-bottom:0;}
.pip-tl-dot{position:absolute;left:2px;top:6px;width:14px;height:14px;border-radius:50%;border:2px solid #050509;}
.pip-tl-call .pip-tl-dot{background:#FFD60A;}
.pip-tl-email .pip-tl-dot{background:#6ec5ff;}
.pip-tl-meeting .pip-tl-dot{background:#7de0a5;}
.pip-tl-note .pip-tl-dot{background:#d690ff;}
.pip-tl-item strong{font-size:14px;color:#e8e8ef;}
.pip-tl-meta{font-size:11px;color:#6a6a78;font-family:monospace;letter-spacing:.02em;}
.pip-tl-item p{font-size:13px;line-height:1.55;color:#9a9aa8;margin:6px 0 0;}

/* stage 3 email */
.pip-feat-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:22px;}
.pip-mini-feat{display:flex;align-items:center;gap:10px;font-size:13px;color:#c4c4d2;padding:12px 14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:10px;}
.pip-mini-feat span{width:22px;height:22px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;background:rgba(1,119,55,.25);color:#7de0a5;font-size:11px;font-weight:700;font-family:monospace;}
.pip-mail{background:#0c0c14;border:1px solid rgba(255,255,255,.08);border-radius:16px;overflow:hidden;}
.pip-mail-head{display:flex;align-items:center;gap:14px;padding:14px 18px;background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.07);}
.pip-mail-dots{display:flex;gap:6px;}
.pip-mail-dots span{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.15);}
.pip-mail-dots span:nth-child(1){background:#ff5f57;}
.pip-mail-dots span:nth-child(2){background:#febc2e;}
.pip-mail-dots span:nth-child(3){background:#28c840;}
.pip-mail-addr{flex:1;font-size:12px;color:#8a8a98;font-family:monospace;}
.pip-mail-track{font-size:10px;color:#7de0a5;background:rgba(1,119,55,.2);padding:4px 10px;border-radius:999px;font-family:monospace;letter-spacing:.08em;}
.pip-mail-body{padding:22px;}
.pip-mail-from{font-size:12px;color:#6a6a78;margin-bottom:8px;font-family:monospace;}
.pip-mail-subj{font-size:16px;font-weight:700;color:#e8e8ef;margin-bottom:14px;}
.pip-mail-line{font-size:13px;line-height:1.6;color:#a8a8b8;margin:0 0 10px;}
.pip-mail-attach{margin-top:14px;padding:10px 14px;background:rgba(255,214,10,.08);border:1px dashed rgba(255,214,10,.35);border-radius:8px;font-size:12px;color:#FFD60A;font-family:monospace;}
.pip-mail-stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(255,255,255,.07);}
.pip-mail-stat{padding:16px;text-align:center;border-right:1px solid rgba(255,255,255,.05);}
.pip-mail-stat:last-child{border-right:none;}
.pip-mail-stat-n{font-size:22px;font-weight:800;color:#FFD60A;margin-bottom:4px;}
.pip-mail-stat-l{font-size:10px;color:#6a6a78;text-transform:uppercase;letter-spacing:.08em;}

/* stage 4 forecast */
.pip-forecast{display:flex;flex-direction:column;gap:22px;}
.pip-chart{background:#0c0c14;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:26px;}
.pip-chart-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:22px;}
.pip-chart-head span:first-child{font-size:13px;color:#8a8a98;font-weight:600;}
.pip-chart-total{font-size:20px;color:#FFD60A;font-weight:800;font-variant-numeric:tabular-nums;}
.pip-bars{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;height:160px;align-items:end;}
.pip-bar{background:linear-gradient(180deg,rgba(255,214,10,.4),rgba(255,214,10,.12));height:var(--h);border-radius:6px 6px 0 0;position:relative;border-top:2px solid #FFD60A;}
.pip-bar span{position:absolute;bottom:-22px;left:50%;transform:translateX(-50%);font-size:10px;color:#6a6a78;font-family:monospace;}
.pip-bar-now{background:linear-gradient(180deg,rgba(1,119,55,.55),rgba(1,119,55,.15));border-top-color:#39c07a;}
.pip-bar-proj{background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.04));border-top:2px dashed rgba(255,255,255,.3);}
.pip-auto-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.pip-auto-list li{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:center;padding:14px 18px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:12px;font-size:13px;}
.pip-auto-trig{color:#c4c4d2;}
.pip-auto-arr{color:#FFD60A;font-weight:900;font-size:18px;}
.pip-auto-act{color:#7de0a5;}

/* stage 5 dash */
.pip-dash{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.pip-metric{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:26px;}
.pip-metric-l{font-size:12px;color:#8a8a98;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px;}
.pip-metric-n{font-size:42px;font-weight:800;color:#FFD60A;letter-spacing:-.02em;line-height:1;margin-bottom:12px;font-variant-numeric:tabular-nums;}
.pip-metric-trend{font-size:12px;font-weight:600;}
.pip-up{color:#7de0a5;}.pip-down{color:#7de0a5;}

/* vs table */
.pip-vs{padding:110px 0;background:rgba(255,255,255,.015);border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05);}
.pip-vs-head{max-width:720px;margin-bottom:44px;}
.pip-vs-kicker{font-family:monospace;font-size:11px;letter-spacing:.22em;color:#39c07a;text-transform:uppercase;margin-bottom:12px;}
.pip-vs-head h2,.pip-impl-head h2,.pip-integ-head h2,.pip-pricing-head h2,.pip-demo h2,.pip-res h2,.pip-faq h2{font-size:clamp(28px,3.4vw,44px);line-height:1.1;font-weight:800;margin:0 0 14px;letter-spacing:-.02em;}
.pip-vs-head p,.pip-impl-head p,.pip-pricing-head p{font-size:15px;color:#9a9aa8;margin:0;line-height:1.6;}
.pip-vs-table{border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden;}
.pip-vs-row{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:0;border-bottom:1px solid rgba(255,255,255,.06);}
.pip-vs-row:last-child{border-bottom:none;}
.pip-vs-row>div{padding:18px 22px;font-size:14px;color:#c4c4d2;border-right:1px solid rgba(255,255,255,.06);}
.pip-vs-row>div:last-child{border-right:none;}
.pip-vs-header{background:rgba(255,214,10,.06);}
.pip-vs-header>div{font-size:12px;color:#FFD60A;font-weight:700;text-transform:uppercase;letter-spacing:.08em;}
.pip-win{color:#7de0a5;font-weight:700;}
.pip-vs-foot{font-size:15px;color:#b8b8c6;margin:28px 0 0;line-height:1.6;}

/* impl stepper */
.pip-impl{padding:110px 0;}
.pip-impl-head{max-width:720px;margin-bottom:50px;}
.pip-stepper{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:14px;counter-reset:pipstep;}
.pip-step{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:24px 20px;position:relative;}
.pip-step-num{font-family:monospace;font-size:11px;color:#FFD60A;letter-spacing:.14em;margin-bottom:12px;}
.pip-step h3{font-size:16px;margin:0 0 10px;font-weight:700;}
.pip-step p{font-size:13px;line-height:1.55;color:#9a9aa8;margin:0 0 14px;}
.pip-step-time{font-size:11px;color:#39c07a;font-family:monospace;padding-top:10px;border-top:1px dashed rgba(255,255,255,.08);}

/* integrations strip */
.pip-integ{padding:90px 0;border-top:1px solid rgba(255,255,255,.05);}
.pip-integ-head{margin-bottom:36px;}
.pip-integ-strip{width:100vw;margin-left:calc(-50vw + 50%);overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);}
.pip-integ-track{display:inline-flex;gap:14px;animation:pip-marquee 40s linear infinite;white-space:nowrap;padding:8px 0;}
@keyframes pip-marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.pip-chip{display:inline-flex;align-items:center;padding:12px 22px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:999px;font-size:14px;color:#c4c4d2;font-weight:600;flex-shrink:0;}

/* case */
.pip-case{padding:110px 0;background:rgba(255,255,255,.015);border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05);}
.pip-case-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.pip-case-side h2{font-size:clamp(28px,3.4vw,42px);line-height:1.1;font-weight:800;margin:0 0 18px;letter-spacing:-.02em;}
.pip-case-side p{font-size:15px;color:#a8a8b8;line-height:1.65;margin:0 0 26px;}
.pip-case-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.pip-case-m{padding:18px;background:rgba(255,214,10,.06);border:1px solid rgba(255,214,10,.25);border-radius:12px;text-align:center;}
.pip-case-m strong{display:block;font-size:24px;font-weight:800;color:#FFD60A;margin-bottom:4px;}
.pip-case-m span{font-size:11px;color:#8a8a98;text-transform:uppercase;letter-spacing:.06em;}
.pip-quote{background:#0c0c14;border:1px solid rgba(1,119,55,.3);border-left:4px solid #39c07a;border-radius:14px;padding:36px;margin:0;}
.pip-quote p{font-size:19px;line-height:1.55;color:#e8e8ef;font-style:italic;margin:0 0 22px;}
.pip-quote footer{font-size:13px;color:#8a8a98;}
.pip-quote footer strong{display:block;color:#FFD60A;margin-bottom:2px;font-style:normal;}

/* pricing */
.pip-pricing{padding:110px 0;}
.pip-pricing-head{max-width:720px;margin-bottom:50px;}
.pip-tiers{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
.pip-tier{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:26px 20px;position:relative;display:flex;flex-direction:column;}
.pip-tier-feat{background:linear-gradient(180deg,rgba(255,214,10,.08),rgba(255,214,10,.02));border-color:rgba(255,214,10,.4);transform:scale(1.03);}
.pip-tier-tag{position:absolute;top:-10px;left:20px;background:#FFD60A;color:#050509;font-size:10px;font-weight:800;padding:4px 10px;border-radius:999px;letter-spacing:.06em;text-transform:uppercase;}
.pip-tier-name{font-size:13px;color:#8a8a98;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px;font-weight:700;}
.pip-tier-price{font-size:40px;font-weight:800;color:#FFD60A;margin-bottom:18px;line-height:1;}
.pip-tier-price sup{font-size:12px;color:#8a8a98;vertical-align:top;margin-right:4px;font-weight:600;}
.pip-tier-price sub{font-size:12px;color:#8a8a98;vertical-align:baseline;margin-left:4px;font-weight:600;}
.pip-tier ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px;}
.pip-tier li{font-size:12px;color:#b8b8c6;padding-left:16px;position:relative;line-height:1.45;}
.pip-tier li::before{content:"+";position:absolute;left:0;top:0;color:#39c07a;font-weight:700;}

/* demo */
.pip-demo{padding:100px 0;background:rgba(255,255,255,.015);border-top:1px solid rgba(255,255,255,.05);}
.pip-video{margin-top:30px;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.08);aspect-ratio:16/9;background:#000;}
.pip-video iframe{width:100%;height:100%;border:0;display:block;}

/* recursos */
.pip-res{padding:100px 0;}
.pip-res-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:36px;}
.pip-res-card{display:block;padding:28px 24px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:14px;text-decoration:none;color:inherit;transition:transform .2s,border-color .2s;}
.pip-res-card:hover{transform:translateY(-3px);border-color:rgba(255,214,10,.4);}
.pip-res-ico{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:rgba(255,214,10,.12);color:#FFD60A;font-weight:800;font-size:18px;margin-bottom:16px;}
.pip-res-card h3{font-size:15px;margin:0 0 8px;font-weight:700;}
.pip-res-card p{font-size:12px;color:#8a8a98;line-height:1.5;margin:0;}

/* faq */
.pip-faq{padding:100px 0;background:rgba(255,255,255,.015);border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05);}
.pip-faq-list{margin-top:36px;display:flex;flex-direction:column;gap:10px;max-width:860px;}
.pip-faq-item{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:20px 24px;}
.pip-faq-item summary{font-size:15px;font-weight:700;cursor:pointer;color:#e8e8ef;list-style:none;display:flex;justify-content:space-between;align-items:center;}
.pip-faq-item summary::after{content:"+";color:#FFD60A;font-size:22px;font-weight:400;transition:transform .2s;}
.pip-faq-item[open] summary::after{transform:rotate(45deg);}
.pip-faq-item p{font-size:14px;line-height:1.6;color:#a8a8b8;margin:14px 0 0;}

/* cta */
.pip-cta{padding:120px 0;}
.pip-cta-box{background:linear-gradient(135deg,rgba(255,214,10,.08),rgba(1,119,55,.08));border:1px solid rgba(255,214,10,.3);border-radius:22px;padding:60px;text-align:center;}
.pip-cta-kicker{font-family:monospace;font-size:11px;letter-spacing:.22em;color:#39c07a;text-transform:uppercase;margin-bottom:16px;}
.pip-cta-box h2{font-size:clamp(30px,4vw,48px);line-height:1.1;font-weight:800;margin:0 0 16px;letter-spacing:-.02em;}
.pip-cta-box p{font-size:16px;color:#b8b8c6;margin:0 0 30px;}
.pip-cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* responsive */
@media (max-width:1100px){
  .pip-board{grid-template-columns:repeat(3,minmax(260px,1fr));overflow-x:auto;scroll-snap-type:x mandatory;}
  .pip-col{scroll-snap-align:start;}
  .pip-stepper{grid-template-columns:repeat(2,1fr);}
  .pip-tiers{grid-template-columns:repeat(2,1fr);}
  .pip-tier-feat{transform:none;}
  .pip-res-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:820px){
  .pip-hero{padding:30px 0 60px;}
  .pip-hero-title{font-size:38px;}
  .pip-board{grid-template-columns:repeat(5,minmax(240px,85vw));}
  .pip-stage{padding:70px 0;}
  .pip-stage-grid,.pip-stage-grid.pip-flip{grid-template-columns:1fr;gap:40px;}
  .pip-stage-grid.pip-flip .pip-stage-side{order:0;}
  .pip-stage0-grid{grid-template-columns:1fr;gap:20px;}
  .pip-feat-grid,.pip-feat-row,.pip-dash{grid-template-columns:1fr;}
  .pip-vs-row{grid-template-columns:1fr;}
  .pip-vs-row>div{border-right:none;border-bottom:1px dashed rgba(255,255,255,.06);}
  .pip-case-grid{grid-template-columns:1fr;gap:40px;}
  .pip-stepper{grid-template-columns:1fr;}
  .pip-tiers{grid-template-columns:1fr;}
  .pip-res-grid{grid-template-columns:1fr;}
  .pip-auto-list li{grid-template-columns:1fr;gap:6px;text-align:left;}
  .pip-auto-arr{display:none;}
  .pip-mail-stats{grid-template-columns:repeat(2,1fr);}
  .pip-cta-box{padding:40px 24px;}
}

/* ============================================================
   KOMMO · chat-first split skeleton (.chat-*)
   ============================================================ */
:root{
  --chat-bg:#050509;
  --chat-bg-2:#0a0a12;
  --chat-panel:#0e0e18;
  --chat-line:rgba(255,255,255,.08);
  --chat-line-2:rgba(255,255,255,.14);
  --chat-ink:#e9e9f2;
  --chat-mute:#8b8ba0;
  --chat-olpa:#FFD60A;
  --chat-cyan:#22d3ee;
  --chat-wa:#25d366;
  --chat-wa-dark:#128c7e;
  --chat-ig-a:#e4405f;
  --chat-ig-b:#f77737;
  --chat-fb:#0084ff;
  --chat-tg:#2aabee;
}
.chat-hero,.chat-band,.chat-chapters,.chat-channels,.chat-builder,
.chat-ai,.chat-vs,.chat-impl,.chat-case,.chat-pricing,.chat-demo,
.chat-res,.chat-faq,.chat-cta{background:var(--chat-bg);color:var(--chat-ink);font-family:inherit;}

/* ---- HERO ---- */
.chat-hero{position:relative;padding:110px 0 80px;overflow:hidden;border-bottom:1px solid var(--chat-line);}
.chat-hero-grain{position:absolute;inset:0;background:
  radial-gradient(800px 400px at 18% 10%,rgba(37,211,102,.10),transparent 60%),
  radial-gradient(700px 380px at 88% 30%,rgba(255,214,10,.08),transparent 65%),
  radial-gradient(500px 300px at 50% 90%,rgba(34,211,238,.06),transparent 70%);
  pointer-events:none;}
.chat-hero-inner{position:relative;max-width:1280px;margin:0 auto;padding:0 32px;z-index:2;}
.chat-crumb{display:flex;gap:10px;align-items:center;font-size:13px;color:var(--chat-mute);margin-bottom:28px;}
.chat-crumb a{color:var(--chat-mute);text-decoration:none;}
.chat-crumb a:hover{color:var(--chat-olpa);}
.chat-crumb-sep{opacity:.4;}
.chat-crumb-now{color:var(--chat-ink);}
.chat-eyebrow{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border:1px solid var(--chat-line-2);border-radius:999px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--chat-ink);background:rgba(255,255,255,.02);margin-bottom:22px;}
.chat-pulse{width:8px;height:8px;border-radius:50%;background:var(--chat-wa);box-shadow:0 0 12px var(--chat-wa);animation:chatPulse 2s ease-in-out infinite;}
@keyframes chatPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.5;transform:scale(.85);}}
.chat-h1{font-size:clamp(38px,5.2vw,66px);line-height:1.02;font-weight:800;letter-spacing:-.02em;margin:0 0 22px;max-width:920px;}
.chat-h1-dot{color:var(--chat-olpa);}
.chat-h1-accent{color:var(--chat-wa);}
.chat-lead{font-size:17px;line-height:1.65;color:var(--chat-mute);max-width:680px;margin:0 0 30px;}
.chat-cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:56px;}
.chat-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 26px;border-radius:14px;font-weight:600;font-size:15px;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease;border:1px solid transparent;}
.chat-btn-primary{background:var(--chat-olpa);color:#050509;}
.chat-btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 40px -10px rgba(255,214,10,.5);}
.chat-btn-ghost{background:transparent;color:var(--chat-ink);border-color:var(--chat-line-2);}
.chat-btn-ghost:hover{border-color:var(--chat-wa);color:var(--chat-wa);}

.chat-hero-split{display:grid;grid-template-columns:380px 1fr;gap:48px;align-items:start;}
.chat-hero-left{display:flex;justify-content:center;}
.chat-hero-right{display:flex;flex-direction:column;gap:18px;}

/* ---- PHONE FRAME ---- */
.chat-phone{position:relative;width:300px;aspect-ratio:9/19.5;background:#111;border-radius:42px;border:2px solid #1e1e28;padding:10px;box-shadow:0 40px 90px -20px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.04);}
.chat-phone-sm{width:260px;}
.chat-phone-notch{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:110px;height:22px;background:#000;border-radius:14px;z-index:3;}
.chat-phone-screen{position:relative;width:100%;height:100%;border-radius:32px;overflow:hidden;display:flex;flex-direction:column;}
.chat-wa-screen{background:linear-gradient(180deg,#0b1410 0%,#0f1e18 100%);}
.chat-wa-bar{display:flex;align-items:center;gap:10px;padding:36px 14px 10px;background:linear-gradient(180deg,#1f2c2a,#172423);border-bottom:1px solid rgba(255,255,255,.05);}
.chat-wa-avatar{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--chat-wa),var(--chat-wa-dark));display:flex;align-items:center;justify-content:center;color:#fff;font-size:11px;font-weight:700;}
.chat-wa-name{font-size:12px;color:#fff;font-weight:600;}
.chat-wa-status{font-size:10px;color:#a0c9b9;}
.chat-wa-thread{flex:1;padding:12px 10px;display:flex;flex-direction:column;gap:8px;overflow:hidden;background-image:radial-gradient(rgba(255,255,255,.015) 1px,transparent 1px);background-size:8px 8px;}
.chat-bub{position:relative;max-width:82%;padding:8px 11px 18px;border-radius:10px;font-size:11px;line-height:1.45;color:#eaf2ee;box-shadow:0 2px 6px rgba(0,0,0,.25);}
.chat-bub-in{align-self:flex-start;background:#1f2c2a;border-top-left-radius:2px;}
.chat-bub-out{align-self:flex-end;background:#055e4b;border-top-right-radius:2px;}
.chat-bub-ig{background:linear-gradient(135deg,rgba(228,64,95,.25),rgba(247,119,55,.18));border:1px solid rgba(228,64,95,.3);}
.chat-bub-time{position:absolute;bottom:4px;right:8px;font-size:8px;color:rgba(255,255,255,.55);display:flex;align-items:center;gap:3px;}
.chat-bub-check{color:#53bdeb;font-size:9px;}
.chat-bub-typing{display:inline-flex;gap:3px;padding:12px 14px;}
.chat-bub-typing span{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.6);animation:chatType 1.2s infinite;}
.chat-bub-typing span:nth-child(2){animation-delay:.15s;}
.chat-bub-typing span:nth-child(3){animation-delay:.3s;}
@keyframes chatType{0%,60%,100%{opacity:.3;transform:translateY(0);}30%{opacity:1;transform:translateY(-3px);}}
.chat-wa-input{display:flex;align-items:center;gap:8px;padding:8px 10px 14px;background:#0f1a17;border-top:1px solid rgba(255,255,255,.04);}
.chat-wa-input-box{flex:1;background:#1f2c2a;border-radius:16px;padding:6px 12px;font-size:10px;color:var(--chat-mute);}
.chat-wa-send{width:26px;height:26px;border-radius:50%;background:var(--chat-wa);display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;font-weight:700;}

/* ---- KANBAN RIGHT ---- */
.chat-kanban{background:var(--chat-panel);border:1px solid var(--chat-line);border-radius:20px;padding:22px;}
.chat-kanban-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--chat-line);}
.chat-kanban-title{font-weight:700;font-size:15px;}
.chat-kanban-users{font-size:12px;color:var(--chat-mute);}
.chat-kanban-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.chat-kcol{background:rgba(255,255,255,.02);border:1px solid var(--chat-line);border-radius:12px;padding:10px;min-height:160px;display:flex;flex-direction:column;gap:8px;}
.chat-kcol-head{display:flex;justify-content:space-between;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--chat-mute);padding-bottom:6px;border-bottom:1px solid var(--chat-line);}
.chat-kcol-n{color:var(--chat-olpa);font-weight:700;}
.chat-kcard{background:#16161f;border:1px solid var(--chat-line);border-radius:8px;padding:8px 10px;font-size:11px;}
.chat-kcard-ghost{color:var(--chat-mute);opacity:.6;}
.chat-kcard-active{background:linear-gradient(135deg,rgba(37,211,102,.12),rgba(255,214,10,.06));border-color:rgba(37,211,102,.4);box-shadow:0 8px 24px -8px rgba(37,211,102,.25);}
.chat-kcard-name{font-weight:700;color:#fff;margin-bottom:3px;}
.chat-kcard-meta{color:var(--chat-mute);font-size:10px;margin-bottom:5px;}
.chat-kcard-src{display:flex;align-items:center;gap:5px;font-size:9px;text-transform:uppercase;color:var(--chat-wa);letter-spacing:.06em;}
.chat-dot-wa{width:6px;height:6px;border-radius:50%;background:var(--chat-wa);box-shadow:0 0 8px var(--chat-wa);}

.chat-contact{background:var(--chat-panel);border:1px solid var(--chat-line);border-radius:18px;padding:18px;display:flex;gap:14px;align-items:flex-start;}
.chat-contact-avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--chat-olpa),var(--chat-wa));display:flex;align-items:center;justify-content:center;font-weight:800;color:#050509;flex-shrink:0;}
.chat-contact-name{font-weight:700;font-size:15px;display:flex;gap:10px;align-items:center;margin-bottom:4px;}
.chat-contact-tag{font-size:10px;padding:3px 8px;border-radius:999px;background:rgba(37,211,102,.15);color:var(--chat-wa);border:1px solid rgba(37,211,102,.3);text-transform:uppercase;letter-spacing:.05em;}
.chat-contact-meta{font-size:12px;color:var(--chat-mute);margin-bottom:10px;}
.chat-contact-chips{display:flex;gap:6px;flex-wrap:wrap;}
.chat-chip{font-size:10px;padding:4px 9px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid var(--chat-line);color:var(--chat-ink);}

/* ---- BAND ---- */
.chat-band{padding:40px 0;border-bottom:1px solid var(--chat-line);background:linear-gradient(90deg,rgba(37,211,102,.04),rgba(255,214,10,.04));}
.chat-band-inner{max-width:1280px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:repeat(4,1fr);gap:28px;}
.chat-band-item{display:flex;flex-direction:column;gap:6px;}
.chat-band-k{font-size:34px;font-weight:800;color:var(--chat-olpa);letter-spacing:-.02em;}
.chat-band-v{font-size:13px;color:var(--chat-mute);line-height:1.4;}

/* ---- SECTION HEAD ---- */
.chat-sec-head{max-width:820px;margin:0 auto 56px;text-align:center;padding:0 32px;}
.chat-sec-tag{display:inline-block;padding:7px 14px;border:1px solid var(--chat-line-2);border-radius:999px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--chat-olpa);margin-bottom:18px;}
.chat-sec-head h2{font-size:clamp(32px,4vw,48px);font-weight:800;line-height:1.1;letter-spacing:-.02em;margin:0 0 18px;}
.chat-sec-head p{color:var(--chat-mute);font-size:16px;line-height:1.6;}

/* ---- CHAPTERS ---- */
.chat-chapters{padding:100px 0;}
.chat-chapter{max-width:1100px;margin:0 auto 70px;padding:0 32px;display:grid;grid-template-columns:320px 1fr;gap:60px;align-items:center;}
.chat-chapter-flip{grid-template-columns:1fr 320px;}
.chat-chapter-flip .chat-chap-phone{order:2;}
.chat-chap-phone{display:flex;justify-content:center;}
.chat-chap-text h3{font-size:28px;font-weight:800;margin:8px 0 14px;letter-spacing:-.01em;}
.chat-chap-text p{color:var(--chat-mute);font-size:16px;line-height:1.7;}
.chat-chap-n{display:inline-block;font-size:13px;font-weight:800;color:var(--chat-olpa);letter-spacing:.14em;padding:4px 10px;background:rgba(255,214,10,.08);border:1px solid rgba(255,214,10,.25);border-radius:8px;}
.chat-crm-screen{background:linear-gradient(180deg,#0d0d18,#10101c);padding:40px 14px 14px;display:flex;flex-direction:column;gap:8px;}
.chat-crm-row{font-size:11px;color:var(--chat-ink);padding:9px 11px;background:rgba(255,255,255,.03);border:1px solid var(--chat-line);border-radius:8px;}
.chat-crm-row-new{border-color:rgba(37,211,102,.4);background:rgba(37,211,102,.08);}
.chat-crm-row-ok{border-color:rgba(34,211,238,.35);background:rgba(34,211,238,.07);color:var(--chat-cyan);}
.chat-crm-ico{display:inline-block;width:16px;height:16px;line-height:14px;text-align:center;border-radius:4px;background:var(--chat-wa);color:#000;font-weight:900;margin-right:6px;font-size:11px;}
.chat-crm-assign{display:flex;align-items:center;gap:10px;padding:10px;background:rgba(255,214,10,.06);border:1px solid rgba(255,214,10,.3);border-radius:10px;}
.chat-crm-av{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--chat-olpa),var(--chat-wa));display:flex;align-items:center;justify-content:center;font-weight:800;font-size:11px;color:#050509;}
.chat-crm-name{font-size:12px;font-weight:700;color:#fff;}
.chat-crm-sub{font-size:10px;color:var(--chat-mute);}
.chat-crm-pipe{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:4px;}
.chat-crm-step{font-size:9px;padding:5px 7px;border-radius:6px;background:rgba(255,255,255,.04);border:1px solid var(--chat-line);color:var(--chat-mute);}
.chat-crm-step-done{background:rgba(37,211,102,.15);border-color:rgba(37,211,102,.4);color:var(--chat-wa);}
.chat-crm-step-now{background:var(--chat-olpa);border-color:var(--chat-olpa);color:#050509;font-weight:700;}

/* ---- CHANNELS ---- */
.chat-channels{padding:100px 0;background:var(--chat-bg-2);border-top:1px solid var(--chat-line);border-bottom:1px solid var(--chat-line);}
.chat-ch-grid{max-width:1180px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
.chat-ch-tile{position:relative;padding:36px 30px;border-radius:22px;background:var(--chat-panel);border:1px solid var(--chat-line);overflow:hidden;}
.chat-ch-tile::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;}
.chat-ch-wa::before{background:var(--chat-wa);}
.chat-ch-ig::before{background:linear-gradient(90deg,var(--chat-ig-a),var(--chat-ig-b));}
.chat-ch-fb::before{background:var(--chat-fb);}
.chat-ch-tg::before{background:var(--chat-tg);}
.chat-ch-icon{width:56px;height:56px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:16px;color:#fff;text-transform:uppercase;margin-bottom:20px;}
.chat-ch-icon-wa{background:var(--chat-wa);}
.chat-ch-icon-ig{background:linear-gradient(135deg,var(--chat-ig-a),var(--chat-ig-b));}
.chat-ch-icon-fb{background:var(--chat-fb);}
.chat-ch-icon-tg{background:var(--chat-tg);}
.chat-ch-tile h3{font-size:22px;font-weight:800;margin:0 0 12px;}
.chat-ch-tile p{color:var(--chat-mute);font-size:15px;line-height:1.6;margin:0 0 18px;}
.chat-ch-olpa{padding:14px 16px;border-left:2px solid var(--chat-olpa);background:rgba(255,214,10,.04);font-size:13px;color:var(--chat-ink);border-radius:0 8px 8px 0;}

/* ---- BUILDER ---- */
.chat-builder{padding:100px 0;}
.chat-flow{max-width:860px;margin:0 auto;padding:0 32px;display:flex;flex-direction:column;align-items:center;gap:14px;}
.chat-node{padding:16px 24px;background:var(--chat-panel);border:1px solid var(--chat-line-2);border-radius:14px;font-weight:700;font-size:15px;text-align:center;min-width:220px;color:var(--chat-ink);}
.chat-node small{display:block;font-weight:400;font-size:12px;color:var(--chat-mute);margin-top:4px;}
.chat-node-start{background:linear-gradient(135deg,rgba(37,211,102,.2),rgba(37,211,102,.06));border-color:rgba(37,211,102,.5);}
.chat-node-say,.chat-node-ask{background:rgba(34,211,238,.06);border-color:rgba(34,211,238,.3);}
.chat-node-if{background:rgba(255,214,10,.08);border-color:rgba(255,214,10,.4);color:var(--chat-olpa);}
.chat-node-action{background:var(--chat-panel);}
.chat-arrow{width:2px;height:24px;background:linear-gradient(180deg,var(--chat-line-2),transparent);position:relative;}
.chat-arrow::after{content:"";position:absolute;bottom:-2px;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:var(--chat-line-2);}
.chat-arrow-v{width:2px;height:18px;background:var(--chat-line-2);margin:6px auto;}
.chat-branch{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:14px;width:100%;}
.chat-branch-col{display:flex;flex-direction:column;align-items:center;gap:10px;}
.chat-branch-label{font-size:11px;padding:5px 12px;border-radius:999px;text-transform:uppercase;letter-spacing:.08em;font-weight:700;}
.chat-branch-yes{background:rgba(37,211,102,.15);color:var(--chat-wa);border:1px solid rgba(37,211,102,.4);}
.chat-branch-no{background:rgba(228,64,95,.12);color:var(--chat-ig-a);border:1px solid rgba(228,64,95,.35);}

/* ---- AI BLOCK ---- */
.chat-ai{padding:100px 0;background:linear-gradient(180deg,var(--chat-bg) 0%,#0a0815 50%,var(--chat-bg) 100%);border-top:1px solid var(--chat-line);border-bottom:1px solid var(--chat-line);}
.chat-ai-inner{max-width:1180px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.chat-ai-left h2{font-size:clamp(30px,3.6vw,44px);font-weight:800;line-height:1.1;letter-spacing:-.02em;margin:14px 0 20px;}
.chat-ai-left p{color:var(--chat-mute);font-size:16px;line-height:1.7;margin:0 0 16px;}
.chat-ai-list{list-style:none;padding:0;margin:22px 0 0;display:flex;flex-direction:column;gap:10px;}
.chat-ai-list li{padding-left:24px;position:relative;font-size:15px;color:var(--chat-ink);}
.chat-ai-list li::before{content:"→";position:absolute;left:0;color:var(--chat-olpa);font-weight:800;}
.chat-ai-diagram{background:var(--chat-panel);border:1px solid var(--chat-line);border-radius:22px;padding:36px;display:flex;flex-direction:column;align-items:center;gap:8px;}
.chat-ai-box{width:200px;padding:16px 20px;border-radius:14px;text-align:center;font-weight:800;font-size:15px;border:1px solid var(--chat-line-2);}
.chat-ai-box small{display:block;font-weight:400;font-size:11px;color:var(--chat-mute);margin-top:3px;}
.chat-ai-box-wa{background:rgba(37,211,102,.12);border-color:rgba(37,211,102,.4);color:var(--chat-wa);}
.chat-ai-box-kommo{background:rgba(255,214,10,.1);border-color:rgba(255,214,10,.4);color:var(--chat-olpa);}
.chat-ai-box-n8n{background:rgba(228,64,95,.1);border-color:rgba(228,64,95,.35);color:var(--chat-ig-a);}
.chat-ai-box-claude{background:linear-gradient(135deg,rgba(34,211,238,.15),rgba(255,214,10,.08));border-color:rgba(34,211,238,.45);color:var(--chat-cyan);}
.chat-ai-line{width:2px;height:22px;background:var(--chat-line-2);}
.chat-ai-line-back{height:36px;background:repeating-linear-gradient(180deg,var(--chat-olpa) 0 4px,transparent 4px 8px);}
.chat-ai-return{font-size:12px;color:var(--chat-olpa);text-transform:uppercase;letter-spacing:.1em;margin-top:4px;}

/* ---- VS TABLE ---- */
.chat-vs{padding:100px 0;}
.chat-vs-wrap{max-width:1100px;margin:0 auto;padding:0 32px;}
.chat-vs-tbl{width:100%;border-collapse:separate;border-spacing:0;background:var(--chat-panel);border:1px solid var(--chat-line);border-radius:18px;overflow:hidden;}
.chat-vs-tbl th,.chat-vs-tbl td{padding:16px 20px;text-align:left;font-size:14px;border-bottom:1px solid var(--chat-line);}
.chat-vs-tbl thead th{background:rgba(255,255,255,.03);font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--chat-mute);font-weight:700;}
.chat-vs-tbl tbody td:first-child{font-weight:600;color:var(--chat-ink);}
.chat-vs-tbl tbody td{color:var(--chat-mute);}
.chat-vs-hl{background:rgba(255,214,10,.05)!important;color:var(--chat-ink)!important;border-left:1px solid rgba(255,214,10,.25);border-right:1px solid rgba(255,214,10,.25);}
.chat-vs-tbl thead .chat-vs-hl{color:var(--chat-olpa)!important;}
.chat-vs-tbl tr:last-child td{border-bottom:none;}
.chat-vs-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:26px;}
.chat-vs-note{padding:18px;border:1px solid var(--chat-line);border-radius:14px;font-size:14px;color:var(--chat-mute);line-height:1.55;}
.chat-vs-note strong{color:var(--chat-olpa);}

/* ---- IMPL THREAD ---- */
.chat-impl{padding:100px 0;background:var(--chat-bg-2);border-top:1px solid var(--chat-line);border-bottom:1px solid var(--chat-line);}
.chat-impl-thread{max-width:720px;margin:0 auto;padding:0 32px;display:flex;flex-direction:column;gap:18px;}
.chat-bub-wide{max-width:100%;font-size:14px;padding:18px 22px 32px;}
.chat-bub-wide strong{display:block;font-size:15px;color:#fff;margin-bottom:6px;letter-spacing:.01em;}
.chat-bub-wide p{margin:0;color:rgba(234,242,238,.85);line-height:1.6;}
.chat-bub-wide .chat-bub-time{bottom:10px;right:18px;}

/* ---- CASE ---- */
.chat-case{padding:100px 0;}
.chat-case-inner{max-width:880px;margin:0 auto;padding:0 32px;text-align:center;}
.chat-case-quote{font-size:clamp(22px,2.6vw,30px);font-weight:600;line-height:1.45;margin:20px 0 30px;color:var(--chat-ink);font-style:italic;border-left:3px solid var(--chat-wa);padding:10px 0 10px 28px;text-align:left;}
.chat-case-by{display:flex;gap:14px;align-items:center;justify-content:center;margin-bottom:40px;}
.chat-case-av{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,var(--chat-olpa),var(--chat-wa));display:flex;align-items:center;justify-content:center;font-weight:800;color:#050509;}
.chat-case-name{font-weight:700;}
.chat-case-meta{font-size:13px;color:var(--chat-mute);}
.chat-case-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.chat-case-m{padding:26px;border:1px solid var(--chat-line);border-radius:16px;background:var(--chat-panel);}
.chat-case-n{font-size:36px;font-weight:800;color:var(--chat-olpa);letter-spacing:-.02em;}
.chat-case-l{font-size:13px;color:var(--chat-mute);margin-top:6px;}

/* ---- PRICING ---- */
.chat-pricing{padding:100px 0;background:var(--chat-bg-2);border-top:1px solid var(--chat-line);border-bottom:1px solid var(--chat-line);}
.chat-price-grid{max-width:1100px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.chat-price{position:relative;padding:34px 28px;background:var(--chat-panel);border:1px solid var(--chat-line);border-radius:20px;}
.chat-price-hl{border-color:var(--chat-olpa);background:linear-gradient(180deg,rgba(255,214,10,.08),var(--chat-panel));transform:translateY(-6px);box-shadow:0 30px 70px -20px rgba(255,214,10,.25);}
.chat-price-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--chat-olpa);color:#050509;padding:5px 14px;border-radius:999px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;}
.chat-price-tag{font-size:13px;text-transform:uppercase;letter-spacing:.1em;color:var(--chat-mute);margin-bottom:10px;}
.chat-price-n{font-size:36px;font-weight:800;color:var(--chat-ink);margin-bottom:20px;letter-spacing:-.02em;}
.chat-price-n span{font-size:13px;color:var(--chat-mute);font-weight:400;margin-left:4px;}
.chat-price ul{list-style:none;padding:0;margin:0 0 20px;display:flex;flex-direction:column;gap:10px;border-top:1px solid var(--chat-line);padding-top:20px;}
.chat-price li{font-size:14px;color:var(--chat-mute);padding-left:20px;position:relative;}
.chat-price li::before{content:"✓";position:absolute;left:0;color:var(--chat-wa);font-weight:800;}
.chat-price-for{font-size:12px;color:var(--chat-olpa);text-transform:uppercase;letter-spacing:.08em;padding-top:14px;border-top:1px solid var(--chat-line);}

/* ---- DEMO ---- */
.chat-demo{padding:100px 0;}
.chat-demo-frame{max-width:960px;margin:0 auto;padding:0 32px;}
.chat-demo-frame iframe{width:100%;aspect-ratio:16/9;border-radius:18px;border:1px solid var(--chat-line);background:#000;}
.chat-demo a{color:var(--chat-olpa);text-decoration:none;}

/* ---- RESOURCES ---- */
.chat-res{padding:100px 0;background:var(--chat-bg-2);border-top:1px solid var(--chat-line);border-bottom:1px solid var(--chat-line);}
.chat-res-grid{max-width:1100px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.chat-res-card{display:block;padding:26px 28px;background:var(--chat-panel);border:1px solid var(--chat-line);border-radius:16px;text-decoration:none;color:var(--chat-ink);transition:border-color .2s,transform .2s;}
.chat-res-card:hover{border-color:var(--chat-olpa);transform:translateY(-3px);}
.chat-res-host{font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--chat-olpa);margin-bottom:8px;}
.chat-res-title{font-size:19px;font-weight:800;margin-bottom:6px;}
.chat-res-desc{font-size:13px;color:var(--chat-mute);line-height:1.5;}

/* ---- FAQ ---- */
.chat-faq{padding:100px 0;}
.chat-faq-list{max-width:820px;margin:0 auto;padding:0 32px;display:flex;flex-direction:column;gap:12px;}
.chat-faq-item{background:var(--chat-panel);border:1px solid var(--chat-line);border-radius:14px;padding:4px 0;}
.chat-faq-item summary{padding:18px 24px;font-weight:600;font-size:16px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;}
.chat-faq-item summary::-webkit-details-marker{display:none;}
.chat-faq-item summary::after{content:"+";font-size:22px;color:var(--chat-olpa);font-weight:300;transition:transform .2s;}
.chat-faq-item[open] summary::after{transform:rotate(45deg);}
.chat-faq-item p{margin:0;padding:0 24px 20px;color:var(--chat-mute);line-height:1.65;font-size:14px;}

/* ---- CTA FINAL ---- */
.chat-cta{padding:100px 0;background:linear-gradient(135deg,#070712,#0a0a16);border-top:1px solid var(--chat-line);}
.chat-cta-inner{max-width:1080px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:280px 1fr;gap:60px;align-items:center;}
.chat-cta-phone{display:flex;justify-content:center;}
.chat-bub-pop{animation:chatBubPop 2.4s ease-in-out infinite;}
@keyframes chatBubPop{0%,100%{transform:translateY(0);}50%{transform:translateY(-4px);}}
.chat-cta-text h2{font-size:clamp(30px,3.6vw,44px);font-weight:800;line-height:1.1;letter-spacing:-.02em;margin:16px 0 16px;}
.chat-cta-text p{color:var(--chat-mute);font-size:16px;line-height:1.65;margin:0 0 26px;max-width:540px;}
.chat-cta-btns{display:flex;gap:14px;flex-wrap:wrap;}

/* ---- RESPONSIVE ---- */
@media(max-width:1024px){
  .chat-hero-split{grid-template-columns:1fr;gap:36px;}
  .chat-hero-left{order:2;}
  .chat-kanban-cols{grid-template-columns:repeat(2,1fr);}
  .chat-ai-inner{grid-template-columns:1fr;gap:40px;}
  .chat-ch-grid{grid-template-columns:1fr;}
  .chat-band-inner{grid-template-columns:repeat(2,1fr);gap:22px;}
  .chat-price-grid{grid-template-columns:1fr;}
  .chat-price-hl{transform:none;}
  .chat-vs-notes{grid-template-columns:1fr;}
  .chat-case-metrics{grid-template-columns:1fr;}
  .chat-res-grid{grid-template-columns:1fr;}
  .chat-cta-inner{grid-template-columns:1fr;gap:40px;text-align:center;}
  .chat-cta-text p{margin-left:auto;margin-right:auto;}
  .chat-cta-btns{justify-content:center;}
}
@media(max-width:760px){
  .chat-hero{padding:80px 0 50px;}
  .chat-hero-inner{padding:0 20px;}
  .chat-h1{font-size:36px;}
  .chat-chapter,.chat-chapter-flip{grid-template-columns:1fr;gap:32px;padding:0 20px;}
  .chat-chapter-flip .chat-chap-phone{order:0;}
  .chat-band-inner{grid-template-columns:1fr;padding:0 20px;}
  .chat-vs-tbl{font-size:12px;}
  .chat-vs-tbl th,.chat-vs-tbl td{padding:12px 10px;}
  .chat-branch{grid-template-columns:1fr;gap:20px;}
  .chat-ai-box{width:180px;}
  .chat-phone{width:280px;}
}

/* ============================================================
   DOPPLER · .ema-* (email inbox + campaign builder skeleton)
   ============================================================ */
.ema-hero{background:#050509;padding:100px 0 80px;position:relative;overflow:hidden;}
.ema-hero-head{max-width:880px;margin-bottom:48px;}
.ema-eyebrow{display:inline-flex;align-items:center;gap:12px;margin-bottom:22px;}
.ema-dot{width:6px;height:6px;background:#00E5FF;border-radius:50%;box-shadow:0 0 10px #00E5FF;animation:pulse 2s infinite;}
.ema-eyebrow-txt{font-size:11px;color:#8A8A95;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.15em;}
.ema-lede{max-width:680px;color:#c4c4cd;font-size:17px;line-height:1.65;margin:20px 0 28px;}

.ema-client{margin-top:40px;background:#0b0b12;border:1px solid #1f1f2a;border-radius:14px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.55);}
.ema-client-top{display:flex;align-items:center;gap:16px;padding:12px 18px;background:#111119;border-bottom:1px solid #1f1f2a;}
.ema-dots{display:flex;gap:6px;}
.ema-dots span{width:11px;height:11px;border-radius:50%;background:#2a2a34;}
.ema-dots span:first-child{background:#ff5f57;}
.ema-dots span:nth-child(2){background:#febc2e;}
.ema-dots span:nth-child(3){background:#28c840;}
.ema-client-title{font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;color:#8A8A95;}
.ema-client-user{margin-left:auto;font-family:var(--font-mono);font-size:11px;color:#5c5c68;}
.ema-client-body{display:grid;grid-template-columns:340px 1fr;min-height:540px;}

.ema-inbox{border-right:1px solid #1f1f2a;background:#0a0a11;}
.ema-inbox-head{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #1f1f2a;}
.ema-inbox-label{font-size:12px;color:#c4c4cd;font-weight:600;text-transform:uppercase;letter-spacing:.1em;}
.ema-inbox-count{font-family:var(--font-mono);font-size:11px;color:#5c5c68;}
.ema-inbox-list{list-style:none;margin:0;padding:0;}
.ema-row{padding:14px 20px;border-bottom:1px solid #15151e;cursor:pointer;transition:background .18s;}
.ema-row:hover{background:#12121a;}
.ema-row-active{background:linear-gradient(90deg,rgba(255,214,10,.08),transparent);border-left:3px solid #FFD60A;padding-left:17px;}
.ema-row-unread .ema-row-subject{color:#fff;font-weight:700;}
.ema-row-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:6px;}
.ema-row-subject{font-family:var(--font-mono);font-size:13px;color:#d4d4dc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ema-row-date{font-family:var(--font-mono);font-size:11px;color:#5c5c68;flex-shrink:0;}
.ema-row-bot{display:flex;justify-content:space-between;align-items:center;gap:8px;}
.ema-row-meta{font-family:var(--font-mono);font-size:10px;color:#7a7a85;letter-spacing:.05em;}
.ema-chip{font-family:var(--font-mono);font-size:9px;padding:3px 7px;border-radius:10px;text-transform:uppercase;letter-spacing:.08em;border:1px solid transparent;}
.ema-chip-live{background:rgba(255,214,10,.12);color:#FFD60A;border-color:rgba(255,214,10,.35);}
.ema-chip-ok{background:rgba(0,229,255,.1);color:#00E5FF;border-color:rgba(0,229,255,.28);}
.ema-chip-auto{background:rgba(180,140,255,.1);color:#c9a6ff;border-color:rgba(180,140,255,.3);}
.ema-chip-draft{background:#1a1a22;color:#8A8A95;border-color:#2a2a34;}

.ema-preview{padding:24px 28px 28px;background:#0d0d14;}
.ema-preview-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:18px;border-bottom:1px solid #1f1f2a;}
.ema-prev-from{display:flex;gap:12px;align-items:center;}
.ema-prev-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#FFD60A,#ffaa00);display:flex;align-items:center;justify-content:center;font-weight:800;color:#050509;font-size:18px;}
.ema-prev-sender{font-size:13px;color:#d4d4dc;font-weight:600;}
.ema-prev-to{font-family:var(--font-mono);font-size:11px;color:#5c5c68;margin-top:2px;}
.ema-prev-date{font-family:var(--font-mono);font-size:11px;color:#5c5c68;}
.ema-prev-subject{font-size:22px;font-weight:800;color:#fff;padding:18px 0 16px;line-height:1.2;}
.ema-prev-hero{background:linear-gradient(135deg,#1a1a22,#0a0a11);border:1px solid #2a2a34;border-radius:10px;padding:32px 20px;text-align:center;position:relative;margin-bottom:18px;}
.ema-prev-hero-tag{position:absolute;top:8px;left:10px;font-family:var(--font-mono);font-size:9px;color:#5c5c68;letter-spacing:.1em;}
.ema-prev-hero-h{font-size:38px;font-weight:900;color:#FFD60A;letter-spacing:-.02em;line-height:1;}
.ema-prev-hero-sub{color:#c4c4cd;font-size:13px;margin-top:8px;}
.ema-prev-body{color:#b4b4bd;font-size:13px;line-height:1.65;}
.ema-prev-body p{margin:0 0 10px;}
.ema-prev-body em{color:#FFD60A;font-style:normal;background:rgba(255,214,10,.1);padding:0 4px;border-radius:3px;}
.ema-prev-cta{display:inline-block;margin:6px 0 18px;background:#FFD60A;color:#050509;padding:13px 28px;border-radius:8px;font-weight:800;font-size:13px;text-decoration:none;letter-spacing:.05em;}
.ema-prev-foot{border-top:1px solid #1f1f2a;padding-top:14px;font-family:var(--font-mono);font-size:10px;color:#5c5c68;}
.ema-prev-foot a{color:#8A8A95;}

.ema-stats-strip{background:#050509;padding:50px 0 30px;}
.ema-stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.ema-stat-box{background:#0d0d14;border:1px solid #1f1f2a;border-radius:10px;padding:24px 20px;}
.ema-stat-n{font-size:28px;font-weight:800;color:#FFD60A;letter-spacing:-.02em;margin-bottom:6px;}
.ema-stat-l{font-size:12px;color:#8A8A95;line-height:1.4;}

.ema-section{background:#050509;padding:80px 0;}
.ema-section-alt{background:#080810;}
.ema-sec-head{max-width:780px;margin:0 auto 48px;text-align:center;}
.ema-kicker{display:inline-block;font-family:var(--font-mono);font-size:11px;color:#FFD60A;letter-spacing:.18em;margin-bottom:14px;}
.ema-sec-head h2{font-size:40px;line-height:1.12;margin-bottom:14px;}
.ema-sec-sub{color:#8A8A95;font-size:15px;line-height:1.6;}

.ema-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.ema-flow-card{background:#0d0d14;border:1px solid #1f1f2a;border-radius:12px;padding:24px 22px;position:relative;}
.ema-flow-card:hover{border-color:#FFD60A;}
.ema-flow-num{font-family:var(--font-mono);font-size:11px;color:#FFD60A;letter-spacing:.15em;margin-bottom:10px;}
.ema-flow-card h3{font-size:17px;margin-bottom:14px;color:#fff;}
.ema-flow-card p{font-size:13px;color:#8A8A95;line-height:1.55;margin-top:12px;}
.ema-flow-mock{background:#050509;border:1px solid #1f1f2a;border-radius:8px;padding:14px;min-height:110px;}
.ema-mock-seg .ema-seg-row{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:11px;padding:6px 0;border-bottom:1px dashed #1f1f2a;color:#b4b4bd;}
.ema-mock-seg .ema-seg-row:last-child{border:none;}
.ema-mock-seg b{color:#FFD60A;}
.ema-mock-tpl{display:flex;flex-direction:column;gap:6px;}
.ema-tpl-block{height:14px;border-radius:3px;background:#1a1a22;}
.ema-tpl-hero{height:32px;background:linear-gradient(90deg,#1a1a22,#2a2a34);}
.ema-tpl-btn{background:#FFD60A;color:#050509;font-size:10px;font-weight:800;height:18px;display:flex;align-items:center;justify-content:center;width:60px;margin-top:4px;}
.ema-mock-sch{text-align:center;}
.ema-sch-head{font-family:var(--font-mono);font-size:10px;color:#8A8A95;letter-spacing:.1em;margin-bottom:10px;}
.ema-sch-date{font-size:14px;color:#FFD60A;font-weight:700;margin-bottom:12px;}
.ema-sch-btn{background:#FFD60A;color:#050509;font-size:11px;font-weight:700;padding:6px 14px;border-radius:5px;display:inline-block;}
.ema-mock-rep .ema-rep-line{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:11px;color:#b4b4bd;margin-top:6px;}
.ema-mock-rep b{color:#FFD60A;}
.ema-rep-bar{height:5px;background:#1a1a22;border-radius:3px;margin:4px 0 8px;overflow:hidden;}
.ema-rep-bar i{display:block;height:100%;background:linear-gradient(90deg,#FFD60A,#00E5FF);}

.ema-tree{max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;}
.ema-tree-node{background:#0d0d14;border:1px solid #1f1f2a;border-radius:10px;padding:14px 22px;text-align:center;min-width:260px;position:relative;}
.ema-node-trigger{border-color:#00E5FF;background:rgba(0,229,255,.06);}
.ema-node-email{border-color:#2a2a34;}
.ema-node-cond{border-color:#FFD60A;background:rgba(255,214,10,.05);}
.ema-node-end{border-color:#1f1f2a;opacity:.85;}
.ema-node-tag{font-family:var(--font-mono);font-size:9px;letter-spacing:.15em;color:#8A8A95;margin-bottom:4px;}
.ema-node-trigger .ema-node-tag{color:#00E5FF;}
.ema-node-cond .ema-node-tag{color:#FFD60A;}
.ema-node-body{font-size:13px;color:#d4d4dc;font-weight:600;}
.ema-tree-line{width:2px;height:28px;background:linear-gradient(180deg,#FFD60A,#1f1f2a);margin:0 auto;}
.ema-tree-line-s{width:2px;height:20px;background:#2a2a34;margin:8px auto;}
.ema-tree-split{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:22px;width:100%;position:relative;}
.ema-tree-split::before{content:"";position:absolute;top:-22px;left:25%;right:25%;height:2px;background:#2a2a34;}
.ema-tree-branch{background:#080810;border:1px dashed #1f1f2a;border-radius:10px;padding:18px;display:flex;flex-direction:column;align-items:center;}
.ema-tree-branch-yes{border-color:rgba(0,229,255,.3);}
.ema-tree-branch-no{border-color:rgba(255,95,87,.3);}
.ema-branch-label{font-family:var(--font-mono);font-size:10px;letter-spacing:.2em;padding:3px 10px;border-radius:10px;margin-bottom:14px;}
.ema-tree-branch-yes .ema-branch-label{background:rgba(0,229,255,.12);color:#00E5FF;}
.ema-tree-branch-no .ema-branch-label{background:rgba(255,95,87,.12);color:#ff8a80;}

.ema-cap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.ema-cap{background:#0d0d14;border:1px solid #1f1f2a;border-radius:12px;padding:28px 24px;transition:all .2s;}
.ema-cap:hover{border-color:#FFD60A;transform:translateY(-2px);}
.ema-cap-ico{font-family:var(--font-mono);font-size:12px;color:#FFD60A;letter-spacing:.15em;margin-bottom:14px;}
.ema-cap h3{font-size:17px;color:#fff;margin-bottom:10px;}
.ema-cap p{font-size:13px;color:#8A8A95;line-height:1.6;}

.ema-heatmap-wrap{max-width:780px;margin:0 auto;background:#0d0d14;border:1px solid #1f1f2a;border-radius:12px;padding:30px;}
.ema-heat-hours{display:grid;grid-template-columns:50px repeat(7,1fr);font-family:var(--font-mono);font-size:11px;color:#5c5c68;padding:0 0 6px 0;text-align:center;}
.ema-heatmap{width:100%;height:auto;display:block;}
.ema-heat-legend{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:20px;font-family:var(--font-mono);font-size:10px;color:#8A8A95;letter-spacing:.1em;}
.ema-heat-scale{display:flex;gap:4px;}
.ema-heat-scale i{display:block;width:18px;height:10px;background:#FFD60A;border-radius:2px;}
.ema-heat-note{margin-top:18px;font-size:13px;color:#8A8A95;line-height:1.6;text-align:center;}

.ema-vs-wrap{max-width:900px;margin:0 auto;}
.ema-vs{width:100%;border-collapse:collapse;background:#0d0d14;border:1px solid #1f1f2a;border-radius:12px;overflow:hidden;}
.ema-vs th,.ema-vs td{padding:16px 20px;text-align:left;border-bottom:1px solid #15151e;font-size:13px;color:#c4c4cd;}
.ema-vs th{background:#111119;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#8A8A95;font-family:var(--font-mono);}
.ema-vs-a{color:#FFD60A !important;}
.ema-vs-b{color:#00E5FF !important;}
.ema-vs tr:last-child td{border:none;}
.ema-ok{color:#8fe8a4 !important;font-weight:600;}
.ema-no{color:#ff8a80 !important;}
.ema-vs-verdict{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px;}
.ema-vs-verdict > div{background:#0d0d14;border:1px solid #1f1f2a;border-radius:10px;padding:18px 20px;font-size:13px;color:#b4b4bd;line-height:1.6;}
.ema-vs-verdict b{color:#FFD60A;display:block;margin-bottom:6px;}

.ema-phases{max-width:820px;margin:0 auto;list-style:none;padding:0;display:flex;flex-direction:column;gap:16px;}
.ema-phases li{background:#0d0d14;border:1px solid #1f1f2a;border-radius:12px;padding:22px 26px;border-left:3px solid #FFD60A;}
.ema-phase-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.ema-phase-n{font-family:var(--font-mono);font-size:11px;color:#FFD60A;letter-spacing:.15em;}
.ema-phase-dur{font-family:var(--font-mono);font-size:10px;color:#5c5c68;letter-spacing:.1em;}
.ema-phases h3{font-size:17px;color:#fff;margin-bottom:6px;}
.ema-phases p{font-size:13px;color:#8A8A95;line-height:1.6;}

.ema-int-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.ema-int{background:#0d0d14;border:1px solid #1f1f2a;border-radius:10px;padding:18px 16px;display:flex;align-items:center;gap:12px;transition:all .2s;}
.ema-int:hover{border-color:#FFD60A;}
.ema-int-badge{width:38px;height:38px;border-radius:8px;background:#1a1a22;border:1px solid #2a2a34;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:11px;font-weight:800;color:#FFD60A;flex-shrink:0;}
.ema-int b{display:block;font-size:13px;color:#fff;}
.ema-int i{display:block;font-size:11px;color:#5c5c68;font-style:normal;font-family:var(--font-mono);margin-top:2px;}

.ema-case{display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center;max-width:1040px;margin:0 auto;}
.ema-case-left h2{font-size:30px;margin:12px 0 18px;}
.ema-quote{font-size:16px;color:#c4c4cd;line-height:1.7;border-left:3px solid #FFD60A;padding-left:20px;font-style:italic;margin:0 0 16px;}
.ema-case-who{font-family:var(--font-mono);font-size:11px;color:#8A8A95;letter-spacing:.1em;}
.ema-case-metrics{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.ema-metric{background:#0d0d14;border:1px solid #1f1f2a;border-radius:10px;padding:22px 20px;}
.ema-metric .n{font-size:26px;font-weight:800;color:#FFD60A;margin-bottom:6px;}
.ema-metric .l{font-size:11px;color:#8A8A95;line-height:1.4;}

.ema-pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:1000px;margin:0 auto;}
.ema-plan{background:#0d0d14;border:1px solid #1f1f2a;border-radius:14px;padding:32px 26px;position:relative;}
.ema-plan-featured{border-color:#FFD60A;transform:scale(1.03);box-shadow:0 20px 50px rgba(255,214,10,.1);}
.ema-plan-flag{position:absolute;top:-11px;right:20px;background:#FFD60A;color:#050509;font-family:var(--font-mono);font-size:10px;padding:4px 12px;border-radius:10px;font-weight:800;letter-spacing:.08em;}
.ema-plan-name{font-family:var(--font-mono);font-size:12px;color:#8A8A95;letter-spacing:.15em;margin-bottom:10px;text-transform:uppercase;}
.ema-plan-price{font-size:20px;font-weight:800;color:#FFD60A;margin-bottom:20px;}
.ema-plan-price span{font-size:12px;color:#8A8A95;font-weight:400;}
.ema-plan ul{list-style:none;padding:0;margin:0;}
.ema-plan ul li{font-size:13px;color:#b4b4bd;padding:8px 0;border-bottom:1px dashed #1f1f2a;}
.ema-plan ul li:last-child{border:none;}
.ema-plan-foot{margin-top:16px;font-size:12px;color:#8A8A95;line-height:1.5;padding-top:14px;border-top:1px solid #1f1f2a;}
.ema-invoice-note{text-align:center;margin-top:22px;font-family:var(--font-mono);font-size:11px;color:#8A8A95;letter-spacing:.08em;}

.ema-video{max-width:840px;margin:0 auto;aspect-ratio:16/9;border-radius:12px;overflow:hidden;border:1px solid #1f1f2a;}
.ema-video iframe{width:100%;height:100%;border:0;}

.ema-res-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.ema-res{display:block;background:#0d0d14;border:1px solid #1f1f2a;border-radius:12px;padding:24px 22px;text-decoration:none;transition:all .2s;}
.ema-res:hover{border-color:#FFD60A;transform:translateY(-3px);}
.ema-res-tag{font-family:var(--font-mono);font-size:10px;color:#FFD60A;letter-spacing:.15em;margin-bottom:10px;}
.ema-res h3{font-size:16px;color:#fff;margin-bottom:8px;}
.ema-res p{font-size:12px;color:#8A8A95;line-height:1.5;}

.ema-faq{max-width:780px;margin:0 auto;display:flex;flex-direction:column;gap:10px;}
.ema-faq-item{background:#0d0d14;border:1px solid #1f1f2a;border-radius:10px;padding:18px 22px;}
.ema-faq-item summary{cursor:pointer;font-size:15px;color:#fff;font-weight:600;list-style:none;position:relative;padding-right:30px;}
.ema-faq-item summary::-webkit-details-marker{display:none;}
.ema-faq-item summary::after{content:"+";position:absolute;right:0;top:0;color:#FFD60A;font-size:22px;line-height:1;}
.ema-faq-item[open] summary::after{content:"−";}
.ema-faq-item p{margin:12px 0 0;font-size:13px;color:#8A8A95;line-height:1.65;}

.ema-cta-sec{padding:90px 0;}
.ema-cta-box{max-width:760px;margin:0 auto;background:linear-gradient(135deg,#0d0d14 0%,#111119 100%);border:1px solid #FFD60A;border-radius:16px;padding:54px 48px;text-align:center;box-shadow:0 30px 80px rgba(255,214,10,.08);}
.ema-cta-box h2{font-size:34px;margin:10px 0 16px;}
.ema-cta-box p{color:#b4b4bd;font-size:15px;line-height:1.65;max-width:560px;margin:0 auto 26px;}
.ema-cta-actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

@media(max-width:960px){
  .ema-client-body{grid-template-columns:1fr;}
  .ema-inbox{border-right:none;border-bottom:1px solid #1f1f2a;max-height:340px;overflow-y:auto;}
  .ema-stats-grid{grid-template-columns:repeat(2,1fr);}
  .ema-flow{grid-template-columns:repeat(2,1fr);}
  .ema-cap-grid{grid-template-columns:repeat(2,1fr);}
  .ema-int-strip{grid-template-columns:repeat(2,1fr);}
  .ema-res-grid{grid-template-columns:repeat(2,1fr);}
  .ema-case{grid-template-columns:1fr;}
  .ema-pricing{grid-template-columns:1fr;}
  .ema-plan-featured{transform:none;}
  .ema-vs-verdict{grid-template-columns:1fr;}
}
@media(max-width:640px){
  .ema-hero{padding:70px 0 50px;}
  .ema-sec-head h2{font-size:28px;}
  .ema-section{padding:60px 0;}
  .ema-stats-grid{grid-template-columns:1fr;}
  .ema-flow{grid-template-columns:1fr;}
  .ema-cap-grid{grid-template-columns:1fr;}
  .ema-int-strip{grid-template-columns:1fr;}
  .ema-res-grid{grid-template-columns:1fr;}
  .ema-case-metrics{grid-template-columns:1fr;}
  .ema-tree-split{grid-template-columns:1fr;}
  .ema-tree-split::before{display:none;}
  .ema-tree-node{min-width:0;width:100%;}
  .ema-vs th,.ema-vs td{padding:12px 14px;font-size:12px;}
  .ema-cta-box{padding:40px 24px;}
  .ema-cta-box h2{font-size:24px;}
  .ema-prev-hero-h{font-size:28px;}
}

/* ============================================================
   CALLBELL · Live multichannel inbox  (.inb-*)
   ============================================================ */
.inb-body{background:#050509;color:#e8e8f0;}
.inb-body a{color:inherit;}
:root{
  --inb-bg:#050509;
  --inb-panel:#0c0c14;
  --inb-panel-2:#111121;
  --inb-line:rgba(255,255,255,.08);
  --inb-line-2:rgba(255,255,255,.14);
  --inb-text:#e8e8f0;
  --inb-muted:#8a8aa3;
  --inb-olpa:#FFD60A;
  --inb-cyan:#22d3ee;
  --inb-wa:#25d366;
  --inb-ig:#e4405f;
  --inb-tg:#0088cc;
  --inb-ms:#0084ff;
}

@keyframes inb-pulse{
  0%{box-shadow:0 0 0 0 rgba(255,214,10,.75);transform:scale(1);}
  70%{box-shadow:0 0 0 10px rgba(255,214,10,0);transform:scale(1.1);}
  100%{box-shadow:0 0 0 0 rgba(255,214,10,0);transform:scale(1);}
}
@keyframes inb-slide-in{
  from{opacity:0;transform:translateY(8px);}
  to{opacity:1;transform:translateY(0);}
}
@keyframes inb-glow{
  0%,100%{opacity:.55;}
  50%{opacity:.9;}
}

.inb-hero{position:relative;padding:110px 0 60px;background:radial-gradient(ellipse 80% 50% at 50% 0%, #12121f 0%, #050509 70%);overflow:hidden;}
.inb-hero-glow{position:absolute;top:-200px;left:50%;transform:translateX(-50%);width:900px;height:500px;background:radial-gradient(circle, rgba(255,214,10,.15) 0%, transparent 60%);filter:blur(60px);animation:inb-glow 6s ease-in-out infinite;}
.inb-hero-wrap{position:relative;z-index:2;}
.inb-crumb{font-size:13px;color:var(--inb-muted);display:flex;gap:8px;align-items:center;margin-bottom:28px;}
.inb-crumb a{color:var(--inb-muted);text-decoration:none;transition:color .2s;}
.inb-crumb a:hover{color:var(--inb-olpa);}
.inb-crumb-now{color:var(--inb-text);}

.inb-hero-top{max-width:820px;margin-bottom:40px;}
.inb-hero-meta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:22px;}
.inb-tag{display:inline-block;padding:6px 14px;background:rgba(255,214,10,.1);border:1px solid rgba(255,214,10,.35);color:var(--inb-olpa);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;border-radius:20px;}
.inb-live{display:inline-flex;align-items:center;gap:10px;font-size:13px;color:var(--inb-muted);}
.inb-dot-live{width:8px;height:8px;background:var(--inb-wa);border-radius:50%;box-shadow:0 0 10px var(--inb-wa);animation:inb-pulse 1.8s infinite;}
.inb-h1{font-size:clamp(34px,5vw,58px);line-height:1.05;margin:0 0 18px;font-weight:800;letter-spacing:-.02em;}
.inb-h1-yellow{color:var(--inb-olpa);}
.inb-lead{font-size:17px;line-height:1.65;color:#c2c2d6;margin:0 0 28px;max-width:680px;}
.inb-hero-cta{display:flex;gap:14px;flex-wrap:wrap;}
.inb-btn{display:inline-block;padding:14px 26px;border-radius:10px;font-weight:700;font-size:14px;text-decoration:none;transition:transform .15s, box-shadow .15s;border:1px solid transparent;}
.inb-btn-primary{background:var(--inb-olpa);color:#050509;box-shadow:0 10px 30px rgba(255,214,10,.25);}
.inb-btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 40px rgba(255,214,10,.35);}
.inb-btn-ghost{background:transparent;border-color:var(--inb-line-2);color:var(--inb-text);}
.inb-btn-ghost:hover{border-color:var(--inb-olpa);color:var(--inb-olpa);}

.inb-panel{background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:18px;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.5);}
.inb-panel-head{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid var(--inb-line);background:linear-gradient(180deg,rgba(255,255,255,.02),transparent);flex-wrap:wrap;gap:14px;}
.inb-panel-title{display:flex;align-items:center;gap:10px;font-weight:700;font-size:14px;letter-spacing:.02em;}
.inb-panel-dot{width:10px;height:10px;border-radius:50%;background:var(--inb-olpa);box-shadow:0 0 12px var(--inb-olpa);animation:inb-pulse 2s infinite;}
.inb-panel-filters{display:flex;gap:8px;flex-wrap:wrap;}
.inb-chip{padding:6px 12px;border:1px solid var(--inb-line);border-radius:20px;font-size:12px;color:var(--inb-muted);cursor:default;}
.inb-chip-on{background:rgba(255,214,10,.1);border-color:rgba(255,214,10,.45);color:var(--inb-olpa);}

.inb-list{list-style:none;margin:0;padding:0;}
.inb-row{display:grid;grid-template-columns:56px 44px 1fr 120px 80px;gap:14px;align-items:center;padding:16px 22px;border-bottom:1px solid var(--inb-line);animation:inb-slide-in .5s ease both;animation-delay:var(--d,0s);animation-fill-mode:backwards;transition:background .2s;}
.inb-row:last-child{border-bottom:0;}
.inb-row:hover{background:rgba(255,255,255,.025);}
.inb-row-new{border-left:3px solid var(--inb-olpa);background:rgba(255,214,10,.04);padding-left:19px;}
.inb-channel{width:44px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:6px;font-size:11px;font-weight:800;letter-spacing:.04em;color:#fff;}
.inb-ch-wa{background:var(--inb-wa);}
.inb-ch-ig{background:var(--inb-ig);}
.inb-ch-tg{background:var(--inb-tg);}
.inb-ch-ms{background:var(--inb-ms);}
.inb-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#2a2a45,#1a1a2e);border:1px solid var(--inb-line-2);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--inb-olpa);font-size:15px;}
.inb-av-2{color:#e4405f;}
.inb-av-3{color:#22d3ee;}
.inb-av-4{color:#ffd60a;}
.inb-av-5{color:#0084ff;}
.inb-av-6{color:#e4405f;}
.inb-av-7{color:#25d366;}
.inb-av-8{color:#a78bfa;}
.inb-msg{min-width:0;}
.inb-msg-top{display:flex;justify-content:space-between;gap:12px;align-items:baseline;margin-bottom:3px;}
.inb-msg-top strong{font-size:14px;color:var(--inb-text);}
.inb-time{font-size:11px;color:var(--inb-muted);white-space:nowrap;}
.inb-msg-prev{margin:0;font-size:13px;color:#a0a0b8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.inb-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:14px;font-size:11px;font-weight:700;letter-spacing:.03em;white-space:nowrap;}
.inb-bg-new{background:rgba(255,214,10,.14);color:var(--inb-olpa);border:1px solid rgba(255,214,10,.4);}
.inb-bg-open{background:rgba(34,211,238,.1);color:var(--inb-cyan);border:1px solid rgba(34,211,238,.3);}
.inb-bg-reply{background:rgba(148,163,184,.1);color:#94a3b8;border:1px solid rgba(148,163,184,.25);}
.inb-bg-close{background:rgba(100,116,139,.08);color:#64748b;border:1px solid rgba(100,116,139,.2);}
.inb-dot-pulse{width:6px;height:6px;border-radius:50%;background:var(--inb-olpa);animation:inb-pulse 1.5s infinite;}
.inb-agent{font-size:12px;color:var(--inb-muted);text-align:right;}

.inb-stats-sec{padding:48px 0;}
.inb-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.inb-stat{padding:26px 22px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:14px;text-align:center;transition:border-color .2s;}
.inb-stat:hover{border-color:rgba(255,214,10,.35);}
.inb-stat strong{display:block;font-size:30px;color:var(--inb-olpa);font-weight:800;margin-bottom:4px;}
.inb-stat span{font-size:13px;color:var(--inb-muted);}

.inb-sec{padding:90px 0;}
.inb-sec-alt{background:#08080f;}
.inb-sec-head{max-width:760px;margin:0 auto 54px;text-align:center;}
.inb-eyebrow{display:inline-block;padding:5px 14px;background:rgba(34,211,238,.1);border:1px solid rgba(34,211,238,.3);color:var(--inb-cyan);font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;border-radius:20px;margin-bottom:18px;}
.inb-h2{font-size:clamp(28px,3.5vw,42px);font-weight:800;line-height:1.15;letter-spacing:-.015em;margin:0 0 14px;}
.inb-sub{font-size:16px;color:var(--inb-muted);line-height:1.6;margin:0;}

.inb-channels{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
.inb-chcard{padding:28px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:18px;position:relative;overflow:hidden;}
.inb-chcard::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;}
.inb-chcard-wa::before{background:var(--inb-wa);}
.inb-chcard-ig::before{background:var(--inb-ig);}
.inb-chcard-ms::before{background:var(--inb-ms);}
.inb-chcard-tg::before{background:var(--inb-tg);}
.inb-chcard h3{margin:18px 0 10px;font-size:20px;}
.inb-chcard p{color:#a0a0b8;font-size:14px;line-height:1.6;margin:0 0 16px;}
.inb-che{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:6px;}
.inb-che li{font-size:13px;color:var(--inb-muted);padding-left:18px;position:relative;}
.inb-che li::before{content:"";position:absolute;left:0;top:8px;width:8px;height:8px;border-radius:50%;background:var(--inb-olpa);}
.inb-phone{max-width:260px;padding:14px;background:#000;border:1px solid var(--inb-line-2);border-radius:14px;}
.inb-phone-bar{font-size:11px;font-weight:700;color:#fff;padding:6px 10px;border-radius:8px;margin-bottom:10px;letter-spacing:.03em;}
.inb-bar-wa{background:var(--inb-wa);}
.inb-bar-ig{background:linear-gradient(90deg,#e4405f,#f77737);}
.inb-bar-tg{background:var(--inb-tg);}
.inb-bar-ms{background:var(--inb-ms);}
.inb-phone-msg{padding:8px 12px;border-radius:10px;font-size:12px;margin-bottom:6px;max-width:85%;}
.inb-msg-in{background:#1a1a2e;color:#ddd;border-top-left-radius:3px;}
.inb-msg-out{background:rgba(255,214,10,.15);color:var(--inb-olpa);margin-left:auto;border-top-right-radius:3px;}

.inb-route{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:14px;align-items:stretch;margin-bottom:48px;}
.inb-route-step{padding:22px 18px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:14px;text-align:center;}
.inb-route-step strong{display:block;font-size:15px;margin-bottom:6px;}
.inb-route-step p{font-size:12px;color:var(--inb-muted);margin:0;line-height:1.5;}
.inb-step-num{display:inline-flex;width:28px;height:28px;align-items:center;justify-content:center;border-radius:50%;background:var(--inb-olpa);color:#050509;font-weight:800;font-size:13px;margin-bottom:10px;}
.inb-route-arrow{display:flex;align-items:center;justify-content:center;color:var(--inb-olpa);font-size:24px;font-weight:700;}
.inb-agents-demo{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.inb-agent-slot{padding:22px;background:var(--inb-panel-2);border:1px solid var(--inb-line);border-radius:14px;}
.inb-agent-slot p{font-size:13px;color:#a0a0b8;margin:12px 0 0;line-height:1.55;}
.inb-agent-head{display:flex;align-items:center;gap:12px;}
.inb-agent-head strong{display:block;font-size:15px;}
.inb-agent-head span{display:block;font-size:11px;color:var(--inb-muted);}
.inb-ag-av{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;color:#050509;}
.inb-ag-a{background:var(--inb-olpa);}
.inb-ag-b{background:var(--inb-ig);color:#fff;}
.inb-ag-c{background:var(--inb-cyan);}

.inb-board{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.inb-agent-card{padding:26px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:16px;}
.inb-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0 16px;}
.inb-kpis > div{text-align:center;}
.inb-kpis b{display:block;font-size:17px;color:var(--inb-olpa);font-weight:800;}
.inb-kpis span{display:block;font-size:10px;color:var(--inb-muted);text-transform:uppercase;letter-spacing:.06em;margin-top:3px;}
.inb-bar{width:100%;height:6px;background:rgba(255,255,255,.06);border-radius:3px;overflow:hidden;}
.inb-bar-fill{display:block;height:100%;background:linear-gradient(90deg,var(--inb-cyan),var(--inb-olpa));border-radius:3px;}

.inb-qgrid{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.inb-qbox{padding:30px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:16px;}
.inb-qbox h3{margin:0 0 18px;font-size:18px;}
.inb-qlist{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.inb-qlist li{padding:12px 14px;background:var(--inb-panel-2);border:1px solid var(--inb-line);border-radius:10px;font-size:13px;color:#bcbccf;}
.inb-qlist code{background:rgba(255,214,10,.12);color:var(--inb-olpa);padding:2px 8px;border-radius:5px;font-size:12px;margin-right:10px;font-family:ui-monospace,monospace;}
.inb-tpl{background:var(--inb-panel-2);border:1px solid var(--inb-line);border-radius:12px;overflow:hidden;}
.inb-tpl-head{padding:12px 16px;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--inb-muted);border-bottom:1px solid var(--inb-line);background:rgba(255,255,255,.02);}
.inb-tpl-item{padding:14px 16px;border-bottom:1px solid var(--inb-line);cursor:default;transition:background .15s;}
.inb-tpl-item:last-child{border-bottom:0;}
.inb-tpl-item:hover{background:rgba(255,255,255,.025);}
.inb-tpl-item b{display:block;font-size:13px;color:var(--inb-olpa);font-family:ui-monospace,monospace;margin-bottom:4px;}
.inb-tpl-item p{margin:0;font-size:12px;color:#a0a0b8;line-height:1.5;}
.inb-tpl-on{background:rgba(255,214,10,.05);border-left:3px solid var(--inb-olpa);}

.inb-caps{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.inb-cap{padding:28px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:14px;position:relative;}
.inb-cap-n{position:absolute;top:18px;right:22px;font-size:32px;color:rgba(255,214,10,.14);font-weight:800;font-family:ui-monospace,monospace;}
.inb-cap h3{margin:0 0 10px;font-size:17px;max-width:85%;}
.inb-cap p{margin:0;color:#a0a0b8;font-size:13px;line-height:1.55;}

.inb-vs{overflow-x:auto;}
.inb-vs-table{width:100%;border-collapse:collapse;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:14px;overflow:hidden;}
.inb-vs-table th,.inb-vs-table td{padding:16px 20px;text-align:left;border-bottom:1px solid var(--inb-line);font-size:14px;}
.inb-vs-table th{background:rgba(255,255,255,.03);font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--inb-muted);font-weight:700;}
.inb-vs-table tbody tr:last-child td{border-bottom:0;}
.inb-vs-table td.inb-win{color:var(--inb-olpa);font-weight:700;}

.inb-fases{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
.inb-fases li{padding:24px 20px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:14px;}
.inb-fase-n{display:inline-block;padding:4px 10px;background:var(--inb-olpa);color:#050509;font-weight:800;font-size:11px;border-radius:6px;margin-bottom:14px;}
.inb-fases h3{margin:0 0 8px;font-size:15px;}
.inb-fases p{margin:0;font-size:12px;color:var(--inb-muted);line-height:1.55;}

.inb-crm{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;padding:40px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:16px;}
.inb-crm-src,.inb-crm-hub{padding:16px 28px;border:1px solid var(--inb-line-2);border-radius:10px;font-weight:700;font-size:14px;background:var(--inb-panel-2);}
.inb-crm-src{color:var(--inb-olpa);border-color:rgba(255,214,10,.4);}
.inb-crm-hub{color:var(--inb-cyan);border-color:rgba(34,211,238,.4);}
.inb-crm-line{flex:0 0 60px;height:2px;background:linear-gradient(90deg,var(--inb-olpa),var(--inb-cyan));}
.inb-crm-dsts{display:flex;gap:10px;flex-wrap:wrap;}
.inb-crm-dsts span{padding:10px 16px;border:1px solid var(--inb-line);border-radius:8px;font-size:13px;color:#bcbccf;background:var(--inb-panel-2);}

.inb-quote{max-width:820px;margin:0 auto 40px;padding:36px 40px;background:var(--inb-panel);border:1px solid var(--inb-line);border-left:4px solid var(--inb-olpa);border-radius:14px;}
.inb-quote p{margin:0 0 14px;font-size:17px;line-height:1.65;color:#e0e0ee;font-style:italic;}
.inb-quote footer{font-size:12px;color:var(--inb-muted);text-transform:uppercase;letter-spacing:.08em;}
.inb-case-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.inb-case-stats > div{padding:22px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:12px;text-align:center;}
.inb-case-stats strong{display:block;font-size:20px;color:var(--inb-olpa);font-weight:800;margin-bottom:4px;}
.inb-case-stats span{font-size:12px;color:var(--inb-muted);}

.inb-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.inb-plan{padding:34px 28px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:16px;position:relative;}
.inb-plan-feat{border-color:rgba(255,214,10,.5);box-shadow:0 20px 60px rgba(255,214,10,.08);transform:scale(1.02);}
.inb-plan-tag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);padding:5px 14px;background:var(--inb-olpa);color:#050509;font-size:11px;font-weight:800;border-radius:20px;letter-spacing:.05em;}
.inb-plan h3{margin:0 0 12px;font-size:20px;}
.inb-price{margin-bottom:22px;}
.inb-price b{font-size:34px;color:var(--inb-olpa);font-weight:800;}
.inb-price span{color:var(--inb-muted);font-size:13px;margin-left:6px;}
.inb-plan ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;}
.inb-plan li{font-size:13px;color:#bcbccf;padding-left:20px;position:relative;}
.inb-plan li::before{content:"+";position:absolute;left:0;color:var(--inb-olpa);font-weight:800;}

.inb-video{position:relative;padding-bottom:56.25%;height:0;max-width:900px;margin:0 auto;border-radius:16px;overflow:hidden;border:1px solid var(--inb-line);}
.inb-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}

.inb-res{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.inb-res-card{padding:26px;background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:14px;text-decoration:none;color:inherit;transition:border-color .2s,transform .2s;display:block;}
.inb-res-card:hover{border-color:var(--inb-olpa);transform:translateY(-3px);}
.inb-res-card strong{display:block;font-size:15px;margin-bottom:6px;color:var(--inb-olpa);}
.inb-res-card span{font-size:12px;color:var(--inb-muted);}

.inb-faq{max-width:820px;margin:0 auto;display:flex;flex-direction:column;gap:12px;}
.inb-faq details{background:var(--inb-panel);border:1px solid var(--inb-line);border-radius:12px;padding:18px 22px;transition:border-color .2s;}
.inb-faq details[open]{border-color:rgba(255,214,10,.4);}
.inb-faq summary{cursor:pointer;font-weight:700;font-size:15px;list-style:none;display:flex;justify-content:space-between;align-items:center;}
.inb-faq summary::-webkit-details-marker{display:none;}
.inb-faq summary::after{content:"+";color:var(--inb-olpa);font-size:22px;font-weight:400;transition:transform .2s;}
.inb-faq details[open] summary::after{transform:rotate(45deg);}
.inb-faq p{margin:12px 0 0;font-size:14px;color:#a0a0b8;line-height:1.65;}

.inb-cta{padding:90px 0;background:radial-gradient(ellipse 60% 80% at 50% 50%, #12121f 0%, #050509 70%);}
.inb-cta-wrap{max-width:720px;margin:0 auto;text-align:center;padding:56px 40px;background:var(--inb-panel);border:1px solid rgba(255,214,10,.3);border-radius:20px;box-shadow:0 40px 100px rgba(255,214,10,.08);}
.inb-cta h2{font-size:clamp(26px,3vw,36px);margin:0 0 16px;font-weight:800;}
.inb-cta p{color:#bcbccf;font-size:15px;line-height:1.65;margin:0 0 28px;}
.inb-cta-btns{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;}

@media(max-width:980px){
  .inb-hero{padding:90px 0 40px;}
  .inb-row{grid-template-columns:44px 36px 1fr;grid-template-rows:auto auto;gap:10px;padding:14px 16px;}
  .inb-row .inb-badge{grid-column:2/4;justify-self:start;}
  .inb-row .inb-agent{grid-column:1/2;grid-row:2;text-align:left;}
  .inb-panel-head{padding:14px 16px;}
  .inb-panel-filters{display:none;}
  .inb-stats{grid-template-columns:repeat(2,1fr);}
  .inb-channels,.inb-qgrid{grid-template-columns:1fr;}
  .inb-route{grid-template-columns:1fr;}
  .inb-route-arrow{transform:rotate(90deg);}
  .inb-agents-demo{grid-template-columns:1fr;}
  .inb-board{grid-template-columns:1fr;}
  .inb-caps{grid-template-columns:1fr;}
  .inb-fases{grid-template-columns:1fr;}
  .inb-case-stats{grid-template-columns:repeat(2,1fr);}
  .inb-plans{grid-template-columns:1fr;}
  .inb-plan-feat{transform:none;}
  .inb-res{grid-template-columns:repeat(2,1fr);}
  .inb-crm{flex-direction:column;}
  .inb-crm-line{width:2px;height:30px;flex:none;background:linear-gradient(180deg,var(--inb-olpa),var(--inb-cyan));}
  .inb-sec{padding:60px 0;}
  .inb-cta-wrap{padding:40px 24px;}
  .inb-vs-table th,.inb-vs-table td{padding:12px 14px;font-size:13px;}
}
@media(max-width:560px){
  .inb-stats{grid-template-columns:1fr;}
  .inb-kpis{grid-template-columns:repeat(2,1fr);}
  .inb-case-stats{grid-template-columns:1fr;}
  .inb-hero-cta{flex-direction:column;}
  .inb-btn{width:100%;text-align:center;}
}

/* ===== Programas IA empresas · flowchart hero ===== */
.cl-ppia-hero{position:relative;overflow:hidden}
.cl-ppia-hero .hero-grid{align-items:center}
.ppia-flow{position:relative;max-width:480px;margin:0 auto;padding:22px 22px 18px;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.25)!important;overflow:hidden}
.ppia-flow::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 0%,rgba(255,214,10,.08),transparent 60%);pointer-events:none}
.ppia-head{display:flex;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px solid var(--border);margin-bottom:14px;position:relative}
.ppia-title{font-family:var(--font-display);font-weight:600;font-size:14px;color:var(--text);flex:1}
.ppia-sub{font-size:10px;color:var(--text-2);font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.1em}
.ppia-badge{font-family:var(--font-mono);font-size:9px;color:#22c55e;background:rgba(34,197,94,.12);padding:4px 9px;border-radius:999px;letter-spacing:.1em;border:1px solid rgba(34,197,94,.3);font-weight:700}
.ppia-svg{display:block;width:100%;height:auto;position:relative;z-index:1}
.ppia-svg .ppia-arrow{fill:none;stroke:rgba(255,214,10,.35);stroke-width:1.6;stroke-dasharray:4 4;animation:ppiaDash 12s linear infinite}
@keyframes ppiaDash{to{stroke-dashoffset:-80}}
.ppia-svg .ppia-node rect{fill:var(--surface);stroke:var(--border);stroke-width:1;transition:all .3s}
.ppia-svg .ppia-node .ppia-num{fill:var(--text-2);font-family:var(--font-mono);font-size:10px;font-weight:700;text-anchor:middle;letter-spacing:.08em}
.ppia-svg .ppia-node .ppia-lbl{fill:var(--text);font-family:var(--font-display);font-size:11px;font-weight:600;text-anchor:middle}
.ppia-svg .ppia-done rect{fill:rgba(34,197,94,.08);stroke:rgba(34,197,94,.35)}
.ppia-svg .ppia-done .ppia-num{fill:#22c55e}
.ppia-svg .ppia-now rect{fill:rgba(255,214,10,.1);stroke:rgba(255,214,10,.55);filter:drop-shadow(0 0 8px rgba(255,214,10,.35));animation:ppiaPulse 2.2s ease-in-out infinite}
.ppia-svg .ppia-now .ppia-num{fill:var(--olpa)}
.ppia-svg .ppia-now .ppia-lbl{fill:var(--olpa)}
@keyframes ppiaPulse{0%,100%{filter:drop-shadow(0 0 4px rgba(255,214,10,.25))}50%{filter:drop-shadow(0 0 14px rgba(255,214,10,.55))}}
.ppia-svg .ppia-pending rect{fill:rgba(255,255,255,.02);stroke:var(--border);stroke-dasharray:3 3}
.ppia-svg .ppia-pending .ppia-num,.ppia-svg .ppia-pending .ppia-lbl{fill:var(--muted)}
.ppia-legend{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding-top:12px;border-top:1px solid var(--border);margin-top:10px}
.ppia-chip{font-family:var(--font-mono);font-size:9px;text-transform:uppercase;letter-spacing:.08em;padding:4px 9px;border-radius:999px;border:1px solid var(--border);color:var(--text-2)}
.ppia-chip-done{color:#22c55e;border-color:rgba(34,197,94,.35);background:rgba(34,197,94,.08)}
.ppia-chip-now{color:var(--olpa);border-color:rgba(255,214,10,.45);background:rgba(255,214,10,.08)}
.ppia-chip-pending{color:var(--muted)}
.ppia-foot{margin-top:10px;font-size:10px;color:var(--muted);text-align:center;font-family:var(--font-mono);letter-spacing:.04em}
@media (max-width:900px){.ppia-flow{max-width:100%}}

/* ============ CURSOS IA · HERO CATÁLOGO ============ */
.cl-cur-hero{position:relative;overflow:hidden;}
.cl-cur-hero .hero-blob-1{background:radial-gradient(circle,rgba(255,214,10,.18),transparent 60%);}
.cl-cur-hero .hero-blob-2{background:radial-gradient(circle,rgba(0,229,255,.14),transparent 60%);}

.cur-catalog{padding:0;border-radius:18px;overflow:hidden;background:rgba(10,10,18,.72);border:1px solid rgba(255,255,255,.08);box-shadow:0 40px 120px rgba(0,0,0,.5);}
.cur-cat-head{display:flex;align-items:center;gap:8px;padding:12px 16px;background:rgba(255,255,255,.03);border-bottom:1px solid rgba(255,255,255,.06);}
.cur-cat-head .make-dot{width:11px;height:11px;border-radius:50%;background:#ff5f57;display:inline-block;}
.cur-cat-title{margin-left:14px;font-family:var(--font-mono);font-size:11px;letter-spacing:.18em;color:var(--text-2);text-transform:uppercase;}

.cur-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:rgba(255,255,255,.06);padding:1px;}
.cur-tile{position:relative;background:linear-gradient(160deg,rgba(18,18,28,.92),rgba(10,10,18,.92));padding:18px 16px 16px;min-height:138px;display:flex;flex-direction:column;gap:6px;transition:background .25s,transform .25s;}
.cur-tile:hover{background:linear-gradient(160deg,rgba(255,214,10,.08),rgba(10,10,18,.92));}
.cur-num{font-family:var(--font-mono);font-size:11px;color:var(--olpa);font-weight:700;letter-spacing:.08em;}
.cur-type{display:inline-block;align-self:flex-start;font-family:var(--font-mono);font-size:9px;letter-spacing:.14em;padding:3px 7px;border-radius:4px;background:rgba(0,229,255,.1);color:#00E5FF;border:1px solid rgba(0,229,255,.25);text-transform:uppercase;}
.cur-name{font-size:14px;font-weight:700;color:#fff;line-height:1.3;margin-top:2px;}
.cur-duration{font-size:11px;color:var(--text-2);font-family:var(--font-mono);}
.cur-slots{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--text-2);font-family:var(--font-mono);margin-top:auto;}
.cur-dot{width:7px;height:7px;border-radius:50%;display:inline-block;box-shadow:0 0 8px currentColor;}
.cur-dot-ok{background:#22c55e;color:#22c55e;}
.cur-dot-warn{background:#febc2e;color:#febc2e;}
.cur-dot-full{background:#ff5f57;color:#ff5f57;}

.cur-cat-foot{padding:12px 16px;border-top:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.02);font-family:var(--font-mono);font-size:11px;color:var(--text-2);letter-spacing:.04em;}
.cur-cat-foot strong{color:var(--olpa);}

@media(max-width:980px){
  .cur-grid{grid-template-columns:repeat(2,1fr);}
  .cur-tile{min-height:124px;padding:14px 12px;}
  .cur-name{font-size:13px;}
}
@media(max-width:560px){
  .cur-grid{grid-template-columns:1fr;}
}

/* ================= CAPACITACIÓN IN-COMPANY ================= */
.cl-cic-hero{position:relative;overflow:hidden}
.cl-cic-hero .hero-blob-1{background:radial-gradient(circle,rgba(255,214,10,.22),transparent 60%)}
.cl-cic-hero .hero-blob-2{background:radial-gradient(circle,rgba(0,229,255,.18),transparent 60%)}

.cic-tracker{padding:0;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 80px rgba(0,0,0,.45)}
.cic-head{display:flex;align-items:center;gap:8px;padding:14px 18px;background:rgba(0,0,0,.35);border-bottom:1px solid rgba(255,255,255,.06)}
.cic-head .make-dot{width:11px;height:11px;border-radius:50%;background:#ff5f57;display:inline-block}
.cic-title{margin-left:12px;font-family:var(--font-mono);font-size:12px;color:var(--text-2);text-transform:lowercase;letter-spacing:.04em;flex:1}
.cic-live{font-family:var(--font-mono);font-size:10px;letter-spacing:.18em;color:#22c55e;padding:3px 8px;border:1px solid rgba(34,197,94,.4);border-radius:4px;background:rgba(34,197,94,.08)}
.cic-body{padding:20px 18px;display:flex;flex-direction:column;gap:16px;background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(0,0,0,.15))}

.cic-track{padding:16px 18px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);transition:border-color .3s}
.cic-track:hover{border-color:rgba(255,214,10,.25)}
.cic-track-top{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.cic-track-name{font-size:14px;font-weight:600;color:var(--text-1)}
.cic-track-count{font-family:var(--font-mono);font-size:11px;color:var(--text-2);padding:3px 8px;background:rgba(255,255,255,.04);border-radius:4px;border:1px solid rgba(255,255,255,.06)}
.cic-sessions{display:flex;gap:8px;margin-bottom:10px}
.cic-dot{width:14px;height:14px;border-radius:50%;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);display:inline-block}
.cic-dot-done{background:#22c55e;border-color:#22c55e;box-shadow:0 0 8px rgba(34,197,94,.4)}
.cic-dot-now{background:var(--olpa,#FFD60A);border-color:var(--olpa,#FFD60A);box-shadow:0 0 12px rgba(255,214,10,.6);animation:pulse 2s infinite}
.cic-track-meta{display:flex;align-items:center;justify-content:space-between;font-family:var(--font-mono);font-size:10px;color:var(--text-2);text-transform:uppercase;letter-spacing:.1em}
.cic-status-run{color:#22c55e}
.cic-footer{padding:12px 18px;border-top:1px solid rgba(255,255,255,.06);background:rgba(0,0,0,.25);font-family:var(--font-mono);font-size:10px;color:var(--text-2);text-align:center;text-transform:lowercase;letter-spacing:.05em}

@media(max-width:768px){
  .cic-track-top{flex-direction:column;align-items:flex-start;gap:6px}
  .cic-sessions{gap:6px}
  .cic-dot{width:12px;height:12px}
}

/* ==========================================================================
   CL-ODOO HERO · Grid de módulos Odoo (herramientas/odoo.html)
   ========================================================================== */
.cl-odoo-hero .hero-glow{color:var(--olpa)}
.cl-odoo-hero .hero-blob-1{background:radial-gradient(circle,rgba(155,93,229,.22),transparent 70%)}
.cl-odoo-hero .hero-blob-2{background:radial-gradient(circle,rgba(0,229,255,.15),transparent 70%)}

.odo-mock{
  position:relative;padding:22px;border-radius:22px;
  background:linear-gradient(180deg,rgba(155,93,229,.06),rgba(0,0,0,.35));
  border:1px solid rgba(155,93,229,.25);
  box-shadow:0 30px 80px -30px rgba(155,93,229,.35),inset 0 1px 0 rgba(255,255,255,.05);
}
.odo-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  padding-bottom:18px;margin-bottom:18px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.odo-title-top{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--text-1);font-weight:700;
}
.odo-title-sub{
  font-size:12px;color:var(--text-2);margin-top:4px;
}
.odo-badge{
  flex-shrink:0;font-family:var(--font-mono);font-size:10px;font-weight:700;
  letter-spacing:.1em;padding:6px 10px;border-radius:999px;
  background:linear-gradient(135deg,rgba(155,93,229,.25),rgba(255,214,10,.2));
  border:1px solid rgba(255,214,10,.45);color:#ffd60a;
  text-transform:uppercase;white-space:nowrap;
  box-shadow:0 0 18px rgba(255,214,10,.25);
}
.odo-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
}
.odo-tile{
  position:relative;aspect-ratio:1/1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;padding:10px 6px;border-radius:14px;
  background:linear-gradient(160deg,rgba(155,93,229,.1),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
  transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease;
  overflow:hidden;
}
.odo-tile::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 0%,rgba(155,93,229,.18),transparent 70%);
  opacity:0;transition:opacity .35s ease;
}
.odo-tile:hover{
  transform:translateY(-3px);
  border-color:rgba(155,93,229,.55);
  box-shadow:0 18px 40px -20px rgba(155,93,229,.55);
}
.odo-tile:hover::before{opacity:1}
.odo-letter{
  position:relative;z-index:1;
  font-family:var(--font-display,var(--font-mono));
  font-size:26px;font-weight:800;line-height:1;
  color:var(--olpa);
  text-shadow:0 0 18px rgba(155,93,229,.55);
  letter-spacing:-.02em;
}
.odo-name{
  position:relative;z-index:1;
  font-size:10px;font-weight:600;color:var(--text-2);
  text-transform:uppercase;letter-spacing:.06em;text-align:center;
}
.odo-foot{
  margin-top:16px;padding-top:14px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-family:var(--font-mono);font-size:11px;color:var(--text-2);
  text-align:center;line-height:1.5;
}
@media(max-width:720px){
  .odo-grid{grid-template-columns:repeat(3,1fr);}
  .odo-letter{font-size:22px}
  .odo-head{flex-direction:column;align-items:flex-start}
}
@media(max-width:420px){
  .odo-grid{grid-template-columns:repeat(2,1fr);}
}

/* ============================================================
   MAKE · herramientas/make.html  (.cl-mke-hero + .mke-scenario)
   ============================================================ */
.cl-mke-hero{position:relative}
.cl-mke-hero .hero-blob-1{background:radial-gradient(circle,rgba(168,85,247,.28),transparent 70%)}
.cl-mke-hero .hero-blob-2{background:radial-gradient(circle,rgba(0,229,255,.18),transparent 70%)}

.mke-scenario{
  padding:0;overflow:hidden;max-width:500px;margin:0 auto;
  border-radius:22px;
  background:rgba(10,10,18,.95)!important;
  border:1px solid rgba(168,85,247,.28)!important;
  box-shadow:0 30px 80px rgba(168,85,247,.12);
}
.mke-head{
  display:flex;align-items:center;gap:8px;
  padding:14px 18px;
  background:rgba(255,255,255,.02);
  border-bottom:1px solid var(--border);
}
.mke-head .make-dot{width:12px;height:12px;border-radius:50%;background:#ff5f57}
.mke-title{
  flex:1;font-family:var(--font-mono);font-size:11px;
  color:var(--muted);text-transform:uppercase;letter-spacing:.1em;
  margin-left:8px;
}
.mke-count{
  font-family:var(--font-mono);font-size:10px;
  color:#a855f7;background:rgba(168,85,247,.12);
  padding:3px 8px;border-radius:99px;
  border:1px solid rgba(168,85,247,.3);
  text-transform:uppercase;letter-spacing:.06em;
}
.mke-canvas{position:relative;padding:20px;min-height:440px}
.mke-svg{position:absolute;inset:20px;width:calc(100% - 40px);height:calc(100% - 40px);pointer-events:none}
.mke-arrow{stroke-dasharray:6 6;stroke-dashoffset:12;animation:dashFlow 3.5s linear infinite}
.mke-node{
  position:absolute;display:flex;flex-direction:column;
  align-items:center;gap:6px;z-index:2;
}
.mke-ico{
  width:58px;height:58px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:22px;
  background:rgba(168,85,247,.12);
  border:2px solid #a855f7;
  box-shadow:0 0 22px rgba(168,85,247,.22),inset 0 0 12px rgba(168,85,247,.08);
  backdrop-filter:blur(6px);
  transition:transform .3s ease;
}
.mke-node:hover .mke-ico{transform:scale(1.08)}
.mke-label{
  font-family:var(--font-mono);font-size:9px;
  color:var(--text);text-transform:uppercase;letter-spacing:.06em;
  background:rgba(10,10,18,.85);
  padding:2px 6px;border-radius:4px;
  border:1px solid var(--border);
  white-space:nowrap;
}
.mke-footer{
  padding:12px 20px;
  background:rgba(168,85,247,.05);
  border-top:1px solid var(--border);
  font-size:10px;color:var(--muted);
  text-align:center;font-family:var(--font-mono);
}

@media(max-width:720px){
  .mke-scenario{max-width:100%}
  .mke-canvas{min-height:380px;transform:scale(.88);transform-origin:top center}
  .mke-ico{width:50px;height:50px;font-size:18px}
}

/* ============================================
   SHOPIFY CLUSTER (herramientas/shopify.html)
   ============================================ */
.cl-shp-hero .hero-blob-1{background:radial-gradient(circle,rgba(149,191,71,.28),transparent 60%)}
.cl-shp-hero .hero-blob-2{background:radial-gradient(circle,rgba(95,191,71,.22),transparent 60%)}

.shp-admin{
  position:relative;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(149,191,71,.22);
  background:linear-gradient(180deg,rgba(15,18,22,.92),rgba(10,12,16,.96));
  box-shadow:0 40px 90px -40px rgba(149,191,71,.35),0 0 0 1px rgba(255,255,255,.04) inset;
  font-family:var(--font-sans,system-ui);
}
.shp-topbar{
  display:flex;align-items:center;gap:8px;
  padding:10px 14px;
  background:rgba(255,255,255,.035);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.shp-topbar .make-dot{width:10px;height:10px;border-radius:50%;background:#ff5f57;display:inline-block}
.shp-topbar-title{
  margin-left:10px;
  font-family:var(--font-mono);font-size:11px;
  color:var(--text-2);letter-spacing:.04em;
}
.shp-body{
  display:grid;
  grid-template-columns:170px 1fr;
  min-height:420px;
}
.shp-sidebar{
  background:rgba(255,255,255,.025);
  border-right:1px solid rgba(255,255,255,.06);
  padding:14px 10px;
}
.shp-logo{
  display:flex;align-items:center;gap:8px;
  padding:6px 8px 14px;
  border-bottom:1px dashed rgba(255,255,255,.08);
  margin-bottom:10px;
}
.shp-logo-s{
  width:26px;height:26px;border-radius:7px;
  display:grid;place-items:center;
  background:linear-gradient(135deg,#95BF47,#5E8E3E);
  color:#0a0c10;font-weight:900;font-size:14px;
}
.shp-logo-name{font-size:12px;font-weight:700;color:var(--text-1,#fff);letter-spacing:.01em}
.shp-menu{display:flex;flex-direction:column;gap:2px}
.shp-item{
  display:flex;align-items:center;gap:9px;
  padding:8px 10px;
  border-radius:7px;
  font-size:12px;font-weight:500;
  color:var(--text-2,#9aa3ad);
  cursor:default;transition:background .2s,color .2s;
}
.shp-item:hover{background:rgba(255,255,255,.04);color:var(--text-1,#fff)}
.shp-item .shp-ico{
  display:inline-grid;place-items:center;
  width:16px;height:16px;font-size:12px;opacity:.85;
}
.shp-item-active{
  background:rgba(149,191,71,.12);
  color:#cfe9a3;
  box-shadow:inset 2px 0 0 #95BF47;
}
.shp-item-active .shp-ico{color:#95BF47;opacity:1}
.shp-badge{
  margin-left:auto;
  font-size:10px;font-weight:700;
  background:rgba(149,191,71,.2);color:#cfe9a3;
  padding:1px 6px;border-radius:20px;
}
.shp-main{padding:18px 20px;display:flex;flex-direction:column;gap:14px}
.shp-main-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.shp-crumbs{
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-2);text-transform:uppercase;letter-spacing:.08em;
}
.shp-h4{
  margin:4px 0 0;
  font-size:15px;font-weight:700;color:var(--text-1,#fff);
}
.shp-live{
  font-family:var(--font-mono);font-size:10px;font-weight:700;
  color:#95BF47;letter-spacing:.1em;
  padding:4px 8px;border-radius:20px;
  background:rgba(149,191,71,.12);
  border:1px solid rgba(149,191,71,.3);
}
.shp-sales{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  border-radius:12px;
  padding:14px 16px;
}
.shp-sales-label{
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-2);text-transform:uppercase;letter-spacing:.08em;
}
.shp-amount{
  margin-top:4px;
  font-size:24px;font-weight:800;color:var(--text-1,#fff);
  display:flex;align-items:baseline;gap:10px;
  font-family:var(--font-display,system-ui);
  letter-spacing:-.01em;
}
.shp-delta{
  font-size:11px;font-weight:700;
  color:#95BF47;
  font-family:var(--font-mono);
}
.shp-spark{width:100%;height:60px;margin-top:6px;display:block}
.shp-metrics{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
}
.shp-metric{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  border-radius:10px;
  padding:10px 10px 9px;
  transition:border-color .25s,transform .25s;
}
.shp-metric:hover{
  border-color:rgba(149,191,71,.35);
  transform:translateY(-2px);
}
.shp-m-l{
  font-family:var(--font-mono);font-size:9px;
  color:var(--text-2);text-transform:uppercase;letter-spacing:.08em;
}
.shp-m-n{
  margin-top:2px;
  font-size:15px;font-weight:800;color:var(--text-1,#fff);
  font-family:var(--font-display,system-ui);
}
.shp-m-d{
  font-size:10px;font-weight:600;color:#95BF47;
  font-family:var(--font-mono);
}
.shp-foot{
  padding:10px 16px;
  border-top:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.02);
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-2);text-align:center;letter-spacing:.03em;
}
@media(max-width:720px){
  .shp-body{grid-template-columns:1fr}
  .shp-sidebar{
    display:flex;overflow-x:auto;gap:6px;
    border-right:none;border-bottom:1px solid rgba(255,255,255,.06);
    padding:10px;
  }
  .shp-logo{display:none}
  .shp-menu{flex-direction:row;gap:4px}
  .shp-item{white-space:nowrap;padding:6px 10px;font-size:11px}
  .shp-metrics{grid-template-columns:repeat(2,1fr)}
  .shp-amount{font-size:20px}
}

/* ============================================================
   WORDPRESS · herramientas/wordpress.html  (.cl-wp-hero + .wpa-admin)
   ============================================================ */
.cl-wp-hero .hero-blob-1{background:radial-gradient(circle,rgba(33,117,155,.35),transparent 70%)}
.cl-wp-hero .hero-blob-2{background:radial-gradient(circle,rgba(155,93,229,.28),transparent 70%)}
.cl-wp-hero .hero-glow{
  color:#21759b;
  text-shadow:0 0 28px rgba(33,117,155,.55),0 0 60px rgba(33,117,155,.25);
}

.wpa-admin{
  display:grid;
  grid-template-columns:150px 1fr;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(16,22,36,.92),rgba(10,14,24,.92));
  box-shadow:0 40px 90px -40px rgba(0,0,0,.75),0 0 0 1px rgba(33,117,155,.12);
  min-height:460px;
  font-family:var(--font-sans,system-ui,sans-serif);
}
.wpa-sidebar{
  background:linear-gradient(180deg,#1d2327,#13181c);
  border-right:1px solid rgba(255,255,255,.05);
  padding:18px 0 20px;
  display:flex;flex-direction:column;
}
.wpa-logo{
  width:34px;height:34px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%,#21759b,#0f3b52);
  color:#fff;display:grid;place-items:center;
  font-family:var(--font-display,serif);font-weight:700;font-size:18px;
  margin:0 auto 18px;
  box-shadow:0 0 20px rgba(33,117,155,.55);
}
.wpa-menu{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:2px;
}
.wpa-item{
  display:flex;align-items:center;gap:10px;
  padding:9px 14px;
  font-size:12px;color:rgba(255,255,255,.62);
  border-left:3px solid transparent;
  transition:background .2s,color .2s;
  cursor:default;
}
.wpa-item:hover{color:#fff;background:rgba(255,255,255,.03)}
.wpa-item-active{
  background:#0073aa;
  color:#fff;
  border-left-color:#00a0d2;
  box-shadow:inset 0 0 20px rgba(0,160,210,.2);
}
.wpa-ico{
  display:inline-block;width:16px;text-align:center;
  font-size:12px;opacity:.85;
}

.wpa-main{
  padding:18px 22px 20px;
  display:flex;flex-direction:column;gap:16px;
  background:
    radial-gradient(1200px 400px at 80% -10%,rgba(33,117,155,.12),transparent 60%),
    linear-gradient(180deg,rgba(18,24,38,.6),rgba(10,14,24,.6));
}
.wpa-topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding-bottom:12px;border-bottom:1px dashed rgba(255,255,255,.08);
}
.wpa-crumb{
  font-family:var(--font-mono);font-size:11px;
  color:var(--text-2);text-transform:uppercase;letter-spacing:.08em;
}
.wpa-live{
  font-family:var(--font-mono);font-size:10px;
  color:#22c55e;letter-spacing:.12em;
  text-shadow:0 0 10px rgba(34,197,94,.5);
}

.wpa-score{
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:18px 18px 16px;
  background:linear-gradient(180deg,rgba(33,117,155,.08),rgba(33,117,155,.02));
  display:flex;flex-direction:column;gap:16px;
  flex:1;
}
.wpa-score-head{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
.wpa-score-title{
  font-size:14px;font-weight:700;color:#fff;
  font-family:var(--font-display,inherit);
}
.wpa-score-sub{
  font-size:10px;color:var(--text-2);
  text-transform:uppercase;letter-spacing:.1em;
  margin-top:3px;
}
.wpa-score-ring{
  width:78px;height:78px;border-radius:50%;
  display:grid;place-items:center;
  background:conic-gradient(#22c55e 0 97%,rgba(255,255,255,.08) 97% 100%);
  box-shadow:0 0 30px rgba(34,197,94,.35),inset 0 0 0 1px rgba(255,255,255,.06);
  position:relative;
}
.wpa-score-ring::before{
  content:"";position:absolute;inset:6px;border-radius:50%;
  background:#0b0f1a;
}
.wpa-score-num{
  position:relative;z-index:1;
  font-family:var(--font-display,var(--font-mono));
  font-size:20px;font-weight:800;color:#22c55e;
  line-height:1;text-align:center;
}
.wpa-score-num span{
  font-size:10px;color:var(--text-2);font-weight:500;
  display:block;margin-top:2px;
}

.wpa-metrics{
  display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;
}
.wpa-metric{display:flex;flex-direction:column;gap:6px}
.wpa-metric-head{
  display:flex;align-items:center;justify-content:space-between;
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-2);text-transform:uppercase;letter-spacing:.08em;
}
.wpa-metric-head strong{color:#fff;font-weight:700;font-size:11px}
.wpa-bar{
  height:5px;border-radius:3px;
  background:rgba(255,255,255,.06);
  overflow:hidden;position:relative;
}
.wpa-bar i{
  display:block;height:100%;
  background:linear-gradient(90deg,#21759b,#22c55e);
  border-radius:3px;
  box-shadow:0 0 12px rgba(34,197,94,.4);
}
.wpa-foot{
  font-family:var(--font-mono);font-size:10px;
  color:var(--text-2);text-align:center;padding-top:4px;
}

@media(max-width:720px){
  .wpa-admin{grid-template-columns:120px 1fr;min-height:auto}
  .wpa-item{font-size:11px;padding:8px 10px}
  .wpa-main{padding:14px 14px 16px}
  .wpa-score-ring{width:64px;height:64px}
  .wpa-score-num{font-size:17px}
}
@media(max-width:480px){
  .wpa-admin{grid-template-columns:1fr}
  .wpa-sidebar{
    flex-direction:row;overflow-x:auto;
    padding:10px 8px;border-right:none;
    border-bottom:1px solid rgba(255,255,255,.05);
  }
  .wpa-logo{margin:0 8px 0 4px}
  .wpa-menu{flex-direction:row;gap:4px}
  .wpa-item{border-left:none;border-bottom:2px solid transparent;padding:6px 8px;white-space:nowrap}
  .wpa-item-active{border-bottom-color:#00a0d2;border-left-color:transparent}
}

/* ==========================================================================
   HERRAMIENTAS · TIENDANUBE PHONE MOCKUP (.tnd-phone)
   Variation E: iPhone frame with notch, storefront product view
   ========================================================================== */

.tnd-phone{
  max-width:300px;margin:0 auto;padding:0;border-radius:40px;
  background:linear-gradient(160deg,rgba(14,14,22,.98),rgba(20,20,32,.95));
  border:3px solid rgba(255,255,255,.12);
  box-shadow:0 30px 80px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.05) inset;
  position:relative;overflow:hidden;
  font-family:var(--font-mono);
}
.tnd-notch{
  width:120px;height:28px;margin:0 auto;
  background:rgba(0,0,0,.9);
  border-radius:0 0 18px 18px;
  position:relative;z-index:2;
}
.tnd-screen{
  padding:8px 18px 12px;
}
.tnd-store-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 0 10px;
  border-bottom:1px solid rgba(255,255,255,.06);
  margin-bottom:12px;
}
.tnd-store-name{
  font-size:13px;font-weight:700;color:#2e7dd7;
}
.tnd-store-cart{
  font-size:11px;color:var(--text-2);
}
.tnd-product{display:flex;flex-direction:column;gap:10px}
.tnd-product-img{
  width:100%;aspect-ratio:4/3;border-radius:12px;
  background:linear-gradient(135deg,#1a1f2a 0%,#2a2f3a 50%,#1a1f2a 100%);
  position:relative;
}
.tnd-product-img::after{
  content:'👕';position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);font-size:48px;opacity:.4;
}
.tnd-product-info{display:flex;flex-direction:column;gap:6px}
.tnd-product-name{font-size:12px;color:var(--text);font-weight:600}
.tnd-product-price{
  font-size:22px;font-weight:800;color:var(--text);
  font-family:var(--font-display);letter-spacing:-.02em;
}
.tnd-product-cuotas{
  font-size:10px;color:#3bd37a;font-weight:600;
}
.tnd-product-stock{
  font-size:9px;color:var(--text-3);margin-top:2px;
}
.tnd-btn-add{
  display:block;width:100%;margin-top:8px;
  padding:12px;border:none;border-radius:10px;
  background:#ffd60a;color:#0a0a12;
  font-family:var(--font-display);font-size:13px;font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;
  cursor:pointer;text-align:center;
  box-shadow:0 4px 20px rgba(255,214,10,.3);
}
.tnd-badges{
  display:flex;flex-direction:column;gap:5px;margin-top:14px;
}
.tnd-badge{
  font-size:9px;padding:7px 10px;border-radius:8px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  color:var(--text-2);
}
.tnd-mp-badge{border-left:2px solid #00b1ea}
.tnd-me-badge{border-left:2px solid #ffd60a}
.tnd-afip-badge{border-left:2px solid #3bd37a}
.tnd-home-bar{
  width:100px;height:4px;margin:14px auto 10px;
  background:rgba(255,255,255,.2);border-radius:3px;
}

@media(max-width:480px){
  .tnd-phone{max-width:260px;border-radius:32px}
  .tnd-notch{width:100px;height:24px}
  .tnd-product-price{font-size:18px}
}

/* ==========================================================================
   HERRAMIENTAS · GOOGLE ADS DASHBOARD MOCKUP (.gda-dash)
   Variation B: 4 KPI cards + 3 campaign rows
   ========================================================================== */

.gda-dash{
  max-width:480px;margin:0 auto;padding:20px;border-radius:20px;
  background:linear-gradient(160deg,rgba(255,214,10,.04),rgba(66,133,244,.06));
  border:1px solid rgba(255,255,255,.08);
  font-family:var(--font-mono);backdrop-filter:blur(14px);
}
.gda-head{
  display:flex;align-items:center;justify-content:space-between;
  padding-bottom:12px;border-bottom:1px dashed rgba(255,255,255,.08);
  margin-bottom:14px;
}
.gda-logo{
  display:flex;align-items:center;gap:4px;
  font-size:12px;font-weight:700;color:var(--text);
}
.gda-dot{width:7px;height:7px;border-radius:50%;display:inline-block}
.gda-dot-b{background:#4285f4}
.gda-dot-r{background:#ea4335}
.gda-dot-y{background:#fbbc04}
.gda-dot-g{background:#34a853;margin-right:6px}
.gda-range{
  font-size:9px;color:var(--accent);
  padding:3px 8px;border:1px solid rgba(0,229,255,.25);
  border-radius:20px;background:rgba(0,229,255,.05);
}
.gda-kpis{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  margin-bottom:14px;
}
.gda-kpi{
  padding:10px 8px;border-radius:10px;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  text-align:center;
}
.gda-kpi-label{
  font-size:8px;color:var(--text-3);text-transform:uppercase;
  letter-spacing:.1em;margin-bottom:6px;
}
.gda-kpi-value{
  font-size:14px;font-weight:800;color:var(--text);
  font-family:var(--font-display);
}
.gda-kpi-accent{color:var(--accent)}
.gda-kpi-olpa{color:var(--olpa)}
.gda-kpi-green{color:#3bd37a}
.gda-campaigns{display:flex;flex-direction:column;gap:5px}
.gda-camp-head{
  display:grid;grid-template-columns:1.6fr 1fr 60px 60px;gap:8px;
  padding:4px 10px;
  font-size:8px;color:var(--text-3);text-transform:uppercase;letter-spacing:.1em;
}
.gda-camp-row{
  display:grid;grid-template-columns:1.6fr 1fr 60px 60px;gap:8px;
  align-items:center;padding:9px 10px;border-radius:8px;
  background:rgba(0,229,255,.03);
  border:1px solid rgba(255,255,255,.05);
  font-size:10px;color:var(--text-2);
}
.gda-camp-name{color:var(--text);font-weight:600;font-size:10px}
.gda-camp-type{
  font-size:8px;padding:3px 6px;border-radius:4px;
  text-transform:uppercase;letter-spacing:.08em;font-weight:700;
  display:inline-block;width:fit-content;
}
.gda-type-search{background:rgba(66,133,244,.15);color:#4285f4}
.gda-type-pmax{background:rgba(255,214,10,.15);color:var(--olpa)}
.gda-type-display{background:rgba(234,67,53,.15);color:#ea6a5e}
.gda-camp-conv{color:var(--accent);font-weight:600;text-align:right}
.gda-camp-cpa{color:var(--olpa);font-weight:700;text-align:right}
.gda-foot{
  margin-top:14px;padding-top:10px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-size:9px;color:var(--text-3);text-align:center;
}

@media(max-width:480px){
  .gda-kpis{grid-template-columns:repeat(2,1fr)}
  .gda-camp-head,.gda-camp-row{grid-template-columns:1.4fr .8fr 50px 50px;font-size:9px}
  .gda-dash{padding:14px}
}

/* ============================================================
   META BUSINESS · herramientas/meta-business.html  (.cl-meta-hero + .mta-phone)
   ============================================================ */
.cl-meta-hero{--hero-accent:#1877f2}

.mta-phone{
  position:relative;width:280px;margin:0 auto;padding:0;border-radius:36px;
  background:linear-gradient(180deg,rgba(24,119,242,.08),rgba(0,0,0,.45));
  border:2px solid rgba(24,119,242,.35);
  box-shadow:0 30px 80px -30px rgba(24,119,242,.4),inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
}
.mta-notch{
  width:120px;height:28px;margin:0 auto;
  background:var(--bg,#0a0a0a);
  border-radius:0 0 18px 18px;
  border:1px solid rgba(255,255,255,.06);
  border-top:none;
  position:relative;z-index:2;
}
.mta-screen{
  padding:10px 14px 18px;
}
.mta-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:6px 0 10px;
}
.mta-sponsored{
  font-family:var(--font-mono);font-size:10px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--text-2);
}
.mta-handle{
  font-size:11px;color:var(--text-1);font-weight:600;
}
.mta-media{
  width:100%;aspect-ratio:9/14;border-radius:14px;
  background:linear-gradient(160deg,rgba(24,119,242,.18),rgba(225,48,108,.18),rgba(252,175,69,.12));
  display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
  border:1px solid rgba(255,255,255,.06);
}
.mta-overlay{
  font-family:var(--font-display,var(--font-mono));
  font-size:22px;font-weight:800;letter-spacing:.1em;
  color:rgba(255,255,255,.35);text-transform:uppercase;
}
.mta-actions{
  display:flex;align-items:center;gap:16px;
  padding:12px 0 8px;font-size:18px;
}
.mta-action-right{margin-left:auto}
.mta-cta-btn{
  display:block;width:100%;padding:10px 0;border-radius:8px;
  background:linear-gradient(135deg,#ffd60a,#f5c400);
  color:#000;font-weight:700;font-size:13px;text-align:center;
  letter-spacing:.03em;
}
.mta-foot{
  padding:12px 14px 16px;
  font-family:var(--font-mono);font-size:10px;color:var(--text-2);
  text-align:center;line-height:1.5;
  border-top:1px dashed rgba(255,255,255,.08);
}

@media(max-width:720px){
  .mta-phone{width:240px;border-radius:30px}
  .mta-notch{width:100px;height:24px}
}
@media(max-width:420px){
  .mta-phone{width:220px;border-radius:26px}
}

/* ============================================================
   BITRIX24 · herramientas/bitrix24.html  (.cl-btx-hero + .btx-grid)
   ============================================================ */
.cl-btx-hero{--hero-accent:#2fc7f7}

.btx-grid.glass{
  position:relative;padding:22px;border-radius:22px;
  background:linear-gradient(180deg,rgba(47,199,247,.06),rgba(0,0,0,.35));
  border:1px solid rgba(47,199,247,.25);
  box-shadow:0 30px 80px -30px rgba(47,199,247,.35),inset 0 1px 0 rgba(255,255,255,.05);
}
.btx-head{
  padding-bottom:16px;margin-bottom:16px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.btx-head-title{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--text-1);font-weight:700;
}
.btx-head-sub{
  font-size:12px;color:var(--text-2);margin-top:4px;
}
.btx-modules{
  display:grid;grid-template-columns:repeat(3,1fr);gap:10px;
}
.btx-tile{
  position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;padding:16px 8px;border-radius:14px;
  background:linear-gradient(160deg,rgba(47,199,247,.1),rgba(0,229,255,.04));
  border:1px solid rgba(255,255,255,.08);
  transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease;
  overflow:hidden;
}
.btx-tile::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 0%,rgba(47,199,247,.18),transparent 70%);
  opacity:0;transition:opacity .35s ease;
}
.btx-tile:hover{
  transform:translateY(-3px);
  border-color:rgba(47,199,247,.55);
  box-shadow:0 18px 40px -20px rgba(47,199,247,.55);
}
.btx-tile:hover::before{opacity:1}
.btx-icon{
  position:relative;z-index:1;font-size:24px;line-height:1;
}
.btx-name{
  position:relative;z-index:1;
  font-size:11px;font-weight:700;color:var(--text-1);
  text-transform:uppercase;letter-spacing:.06em;text-align:center;
}
.btx-stat{
  position:relative;z-index:1;
  font-family:var(--font-mono);font-size:9px;color:var(--text-2);
  letter-spacing:.04em;text-align:center;
}
.btx-foot{
  margin-top:16px;padding-top:14px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-family:var(--font-mono);font-size:11px;color:var(--text-2);
  text-align:center;line-height:1.5;
}
@media(max-width:720px){
  .btx-modules{grid-template-columns:repeat(3,1fr)}
  .btx-tile{padding:12px 6px}
}
@media(max-width:420px){
  .btx-modules{grid-template-columns:repeat(2,1fr)}
}

/* ============================================================
   PIPEDRIVE · herramientas/pipedrive.html  (.cl-ppd-hero + .ppd-pipeline)
   ============================================================ */
.cl-ppd-hero{--hero-accent:#017737}

.ppd-pipeline.glass{
  position:relative;padding:20px;border-radius:22px;
  background:linear-gradient(180deg,rgba(1,119,55,.06),rgba(0,0,0,.4));
  border:1px solid rgba(1,119,55,.3);
  box-shadow:0 30px 80px -30px rgba(1,119,55,.35),inset 0 1px 0 rgba(255,255,255,.05);
  overflow:hidden;
}
.ppd-head{
  display:flex;align-items:baseline;justify-content:space-between;
  padding-bottom:14px;margin-bottom:14px;
  border-bottom:1px dashed rgba(255,255,255,.1);
}
.ppd-title{
  font-family:var(--font-mono);font-size:11px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--text-1);font-weight:700;
}
.ppd-total{
  font-size:11px;color:var(--text-2);font-family:var(--font-mono);
}
.ppd-cols{
  display:grid;grid-template-columns:repeat(5,1fr);gap:8px;
}
.ppd-col{display:flex;flex-direction:column;gap:8px}
.ppd-col-label{
  font-family:var(--font-mono);font-size:10px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--text-2);
  text-align:center;padding-bottom:6px;
  border-bottom:2px solid rgba(255,255,255,.08);
}
.ppd-col-won .ppd-col-label{
  color:#22c55e;border-bottom-color:rgba(34,197,94,.3);
}
.ppd-deal{
  padding:10px 8px;border-radius:10px;
  background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;
}
.ppd-deal:hover{
  transform:translateY(-2px);
  border-color:rgba(1,119,55,.5);
  box-shadow:0 12px 30px -15px rgba(1,119,55,.4);
}
.ppd-deal-hot{border-color:rgba(251,191,36,.4)}
.ppd-deal-won{border-color:rgba(34,197,94,.3);background:linear-gradient(160deg,rgba(34,197,94,.1),rgba(34,197,94,.03))}
.ppd-deal-amount{
  font-family:var(--font-mono);font-size:12px;font-weight:700;color:var(--text-1);
}
.ppd-deal-contact{
  display:flex;align-items:center;gap:5px;margin-top:5px;
  font-size:11px;color:var(--text-2);
}
.ppd-avatar{
  display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:20px;border-radius:50%;
  background:linear-gradient(135deg,rgba(1,119,55,.3),rgba(0,229,255,.15));
  font-size:8px;font-weight:700;color:var(--text-1);letter-spacing:.04em;
}
.ppd-foot{
  margin-top:14px;padding-top:12px;
  border-top:1px dashed rgba(255,255,255,.08);
  font-family:var(--font-mono);font-size:10px;color:var(--text-2);
  text-align:center;
}
@media(max-width:720px){
  .ppd-cols{grid-template-columns:repeat(3,1fr)}
  .ppd-pipeline.glass{padding:14px}
}
@media(max-width:420px){
  .ppd-cols{grid-template-columns:repeat(2,1fr)}
}

/* ============================================================
   KOMMO · herramientas/kommo.html  (.cl-kmm-hero + .kmm-phone)
   ============================================================ */
.cl-kmm-hero{--hero-accent:#25d366}

.kmm-phone{
  position:relative;width:290px;margin:0 auto;border-radius:40px;
  background:linear-gradient(180deg,rgba(37,211,102,.06),rgba(0,0,0,.5));
  border:2px solid rgba(37,211,102,.3);
  box-shadow:0 30px 80px -30px rgba(37,211,102,.4),inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
}
.kmm-notch{
  width:120px;height:28px;margin:0 auto;
  background:var(--bg,#0a0a0a);
  border-radius:0 0 18px 18px;
  border:1px solid rgba(255,255,255,.06);
  border-top:none;
}
.kmm-screen{padding:0 12px 16px}
.kmm-wa-header{
  display:flex;align-items:center;gap:8px;
  padding:8px 0 10px;
  border-bottom:1px solid rgba(255,255,255,.08);
  margin-bottom:10px;
}
.kmm-wa-avatar{
  width:32px;height:32px;border-radius:50%;
  background:linear-gradient(135deg,rgba(37,211,102,.25),rgba(0,229,255,.1));
  display:flex;align-items:center;justify-content:center;font-size:16px;
}
.kmm-wa-info{flex:1}
.kmm-wa-name{font-size:12px;font-weight:700;color:var(--text-1)}
.kmm-wa-status{font-size:10px;color:#25d366}
.kmm-wa-badge{
  font-family:var(--font-mono);font-size:8px;font-weight:700;
  letter-spacing:.12em;color:var(--text-2);
  padding:3px 6px;border-radius:6px;
  background:rgba(37,211,102,.12);border:1px solid rgba(37,211,102,.25);
}
.kmm-chat{
  display:flex;flex-direction:column;gap:6px;
  max-height:340px;overflow:hidden;
}
.kmm-bubble{
  max-width:85%;padding:8px 10px;border-radius:12px;
  font-size:11px;line-height:1.45;color:var(--text-1);
  position:relative;
}
.kmm-bubble p{margin:0}
.kmm-client{
  align-self:flex-start;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.06);
  border-top-left-radius:4px;
}
.kmm-seller{
  align-self:flex-end;
  background:linear-gradient(160deg,rgba(37,211,102,.18),rgba(37,211,102,.08));
  border:1px solid rgba(37,211,102,.2);
  border-top-right-radius:4px;
}
.kmm-time{
  display:block;text-align:right;
  font-size:9px;color:var(--text-2);margin-top:3px;
  font-family:var(--font-mono);
}
.kmm-checks{color:#53bdeb;font-size:10px}
.kmm-wa-footer{
  margin-top:10px;padding-top:8px;
  border-top:1px dashed rgba(255,255,255,.08);
  text-align:center;
}
.kmm-pipeline-tag{
  font-family:var(--font-mono);font-size:9px;
  color:var(--text-2);letter-spacing:.06em;
  padding:3px 8px;border-radius:6px;
  background:rgba(37,211,102,.08);border:1px solid rgba(37,211,102,.15);
}
@media(max-width:720px){
  .kmm-phone{width:250px;border-radius:34px}
  .kmm-notch{width:100px;height:24px}
}
@media(max-width:420px){
  .kmm-phone{width:220px;border-radius:28px}
}

/* ==========================================================================
   DOPPLER — Email campaign dashboard mockup (.dpl-inbox)
   ========================================================================== */
.dpl-inbox{
  width:100%;max-width:420px;border-radius:16px;overflow:hidden;
  border:1px solid var(--border);background:rgba(15,15,20,.85);
}
.dpl-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 18px;border-bottom:1px solid var(--border);
  font-family:var(--font-mono);font-size:12px;color:var(--text-2);
}
.dpl-head-title{font-weight:700;color:var(--text-1)}
.dpl-head-badge{
  font-size:10px;padding:3px 8px;border-radius:6px;
  background:rgba(255,214,10,.12);color:var(--olpa);font-weight:700;
  text-transform:uppercase;letter-spacing:.08em;
}
.dpl-body{display:grid;grid-template-columns:1fr 1fr;min-height:260px}
.dpl-list{border-right:1px solid var(--border);overflow:hidden}
.dpl-row{
  padding:10px 14px;border-bottom:1px solid rgba(255,255,255,.04);
  cursor:default;transition:background .2s;
}
.dpl-row:hover,.dpl-row-active{background:rgba(255,214,10,.06)}
.dpl-subject{font-size:11px;font-weight:600;color:var(--text-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dpl-meta{font-size:9px;color:var(--text-2);margin-top:3px;font-family:var(--font-mono)}
.dpl-status{
  display:inline-block;padding:1px 5px;border-radius:4px;font-size:8px;
  font-weight:700;text-transform:uppercase;letter-spacing:.06em;
}
.dpl-sent{background:rgba(34,197,94,.15);color:#22c55e}
.dpl-auto{background:rgba(99,102,241,.15);color:#818cf8}
.dpl-draft{background:rgba(255,255,255,.08);color:var(--text-2)}
.dpl-preview{padding:14px;display:flex;flex-direction:column;gap:8px}
.dpl-preview-head{font-size:9px;color:var(--text-2);text-transform:uppercase;letter-spacing:.1em;font-family:var(--font-mono)}
.dpl-preview-subject{font-size:13px;font-weight:700;color:var(--text-1)}
.dpl-preview-img{
  height:60px;border-radius:8px;background:rgba(255,255,255,.05);
  display:flex;align-items:center;justify-content:center;
  font-size:12px;color:var(--text-2);
}
.dpl-preview-body{font-size:10px;color:var(--text-2);line-height:1.5}
.dpl-preview-cta{
  align-self:flex-start;padding:6px 14px;border-radius:6px;
  background:var(--olpa);color:#000;font-size:10px;font-weight:800;
  text-transform:uppercase;letter-spacing:.06em;
}
.dpl-preview-stats{font-size:9px;color:var(--text-2);font-family:var(--font-mono)}
.dpl-foot{
  padding:10px 18px;border-top:1px solid var(--border);
  font-size:10px;color:var(--text-2);text-align:center;font-style:italic;
}
@media(max-width:520px){
  .dpl-body{grid-template-columns:1fr}
  .dpl-list{border-right:none;border-bottom:1px solid var(--border)}
  .dpl-preview{display:none}
}

/* ==========================================================================
   CALLBELL — iPhone phone mockup (.cbl-phone)
   ========================================================================== */
.cbl-phone{
  width:280px;min-height:540px;border-radius:40px;overflow:hidden;
  border:2px solid var(--border);background:rgba(15,15,20,.92);
  position:relative;padding:0;display:flex;flex-direction:column;
}
.cbl-notch{
  width:120px;height:28px;margin:0 auto;
  background:rgba(0,0,0,.9);border-radius:0 0 18px 18px;
  position:relative;z-index:2;
}
.cbl-screen{flex:1;display:flex;flex-direction:column;padding:8px 0 0}
.cbl-screen-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:6px 18px 10px;border-bottom:1px solid var(--border);
}
.cbl-screen-title{font-size:13px;font-weight:700;color:var(--text-1)}
.cbl-screen-badge{
  font-size:9px;padding:2px 7px;border-radius:5px;
  background:rgba(255,214,10,.12);color:var(--olpa);font-weight:700;
  text-transform:uppercase;letter-spacing:.06em;
}
.cbl-chat-list{flex:1;overflow:hidden}
.cbl-chat{
  display:grid;grid-template-columns:36px 1fr auto;gap:10px;
  align-items:center;padding:10px 16px;
  border-bottom:1px solid rgba(255,255,255,.04);
  transition:background .2s;
}
.cbl-chat:hover{background:rgba(255,255,255,.03)}
.cbl-avatar{
  width:36px;height:36px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;color:#fff;
}
.cbl-chat-name{font-size:11px;font-weight:600;color:var(--text-1)}
.cbl-channel{font-size:8px;margin-left:4px;vertical-align:middle}
.cbl-wa{color:#25d366}
.cbl-ig{color:#e1306c}
.cbl-tg{color:#0088cc}
.cbl-fb{color:#0084ff}
.cbl-chat-preview{font-size:10px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}
.cbl-chat-meta{text-align:right;display:flex;flex-direction:column;gap:3px}
.cbl-time{font-size:9px;color:var(--text-2);font-family:var(--font-mono)}
.cbl-agent{
  font-size:8px;padding:1px 5px;border-radius:4px;
  background:rgba(255,214,10,.1);color:var(--olpa);font-weight:700;
  text-transform:uppercase;letter-spacing:.04em;align-self:flex-end;
}
.cbl-home-bar{
  width:100px;height:4px;margin:8px auto 10px;
  background:rgba(255,255,255,.2);border-radius:4px;
}
@media(max-width:360px){
  .cbl-phone{width:260px;min-height:480px;border-radius:34px}
  .cbl-chat-preview{max-width:100px}
}

/* ==========================================================================
   MARKETING ESTRATÉGICO · Flowchart hero (marketing-estrategico.html)
   ========================================================================== */
.cl-mke-hero{position:relative;overflow:hidden}
.cl-mke-hero .hero-blob-1{background:radial-gradient(circle,rgba(255,214,10,.18),transparent 60%)}
.cl-mke-hero .hero-blob-2{background:radial-gradient(circle,rgba(0,229,255,.14),transparent 60%)}

.mke-flow{padding:0;overflow:hidden;max-width:420px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.25)!important}
.mke-flow-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.mke-flow-title{font-family:var(--font-mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-1);font-weight:700}
.mke-flow-badge{font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.1em;padding:4px 10px;border-radius:999px;background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.4);color:#22c55e;text-transform:uppercase}
.mke-flow-body{padding:20px;display:flex;flex-direction:column;gap:0}
.mke-step{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);transition:border-color .3s,background .3s}
.mke-step.mke-done{border-color:rgba(34,197,94,.25);background:rgba(34,197,94,.04)}
.mke-step.mke-active{border-color:rgba(255,214,10,.4);background:rgba(255,214,10,.06);box-shadow:0 0 20px rgba(255,214,10,.1)}
.mke-num{font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--text-2);min-width:22px}
.mke-label{flex:1;font-size:13px;font-weight:600;color:var(--text-1)}
.mke-tag{font-family:var(--font-mono);font-size:9px;font-weight:700;letter-spacing:.08em;padding:3px 8px;border-radius:6px;text-transform:uppercase;white-space:nowrap}
.mke-tag-done{background:rgba(34,197,94,.15);color:#22c55e;border:1px solid rgba(34,197,94,.3)}
.mke-tag-run{background:rgba(255,214,10,.15);color:#ffd60a;border:1px solid rgba(255,214,10,.3);animation:pulse 2s infinite}
.mke-tag-queue{background:rgba(255,255,255,.05);color:var(--text-2);border:1px solid rgba(255,255,255,.1)}
.mke-arrow{text-align:center;color:var(--text-2);font-size:14px;line-height:1;padding:4px 0;opacity:.4}
.mke-flow-foot{padding:12px 20px;font-size:10px;color:var(--text-2);text-align:center;border-top:1px solid var(--border);font-family:var(--font-mono);letter-spacing:.04em}

/* ==========================================================================
   MARKETING DIGITAL · Dashboard hero (marketing-digital.html)
   ========================================================================== */
.cl-mkd-hero{position:relative;overflow:hidden}
.cl-mkd-hero .hero-blob-1{background:radial-gradient(circle,rgba(0,229,255,.18),transparent 60%)}
.cl-mkd-hero .hero-blob-2{background:radial-gradient(circle,rgba(255,214,10,.14),transparent 60%)}

.mkd-dash{padding:0;overflow:hidden;max-width:460px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(0,229,255,.25)!important}
.mkd-dash-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.mkd-dash-title{font-family:var(--font-mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-1);font-weight:700}
.mkd-dash-badge{font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.1em;padding:4px 10px;border-radius:999px;background:rgba(34,197,94,.15);border:1px solid rgba(34,197,94,.4);color:#22c55e;text-transform:uppercase}
.mkd-dash-body{padding:16px 20px;display:flex;flex-direction:column;gap:10px}
.mkd-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mkd-metric{padding:14px;border-radius:14px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06)}
.mkd-metric-label{font-family:var(--font-mono);font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--text-2);margin-bottom:6px}
.mkd-metric-val{font-family:var(--font-display);font-size:1.3rem;font-weight:700;line-height:1;letter-spacing:-.02em}
.mkd-metric-val.mkd-up{background:linear-gradient(135deg,#22c55e,#00e5ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.mkd-metric-sub{font-size:10px;color:var(--text-2);margin-top:4px}
.mkd-dash-foot{padding:12px 20px;font-size:10px;color:var(--text-2);text-align:center;border-top:1px solid var(--border);font-family:var(--font-mono);letter-spacing:.04em}

/* ==========================================================================
   MARKETING TRADICIONAL · Tablet/phone checklist hero (marketing-tradicional.html)
   ========================================================================== */
.cl-mkt-hero{position:relative;overflow:hidden}
.cl-mkt-hero .hero-blob-1{background:radial-gradient(circle,rgba(255,214,10,.16),transparent 60%)}
.cl-mkt-hero .hero-blob-2{background:radial-gradient(circle,rgba(139,92,246,.14),transparent 60%)}

.mkt-tablet{padding:0;overflow:hidden;max-width:420px;margin:0 auto;border-radius:22px;background:rgba(10,10,18,.95)!important;border:1px solid rgba(255,214,10,.25)!important}
.mkt-tablet-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:rgba(255,255,255,.02);border-bottom:1px solid var(--border)}
.mkt-tablet-title{font-family:var(--font-mono);font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-1);font-weight:700}
.mkt-tablet-badge{font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.1em;padding:4px 10px;border-radius:999px;background:rgba(255,214,10,.15);border:1px solid rgba(255,214,10,.4);color:#ffd60a;text-transform:uppercase}
.mkt-tablet-body{padding:14px 18px;display:flex;flex-direction:column;gap:6px}
.mkt-check{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.05);transition:border-color .3s}
.mkt-check.mkt-ok{border-color:rgba(34,197,94,.2)}
.mkt-check.mkt-warn{border-color:rgba(255,214,10,.3);background:rgba(255,214,10,.04)}
.mkt-check.mkt-fail{border-color:rgba(239,68,68,.3);background:rgba(239,68,68,.04)}
.mkt-icon{width:24px;height:24px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0}
.mkt-ok .mkt-icon{background:rgba(34,197,94,.15);color:#22c55e}
.mkt-warn .mkt-icon{background:rgba(255,214,10,.15);color:#ffd60a}
.mkt-fail .mkt-icon{background:rgba(239,68,68,.15);color:#ef4444}
.mkt-text{flex:1;font-size:12px;color:var(--text-1);font-weight:500}
.mkt-score{font-family:var(--font-mono);font-size:11px;font-weight:700;color:var(--text-2);white-space:nowrap}
.mkt-ok .mkt-score{color:#22c55e}
.mkt-warn .mkt-score{color:#ffd60a}
.mkt-fail .mkt-score{color:#ef4444}
.mkt-tablet-foot{padding:14px 20px;border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}
.mkt-total{font-family:var(--font-mono);font-size:12px;color:var(--text-1)}
.mkt-total strong{color:var(--olpa)}
.mkt-loc{font-size:10px;color:var(--text-2);font-family:var(--font-mono);letter-spacing:.04em}