@font-face {
  font-family: "EB Garamond";
  src: url("../fonts/EBGaramond-latin-var.woff2") format("woff2");
  font-weight: 400 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter-var-latin.woff2") format("woff2");
  font-weight: 100 900; font-style: normal; font-display: swap;
}

@font-face {
  font-family: "EBGaramond-respaldo";
  src: local("Times New Roman"), local("TimesNewRomanPSMT");
  size-adjust: 94.5%; ascent-override: 106.5%; descent-override: 31.5%; line-gap-override: 0%;
}
@font-face {
  font-family: "Inter-respaldo";
  src: local("Arial"), local("ArialMT");
  size-adjust: 104.9%; ascent-override: 92.4%; descent-override: 23.1%; line-gap-override: 0%;
}

:root {
  --papel: #FCFBF8;          
  --arena: #F3EFE8;          
  --tinta: #171717;          
  --gris: #5A5A5A;           
  --gris-claro: #9A9A9A;     
  --oro: #C08B39;            
  --oro-texto: color-mix(in srgb, var(--oro) 85%, var(--tinta)); 
  --tenue: #8C877E;          
  --claro: #ECE8E1;          
  --claro-2: #B8B2A8;        
  --linea: rgba(23, 23, 23, .14);
  --linea-clara: rgba(236, 232, 225, .16);

  --f-display: "EB Garamond", "EBGaramond-respaldo", "Times New Roman", serif;
  --d-peso: 400;          
  --d-peso-frase: 500;    
  --d-esc: 1.02;          
  --d-track: .006em;      
  --f-texto: "Inter", "Inter-respaldo", Arial, system-ui, sans-serif;

  --g: clamp(16px, 4.2vw, 64px);       
  --col: clamp(16px, 2.2vw, 36px);     
  --cab: 72px;                         

  --frenada: cubic-bezier(.16, 1, .3, 1);
  --trazo: cubic-bezier(.65, 0, .35, 1);
  --barrido: cubic-bezier(.76, 0, .24, 1);
}
@media (max-width: 639px) { :root { --cab: 60px; } }
@media (max-height: 500px) { :root { --cab: 56px; } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: var(--cab); scrollbar-gutter: stable; }
body {
  margin: 0; background: var(--papel); color: var(--tinta);
  font: 350 17px/1.65 var(--f-texto);
  overflow-x: clip; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
p { margin: 0; }
:focus-visible { outline: 1.5px solid currentColor; outline-offset: 4px; }
::selection { background: var(--tinta); color: var(--papel); }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.saltar {
  position: fixed; z-index: 60; left: var(--g); top: 10px; transform: translateY(-160%);
  background: var(--tinta); color: var(--papel); padding: 12px 18px; text-decoration: none;
  font: 500 12px/1 var(--f-texto); letter-spacing: .14em; text-transform: uppercase;
}
.saltar:focus { transform: none; }

html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: clip; }

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
  @view-transition { navigation: auto; }
  ::view-transition-old(root) { animation: 280ms cubic-bezier(.7, 0, .84, 0) both vt-sale; }
  ::view-transition-new(root) { animation: 520ms var(--frenada) 120ms both vt-entra; }
}
@keyframes vt-sale { to { opacity: 0; } }
@keyframes vt-entra { from { opacity: 0; } }

.eyebrow {
  margin: 0; font: 500 11.5px/1.4 var(--f-texto); letter-spacing: .24em; text-transform: uppercase; color: var(--gris);
}
.versalitas { font: 500 clamp(14px, .78rem + .2vw, 16px)/1.35 var(--f-texto); letter-spacing: .16em; text-transform: uppercase; }
.texto { color: var(--gris); font-size: clamp(16px, calc(.8rem + .45vw), 18.5px); line-height: 1.7; max-width: 32em; }
.texto + .texto { margin-top: 1.1em; }
.linea-mask { overflow: clip; padding-bottom: .08em; margin-bottom: -.08em; }   

.boton {
  position: relative; isolation: isolate; overflow: hidden;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 54px; padding: 0 36px;
  font: 500 11.5px/1 var(--f-texto); letter-spacing: .26em; text-transform: uppercase; text-decoration: none;
  color: var(--claro); background: transparent; border: 1px solid var(--oro); border-radius: 0; cursor: pointer;
  transition: color .5s var(--frenada);
}
.boton::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--oro);
  transform: scaleX(0); transform-origin: left center; transition: transform .7s var(--barrido);
}
.boton:focus-visible { color: var(--tinta); }
.boton:focus-visible::before { transform: scaleX(1); }
@media (hover: hover) {
  .boton:hover { color: var(--tinta); }
  .boton:hover::before { transform: scaleX(1); }
}
.boton--tinta { color: var(--papel); background: var(--tinta); border-color: var(--tinta); }
.boton[disabled] { opacity: .6; cursor: progress; }

.cab {
  position: fixed; inset: 0 0 auto; z-index: 30; height: var(--cab);
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 0 var(--g); color: var(--tinta);
  transition: background-color .5s var(--frenada), box-shadow .5s var(--frenada), color .5s var(--frenada);
}
.cab.is-fondo { background: var(--papel); box-shadow: 0 1px 0 var(--linea); }
.cab__marca {
  display: flex; flex-direction: column; align-items: flex-start; gap: 6px;
  color: inherit; text-decoration: none; padding: 8px 0;
  transition: opacity .7s var(--frenada), transform .7s var(--frenada);
}
.cab__wordmark { width: clamp(108px, 10.4vw, 150px); aspect-ratio: 472.1 / 53.3; height: auto; fill: currentColor; stroke: currentColor; stroke-width: 1.6; overflow: visible; }  
.cab__sub { font: 400 10px/1 var(--f-texto); letter-spacing: .3em; text-transform: uppercase; color: var(--gris); white-space: nowrap; transition: color .5s; }
.es-portada .cab:not(.is-logo) .cab__marca { opacity: 0; transform: translateY(-6px); pointer-events: none; }
.cab__nav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: clamp(16px, 3vw, 46px); }
.cab__nav a {
  position: relative; display: inline-block; padding: 17px 0;
  font: 500 11px/1 var(--f-texto); letter-spacing: .2em; text-transform: uppercase; text-decoration: none; color: var(--gris);
  transition: color .4s var(--frenada);
}
.cab__nav a::after {
  content: ""; position: absolute; left: 0; right: .2em; bottom: 10px; height: 1px; background: var(--oro);
  transform: scaleX(0); transform-origin: left; transition: transform .6s var(--frenada);
}
.cab__nav a:hover, .cab__nav a[aria-current] { color: var(--tinta); }
.cab__nav a:hover::after, .cab__nav a[aria-current]::after { transform: scaleX(1); }

.cab__nav a.is-eclipsado:not(:hover) { color: var(--gris); }
.cab__nav a.is-eclipsado:not(:hover)::after { transform: scaleX(0); }

.cab.is-claro { color: var(--claro); background: transparent; box-shadow: none; }
.cab.is-claro .cab__sub { color: var(--claro); }
.cab.is-claro.is-oscuro { background: var(--tinta); box-shadow: none; }

.cab::after {
  content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 36px; pointer-events: none;
  background: linear-gradient(rgba(23, 23, 23, .95), rgba(23, 23, 23, 0)); opacity: 0; transition: opacity .5s var(--frenada);
}
.cab.is-claro.is-oscuro::after { opacity: 1; }

.cab.is-claro:not(.is-oscuro) { transition: background-color .18s linear, box-shadow .18s linear, color .5s var(--frenada); }
.cab.is-claro:not(.is-oscuro)::after { transition: opacity .18s linear; }

.cab::before {
  content: ""; position: absolute; top: 0; right: 0; width: min(620px, 100%); height: 150px; z-index: -1; pointer-events: none;
  background: radial-gradient(ellipse 270px 78px at calc(100% - 205px) 36px, rgba(23, 23, 23, .68), rgba(23, 23, 23, .36) 55%, rgba(23, 23, 23, 0) 100%);
  opacity: 0; transition: opacity .4s var(--frenada);
}
.cab.is-claro:not(.is-oscuro)::before { opacity: 1; }
@media (max-width: 899px) {
  .cab::before { background: radial-gradient(ellipse 110px 64px at calc(100% - 38px) 30px, rgba(23, 23, 23, .5), rgba(23, 23, 23, 0) 100%); }
}
.cab.is-claro .cab__nav a { color: rgba(236, 232, 225, .78); text-shadow: 0 0 14px rgba(23, 23, 23, .5), 0 0 3px rgba(23, 23, 23, .3); }
.cab.is-claro .cab__nav a:hover, .cab.is-claro .cab__nav a[aria-current] { color: var(--claro); }
.cab.is-claro .cab__nav a.is-eclipsado:not(:hover) { color: rgba(236, 232, 225, .78); }
@media (max-width: 639px) {
  .cab__sub { display: none; }
  .cab__nav a { letter-spacing: .16em; font-size: 10.5px; }
}
@media (max-height: 500px) { .cab__sub { display: none; } .cab__nav a { padding: 14px 0; } }

