:root{--bg:#0b0c0e;--bg-soft:#111318;--text:#e6e8eb;--muted:#b3b9c4;--brand:#6cf;--card:#161922;--border:#232634;--accent:#9effa9}
*{box-sizing:border-box}
html{font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Noto Sans",sans-serif;line-height:1.5;color-scheme:light dark;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text)}
.container{width:min(1100px,92vw);margin-inline:auto}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:1rem;top:1rem;width:auto;height:auto;background:#000;color:#fff;padding:.5rem .75rem;border-radius:.5rem;z-index:10}
.visually-hidden{position:absolute !important;height:1px;width:1px;clip:rect(1px,1px,1px,1px);overflow:hidden;white-space:nowrap}

/* Header & Hero */
.site-header{border-bottom:1px solid var(--border);background:linear-gradient(180deg,#0b0c0e 0%,#0b0c0e 60%,#0d1016 100%)}
.topbar{display:grid;grid-template-columns:.6fr auto 1fr;align-items:center;padding:1rem 0;gap:1rem}
.brand{margin:0;font-size:clamp(1.1rem,2.2vw,1.4rem);letter-spacing:.12em;text-decoration:none;color:var(--text);justify-self:end;padding-right:1rem}
.menu{list-style:none;margin:0;padding:0;display:flex;gap:1.1rem;justify-self:center}
.menu__link{display:inline-block;padding:.45rem .1rem;border:0;border-radius:0;text-decoration:none;color:var(--text);background:transparent;text-transform:uppercase;position:relative}
.menu__link::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:linear-gradient(90deg,#a78bfa,#c084fc);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.menu__link:hover::after{transform:scaleX(1)}
.hero{display:grid;grid-template-columns:1.1fr 1fr .6fr;gap:2rem;padding:2rem 0}
.hero__media img{width:100%;height:auto;border-radius:.75rem;object-fit:cover;border:1px solid var(--border)}
.hero__data h2,.hero__sidebar h2{margin:.25rem 0 1rem;text-align:center}
.kv{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.kv__k{font-weight:600;color:var(--muted)}
.kv__v{margin-left:.5rem}
/* Workshop simple (sin carrusel) */
.v-carousel{display:none}
.workshop-list{list-style:none;margin:.5rem 0 0;padding:0;display:grid;gap:.75rem}
.workshop-list img{display:block;border-radius:.6rem;border:1px solid var(--border);background:var(--card)}

/* Communities */
/* Sección de comunidades eliminada */

/* Portfolio */
.portfolio{padding:2rem 0;border-top:1px solid var(--border)}
.portfolio .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.card{background:var(--card);border:1px solid var(--border);border-radius:.9rem;overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit;transform:translateZ(0);transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease}
.card:hover{transform:scale(1.035);box-shadow:0 10px 30px rgba(0,0,0,.35);border-color:#2a3244}
.reduced-motion .card,.reduced-motion .card:hover{transition:none;transform:none;box-shadow:none}
.card img{display:block;width:100%;height:auto}
.card__body{padding:1.1rem}
.card__title{margin:.25rem 0 .5rem;font-size:1.2rem}
.card__desc{margin:0 0 .5rem;color:var(--muted)}
.card__meta{margin:0;color:var(--accent)}

/* Projects - estilo como referencia (imagen grande + tira de miniaturas) */
.projects{padding:2rem 0;border-top:1px solid var(--border)}
.project-hero{margin-bottom:1rem}
.project-hero__media{position:relative;overflow:hidden;border:1px solid var(--border);border-radius:.75rem}
.project-hero__media img{width:100%;height:auto;display:block;opacity:.8;transition:transform .4s ease, opacity .3s ease}
.project-hero__media:hover img{transform:scale(1.035);opacity:1}
.project-hero__caption{position:absolute;left:0;right:0;bottom:0;padding:1rem 1.25rem;background:linear-gradient(180deg,rgba(0,0,0,0) 0%, rgba(0,0,0,.55) 100%);color:#fff;font-weight:700;font-size:clamp(1.1rem,2.4vw,1.8rem)}

.project-strip{position:relative}
.project-strip__track{list-style:none;margin:0;padding:0;display:grid;grid-auto-flow:column;gap:.75rem;overflow:auto}
.project-strip__item{display:block}
.thumb-img{display:block;border-radius:.5rem;border:1px solid var(--border);opacity:.85;transition:transform .3s ease, opacity .25s ease;cursor:pointer}
.thumb-img:hover,.thumb-img.is-active{transform:scale(1.03);opacity:1}

/* Footer */
.site-footer{border-top:1px solid var(--border);padding:1.25rem 0;margin-top:2rem}
.site-footer .container{text-align:center}
.signature{letter-spacing:.35em;text-transform:uppercase}

/* Lightbox */
.lightbox{border:0;padding:0;background:transparent}
.lightbox::backdrop{background:rgba(0,0,0,.7)}
.lightbox__img{max-width:min(95vw,1200px);max-height:85vh;display:block;border-radius:.5rem}
.lightbox__close{position:absolute;top:1rem;right:1rem;background:rgba(0,0,0,.6);color:#fff;border:0;border-radius:.5rem;padding:.35rem .6rem;cursor:pointer}

/* Responsividad */
@media (max-width: 1024px){
  .hero{grid-template-columns:1fr 1fr}
  .hero__sidebar{grid-column:1/-1}
  .portfolio .cards{grid-template-columns:repeat(2,1fr)}
  .projects__grid{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .hero{grid-template-columns:1fr;gap:1rem}
  .portfolio .cards{grid-template-columns:1fr}
  .project-main__media{height:clamp(280px,55vw,520px)}
}