@charset "utf-8";

/* ================================
   TOUR.CSS — MADOGAIDO
   ================================ */

:root{
  --city-max:1560px;
  --city-pad:clamp(28px, 5vw, 92px);
  --city-gold:var(--gold, #f0c56f);
  --city-gold-2:var(--gold2, #e2b866);
  --city-warm:#f7f1e6;
  --city-muted:rgba(247,241,230,.74);
  --city-dark:#080808;
  --city-panel:rgba(7,7,7,.72);
  --city-line:rgba(240,197,111,.42);
  --city-stage-h:calc(100svh - var(--topbar-h));
  --city-title-gradient:linear-gradient(180deg,#fff6dd 0%,#ffe4a3 34%,#f0c56f 72%,#d5a64d 100%);
  --city-shadow:0 24px 70px rgba(0,0,0,.58);
}

html{
  scroll-padding-top:var(--topbar-h);
}

body.ns-city{
  position:relative;
  padding-top:var(--topbar-h);
  background-color:#0b0b0b;
  background-image:
    linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.18)),
    url("../images/stone.jpg");
  background-size:auto,800px 800px;
  background-position:center top;
  background-repeat:repeat;
}

body.ns-city .ns-wrap{
  width:100%;
  max-width:none;
  margin:0;
  padding:0;
}

body.ns-city .ns-footer{
  margin-top:0;
}

/* =========================================================
   SHARED STAGE SYSTEM
   ========================================================= */

.ns-citystage{
  position:relative;
  isolation:isolate;
  width:100%;
  min-height:var(--city-stage-h);
  overflow:hidden;
  scroll-margin-top:var(--topbar-h);
  border-bottom:1px solid rgba(240,197,111,.18);
  background:
    radial-gradient(1000px 520px at 50% 12%,rgba(240,197,111,.055),transparent 70%),
    linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.26)),
    url("../images/stone.jpg") center/800px 800px repeat,
    #0b0b0b;
}

.ns-citystage::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-4;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,0,0,.56) 0%,transparent 22%,transparent 78%,rgba(0,0,0,.36) 100%),
    linear-gradient(180deg,rgba(0,0,0,.02) 0%,rgba(0,0,0,.18) 100%);
}

.ns-citystage__inner{
  position:relative;
  z-index:4;
  width:min(var(--city-max),calc(100% - (2 * var(--city-pad))));
  min-height:var(--city-stage-h);
  margin:0 auto;
  padding:clamp(54px,6.5vh,86px) 0 clamp(96px,11vh,130px);
}

.ns-citystage__media{
  position:absolute;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
}

.ns-citystage__media img,
.ns-citymoment__media img,
.ns-cityexperience__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.ns-citystage__media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.12) 55%,rgba(0,0,0,.40)),
    radial-gradient(circle at 50% 50%,transparent 45%,rgba(0,0,0,.16) 100%);
}

.ns-citystage__shade{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
}

.ns-citystage__next{
  position:absolute;
  left:50%;
  bottom:18px;
  z-index:12;
  display:grid;
  grid-template-columns:auto auto 12px;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-width:240px;
  min-height:42px;
  padding:8px 18px;
  transform:translateX(-50%);
  border:1px solid rgba(240,197,111,.52);
  border-radius:999px;
  background:
    radial-gradient(180px 58px at 50% 0%,rgba(240,197,111,.08),transparent 72%),
    linear-gradient(180deg,rgba(16,16,16,.96),rgba(4,4,4,.96));
  box-shadow:0 12px 30px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.04);
  color:var(--city-warm);
  transition:transform .3s cubic-bezier(.22,.61,.36,1),border-color .3s,box-shadow .3s;
}

.ns-citystage__next-count{
  font-family:var(--font-brand);
  font-size:10px;
  font-weight:700;
  letter-spacing:.14em;
  color:var(--city-gold);
  white-space:nowrap;
}

.ns-citystage__next-label{
  overflow:hidden;
  font-family:var(--font-display);
  font-size:14px;
  font-weight:700;
  letter-spacing:var(--cg-track-050,.05em);
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ns-citystage__next-chevron{
  width:8px;
  height:8px;
  border-right:1.5px solid var(--city-gold);
  border-bottom:1.5px solid var(--city-gold);
  transform:translateY(-2px) rotate(45deg);
}

.ns-citystage__next--last{
  grid-template-columns:auto auto;
  pointer-events:none;
}

.ns-city-title,
.ns-cityhero-l4__title,
.ns-citymoment h3,
.ns-cityexperience__step h3{
  background:var(--city-title-gradient);
  background-size:100% 1lh;
  background-position:0 0;
  background-repeat:repeat-y;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.ns-city-title{
  margin:0;
  font-family:var(--font-display-primary);
  font-size:clamp(42px,4.25vw,70px);
  font-weight:700;
  line-height:1.18;
  letter-spacing:var(--cg-track-020,.02em);
  filter:drop-shadow(0 4px 10px rgba(0,0,0,.60));
}

.ns-city-sectionmark__eyebrow{
  font-family:var(--font-display);
  font-weight:700;
  letter-spacing:.16em;
}

.ns-city-intro,
.ns-cityhero-l4__lead{
  color:rgba(255,255,255,.88);
  text-shadow:0 2px 8px rgba(0,0,0,.62);
}

.ns-city-intro{
  margin-top:24px;
  max-width:760px;
  font-size:clamp(15px,1.08vw,18px);
  line-height:1.92;
  letter-spacing:.02em;
}

.ns-city-sectionmark{
  position:relative;
  min-height:94px;
  margin-bottom:14px;
}

.ns-city-sectionmark__ghost{
  position:absolute;
  left:-34px;
  top:-44px;
  z-index:-1;
  font-family:var(--font-display-primary);
  font-size:clamp(120px,10vw,182px);
  font-weight:400;
  line-height:1;
  color:rgba(240,197,111,.075);
  user-select:none;
}

.ns-city-sectionmark__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:16px;
  padding-top:26px;
  font-size:12px;
  color:rgba(240,197,111,.88);
}

.ns-city-sectionmark__eyebrow::after{
  content:"";
  width:76px;
  height:1px;
  background:linear-gradient(90deg,rgba(240,197,111,.78),transparent);
}

.ns-city-sectionmark--compact{
  min-height:0;
  margin-bottom:26px;
}

.ns-city-sectionmark--compact .ns-city-sectionmark__eyebrow{
  padding-top:0;
}

.ns-city-sectionmark__index{
  display:block;
  margin-bottom:12px;
  font-family:var(--font-display-primary);
  font-size:31px;
  color:var(--city-gold);
}

/* =========================================================
   BUTTON
   ========================================================= */

.ns-cityfinal .ns-rcta__ctas{
  justify-self:start;
  margin-top:34px;
  margin-left:0;
  margin-right:auto;
}

.ns-cityfinal .ns-rcta__btn{
  position:relative;
  z-index:1;
  overflow:hidden;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  width:min(100%,440px);
  min-width:0;
  min-height:70px;

  margin:0;
  padding:15px 30px;

  font-family:var(--font-brand);
  font-size:clamp(15px,1.1vw,19px);
  font-style:normal;
  font-weight:700;
  line-height:1.2;
  letter-spacing:.04em;
  text-align:center;
  white-space:nowrap;

  color:#101010;
  text-shadow:none;

  border:1px solid transparent;
  border-radius:999px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.52) 0%,
      rgba(255,255,255,.19) 24%,
      rgba(255,255,255,0) 48%
    ) padding-box,
    linear-gradient(
      180deg,
      #f9e8aa 0%,
      #f1cd74 30%,
      #dcaa4a 64%,
      #ad7224 100%
    ) padding-box,
    linear-gradient(
      180deg,
      #fff8df 0%,
      #f0c56f 52%,
      #9b641c 100%
    ) border-box;

  box-shadow:
    0 18px 34px rgba(0,0,0,.56),
    inset 0 1px 0 rgba(255,255,255,.48),
    inset 0 -10px 18px rgba(91,50,8,.20),
    inset 0 0 0 rgba(255,239,194,0);

  transition:
    transform var(--transition-med),
    box-shadow var(--transition-med),
    filter var(--transition-med);

  will-change:box-shadow;
  animation:nsRctaButtonPulse 4s ease-in-out infinite;
}

.ns-cityfinal .ns-rcta__btn:hover,
.ns-cityfinal .ns-rcta__btn:focus-visible{
  transform:translateY(-2px);
  filter:brightness(1.025);

  box-shadow:
    0 0 0 1px rgba(255,244,214,.18),
    0 0 22px rgba(240,197,111,.30),
    0 0 46px rgba(240,197,111,.36),
    0 0 78px rgba(240,197,111,.20),
    0 20px 38px rgba(0,0,0,.60),
    inset 0 1px 0 rgba(255,255,255,.56),
    inset 0 -10px 18px rgba(91,50,8,.22);
}

.ns-cityfinal .ns-rcta__btn:active{
  transform:translateY(0);
}

@media (max-width:1100px){
  .ns-cityfinal .ns-rcta__btn{
    min-height:64px;
    padding-inline:22px;
    font-size:15px;
  }
}

/* =============
   HERO
   ============= */

.ns-citystage--hero{
  min-height:max(720px,var(--city-stage-h));
  border-bottom:0;
  background:transparent;
}

.ns-citystage--hero::before{
  content:none;
}