.cab__menu {
  display: none; position: relative; width: 44px; height: 44px; margin-right: -10px; padding: 0;
  background: none; border: 0; color: inherit; cursor: pointer;
}
.cab__menu-lineas { position: absolute; left: 11px; right: 11px; top: 50%; height: 7px; transform: translateY(-50%); }
.cab__menu-lineas span { position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; transition: transform .5s var(--frenada); }
.cab__menu-lineas span:first-child { top: 0; }
.cab__menu-lineas span:last-child { bottom: 0; left: 7px; }
.cab__menu:hover .cab__menu-lineas span:last-child { transform: translateX(-7px); }
@media (max-width: 899px) and (scripting: enabled) {
  .cab__nav { display: none; }
  .cab__menu { display: block; }
}
.menu { position: fixed; inset: 0; z-index: 60; }
.menu[hidden] { display: none; }
.menu__velo { position: absolute; inset: 0; background: rgba(23, 23, 23, .48); opacity: 0; transition: opacity .6s var(--frenada); }
.menu__panel {
  position: absolute; top: 0; right: 0; bottom: 0; width: min(92vw, 500px); overflow-y: auto; overscroll-behavior: contain;
  display: flex; flex-direction: column; padding: 0 var(--g) max(28px, env(safe-area-inset-bottom));
  background: var(--papel); box-shadow: -1px 0 0 var(--linea);
  transform: translateX(100%); transition: transform .85s var(--barrido);
}
.menu.is-abierto .menu__velo { opacity: 1; }
.menu.is-abierto .menu__panel { transform: none; }
.menu__cabeza { display: flex; align-items: center; justify-content: space-between; min-height: var(--cab); }
.menu__marca { display: flex; flex-direction: column; gap: 6px; color: var(--tinta); text-decoration: none; padding: 8px 0; }
.menu__marca svg { width: 128px; aspect-ratio: 472.1 / 53.3; height: auto; fill: currentColor; stroke: currentColor; stroke-width: 1.6; overflow: visible; }
.menu__marca span { font: 400 10px/1 var(--f-texto); letter-spacing: .3em; text-transform: uppercase; color: var(--gris); }
.menu__cerrar { position: relative; width: 44px; height: 44px; margin-right: -10px; padding: 0; background: none; border: 0; cursor: pointer; color: var(--tinta); }
.menu__cerrar span { position: absolute; left: 12px; right: 12px; top: 50%; height: 1px; background: currentColor; }
.menu__cerrar span:first-child { transform: rotate(45deg); }
.menu__cerrar span:last-child { transform: rotate(-45deg); }
.menu__nav { flex: 1; display: flex; align-items: center; padding: 6svh 0; }
.menu__nav ol { list-style: none; margin: 0; padding: 0; width: 100%; }
.menu__nav li { border-top: 1px solid var(--linea); }
.menu__nav li:last-child { border-bottom: 1px solid var(--linea); }
.menu__nav a { display: flex; align-items: baseline; gap: 18px; padding: clamp(14px, 2.6svh, 24px) 0; color: var(--tinta); text-decoration: none; }
.menu__num { font: 500 10.5px/1 var(--f-texto); letter-spacing: .2em; color: var(--gris); min-width: 2em; }
.menu__texto { font: var(--d-peso) calc(clamp(44px, 12vw, 68px) * var(--d-esc))/1 var(--f-display); letter-spacing: calc(-.012em + var(--d-track)); }
.menu__nav a[aria-current]:not(.is-eclipsado) .menu__texto { background: linear-gradient(var(--oro), var(--oro)) 0 100% / 100% 1px no-repeat; padding-bottom: 4px; }
.menu__pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; padding-top: 20px; }
.menu__pie p { font: 500 11px/1.4 var(--f-texto); letter-spacing: .24em; text-transform: uppercase; color: var(--gris); }
.menu__directo { flex-basis: 100%; list-style: none; margin: 4px 0 0; padding: 0; font-size: 13.5px; line-height: 1.5; color: var(--gris); }
.menu__directo li + li { margin-top: 2px; }
.menu__directo span { display: inline-block; min-width: 9.6em; color: var(--tinta); }
.menu__directo a { display: inline-block; padding: 7px 0; margin-right: 14px; color: var(--gris); text-decoration: none; }
.menu__directo a:hover, .menu__directo a:focus-visible { color: var(--tinta); }
.menu__nav li, .menu__pie { opacity: 0; transform: translateY(18px); transition: opacity .9s var(--frenada), transform 1s var(--frenada); }
.menu.is-abierto .menu__nav li, .menu.is-abierto .menu__pie { opacity: 1; transform: none; transition-delay: calc(.28s + var(--i, 0) * .08s); }
@media (prefers-reduced-motion: reduce) {
  .menu__velo, .menu__panel, .menu__nav li, .menu__pie { transition: none !important; }
}
@media (max-height: 520px) { .menu__texto { font-size: calc(36px * var(--d-esc)); } .menu__nav { padding: 8px 0; } }
html.menu-abierto { overflow: hidden; }

@media (scripting: none) {
  .cab { background: var(--papel); box-shadow: 0 1px 0 var(--linea); }
  .es-portada .cab .cab__marca { opacity: 1; transform: none; pointer-events: auto; }
}

.escena { position: relative; }
.escena__pin { position: relative; }

