/* Medidas tomadas del original a 1512 px (y comprobadas a 1100-1920 y 375). Ver gen.py.
   --cw = ancho del contenido (91vw, tope 1400px); --g = separación de las cuadrículas (14.4px a 1512). */
:root{--bg:#fffbf1;--ink:#1c1e22;--yel:#feebb9;--cw:min(91vw,1400px);--g:calc(var(--cw)*.01047);--vp:min(3.5vw,56px);--logo:17.4px}
*{box-sizing:border-box}
html{font-size:16px;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media(min-width:768px){html{font-size:clamp(14px,11.714px + .2976vw,16px)}:root{--logo:clamp(15.3px,11.714px + .4676vw,18.4px)}}
@media(max-width:1023px){:root{--cw:calc(100vw - 80px)}}
@media(max-width:767px){:root{--cw:calc(100vw - 40px);--vp:20px;--g:10px}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1rem/1.5 "Lora",Georgia,serif;-webkit-font-smoothing:antialiased}
body.lock{overflow:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
main{display:block}
.h2{margin:0;font:300 1.625rem/1.23 "Montserrat",sans-serif;letter-spacing:.1em;text-transform:uppercase}
.h3{margin:0;font:300 1.375rem/1.23 "Montserrat",sans-serif;letter-spacing:.1em;text-transform:uppercase}
.eyebrow{display:block;font:400 .75rem/1.333 "Lora",serif;letter-spacing:.26em;text-transform:uppercase}
.btn{display:inline-block;border:1px solid var(--ink);border-radius:999px;padding:.9375rem 1.9375rem;font:500 .75rem/1.5 "Montserrat",sans-serif;letter-spacing:.21em;text-transform:uppercase;color:var(--ink);cursor:pointer;transition:background .2s,color .2s}
.btn:hover{background:var(--ink);color:#fff}

/* ---------- header: 3 columnas (menú | logo | menú), todo centrado en vertical */
.hd{position:relative;z-index:30}
.hd--over{position:absolute;top:0;left:0;right:0;color:#fff}
.hd__in{width:var(--cw);margin:0 auto;padding:1.25vw 0 1.2vw;display:grid;grid-template-columns:1fr 24.2% 1fr;column-gap:var(--g);align-items:center}
.nav{display:flex;align-items:center;gap:4.1em;font:500 .75rem/1.4 "Montserrat",sans-serif;letter-spacing:.22em;text-transform:uppercase}
.nav a{transition:opacity .2s}
.nav a:hover,.has-sub:hover>a{opacity:.5}
.nr{justify-content:flex-end}
.logo{display:block;text-align:center;font:500 var(--logo)/1.4 "Montserrat",sans-serif;letter-spacing:.19em;text-transform:uppercase;padding:.55em 0}
.has-sub{position:relative;display:inline-flex;align-items:center;gap:6px}
.plus{position:relative;width:8px;height:8px;flex:none}
.plus:before,.plus:after{content:"";position:absolute;background:currentColor}
.plus:before{left:0;right:0;top:3.5px;height:1px}
.plus:after{top:0;bottom:0;left:3.5px;width:1px}
.sub{position:absolute;left:50%;top:calc(100% + 20px);transform:translateX(-50%);width:240px;padding:25px 0;background:var(--yel);color:var(--ink);display:flex;flex-direction:column;align-items:center;gap:21px;visibility:hidden;opacity:0;transition:opacity .2s,visibility .2s}
.sub a{font:400 .75rem/1.3 "Lora",serif;letter-spacing:.1em;text-transform:none}
.has-sub:after{content:"";position:absolute;left:-20px;right:-20px;top:100%;height:24px}
.has-sub:hover .sub,.has-sub:focus-within .sub,.has-sub.open .sub{visibility:visible;opacity:1}
.burger{display:none}

/* ---------- menú móvil (pantalla completa amarilla) */
.mnav{position:fixed;inset:0;padding-bottom:20px;z-index:60;background:var(--yel);display:flex;align-items:center;justify-content:center}
.mnav[hidden]{display:none}
.mnav ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:30px;text-align:center}
.mnav li{display:flex;flex-direction:column;align-items:center}
.mnav a{font:300 1.35rem/1.3 "Montserrat",sans-serif;letter-spacing:.1em;text-transform:uppercase}
.mnav .row{display:flex;align-items:center;gap:10px}
.mnav .plus{width:12px;height:12px}
.mnav .plus:before{top:5.5px}.mnav .plus:after{left:5.5px}
.msub{display:none;flex-direction:column;gap:18px;margin-top:24px}
.mnav li.open .msub{display:flex}
.msub a{font:400 1rem/1.3 "Lora",serif;letter-spacing:.22em}
.mx{position:absolute;top:26px;right:22px;width:34px;height:34px;color:#555}

/* ---------- héroes */
.hero{position:relative;overflow:hidden;background:#222;height:min(54.2vw,847px)}
.hero--sl{height:min(59.33vw,927px)}
.hero>img,.slide>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ov{position:absolute;inset:0;background:#000;opacity:var(--o,.2);pointer-events:none}
.slide{position:absolute;inset:0;display:block;opacity:0;transition:opacity .8s ease;color:#fff}
.slide.on{opacity:1;z-index:1}
.cap{position:absolute;left:0;right:0;top:70.46%;text-align:center;padding:0 4vw}
.cap .t{display:block;font:300 2.5rem/1.16 "Montserrat",sans-serif;letter-spacing:.1em;text-transform:uppercase}
.cap .s{display:block;margin-top:2.75rem;font:400 .75rem/1.43 "Lora",serif;letter-spacing:.26em;text-transform:uppercase}
.ar{display:grid;place-items:center;width:35px;height:35px;color:inherit}
.ar.r svg{transform:scaleX(-1)}
.hero .ar{position:absolute;z-index:3;top:76.6%;transform:translateY(-50%);color:#fff}
.hero .ar.l{left:calc((100% - var(--cw))/2)}
.hero .ar.r{right:calc((100% - var(--cw))/2)}
.dots{position:absolute;z-index:3;top:87.85%;left:50%;transform:translateX(-50%);display:flex;gap:10px}
.dots button{width:15px;height:15px;border-radius:50%;background:rgba(255,255,255,.5)}
.dots button.on{background:#fff}

/* ---------- galerías */
.intro{width:calc(var(--cw)*.6628);margin:0 auto;min-height:11.77vw;padding:3.64vw 0;text-align:center}
.intro p{margin:0;font-size:.875rem;line-height:2.4}
.blk{width:var(--cw);margin:0 auto;padding:var(--vp) 0}
.mas{display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:var(--g)}
.mas>div{display:flex;flex-direction:column;gap:var(--g);min-width:0}
.mas:not([data-n]){display:block;column-count:3;column-gap:var(--g)}
.mas:not([data-n]) .m{margin-bottom:var(--g);break-inside:avoid}
.m{display:block;overflow:hidden;background:#efe7d6}
.m img{width:100%;height:auto;transition:opacity .25s}
.sqg{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--g)}
.sq{display:block;aspect-ratio:1;overflow:hidden;background:#efe7d6}
.sq img{width:100%;height:100%;object-fit:cover;transition:opacity .25s}
.m:hover img,.sq:hover img{opacity:.88}
@media(max-width:767px){.sqg{grid-template-columns:repeat(2,1fr)}}

/* ---------- Home: "little details" */
.tst{padding:5.2vw 0 var(--vp)}
.tst__in{position:relative;width:var(--cw);margin:0 auto;aspect-ratio:1376/729;overflow:hidden;background:#222}
.tt{position:absolute;left:4.21%;top:calc(var(--cw)*.032);font:400 .75rem/1.333 "Lora",serif;letter-spacing:.26em;text-transform:uppercase;color:#fff}
.tc{position:absolute;z-index:3;right:4.21%;bottom:calc(var(--cw)*.0625);width:calc(var(--cw)*.1577);display:flex;align-items:center;justify-content:space-between;color:#fff}
.cnt{font:400 .875rem/1.3 "Lora",serif;color:inherit}

/* ---------- Portfolio */
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--g)}
.tile{position:relative;display:block;aspect-ratio:449/637;overflow:hidden;color:#fff;background:#222}
.tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tile .tt{position:absolute;left:0;right:0;top:auto;bottom:calc(13.66% + 3px);padding:0 7%;text-align:center;font:300 1.625rem/1.23 "Montserrat",sans-serif;letter-spacing:.1em;text-transform:uppercase}
.tile .st{position:absolute;left:0;right:0;bottom:8%;text-align:center;font:400 .6875rem/1.3 "Montserrat",sans-serif;letter-spacing:.3em;text-transform:uppercase}

/* ---------- CTA */
.cta{text-align:center;padding:7.2vw 5vw 7.1vw}
.cta .eyebrow{margin-bottom:2.19rem}
.cta .h2{margin-bottom:2.875rem}

/* ---------- To the Nations */
.quote{width:var(--cw);margin:var(--vp) auto;padding:calc(var(--cw)*.0741) 0;background:var(--yel);text-align:center}
.quote p{width:49.1%;margin:0 auto;font:400 .875rem/1.857 "Lora",serif}
.quote p+p{margin-top:.9375rem;line-height:1.29}
.ssh{position:relative}
.ssh .vp{width:92.33%;margin:0 auto;aspect-ratio:1396/810;overflow:hidden}
.track{display:flex;height:100%;transition:transform .5s ease}
.ts{flex:0 0 100%;height:100%}
.ts img{width:100%;height:100%;object-fit:contain}
.ssh .ar{position:absolute;top:50%;transform:translateY(-50%)}
.ssh .ar.l{left:10px}.ssh .ar.r{right:10px}
.ssh .cnt{height:43px;display:flex;align-items:center;justify-content:center;font-size:1rem}
.story{width:var(--cw);margin:0 auto;padding:var(--vp) 0}
.story h3{margin:0 0 2.125rem;font:300 1.375rem/1.4 "Montserrat",sans-serif;letter-spacing:.1em;text-transform:uppercase}
.story p{margin:0;font:400 .875rem/2.4 "Lora",serif}

/* ---------- About */
.about{position:relative;width:var(--cw);margin:var(--vp) auto;padding-bottom:calc(var(--cw)*.1686)}
.about>img{width:100%;aspect-ratio:1376/731;object-fit:cover}
.card{background:var(--yel);text-align:center}
.about .card{position:absolute;left:4.21%;width:91.57%;top:calc(var(--cw)*.3786);height:calc(var(--cw)*.3212);padding-top:calc(var(--cw)*.0313)}
.about .card h1{margin:1.3125rem 0 2.625rem}
.abt{width:63.25%;margin:0 auto}
.abt p{margin:0 0 3rem;font:400 .875rem/2 "Lora",serif}
.abt p:last-child{margin-bottom:0}

/* ---------- Contact */
.contact{width:var(--cw);margin:0 auto;padding-bottom:var(--vp);display:grid;grid-template-columns:565fr 797fr;column-gap:var(--g);align-items:start}
.contact .ph{width:100%;aspect-ratio:565/715;object-fit:cover;margin-top:calc(var(--cw)*.0632)}
.contact .card{height:calc(var(--cw)*.6461);padding-top:calc(var(--cw)*.0952)}
.contact .in{width:70.89%;margin:0 auto}
.lead{margin:1.6875rem 0 0;font:300 1.375rem/1.42 "Montserrat",sans-serif;letter-spacing:.1em;text-transform:uppercase}
.form{margin-top:2.9375rem;display:grid;gap:.9375rem}
.form label{display:block;text-align:center}
.form label span{display:block;margin-bottom:.6875rem;font:500 .75rem/1.5 "Montserrat",sans-serif;letter-spacing:.2em;text-transform:uppercase}
.form input,.form textarea{display:block;width:89.4%;margin:0 auto;padding:.5rem;border:0;border-bottom:1px solid #ccd8e5;border-radius:0;background:transparent;font:400 .875rem/1.6 "Lora",serif;color:var(--ink);outline:0}
.form input{height:3.1875rem}
.form textarea{height:8.125rem;resize:vertical}
.form .btn{justify-self:center;margin-top:.8125rem;letter-spacing:.11em;background:none}
.form .btn:hover{background:var(--ink)}
.cinfo{width:var(--cw);margin:var(--vp) auto;height:calc(var(--cw)*.2733);background:var(--yel);display:grid;grid-template-columns:1fr 42.15% 1fr;align-items:center}
.cinfo .c{grid-column:2;height:calc(var(--cw)*.138);display:flex;flex-direction:column;justify-content:center;border-left:1px solid rgba(28,30,34,.22);border-right:1px solid rgba(28,30,34,.22);text-align:center}
.cinfo .h3{margin-bottom:1rem}
.cinfo p{margin:0;font:400 1rem/2 "Lora",serif}

/* ---------- pie */
.ft{padding:calc(var(--cw)*.0283) 0 calc(var(--cw)*.035)}
.ft__in{width:var(--cw);margin:0 auto}
.tx{font:400 .75rem/1.333 "Lora",serif;letter-spacing:.26em;text-transform:uppercase}
a.tx{opacity:.8}
.ft__r1{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.ft__r1 .hdl{grid-column:2;justify-self:center}
.ft__r1 .tx:first-child{justify-self:start}
.feed{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--g);margin-top:calc(var(--cw)*.0218)}
.feed img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}
.fn{justify-content:center;margin-top:calc(var(--cw)*.0405)}
.fn .sub{top:auto;bottom:calc(100% + 20px)}
.fn .has-sub:after{top:auto;bottom:100%}
.ft__r3{position:relative;display:flex;align-items:center;justify-content:space-between;margin-top:calc(var(--cw)*.0472)}
.ft__r3 .ig{position:absolute;left:37.86%;top:50%;transform:translateY(-50%);width:16px;height:16px;display:block}
.ft__r3 .top{display:block;width:24px;height:24px}

/* ---------- visor */
.lb{position:fixed;inset:0;z-index:99;background:rgba(10,10,10,.94);display:flex;align-items:center;justify-content:center}
.lb[hidden]{display:none}
.lb img{max-width:92vw;max-height:90vh;object-fit:contain}
.lb button{position:absolute;color:#fff;font-size:28px;padding:14px}
.lb .x{top:10px;right:14px;font-size:38px}.lb .pv{left:12px}.lb .nx{right:12px}

/* ---------- tablet y móvil */
@media(max-width:1023px){
 .hd__in{grid-template-columns:1fr auto 1fr;padding:10px 0;column-gap:0}
 .nl,.nr{display:none}
 .logo{grid-column:2;grid-row:1;width:37vw;padding:.4em 0}
 .burger{display:block;grid-column:3;grid-row:1;justify-self:end;width:30px;height:20px;background:linear-gradient(currentColor,currentColor) 0 0/100% 1.5px no-repeat,linear-gradient(currentColor,currentColor) 0 50%/100% 1.5px no-repeat,linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat}
 .hero{height:max(78.3vh,calc(127vw - 88px))}
 .hero--sl{height:max(81.3vh,calc(127vw - 88px))}
 .about{padding-bottom:0}
 .about .card{position:relative;top:auto;left:auto;width:92%;height:auto;margin:-4rem auto 0;padding:3rem 0}
 .abt{width:80%}
 .contact{grid-template-columns:1fr}
 .contact .card{height:auto;padding:3rem 0}
 .contact .ph{margin-top:var(--vp)}
 .contact .in{width:86%}
 .cinfo{height:auto;padding:2.5rem 0;grid-template-columns:1fr}
 .cinfo .c{grid-column:1;height:auto;border:0}
}
@media(max-width:767px){
 .logo{width:66.5vw}
 .cap{top:65.8%}
 .cap .t{font-size:min(7.7vw,2.5rem)}
 .hero .ar{top:91%}
 .dots{top:calc(91% - 7.5px)}
 .intro{width:calc(100vw - 40px);min-height:0;padding:4.4rem 0}
 .mas:not([data-n]){column-count:2}
 .tiles{grid-template-columns:1fr}
 .quote p{width:84%}
 .tst__in{aspect-ratio:4/3}
 .tc{width:60%;right:5%;bottom:14px}
 .ssh .vp{width:100%}
 .ssh .ar{display:none}
 .cta{padding:6.9rem 20px 6.8rem}
 .ft{padding:2rem 0 2.5rem}
 .ft__r1{grid-template-columns:1fr;justify-items:center;gap:2rem}
 .ft__r1 .hdl{grid-column:1}
 .feed{grid-template-columns:repeat(2,1fr);margin-top:1.9rem}
 .fn{flex-direction:column;gap:30px;margin-top:2.6rem}
 .fn .sub{bottom:auto;top:calc(100% + 12px)}
 .ft__r3{flex-direction:column;gap:3.9rem;margin-top:3.9rem;text-align:center}
 .ft__r3 .ig{position:static;transform:none}
 .ft__r3 .tx{order:2}.ft__r3 .ig{order:1}.ft__r3 .top{order:3;margin-top:-1.2rem}
}