.ns-citystage__visual--hero{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(
    180deg,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,1) 70%,
    rgba(0,0,0,.98) 76%,
    rgba(0,0,0,.88) 82%,
    rgba(0,0,0,.66) 88%,
    rgba(0,0,0,.40) 93%,
    rgba(0,0,0,.16) 97%,
    rgba(0,0,0,0) 100%
  );
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-image:linear-gradient(
    180deg,
    rgba(0,0,0,1) 0%,
    rgba(0,0,0,1) 70%,
    rgba(0,0,0,.98) 76%,
    rgba(0,0,0,.88) 82%,
    rgba(0,0,0,.66) 88%,
    rgba(0,0,0,.40) 93%,
    rgba(0,0,0,.16) 97%,
    rgba(0,0,0,0) 100%
  );
  mask-repeat:no-repeat;
  mask-size:100% 100%;
}

.ns-citystage__media--hero{
  inset:0;
  -webkit-mask-image:none;
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-image:none;
  mask-repeat:no-repeat;
  mask-size:100% 100%;
}

.ns-citystage__media--hero img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 20%;
}

/* TABLET — HERO SIN RECORTE HORIZONTAL */
@media (min-width:768px) and (max-width:1179.98px),
       (min-width:768px) and (orientation:portrait){
  body.ns-city .ns-citystage__media--hero{
    inset:0 0 auto 0;
    height:auto;
    -webkit-mask-image:linear-gradient(
      to bottom,
      #000 0%,
      #000 70%,
      transparent 100%
    );
    mask-image:linear-gradient(
      to bottom,
      #000 0%,
      #000 70%,
      transparent 100%
    );
  }

  body.ns-city .ns-citystage__media--hero picture{
    display:block;
    width:100% !important;
    height:auto !important;
  }

  body.ns-city .ns-citystage__media--hero img{
    display:block;
    width:100%;
    height:auto;
    object-fit:contain;
    object-position:center top;
  }

  /* Altura natural del HERO: 16:9 + espacio para copy y ratón. */
  body.ns-city .ns-citystage--hero{
    min-height:max(720px, calc(56.25vw + var(--space-8))) !important;
  }

  body.ns-city .ns-cityhero-l4{
    min-height:max(720px, calc(56.25vw + var(--space-8)));
    align-items:flex-end;
    padding-top:0;
    padding-bottom:var(--space-6);
  }

  body.ns-city .ns-cityhero-l4__copy{
    transform:none;
  }
}

.ns-citystage--hero .ns-citystage__shade{
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.20) 0%,
      rgba(0,0,0,.16) 56%,
      rgba(0,0,0,.42) 100%
    );
}
.ns-cityhero-l4{
  display:flex;
  align-items:center;
}

@media (min-width:1180px){
  .ns-cityhero-l4{
    width:min(1840px,calc(100% - max(var(--city-pad),calc((100% - var(--city-max)) / 2)) - 24px));
    margin-left:max(var(--city-pad),calc((100% - var(--city-max)) / 2));
    margin-right:24px;
  }
}

.ns-cityhero-l4__copy{
  width:min(960px,62%);
  padding-bottom:28px;
  transform:translateY(clamp(180px,20vh,240px));
  filter:
    drop-shadow(0 10px 24px rgba(0,0,0,.28))
    drop-shadow(0 18px 40px rgba(0,0,0,.18));
}

.ns-cityhero-l4__title{
  position:relative;
  top:24px;
  margin:0;
  font-family:var(--font-display-primary);
  font-size:clamp(54px,4.8vw,84px);
  font-weight:700;
  line-height:1.17;
  letter-spacing:var(--cg-track-010,.01em);
  filter:
    drop-shadow(0 2px 2px rgba(0,0,0,.90))
    drop-shadow(0 8px 18px rgba(0,0,0,.72));
}

.ns-cityhero-l4__title-row{
  position:relative;
  top:24px;
  display:inline-flex;
  align-items:center;
  flex-wrap:nowrap;
  width:max-content;
  max-width:none;
  gap:clamp(20px,1.7vw,30px);
}

.ns-cityhero-l4__meta{
  display:contents;
}

.ns-cityhero-l4__title-row .ns-cityhero-l4__title{
  top:0;
  flex:0 0 auto;
  line-height:1.2;
}

.ns-cityhero-l4__lead{
  margin-top:54px;
  max-width:960px;
  font-family:"Shippori Mincho",serif;
  font-size:clamp(21px,1.55vw,27px);
  font-weight:500;
  line-height:1.9;
  letter-spacing:.025em;
  text-shadow:
    0 2px 2px rgba(0,0,0,.92),
    0 6px 16px rgba(0,0,0,.72);
}

.ns-cityhero-l4__coords{
  position:absolute;
  left:0;
  bottom:calc(100% + 14px);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  flex:0 0 auto;
  width:max-content;
  margin:0;
  padding:5px 12px 6px;
  border:1px solid rgba(240,197,111,.88);
  border-radius:999px;
  background:rgba(5,9,14,.38);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 5px 16px rgba(0,0,0,.24);
  white-space:nowrap;
  transform:none;
}

.ns-cityhero-l4__coords-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:12px;
  height:12px;
  flex:0 0 12px;
}

.ns-cityhero-l4__coords-icon svg{
  display:block;
  width:100%;
  height:100%;
  fill:var(--gold2);
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.60));
}

.ns-cityhero-l4__coords-value{
  display:inline-block;
  font-family:var(--font-brand);
  font-size:clamp(11px,.64vw,13px);
  font-weight:600;
  line-height:1;
  letter-spacing:.11em;
  background:var(--city-title-gradient);
  background-size:100% 1lh;
  background-position:0 0;
  background-repeat:repeat-y;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:
    drop-shadow(0 1px 1px rgba(0,0,0,.88))
    drop-shadow(0 2px 5px rgba(0,0,0,.55));
}

body.ns-city .ns-cityhero-l4__copy .ns-home-scroll-bridge{
  position:relative;
  left:0;
  top:auto;
  bottom:auto;
  width:min(620px,100%);
  margin:34px 0 0;
  transform:none;
}

/* =============
   MOMENTS
   ============= */

.ns-citystage--moments{
  position:relative;
  z-index:2;
  height:var(--city-stage-h);
  min-height:720px;
  margin-top:clamp(120px,14vh,200px);
  margin-bottom:clamp(140px,16vh,220px);
  padding:0;
  overflow:visible;
  touch-action:pan-y;
  border-bottom:0;
  background:transparent;
}

/* TABLET — MOMENTS mantiene su altura de carrusel completo. */
@media (min-width:768px) and (max-width:1179.98px),
       (min-width:768px) and (orientation:portrait){
  body.ns-city .ns-citystage--moments{
    height:var(--city-stage-h);
    min-height:max(720px, var(--city-stage-h));
    margin-top:var(--space-5);
  }
}

.ns-citystage--moments::before{
  content:none;
}

.ns-citymoments{
  --city-moments-stage-height:var(--city-stage-h);
  --city-moments-carousel-duration:7s;
  --city-moments-carousel-fade:2.6s;
  --city-moments-image-duration:9s;
  --city-moments-image-scale-start:1.02;
  --city-moments-image-scale-end:1.095;
  --city-moments-image-x-start:-.45%;
  --city-moments-image-x-end:.45%;
  --city-moments-image-y-start:.25%;
  --city-moments-image-y-end:-.25%;
  --city-moments-edge-mask:linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.10) 3%,
    rgba(255,255,255,.30) 7%,
    rgba(255,255,255,.58) 11%,
    rgba(255,255,255,.82) 15%,
    rgba(255,255,255,.96) 19%,
    rgba(255,255,255,1) 22%,
    rgba(255,255,255,1) 80%,
    rgba(255,255,255,.94) 84%,
    rgba(255,255,255,.78) 88%,
    rgba(255,255,255,.52) 92%,
    rgba(255,255,255,.22) 96%,
    rgba(255,255,255,0) 100%
  );
  position:relative;
  width:100%;
  height:100%;
}

.ns-citymoments__sticky{
  position:relative;
  top:auto;
  isolation:isolate;
  width:100%;
  height:100%;
  min-height:inherit;
  overflow:visible;
  background:transparent;
  box-shadow:none;
}

.ns-citymoments__sticky::before,
.ns-citymoments__sticky::after{
  content:none;
}

.ns-citymoments__opening,
.ns-citymoment-scene{
  position:absolute;
  inset:0;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  transition:
    opacity var(--city-moments-carousel-fade) cubic-bezier(.45,0,.55,1),
    visibility 0s linear var(--city-moments-carousel-fade);
  will-change:opacity;
}

.ns-citymoments__opening{
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(42px,6vw,92px);
}

.ns-citymoment-scene{
  z-index:1;
  overflow:visible;
}

.ns-citymoments__opening._is-active,
.ns-citymoment-scene._is-active{
  z-index:4;
  visibility:visible;
  opacity:1;
  transition:
    opacity var(--city-moments-carousel-fade) cubic-bezier(.45,0,.55,1),
    visibility 0s linear 0s;
}

.ns-citymoments:not(._is-ready) .ns-citymoments__opening{
  z-index:4;
  visibility:visible;
  opacity:1;
}

.ns-citymoments__opening._is-user-skipped{
  z-index:0;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  transition:none;
}

.ns-citymoments__opening::before{
  content:"";
  position:absolute;
  top:4%;
  right:0;
  bottom:4%;
  left:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(
      180deg,
      rgba(0,0,0,.06) 0%,
      rgba(0,0,0,.03) 26%,
      rgba(0,0,0,.06) 56%,
      rgba(0,0,0,.16) 100%
    );
  -webkit-mask-image:var(--city-moments-edge-mask);
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-image:var(--city-moments-edge-mask);
  mask-repeat:no-repeat;
  mask-size:100% 100%;
}