:root { --muro: #F4ECE0; --muro-centro: #FBF7F0; }   
.hero-luz { position: absolute; left: 0; top: 0; width: 100%; height: 100svh; z-index: 0; overflow: hidden; pointer-events: none; }
.hero-luz__muro {
  position: absolute; inset: 0;
  background: radial-gradient(120% 92% at 48% 56%, var(--muro-centro) 0%, var(--muro) 56%, #EBE1D2 100%);
}
.hero-luz__sol {
  position: absolute; left: 52vw; top: 5svh; width: min(38vw, 64svh); height: 88svh;
  transform: translate3d(var(--px, 0px), var(--py, 0px), 0);
}
.hero-luz__deriva { position: absolute; inset: 0; transform-origin: 30% 0%; }
.hero-luz__ventana { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.hero-luz__polvo, .hero-luz__agua, .hero-luz__reflejo { position: absolute; inset: 0; width: 100%; height: 100%; display: none; }
@media (orientation: portrait) {
  .hero-luz__sol { left: 34vw; top: 6svh; width: 86vw; height: 70svh; }
}
@media (max-height: 520px) { .hero-luz__sol { left: 56vw; top: 2svh; width: 34vw; height: 96svh; } }
@media (prefers-reduced-motion: no-preference) {
  .hero-luz__deriva { animation: sol-de-tarde 110s ease-in-out infinite alternate; will-change: transform; }
  .hero-luz.is-pausa .hero-luz__deriva { animation-play-state: paused; }
}

@keyframes sol-de-tarde {
  from { transform: translate3d(5vw, -1.5svh, 0) skewX(2deg) scale(.97); }
  to   { transform: translate3d(-9vw, 2.5svh, 0) skewX(-7deg) scale(1.04); }
}
.hero-luz.con-polvo .hero-luz__polvo { display: block; }

.hero-luz__lino {
  position: absolute; inset: 0; pointer-events: none;
  background: url("../img/lino-pared.webp") 0 0 / 256px 256px repeat;
  background-image: image-set(url("../img/lino-pared.webp") 1x, url("../img/lino-pared@2x.webp") 2x);
  mix-blend-mode: multiply;
}
@media (max-width: 639px) { .hero-luz__lino { opacity: .74; } }   
@media (max-resolution: 1.5dppx) { .hero-luz__lino { opacity: .8; } }   

.hero-luz.con-reflejo .hero-luz__reflejo { display: block; }
.hero-luz.con-reflejo .hero-luz__mancha { opacity: .8; }

@media (orientation: portrait) {
  .hero-luz.con-reflejo .hero-luz__sol { left: 14vw; top: 9svh; width: 82vw; height: 64svh; }
  
  .hero-luz.con-reflejo .hero-luz__mancha > g { display: none; }
}

@media (scripting: enabled) {
  html[data-hero="a"] .hero-luz__sol { display: none; }
  html[data-hero="a"] .hero-luz__agua { display: block; }
}
.portada {
  position: relative; z-index: 1; min-height: 100svh;
  display: grid; grid-template-rows: 1fr auto; justify-items: center; text-align: center;
  padding: var(--cab) var(--g) clamp(18px, 3.6vh, 36px);
}
.portada__centro { align-self: center; display: flex; flex-direction: column; align-items: center; padding: clamp(6px, 1.6vh, 20px) 0; }
.portada__textos { display: flex; flex-direction: column; align-items: center; }
.portada__base { display: flex; justify-content: center; max-width: 100%; }
.portada__logo { height: clamp(210px, 46svh, 450px); width: auto; aspect-ratio: 485 / 551; max-width: 100%; overflow: visible; }
.portada__lema {
  margin: clamp(16px, 3vh, 34px) 0 clamp(14px, 2.6vh, 28px);
  font: 500 clamp(11px, calc(.55rem + .42vw), 14.5px)/1.4 var(--f-texto); letter-spacing: .32em; text-transform: uppercase;
  color: var(--tinta); white-space: nowrap;
}
.portada__lema span { display: inline-block; }
.portada__lema span + span::before { content: "·" / ""; color: var(--oro); padding: 0 .5em 0 .18em; }
.portada__mensaje {
  margin: 0; max-width: 19em; text-wrap: balance;
  
  font: 400 clamp(27px, calc(1.1rem + 2.5vw), 54px)/1.13 var(--f-display); letter-spacing: calc(-.004em + var(--d-track));
}
@media (max-width: 679px) { .portada__mensaje { font-weight: 500; } }   
.portada__areas {
  max-width: 100%; padding-top: 14px; border-top: 1px solid var(--linea); text-wrap: balance;
  font: 400 11px/2 var(--f-texto); letter-spacing: .2em; text-transform: uppercase; color: var(--gris);
}
.portada__areas span { white-space: nowrap; }
.portada__areas span:not(:last-child)::after { content: "·" / ""; color: var(--oro-texto); padding: 0 .2em 0 .62em; }

.iso { opacity: .72; }
.iso path { fill: none; stroke: var(--oro); stroke-width: 1.8; stroke-linecap: square; }
.logo__wm { fill: var(--tinta); }
.logo__sub {
  font: 400 14px var(--f-texto); letter-spacing: 7.4px; fill: var(--gris);
  
}

@media (max-width: 899px) { .portada__lema { letter-spacing: .22em; } }
@media (max-width: 639px) {
  .portada__logo { height: clamp(200px, 42svh, 360px); }
  .portada__lema { letter-spacing: .16em; }
  .portada__areas { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 1.15em; letter-spacing: .14em; line-height: 2.05; }
  .portada__areas span:not(:last-child)::after { content: none; }
}

@media (max-height: 520px) {
  .portada { padding-bottom: 10px; grid-template-rows: 1fr; }
  .portada__logo { height: min(46svh, 260px); }
  .portada__lema { margin: 10px 0 8px; }
  .portada__mensaje { font-size: calc(22px * var(--d-esc)); }
  .portada__areas { display: none; }
}

@media (prefers-reduced-motion: no-preference) {
  .iso path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: trazo 1.7s var(--trazo) .1s forwards; }
  .iso path:nth-child(2) { animation-delay: .3s; }
  .iso path:nth-child(3) { animation-delay: .5s; animation-duration: 1.3s; }
  .iso path:nth-child(4) { animation-delay: .62s; }
  .logo__wm { opacity: 0; animation: aparece 1.4s var(--frenada) .45s forwards; }
  .logo__sub { opacity: 0; animation: aparece 1.4s var(--frenada) .85s forwards; }
  .portada__lema span { opacity: 0; transform: translateY(10px); animation: sube 1s var(--frenada) forwards; }
  .portada__lema span:nth-child(1) { animation-delay: 1.75s; }
  .portada__lema span:nth-child(2) { animation-delay: 1.9s; }
  .portada__lema span:nth-child(3) { animation-delay: 2.05s; }
  .portada__mensaje { opacity: 0; transform: translateY(18px); animation: sube 1.4s var(--frenada) .6s forwards; }
  .portada__areas { opacity: 0; animation: aparece 1.2s var(--frenada) 2.1s forwards; }
}
@keyframes trazo { to { stroke-dashoffset: 0; } }
@keyframes aparece { to { opacity: 1; } }
@keyframes sube { to { opacity: 1; transform: none; } }

.escena__foto { position: relative; margin: 0; height: 100svh; min-height: 420px; overflow: hidden; background: var(--arena); }
.escena__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 53% 58%; }
.escena__foto::after {
  content: ""; position: absolute; inset: 0 0 auto; height: 240px; pointer-events: none;
  background:
    radial-gradient(ellipse 560px 200px at 0 0, rgba(23, 23, 23, .8), rgba(23, 23, 23, .45) 45%, rgba(23, 23, 23, 0) 78%),
    radial-gradient(ellipse 560px 160px at 100% 0, rgba(23, 23, 23, .62), rgba(23, 23, 23, 0) 74%),
    linear-gradient(rgba(23, 23, 23, .26), rgba(23, 23, 23, 0) 120px);
  opacity: var(--velo, 0); transition: opacity .5s var(--frenada);
}
@media (max-width: 639px) {
  .escena__foto::after {
    height: 200px;
    background:
      radial-gradient(ellipse 240px 110px at 0 0, rgba(23, 23, 23, .55), rgba(23, 23, 23, 0) 75%),
      radial-gradient(ellipse 150px 110px at 100% 0, rgba(23, 23, 23, .6), rgba(23, 23, 23, 0) 75%),
      linear-gradient(rgba(23, 23, 23, .66) 0, rgba(23, 23, 23, .5) 60px, rgba(23, 23, 23, .18) 110px, rgba(23, 23, 23, 0) 160px);
  }
}
.escena__lineas { display: none; }
@media (orientation: portrait) { .escena__foto img { object-position: 50% 60%; } }

.escena.is-escena { height: 300svh; }
.escena.is-escena .escena__pin { position: sticky; top: 0; height: 100svh; overflow: hidden; }
.escena.is-escena .portada { position: absolute; inset: 0; z-index: 2; min-height: 0; }
.escena.is-escena .escena__foto {
  position: absolute; inset: 0; z-index: 1; height: auto; min-height: 0;
  clip-path: inset(var(--t, 50%) var(--r, 50%) var(--b, 50%) var(--l, 50%)); opacity: var(--fo, 0);
}
.escena.is-escena .escena__foto img { transform: translate(var(--dx, 0px), var(--dy, 0px)) scale(var(--z, 1)); will-change: transform; }
.escena.is-escena .escena__lineas {
  display: block; position: absolute; z-index: 3; left: 0; top: 0; width: var(--w, 0px); height: var(--h, 0px);
  transform: translate(var(--lx, 0px), var(--ly, 0px)); opacity: var(--lo, 0); overflow: visible; pointer-events: none;
}
.escena__lineas path { fill: none; stroke: var(--oro); stroke-width: var(--sw, 1.4px); vector-effect: non-scaling-stroke; stroke-linecap: square; }

.presenta { padding: clamp(110px, 14vw, 210px) var(--g) clamp(110px, 13vw, 200px); display: grid; gap: clamp(110px, 13vw, 200px); }
.bloque { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col); row-gap: clamp(28px, 3vw, 44px); }
.titular {
  margin: 0; text-wrap: balance;
  font: var(--d-peso) calc(clamp(38px, calc(1rem + 5.4vw), 92px) * var(--d-esc))/1.02 var(--f-display); letter-spacing: calc(-.014em + var(--d-track));
}
.bloque--a .titular { grid-column: 1 / span 8; }
.bloque--a .texto { grid-column: 9 / -1; align-self: end; }

.presenta { padding-bottom: clamp(90px, 11vw, 170px); }

.plano { --ar: 1400 / 980; position: relative; isolation: isolate; background: var(--arena) url("../img/lino-arena.webp") 0 0 / 256px 256px repeat; }
@media (min-resolution: 2dppx) { .plano { background-size: 176px 176px; } }
.plano__pin { display: grid; gap: clamp(28px, 3vw, 56px); padding: calc(var(--cab) + clamp(48px, 7vw, 110px)) var(--g) clamp(40px, 5vw, 80px); }
.plano__dato { display: flex; align-items: flex-end; gap: 22px; margin: 22px 0 0; }
.metodo__cifra {
  display: block; margin: 0 0 0 -.05em; flex: none;
  font: 400 clamp(96px, 9.5vw, 150px)/.8 var(--f-display); letter-spacing: calc(-.04em + var(--d-track));
  color: var(--oro-texto); font-variant-numeric: lining-nums; font-feature-settings: "lnum" 1;
}
.plano.is-vivo .metodo__cifra {   
  color: transparent; -webkit-text-stroke: 1px var(--oro);
  background: linear-gradient(to top, var(--oro-texto) var(--l, 0%), transparent var(--l, 0%));
  -webkit-background-clip: text; background-clip: text;
}
.plano__dato-txt { padding-bottom: 6px; }
.metodo__rotulo { display: block; margin: 0 0 8px; font: 500 12px/1.4 var(--f-texto); letter-spacing: .24em; text-transform: uppercase; color: var(--tinta); }
.metodo__lema { display: block; max-width: 13em; font: 500 clamp(17px, 1.35vw, 21px)/1.25 var(--f-display); letter-spacing: var(--d-track); }
.plano__pasos { list-style: none; margin: clamp(40px, 6vh, 72px) 0 0; padding: 0; }
.plano__paso + .plano__paso { margin-top: 28px; }
.paso__num { display: block; font: 500 11px/1 var(--f-texto); letter-spacing: .2em; color: var(--gris); }
.paso__verbo { margin: 10px 0 0; font: var(--d-peso) clamp(36px, 4.2vw, 64px)/1.02 var(--f-display); letter-spacing: calc(-.01em + var(--d-track)); color: var(--tinta); }
.paso__texto { margin-top: 12px; max-width: 24em; color: var(--gris); font-size: clamp(15.5px, calc(.78rem + .35vw), 18px); line-height: 1.6; }

