*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#020c16;--bg2:#031c2e;--card:#03253d;--borde:rgba(4,95,150,0.25);--azul:#0693e3;--azul2:#0575bb;--blanco:#f5f2ed;--gris:#8ab4cc;--acento:#c8a96e}
html{scroll-behavior:smooth}
body{font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--blanco);overflow-x:hidden}
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:center;padding:1.4rem 4rem;transition:background .4s}
nav.sc{background:rgba(2,12,22,.97);backdrop-filter:blur(12px);border-bottom:1px solid var(--borde)}
.logo{font-family:'Josefin Sans',sans-serif;font-size:.9rem;font-weight:300;letter-spacing:.3em;text-decoration:none;text-transform:uppercase}
.logo .w{color:var(--blanco)}.logo .b{color:var(--azul)}
.nav-links{display:flex;gap:2rem;list-style:none}
.nav-links a{font-size:.7rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--gris);text-decoration:none;transition:color .3s}
.nav-links a:hover{color:var(--azul)}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none}
.burger span{display:block;width:24px;height:1px;background:var(--blanco)}
#mob{display:none;position:fixed;inset:0;background:rgba(2,12,22,.98);z-index:150;flex-direction:column;justify-content:center;align-items:center;gap:2.5rem}
#mob a{font-family:'Playfair Display',serif;font-size:2rem;color:var(--blanco);text-decoration:none}
#hero{height:100vh;position:relative;display:flex;align-items:flex-end;padding:0 4rem 5rem;overflow:hidden;background:linear-gradient(135deg,#020c16 0%,#031c2e 50%,#020c16 100%)}
.h-grid{position:absolute;inset:0;opacity:.05;background-image:linear-gradient(rgba(4,95,150,.7) 1px,transparent 1px),linear-gradient(90deg,rgba(4,95,150,.7) 1px,transparent 1px);background-size:80px 80px}
.h-glow{position:absolute;top:-200px;right:-100px;width:700px;height:700px;background:radial-gradient(circle,rgba(4,95,150,.1) 0%,transparent 70%);pointer-events:none}
.h-line{position:absolute;left:3.5rem;top:20%;bottom:20%;width:1px;background:linear-gradient(to bottom,transparent,var(--azul),transparent);opacity:.4}
.h-num{position:absolute;right:3rem;top:50%;transform:translateY(-50%);font-family:'Playfair Display',serif;font-size:clamp(10rem,20vw,20rem);font-weight:900;color:transparent;-webkit-text-stroke:1px rgba(4,95,150,.12);user-select:none;pointer-events:none}
.h-carousel{position:absolute;right:5rem;bottom:0;top:0;width:40%;overflow:hidden;pointer-events:none;mask-image:linear-gradient(to right,transparent 0%,black 15%,black 85%,transparent 100%),linear-gradient(to top,transparent 0%,black 8%);mask-composite:intersect;-webkit-mask-image:linear-gradient(to right,transparent 0%,black 15%,black 85%,transparent 100%),linear-gradient(to top,transparent 0%,black 8%);-webkit-mask-composite:destination-in}
.h-slide{position:absolute;inset:0;opacity:0;transition:opacity 1.4s ease}
.h-slide.on{opacity:1}
.h-slide img{width:100%;height:100%;object-fit:cover;object-position:center top;filter:grayscale(8%) contrast(1.05);opacity:.6}
.h-content{position:relative;z-index:2;max-width:58%}
.h-tag{display:inline-block;font-size:.68rem;font-weight:500;letter-spacing:.25em;text-transform:uppercase;color:var(--azul);margin-bottom:1.5rem;border-left:2px solid var(--azul);padding-left:1rem}
.h-title{font-family:'Playfair Display',serif;font-size:clamp(4rem,9vw,9rem);font-weight:900;line-height:.9;color:var(--blanco);margin-bottom:.2rem}
.h-title em{font-style:italic;color:var(--acento)}
.h-sub{font-family:'Playfair Display',serif;font-size:clamp(1.4rem,2.8vw,3rem);font-weight:400;font-style:italic;color:var(--gris);margin-bottom:2rem}
.h-bio{font-size:.95rem;font-weight:300;line-height:1.85;color:var(--gris);max-width:480px;margin-bottom:2.5rem}
.h-ctas{display:flex;gap:1.5rem;flex-wrap:wrap}
.btn-p{display:inline-block;padding:1rem 2.5rem;background:var(--azul);color:#fff;font-size:.75rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;transition:all .3s;clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%)}
.btn-p:hover{background:var(--azul2);transform:translateY(-2px)}
.btn-g{display:inline-block;padding:1rem 2.5rem;border:1px solid rgba(6,147,227,.4);color:var(--blanco);font-size:.75rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;transition:all .3s}
.btn-g:hover{border-color:var(--azul);color:var(--azul)}
.h-dots{position:absolute;bottom:2.5rem;right:5rem;z-index:3;display:flex;gap:.5rem}
.h-dot{width:24px;height:2px;background:rgba(255,255,255,.25);cursor:pointer;transition:all .3s;border:none}
.h-dot.on{background:var(--azul);width:40px}
#btt{position:fixed;bottom:2rem;right:2rem;z-index:200;width:46px;height:46px;background:var(--azul);display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;opacity:0;pointer-events:none;transition:opacity .4s,transform .3s;clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,0 100%)}
#btt.on{opacity:1;pointer-events:all}
#btt:hover{transform:translateY(-3px);background:var(--azul2)}
#btt svg{stroke:#fff;fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
section{padding:8rem 4rem}
.slabel{font-size:.65rem;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--azul);margin-bottom:1rem;display:flex;align-items:center;gap:1rem}
.slabel::after{content:'';flex:1;max-width:60px;height:1px;background:var(--azul);opacity:.4}
.stitle{font-family:'Playfair Display',serif;font-size:clamp(2.5rem,5vw,5rem);font-weight:700;line-height:1.1;margin-bottom:1.5rem;color:var(--blanco)}
.stitle em{font-style:italic;color:var(--acento)}
#sobre{background:var(--bg2);display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center}
.st{font-size:1rem;font-weight:300;line-height:1.9;color:var(--gris);margin-bottom:1.5rem}
.st strong{color:var(--blanco);font-weight:500}
.stats{display:flex;gap:3rem;margin-top:3rem;padding-top:2rem;border-top:1px solid var(--borde)}
.sn{font-family:'Playfair Display',serif;font-size:2.5rem;font-weight:900;color:var(--azul);line-height:1}
.sl{font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gris);margin-top:.3rem}
.fframe{position:relative}
.fframe::before{content:'';position:absolute;top:1.5rem;right:-1.5rem;bottom:-1.5rem;left:1.5rem;border:1px solid rgba(6,147,227,.25);z-index:0;pointer-events:none}
.fframe img{position:relative;z-index:1;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center top;display:block}
.fbadge{position:absolute;bottom:-1.5rem;left:-1.5rem;z-index:2;background:var(--azul);color:#fff;padding:1.25rem 1.75rem;font-family:'Playfair Display',serif;font-size:.85rem;font-weight:700;font-style:italic;max-width:220px;line-height:1.3}
#companias{background:var(--bg)}
.comp-grid{display:grid;grid-template-columns:1fr 1fr;gap:2px;margin-top:4rem}
.comp-card{position:relative;overflow:hidden;aspect-ratio:4/3;display:block;text-decoration:none}
.comp-bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.95;filter:brightness(.95);transition:opacity .4s,transform .6s,filter .4s}
.comp-card:hover .comp-bg-img{opacity:1;filter:brightness(.75);transform:scale(1.04)}
.comp-ov{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;padding:2.5rem;background:linear-gradient(to top,rgba(2,12,22,.92) 0%,rgba(2,12,22,.15) 50%,transparent 100%)}
.comp-logo{width:80px;height:80px;object-fit:contain;margin-bottom:1.2rem;transition:transform .3s;filter:drop-shadow(0 2px 8px rgba(0,0,0,.5))}
.comp-card:hover .comp-logo{transform:scale(1.05)}
.comp-name{font-family:'Josefin Sans',sans-serif;font-size:1.4rem;font-weight:300;letter-spacing:.2em;text-transform:uppercase;color:var(--blanco);margin-bottom:.4rem}
.comp-role{font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;color:var(--azul);margin-bottom:1rem}
.comp-arr{width:36px;height:1px;background:var(--azul);position:relative;transition:width .3s}
.comp-arr::after{content:'';position:absolute;right:0;top:-3px;border:3px solid transparent;border-left:5px solid var(--azul)}
.comp-card:hover .comp-arr{width:60px}
#actuando{background:var(--bg);padding:8rem 0 0}
.ac-header{padding:0 4rem 3rem}
.ac-wrap{position:relative;width:100%;height:70vh;overflow:hidden;background:var(--card)}
.ac-slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease}
.ac-slide.on{opacity:1}
.ac-slide img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;display:block}
.ac-bg{position:absolute;inset:0;z-index:0;background-position:center;background-size:cover;background-repeat:no-repeat;filter:blur(28px) brightness(.5);transform:scale(1.15)}
.ac-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:10;background:rgba(2,12,22,.6);border:1px solid rgba(6,147,227,.3);color:var(--blanco);width:52px;height:52px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s;backdrop-filter:blur(4px)}
.ac-btn:hover{background:var(--azul);border-color:var(--azul)}
.ac-btn svg{stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ac-prev{left:1.5rem}.ac-next{right:1.5rem}
.ac-dots{position:absolute;bottom:1.5rem;left:50%;transform:translateX(-50%);z-index:10;display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;max-width:80%}
.ac-dot{width:20px;height:2px;background:rgba(255,255,255,.25);cursor:pointer;transition:all .3s;border:none}
.ac-dot.on{background:var(--azul);width:32px}
.ac-counter{position:absolute;top:1.5rem;right:1.5rem;z-index:10;font-family:'Josefin Sans',sans-serif;font-size:.7rem;letter-spacing:.2em;color:rgba(255,255,255,.5);background:rgba(2,12,22,.5);padding:.4rem .8rem;backdrop-filter:blur(4px)}
#fotos{background:var(--bg2);padding-bottom:0}
.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:420px 420px;gap:3px;margin-top:3rem}
.fi{overflow:hidden;position:relative;background:var(--card)}
.fi:first-child{grid-row:1/3}
.fi img{width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .6s,filter .4s;filter:grayscale(10%);display:block}
.fi:hover img{transform:scale(1.04);filter:grayscale(0%)}
.fov{position:absolute;inset:0;background:linear-gradient(to top,rgba(2,12,22,.5) 0%,transparent 50%);opacity:0;transition:opacity .4s}
.fi:hover .fov{opacity:1}
#obras{background:var(--bg)}
.obras-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:0;margin-top:3rem}
.obra{position:relative;overflow:hidden;cursor:default;aspect-ratio:2/3;background:var(--card)}
.obra-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;transition:transform .6s,filter .4s;filter:brightness(.95) saturate(.85)}
.obra:hover .obra-img{transform:scale(1.04);filter:brightness(.55) saturate(.7)}
.obra-ov{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;justify-content:flex-end;padding:1.75rem 1.5rem;background:linear-gradient(to top,rgba(2,12,22,.9) 0%,rgba(2,12,22,.1) 45%,transparent 100%)}
.obra-yr{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--azul);margin-bottom:.4rem}
.obra-tit{font-family:'Playfair Display',serif;font-size:1rem;font-weight:700;color:var(--blanco);margin-bottom:.4rem;line-height:1.25}
.obra-desc{font-size:.75rem;color:var(--gris);line-height:1.5;margin-bottom:.8rem;max-height:0;overflow:hidden;transition:max-height .4s,opacity .4s;opacity:0}
.obra:hover .obra-desc{max-height:80px;opacity:1}
.obra-lnk{font-size:.65rem;letter-spacing:.12em;text-transform:uppercase;color:var(--acento);text-decoration:none}
#cv{background:var(--bg2);display:grid;grid-template-columns:1fr 1fr;gap:6rem}
.cv-t{font-family:'Playfair Display',serif;font-size:1.5rem;font-style:italic;color:var(--azul);margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid var(--borde)}
.cv-i{padding:1.2rem 0;border-bottom:1px solid rgba(4,95,150,.12);display:grid;grid-template-columns:auto 1fr;gap:1.5rem;align-items:start}
.cv-y{font-size:.68rem;font-weight:700;letter-spacing:.08em;color:var(--azul);white-space:nowrap;padding-top:.2rem}
.cv-i h4{font-size:.9rem;font-weight:500;color:var(--blanco);margin-bottom:.2rem}
.cv-i p{font-size:.78rem;color:var(--gris);line-height:1.6}
.cv-hl{border:1.5px solid var(--azul);border-radius:8px;padding:1.1rem 1.3rem;margin-bottom:1.6rem}
.cv-hl-t{color:var(--azul);font-weight:700;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem}
.cv-hl-i{font-size:.85rem;color:var(--blanco);padding:.34rem 0;line-height:1.4}
.cv-hl-i span{color:var(--gris);font-size:.8rem}
.cv-sum{display:grid;grid-template-columns:auto 1fr;gap:.7rem 1.2rem;align-items:baseline}
.cv-sy{font-size:.72rem;font-weight:700;letter-spacing:.06em;color:var(--acento);white-space:nowrap}
.cv-sc{font-size:.8rem;color:var(--gris);line-height:1.55}
.cv-sc span{color:#6f94a6;font-style:italic}
#clases{background:var(--bg);position:relative;overflow:hidden}
.cl-bg{position:absolute;inset:0;opacity:.04;background-image:linear-gradient(rgba(6,147,227,.8) 1px,transparent 1px),linear-gradient(90deg,rgba(6,147,227,.8) 1px,transparent 1px);background-size:60px 60px}
.cl-in{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center}
.cl-desc{font-size:1.05rem;font-weight:300;line-height:1.9;color:var(--gris);margin:1.5rem 0 2.5rem}
.tags{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:2.5rem}
.tag{padding:.5rem 1.25rem;border:1px solid rgba(6,147,227,.35);font-size:.7rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--azul)}
.cl-info{display:flex;gap:2.5rem;margin-bottom:2.5rem;flex-wrap:wrap}
.il{font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gris);margin-bottom:.2rem}
.iv{font-size:.9rem;font-weight:500;color:var(--blanco)}
.mcard{background:var(--bg2);border:1px solid var(--borde);overflow:hidden}
.mcard img{width:100%;display:block;border-bottom:1px solid var(--borde)}
.minfo{padding:1.5rem}
.minfo h3{font-family:'Playfair Display',serif;font-size:1.3rem;color:var(--blanco);margin-bottom:.5rem}
.minfo p{font-size:.85rem;color:var(--gris);line-height:1.7}
.mbadge{display:inline-block;margin-top:1rem;padding:.4rem 1rem;background:rgba(6,147,227,.12);border:1px solid var(--borde);font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;color:var(--azul);text-decoration:none}
#videos{background:var(--bg2)}
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;margin-top:3rem}
.vcard{border:1px solid var(--borde);overflow:hidden;transition:border-color .3s}
.vcard:hover{border-color:var(--azul)}
.vthumb{aspect-ratio:16/9;background:var(--card);background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;position:relative;text-decoration:none;width:100%}
.vthumb::before{content:'';position:absolute;inset:0;background:rgba(2,12,22,.32);z-index:1}
.vplat{position:absolute;top:12px;left:12px;z-index:2;padding:4px 10px;border-radius:3px;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:#fff;font-weight:500;background:rgba(200,0,0,.85)}
.vplay{position:relative;z-index:2;width:60px;height:60px;border-radius:50%;border:2px solid var(--azul);display:flex;align-items:center;justify-content:center;background:rgba(6,147,227,.35);transition:all .3s}
.vcard:hover .vplay{background:var(--azul);transform:scale(1.1)}
.vplay svg{fill:var(--azul);transition:fill .3s;margin-left:4px}
.vcard:hover .vplay svg{fill:#fff}
.vinfo{padding:1rem 1.25rem}
.vtit{font-size:.85rem;font-weight:500;color:var(--blanco);margin-bottom:.25rem}
.vmeta{font-size:.7rem;color:var(--gris)}
#contacto{background:var(--bg)}
.cemail{font-family:'Playfair Display',serif;font-size:clamp(1.5rem,3vw,2.5rem);font-style:italic;color:var(--azul);display:block;margin:1.5rem 0 2.5rem;text-decoration:none;transition:color .3s}
.cemail:hover{color:var(--acento)}
.socials{display:flex;gap:1rem;flex-wrap:wrap}
.soc{padding:.75rem 1.5rem;border:1px solid var(--borde);font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gris);text-decoration:none;transition:all .3s}
.soc:hover{border-color:var(--azul);color:var(--azul)}
footer{background:var(--bg2);padding:3rem 4rem;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--borde)}
.flogo{font-family:'Josefin Sans',sans-serif;font-size:1rem;font-weight:300;letter-spacing:.3em;text-transform:uppercase}
.flogo .w{color:var(--blanco)}.flogo .b{color:var(--azul)}
.fcopy{font-size:.7rem;color:var(--gris)}
.flinks a{color:var(--gris);text-decoration:none;font-size:.7rem;letter-spacing:.1em;margin-left:1rem;transition:color .3s}
.flinks a:hover{color:var(--azul)}
.fia{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}
.fia.on{opacity:1;transform:translateY(0)}
@media(max-width:900px){
  nav{padding:1.5rem 2rem}
  .nav-links{display:none}
  .burger{display:flex}
  #hero{padding:0 2rem 4rem}
  .h-content{max-width:100%}
  .h-carousel,.h-num,.h-line{display:none}
  .h-slide{opacity:0!important}
  .h-slide.on{opacity:1!important;z-index:0}
  .h-slide img{opacity:.45;position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
  .h-carousel{display:block!important;position:absolute;inset:0;width:100%;right:0;mask-image:linear-gradient(to top,transparent 0%,black 8%);-webkit-mask-image:linear-gradient(to top,transparent 0%,black 8%);mask-composite:initial;-webkit-mask-composite:initial}
  .h-dots{right:2rem}
  section{padding:5rem 2rem}
  #actuando{padding:5rem 0 0}
  .ac-header{padding:0 2rem 2rem}
  .ac-wrap{height:50vh}
  #sobre,#cv,.cl-in{grid-template-columns:1fr;gap:3rem}
  .comp-grid{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .fi:first-child{grid-row:auto;grid-column:1/3;height:320px}
  .obras-grid{grid-template-columns:1fr 1fr}
  .vgrid{grid-template-columns:1fr;max-width:100%}
  footer{flex-direction:column;gap:1rem;text-align:center}
  #btt{bottom:1.5rem;right:1.5rem}
}
@media(max-width:500px){.obras-grid{grid-template-columns:1fr}}