.ns-citymoments__opening-media,
.ns-citymoment-scene__media{
  position:absolute;
  top:4%;
  right:0;
  bottom:4%;
  left:0;
  z-index:0;
  overflow:hidden;
  -webkit-mask-image:var(--city-moments-edge-mask);
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-image:var(--city-moments-edge-mask);
  mask-repeat:no-repeat;
  mask-size:100% 100%;
}

.ns-citymoments__opening-media{
  box-shadow:
    inset 0 64px 140px rgba(0,0,0,.06),
    inset 0 -170px 240px rgba(0,0,0,.16);
}

.ns-citymoment-scene__media{
  box-shadow:
    inset 0 54px 120px rgba(0,0,0,.05),
    inset 0 -150px 220px rgba(0,0,0,.14);
}

.ns-citymoments__opening-media img,
.ns-citymoment-scene__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transform:
    scale(var(--city-moments-image-scale-start))
    translate3d(
      var(--city-moments-image-x-start),
      var(--city-moments-image-y-start),
      0
    );
  transform-origin:center center;
  animation:
    nsCityMomentImageBreathe
    var(--city-moments-image-duration)
    linear
    infinite
    alternate;
  animation-play-state:paused;
  will-change:transform;
}

.ns-citymoments__opening._is-active .ns-citymoments__opening-media img,
.ns-citymoment-scene._is-active .ns-citymoment-scene__media img{
  animation-play-state:running;
}

.ns-citymoments__opening-media img,
.ns-citymoment-scene--02 .ns-citymoment-scene__media img{
  animation-direction:alternate-reverse;
}

@keyframes nsCityMomentImageBreathe{
  from{
    transform:
      scale(var(--city-moments-image-scale-start))
      translate3d(
        var(--city-moments-image-x-start),
        var(--city-moments-image-y-start),
        0
      );
  }

  to{
    transform:
      scale(var(--city-moments-image-scale-end))
      translate3d(
        var(--city-moments-image-x-end),
        var(--city-moments-image-y-end),
        0
      );
  }
}

.ns-citymoments__opening-media img{
  object-position:center 48%;
  filter:saturate(.98) contrast(1.03) brightness(.90);
}

.ns-citymoment-scene__media img{
  filter:none;
}

.ns-citymoment-scene--01 .ns-citymoment-scene__media img{
  object-position:center 48%;
}

.ns-citymoment-scene--02 .ns-citymoment-scene__media img{
  object-position:center 50%;
}

.ns-citymoment-scene--03 .ns-citymoment-scene__media img{
  object-position:center 52%;
}

.ns-citymoment-scene__shade{
  display:none;
}

.ns-citymoments__opening-copy{
  position:relative;
  z-index:2;
  width:min(980px,82vw);
  margin:0 auto;
  text-align:center;
  opacity:0;
  transform:translate3d(0,22px,0);
  filter:
    drop-shadow(0 8px 18px rgba(0,0,0,.38))
    drop-shadow(0 18px 38px rgba(0,0,0,.24));
  transition:
    opacity .82s cubic-bezier(.22,.61,.36,1) .22s,
    transform 1.02s cubic-bezier(.22,.61,.36,1) .22s;
}

.ns-citymoments__opening._is-active .ns-citymoments__opening-copy,
.ns-citymoments:not(._is-ready) .ns-citymoments__opening-copy{
  opacity:1;
  transform:translate3d(0,0,0);
}

.ns-citymoments__title{
  margin:0;
  padding:0 0 .12em;
  overflow:visible;
  font-family:var(--font-display);
  font-size:clamp(42px,4.25vw,70px);
  font-weight:700;
  line-height:1.28;
  letter-spacing:var(--cg-track-040,.04em);
  text-wrap:balance;
  background:var(--gold-gradient-text);
  background-size:100% 1lh;
  background-position:0 0;
  background-repeat:repeat-y;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.68))
    drop-shadow(0 18px 34px rgba(0,0,0,.62));
}

.ns-citymoments__lead{
  width:min(1050px,100%);
  margin:28px auto 0;
  font-family:var(--font-display);
  font-size:clamp(22px,1.60vw,28px);
  font-weight:600;
  line-height:1.92;
  letter-spacing:var(--cg-track-025,.025em);
  color:#fff;
  text-shadow:
    0 2px 3px rgba(0,0,0,.92),
    0 8px 18px rgba(0,0,0,.72);
}

.ns-citymoments__nowrap{
  white-space:nowrap;
}

.ns-citymoments__meta{
  position:absolute;
  left:50%;
  right:auto;
  top:auto;
  bottom:calc(96px + env(safe-area-inset-bottom));
  z-index:12;
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  opacity:1;
  transform:translate3d(-50%,0,0);
  pointer-events:none;
  transition:
    opacity .55s cubic-bezier(.22,.61,.36,1),
    transform .7s cubic-bezier(.22,.61,.36,1);
}

.ns-citymoments__meta._is-visible{
  opacity:1;
  transform:translate3d(-50%,0,0);
}

.ns-citymoments__rail{
  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:clamp(12px,1.8vw,26px);
  pointer-events:auto;
}

.ns-citymoments__rail-mark{
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:none;
  box-shadow:none;
  color:rgba(255,255,255,.88);
  font-family:var(--font-brand);
  font-size:clamp(16px,1.3vw,20px);
  font-weight:700;
  line-height:1;
  letter-spacing:.10em;
  text-shadow:
    0 1px 2px rgba(0,0,0,1),
    0 3px 8px rgba(0,0,0,.96);
  cursor:pointer;
  transition:
    color .32s cubic-bezier(.22,.61,.36,1),
    transform .32s cubic-bezier(.22,.61,.36,1);
}

.ns-citymoments__rail-mark._is-past{
  background:none;
  color:rgba(255,255,255,.82);
}

.ns-citymoments__rail-mark._is-active{
  height:44px;
  background:none;
  color:#f7d783;
  transform:scale(1.20);
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.98));
}

.ns-citymoment-scene__inner{
  position:relative;
  z-index:2;
  width:min(1780px,calc(100% - (2 * clamp(36px,5vw,96px))));
  height:100%;
  margin:0 auto;
}

.ns-citymoment-scene__copy{
  position:absolute;
  z-index:2;
  left:0;
  right:auto;
  bottom:clamp(166px,19vh,210px);
  width:min(1180px,68vw);
  text-align:left;
  opacity:0;
  transform:translate3d(0,24px,0);
  filter:
    drop-shadow(0 10px 22px rgba(0,0,0,.42))
    drop-shadow(0 20px 44px rgba(0,0,0,.26));
  transition:
    opacity .78s cubic-bezier(.22,.61,.36,1) .20s,
    transform 1s cubic-bezier(.22,.61,.36,1) .20s;
  will-change:opacity,transform;
}

.ns-citymoment-scene._is-active .ns-citymoment-scene__copy{
  opacity:1;
  transform:translate3d(0,0,0);
}

.ns-citymoment-scene:nth-of-type(even) .ns-citymoment-scene__copy{
  left:auto;
  right:0;
  top:clamp(170px,21vh,230px);
  bottom:auto;
  text-align:right;
}

.ns-citymoment-scene--03 .ns-citymoment-scene__copy{
  left:clamp(0px,3vw,54px);
  right:auto;
  top:clamp(210px,29vh,300px);
  bottom:auto;
  text-align:left;
}

.ns-citymoment-scene__heading{
  position:relative;
  z-index:2;
  width:max-content;
  max-width:100%;
}

.ns-citymoment-scene:nth-of-type(even) .ns-citymoment-scene__heading{
  margin-left:auto;
}

.ns-citymoment-scene__number{
  position:absolute;
  left:-.10em;
  right:auto;
  bottom:-.03em;
  z-index:0;
  display:block;
  margin:0;
  padding:0 .06em .08em;
  overflow:visible;
  font-family:"Shippori Mincho",serif;
  font-size:clamp(132px,13vw,238px);
  font-weight:400;
  line-height:.92;
  letter-spacing:-.045em;
  background:linear-gradient(
    180deg,
    #fff4d6 0%,
    #ffe8b0 26%,
    #f0c56f 60%,
    #d6a64c 100%
  );
  background-size:100% 100%;
  background-position:0 0;
  background-repeat:no-repeat;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  opacity:.42;
  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.58))
    drop-shadow(0 12px 26px rgba(0,0,0,.42));
  transform:translate3d(6px,0,0);
  user-select:none;
}

.ns-citymoment-scene:nth-of-type(even) .ns-citymoment-scene__number{
  left:auto;
  right:-.10em;
  transform:translate3d(-6px,0,0);
}

.ns-citymoment-scene._is-active .ns-citymoment-scene__number{
  animation:nsCityMomentNumberDriftLeft 8s ease-in-out infinite alternate;
}

.ns-citymoment-scene:nth-of-type(even)._is-active .ns-citymoment-scene__number{
  animation-name:nsCityMomentNumberDriftRight;
}

@keyframes nsCityMomentNumberDriftLeft{
  from{
    transform:translate3d(-6px,0,0);
  }

  to{
    transform:translate3d(6px,0,0);
  }
}

@keyframes nsCityMomentNumberDriftRight{
  from{
    transform:translate3d(6px,0,0);
  }

  to{
    transform:translate3d(-6px,0,0);
  }
}

.ns-citymoment-scene__title{
  position:relative;
  z-index:2;
  margin:0;
  padding:0 0 .10em;
  overflow:visible;
  font-family:var(--font-display);
  font-size:clamp(38px,3.3vw,58px);
  font-weight:700;
  line-height:1.30;
  letter-spacing:var(--cg-track-040,.04em);
  text-wrap:balance;
  background:var(--gold-gradient-text);
  background-size:100% 1lh;
  background-position:0 0;
  background-repeat:repeat-y;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.64))
    drop-shadow(0 14px 28px rgba(0,0,0,.56));
}