.plano.is-vivo .plano__pasos { position: relative; display: grid; }
.plano.is-vivo .plano__paso { grid-area: 1 / 1; margin: 0; opacity: 0; transform: translateY(18px); transition: opacity .5s var(--frenada), transform .9s var(--frenada); pointer-events: none; }
.plano.is-vivo .plano__paso.is-activo { opacity: 1; transform: none; transition-delay: .12s; }
.plano.is-vivo .plano__paso.is-hecho { transform: translateY(-14px); }

.plano__hoja { position: relative; margin: 0; display: flex; flex-direction: column; border: 1px solid rgba(23, 23, 23, .22); padding: 10px; }
.plano__hoja::before { content: ""; position: absolute; inset: 4px; border: 1px solid rgba(23, 23, 23, .08); pointer-events: none; }
.plano__dibujo { position: relative; aspect-ratio: var(--ar); width: 100%; overflow: hidden; }
.plano__fija { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 100% 50%; }
.plano__svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.plano__cajetin {
  display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; border-top: 1px solid rgba(23, 23, 23, .22); margin-top: 10px;
  font: 500 9.5px/1.35 var(--f-texto); letter-spacing: .2em; text-transform: uppercase; color: var(--tinta);
}
.plano__cajetin > span { padding: 9px 12px 8px; border-left: 1px solid rgba(23, 23, 23, .16); }
.plano__cajetin > span:first-child { border-left: 0; padding-left: 2px; }
.plano__cajetin small { display: block; margin-top: 3px; font-size: 9px; letter-spacing: .16em; color: var(--gris); }
.plano__caj-marca { font-family: var(--f-display); font-size: 15px; letter-spacing: .08em; line-height: 1; }
.plano__caj-marca small { font-family: var(--f-texto); font-size: 7.5px; letter-spacing: .3em; }
.plano__caj-hoja b { font-weight: 600; color: var(--oro-texto); }

.plano__svg path { fill: none; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-linejoin: round; }
.plano__boceto path { stroke: #9B8668; stroke-width: 1.15px; }
.plano__boceto path.doble { stroke-width: .8px; opacity: .6; }
.plano__boceto text { font: 400 30px var(--f-display); fill: #8a7656; }
.plano__limpio path { stroke: var(--oro); stroke-width: 1.25px; }
.plano__limpio path.fino { stroke-width: .8px; }
.plano__limpio path.eje { stroke-dasharray: 14 5 2 5; }
.plano__cotas path { stroke: #6c655b; stroke-width: .85px; }
.plano__cotas path.tic { stroke-width: 1.3px; }
.plano__frente { fill: none; stroke: var(--oro); stroke-width: 2px; vector-effect: non-scaling-stroke; opacity: 0; }

.plano__etiquetas { position: absolute; inset: 0; pointer-events: none; }
.plano__etq { position: absolute; left: var(--x); top: var(--y); display: flex; align-items: center; transform: translate(-4px, -50%); opacity: 0; transition: opacity .45s var(--frenada); }
.plano__etq::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--oro); box-shadow: 0 0 0 3px rgba(252, 251, 248, .7); }
.plano__etq i { width: 22px; height: 1px; background: var(--tinta); opacity: .5; }
.plano__etq span { padding: 5px 8px 4px; background: var(--papel); box-shadow: 0 1px 2px rgba(40, 30, 20, .16); font: 500 10px/1 var(--f-texto); letter-spacing: .18em; text-transform: uppercase; white-space: nowrap; }
.plano__etq span b { font-weight: 600; color: var(--oro-texto); margin-right: 6px; }
.plano__etq.izq { flex-direction: row-reverse; transform: translate(calc(-100% + 4px), -50%); }
.plano__etq.is-on { opacity: 1; }

.plano:not(.is-vivo) .plano__mats, .plano:not(.is-vivo) .plano__foto, .plano:not(.is-vivo) .plano__boceto,
.plano:not(.is-vivo) .plano__cotas, .plano:not(.is-vivo) .plano__frente { display: none; }
.plano:not(.is-vivo) .plano__limpio { opacity: .3; }

.plano.is-vivo .plano__fija { display: none; }
.plano.is-vivo .plano__foto { opacity: 0; }
.plano.is-vivo .plano__boceto path, .plano.is-vivo .plano__limpio path:not(.eje), .plano.is-vivo .plano__cotas path { stroke-dasharray: 1 1; stroke-dashoffset: 1; }
.plano.is-vivo .plano__boceto text { opacity: 0; }
.plano.is-vivo .plano__mat { clip-path: inset(100% 0 0 0); }
.plano.is-vivo .plano__limpio path.eje { opacity: 0; }

@media (min-width: 1000px), (orientation: landscape) {
  .plano.is-vivo .plano__escena { height: 620vh; }
  .plano.is-vivo .plano__pin { position: sticky; top: 0; height: 100svh; align-items: center; padding-top: calc(var(--cab) + 32px); padding-bottom: 48px; }
  .plano__pin { grid-template-columns: minmax(300px, 30%) 1fr; }
  .plano__hoja { width: min(100%, calc((100svh - var(--cab) - 150px) * 1.4286 + 22px)); justify-self: end; }
}

@media (orientation: landscape) and (max-height: 560px) {
  .plano__pin { grid-template-columns: minmax(220px, 34%) 1fr; gap: 20px; }
  .plano.is-vivo .plano__pin { padding-top: calc(var(--cab) + 12px); padding-bottom: 12px; }
  .metodo__cifra { font-size: 54px; }
  .plano__dato { margin-top: 10px; gap: 12px; }
  .metodo__rotulo { font-size: 10px; margin-bottom: 4px; }
  .metodo__lema { font-size: 14px; }
  .plano__pasos { margin-top: 14px; }
  .paso__verbo { font-size: 28px; margin-top: 4px; }
  .paso__texto { font-size: 13.5px; margin-top: 4px; line-height: 1.45; }
  .plano__hoja { width: min(100%, calc((100svh - var(--cab) - 70px) * 1.4286 + 14px)); padding: 6px; }
  .plano__cajetin { display: none; }
  .plano__etq[data-mat="nicho"], .plano__etq[data-mat="suelo"] { display: none; }   
  .plano__etq span b { display: none; }
}

@media (max-width: 999px) and (orientation: portrait) {
  .plano { --ar: 1100 / 980; }
  .plano.is-vivo .plano__escena { height: 560vh; }
  .plano.is-vivo .plano__pin { position: sticky; top: 0; height: 100svh; align-content: center; gap: 26px; padding-top: calc(var(--cab) + 16px); padding-bottom: 16px; }
  .plano__dato { margin-top: 12px; gap: 14px; }
  .metodo__cifra { font-size: 64px; }
  .metodo__rotulo { font-size: 10.5px; margin-bottom: 4px; }
  .metodo__lema { font-size: 15.5px; }
  .plano__pasos { margin-top: 18px; }
  .plano.is-vivo .plano__pasos { min-height: 9.5em; }
  .paso__verbo { font-size: 38px; margin-top: 6px; }
  .paso__texto { font-size: 15px; margin-top: 6px; }
  .plano__hoja { padding: 6px; }
  .plano__cajetin { grid-template-columns: 1.25fr 1fr 1fr; font-size: 10px; letter-spacing: .14em; }
  .plano__cajetin > span { padding: 7px 8px 6px; }
  .plano__cajetin > span:nth-child(2) { display: none; }
  .plano__cajetin small { font-size: 9.5px; letter-spacing: .1em; }
  .plano__caj-marca { font-size: 13px; }
  .plano__caj-marca small { font-size: 7.5px; letter-spacing: .22em; }
  .plano__boceto text { font-size: 44px; }
  
  .plano__etq { left: var(--mx); top: var(--my); }
  .plano__etq span { font-size: 12px; padding: 5px 8px 4px; letter-spacing: .12em; }
  .plano__etq i { width: 12px; }
  .plano__etq[data-mat="nicho"], .plano__etq[data-mat="suelo"] { display: none; }
  .plano__etq span b { display: none; }   
  .plano__caj-hoja small { min-height: calc(2 * 1.35em); }   
}
@media (max-width: 999px) and (min-width: 640px) and (orientation: portrait) { .plano__pin { padding-left: 10vw; padding-right: 10vw; } }

@media (max-width: 999px) and (orientation: portrait) and (max-height: 720px) {
  .plano.is-vivo .plano__pin { gap: 14px; padding-top: calc(var(--cab) + 8px); padding-bottom: 8px; }
  .plano .eyebrow { display: none; }
  .metodo__cifra { font-size: 50px; }
  .plano__dato { margin-top: 0; }
  .metodo__lema { font-size: 14px; }
  .plano__pasos { margin-top: 10px; }
  .plano.is-vivo .plano__pasos { min-height: 8.6em; }
  .paso__verbo { font-size: 32px; }
  .paso__texto { font-size: 14px; line-height: 1.5; }
  .plano__cajetin { display: none; }
}
.plano__nota {
  position: relative; margin: 0 var(--g); padding: 18px 0 clamp(45px, 5vw, 75px); max-width: 34em;
  border-top: 1px solid var(--linea); color: var(--gris); font-size: clamp(15px, calc(.78rem + .3vw), 17px); line-height: 1.65;
}

.plano.is-vivo .plano__nota { margin-top: calc(48px - var(--nota-sube, 0px)); }
@media (min-width: 1000px), (orientation: landscape) {
  .plano__nota { width: clamp(280px, calc((100vw - 2 * var(--g)) * .3), 30em); }   
}

.plano__sello-ancla { position: relative; height: 0; z-index: 3; }
.plano__sello { position: absolute; right: 3%; bottom: -5px; width: clamp(170px, 22%, 200px); transform: rotate(-4deg); transform-origin: 55% 60%; }
.plano__sello svg { display: block; width: 100%; height: auto; overflow: visible; }
.plano__sello-fondo { fill: rgba(252, 251, 248, .9); }
.plano__sello-tinta rect, .plano__sello-tinta line, .plano__sello-tinta path { fill: none; stroke: var(--oro-texto); vector-effect: non-scaling-stroke; }
.plano__sello .s-borde { stroke-width: 2px; }
.plano__sello .s-fino { stroke-width: 1px; }
.plano__sello .s-iso path { stroke-width: 1.2px; stroke-linecap: square; }
.plano__sello .s-wm { fill: var(--oro-texto); stroke: var(--oro-texto); stroke-width: 2; }
.plano__sello text { font: 600 18px var(--f-texto); letter-spacing: 2.2px; fill: var(--oro-texto); stroke: var(--oro-texto); stroke-width: .35px; }

.plano.is-vivo .plano__sello { opacity: 0; transform: rotate(-8deg) scale(1.15); transition: opacity .22s ease, transform .22s ease; }
.plano.is-vivo .plano__sello.is-sellado { opacity: 1; transform: rotate(-4deg); animation: estampar .46s cubic-bezier(.3, .7, .2, 1) both; }
.plano.is-vivo .plano__sello.is-sellado .plano__sello-tinta { animation: tinta .46s ease-out both; }
@keyframes estampar {
  0%   { opacity: 0; transform: rotate(-8deg) scale(1.15); filter: drop-shadow(0 10px 9px rgba(40, 28, 10, .22)); }
  55%  { opacity: 1; transform: rotate(-4deg) scale(.985); filter: drop-shadow(0 1px 1px rgba(40, 28, 10, .25)); }
  75%  { transform: rotate(-4deg) scale(1.006); }
  100% { opacity: 1; transform: rotate(-4deg) scale(1); filter: drop-shadow(0 0 0 rgba(40, 28, 10, 0)); }
}
@keyframes tinta { 0% { opacity: .45; } 55% { opacity: 1; } 100% { opacity: 1; } }

@media (max-width: 999px) and (orientation: portrait) and (max-height: 720px) { .plano__sello { bottom: 10px; width: 160px; } }
@media (orientation: landscape) and (max-height: 560px) { .plano__sello { bottom: 8px; width: 130px; } }
@media (prefers-reduced-motion: reduce) { .plano.is-vivo .plano__paso { transition: none; } }

.objetivo-bloque {
  --oliva: #45452F;
  position: relative; isolation: isolate; overflow: clip; background: var(--oliva); color: var(--claro);
  padding: clamp(110px, 15vw, 230px) var(--g);
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col);
}

