
:root{--black:#090909;--ink:#101010;--paper:#f0eee8;--white:#f7f7f4;--muted:#9a9a95;--line:rgba(255,255,255,.18);--darkline:rgba(10,10,10,.16);--blue:#68aeda;--max:1580px;--pad:clamp(20px,5vw,78px);--ease:cubic-bezier(.2,.7,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--white);font-family:Arial,Helvetica,sans-serif;font-weight:300;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}img{max-width:100%;display:block}.container{width:min(var(--max),100%);margin:auto;padding-inline:var(--pad)}
.nav{position:fixed;z-index:90;left:0;right:0;top:0;padding:25px 0;transition:.45s var(--ease)}.nav.scrolled{background:rgba(9,9,9,.82);backdrop-filter:blur(18px);padding:14px 0;border-bottom:1px solid rgba(255,255,255,.12)}.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.logo{font-size:14px;letter-spacing:.18em;font-weight:600}.nav-links{display:flex;gap:30px;font-size:10px;letter-spacing:.18em;text-transform:uppercase}.nav-links a{position:relative;padding:8px 0}.nav-links a:after{content:'';position:absolute;left:0;bottom:1px;width:100%;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease)}.nav-links a:hover:after{transform:scaleX(1);transform-origin:left}.menu-btn{display:none;background:none;border:0;color:white;font-size:22px}
.hero{min-height:100svh;display:flex;align-items:flex-end;position:relative;overflow:hidden;background:#111}.hero-bg,.media-bg{position:absolute;inset:-5%;background-size:cover;background-position:center;will-change:transform;transform:scale(1.05)}.hero-bg:after,.media-bg:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.84),rgba(0,0,0,.25) 53%,rgba(0,0,0,.16)),linear-gradient(0deg,rgba(0,0,0,.48),transparent 50%)}.hero-content{position:relative;z-index:2;padding-bottom:9vh;width:100%}.eyebrow{color:var(--blue);letter-spacing:.26em;text-transform:uppercase;font-size:10px;margin-bottom:22px}.hero h1{font-size:clamp(48px,6.3vw,100px);line-height:.89;letter-spacing:-.045em;font-weight:300;max-width:1050px;margin:0 0 30px}.hero-meta{font-size:15px;line-height:1.45;color:#dededb}.scroll-mark{position:absolute;right:var(--pad);bottom:8vh;z-index:3;font-size:9px;letter-spacing:.18em;color:#ddd;writing-mode:vertical-rl}.scroll-mark:after{content:'';display:block;width:1px;height:60px;background:#fff;margin:14px auto 0;animation:pulse 2s ease-in-out infinite}@keyframes pulse{50%{opacity:.2;transform:scaleY(.55)}}
.cta-row{display:flex;gap:16px;margin-top:38px;flex-wrap:wrap}.btn{--mx:0px;--my:0px;display:inline-flex;align-items:center;gap:16px;border:1px solid rgba(255,255,255,.42);padding:14px 19px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;transition:background .3s,color .3s,border-color .3s,transform .18s;transform:translate(var(--mx),var(--my))}.btn:hover{background:white;color:black;border-color:white}.btn.blue{border-color:var(--blue);color:var(--blue)}.btn.blue:hover{background:var(--blue);color:#061018}
.section{padding:clamp(90px,12vw,190px) 0;position:relative}.section.light{background:var(--paper);color:#151515}.section.dark{background:#080808}.display{font-size:clamp(42px,5vw,80px);font-weight:300;line-height:.95;letter-spacing:-.04em;margin:0 0 30px}.lead{font-size:clamp(18px,2vw,27px);line-height:1.35;max-width:760px}.copy{font-size:15px;line-height:1.75;color:#b7b7b2;max-width:640px}.light .copy{color:#50504c}
.split{display:grid;grid-template-columns:minmax(320px,.74fr) 1.26fr;min-height:760px;overflow:hidden}.split-copy{padding:clamp(60px,7vw,125px) var(--pad);display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2}.split-media{min-height:650px;position:relative;overflow:hidden}.split-media .media-bg{inset:-8%}.caption{position:absolute;left:28px;bottom:25px;z-index:4;font-size:9px;letter-spacing:.18em;color:#eee;text-transform:uppercase}
.services-head,.work-head{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:50px}.services-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.service-card{min-width:0;position:relative}.service-media{height:245px;position:relative;overflow:hidden;background:#222}.service-media img{width:100%;height:100%;object-fit:cover;transition:transform .75s var(--ease),filter .6s;filter:saturate(.8) contrast(1.03)}.service-card:hover img{transform:scale(1.075);filter:saturate(1) contrast(1.08)}.service-card .arrow{display:inline-block;transition:transform .3s var(--ease)}.service-card:hover .arrow{transform:translateX(8px)}.num{font-size:10px;margin-top:16px;letter-spacing:.12em}.service-card h3{font-size:16px;font-weight:400;margin:6px 0}.service-card p{font-size:12px;line-height:1.5;color:#666}.service-card a:after{content:'';position:absolute;inset:0}
.work-grid{display:grid;grid-template-columns:1.4fr 1fr .9fr;gap:9px}.project{height:460px;position:relative;overflow:hidden;background:#111}.project img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease),filter .7s;filter:saturate(.8) brightness(.82)}.project:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.72),transparent 56%)}.project:hover img{transform:scale(1.07);filter:saturate(1) brightness(.92)}.project-info{position:absolute;z-index:2;left:22px;right:22px;bottom:21px;display:flex;justify-content:space-between;align-items:end;transition:transform .45s var(--ease)}.project:hover .project-info{transform:translateY(-7px)}.project h3{margin:0 0 6px;font-weight:400}.project small{letter-spacing:.12em;color:#ddd}
.equation{font-size:clamp(29px,4vw,65px);font-weight:300;letter-spacing:-.03em;margin-bottom:65px}.pillars{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.pillar{padding:36px 28px 0 0;border-right:1px solid var(--line);min-height:205px;transition:background .35s,transform .35s}.pillar:not(:first-child){padding-left:28px}.pillar:last-child{border-right:0}.pillar:hover{background:rgba(255,255,255,.025);transform:translateY(-6px)}.pillar h3{font-size:12px;letter-spacing:.14em}.pillar p{font-size:13px;color:#aaa;line-height:1.65}
.banner{min-height:680px;display:flex;align-items:center;position:relative;overflow:hidden}.banner .media-bg:after{background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.22))}.banner .container{position:relative;z-index:2}.page-hero{padding:190px 0 105px;min-height:66vh;display:flex;align-items:end;position:relative;overflow:hidden;background:#111}.page-hero .media-bg:after{background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.34))}.page-hero .container{position:relative;z-index:2}.page-hero h1{font-size:clamp(54px,8vw,122px);line-height:.88;font-weight:300;letter-spacing:-.055em;max-width:1250px;margin:0 0 30px}.content-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:80px}.big-list{border-top:1px solid #c4c2bc}.big-list a,.big-list .row{display:grid;grid-template-columns:70px 1fr auto;gap:20px;padding:26px 0;border-bottom:1px solid #c4c2bc;align-items:center;transition:padding .35s var(--ease),background .35s}.big-list a:hover{padding-left:14px;background:rgba(0,0,0,.03)}.big-list h3{margin:0;font-size:clamp(24px,3vw,43px);font-weight:300}.big-list small{letter-spacing:.15em}.case-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.case{min-height:520px;padding:30px;display:flex;align-items:end;position:relative;overflow:hidden}.case img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.72);transition:transform .9s var(--ease),filter .6s}.case:hover img{transform:scale(1.06);filter:brightness(.84)}.case>div{position:relative;z-index:2}.case:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.72),transparent 50%)}
.form{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field{display:flex;flex-direction:column;gap:8px}.field.full{grid-column:1/-1}.field label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#aaa}input,select,textarea{width:100%;background:transparent;border:0;border-bottom:1px solid #555;color:inherit;padding:14px 2px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--blue)}textarea{min-height:145px}option{color:#111}.footer{padding:75px 0 32px;border-top:1px solid var(--line)}.footer-grid{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}.muted{color:#888}
.reveal{opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}.reveal.in{opacity:1;transform:none}.reveal[data-delay='1']{transition-delay:.08s}.reveal[data-delay='2']{transition-delay:.16s}.reveal[data-delay='3']{transition-delay:.24s}.reveal[data-delay='4']{transition-delay:.32s}.line-reveal{overflow:hidden}.line-reveal>*{transform:translateY(115%);transition:transform .9s var(--ease)}.line-reveal.in>*{transform:none}
.cursor-glow{position:fixed;z-index:0;width:320px;height:320px;pointer-events:none;border-radius:50%;background:radial-gradient(circle,rgba(104,174,218,.07),transparent 67%);transform:translate(-50%,-50%);opacity:0;transition:opacity .3s}.has-mouse .cursor-glow{opacity:1}
@media(max-width:900px){.nav-links{display:none;position:absolute;top:62px;left:20px;right:20px;background:rgba(10,10,10,.97);padding:25px;flex-direction:column}.nav-links.open{display:flex}.menu-btn{display:block}.scroll-mark{display:none}.split{grid-template-columns:1fr}.split-media{min-height:62vh}.services-grid{grid-template-columns:1fr 1fr}.work-grid{grid-template-columns:1fr}.project{height:60vh}.pillars{grid-template-columns:1fr 1fr}.content-grid{grid-template-columns:1fr;gap:45px}.case-grid{grid-template-columns:1fr}}
@media(max-width:560px){.hero h1{font-size:49px}.services-grid{grid-template-columns:1fr}.service-media{height:58vw}.services-head,.work-head{display:block}.pillars{grid-template-columns:1fr}.pillar{border-right:0;border-bottom:1px solid var(--line);padding-left:0!important}.form{grid-template-columns:1fr}.field.full{grid-column:auto}.page-hero{min-height:72vh}.page-hero h1{font-size:54px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal,.line-reveal>*{opacity:1!important;transform:none!important}.hero-bg,.media-bg{transform:none!important}.cursor-glow{display:none}}


/* V3 — real project media */
.media-bg{background-color:#111}
.visual-kicker{position:absolute;right:28px;top:28px;z-index:4;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.72)}
.home-work-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;grid-auto-rows:330px;gap:9px}
.home-work-grid .project{height:auto}
.home-work-grid .project.tall{grid-row:span 2}
.home-work-grid .project.wide{grid-column:span 2}
.portfolio-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}
.portfolio-item{position:relative;overflow:hidden;min-height:420px;background:#111;color:#fff}
.portfolio-item:nth-child(1){grid-column:span 7}
.portfolio-item:nth-child(2){grid-column:span 5}
.portfolio-item:nth-child(3){grid-column:span 5}
.portfolio-item:nth-child(4){grid-column:span 7}
.portfolio-item:nth-child(5){grid-column:span 7}
.portfolio-item:nth-child(6){grid-column:span 5}
.portfolio-item:nth-child(7){grid-column:span 5}
.portfolio-item:nth-child(8){grid-column:span 7}
.portfolio-item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.84) brightness(.8);transition:transform 1s var(--ease),filter .65s var(--ease)}
.portfolio-item:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.78),rgba(0,0,0,.05) 65%)}
.portfolio-item:hover img{transform:scale(1.055);filter:saturate(1) brightness(.94)}
.portfolio-copy{position:absolute;z-index:2;left:28px;right:28px;bottom:25px;transition:transform .45s var(--ease)}
.portfolio-item:hover .portfolio-copy{transform:translateY(-7px)}
.portfolio-copy h2{font-weight:300;font-size:clamp(28px,3.2vw,52px);letter-spacing:-.035em;margin:0 0 7px}
.portfolio-copy p{font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin:0;color:#ddd}
.about-portrait{position:relative;overflow:hidden;min-height:680px;background:#111}
.about-portrait img{position:absolute;inset:-3%;width:106%;height:106%;object-fit:cover;object-position:center 32%;filter:saturate(.85);transition:transform 1s var(--ease)}
.about-portrait:hover img{transform:scale(1.025)}
.media-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:70px}
.media-strip figure{margin:0;position:relative;overflow:hidden;aspect-ratio:16/10;background:#111}
.media-strip img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.media-strip figure:hover img{transform:scale(1.05)}
.media-strip figcaption{position:absolute;left:18px;bottom:16px;z-index:2;font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:white}
.media-strip figure:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.55),transparent 55%)}
@media(max-width:1000px){
  .home-work-grid{grid-template-columns:1fr 1fr;grid-auto-rows:360px}
  .home-work-grid .project.tall,.home-work-grid .project.wide{grid-row:auto;grid-column:auto}
  .portfolio-item{grid-column:span 6!important}
}
@media(max-width:700px){
  .home-work-grid{grid-template-columns:1fr;grid-auto-rows:58vh}
  .portfolio-grid{display:block}
  .portfolio-item{min-height:62vh;margin-bottom:10px}
  .media-strip{grid-template-columns:1fr}
  .about-portrait{min-height:70vh}
}

/* V4 BITACORA */
.log-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px}.log-card{position:relative;overflow:hidden;min-height:540px;color:#fff;background:#111}.log-card:nth-child(odd){grid-column:span 7}.log-card:nth-child(even){grid-column:span 5}.log-card:last-child{grid-column:span 12;min-height:620px}.log-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.82) brightness(.72);transition:transform 1s,filter .6s}.log-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.86),transparent 70%)}.log-card:hover img{transform:scale(1.045);filter:saturate(1) brightness(.88)}.log-index,.log-copy{position:absolute;z-index:2;left:28px;right:28px}.log-index{top:24px;font-size:10px;letter-spacing:.18em}.log-copy{bottom:28px}.log-copy h2{font-size:clamp(32px,4vw,66px);line-height:.93;letter-spacing:-.045em;font-weight:300;margin:0 0 12px}.log-copy p{margin:0;color:#ddd;font-size:12px;letter-spacing:.08em;text-transform:uppercase}.log-article{max-width:900px;margin:auto}.log-article p{font-size:clamp(18px,1.7vw,24px);line-height:1.62;margin:0 0 32px}.log-video{aspect-ratio:16/9;margin:60px 0}.log-video iframe{width:100%;height:100%;border:0}.log-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:70px 0}.log-gallery figure{margin:0;min-height:420px;overflow:hidden}.log-gallery img{width:100%;height:100%;object-fit:cover}.log-next{border-top:1px solid #bbb;padding-top:35px;margin-top:80px}@media(max-width:800px){.log-grid{display:block}.log-card{min-height:62vh;margin-bottom:10px}.log-gallery{display:block}.log-gallery figure{min-height:55vh;margin-bottom:10px}}


/* V6 — CINEMATIC HOME TEST */
.cinematic-hero{position:relative;isolation:isolate;overflow:hidden}
.hero-video-wrap{position:absolute;inset:0;z-index:-4;background:#050505}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-video-mobile{display:none}
.hero-cinematic-overlay{position:absolute;inset:0;z-index:-3;pointer-events:none;
 background:linear-gradient(90deg,rgba(0,0,0,.70) 0%,rgba(0,0,0,.35) 42%,rgba(0,0,0,.08) 75%),
 linear-gradient(0deg,rgba(0,0,0,.52) 0%,transparent 45%,rgba(0,0,0,.18) 100%)}
.hero-vignette{position:absolute;inset:-2px;z-index:-2;pointer-events:none;
 box-shadow:inset 0 0 180px 28px rgba(0,0,0,.48)}
.cinematic-hero .hero-content{transform:translateY(2vh)}
.cinematic-hero h1{max-width:1120px;text-shadow:0 3px 30px rgba(0,0,0,.22)}
.cinematic-hero .eyebrow,.cinematic-hero .hero-meta{opacity:.88}
.cinematic-hero:after{content:"";position:absolute;inset:0;z-index:6;pointer-events:none;opacity:.035;
 background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}
[data-sound-zone]{transition:filter .7s ease}
.home-work-grid .project img,.service-card img{transition:transform 1.15s cubic-bezier(.2,.75,.2,1),filter .8s}
.home-work-grid .project:hover img,.service-card:hover img{transform:scale(1.035)}
@media(max-width:700px){
 .hero-video-desktop{display:none}.hero-video-mobile{display:block}
 .hero-cinematic-overlay{background:linear-gradient(0deg,rgba(0,0,0,.62),rgba(0,0,0,.12) 68%,rgba(0,0,0,.30))}
 .hero-vignette{box-shadow:inset 0 0 100px 16px rgba(0,0,0,.44)}
}
@media(prefers-reduced-motion:reduce){
 .hero-video{display:none!important}
 .hero-video-wrap{background:url('../img/sagrada-construction.webp') center/cover no-repeat}
}