.ns-citymoment-scene__text{
  position:relative;
  z-index:2;
  width:100%;
  max-width:920px;
  margin:22px 0 0;
  font-family:var(--font-display);
  font-size:clamp(22px,1.60vw,28px);
  font-weight:600;
  line-height:1.92;
  letter-spacing:var(--cg-track-025,.025em);
  color:#fff;
  text-shadow:
    0 2px 3px rgba(0,0,0,.94),
    0 8px 20px rgba(0,0,0,.74);
}

.ns-citymoment-scene:nth-of-type(even) .ns-citymoment-scene__text{
  margin-left:auto;
}

.ns-citymoment-scene--01 .ns-citymoment-scene__text::after{
  content:"";
  display:inline-block;
  width:clamp(24px,2.1vw,32px);
  height:clamp(24px,2.1vw,32px);
  margin-left:clamp(9px,1vw,14px);
  vertical-align:middle;
  background:url("../images/icons/stamp_scallop.png") center / contain no-repeat;
  transform:translateY(5px) rotate(-2deg);
}

@media (min-width:768px) and (max-width:1179.98px){
  .ns-citysignatures__eyebrow{
    font-size:clamp(38px,5.2vw,58px);
    line-height:1.28;
  }

  .ns-citystage--moments{
    min-height:680px;
    margin-top:100px;
    margin-bottom:150px;
  }

  .ns-citymoments__opening-copy{
    width:min(820px,82vw);
    filter:
      drop-shadow(0 10px 24px rgba(0,0,0,.48))
      drop-shadow(0 22px 48px rgba(0,0,0,.30));
  }

  .ns-citymoments__title{
    font-size:clamp(42px,4.25vw,70px);
  }

  .ns-citymoments__lead{
    font-size:clamp(21px,2.55vw,26px);
  }

  .ns-citymoment-scene__inner{
    width:calc(100% - 72px);
  }

  .ns-citymoment-scene__copy{
    width:min(780px,68vw);
    filter:
      drop-shadow(0 12px 26px rgba(0,0,0,.52))
      drop-shadow(0 24px 52px rgba(0,0,0,.32));
  }

  .ns-citymoment-scene__title{
    font-size:clamp(34px,4.2vw,48px);
  }

  .ns-citymoment-scene__text{
    font-size:clamp(18px,2.15vw,22px);
  }

  .ns-citymoment-scene__number{
    font-size:clamp(124px,17vw,198px);
  }

}

@media (max-width:767.98px){
  .ns-citystage.ns-citystage--moments{
    height:calc(100svh - var(--topbar-h));
    min-height:620px !important;
    margin-top:48px;
    margin-bottom:72px;
    overflow:visible;
  }

  .ns-citymoments{
    --city-moments-carousel-duration:7s;
    --city-moments-carousel-fade:2.4s;
    --city-moments-image-duration:8.5s;
    --city-moments-image-scale-start:1.035;
    --city-moments-image-scale-end:1.14;
    --city-moments-image-x-start:-.9%;
    --city-moments-image-x-end:.9%;
    --city-moments-image-y-start:.45%;
    --city-moments-image-y-end:-.45%;
  }

  .ns-citymoments__opening{
    align-items:flex-start;
    padding:clamp(112px,17vh,144px) 20px 0;
  }

  .ns-citymoments__opening-copy{
    width:min(100%,560px);
    filter:
      drop-shadow(0 12px 28px rgba(0,0,0,.58))
      drop-shadow(0 24px 56px rgba(0,0,0,.38));
  }

  .ns-citymoments__title{
    font-size:clamp(36px,10vw,46px);
    line-height:1.22;
  }

  .ns-citymoments__lead{
    margin-top:18px;
    font-size:clamp(15.5px,4.15vw,18px);
    font-weight:500;
    line-height:1.70;
    letter-spacing:.015em;
  }

  .ns-citymoments__lead br,
  .ns-citymoment-scene__text br{
    display:none;
  }

  .ns-citymoments__opening::before,
  .ns-citymoments__opening-media,
  .ns-citymoment-scene__media{
    top:3%;
    right:0;
    bottom:3%;
    left:0;
  }

  .ns-citymoments__opening::before{
    background:linear-gradient(
      180deg,
      rgba(0,0,0,.08) 0%,
      rgba(0,0,0,.04) 38%,
      rgba(0,0,0,.30) 68%,
      rgba(0,0,0,.72) 100%
    );
  }

  .ns-citymoment-scene__shade{
    position:absolute;
    top:3%;
    right:0;
    bottom:3%;
    left:0;
    z-index:1;
    display:block;
    pointer-events:none;
    background:linear-gradient(
      180deg,
      rgba(0,0,0,.04) 0%,
      rgba(0,0,0,.02) 42%,
      rgba(0,0,0,.34) 70%,
      rgba(0,0,0,.74) 100%
    );
    -webkit-mask-image:var(--city-moments-edge-mask);
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-size:100% 100%;
    mask-image:var(--city-moments-edge-mask);
    mask-repeat:no-repeat;
    mask-size:100% 100%;
  }

  .ns-citymoments__meta{
    left:50%;
    right:auto;
    top:auto;
    bottom:calc(70px + env(safe-area-inset-bottom));
    flex-direction:row;
    align-items:center;
    justify-content:center;
    transform:translate3d(-50%,0,0);
  }

  .ns-citymoments__meta._is-visible{
    transform:translate3d(-50%,0,0);
  }

  .ns-citymoments__rail{
    flex-direction:row;
    gap:10px;
  }

  .ns-citymoments__rail-mark{
    width:40px;
    height:40px;
    background:none;
    font-size:15px;
  }

  .ns-citymoments__rail-mark._is-past{
    background:none;
  }

  .ns-citymoments__rail-mark._is-active{
    width:40px;
    height:40px;
    background:none;
  }

  .ns-citymoment-scene__inner{
    width:calc(100% - 36px);
  }

  .ns-citymoment-scene__copy,
  .ns-citymoment-scene:nth-of-type(even) .ns-citymoment-scene__copy,
  .ns-citymoment-scene--03 .ns-citymoment-scene__copy{
    left:0;
    right:0;
    top:clamp(112px,17vh,144px);
    bottom:auto;
    width:100%;
    margin:0 auto;
    text-align:center;
    filter:
      drop-shadow(0 12px 30px rgba(0,0,0,.62))
      drop-shadow(0 26px 60px rgba(0,0,0,.40));
  }

  .ns-citymoment-scene__heading,
  .ns-citymoment-scene:nth-of-type(even) .ns-citymoment-scene__heading{
    position:static;
    width:max-content;
    max-width:100%;
    margin-left:auto;
    margin-right:auto;
  }

  .ns-citymoment-scene__number,
  .ns-citymoment-scene:nth-of-type(even) .ns-citymoment-scene__number,
  .ns-citymoment-scene--03 .ns-citymoment-scene__number{
    left:50%;
    right:auto;
    top:-.465em;
    bottom:auto;
    font-size:clamp(84px,25vw,120px);
    opacity:.40;
    transform:translate3d(calc(-50% + 6px),0,0);
  }

  .ns-citymoment-scene._is-active .ns-citymoment-scene__number,
  .ns-citymoment-scene:nth-of-type(even)._is-active .ns-citymoment-scene__number{
    animation-name:nsCityMomentNumberDriftMobile;
  }

  @keyframes nsCityMomentNumberDriftMobile{
    from{
      transform:translate3d(calc(-50% - 6px),0,0);
    }

    to{
      transform:translate3d(calc(-50% + 6px),0,0);
    }
  }

  .ns-citymoment-scene__title{
    font-size:clamp(28px,8vw,36px);
    line-height:1.26;
  }

  .ns-citymoment-scene__text,
  .ns-citymoment-scene:nth-of-type(even) .ns-citymoment-scene__text{
    width:100%;
    max-width:620px;
    margin:16px auto 0;
    font-size:clamp(15.5px,4.1vw,18px);
    font-weight:500;
    line-height:1.72;
    letter-spacing:.015em;
    text-align:center;
  }
}

@media (prefers-reduced-motion:reduce){
  .ns-citymoments__opening,
  .ns-citymoment-scene,
  .ns-citymoments__opening-copy,
  .ns-citymoment-scene__copy,
  .ns-citymoments__opening-media img,
  .ns-citymoment-scene__media img,
  .ns-citymoment-scene__number{
    transition:none !important;
    animation:none !important;
  }
}


/* =============
   SIGNATURES — PANORAMIC EDITORIAL INDEX
   ============= */

.ns-citystage--signatures{
  min-height:auto;
  margin-top:clamp(150px,18vh,230px);
  margin-bottom:clamp(160px,19vh,240px);
  overflow:visible;
  border-bottom:0;
  background:transparent;
}

.ns-citystage--signatures::before{
  content:none;
}

.ns-citysignatures{
  position:relative;
  width:100%;
  min-height:0;
  margin:0 auto;
  padding:0 0 clamp(18px,2.2vh,28px);
  overflow:visible;
}

.ns-citysignatures__media{
  position:relative;
  width:100%;
  height:clamp(420px,57svh,680px);
  overflow:hidden;
  isolation:isolate;
  border-top:1.5px solid var(--gold2);
  background:#070707;
  box-shadow:
    0 34px 72px rgba(0,0,0,.36),
    inset 0 -1px 0 rgba(240,197,111,.22);
}

.ns-citysignatures__media::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:5;
  height:1px;
  pointer-events:none;
  background:var(--gold2);
  opacity:1;
}