@media (min-width: 1024px) and (orientation: landscape) {
  .objetivo-bloque { min-height: 100svh; align-content: center; padding: calc(var(--cab) + clamp(56px, 6vw, 110px)) var(--g) clamp(56px, 6vw, 110px); }
}
.objetivo-bloque::before {   
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: url("../img/lino-relieve.webp") 0 0 / 256px 256px repeat; mix-blend-mode: soft-light; opacity: .55;
}
@media (min-resolution: 2dppx) { .objetivo-bloque::before { background-size: 176px 176px; } }
.objetivo-bloque::after {   
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(70% 90% at 12% 30%, rgba(255, 236, 200, .1), rgba(255, 236, 200, 0) 70%);
}
.objetivo__cita { grid-column: 2 / span 9; position: relative; margin: 0; }
.objetivo {
  margin: 0; max-width: 19em; text-wrap: pretty;
  font: var(--d-peso-frase) calc(clamp(32px, calc(1rem + 3.6vw), 72px) * var(--d-esc))/1.14 var(--f-display); letter-spacing: calc(-.012em + var(--d-track));
  color: var(--claro);
}

.objetivo::before { content: "«" / ""; position: absolute; right: 100%; margin-right: .12em; color: var(--oro); }
.objetivo::after { content: "»" / ""; color: var(--oro); margin-left: .06em; }
.objetivo__firma { display: flex; align-items: center; gap: 16px; margin: clamp(30px, 3.4vw, 52px) 0 0; font: 500 11px/1.4 var(--f-texto); letter-spacing: .26em; text-transform: uppercase; color: var(--claro-2); }
.objetivo__firma::before { content: ""; width: clamp(40px, 5vw, 72px); height: 1px; background: var(--oro); }

.objetivo.is-llenado {
  color: transparent; -webkit-text-fill-color: transparent;
  background: linear-gradient(180deg, var(--claro) calc(var(--p, 0%) - 4%), rgba(236, 232, 225, .34) calc(var(--p, 0%) + 4%));
  -webkit-background-clip: text; background-clip: text;
}
.objetivo.is-llenado::before, .objetivo.is-llenado::after { -webkit-text-fill-color: var(--oro); }
@media (max-width: 1023px) { .objetivo__cita { grid-column: 1 / -1; padding-left: .5em; } }

@media (max-width: 767px) {
  .objetivo__cita { padding-left: 0; }
  .objetivo::before { position: static; margin-right: .08em; }
}

@media (max-width: 1023px) {
  .bloque--a .titular, .bloque--a .texto { grid-column: 1 / -1; }
  .bloque--a .texto { justify-self: end; max-width: 30em; }
}
@media (max-width: 639px) {
}

