/* GGC · Tema claro — cargar como ÚLTIMA hoja de estilo en de cada página. Redefine las variables de marca de oscuro -> claro. Lo demás (var(--…)) se adapta solo. */ :root{ --ink:#FAF8F3; --panel:#FFFFFF; --panel-2:#F6F3EC; --panel-3:#EFEBE1; --line:rgba(25,23,34,.10); --line-2:rgba(25,23,34,.17); --text:#191722; --muted:#5F5A70; --muted-2:#7B7690; --c1:#0E9FC2; --c2:#5B4FE0; --c3:#D63A8C; --grad:linear-gradient(120deg,#0E9FC2 0%,#5B4FE0 52%,#D63A8C 100%); --grad-soft:linear-gradient(120deg,rgba(14,159,194,.10),rgba(91,79,224,.10),rgba(214,58,140,.10)); --brand:#5B4FE0; --green:#108A57; --red:#C8412B; } /* glows suaves + sin grano sobre papel */ body::before{background:radial-gradient(900px 600px at 22% -8%,rgba(91,79,224,.06),transparent 60%),radial-gradient(700px 520px at 92% -10%,rgba(214,58,140,.045),transparent 58%)} .fx-grain{display:none} /* chrome translúcido oscuro -> claro */ nav{background:rgba(250,248,243,.82)} .mcta{background:rgba(250,248,243,.95)} footer{background:#F2EEE5} /* botones gradiente: texto blanco (mejor contraste sobre el gradiente profundo) */ .btn-grad{color:#fff} .btn-ghost{color:var(--text)} .btn-ghost:hover{color:var(--text);border-color:var(--brand)} .osmap-tag,.mc-type,.osmap-tag.mono{color:#fff} .card{box-shadow:0 18px 40px -32px rgba(25,23,34,.4)} /* textos que en las páginas van en gris-claro hardcodeado (claro/oscuro) -> gris oscuro legible */ .hero .lead,.hero-bullets li,.osmap-foot,.col li,.case p,.rq,.whoami p,.tier li,.guar li,.mdoc p,.msub{color:#46415A} /* diagramas: tarjeta CLARA + recolor del SVG para que se lea sobre papel (el gradiente sigue resaltando) */ .fig .box,.mfig .box{background:#FFFFFF;border:1px solid #E7E2D7;box-shadow:0 18px 40px -32px rgba(25,23,34,.32)} .fig svg [fill="#0E0D1A"],.mfig svg [fill="#0E0D1A"]{fill:#FFFFFF} .fig svg g[fill="#EDEBF3"],.mfig svg g[fill="#EDEBF3"]{fill:#1A1822} .fig svg g[fill="#8C88A0"],.mfig svg g[fill="#8C88A0"],.fig svg text[fill="#8C88A0"],.mfig svg text[fill="#8C88A0"]{fill:#6B6680} .fig svg text[fill="#9C98B4"],.mfig svg text[fill="#9C98B4"]{fill:#6B6680} .fig svg text[fill="#CFCBDA"],.mfig svg text[fill="#CFCBDA"]{fill:#46415A} .fig svg [stroke="#2A2740"],.mfig svg [stroke="#2A2740"]{stroke:#E7E2D7} .fig figcaption,.mfig figcaption{color:#6B6680} /* refuerzo claro para la tarjeta del caso y la banda "trincheras" (quito el glow violeta que la oscurecía en miniatura) */ .case{background:#FFFFFF} .case-top::after{display:none} .case .big,.whoami .who-h{color:var(--text)} /* ============================================================ VAULT (/para/:slug + /vault) — override a tema claro. vault-brand.css define los .pv-*/.mc-* para fondo OSCURO; esta hoja carga después y los pasa a claro legible. No tocar vault-brand.css. */ body.pv-app-body{background:radial-gradient(1100px 620px at 12% -8%,rgba(91,79,224,.06),transparent 60%),radial-gradient(900px 520px at 100% 0%,rgba(14,159,194,.045),transparent 55%),var(--ink)} /* Sidebar: panel blanco nítido */ .pv-sidebar{background:#FFFFFF;border-right:1px solid var(--line-2)} .pv-side-name{color:var(--text)} .pv-side-by,.pv-side-note,.pv-side-foot .pv-side-note{color:var(--muted)} .pv-nav-item{color:var(--muted)} .pv-nav-item:hover{color:var(--text);background:rgba(25,23,34,.05)} .pv-nav-item.is-active{color:var(--brand);background:var(--grad-soft);border-color:rgba(91,79,224,.35);box-shadow:0 10px 26px -20px rgba(91,79,224,.5)} .pv-nav-ico{color:var(--brand);background:rgba(91,79,224,.10);border-color:rgba(91,79,224,.20)} .pv-nav-item.is-active .pv-nav-ico{background:rgba(91,79,224,.18);color:var(--brand)} /* Nav superior (modo sin sidebar) */ .pv-nav{background:rgba(250,248,243,.85);border-bottom:1px solid var(--line)} .pv-nav a:hover{color:var(--text)} .pv-mobilebar{background:rgba(250,248,243,.95);border-bottom:1px solid var(--line-2)} /* hamburguesa móvil: era color:#fff (invisible sobre claro) → icono oscuro + botón visible */ .pv-hamb{color:var(--text);background:#FFFFFF;border:1px solid var(--line-2);box-shadow:0 2px 8px -4px rgba(25,23,34,.3)} .pv-mobile-cta{color:var(--brand);border-color:rgba(91,79,224,.35);background:var(--grad-soft)} /* Secciones + cuerpo */ .pv-sec{border-bottom:1px solid var(--line)} .pv-topbar-sub{color:var(--muted)} .pv-def-v{color:#2A2740} .pv-note p{color:#2A2740} .pv-note-k{color:var(--brand)} .pv-find-i,.pv-find-h{color:var(--muted)} /* Tarjetas: blanco con borde visible (en oscuro eran tintes blancos) */ .pv-score-card{background:#FFFFFF;border:1px solid var(--line);box-shadow:0 18px 48px -34px rgba(25,23,34,.42)} .pv-find{background:#FFFFFF;border:1px solid var(--line)} .pv-find:hover{border-color:rgba(91,79,224,.4);background:linear-gradient(180deg,rgba(91,79,224,.06),#FFFFFF)} .pv-note{background:linear-gradient(180deg,rgba(91,79,224,.08),rgba(91,79,224,.02));border:1px solid rgba(91,79,224,.22)} .pv-col{background:#FFFFFF;border:1px solid var(--line)} .pv-col--new{border-color:rgba(91,79,224,.45);background:rgba(91,79,224,.06)} .pv-compare-col p{color:#2A2740} .pv-calc input{background:#FFFFFF;border:1px solid var(--line-2);color:var(--text)} /* Textos secundarios hardcoded (#C9C5D6/#D8D4E2/#D8D4E4) heredados del tema oscuro → gris legible sobre papel */ .lm-l .lead,.lm-bullets li,.vt-item,.vt-band,.vt-field,.v-feat p,.v-feat li,.vt-weak,.bp-actions li,.pv-pc-angle,.pv-bridge-side p,.pv-deliv-body p,.pv-deliv-list li{color:#46415A} /* utilidades tipo Tailwind usadas en estados de error del vault */ .text-white\/60,.text-white\/70,.text-white\/80{color:#5F5A70} /* Scorecard ring + marco navegador */ .pv-score-track{stroke:rgba(25,23,34,.10)} .pv-browser{border-color:var(--line-2)} .pv-browser-bar{background:#F2EEE5;border-bottom-color:var(--line)} .pv-browser-dots i{background:rgba(25,23,34,.16)} .pv-browser-dots i:nth-child(1){background:#F0816B}.pv-browser-dots i:nth-child(2){background:#F0C24B}.pv-browser-dots i:nth-child(3){background:#5FD0A0} .pv-browser-url{color:var(--muted)} .pv-gate-card{background:#FFFFFF;border:1px solid var(--line);box-shadow:0 30px 70px -50px rgba(25,23,34,.5)} .pv-gate-input{background:#FFFFFF;border:1px solid var(--line-2);color:var(--text)}