/*
Theme Name: CSM Agencia
Theme URI: https://example.com/
Author: CSM
Description: Tema one-page para agencia digital. Fondo oscuro, acento verde flúor, animaciones de scroll y contenido 100% editable desde Apariencia → Personalizar y los paneles Servicios / Proceso / Proyectos.
Version: 1.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GPL v2 or later
Text Domain: csm
*/

:root{--acc:#B6FF00;--bg:#050505;--dim:#7C7C7C}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:#050505;color:#fff;font-family:Archivo,"Helvetica Neue",Helvetica,sans-serif;overflow-x:clip;-webkit-font-smoothing:antialiased}
a{color:var(--acc);text-decoration:none}
a:hover{color:#fff}
::selection{background:var(--acc);color:#050505}
button{font-family:inherit}
h1,h2,h3,p{text-wrap:pretty}
img{max-width:100%}
section[id]{scroll-margin-top:86px}
:focus-visible{outline:2px solid var(--acc);outline-offset:3px;border-radius:6px}

@keyframes rise{from{opacity:0;transform:translateY(110%)}to{opacity:1;transform:translateY(0)}}
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes mq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes pulse{0%,100%{opacity:.35;transform:scale(1)}50%{opacity:1;transform:scale(1.35)}}
@keyframes sweep{0%{transform:translateY(-100%)}100%{transform:translateY(400%)}}
@keyframes blink{0%,45%{opacity:1}50%,95%{opacity:.15}100%{opacity:1}}

/* --- visibilidad desktop / mobile (reemplaza el render condicional) --- */
.csm-desk{display:flex}
.csm-mob{display:none}
@media (max-width:899px){
  .csm-desk{display:none !important}
  .csm-mob{display:flex}
}

/* --- estados hover / active --- */
.csm-nv:hover{color:#fff !important;background:rgba(255,255,255,.06)}
.csm-btn-p:hover{box-shadow:0 14px 48px rgba(182,255,0,.45);color:#050505}
.csm-btn-p:active{box-shadow:0 4px 16px rgba(182,255,0,.35)}
.csm-btn-nav:hover{box-shadow:0 8px 34px rgba(182,255,0,.42);color:#050505}
.csm-btn-s:hover{border-color:rgba(182,255,0,.5);background:rgba(182,255,0,.07);color:#fff}
.csm-btn-xl:hover{box-shadow:0 0 70px rgba(182,255,0,.6);color:#050505}
.csm-stat{transition:border-color .35s ease,transform .35s ease}
.csm-stat:hover{border-color:rgba(182,255,0,.35);transform:translateY(-3px)}
.csm-card:hover{border-color:rgba(182,255,0,.4);box-shadow:0 18px 50px rgba(0,0,0,.55);transform:translateY(-5px)}
.csm-card-proj:hover{border-color:rgba(182,255,0,.4);box-shadow:0 20px 56px rgba(0,0,0,.55);transform:translateY(-5px);color:#fff}
.csm-step:hover{background:rgba(255,255,255,.028);border-color:rgba(255,255,255,.07)}
.csm-tag:hover{background:rgba(182,255,0,.11);border-color:rgba(182,255,0,.5);color:#fff}
.csm-chip:hover{border-color:rgba(182,255,0,.45);color:#fff;background:rgba(182,255,0,.06)}
.csm-flink:hover{color:var(--acc)}
.csm-dock-a:active{background:#9EDD00;color:#050505}
.csm-dock-b:active{border-color:var(--acc);color:var(--acc)}

@media (hover:none){*{cursor:auto}}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  html{scroll-behavior:auto}
}

/* barra de admin: que no tape el header fijo */
body.admin-bar #csm-header{top:32px}
@media screen and (max-width:782px){body.admin-bar #csm-header{top:46px}}