.sumario { background: var(--arena); padding: clamp(100px, 12vw, 180px) var(--g) clamp(110px, 13vw, 200px); }
.sumario .eyebrow { margin-bottom: clamp(36px, 5vw, 72px); }
.sumario__cuerpo { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col); }
.sumario__lista { grid-column: 1 / span 7; list-style: none; margin: 0; padding: 0; }
.familia { display: grid; grid-template-columns: 3.2em 1fr; column-gap: 12px; padding: clamp(20px, 2.6vw, 36px) 0; border-top: 1px solid var(--linea); }
.familia:last-child { border-bottom: 1px solid var(--linea); }
.familia__num { padding-top: 1.2em; font: 500 11px/1 var(--f-texto); letter-spacing: .2em; color: var(--gris); }
.familia__nombre { margin: 0; font: var(--d-peso) calc(clamp(40px, calc(1rem + 4.2vw), 84px) * var(--d-esc))/1.02 var(--f-display); letter-spacing: calc(-.014em + var(--d-track)); color: var(--tinta); }
.familia__areas { grid-column: 2; list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 1.6em; color: var(--gris); font-size: 15px; line-height: 1.5; }
.familia__areas li { white-space: nowrap; }
.sumario__lamina { grid-column: 8 / -1; position: relative; }
.lamina { position: sticky; top: calc(var(--cab) + max(20px, (100svh - var(--cab) - var(--lam-h) - 40px) / 2)); --lam-h: min(calc(36vw / .62), calc(100svh - var(--cab) - 84px)); }
.lamina__marco {
  position: relative; height: var(--lam-h); aspect-ratio: 340.5 / 549; max-width: 100%; margin-left: auto;
  overflow: hidden; background: var(--papel);
}
.lamina__marco::after { content: ""; position: absolute; inset: 0; border: 1px solid var(--oro); pointer-events: none; z-index: 5; }
.lamina__item { position: absolute; inset: 0; margin: 0; clip-path: inset(100% 0 0 0); z-index: 1; }
.lamina__item.is-activa { clip-path: inset(0 0 0 0); z-index: 3; }
.lamina__item.is-saliendo { clip-path: inset(0 0 0 0); z-index: 2; }
.lamina__item img, .lamina__item video { width: 100%; height: 100%; object-fit: cover; }
.lamina__pie { display: flex; justify-content: space-between; gap: 12px; margin-top: 14px; font: 500 11px/1.4 var(--f-texto); letter-spacing: .22em; text-transform: uppercase; color: var(--gris); transition: opacity .35s var(--frenada); }
.lamina__pie.is-cambiando { opacity: 0; }
.lamina__marco { margin-left: auto; }
.lamina__pie [data-firma] { color: var(--tinta); }
.sumario__cola { display: none; }
.con-climax .sumario { padding-bottom: 0; }
.con-climax .sumario__cola { display: block; height: 45svh; border: 0; }
@media (max-width: 899px) and (min-height: 521px) { .con-climax .sumario__cola { height: 30svh; } }
.sumario.is-abierta .sumario__lamina { visibility: hidden; }

.familia__img { display: none; }
@media (scripting: none) {
  .sumario__lamina { display: none; }
  .sumario__lista { grid-column: 1 / -1; }
  .familia__img { display: block; grid-column: 2; margin-top: 18px; width: min(320px, 100%); aspect-ratio: 4 / 5; object-fit: cover; }
}
@media (prefers-reduced-motion: no-preference) {
  .lamina__item { transition: clip-path 1.05s var(--barrido); }
  .lamina__item img, .lamina__item video { transform: scale(1.1); transition: transform 1.8s var(--frenada); }
  .lamina__item.is-activa img, .lamina__item.is-activa video, .lamina__item.is-saliendo img, .lamina__item.is-saliendo video { transform: none; }
}
@media (max-width: 899px) and (min-height: 521px) {
  
  .sumario__cuerpo { display: flex; flex-direction: column; }
  .sumario__lamina { order: -1; position: sticky; top: var(--cab); z-index: 4; margin: 0 calc(var(--g) * -1) 6px; padding: 10px var(--g) 12px; background: var(--arena); box-shadow: 0 1px 0 var(--linea); }
  .lamina { position: static; --lam-h: 40svh; }
  .lamina__marco { width: 100%; aspect-ratio: auto; height: var(--lam-h); }
  .lamina__pie { margin-top: 10px; }
  .familia { padding: 22px 0 26px; grid-template-columns: 2.6em 1fr; }
  .familia__nombre { font-size: calc(clamp(36px, 10.5vw, 64px) * var(--d-esc)); }
}
@media (max-width: 899px) and (max-height: 520px) {
  .sumario__lista { grid-column: 1 / span 7; }
  .sumario__lamina { grid-column: 8 / -1; }
  .lamina { --lam-h: 70svh; }
  .familia__nombre { font-size: calc(34px * var(--d-esc)); }
}

.is-barrido {
  color: transparent; -webkit-text-fill-color: transparent;
  background: linear-gradient(90deg, var(--tinta) calc(var(--p, -9%) - 6%), var(--tenue) calc(var(--p, -9%) + 6%));
  -webkit-background-clip: text; background-clip: text;
  padding-bottom: .08em; margin-bottom: -.08em;   
}

.frase { padding: clamp(130px, 17vw, 260px) var(--g); text-align: center; }
.frase__texto {
  margin: 0 auto; max-width: 15.5em; text-wrap: balance;
  font: var(--d-peso-frase) calc(clamp(32px, calc(1rem + 4.2vw), 80px) * var(--d-esc))/1.08 var(--f-display); letter-spacing: calc(-.014em + var(--d-track));
}
.frase__texto span { display: block; }
.frase__texto span + span { margin-top: .28em; }
.con-climax .frase { display: none; }

.climax { display: none; }
.con-climax .climax {
  display: block; position: relative; height: 300svh; margin-top: -100svh; z-index: 5; pointer-events: none;
  background: linear-gradient(transparent 100svh, var(--arena) 100svh, var(--arena) 200svh, transparent 200svh);
}

.con-climax:not(.relevo) .climax { height: 280svh; }   
.con-climax.relevo .cita { margin-top: -100svh; min-height: 100svh; }
.con-climax.relevo .cita__fondo { bottom: auto; height: 100svh; }   
.climax__pin { position: sticky; top: 0; height: 100svh; overflow: hidden; }
.climax__ventana {
  position: absolute; left: 0; top: 0; width: var(--w, 100%); height: var(--h, 100%);
  transform: translate(var(--x, 0px), var(--y, 0px)); overflow: hidden; background: var(--tinta); opacity: var(--vo, 0);
}
.climax__ventana::after { content: ""; position: absolute; inset: 0; border: 1px solid var(--oro); opacity: var(--filo, 0); }
.climax__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.climax__video--b { clip-path: inset(calc((1 - var(--vb, 0)) * 100%) 0 0 0); }
.climax__barrido {
  position: absolute; left: 0; right: 0; top: calc((1 - var(--vb, 0)) * 100%); height: 1px; z-index: 1;
  background: var(--oro); opacity: var(--vbf, 0); pointer-events: none;
}

.climax__video--c { clip-path: inset(calc((1 - var(--vc, 0)) * 100%) 0 0 0); }
.climax__barrido--c { top: calc((1 - var(--vc, 0)) * 100%); opacity: var(--vcf, 0); }
.climax__velo {
  position: absolute; inset: 0; opacity: var(--velo, 0);
  background: linear-gradient(90deg, rgba(23, 23, 23, .82) 0%, rgba(23, 23, 23, .6) 38%, rgba(23, 23, 23, 0) 66%);
}
.climax__oscuro { position: absolute; inset: 0; background: var(--tinta); opacity: var(--oscuro, 0); }

.climax__ventana::before, .cita__fondo::before {
  content: ""; position: absolute; inset: 0 0 auto; height: 240px; z-index: 2; pointer-events: none;
  background:
    radial-gradient(ellipse 420px 150px at 0 0, rgba(23, 23, 23, .6), rgba(23, 23, 23, 0) 72%),
    radial-gradient(ellipse 520px 140px at 100% 0, rgba(23, 23, 23, .55), rgba(23, 23, 23, 0) 72%);
}
.climax__ventana::before { opacity: var(--vcab, 0); }

.climax__ventana::before, .cita__fondo::before {
  background:
    radial-gradient(ellipse 420px 150px at 0 0, rgba(23, 23, 23, .6), rgba(23, 23, 23, 0) 72%),
    radial-gradient(ellipse 820px 240px at 100% 0, rgba(23, 23, 23, .86), rgba(23, 23, 23, .5) 45%, rgba(23, 23, 23, 0) 80%);
}
.climax__frase {
  position: absolute; left: var(--g); bottom: clamp(56px, 12svh, 140px); width: min(44vw, 15em); margin: 0;
  font: var(--d-peso-frase) calc(clamp(34px, calc(1rem + 3.4vw), 74px) * var(--d-esc))/1.08 var(--f-display); letter-spacing: calc(-.014em + var(--d-track)); color: var(--claro);
  opacity: var(--fo, 0); transform: translateY(var(--fy, 0px)); text-wrap: balance;
}
.climax__frase > span { display: block; }
.climax__frase > span + span { margin-top: .3em; }
.climax__frase .p { opacity: var(--po, .22); }
@media (orientation: portrait), (max-width: 899px) {
  .climax__velo { background: linear-gradient(0deg, rgba(23, 23, 23, .86) 0%, rgba(23, 23, 23, .55) 42%, rgba(23, 23, 23, 0) 70%); }
  .climax__frase { right: var(--g); width: auto; bottom: clamp(40px, 9svh, 110px); font-size: calc(clamp(30px, 8.4vw, 56px) * var(--d-esc)); }
}

.cita {
  position: relative; isolation: isolate; overflow: hidden;
  background: var(--tinta); color: var(--claro);
  min-height: min(96svh, 900px);
  padding: clamp(120px, 14vw, 220px) var(--g) clamp(80px, 9vw, 130px);
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col); row-gap: 36px; align-content: end;
}
.cita__fondo { position: absolute; inset: 0; z-index: -1; }
.cita__fondo video, .cita__fondo img { width: 100%; height: 100%; object-fit: cover; }

