
:root{--pink:#ff00c8;--blue:#2d5bd3}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#000;color:#111;font-family:Arial,Helvetica,sans-serif}
.site{width:100%;max-width:1600px;margin:auto;background:#fff;min-height:100vh}
.nav{position:sticky;bottom:0;z-index:100;background:#000;display:flex;align-items:center;justify-content:space-between;min-height:68px;padding:0 1.5%}
.nav a{color:#fff;text-decoration:none;font-size:clamp(13px,1.15vw,21px);padding:22px 10px;text-align:center;white-space:nowrap}
.nav a.active,.nav a:hover{color:var(--pink)}

.home{display:grid;grid-template-columns:34% 66%;min-height:calc(100vh - 68px)}
.home-copy{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:6vw 3vw}
.home-copy h1{font-size:clamp(30px,3.2vw,58px);line-height:1.25;font-style:italic;margin:0 0 4vw;font-weight:700}
.home-copy .tag{font-size:clamp(21px,2vw,36px);line-height:1.35;font-style:italic}
.home-photo{display:block;width:100%;height:100%;object-fit:cover;object-position:center}

.content{padding:35px 2.5% 55px;background:#fff}
.content h1{font-size:clamp(27px,2.5vw,45px);font-weight:400;margin:0 0 35px}
.content p{font-size:clamp(17px,1.45vw,25px);line-height:1.42;margin:0 0 28px}
.quien{display:grid;grid-template-columns:minmax(0,1fr) 350px;gap:3vw;align-items:start}
.quien img{width:100%;height:auto;display:block}
.two-col{display:grid;grid-template-columns:minmax(0,3.2fr) minmax(280px,1.2fr);gap:5vw}
.side h2{font-size:clamp(25px,2vw,38px);font-weight:400;margin:0 0 35px}
.side h3{font-size:clamp(19px,1.5vw,27px);margin:0}
.contact{min-height:calc(100vh - 68px);display:grid;grid-template-columns:40% 60%;padding:6vw}
.contact-brand{padding:2vw}
.contact-brand h1{font-size:clamp(32px,3vw,55px);font-style:italic;line-height:1.2;margin:0 0 7vw}
.contact-brand .tag{font-size:clamp(20px,2vw,34px);font-style:italic}
.contact-info{padding:9vw 2vw 0}
.contact-info h2{font-size:clamp(25px,2vw,38px);margin:0 0 2vw}
.contact-info a,.contact-info p{display:block;font-size:clamp(23px,2.1vw,40px);color:var(--blue);text-decoration:none;margin:0 0 4vw}
.gallery{padding:5vw;display:flex;justify-content:center}
.gallery img{display:block;width:min(100%,1220px);height:auto}
.blog{padding:5vw;min-height:calc(100vh - 68px)}
.blog h1{font-size:clamp(30px,3vw,52px);font-weight:400}
.blog p{font-size:clamp(17px,1.4vw,24px);line-height:1.5}

@media(max-width:900px){
 .home{display:flex;flex-direction:column;min-height:0}
 .home-copy{order:1;padding:48px 24px 42px}
 .home-copy h1{font-size:clamp(30px,8vw,46px);margin-bottom:30px}
 .home-copy .tag{font-size:clamp(21px,5.5vw,31px)}
 .home-photo{order:2;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
 .quien,.two-col,.contact{grid-template-columns:1fr}
 .quien img{max-width:380px;margin:0 auto}
 .side{border-top:1px solid #ddd;margin-top:15px;padding-top:30px}
 .contact{padding:42px 28px}
 .contact-brand,.contact-info{padding:15px 0}
 .contact-brand h1{margin-bottom:42px}
 .gallery{padding:25px 14px}
 .nav{position:sticky;bottom:0;flex-wrap:wrap;padding:3px 4px}
 .nav a{flex:1 0 25%;font-size:13px;padding:13px 3px}
}
@media(max-width:520px){
 .content{padding:25px 18px 40px}
 .content h1{margin-bottom:25px}
 .content p{font-size:17px;line-height:1.48;margin-bottom:23px}
 .nav a{flex-basis:50%;font-size:13px;padding:11px 2px}
 .home-copy{padding:42px 20px 36px}
 .home-photo{aspect-ratio:1/1}
}


/* V4 — ajuste real al viewport, sin cortar contenido */
html,body{width:100%;height:100%;overflow:hidden}
body{min-height:100vh}
.site{width:100%;max-width:1600px;margin:0 auto;background:#fff;min-height:100vh;overflow:visible}
.site main{width:100%;transform-origin:top center;overflow:visible}
.nav{
  position:fixed;
  left:0;right:0;bottom:0;
  z-index:1000;
  width:100%;
  max-width:1600px;
  margin:0 auto;
  background:#000;
}
@media(max-width:900px){
  .site{max-width:none}
  .site main{width:100%}
  .nav{max-width:none}
}
