/* ============================================================
   QUBIKO — Tema común de las páginas internas
   Misma barra, mismo pie y mismo estilo que la portada: Nunito,
   azules, azul cielo y blanco, botones con relieve y auras cielo con
   grano. Se carga al final, después de las hojas de cada página.
   Las reglas de barra, botones y pie son copia de css/portada.css:
   si cambian allá, hay que cambiarlas aquí.
   ============================================================ */
@font-face{font-family:'Nunito';font-style:normal;font-display:swap;font-weight:200 1000;
  src:url(../fonts/text/nunito-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Nunito';font-style:normal;font-display:swap;font-weight:200 1000;
  src:url(../fonts/text/nunito-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
:root{
  --blue:#2459eb; --blue-edge:#1a3fb8; --blue-soft:#e9f0ff; --blue-mist:#f5f8ff;
  --navy:#13234c; --navy-edge:#0a1430;
  --lime:#bfe3ff; --lime-edge:#8fc9ff; --sky:#38a8ff; --sky-soft:#e8f5ff;
  --ink:#13234c; --text:#52607f; --muted:#7c89a6;
  --line:#e3eaf7; --line-2:#eef2fa;
  --font:'Nunito', ui-rounded, 'Segoe UI', system-ui, -apple-system, sans-serif;
  --wrap:1040px; --nav-h:72px;
  --spring:linear(0, .006, .025 2.8%, .101 6.1%, .539 18.9%, .721 25.3%, .849 31.5%, .937 38.1%, .968 41.8%, .991 45.7%, 1.006 50.1%, 1.015 55%, 1.017 63.9%, 1.001 100%);
  --bounce:linear(0, .2 8%, .6 18%, 1.08 32%, 1.12 38%, 1.04 48%, .98 58%, 1.01 72%, 1);
  --ease:cubic-bezier(.16,1,.3,1);
  --tone:#ffffff;
}
.d-wrap{width:100%;max-width:calc(var(--wrap) + 48px);margin-inline:auto;padding-inline:24px}
.d-sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;margin:-1px;padding:0}
.d-skip{position:absolute;left:16px;top:-60px;z-index:2000;background:var(--blue);color:#fff;padding:10px 18px;border-radius:12px;font-weight:800}
.d-skip:focus{top:12px}
.d-defs{position:absolute;width:0;height:0;overflow:hidden}
.marca{display:inline-block;flex:none;aspect-ratio:1;background:currentColor;-webkit-mask:url(../logo.svg) center/contain no-repeat;mask:url(../logo.svg) center/contain no-repeat}
.d-wordmark{display:inline-block;width:108px;height:25px;background:currentColor;-webkit-mask:url(../logo-wordmark.svg) center/contain no-repeat;mask:url(../logo-wordmark.svg) center/contain no-repeat}
.d-logo{display:inline-flex;align-items:center;gap:8px;color:var(--blue)}
.d-logo .marca{width:40px;transition:rotate .5s var(--bounce)}
.d-logo:hover .marca{rotate:-12deg}

/* ---------- Botones gorditos ---------- */
.d-btn{
  --edge:var(--blue-edge);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:50px;padding:12px 24px;border-radius:16px;border:2px solid transparent;
  font:800 15px/1 var(--font);letter-spacing:.07em;text-transform:uppercase;white-space:nowrap;
  box-shadow:0 4px 0 var(--edge);cursor:pointer;
  transition:transform .08s ease, box-shadow .08s ease, filter .2s ease, background-color .2s;
}
.d-btn i{font-size:18px}
.d-btn:hover{filter:brightness(1.07)}
.d-btn:active{transform:translateY(4px);box-shadow:0 0 0 var(--edge)}
.d-btn-blue{background:var(--blue);color:#fff}
.d-btn-white{--edge:var(--line);background:#fff;color:var(--blue);border-color:var(--line)}
.d-btn-white:hover{background:var(--blue-mist);filter:none}
.d-btn-navy{--edge:var(--navy-edge);background:var(--navy);color:#fff}
.d-btn-lime{--edge:var(--lime-edge);background:var(--lime);color:var(--navy)}
.d-btn-sm{min-height:40px;padding:8px 16px;font-size:13px;border-radius:12px;box-shadow:0 3px 0 var(--edge)}
.d-btn-sm:active{transform:translateY(3px)}
.d-btn-lg{min-height:58px;padding:16px 40px;font-size:17px}
.d-btn-block{width:100%}
.d-btn-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:30px}
.d-link{display:inline-flex;align-items:center;gap:8px;margin-top:26px;font-weight:800;font-size:15px;letter-spacing:.06em;text-transform:uppercase;color:var(--blue)}
.d-link i{transition:translate .35s var(--bounce)}
.d-link:hover i{translate:5px 0}
.d-nav{position:sticky;top:0;z-index:1000;height:var(--nav-h);display:flex;align-items:center;background-color:color-mix(in srgb, var(--tone) 86%, transparent);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:2px solid transparent;transition:border-color .3s, background-color .9s ease}
.d-nav.scrolled{border-bottom-color:rgba(19,35,76,.06)}
.d-nav-in{display:flex;align-items:center;gap:28px}
.d-links{display:flex;gap:26px;margin-left:auto}
.d-links .nav-item{font-weight:800;font-size:14px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);transition:color .2s}
.d-links .nav-item:hover,.d-links .nav-item.active{color:var(--blue)}
.d-only-menu{display:none}
.d-nav-act{display:flex;align-items:center;gap:10px}
.d-burger{display:none;width:44px;height:44px;border-radius:12px;border:2px solid var(--line)!important;box-shadow:0 3px 0 var(--line);flex-direction:column;align-items:center;justify-content:center;gap:4px}
.d-burger span{display:block;width:16px;height:2.5px;border-radius:2px;background:var(--ink);transition:translate .3s, rotate .3s, opacity .2s}
.d-burger.active span:nth-child(1){translate:0 6.5px;rotate:45deg}
.d-burger.active span:nth-child(2){opacity:0}
.d-burger.active span:nth-child(3){translate:0 -6.5px;rotate:-45deg}
.d-footer{background:var(--blue);color:#dbe6ff;padding:72px 0 36px}
.d-footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.d-footer h4{color:#fff;font-size:18px;font-weight:800;margin-bottom:16px}
.d-footer li+li{margin-top:10px}
.d-footer li a,.d-footer li span{font-weight:700;font-size:15px;color:#dbe6ff;transition:color .2s;overflow-wrap:anywhere}
.d-footer li a:hover{color:#fff}
.d-footer-bottom{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px;margin-top:56px;padding-top:28px;border-top:2px solid rgba(255,255,255,.18)}
.d-logo-white{color:#fff}
.d-socials{display:flex;gap:8px}
.d-socials a{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.14);color:#fff;font-size:19px;transition:background-color .2s, transform .3s var(--bounce)}
.d-socials a:hover{background:#fff;color:var(--blue);transform:translateY(-3px)}
.d-footer-bottom p{margin-left:auto;font-size:14px;color:#c9d8fb}
.d-footer-bottom .ph-heart{color:#8fd8ff}
.d-effects{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:12px;border:2px solid rgba(255,255,255,.3)!important;font-weight:800;font-size:13px;color:#fff!important}
.d-effects:hover{background:rgba(255,255,255,.12)!important}
.d-kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:var(--sky-soft);color:var(--blue);font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.d-wave-top{display:block;width:100%;height:clamp(60px, 8vw, 120px);margin-bottom:-2px}
.d-wave-1{animation:d-wave-x 9s ease-in-out infinite alternate}
.d-wave-2{animation:d-wave-x 7s ease-in-out -2s infinite alternate-reverse}
@keyframes d-wave-x{to{transform:translateX(-40px)}}
.d-footer{background:linear-gradient(180deg,#2459eb,#1f4fe0 60%,#1a3fb8)}
.d-btn-blue{background:linear-gradient(180deg,#2d63f0,#2459eb)}
.d-kicker{background:linear-gradient(90deg,#e3f1ff,#eef7ff);box-shadow:inset 0 0 0 1.5px #d3e7ff}
@media (max-width:900px){
  .d-links{position:fixed;inset:var(--nav-h) 0 auto;flex-direction:column;gap:0;padding:12px 24px 24px;background:#fff;border-bottom:2px solid var(--line-2);opacity:0;visibility:hidden;translate:0 -8px;transition:opacity .3s, translate .4s var(--ease), visibility .3s}
  .d-links.open{opacity:1;visibility:visible;translate:0 0}
  .d-links li{border-bottom:2px solid var(--line-2)}
  .d-links .nav-item{display:block;padding:16px 4px;font-size:16px}
  .d-only-menu{display:block}
  .d-burger{display:inline-flex}
  .d-nav-act{margin-left:auto}
  .d-nav-cta{opacity:1;translate:none;pointer-events:auto}
}

/* ============================================================
   Capa de tema sobre styles.css y las hojas de cada página
   ============================================================ */
:root{
  --font-display:'Nunito', ui-rounded, 'Segoe UI', system-ui, sans-serif;
  --font-body:'Nunito', ui-rounded, 'Segoe UI', system-ui, sans-serif;
  --brand-50:#eef6ff; --brand-100:#dcebff; --brand-200:#bfdcff; --brand-300:#8fc9ff;
  --brand-400:#5ea6ff; --brand-500:#3a7cf2; --brand-600:#2459eb; --brand-700:#1f4fe0;
  --brand-800:#1a3fb8; --brand-900:#13234c;
  /* Las familias de producto pasan a tonos de azul y cielo */
  --sim:#38a8ff;  --sim-dk:#1a5fc2;  --sim-bg:#eef7ff;  --sim-bd:#bfe3ff;
  --ai:#5b8cff;   --ai-dk:#1f4fe0;   --ai-bg:#eef3ff;   --ai-bd:#c9d8ff;
  --kit:#2f7df5;  --kit-dk:#1a3fb8;  --kit-bg:#eaf3ff;  --kit-bd:#bcd8ff;
  --ok:#38a8ff;   --ok-dk:#1d62c9;   --ok-bg:#ecf6ff;   --ok-bd:#bfe3ff;
  --rose:#6aa8ff; --rose-dk:#1f4fe0; --rose-bg:#f0f6ff; --rose-bd:#cfe0ff;
  --slate-900:#13234c; --slate-800:#1c2f5e; --slate-700:#3a4a6e; --slate-600:#52607f; --slate-500:#66749a;
  --surface-sky:#f5faff; --surface-cloud:#f7fbff;
  --sh-brand:0 4px 0 #1a3fb8;
  --nav-h:72px;
}
body.d-tema{font-family:var(--font);font-weight:600;color:var(--text);background:#fff;-webkit-font-smoothing:antialiased}
body.d-tema :is(h1,h2,h3,h4,h5){font-family:var(--font);font-weight:800;color:var(--ink);letter-spacing:-.02em}
body.d-tema h1{letter-spacing:-.025em}
body.d-tema :is(.d-nav,.d-footer) :is(h1,h2,h3,h4){letter-spacing:0}
body.d-tema .d-footer h4{color:#fff}
body.d-tema .sec-sub,body.d-tema p{color:inherit}
/* Palabra destacada: degradado azul a cielo con subrayado, como en la portada */
body.d-tema .mark{display:inline;padding:0 .04em;border-radius:0;color:var(--blue);-webkit-text-fill-color:currentColor;background:linear-gradient(90deg,#cfe8ff,#e3f2ff) no-repeat 0 92% / 100% .28em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
body.d-tema .mark::before,body.d-tema .mark::after{display:none}
/* Etiquetas */
body.d-tema :is(.eyebrow,.tag-dark){display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:0;background:linear-gradient(90deg,#e3f1ff,#eef7ff);box-shadow:inset 0 0 0 1.5px #d3e7ff;color:var(--blue);font-family:var(--font);font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
body.d-tema .eyebrow.on-dark{background:rgba(255,255,255,.14);box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28);color:#fff}
/* Botones con relieve */
body.d-tema .btn{font-family:var(--font);font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:14px;border-radius:16px;border-width:2px;transition:transform .08s ease, box-shadow .08s ease, filter .2s, background-color .2s}
body.d-tema .btn:hover{transform:none;filter:brightness(1.06)}
body.d-tema .btn:active{transform:translateY(4px)}
body.d-tema .btn-primary{background:linear-gradient(180deg,#2d63f0,#2459eb);color:#fff;box-shadow:0 4px 0 #1a3fb8;border-color:transparent}
body.d-tema .btn-primary:hover{box-shadow:0 4px 0 #1a3fb8}
body.d-tema .btn-primary:active{box-shadow:0 0 0 #1a3fb8}
body.d-tema :is(.btn-soft,.btn-ghost,.btn-white){background:#fff;color:var(--blue);border-color:var(--line);box-shadow:0 4px 0 var(--line)}
body.d-tema :is(.btn-soft,.btn-ghost,.btn-white):hover{background:var(--blue-mist);box-shadow:0 4px 0 var(--line)}
body.d-tema :is(.btn-soft,.btn-ghost,.btn-white):active{box-shadow:0 0 0 var(--line)}
body.d-tema .btn-glass{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.4);color:#fff;box-shadow:0 4px 0 rgba(8,22,70,.25);backdrop-filter:none}
body.d-tema .btn-sm{font-size:12.5px;border-radius:12px;box-shadow:0 3px 0 #1a3fb8}
body.d-tema :is(.btn-soft,.btn-ghost,.btn-white).btn-sm{box-shadow:0 3px 0 var(--line)}
body.d-tema .btn-lg{font-size:15px;padding:16px 30px}
/* Tarjetas: borde limpio con canto inferior, como en la portada */
body.d-tema :is(.card,.post-card,.curso-card,.tienda-card,.product-card){border:2px solid var(--line);border-radius:26px;box-shadow:0 4px 0 var(--line), 0 30px 50px -44px rgba(36,89,235,.6)}
/* Fondos: blanco con auras cielo y grano, igual que el inicio */
body.d-tema :is(.bg-sky,.bg-cloud,.bg-mint,.bg-amber,.bg-violet,.bg-blue){background:linear-gradient(180deg,#f5faff 0%,#ffffff 100%)}
body.d-tema::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(50vmax 40vmax at 8% 6%, rgba(126,196,255,.35), transparent 70%),radial-gradient(46vmax 40vmax at 96% 30%, rgba(170,216,255,.35), transparent 70%),radial-gradient(50vmax 40vmax at 40% 108%, rgba(191,227,255,.45), transparent 70%)}
body.d-tema::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.3;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .14 0 0 0 0 .32 0 0 0 0 .68 0 0 0 .55 -.08'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px}
/* La barra nueva ocupa el lugar de la anterior */
body.d-tema .d-nav{position:sticky}
body.d-tema .d-links .nav-item{display:inline;padding:0;border-radius:0;background:none;width:auto}
@media (max-width:900px){
  body.d-tema .d-links .nav-item{display:block;padding:16px 4px;font-size:16px;color:var(--muted)!important}
}
.d-page-foot{margin-top:0}
/* Convivencia con las reglas anteriores de styles.css */
body.d-tema .d-nav{position:fixed;top:0;left:0;right:0;height:var(--nav-h);box-shadow:none;border-bottom:2px solid transparent}
body.d-tema .d-nav.scrolled{height:var(--nav-h);box-shadow:none;border-bottom-color:rgba(19,35,76,.06)}
body.d-tema .d-links .nav-item{height:auto;background:none!important;border-radius:0;font-family:var(--font)}
body.d-tema .d-burger{padding:0;background:#fff}
body.d-tema .d-burger span{transform:none!important;width:16px;height:2.5px;background:var(--ink)}
body.d-tema .d-footer{padding:72px 0 36px;color:#dbe6ff}
body.d-tema .d-footer h4{text-transform:none;letter-spacing:0;font-size:18px;font-family:var(--font);font-weight:800;color:#fff}
body.d-tema .d-footer .social{width:40px;height:40px;border-radius:12px;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:19px}
body.d-tema .d-footer .social:hover{background:#fff;color:var(--blue)}
body.d-tema .d-footer ul{list-style:none;margin:0;padding:0}
/* Pantallas chicas: igual que en la portada */
@media (max-width:820px){
  .d-footer-grid{grid-template-columns:1fr 1fr}
  .d-footer-bottom p{margin-left:0}
}
@media (max-width:520px){
  .d-wrap{padding-inline:16px}
  .d-nav-in{gap:12px}
  .d-logo .marca{width:34px}
  .d-logo .d-wordmark{width:88px;height:21px}
  .d-nav-cta{padding:8px 12px;font-size:12px}
  .d-footer-grid{grid-template-columns:1fr}
}

/* ── Tacto y lectura (auditoría 2026-10): los enlaces de texto del menú, el
   pie y la miga de pan medían ~20 px de alto, difíciles de tocar con el
   dedo; las etiquetas pequeñas bajaban de 11 px. Se agranda el área que se
   toca sin mover el diseño (relleno + margen negativo). ── */
.d-footer li a{display:inline-block;padding-block:8px;margin-block:-8px}
.crumbs a{display:inline-block;padding:10px 4px;margin:-10px -4px}
@media(min-width:901px){.d-links .nav-item,body.d-tema .d-links .nav-item{display:inline-block;padding-block:10px;margin-block:-10px}}
.next-card small{font-size:.75rem}
.q-core-detail-eyebrow{font-size:11px}
.q-core-detail-figure>figcaption,.q-core-detail-view,.q-core-detail-marker,.q-core-detail-modal-hint{font-size:11px}
@media(max-width:760px){.q-core-detail-eyebrow{font-size:11px}}
.product-text-link,.pg-link{display:inline-flex;align-items:center;min-height:40px}
.q-core-detail-item summary small{font-size:11.5px}
.q-core-detail-description>span{font-size:11.5px}
.product-crumbs a{display:inline-block;padding:10px 4px;margin:-10px -4px}