.cita__foto { position: absolute; inset: 0 0 1px; display: block; overflow: hidden; }
.cita__foto img { object-position: 60% 50%; }
.cita--marcas .cita__foto img { object-position: 50% 70%; }   

.cita--gessi .cita__foto img, .climax__video--b { object-position: 60% 50%; }
@media (prefers-reduced-motion: no-preference) {
  .cita__foto img { animation: kenburns 26s ease-in-out infinite alternate; animation-play-state: paused; will-change: transform; }
  .cita__foto.is-viva img { animation-play-state: running; }
}
@keyframes kenburns { from { transform: scale(1.02) translate3d(0, 0, 0); } to { transform: scale(1.09) translate3d(-1.6%, -1%, 0); } }
.relevo .cita--gessi .cita__foto img { animation: none; transform: none; will-change: auto; }
.cita__fondo::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(23, 23, 23, .94) 0%, rgba(23, 23, 23, .82) 30%, rgba(23, 23, 23, .3) 52%, rgba(23, 23, 23, 0) 66%),
    linear-gradient(180deg, rgba(23, 23, 23, 0) 72%, rgba(23, 23, 23, .9) 100%);
}

@media (orientation: landscape) and (min-width: 640px), (min-width: 1024px) {
  .cita--contacto .cita__fondo::after {
    background:
      linear-gradient(90deg, rgba(23, 23, 23, .94) 0%, rgba(23, 23, 23, .86) 34%, rgba(23, 23, 23, .6) 54%, rgba(23, 23, 23, 0) 72%),
      linear-gradient(180deg, rgba(23, 23, 23, 0) 72%, rgba(23, 23, 23, .9) 100%);
  }
}
.cita__titulo {
  grid-column: 1 / span 6; margin: 0; text-wrap: balance; align-self: end;
  
  font: var(--d-peso) calc(min(clamp(46px, 6.6vw, 112px), 9.2svh) * var(--d-esc) * var(--cita-k, 1))/.95 var(--f-display); letter-spacing: calc(-.02em + var(--d-track));
}
.cita__texto { grid-column: 1 / span 6; align-self: end; max-width: 36em; color: var(--claro-2); font-size: clamp(16px, calc(.8rem + .45vw), 18.5px); line-height: 1.7; }
.cita__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 22px 34px; margin-top: clamp(30px, 3.2vw, 46px); }
.cita__acciones .boton { margin: 0; }
.cita__directo { list-style: none; margin: 0; padding: 0; font-size: 13.5px; line-height: 1.5; color: var(--claro-2); letter-spacing: .02em; }
.cita__directo li + li { margin-top: 4px; }
.cita__quien { display: inline-block; min-width: 9.5em; color: var(--claro); }
.cita__directo a { display: inline-block; padding: 6px 0; margin-right: 12px; color: var(--claro-2); text-decoration: none; background: linear-gradient(var(--oro), var(--oro)) 0 calc(100% - 4px) / 0 1px no-repeat; transition: background-size .5s var(--frenada), color .3s; }
.cita__directo a:hover, .cita__directo a:focus-visible { color: var(--claro); background-size: 100% 1px; }
.cita__texto p + p { margin-top: 1.1em; }
.cita__texto .primero { color: var(--claro); }
.cita :focus-visible { outline-color: var(--claro); }
@media (max-width: 1023px) {
  .cita__titulo, .cita__texto { grid-column: 1 / -1; }
  .cita__texto { max-width: 34em; }
}

@media (orientation: portrait) and (max-width: 1023px), (max-width: 639px) {
  .cita { display: block; min-height: 0; padding-top: 0; }
  .cita__fondo { position: relative; inset: auto; z-index: 0; height: 46svh; min-height: 280px; margin: 0 calc(var(--g) * -1) clamp(36px, 7vw, 60px); }
  .cita__fondo::after { background: linear-gradient(180deg, rgba(23, 23, 23, 0) 62%, var(--tinta) 100%); }
  .cita { padding-bottom: var(--cita-pb, 44px); }
  .cita__titulo { margin-bottom: 22px; }
  .cita__texto p + p { margin-top: .8em; }
  .cita__acciones { margin-top: 26px; gap: 18px 30px; }
  .cita__quien { min-width: 0; display: inline; margin-right: 12px; }
  .cita__directo a { padding: 4px 0; }
}
@media (max-height: 520px) { .cita { min-height: 0; padding-top: 80px; } }
@media (min-width: 900px) and (orientation: landscape) {
  .cita { padding-bottom: clamp(40px, 6svh, 96px); row-gap: clamp(18px, 2.4svh, 30px); }
  .cita__acciones { margin-top: clamp(20px, 3svh, 40px); }
}

.pie { background: var(--tinta); color: var(--claro-2); padding: 0 var(--g) calc(28px + var(--pie-extra, 0px)); font-size: 13px; line-height: 1.7; }