.ns-citysignatures__media::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.03) 0%,rgba(0,0,0,.015) 56%,rgba(0,0,0,.18) 100%),
    linear-gradient(90deg,rgba(0,0,0,.12) 0%,transparent 22%,transparent 78%,rgba(0,0,0,.12) 100%);
}

.ns-citysignatures__panel{
  position:absolute;
  inset:0;
  z-index:1;
  margin:0;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  transform:scale(1.025);
  transition:
    opacity 1s cubic-bezier(.22,.61,.36,1),
    transform 1.35s cubic-bezier(.22,.61,.36,1),
    visibility 0s linear 1s;
}

.ns-citysignatures__panel._is-active{
  z-index:2;
  visibility:visible;
  opacity:1;
  pointer-events:auto;
  transform:scale(1);
  transition:
    opacity 1s cubic-bezier(.22,.61,.36,1),
    transform 1.35s cubic-bezier(.22,.61,.36,1),
    visibility 0s linear 0s;
}

.ns-citysignatures__panel img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

/* Las obras del Prado comparten el encuadre centrado hasta ajustar sus imágenes finales. */

.ns-citysignatures__content{
  position:relative;
  width:min(1560px,calc(100% - (2 * clamp(28px,5vw,92px))));
  margin:0 auto;
  padding:clamp(28px,3vh,38px) 0 clamp(10px,1.4vh,18px);
}

.ns-citysignatures__head{
  width:min(980px,88%);
  margin:0 auto;
  text-align:center;
}

.ns-citysignatures__kicker{
  margin:0 0 8px;
  font-family:"Shippori Mincho",serif;
  font-size:clamp(18px,1.22vw,22px);
  font-weight:600;
  line-height:1.2;
  letter-spacing:.34em;
  background:var(--city-title-gradient);
  background-size:100% 1lh;
  background-position:0 0;
  background-repeat:repeat-y;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-transform:uppercase;
  filter:drop-shadow(0 2px 8px rgba(0,0,0,.66));
}

.ns-citysignatures__title{
  margin:0;
  padding:0 0 .10em;
  font-family:var(--font-display-primary);
  font-size:clamp(42px,4.25vw,70px);
  font-weight:700;
  line-height:1.16;
  letter-spacing:var(--cg-track-035,.035em);
  text-wrap:balance;
  background:var(--city-title-gradient);
  background-size:100% 1lh;
  background-position:0 0;
  background-repeat:repeat-y;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.64))
    drop-shadow(0 14px 30px rgba(0,0,0,.52));
}

.ns-citysignatures__nav{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(26px,3vw,50px);
  width:100%;
  margin-top:clamp(28px,3.2vh,38px);
}

.ns-citysignatures__nav-item{
  position:relative;
  display:grid;
  grid-template-rows:auto auto 1fr auto;
  align-content:start;
  gap:7px;
  min-width:0;
  min-height:clamp(128px,15.8vh,158px);
  padding:0 0 10px;
  text-align:left;
  color:rgba(255,255,255,.86);
  opacity:.76;
  transition:
    opacity .42s cubic-bezier(.22,.61,.36,1),
    transform .48s cubic-bezier(.22,.61,.36,1),
    color .42s cubic-bezier(.22,.61,.36,1);
}

.ns-citysignatures__nav-item:hover,
.ns-citysignatures__nav-item:focus-visible,
.ns-citysignatures__nav-item._is-active{
  opacity:1;
  color:#fff;
}

.ns-citysignatures__nav-item:hover,
.ns-citysignatures__nav-item:focus-visible{
  transform:translateY(-3px);
}

.ns-citysignatures__nav-index{
  display:block;
  font-family:var(--font-display-primary);
  font-size:clamp(28px,2.05vw,36px);
  font-weight:400;
  font-style:italic;
  line-height:1;
  letter-spacing:.03em;
  color:rgba(247,241,230,.72);
  transition:color .42s cubic-bezier(.22,.61,.36,1);
}

.ns-citysignatures__nav-name{
  display:block;
  min-height:1.35em;
  font-family:var(--font-display-primary);
  font-size:clamp(20px,1.38vw,26px);
  font-weight:700;
  line-height:1.35;
  letter-spacing:var(--cg-track-025,.025em);
  color:rgba(255,255,255,.94);
  transition:color .42s cubic-bezier(.22,.61,.36,1);
}

.ns-citysignatures__nav-description{
  display:block;
  max-width:320px;
  font-family:var(--font-display);
  font-size:clamp(14px,.96vw,17px);
  font-weight:500;
  line-height:1.55;
  letter-spacing:.025em;
  color:rgba(255,255,255,.68);
  text-shadow:0 2px 8px rgba(0,0,0,.66);
  transition:color .42s cubic-bezier(.22,.61,.36,1);
}

.ns-citysignatures__nav-rule{
  align-self:end;
  display:block;
  width:100%;
  height:1px;
  margin-top:7px;
  background:linear-gradient(
    90deg,
    rgba(255,255,255,.22) 0%,
    rgba(255,255,255,.15) 42%,
    rgba(255,255,255,.08) 72%,
    rgba(255,255,255,0) 100%
  );
  transform-origin:left center;
  transition:
    background .42s cubic-bezier(.22,.61,.36,1),
    box-shadow .42s cubic-bezier(.22,.61,.36,1),
    transform .42s cubic-bezier(.22,.61,.36,1);
}

.ns-citysignatures__nav-item._is-active .ns-citysignatures__nav-index{
  color:var(--city-gold);
}

.ns-citysignatures__nav-item._is-active .ns-citysignatures__nav-name{
  color:#f7d783;
}

.ns-citysignatures__nav-item._is-active .ns-citysignatures__nav-description{
  color:#fff;
}

.ns-citysignatures__nav-item._is-active .ns-citysignatures__nav-rule{
  background:linear-gradient(
    90deg,
    #fff4d6 0%,
    #f0c56f 42%,
    rgba(240,197,111,.42) 74%,
    rgba(240,197,111,0) 100%
  );
  box-shadow:0 0 10px rgba(240,197,111,.16);
  transform:scaleX(.86);
}

html:lang(ja) .ns-citysignatures__nav-description{
  font-family:var(--font-body);
  font-weight:400;
}

html:lang(en) .ns-citysignatures__nav-index{
  font-family:"Shippori Mincho",serif;
}

html:lang(en) .ns-citysignatures__kicker{
  letter-spacing:.32em;
}


/* =============
   CITY BRAND SIGNATURES
   ============= */

.ns-citybrand{
  position:absolute;
  left:50%;
  z-index:8;
  display:flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  max-width:calc(100% - 36px);
  pointer-events:none;
  user-select:none;
}

.ns-citybrand__seal{
  display:block;
  flex:0 0 auto;
  line-height:0;
}

.ns-citybrand__seal img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

.ns-citybrand__text{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.ns-citybrand__name{
  display:block;
  font-family:var(--font-brand);
  font-size:clamp(12px,.9vw,14px);
  font-weight:700;
  line-height:1;
  letter-spacing:.30em;
  background:var(--city-title-gradient);
  background-size:100% 1lh;
  background-position:0 0;
  background-repeat:repeat-y;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  color:transparent;
}

.ns-citybrand__tagline{
  display:block;
  font-family:var(--font-display-primary);
  font-size:clamp(10.5px,.78vw,12px);
  font-weight:700;
  line-height:1.32;
  letter-spacing:.13em;
  color:rgba(255,255,255,.90);
  text-shadow:0 2px 8px rgba(0,0,0,.68);
}

.ns-citybrand--bridge{
  bottom:clamp(-215px,-20vh,-125px);
  gap:16px;
  transform:translateX(-50%);
}

.ns-citybrand--bridge .ns-citybrand__seal{
  width:clamp(44px,3.2vw,54px);
  height:clamp(44px,3.2vw,54px);
  transform:rotate(-2deg);
}

.ns-citybrand--bridge .ns-citybrand__text{
  align-items:flex-start;
  gap:5px;
}

.ns-citybrand--closing{
  position:absolute;
  left:50%;
  bottom:clamp(-155px,-13vh,-105px);
  z-index:8;
  margin:0;
  transform:translateX(-50%);
}

/* EXPERIENCE */
.ns-cityexperience__title{
  margin:0;
  padding:0 0 .10em;
  overflow:visible;
  font-family:var(--font-display-primary);
  font-size:clamp(42px,4.25vw,70px);
  font-weight:700;
  line-height:1.13;
  letter-spacing:var(--cg-track-025,.025em);
  text-wrap:balance;
  background:var(--city-title-gradient);
  background-size:100% 1lh;
  background-position:0 0;
  background-repeat:repeat-y;
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:
    drop-shadow(0 2px 0 rgba(0,0,0,.62))
    drop-shadow(0 14px 28px rgba(0,0,0,.50));
}

.ns-cityexperience__intro{
  width:min(1120px,100%);
  margin:16px auto 0;
  font-family:var(--font-display);
  font-size:clamp(18px,1.28vw,23px);
  font-weight:500;
  line-height:1.70;
  letter-spacing:.055em;
  color:rgba(255,255,255,.90);
  text-shadow:0 2px 8px rgba(0,0,0,.72);
}

html:lang(en) .ns-cityexperience__intro{
  font-family:var(--font-display-primary);
  font-style:italic;
  letter-spacing:.09em;
}

@media (prefers-reduced-motion:reduce){
  .ns-citysignatures__panel,
  .ns-citysignatures__nav-item,
  .ns-citysignatures__nav-index,
  .ns-citysignatures__nav-name,
  .ns-citysignatures__nav-rule{
    transition:none !important;
  }
}

/* =============
   EXPERIENCE
   ============= */

.ns-citystage--experience{
  min-height:max(980px,calc(var(--city-stage-h) + 120px));
  margin-top:clamp(130px,16vh,210px);
  margin-bottom:clamp(130px,16vh,210px);
  overflow:visible;
  border-top:0;
  border-bottom:0;
  background:transparent;
}

.ns-citystage--experience::before{
  content:none;
}

.ns-cityexperience{
  --city-experience-edge-mask:linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.10) 3%,
    rgba(255,255,255,.30) 7%,
    rgba(255,255,255,.58) 11%,
    rgba(255,255,255,.82) 15%,
    rgba(255,255,255,.96) 19%,
    rgba(255,255,255,1) 22%,
    rgba(255,255,255,1) 100%
  );
  --experience-tail:calc(clamp(185px,20svh,225px) + 120px);
  --experience-curve-depth:clamp(155px,16svh,205px);
  --experience-media-offset:var(--space-6);
  position:relative;
  width:100%;
  height:max(980px,calc(var(--city-stage-h) + 120px));
  min-height:max(980px,calc(var(--city-stage-h) + 120px));
  padding:0;
  overflow:hidden;
}

