:root{--bg:#0b1220;--bg2:#0f172a;--card:#0f172a;--mut:#9aa4b2;--txt:#e6edf3;--acc:#22d3ee;--acc2:#8b5cf6}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(1200px 600px at 10% 0%,#0b1220 0%,#0f172a 50%,#0b1220 100%);color:var(--txt);font-family:Inter,system-ui,Segoe UI,Arial,sans-serif}
.bg{position:fixed;inset:0;pointer-events:none}
.bg::before{content:"";position:absolute;inset:-20%;background:conic-gradient(from 200deg at 50% 50%,rgba(34,211,238,.08),rgba(139,92,246,.08),transparent);filter:blur(60px)}
.noise{position:absolute;inset:0;background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.9" numOctaves="2" stitchTiles="stitch"/></filter><rect width="100%" height="100%" opacity="0.02" filter="url(%23n)"/></svg>');mix-blend-mode:soft-light}
.container{max-width:1100px;margin:0 auto;padding:24px}
.nav{position:sticky;top:0;backdrop-filter:saturate(140%) blur(10px);background:rgba(11,18,32,.6);border-bottom:1px solid rgba(255,255,255,.06);z-index:50}
.nav-inner{display:flex;justify-content:space-between;align-items:center}
.brand{font-weight:800;letter-spacing:.3px}
.brand span{color:var(--acc)}
.links a{color:var(--txt);text-decoration:none;margin-left:18px}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:#0b1220;color:var(--txt);text-decoration:none}
.btn.primary{background:linear-gradient(135deg,var(--acc),var(--acc2));border-color:transparent;color:#0b1220;font-weight:700}
.btn.ghost{background:transparent}
.btn.sm{padding:8px 12px}
.btn.full{display:block;text-align:center;margin-top:12px}
.hero{display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:center;padding:32px 0}
.hero .copy h1{font-size:38px;margin:0 0 10px}
.hero .copy h1 span{background:linear-gradient(135deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .copy p{color:var(--mut);margin:0 0 16px}
.hero .cta{display:flex;gap:12px}
.hero-media{display:grid;gap:14px}
.card{display:flex;gap:12px;align-items:center;background:rgba(17,24,39,.7);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:14px}
.card.gradient{background:linear-gradient(180deg,rgba(34,211,238,.12),rgba(139,92,246,.12));border-color:rgba(255,255,255,.12)}
.card.gradient.delay{animation:pop .7s .2s both}
@keyframes pop{from{transform:translateY(6px);opacity:0}to{transform:translateY(0);opacity:1}}
.packs{padding:10px 0}
.packs h2,.includes h2{font-size:26px;margin:16px 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid.two{grid-template-columns:repeat(2,1fr)}
.grid.three{grid-template-columns:repeat(3,1fr)}
.pack{background:rgba(17,24,39,.7);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:18px;position:relative}
.pack .price{font-size:28px;color:var(--acc);font-weight:700;margin:6px 0}
.pack.featured{border-color:transparent;background:linear-gradient(180deg,rgba(34,211,238,.18),rgba(139,92,246,.18))}
.badge{position:absolute;top:12px;right:12px;background:linear-gradient(135deg,var(--acc),var(--acc2));color:#0b1220;font-size:12px;padding:4px 8px;border-radius:999px;font-weight:800}
.inc-card{background:rgba(17,24,39,.7);border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:18px}
.inc-card h4{margin:0 0 6px}
ul{margin:6px 0 0 18px;color:#cbd5e1}
.mut{color:var(--mut)}
.portfolio{padding:10px 0}
.pf-card{background:rgba(17,24,39,.7);border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden}
.pf-card img{display:block;width:100%;height:auto}
.pf-card figcaption{padding:10px;color:#cbd5e1}
.album{margin:22px 0}
.album h3{margin:6px 0 10px}
.carousel{position:relative;border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden;background:rgba(17,24,39,.7)}
.slides{display:flex;transition:transform .35s ease}
.slide{min-width:100%;aspect-ratio:2/3;display:grid;place-items:center;background:#0b1220}
.slide img{height:100%;width:auto;max-width:100%;object-fit:contain}
.ctrl{position:absolute;top:50%;transform:translateY(-50%);background:rgba(11,18,32,.6);border:1px solid rgba(255,255,255,.12);color:#e6edf3;border-radius:999px;width:38px;height:38px;display:grid;place-items:center;font-size:22px;cursor:pointer}
.ctrl:hover{background:rgba(11,18,32,.8)}
.ctrl.prev{left:10px}
.ctrl.next{right:10px}
/* Thumbnails bajo cada carrusel */
.thumbs{display:flex;gap:8px;overflow:auto;padding:10px 4px 0 4px}
.thumb{flex:0 0 auto;width:72px;height:48px;border-radius:8px;border:1px solid rgba(255,255,255,.1);opacity:.7;cursor:pointer;overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb.active{outline:2px solid var(--acc);opacity:1}
.thumb:focus-visible{outline:2px solid var(--acc2)}
@media (max-width:480px){.thumb{width:56px;height:36px}}
.footer{border-top:1px solid rgba(255,255,255,.06);margin-top:24px}
.footer .container{padding:20px;color:var(--mut);text-align:center}
.wa{display:flex;gap:10px;align-items:center;justify-content:center;margin-top:8px;color:var(--mut)}
.wa a{color:var(--txt);text-decoration:none;font-weight:600}
.wa-ico{display:inline-flex;color:#25D366}
.wa-img{width:32px;height:32px}
@media (max-width:980px){.hero{grid-template-columns:1fr}.grid{grid-template-columns:1fr}.grid.two{grid-template-columns:1fr}.grid.three{grid-template-columns:1fr}}
