*{box-sizing:border-box;margin:0;padding:0}
:root{--ink:#161312;--red:#cf2229;--u:clamp(20px,3.4vw,50px)}
body{background:#fff;color:var(--ink);font:400 14px/1.6 "Tenor Sans",sans-serif;letter-spacing:.02em}
::selection{background:var(--red);color:#fff}
img{display:block;width:100%;height:100%;object-fit:cover}
figure{margin:0;overflow:hidden;position:relative}
a{color:inherit;text-decoration:none}
h1,h2,.say{font-family:"Bodoni Moda",serif;font-weight:400;letter-spacing:-.02em;font-optical-sizing:auto}
.nav{display:flex;justify-content:space-between;align-items:center;padding:22px 3vw}
.nav img{height:30px;width:auto}
.nav nav{display:flex;gap:28px;font-size:13px;text-transform:uppercase;letter-spacing:.12em}
.nav nav a:hover,.wa:hover{color:var(--red)}
.col{display:grid;grid-template-columns:repeat(24,1fr);grid-auto-rows:var(--u);padding:0 3vw}
.hero{grid-template-rows:repeat(17,var(--u))}
.h1i{grid-column:1/11;grid-row:1/16}
.h1i img{object-position:50% 55%}
.h2i{grid-column:9/16;grid-row:6/18;z-index:2;border:8px solid #fff}
.h2i img{object-position:45% 45%}
.h3i{grid-column:19/25;grid-row:1/9}
.h3i img{object-position:50% 12%}
h1{grid-column:16/25;grid-row:10/15;align-self:end;font-size:clamp(46px,5.6vw,92px);line-height:.95;padding-left:2vw;z-index:3}
.hcap{grid-column:17/25;grid-row:16/18;align-self:end;font-size:12px;text-transform:uppercase;letter-spacing:.12em;padding-left:1vw}
.look{margin-top:calc(var(--u)*7)}
.tag{font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:var(--red);align-self:end}
.say{font-size:clamp(34px,3.8vw,62px);line-height:1;align-self:end}
.l1 .tag{grid-column:2/10;grid-row:1}
.l1 .a{grid-column:2/14;grid-row:2/14}
.l1 .b{grid-column:15/22;grid-row:5/19}
.l1 .b img{object-position:50% 60%}
.l1 .say{grid-column:4/14;grid-row:15/18}
.l2 .tag{grid-column:14/24;grid-row:1}
.l2 .say{grid-column:14/24;grid-row:2/5;align-self:start;margin-top:10px}
.l2 .a{grid-column:1/8;grid-row:1/12}
.l2 .b{grid-column:6/13;grid-row:7/19;z-index:2;border:8px solid #fff}
.l2 .b img{object-position:50% 40%}
.l2 .c{grid-column:15/23;grid-row:7/16}
.l3 .tag{grid-column:1/8;grid-row:1}
.l3 .a{grid-column:1/12;grid-row:2/16}
.l3 .a img{object-position:50% 65%}
.l3 .b{grid-column:13/18;grid-row:2/9}
.l3 .c{grid-column:16/24;grid-row:7/18;z-index:2;border:8px solid #fff}
.l3 .b img{object-position:55% 40%}
.l3 .c img{object-position:50% 50%}
.l3 .say{grid-column:3/14;grid-row:17/20}
.l4 .tag{grid-column:18/25;grid-row:13;align-self:end;margin-bottom:14px}
.l4 .a{grid-column:7/16;grid-row:1/18}
.l4 .a img{object-position:50% 40%}
.l4 .b{grid-column:1/7;grid-row:9/20;margin-right:-2vw;z-index:2;border:8px solid #fff}
.l4 .b img{object-position:50% 80%}
.l4 .say{grid-column:18/25;grid-row:14/17;align-self:start}
.contact{margin-top:calc(var(--u)*8);grid-template-rows:repeat(14,var(--u));padding-bottom:calc(var(--u)*2)}
.contact .a{grid-column:13/21;grid-row:1/15}
.ct{grid-column:2/12;grid-row:3/15;align-self:end}
h2{font-size:clamp(38px,4.2vw,70px);line-height:1;margin:18px 0 40px}
.wa{display:block;font-size:16px;border-bottom:1px solid var(--ink);padding:14px 0;max-width:26em}
.meta{margin-top:26px;font-size:12px;text-transform:uppercase;letter-spacing:.12em;line-height:2}
.foot{display:flex;justify-content:space-between;padding:20px 3vw;border-top:1px solid #e6e1dd;font-size:12px;text-transform:uppercase;letter-spacing:.12em}
@media (max-width:820px){
  .look{margin-top:calc(var(--u)*4)}.contact{margin-top:calc(var(--u)*5)}
  .l4 .tag{grid-row:1;margin:0}
  :root{--u:22px}
  .nav nav{gap:12px;font-size:11px}.nav img{height:24px}
  .col{grid-template-columns:repeat(12,1fr);padding:0 16px}
  .hero{grid-template-rows:repeat(21,var(--u));grid-auto-rows:auto}
  .h1i{grid-column:1/9;grid-row:1/15}.h2i{grid-column:6/13;grid-row:10/21}.h3i{grid-column:9/13;grid-row:1/8}
  h1{grid-column:1/13;grid-row:22;font-size:44px;padding:0;margin-top:18px}.hcap{grid-column:1/13;grid-row:23;padding:0;font-size:11px;margin-top:14px}
  .l1 .tag{grid-column:1/13}.l1 .a{grid-column:1/11;grid-row:2/13}.l1 .b{grid-column:6/13;grid-row:10/22;border:6px solid #fff;z-index:2}.l1 .say{grid-column:1/13;grid-row:23/26}
  .l2 .tag{grid-column:1/13;grid-row:1}.l2 .say{grid-column:1/13;grid-row:2/5}.l2 .a{grid-column:1/7;grid-row:6/16}.l2 .b{grid-column:5/12;grid-row:11/23}.l2 .c{grid-column:1/6;grid-row:19/25}
  .l3 .tag{grid-column:1/13}.l3 .a{grid-column:1/13;grid-row:2/15}.l3 .b{grid-column:1/6;grid-row:16/23}.l3 .c{grid-column:5/13;grid-row:13/25}.l3 .say{grid-column:1/13;grid-row:26/29}
  .l4 .tag{grid-column:1/13}.l4 .a{grid-column:3/13;grid-row:2/18}.l4 .b{grid-column:1/7;grid-row:13/23;margin:0}.l4 .say{grid-column:1/13;grid-row:24/27}
  .contact{grid-template-rows:auto;grid-auto-rows:auto}.contact .a{grid-column:1/13;grid-row:1;aspect-ratio:4/5}.ct{grid-column:1/13;grid-row:2;margin-top:30px}
  .foot{flex-direction:column;gap:4px}
}

/* ---- motion ---- */
html{scroll-behavior:smooth}
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,0);transition:background .5s,padding .5s,box-shadow .5s}
.nav.scrolled{background:rgba(255,255,255,.92);backdrop-filter:blur(8px);padding-top:14px;padding-bottom:14px;box-shadow:0 1px 0 #ece7e3}
.progress{position:fixed;top:0;left:0;right:0;height:2px;background:var(--red);transform:scaleX(0);transform-origin:0 50%;z-index:60}
.curtain{position:fixed;inset:0;background:#fff;z-index:100;display:flex;align-items:center;justify-content:center;transition:clip-path 1.1s cubic-bezier(.77,0,.18,1) .2s;clip-path:inset(0 0 0 0)}
.curtain img{width:140px;height:auto;opacity:0;transform:translateY(12px);animation:cIn .7s ease forwards}
@keyframes cIn{to{opacity:1;transform:none}}
body.loaded .curtain{clip-path:inset(0 0 100% 0)}
.js-off .curtain{display:none}
.divider{display:flex;align-items:center;gap:22px;padding:0 3vw;margin-top:calc(var(--u)*6);font-size:12px;text-transform:uppercase;letter-spacing:.18em}
.divider .dn{font-family:"Bodoni Moda",serif;font-size:clamp(28px,2.6vw,40px);letter-spacing:0;color:var(--red);font-style:italic}
.divider .dl{flex:1;height:1px;background:var(--ink);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.4s cubic-bezier(.65,0,.2,1) .15s}
.divider .dt{opacity:0;transform:translateX(16px);transition:opacity .9s .7s,transform .9s .7s}
.divider.in .dl{transform:scaleX(1)}.divider.in .dt{opacity:1;transform:none}
.divider + .look,.divider + .contact{margin-top:calc(var(--u)*2)}
.rv:not(.divider):not(figure){opacity:0;transform:translateY(34px);transition:opacity 1s cubic-bezier(.2,.6,.2,1) var(--d,0s),transform 1.2s cubic-bezier(.2,.6,.2,1) var(--d,0s)}
.rv.in:not(.divider):not(figure){opacity:1;transform:none}
figure.rv::after{content:"";position:absolute;inset:-1px;background:#fff;z-index:3;transform-origin:50% 0;transition:transform 1.3s cubic-bezier(.77,0,.18,1) var(--d,0s)}
figure.rv{transition:translate .1s linear}
figure.rv img{transform:scale(1.18);transition:transform 2.2s cubic-bezier(.2,.6,.2,1) var(--d,0s)}
figure.rv.in::after{transform:scaleY(0)}
figure.rv.in img{transform:scale(1)}
figure img{transition:transform 2.2s cubic-bezier(.2,.6,.2,1)}
figure.rv.in:hover img{transform:scale(1.04);transition-duration:1.2s}
.hero h1{transition-delay:.9s!important}.hero .hcap{transition-delay:1.1s!important}
.hero figure.rv::after{transition-delay:calc(var(--d,0s) + .5s)}
.wa{position:relative;transition:color .3s,padding .4s}
.wa:hover{padding-left:10px}
@media (max-width:820px){.divider{margin-top:calc(var(--u)*4);gap:14px}.divider .dt{font-size:10px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.curtain{display:none}}

/* ---- 07d: calmer motion + mobile fix ---- */
section .tag{display:none}
.nav .cta{display:none}
figure.rv img{transform:scale(1.05);transition:transform 1.6s ease var(--d,0s)}
figure.rv::after{transition:transform 1s cubic-bezier(.65,0,.25,1) var(--d,0s)}
.rv:not(.divider):not(figure){transform:translateY(16px);transition:opacity .9s ease var(--d,0s),transform .9s ease var(--d,0s)}
figure.rv.in:hover img{transform:none}
@media (max-width:820px){
  :root{--u:22px}
  .nav{padding:14px 18px}.nav img{height:26px}
  .nav nav a{display:none}
  .nav nav a.cta{display:inline-block;font-size:11px;letter-spacing:.16em;border:1px solid var(--ink);padding:8px 14px}
  .col{grid-template-columns:repeat(12,1fr);grid-template-rows:none;grid-auto-rows:var(--u);padding:0 18px;column-gap:0}
  .look,.contact{margin-top:calc(var(--u)*2)}
  .divider{padding:0 18px;margin-top:calc(var(--u)*4)}
  .divider + .look,.divider + .contact{margin-top:calc(var(--u)*1.2)}
  figure{border-width:5px!important;margin:0!important}
  .say{font-size:33px;line-height:1.05;align-self:start;padding:0}
  .h1i{grid-column:1/13;grid-row:1/17}
  .h2i{grid-column:6/13;grid-row:14/28;border:5px solid #fff}
  .h3i{grid-column:1/6;grid-row:18/27;margin-right:8px!important}
  h1{grid-column:1/13;grid-row:29/34;font-size:46px;line-height:.98;padding:0;margin:0;align-self:start}
  .hcap{grid-column:1/13;grid-row:34/37;font-size:10.5px;line-height:1.7;padding:0;margin:0;align-self:start}
  .l1 .a{grid-column:1/13;grid-row:1/14}
  .l1 .b{grid-column:5/13;grid-row:15/32;z-index:1}
  .l1 .say{grid-column:1/13;grid-row:33/36}
  .l2 .say{grid-column:1/13;grid-row:1/4;margin:0}
  .l2 .a{grid-column:1/8;grid-row:5/17}
  .l2 .c{grid-column:8/13;grid-row:5/12;margin-left:8px!important}
  .l2 .b{grid-column:4/13;grid-row:13/30;z-index:2;border:5px solid #fff}
  .l3 .a{grid-column:1/13;grid-row:1/15}
  .l3 .b{grid-column:1/7;grid-row:16/26;z-index:1;margin-right:4px!important}
  .l3 .c{grid-column:7/13;grid-row:16/26;z-index:1;border:0!important;margin-left:4px!important}
  .l3 .say{grid-column:1/13;grid-row:27/30}
  .l4 .a{grid-column:1/13;grid-row:1/23}
  .l4 .b{grid-column:1/7;grid-row:19/30;z-index:2;border:5px solid #fff}
  .l4 .say{grid-column:7/13;grid-row:24/30;align-self:end;padding-left:14px;font-size:30px}
  .contact{grid-template-rows:none;grid-auto-rows:auto;padding-bottom:30px}
  .contact .a{grid-column:1/13;grid-row:1;aspect-ratio:4/5}
  .ct{grid-column:1/13;grid-row:2;margin-top:26px}
  h2{font-size:38px;margin:0 0 26px}
  .wa{font-size:15px;max-width:none}
  .meta{font-size:10.5px}
  .foot{flex-direction:column;gap:4px;padding:18px}
}

/* ---- 07e: distinta transición por sección ---- */
/* Portada: la original (cortina hacia abajo + zoom) */
.hero figure.rv img{transform:scale(1.18);transition:transform 2.2s cubic-bezier(.2,.6,.2,1) calc(var(--d,0s) + .5s)}
.hero figure.rv::after{transition:transform 1.3s cubic-bezier(.77,0,.18,1) calc(var(--d,0s) + .5s)}
.hero figure.rv.in img{transform:scale(1)}
/* 01 · barrido de izquierda a derecha */
.l1 figure.rv::after{transform-origin:100% 50%;transition:transform 1.2s cubic-bezier(.77,0,.18,1) var(--d,0s)}
.l1 figure.rv.in::after{transform:scaleX(0)}
.l1 figure.rv img{transform:translateX(-4%) scale(1.06)}
.l1 figure.rv.in img{transform:none}
/* 02 · aparece desde el centro (se abre como ventana) */
.l2 figure.rv::after{display:none}
.l2 figure.rv{clip-path:inset(18% 18% 18% 18%);opacity:0;transition:clip-path 1.3s cubic-bezier(.65,0,.25,1) var(--d,0s),opacity .6s ease var(--d,0s)}
.l2 figure.rv.in{clip-path:inset(0 0 0 0);opacity:1}
.l2 figure.rv img{transform:scale(1.12)}
.l2 figure.rv.in img{transform:none}
/* 03 · cortina de arriba hacia abajo, en crema, una foto tras otra */
.l3 figure.rv::after{background:#f4efe9;transform-origin:50% 100%;transition:transform 1.4s cubic-bezier(.77,0,.18,1) calc(var(--d,0s) * 2)}
.l3 figure.rv.in::after{transform:scaleY(0)}
/* 04 · de borroso a nítido */
.l4 figure.rv::after{display:none}
.l4 figure.rv{opacity:0;filter:blur(14px);transition:opacity 1.2s ease var(--d,0s),filter 1.4s ease var(--d,0s)}
.l4 figure.rv.in{opacity:1;filter:none}
.l4 figure.rv img{transform:scale(1.03)}
.l4 figure.rv.in img{transform:none}
/* 05 · barrido de derecha a izquierda en rojo */
.contact figure.rv::after{background:var(--red);transform-origin:0 50%;transition:transform 1.3s cubic-bezier(.77,0,.18,1) var(--d,0s)}
.contact figure.rv.in::after{transform:scaleX(0)}
@media (min-width:821px){
  .l3 .b{grid-column:13/19;grid-row:1/12}
  .l3 .b img{object-position:62% 45%}
  .l3 .c{grid-column:17/25;grid-row:9/20}
  .l3 .say{grid-row:17/20}
}
/* ---- 07f: elegante: solo portada + fade lento ---- */
section:not(.hero) figure.rv::after{display:none!important}
section:not(.hero) figure.rv{clip-path:none!important;filter:none!important;opacity:0;transition:opacity 1.6s ease!important}
section:not(.hero) figure.rv.in{opacity:1}
section:not(.hero) figure.rv img,section:not(.hero) figure.rv.in img{transform:none!important;transition:none!important}
section:not(.hero) .rv:not(figure){transform:none!important;transition:opacity 1.6s ease .2s!important}
/* ---- 07h: portada original + solo línea y fade en fotos ---- */
.progress{display:none!important}
section:not(.hero) .rv:not(figure){opacity:1!important;transition:none!important}
.divider .dt{opacity:1!important;transform:none!important;transition:none!important}