
:root{ --rail:112px }
.svin{
  min-height:calc(100svh - var(--nav));
  padding:clamp(60px,12vh,140px) var(--pad) clamp(60px,10vh,120px);
  display:flex;flex-direction:column;justify-content:center;
}
.svin .wrap{width:100%}
.svin h1{margin-top:20px;max-width:15ch}
.svin .lead{margin-top:28px}
.svstack{position:relative;display:block}
.svpanel{
  position:sticky;top:0;
  height:100svh;min-height:560px;
  overflow:hidden;
}
.svpanel-w{background:var(--white)}
.svpanel-o{background:var(--oak)}
.svrow{
  height:100%;
  display:grid;
  grid-template-columns:minmax(0,46fr) minmax(0,54fr);
  transform:scale(calc(1 - (1 - var(--cubre-escala)) * var(--tapa,0)));
  opacity:calc(1 - (1 - var(--cubre-opacidad)) * var(--tapa,0));
  will-change:transform,opacity;
}
.svtext{
  padding:calc(var(--nav) + clamp(30px,5vh,70px)) clamp(28px,3.4vw,64px)
          calc(var(--rail) + clamp(24px,4vh,48px)) var(--pad);
  display:flex;flex-direction:column;justify-content:center;
}
.svrow.sinfoto{grid-template-columns:1fr}
.svrow.sinfoto .svtext{max-width:62ch}
.svkick{
  font-family:var(--u);font-weight:500;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink3);
}
.svname{
  font-family:var(--d);font-weight:500;
  font-size:clamp(34px,5vw,74px);
  letter-spacing:-.028em;line-height:.99;
  margin-top:18px;
}
.svrule{height:2px;max-width:420px;margin-top:22px;background:var(--line)}
.svrule i{display:block;height:100%;background:var(--cognac);
  transform:scaleX(var(--regla,0));transform-origin:left}
.svlede{
  font-size:clamp(16.5px,1.45vw,22px);line-height:1.45;
  color:var(--ink);max-width:30ch;margin-top:24px;
}
.svnote{
  font-size:15px;line-height:1.6;
  color:var(--ink2);max-width:46ch;margin-top:16px;
}
.svwhere{
  margin-top:clamp(22px,3.6vh,40px);padding-top:16px;
  border-top:1px solid var(--line);
  display:flex;gap:clamp(24px,3vw,56px);flex-wrap:wrap;
}
.svwl{font-family:var(--u);font-weight:500;font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ink3)}
.svwv{font-family:var(--d);font-weight:500;font-size:clamp(16px,1.3vw,20px);
  letter-spacing:-.015em;color:var(--ink);margin-top:7px}
.svgo{
  align-self:flex-start;margin-top:clamp(20px,3.2vh,38px);
  font-family:var(--m);font-size:13.5px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink);
  padding-bottom:6px;border-bottom:1px solid var(--ink);
}
.svgo + .svgo{margin-top:clamp(11px,1.5vh,17px)}
.svgo:hover{color:var(--cognac);border-bottom-color:var(--cognac)}
.svgo:focus-visible{outline:2px solid var(--cognac);outline-offset:5px}
.svfoto{position:relative;overflow:hidden;
  display:grid;place-items:center}
.svfoto img{max-width:100%;max-height:100%;width:auto;height:auto;
  display:block}
@media(min-width:861px){
  .svfoto{align-self:start;margin-top:var(--nav);
    height:calc(100svh - var(--nav) - var(--rail));padding:0}
  .svfoto img{width:min(100%, calc((100svh - var(--nav) - var(--rail)) * 1.5));
    max-width:100%;max-height:none;aspect-ratio:3/2;height:auto;
    object-fit:cover;object-position:var(--foco,50% 50%)}
}
@media(max-width:860px){
  .svfoto{padding:0}
  .svfoto img{width:100%;max-height:none;aspect-ratio:3/2;height:auto;
    object-fit:cover;object-position:var(--foco,50% 50%)}
}
.svfoto.pending{background:#EDECEA}
.svrail{
  position:fixed;inset:auto 0 0;z-index:55;
  height:var(--rail);
  background:var(--white);border-top:1px solid var(--line);
  padding:0 var(--pad);
  display:flex;flex-direction:column;justify-content:center;
  opacity:0;transform:translateY(100%);
  transition:opacity .45s var(--e),transform .45s var(--e);
}
.svrail.on{opacity:1;transform:none}
.svhull{width:100%;height:44px;display:block}
.svhull-l{fill:none;stroke:var(--ink3);stroke-width:2}
.svseg{stroke:var(--line);stroke-width:3;stroke-linecap:round}
.svseg-on{stroke:var(--cognac);stroke-width:3;stroke-linecap:round;
  opacity:var(--luz,0)}
.svlabs{display:grid;grid-template-columns:repeat(5,1fr);margin-top:9px}
.svlabs span{
  font-family:var(--u);font-weight:500;font-size:10px;
  letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink3);text-align:center;
  transition:color .4s var(--e);
}
.svlabs span.hot{color:var(--cognac)}
.svend{padding-bottom:calc(var(--sec) + var(--rail))}
@media(max-width:860px){
  :root{ --rail:96px }
  .svpanel{position:relative;height:auto;min-height:0}
  .svrow{grid-template-columns:1fr;transform:none;opacity:1}
  .svtext{padding:clamp(44px,8vh,76px) var(--pad) clamp(30px,5vh,48px)}
  .svfoto{aspect-ratio:4/3}
  .svrule i{transform:scaleX(1)}
  .svlabs span{font-size:9px;letter-spacing:.04em}
  .svin{min-height:0;padding-top:clamp(48px,9vh,90px)}
}
@media(prefers-reduced-motion:reduce){
  .svrow{transform:none;opacity:1}
  .svrule i{transform:scaleX(1)}
  .svrail{transition:none}
  .svlabs span{transition:none}
  .svseg-on{opacity:1}
}
