/* ═══════════════════════════════════════
   HyO Espacios y Diseños — Global CSS
   Compartido por todas las páginas
═══════════════════════════════════════ */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --rojo:#a62e2e;
  --rojo2:#8a2424;
  --gris-bg:#f2f2f0;
  --gris-sec:#e8e8e4;
  --txt:#1a1a1a;
  --txt2:#5a5a52;
  --txt3:#86827a;
  --blanco:#ffffff;
  --borde:#d8d8d0;
}
body{
  background:var(--gris-bg);
  color:var(--txt);
  font-family:'Segoe UI',system-ui,sans-serif;
  overflow-x:hidden;
}

/* ── HEADER COMPARTIDO ── */
.site-header{background:var(--blanco);border-bottom:3px solid var(--rojo)}
.header-top{display:flex;justify-content:center;padding:18px 2rem 0}
.logo-wrap{display:flex;align-items:center;gap:10px}
.navbar{background:var(--rojo);display:flex;justify-content:center;flex-wrap:wrap;margin-top:14px}
.navbar a{color:#fff;text-decoration:none;padding:13px 22px;font-size:.82rem;letter-spacing:.08em;text-transform:uppercase;font-weight:500;transition:background .2s}
.navbar a:hover,.navbar a.active{background:var(--rojo2)}

/* ── FOOTER COMPARTIDO ── */
.site-footer{background:#1a1a1a;padding:3rem 2rem;text-align:center}
.site-footer p{font-size:.78rem;color:#4a4a3a;letter-spacing:.08em}

/* ── BOTONES ── */
.btn-rojo{background:var(--rojo);color:#fff;border:none;padding:.85rem 2.2rem;font-size:.9rem;font-weight:600;letter-spacing:.06em;cursor:pointer;transition:background .2s,transform .15s;font-family:inherit}
.btn-rojo:hover{background:var(--rojo2);transform:translateY(-2px)}

/* ── SCROLL REVEAL ── */
.sr{opacity:0;transition:opacity .7s ease,transform .7s ease}
.sr-up{transform:translateY(40px)}
.sr-left{transform:translateX(-40px)}
.sr-right{transform:translateX(40px)}
.sr.visible{opacity:1;transform:none}
.sr-delay-1{transition-delay:.1s}
.sr-delay-2{transition-delay:.2s}
.sr-delay-3{transition-delay:.3s}

/* ── BARRA PROGRESO ── */
.scroll-bar{position:fixed;top:0;left:0;height:3px;background:var(--rojo);z-index:9999;width:0%;transition:width .1s linear}

@media(max-width:768px){
  .navbar a{padding:10px 14px;font-size:.75rem}
  .header-top{padding:12px 1rem 0}
}