.ns-cityexperience__head{
  position:absolute;
  top:clamp(56px,4.4vw,82px);
  left:50%;
  z-index:6;
  width:min(1260px,90vw);
  margin:0 auto;
  transform:translateX(-50%);
  text-align:center;
}

.ns-cityexperience__intro{
  max-width:1040px;
}

.ns-cityexperience__visual{
  position:absolute;
  inset:0 0 auto;
  width:100%;
  height:calc(100% - var(--experience-tail));
  margin:0;
  overflow:visible;
}

.ns-cityexperience__visual::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:calc(100% - var(--experience-curve-depth));
  bottom:calc(0px - var(--experience-tail));
  z-index:4;
  pointer-events:none;
  transform:translateY(var(--experience-curve-shift,0px));
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 500' preserveAspectRatio='none'%3E%3Cpath d='M0 72 C230 92 420 205 710 178 C990 152 1170 22 1440 78 L1440 500 L0 500 Z' fill='%23000000' fill-opacity='1' stroke='%23c49a4b' stroke-opacity='.86' stroke-width='1.35' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") center/100% 100% no-repeat;
  -webkit-mask-image:linear-gradient(
    180deg,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,1) 80%,
    rgba(255,255,255,.94) 84%,
    rgba(255,255,255,.78) 88%,
    rgba(255,255,255,.52) 92%,
    rgba(255,255,255,.22) 96%,
    rgba(255,255,255,0) 100%
  );
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-image:linear-gradient(
    180deg,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,1) 80%,
    rgba(255,255,255,.94) 84%,
    rgba(255,255,255,.78) 88%,
    rgba(255,255,255,.52) 92%,
    rgba(255,255,255,.22) 96%,
    rgba(255,255,255,0) 100%
  );
  mask-repeat:no-repeat;
  mask-size:100% 100%;
  filter:drop-shadow(0 -12px 30px rgba(0,0,0,.38));
}

.ns-cityexperience__media{
  position:absolute;
  top:4%;
  right:0;
  bottom:4%;
  left:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  transform:translateY(var(--experience-media-offset));
  -webkit-mask-image:var(--city-experience-edge-mask);
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-image:var(--city-experience-edge-mask);
  mask-repeat:no-repeat;
  mask-size:100% 100%;
}

.ns-cityexperience__media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 68%;
  filter:saturate(.92) contrast(1.05) brightness(.78);
}

.ns-cityexperience__media::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,0,0,.64) 0%,rgba(0,0,0,.42) 24%,rgba(0,0,0,.13) 48%,rgba(0,0,0,0) 74%),
    linear-gradient(180deg,rgba(0,0,0,.72) 0%,rgba(0,0,0,.48) 24%,rgba(0,0,0,.08) 53%,rgba(0,0,0,.16) 76%,rgba(0,0,0,.48) 100%);
}

.ns-cityexperience__copy{
  position:absolute;
  left:clamp(175px,15vw,310px);
  top:clamp(305px,32svh,390px);
  z-index:5;
  width:min(800px,64vw);
  transform:none;
}

.ns-cityexperience__copy-title{
  margin:0;
  font-family:var(--font-display-primary);
  font-size:clamp(28px,2.05vw,38px);
  font-weight:700;
  line-height:1.55;
  letter-spacing:var(--cg-track-035,.035em);
  color:rgba(255,255,255,.97);
  text-shadow:
    0 2px 2px rgba(0,0,0,.92),
    0 10px 24px rgba(0,0,0,.64);
}

.ns-cityexperience__copy-text{
  margin:20px 0 0;
  font-family:var(--font-display);
  font-size:clamp(15px,.98vw,18px);
  font-weight:500;
  line-height:1.9;
  letter-spacing:.035em;
  color:rgba(255,255,255,.92);
  text-shadow:
    0 2px 3px rgba(0,0,0,.92),
    0 8px 18px rgba(0,0,0,.62);
}

.ns-cityexperience__benefits{
  position:absolute;
  left:50%;
  bottom:calc(clamp(58px,6.5svh,84px) + 100px);
  z-index:7;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  width:min(1660px,calc(100% - clamp(140px,14vw,280px)));
  margin:0;
  transform:translateX(-50%);
}

.ns-cityexperience__benefit{
  position:relative;
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  grid-template-rows:auto auto;
  align-content:center;
  column-gap:16px;
  min-height:138px;
  padding:18px clamp(22px,2vw,36px);
  text-align:left;
}

.ns-cityexperience__benefit + .ns-cityexperience__benefit::before{
  content:"";
  position:absolute;
  left:0;
  top:26px;
  width:1px;
  height:86px;
  transform:rotate(27deg);
  transform-origin:center;
  background:linear-gradient(180deg,transparent,rgba(240,197,111,.46),transparent);
}

.ns-cityexperience__icon{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  grid-row:1 / span 2;
  width:58px;
  height:42px;
  margin:0;
}

.ns-cityexperience__icon::before{
  content:"";
  position:absolute;
  inset:0;
  display:block;
  background:var(--city-title-gradient);
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-position:center;
  -webkit-mask-size:contain;
  mask-repeat:no-repeat;
  mask-position:center;
  mask-size:contain;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.42));
  pointer-events:none;
}

.ns-cityexperience__benefit:nth-child(1) .ns-cityexperience__icon::before{
  -webkit-mask-image:url("/images/icons/icon-estatua.svg");
  mask-image:url("/images/icons/icon-estatua.svg");
}

.ns-cityexperience__benefit:nth-child(2) .ns-cityexperience__icon::before{
  -webkit-mask-image:url("/images/icons/icon-key.svg");
  mask-image:url("/images/icons/icon-key.svg");
}

.ns-cityexperience__benefit:nth-child(3) .ns-cityexperience__icon::before{
  -webkit-mask-image:url("/images/icons/icon-glass.svg");
  mask-image:url("/images/icons/icon-glass.svg");
}

.ns-cityexperience__benefit:nth-child(4) .ns-cityexperience__icon::before{
  -webkit-mask-image:url("/images/icons/icon-eye.svg");
  mask-image:url("/images/icons/icon-eye.svg");
}

.ns-cityexperience__icon img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  opacity:0;
}

.ns-cityexperience__benefit h3{
  margin:0;
  font-family:var(--font-display-primary);
  font-size:clamp(19px,1.28vw,25px);
  font-weight:700;
  line-height:1.35;
  letter-spacing:var(--cg-track-035,.035em);
  background:var(--city-title-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.ns-cityexperience__benefit p{
  margin:7px 0 0;
  max-width:300px;
  font-family:var(--font-display);
  font-size:clamp(12px,.82vw,15px);
  line-height:1.66;
  letter-spacing:.025em;
  color:rgba(255,255,255,.78);
}

/* =============
   FINAL CTA
   ============= */

.ns-citystage--cta{
  --city-cta-top-mask:linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.10) 4%,
    rgba(255,255,255,.30) 8%,
    rgba(255,255,255,.58) 12%,
    rgba(255,255,255,.82) 16%,
    rgba(255,255,255,.96) 20%,
    rgba(255,255,255,1) 24%,
    rgba(255,255,255,1) 100%
  );
  min-height:820px;
  border-bottom:0;
}

.ns-citystage__media--cta{
  inset:0 0 0 22%;
  -webkit-mask-image:var(--city-cta-top-mask);
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-image:var(--city-cta-top-mask);
  mask-repeat:no-repeat;
  mask-size:100% 100%;
}

.ns-citystage__media--cta img{
  object-position:center 42%;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.38) 15%,#000 37%,#000 100%);
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.38) 15%,#000 37%,#000 100%);
  mask-repeat:no-repeat;
  mask-size:100% 100%;
}

