:root{--fg:#111;--bg:#fff;--gothic:"Franklin Gothic Medium","Franklin Gothic","Libre Franklin","Arial Narrow",sans-serif;--sans:"Helvetica Neue",Helvetica,"Open Sans",Arial,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--fg);background:var(--bg);text-transform:lowercase;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}

/* header: negativo */
.header{position:fixed;inset:0 0 auto 0;z-index:100;display:flex;justify-content:space-between;align-items:baseline;padding:22px 28px;color:#fff;mix-blend-mode:difference;pointer-events:none}
.header a{pointer-events:auto}
.header .brand{font-family:var(--gothic);font-size:22px;letter-spacing:.01em}
.header nav{display:flex;gap:28px;font-size:15px;font-weight:600}
.header nav .inside{font-style:italic}
.header nav a:hover{text-decoration:underline}

/* hero */
.hero{position:relative;height:100svh;background:#1a1a1a;overflow:hidden}
.hero video{width:100%;height:100%;object-fit:cover}
.hero .hero-title{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--gothic);font-size:clamp(40px,7vw,110px);color:#fff;mix-blend-mode:difference;pointer-events:none}

/* proyectos landing: solapado sticky */
.stack{position:relative}
.slide{position:sticky;top:0;height:100svh;overflow:hidden;background:#222}
.slide img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%)}
.slide .overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:28px;color:#fff;mix-blend-mode:difference;pointer-events:none}
.slide .counter{font-size:15px;font-weight:600}
.slide .title{font-family:var(--gothic);font-size:clamp(28px,4.2vw,64px);line-height:1;margin-bottom:10px;pointer-events:auto;align-self:flex-start}
.slide .title:hover{font-style:italic;text-decoration:underline}

/* info / inside */
.section{position:relative;z-index:2;background:var(--bg);min-height:100svh;display:grid;place-items:center;text-align:center;padding:120px 28px}
.info img.logo{width:min(260px,60vw);margin:0 auto 18px}
.info .name{font-family:var(--gothic);font-size:clamp(28px,4vw,56px)}
.info .since{margin-top:10px;font-size:14px}
.inside{background:#f4f2ee}
.inside h2{font-size:clamp(22px,3vw,40px);font-style:italic;font-weight:400}
.inside p{margin-top:12px;font-size:14px;opacity:.6}

/* listado */
.page{padding:110px 28px 80px}
.list{display:flex;flex-direction:column;align-items:flex-start}
.list a{display:inline-block;font-size:clamp(26px,4.4vw,68px);line-height:1.05;transform-origin:left center;transition:transform .2s}
.list a:hover{font-style:italic;text-decoration:underline;transform:scale(1.2)}

/* proyecto individual */
.p-head{padding:130px 28px 50px}
.p-head h1{font-family:var(--gothic);font-weight:400;font-size:clamp(36px,6vw,96px);line-height:1}
.p-head .sub{margin-top:14px;font-size:clamp(14px,1.6vw,20px)}
.grid{display:grid;grid-template-columns:1fr 1fr}
.cell{aspect-ratio:1/1;overflow:hidden;position:relative}
.cell img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%)}
.cell.text{display:flex;flex-direction:column;justify-content:space-between;padding:clamp(14px,3vw,48px);font-size:clamp(11px,1.3vw,18px);line-height:1.45}
.cell.text h2{font-family:var(--gothic);font-weight:400;font-size:clamp(16px,2.2vw,32px);line-height:1.1}
.cell.text.alt{background:#f4f2ee}
.plan{width:100%;background:#fff}
.plan img{width:100%;height:auto}
.foot{padding:60px 28px 90px;display:grid;grid-template-columns:1fr 1fr;gap:28px;font-size:clamp(12px,1.3vw,18px)}
.foot h3{font-family:var(--gothic);font-weight:400;font-size:clamp(16px,2vw,28px);margin-bottom:14px}
.foot dl{display:grid;grid-template-columns:auto 1fr;gap:6px 24px}
.foot dt{opacity:.55}

@media(max-width:700px){.header{padding:16px 18px}.header nav{gap:16px;font-size:13px}.header .brand{font-size:19px}.slide .overlay{padding:18px}.page,.p-head,.foot{padding-left:18px;padding-right:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}