.cita + .pie { box-shadow: 0 -2px 0 var(--tinta); }
.pie__fila {
  border-top: 1px solid var(--linea-clara); padding-top: clamp(36px, 4vw, 56px);
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col); row-gap: 28px; align-items: start;
}
.pie__marca { grid-column: 1 / span 4; color: var(--claro); display: flex; flex-direction: column; gap: 9px; }
.pie__marca svg { width: 170px; aspect-ratio: 472.1 / 53.3; height: auto; fill: currentColor; stroke: currentColor; stroke-width: 1.4; overflow: visible; }
.pie__marca span { font-size: 11px; letter-spacing: .32em; text-transform: uppercase; color: var(--claro-2); }
.pie__datos { grid-column: 6 / span 3; letter-spacing: .04em; }
.pie__legal { grid-column: 9 / -1; justify-self: end; text-align: right; }
.pie__legal ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0 22px; }
.pie a { text-decoration: none; display: inline-block; padding: 8px 0; }
.pie a:hover { color: var(--claro); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
.pie__copy { margin-top: 6px; color: #8E887E; }
.pie :focus-visible { outline-color: var(--claro); }
@media (max-width: 899px) {
  .pie__marca, .pie__datos, .pie__legal { grid-column: 1 / -1; justify-self: start; text-align: left; }
  .pie__legal ul { justify-content: flex-start; }
}

.pag-cab { padding: calc(var(--cab) + clamp(64px, 10vw, 150px)) var(--g) clamp(56px, 7vw, 110px); }
.pag-cab__titulo { margin: 0; font: var(--d-peso) calc(clamp(68px, 12.5vw, 210px) * var(--d-esc))/.84 var(--f-display); letter-spacing: calc(-.025em + var(--d-track)); }
@media (max-height: 520px) { .pag-cab { padding-top: calc(var(--cab) + 40px); padding-bottom: 40px; } .pag-cab__titulo { font-size: calc(72px * var(--d-esc)); } }

.marcas {
  list-style: none; margin: 0; padding: 0 var(--g) clamp(110px, 13vw, 200px);
  display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col);
  row-gap: clamp(80px, 9vw, 150px); align-items: start;
}
.marca__enlace { display: block; color: inherit; text-decoration: none; }
.marca__img { display: block; overflow: hidden; background: var(--arena); aspect-ratio: var(--ar, 3 / 2); max-height: 72svh; width: 100%; }
.marca__img img { width: 100%; height: 100%; object-fit: cover; object-position: var(--pos, 50% 50%); }
.marca__pie { display: grid; grid-template-columns: auto 1fr; column-gap: 18px; margin-top: 20px; align-items: baseline; }
.marca__num { grid-row: 1 / span 2; font: 500 10.5px/1 var(--f-texto); letter-spacing: .2em; color: var(--gris); }
.marca__nombre {
  margin: 0; justify-self: start; padding-bottom: 5px;
  font: 500 clamp(14.5px, .8rem + .25vw, 17px)/1.3 var(--f-texto); letter-spacing: .17em; text-transform: uppercase; color: var(--tinta);
  background: linear-gradient(var(--oro), var(--oro)) 0 100% / 0 1px no-repeat;
  transition: background-size .8s var(--frenada);
}
.marca__esp { grid-column: 2; margin-top: 4px; color: var(--gris); font-size: 15px; line-height: 1.5; }
.marca__enlace:hover .marca__nombre, .marca__enlace:focus-visible .marca__nombre { background-size: 100% 1px; }
.marca__enlace:focus-visible { outline-offset: 8px; }
.marca__enlace .marca__img img { transition: transform 1.6s var(--frenada); }
.marca__enlace:hover .marca__img img { transform: scale(1.04); }

.m-1  { --ar: 16 / 10; --ar-m: 4 / 3; }
.m-2  { --ar: 4 / 5;  --ar-m: 4 / 5; }
.m-3  { --ar: 3 / 4;  --ar-m: 4 / 5; }
.m-4  { --ar: 3 / 2;  --ar-m: 3 / 2; }
.m-5  { --ar: 16 / 10; --ar-m: 4 / 3; }
.m-6  { --ar: 4 / 5;  --ar-m: 4 / 5; }
.m-7  { --ar: 21 / 9; --ar-m: 4 / 3; }
.m-8  { --ar: 3 / 4;  --ar-m: 4 / 5; }
.m-9  { --ar: 16 / 10; --ar-m: 3 / 2; }
.m-10 { --ar: 3 / 2;  --ar-m: 3 / 2; }
.m-11 { --ar: 16 / 9; --ar-m: 3 / 2; }
.m-12 { --ar: 3 / 2;  --ar-m: 4 / 3; }

@media (min-width: 1200px), (min-width: 1024px) and (orientation: landscape) {
  .marcas--editorial { margin-top: calc(-1 * clamp(90px, 12vw, 230px)); }
  .m-1  { grid-column: 1 / span 7; margin-top: clamp(90px, 12vw, 230px); }
  .m-2  { grid-column: 9 / -1; }
  .m-3  { grid-column: 2 / span 4; }
  .m-4  { grid-column: 7 / -1; align-self: end; }
  .m-5  { grid-column: 1 / span 7; }
  .m-6  { grid-column: 9 / -1; margin-top: clamp(120px, 15vw, 260px); }
  .m-7  { grid-column: 1 / -1; margin-inline: calc(var(--g) * -1); }
  .m-7 .marca__pie { padding-inline: var(--g); }
  .m-8  { grid-column: 2 / span 4; }
  .m-9  { grid-column: 7 / -1; align-self: end; }
  .m-10 { grid-column: 2 / span 5; }
  .m-11 { grid-column: 8 / -1; margin-top: clamp(160px, 18vw, 300px); }
  .m-12 { grid-column: 3 / span 8; }
}

@media (min-width: 640px) and (max-width: 1023px), (min-width: 1024px) and (max-width: 1199px) and (orientation: portrait) {
  .marca .marca__img { aspect-ratio: var(--ar-m); }
  .m-1, .m-12 { grid-column: 1 / -1; }
  .m-2, .m-6 { grid-column: 5 / -1; }
  .m-3, .m-8 { grid-column: 1 / span 8; }
  .m-4, .m-9, .m-11 { grid-column: 4 / -1; }
  .m-5 { grid-column: 1 / span 10; }
  .m-10 { grid-column: 1 / span 9; }
  .m-7 { grid-column: 1 / -1; margin-inline: calc(var(--g) * -1); }
  .m-7 .marca__pie { padding-inline: var(--g); }
}
@media (max-width: 639px) {
  .marcas { grid-template-columns: minmax(0, 1fr); row-gap: 72px; }
  .marca { grid-column: 1 / -1; }
  .marca .marca__img { aspect-ratio: var(--ar-m); }
  .marca:nth-child(odd) .marca__img { margin-inline: calc(var(--g) * -1); width: calc(100% + 2 * var(--g)); }
  .marca:nth-child(4n+2) { padding-left: 16%; }
  .marca:nth-child(4n)   { padding-right: 16%; }
  .marca__pie { margin-top: 16px; column-gap: 14px; }
}
@media (max-height: 520px) {
  .marcas { row-gap: 56px; }
  .marca .marca__img { max-height: 72svh; }
}

.equipo {
  list-style: none; margin: 0; padding: 0 var(--g) clamp(110px, 12vw, 190px);
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--col); row-gap: 56px;
}
.persona { border-top: 1px solid var(--linea); padding-top: clamp(24px, 2.4vw, 34px); display: grid; grid-template-columns: auto 1fr; column-gap: 20px; align-items: start; }
.persona__mono {
  grid-row: 1 / span 3; width: clamp(64px, 6.4vw, 96px); aspect-ratio: 1; background: var(--arena);
  display: grid; place-items: center; position: relative; overflow: hidden;
}
.persona__mono img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.persona__inicial { font: 300 clamp(17px, 1.5vw, 22px)/1 var(--f-texto); letter-spacing: .2em; padding-left: .2em; color: var(--gris); }
.persona__nombre { margin: 4px 0 8px; font: 500 clamp(14.5px, .8rem + .25vw, 16.5px)/1.3 var(--f-texto); letter-spacing: .16em; text-transform: uppercase; }
.persona__cargo { color: var(--gris); font-size: 14.5px; line-height: 1.5; margin-bottom: 14px; }
.persona__datos { grid-column: 2; }
.persona__datos a {
  display: block; width: fit-content; padding: 8px 0; font-size: 15.5px; text-decoration: none; color: var(--tinta);
  background: linear-gradient(var(--oro), var(--oro)) 0 calc(100% - 5px) / 0 1px no-repeat;
  transition: background-size .6s var(--frenada);
}
.persona__datos a:hover, .persona__datos a:focus-visible { background-size: 100% 1px; }
@media (max-width: 1199px) { .equipo { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 64px; } }
@media (max-width: 639px) {
  .equipo { grid-template-columns: minmax(0, 1fr); row-gap: 40px; }
  .persona__mono { width: 64px; }
}

.persona__foto { position: relative; overflow: hidden; background: var(--arena); aspect-ratio: 4 / 5; }
.persona__foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.equipo--fotos .persona { border-top: 0; padding-top: 0; grid-template-columns: minmax(0, 1fr); }
.equipo--fotos .persona__foto { margin-bottom: clamp(18px, 1.8vw, 26px); }
.equipo--fotos .persona__nombre { margin-top: 0; padding-top: clamp(18px, 1.8vw, 24px); border-top: 1px solid var(--linea); }
.equipo--fotos .persona__datos { grid-column: auto; }
@media (max-width: 639px) {
  .equipo--fotos .persona { border-top: 1px solid var(--linea); padding-top: 24px; grid-template-columns: 38% minmax(0, 1fr); column-gap: 18px; }
  .equipo--fotos .persona__foto { grid-row: 1 / span 3; margin-bottom: 0; }
  .equipo--fotos .persona__nombre { margin-top: 2px; padding-top: 0; border-top: 0; }
  .equipo--fotos .persona__datos { grid-column: 2; }
}

@media (min-width: 900px) {
  .equipo--fotos { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  
  .equipo--fotos .persona { grid-row: span 4; grid-template-rows: subgrid; row-gap: 0; }
}
@media (min-width: 900px) and (min-height: 521px) {
  .pag-cab--equipo { padding-top: calc(var(--cab) + clamp(40px, 5.2vw, 90px)); padding-bottom: clamp(36px, 3.6vw, 60px); }
}

.legal { padding: 0 var(--g) clamp(100px, 11vw, 170px); display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--col); }
.legal__cuerpo { grid-column: 3 / span 7; color: var(--gris); }
.legal__cuerpo h2 { margin: 2.6em 0 .9em; color: var(--tinta); font: 500 12px/1.5 var(--f-texto); letter-spacing: .2em; text-transform: uppercase; }
.legal__cuerpo p, .legal__cuerpo li { font-size: 16px; line-height: 1.75; }
.legal__cuerpo p + p { margin-top: 1em; }
.legal__cuerpo ul { padding-left: 1.1em; margin: 1em 0; }
.legal__cuerpo a { color: var(--tinta); text-underline-offset: 3px; }
.legal__cuerpo .actualizado { margin-top: 3em; font-size: 13px; }
.pag-cab--legal .pag-cab__titulo { font-size: calc(clamp(48px, 7vw, 110px) * var(--d-esc)); }
@media (max-width: 1023px) { .legal__cuerpo { grid-column: 1 / -1; max-width: 40em; } }

@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
  [data-reveal] { opacity: 0; transform: translateY(26px); transition: opacity 1.1s var(--frenada), transform 1.2s var(--frenada); }
  [data-reveal].is-in { opacity: 1; transform: none; }
  [data-reveal].d1 { transition-delay: .1s; }
  [data-reveal].d2 { transition-delay: .2s; }
  [data-reveal].d3 { transition-delay: .3s; }
  [data-reveal="imagen"] { opacity: 1; transform: none; clip-path: inset(100% 0 0 0); transition: clip-path 1.3s var(--barrido); }
  [data-reveal="imagen"] img { transform: scale(1.12); transition: transform 1.9s var(--frenada); }
  [data-reveal="imagen"].is-in { clip-path: inset(0 0 0 0); }
  [data-reveal="imagen"].is-in img { transform: none; }
  .marca__enlace:hover [data-reveal="imagen"].is-in img { transform: scale(1.04); }
}

@media print {
  .cab, .escena__foto, .saltar, .cita__fondo, .sumario__lamina, .climax { display: none !important; }
  .cita, .pie { background: none; color: #000; }
}