/*
Theme Name: Showcase Moderno
Theme URI: https://example.com/showcase-moderno
Author: AniscaTech
Author URI: https://anisca.tech
Description: Tema de portafolio moderno, dinámico y futurista para Tech, Power BI y diseño (PSD/AI/Canva). Animaciones CSS, grid filtrable sin plugins pagos, y shortcodes útiles.
Version: 1.0.0
License: GPL-2.0-or-later
Text Domain: showcase-moderno
Tags: portfolio, grid, dark, responsive, animation, power-bi, creative
Country: Ecuador
Contact: ceo@aniscatech.com, 0981850302
*/

:root{
  --bg:#0b0f14;
  --bg2:#0e141b;
  --text:#e9eef7;
  --muted:#a9b3c3;
  --acc:#38bdf8;
  --acc2:#a78bfa;
  --card:#111824;
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --radius:18px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,'Helvetica Neue',Arial,'Apple Color Emoji','Segoe UI Emoji';}
a{color:var(--acc);text-decoration:none}
img{max-width:100%;height:auto;display:block}
.container{width:min(1200px,92%);margin:0 auto}

.btn{display:inline-grid;place-items:center;padding:.85rem 1.1rem;border-radius:999px;background:linear-gradient(135deg,var(--acc),var(--acc2));color:#001018;font-weight:700;box-shadow:var(--shadow);transition:transform .2s ease, filter .3s ease}
.btn:hover{transform:translateY(-2px);filter:saturate(1.1)}

header.site-header{position:sticky;top:0;background:rgba(11,15,20,.8);backdrop-filter:blur(8px);border-bottom:1px solid #13202f;z-index:50}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0}
.brand{display:flex;align-items:center;gap:.75rem}
.brand .logo{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--acc2),var(--acc));box-shadow:var(--shadow)}
.nav a{color:var(--text);opacity:.9}
.nav .menu{display:flex;gap:1rem;align-items:center}

.hero{padding:72px 0 36px;background:radial-gradient(1200px 600px at 80% -10%,rgba(56,189,248,.15),transparent 60%),radial-gradient(900px 500px at -10% 0,rgba(167,139,250,.18),transparent 55%)}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:2.4rem}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr}}
.h-title{font-size:clamp(28px,5vw,52px);line-height:1.05;margin:0 0 .5rem}
.h-sub{color:var(--muted);font-size:clamp(14px,2.2vw,18px);margin:0 0 1.25rem}

.section{padding:44px 0}
.section h2{font-size:clamp(22px,3.2vw,32px);margin:0 0 14px}
.muted{color:var(--muted)}

.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card{grid-column:span 4;background:var(--card);border:1px solid #1a2736;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);position:relative;transform:translateZ(0)}
@media(max-width:1100px){.card{grid-column:span 6}}
@media(max-width:680px){.card{grid-column:span 12}}
.card .thumb{aspect-ratio:16/10;background:#0d1520}
.card .content{padding:14px}
.badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.badge{font-size:12px;border:1px solid #233446;border-radius:999px;padding:.25rem .55rem;color:var(--muted)}

.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.filter-btn{padding:.55rem .9rem;border-radius:999px;border:1px solid #203043;background:#0d1520;color:var(--text);cursor:pointer;transition:all .25s ease}
.filter-btn[aria-pressed="true"]{background:linear-gradient(135deg,rgba(56,189,248,.25),rgba(167,139,250,.25));border-color:#2c4259}

.footer{border-top:1px solid #13202f;padding:32px 0;color:var(--muted)}

/* Animaciones CSS */
.reveal{opacity:0;transform:translateY(16px);animation:reveal .7s ease forwards}
.reveal-del-1{animation-delay:.1s}
.reveal-del-2{animation-delay:.2s}
.reveal-del-3{animation-delay:.3s}
@keyframes reveal{to{opacity:1;transform:none}}

.floaty{animation:floaty 6s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

.glow{box-shadow:0 0 0 rgba(56,189,248,0);animation:glow 3s ease-in-out infinite}
@keyframes glow{50%{box-shadow:0 0 40px rgba(167,139,250,.25)}}

/* Modo claro opcional */
.light{--bg:#f7fbff;--bg2:#f0f6ff;--text:#0b1320;--muted:#475569;--card:#ffffff}