.ns-citystage--cta .ns-citystage__shade{
  background:
    linear-gradient(90deg,#090909 0%,rgba(9,9,9,.96) 31%,rgba(9,9,9,.58) 57%,rgba(9,9,9,.13) 100%),
    linear-gradient(180deg,rgba(0,0,0,.08),transparent 46%,rgba(0,0,0,.38));
  -webkit-mask-image:var(--city-cta-top-mask);
  -webkit-mask-repeat:no-repeat;
  -webkit-mask-size:100% 100%;
  mask-image:var(--city-cta-top-mask);
  mask-repeat:no-repeat;
  mask-size:100% 100%;
}

.ns-cityfinal{
  display:flex;
  align-items:center;
  min-height:820px;
  padding-top:72px;
  padding-bottom:72px;
}

.ns-cityfinal__copy{
  position:relative;
  top:28px;
  width:min(900px,56%);
}

.ns-cityfinal .ns-city-title{
  font-size:clamp(42px,4.25vw,70px);
}

.ns-cityfinal__title-line{
  display:block;
}

/* =============
   INTERACTION
   ============= */

@media (hover:hover){
  .ns-citystage__next:hover{
    transform:translate(-50%,-3px);
    border-color:rgba(240,197,111,.82);
    box-shadow:0 16px 34px rgba(0,0,0,.54),0 0 18px rgba(240,197,111,.10);
  }

  .ns-citymoment:hover .ns-citymoment__media img,
  .ns-cityexperience__step:hover .ns-cityexperience__media img{
    transform:scale(1.035);
    filter:brightness(1.04);
  }

}

/* =============
   TABLET
   ============= */

@media (min-width:768px) and (max-width:1179.98px){
  :root{
    --city-pad:clamp(28px,4.2vw,48px);
    --topbar-h:clamp(60px,6.5vw,68px);
  }

  .ns-citystage__inner{
    min-height:auto;
    padding-top:64px;
    padding-bottom:112px;
  }

  .ns-citystage--hero,
  .ns-citystage--moments{
    min-height:760px;
  }

  .ns-citystage--cta{
    min-height:820px;
  }

  .ns-cityfinal{
    min-height:820px;
  }

  .ns-cityhero-l4__copy{
    width:68%;
  }

  .ns-cityhero-l4__title{
    font-size:clamp(48px,5.5vw,64px);
  }

  .ns-citystage__media--hero{
    inset:0;
  }

  /* SIGNATURES */
  .ns-citystage--signatures{
    min-height:auto !important;
    margin-top:112px;
    margin-bottom:128px;
  }

  .ns-citysignatures{
    padding-bottom:76px;
  }

  .ns-citysignatures__media{
    height:clamp(410px,56vw,590px);
  }

  .ns-citysignatures__content{
    width:calc(100% - 56px);
    padding:46px 0 42px;
  }

  .ns-citysignatures__head{
    width:min(760px,94%);
  }

  .ns-citysignatures__kicker{
    font-size:17px;
    letter-spacing:.30em;
  }

  .ns-citysignatures__title{
    font-size:clamp(42px,4.25vw,70px);
  }

  .ns-citysignatures__nav{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:34px 48px;
    margin-top:44px;
  }

  .ns-citysignatures__nav-item{
    min-height:176px;
    padding-bottom:16px;
  }

  .ns-citysignatures__nav-index{
    font-size:34px;
  }

  .ns-citysignatures__nav-name{
    min-height:0;
    font-size:clamp(22px,2.8vw,26px);
  }

  .ns-citysignatures__nav-description{
    max-width:none;
    font-size:16px;
  }

  .ns-cityexperience__title{
    font-size:clamp(42px,4.25vw,70px);
    line-height:1.16;
  }

  .ns-cityexperience__intro{
    margin-top:11px;
    font-size:14px;
    line-height:1.72;
  }

  /* EXPERIENCE */
  .ns-citystage--experience,
  .ns-cityexperience{
    height:1260px;
    min-height:1260px;
  }

  .ns-cityexperience{
    --experience-tail:420px;
    --experience-curve-depth:100px;
    --experience-curve-shift:-120px;
    --experience-media-offset:0;
  }

  .ns-citystage--experience{
    margin-top:128px;
    margin-bottom:140px;
  }

  .ns-cityexperience__head{
    top:58px;
    width:calc(100% - 72px);
  }

  .ns-cityexperience__visual{
    height:840px;
  }

  .ns-cityexperience__media img{
    object-position:center 76%;
  }

  .ns-cityexperience__copy{
    left:calc(var(--city-pad) + 48px);
    top:280px;
    width:min(720px,82vw);
  }

  .ns-cityexperience__benefits{
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:calc(100% - 72px);
    bottom:170px;
  }

  .ns-cityexperience__benefit:nth-child(3),
  .ns-cityexperience__benefit:nth-child(4){
    border-top:1px solid rgba(240,197,111,.22);
  }

  .ns-cityexperience__benefit:nth-child(3)::before{
    content:none;
  }

  .ns-cityfinal__copy{
    top:24px;
    width:68%;
  }
}

/* =============
   MOBILE
   ============= */

@media (max-width:767.98px){
  :root{
    --city-pad:18px;
    --city-stage-h:auto;
    --city-mobile-brand-gap:100px;
    --city-mobile-brand-center:34px;
  }

  body.ns-city{
    background-size:auto,620px 620px;
  }

  .ns-citystage{
    min-height:auto !important;
    overflow:hidden;
  }

  .ns-citystage__inner{
    width:calc(100% - 36px);
    min-height:auto;
    padding:54px 0 92px;
  }

  .ns-citystage__next{
    bottom:14px;
    min-width:210px;
    max-width:calc(100% - 36px);
    min-height:40px;
    gap:9px;
    padding:8px 14px;
  }

  .ns-citystage__next-label{
    font-size:13px;
  }

  .ns-city-title{
    font-size:clamp(34px,10vw,48px);
    line-height:1.24;
  }

  .ns-city-intro{
    margin-top:18px;
    font-size:14px;
    line-height:1.85;
  }

  .ns-city-sectionmark{
    min-height:62px;
  }

  .ns-city-sectionmark__ghost{
    left:-10px;
    top:-28px;
    font-size:96px;
  }

  .ns-city-sectionmark__eyebrow{
    padding-top:16px;
    font-size:10px;
    letter-spacing:.14em;
  }

  .ns-city-sectionmark__eyebrow::after{
    width:46px;
  }

  .ns-cityfinal .ns-rcta__ctas{
    margin:28px auto 0;
  }

  .ns-cityfinal .ns-rcta__btn{
    width:100%;
    min-height:54px;
    padding:12px 18px;
    font-size:14.5px;
  }

  /* HERO */
  .ns-citystage--hero{
    min-height:max(650px,calc(100svh - var(--topbar-h))) !important;
  }

  .ns-citystage__media--hero{
    inset:0 0 auto 0;
    height:auto;
    -webkit-mask-image:linear-gradient(
      180deg,
      rgba(0,0,0,1) 0%,
      rgba(0,0,0,1) 70%,
      rgba(0,0,0,.98) 76%,
      rgba(0,0,0,.88) 82%,
      rgba(0,0,0,.66) 88%,
      rgba(0,0,0,.40) 93%,
      rgba(0,0,0,.16) 97%,
      rgba(0,0,0,0) 100%
    );
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-size:100% 100%;
    mask-image:linear-gradient(
      180deg,
      rgba(0,0,0,1) 0%,
      rgba(0,0,0,1) 70%,
      rgba(0,0,0,.98) 76%,
      rgba(0,0,0,.88) 82%,
      rgba(0,0,0,.66) 88%,
      rgba(0,0,0,.40) 93%,
      rgba(0,0,0,.16) 97%,
      rgba(0,0,0,0) 100%
    );
    mask-repeat:no-repeat;
    mask-size:100% 100%;
  }

  .ns-citystage__media--hero picture{
    width:100% !important;
    height:auto !important;
  }

  .ns-citystage__media--hero img{
    width:100%;
    height:auto;
    object-fit:contain;
    object-position:center top;
    transform:translateY(calc(-1 * var(--space-6)));
  }

  .ns-citystage--hero .ns-citystage__shade{
    background:none;
  }

  .ns-cityhero-l4{
    align-items:flex-end;
    width:calc(100% - 36px);
    min-height:max(650px,calc(100svh - var(--topbar-h)));
    padding-top:clamp(230px,60vw,270px);
    padding-bottom:88px;
  }

  .ns-cityhero-l4__copy{
    width:100%;
    padding:0 0 8px;
    text-align:center;
    transform:translateY(clamp(22px,4vh,38px));
  }

  .ns-cityhero-l4__title-row{
    justify-content:center;
    gap:14px;
  }

  .ns-cityhero-l4__meta{
    position:absolute;
    left:50%;
    bottom:calc(100% + 14px);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    width:max-content;
    max-width:calc(100vw - 36px);
    transform:translateX(-50%);
  }

  .ns-cityhero-l4__title{
    font-size:clamp(37px,10.4vw,50px);
  }

  html[lang="ja"] .ns-cityhero-l4__title{
    font-size:clamp(34px,10vw,50px);
    letter-spacing:0;
  }

  body.ns-city .ns-cityhero-l4__copy .ns-home-scroll-bridge{
    width:min(520px,100%);
    margin:24px auto 0;
  }

  .ns-cityhero-l4__lead{
    margin-top:20px;
    font-size:14px;
    line-height:1.85;
  }

  .ns-cityhero-l4__coords{
    position:relative;
    left:auto;
    bottom:auto;
    padding:9px 16px 10px;
    transform:none;
  }

  body.ns-city .ns-cityhero-l4__meta .ns-seal--hero{
    position:relative;
    left:auto;
    top:auto;
    width:34px;
    height:34px;
    flex:0 0 34px;
    transform:rotate(1.5deg);
  }

  .ns-cityhero-l4__coords-icon{
    width:16px;
    height:16px;
  }

  .ns-cityhero-l4__coords-value{
    font-size:12px;
    letter-spacing:.16em;
  }

  .ns-cityhero-l4__lead br{
    display:none;
  }

  /* SIGNATURES */
  .ns-citystage--signatures{
    min-height:auto !important;
    margin-top:72px;
    margin-bottom:0;
    overflow:visible;
  }

  .ns-citysignatures{
    width:100%;
    min-height:0;
    padding:0 0 34px;
  }

  .ns-citysignatures__media{
    height:clamp(240px,64vw,330px);
  }

  .ns-citysignatures__content{
    width:calc(100% - 36px);
    padding:30px 0 24px;
  }

  .ns-citysignatures__head{
    width:100%;
  }

  .ns-citysignatures__kicker{
    margin-bottom:18px;
    font-size:20px;
    letter-spacing:.26em;
  }

  .ns-citysignatures__title{
    font-size:clamp(34px,9.8vw,46px);
    line-height:1.22;
  }

  .ns-citysignatures__nav{
    grid-template-columns:1fr;
    gap:0;
    margin-top:16px;
  }

  .ns-citysignatures__nav-item{
    grid-template-columns:48px minmax(0,1fr);
    grid-template-rows:auto auto;
    align-items:center;
    column-gap:14px;
    row-gap:5px;
    min-height:0;
    padding:12px 0;
    opacity:.90;
  }

  .ns-citysignatures__nav-index{
    grid-column:1;
    grid-row:1;
    font-size:28px;
  }

  .ns-citysignatures__nav-name{
    grid-column:2;
    grid-row:1;
    min-height:0;
    font-size:clamp(19px,5.1vw,22px);
    line-height:1.32;
  }

  .ns-citysignatures__nav-description{
    display:none !important;
  }

  .ns-citysignatures__nav-rule{
    grid-column:1 / -1;
    grid-row:2;
    height:1px;
    margin-top:7px;
  }

  .ns-citybrand--bridge{
    top:calc(100% + var(--city-mobile-brand-center));
    bottom:auto;
    transform:translate(-50%,-50%);
  }
	
  /* EXPERIENCE */
  .ns-cityexperience__title{
    font-size:clamp(42px,4.25vw,70px);
    line-height:1.2;
  }

  .ns-cityexperience__intro{
    margin-top:12px;
    font-size:clamp(15px,4.1vw,16.5px);
    line-height:1.62;
    letter-spacing:.035em;
  }

  .ns-citystage--experience{
    --experience-mobile-visual-height:clamp(460px,128vw,540px);
    --experience-mobile-height:calc(var(--experience-mobile-visual-height) + 520px);
    min-height:var(--experience-mobile-height) !important;
    margin-top:var(--city-mobile-brand-gap);
    margin-bottom:96px;
    overflow:visible;
  }

  .ns-cityexperience{
    --experience-tail:calc(var(--experience-mobile-height) - var(--experience-mobile-visual-height));
    --experience-curve-depth:20vw;
    --experience-media-offset:0;
    width:100%;
    height:var(--experience-mobile-height);
    min-height:var(--experience-mobile-height);
    padding:0;
  }

  .ns-cityexperience__head{
    top:24px;
    width:calc(100% - 36px);
  }

  .ns-cityexperience__visual{
    height:var(--experience-mobile-visual-height);
    margin:0;
  }

  .ns-cityexperience__visual::before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:calc(100% - 1px);
    bottom:calc(0px - var(--experience-tail));
    z-index:3;
    pointer-events:none;
    background:#000;
    -webkit-mask-image:linear-gradient(
      180deg,
      rgba(255,255,255,1) 0%,
      rgba(255,255,255,1) 80%,
      rgba(255,255,255,.94) 84%,
      rgba(255,255,255,.78) 88%,
      rgba(255,255,255,.52) 92%,
      rgba(255,255,255,.22) 96%,
      rgba(255,255,255,0) 100%
    );
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-size:100% 100%;
    mask-image:linear-gradient(
      180deg,
      rgba(255,255,255,1) 0%,
      rgba(255,255,255,1) 80%,
      rgba(255,255,255,.94) 84%,
      rgba(255,255,255,.78) 88%,
      rgba(255,255,255,.52) 92%,
      rgba(255,255,255,.22) 96%,
      rgba(255,255,255,0) 100%
    );
    mask-repeat:no-repeat;
    mask-size:100% 100%;
  }

  .ns-cityexperience__visual::after{
    top:calc(100% - var(--experience-curve-depth));
    bottom:auto;
    height:34.722vw;
    background-color:transparent;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1440' height='500' viewBox='0 0 1440 500'%3E%3Cpath d='M0 72 C230 92 420 205 710 178 C990 152 1170 22 1440 78 L1440 500 L0 500 Z' fill='%23000000' fill-opacity='1'/%3E%3Cpath d='M0 72 C230 92 420 205 710 178 C990 152 1170 22 1440 78' fill='none' stroke='%23c49a4b' stroke-opacity='.86' stroke-width='1.35' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E");
    background-position:center top;
    background-repeat:no-repeat;
    background-size:100% 100%;
    -webkit-mask-image:none;
    mask-image:none;
  }

  .ns-cityexperience__media{
    top:3%;
    right:0;
    bottom:3%;
    left:0;
  }

  .ns-cityexperience__media img{
    object-position:62% 74%;
  }

  .ns-cityexperience__media::after{
    background:
      linear-gradient(180deg,rgba(0,0,0,.76) 0%,rgba(0,0,0,.50) 25%,rgba(0,0,0,.10) 52%,rgba(0,0,0,.24) 77%,rgba(0,0,0,.56) 100%),
      linear-gradient(90deg,rgba(0,0,0,.50) 0%,rgba(0,0,0,.22) 72%,rgba(0,0,0,.04) 100%);
  }

  .ns-cityexperience__copy{
    left:20px;
    right:20px;
    top:clamp(170px,45vw,200px);
    bottom:auto;
    width:auto;
    transform:none;
  }

  .ns-cityexperience__copy-title{
    margin-top:38px;
    font-size:clamp(23px,6.4vw,26px);
    line-height:1.32;
    text-wrap:balance;
  }

  .ns-cityexperience__copy-title br{
    display:none;
  }

  .ns-cityexperience__copy-text{
    display:none;
  }

  .ns-cityexperience__benefits{
    grid-template-columns:1fr;
    width:calc(100% - 36px);
    top:calc(var(--experience-mobile-visual-height) - 10px);
    bottom:auto;
    margin:0;
  }

  .ns-cityexperience__benefit{
    display:grid;
    grid-template-columns:54px 1fr;
    grid-template-rows:auto auto;
    column-gap:11px;
    min-height:0;
    padding:14px 4px;
    text-align:left;
  }

  .ns-cityexperience__benefit + .ns-cityexperience__benefit::before,
  .ns-cityexperience__benefit:nth-child(3)::before{
    content:"";
    left:0;
    right:0;
    top:0;
    width:100%;
    height:1px;
    transform:none;
    background:linear-gradient(90deg,transparent,rgba(240,197,111,.34),transparent);
  }

  .ns-cityexperience__icon{
    grid-row:1 / span 2;
    width:52px;
    height:38px;
    margin:2px 0 0;
  }

  .ns-cityexperience__benefit h3{
    font-size:clamp(17px,4.8vw,20px);
    line-height:1.28;
  }

  .ns-cityexperience__benefit p{
    margin:5px 0 0;
    max-width:none;
    font-size:clamp(13.5px,3.75vw,15px);
    line-height:1.55;
  }

  .ns-citybrand--closing{
    display:none;
  }

  /* FINAL */
  .ns-citystage--cta{
    --city-cta-mobile-mask:linear-gradient(
      180deg,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.18) 5%,
      rgba(0,0,0,.55) 11%,
      rgba(0,0,0,1) 18%,
      rgba(0,0,0,1) 100%
    );
    min-height:620px !important;
  }

  .ns-citystage__media--cta{
    inset:0;
    height:auto;
    -webkit-mask-image:var(--city-cta-mobile-mask);
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-size:100% 100%;
    mask-image:var(--city-cta-mobile-mask);
    mask-repeat:no-repeat;
    mask-size:100% 100%;
  }

  .ns-citystage__media--cta img{
    object-position:center 42%;
    -webkit-mask-image:none;
    mask-image:none;
  }

  .ns-citystage--cta .ns-citystage__shade{
    background:linear-gradient(
      180deg,
      rgba(0,0,0,.18) 0%,
      rgba(0,0,0,.28) 26%,
      rgba(0,0,0,.42) 50%,
      rgba(0,0,0,.58) 72%,
      rgba(0,0,0,.68) 100%
    );
    -webkit-mask-image:var(--city-cta-mobile-mask);
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-size:100% 100%;
    mask-image:var(--city-cta-mobile-mask);
    mask-repeat:no-repeat;
    mask-size:100% 100%;
  }

  .ns-cityfinal{
    align-items:flex-end;
    min-height:620px;
    padding-top:250px;
    padding-bottom:84px;
  }

  .ns-cityfinal__copy{
    top:-72px;
    width:100%;
    text-align:center;
  }

  .ns-cityfinal .ns-city-title{
    font-size:clamp(30px,9.2vw,42px);
    line-height:1.30;
  }

  .ns-cityfinal__title-line{
    white-space:nowrap;
  }

  html[lang="ja"] .ns-cityfinal__title-line:first-child{
    font-size:.88em;
  }

  .ns-cityfinal .ns-city-intro{
    max-width:520px;
    margin-inline:auto;
    font-size:14px;
    line-height:1.72;
  }

  .ns-cityfinal__note{
    margin-inline:auto;
    text-align:center;
  }
}


/* =========================================================
   ACCESSIBILITY / MOTION
   ========================================================= */

@media (prefers-reduced-motion:reduce){
  .ns-citystage__next,
  .ns-cityfinal .ns-rcta__btn,
  .ns-citymoment__media img,
  .ns-cityexperience__media img{
    transition:none !important;
    animation:none !important;
  }
}