/* ---------- hero ---------- */
.n{--vh:max(560px,100vh);--expo:cubic-bezier(.16,1,.3,1);--p3:cubic-bezier(.215,.61,.355,1);--back:cubic-bezier(.34,1.56,.64,1);--back2:cubic-bezier(.34,1.9,.64,1)}
/* --fs is the size of the НЕБО letters and --ty the height of their middle in the frame;
   the laurels and "Guest favourite" are laid out from these two, so no measuring script is needed */
.n-hero{position:relative;margin-top:calc(-1 * var(--hdr));--fs:var(--mark-wide);--ty:50%}
.n-stage{position:relative;padding-top:var(--hdr)}
.n-frame{position:relative;height:clamp(360px,34vw,600px);overflow:hidden}
.n-photo{position:absolute;inset:0;overflow:hidden}
.n-photo img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.n-hero .n-photo{inset:-14px}
/* frame the skyline inside the letters: horizon about a third of the way down the capitals */
.n-crop{position:absolute;inset:0}
.n-hero .n-photo img{object-position:50% 54%}
.n-cap{position:absolute;left:var(--gut);bottom:28px;z-index:2;margin:0;display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px 0 12px;border-radius:999px;background:var(--paper);color:var(--ink);font-size:15px;font-weight:500;opacity:0}
.n-cap .n-ic{color:var(--kick)}
.n-hero-copy{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:end;gap:28px 64px;padding-block:28px 52px}
.n-hero-l{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.n-place{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:15px;font-weight:450}
.n-place b{font-family:var(--disp);font-weight:var(--disp-w);font-size:22px;letter-spacing:var(--disp-track)}
.n-place span{color:var(--mute)}
.n-h1{margin:0;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(34px,3.9vw,62px);line-height:var(--disp-lh);letter-spacing:var(--disp-track);text-wrap:balance}
.look-b .n-h1 em{font-style:italic}
.n-h1 em{font-style:normal}
.n-hero-r{display:flex;flex-direction:column;gap:22px}
.n-lede{margin:0;max-width:32em;font-size:clamp(16px,1.2vw,18px);line-height:1.65;color:var(--mute)}
.n-ctas{display:flex;flex-wrap:wrap;gap:10px}
.n-host{display:flex;align-items:center;gap:12px}
.n-host p{margin:0;font-size:16px;color:var(--mute)}
.n-host b{font-weight:600;color:var(--field-ink)}
/* placeholder until Svetlana's photo arrives: swap the span for <img class="n-avatar" src="…" alt="Svetlana"> */
.n-avatar{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;width:52px;height:52px;border-radius:50%;border:1.5px dashed currentColor;background:rgba(0,0,0,.07);color:var(--mute);object-fit:cover}
.n-avatar small{font-size:9px;font-weight:600;letter-spacing:.04em;line-height:1}

/* guest favourite: NEBO's own badge, in the site's type */
.n-fav{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:4px 0;color:var(--field-ink);--focus:var(--field-ink)}
.n-fav .n-fav-lau svg{color:var(--field-kick)}
/* centred directly under the НЕБО letters */
.n-fav-row{position:relative;z-index:3;display:flex;justify-content:center;margin-top:-14px;padding-inline:var(--gut);pointer-events:none}
.n-fav-row .n-fav{pointer-events:auto}

.n-fav-lau svg{display:block;width:34px;height:68px}
.n-fav-t{margin:0;padding:0 6px;font-family:var(--disp);font-weight:var(--disp-w);font-size:25px;line-height:1.04;letter-spacing:var(--disp-track);text-align:center}
.look-b .n-fav-t{font-style:italic}

/* ---------- statement ---------- */
.n-state{display:flex;flex-direction:column;gap:clamp(28px,3vw,44px)}
.n-big{margin:0;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(34px,5.2vw,86px);line-height:1.1;letter-spacing:var(--disp-track);text-wrap:balance}
.n-chip{display:inline-block;width:1.7em;height:.82em;margin:0 .14em;border-radius:999px;overflow:hidden;vertical-align:-.04em;background:var(--warm)}
.n-chip img{width:100%;height:100%;object-fit:cover}
.n-state-foot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px 56px}
/* slim full-width bar under the hero: the stay at a glance */
.n-bar{background:var(--deep)}
.n-bar-list{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));margin:0 auto;padding:0 var(--gut);max-width:1600px;list-style:none}
.n-bar-list li{display:flex;align-items:center;justify-content:center;gap:10px;min-height:64px;padding:12px 14px;border-left:1px solid var(--line);font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(15px,1.15vw,18px);letter-spacing:var(--mid-track);line-height:1.2;text-align:left}
.n-bar-list li:first-child{border-left:0}
.n-bar-list .n-ic{color:var(--accent)}
@media (min-width:1101px){.n-bar-list{display:flex}.n-bar-list li{flex:1 1 auto;white-space:nowrap}}
@media (max-width:1100px){
.n-bar-list{grid-template-columns:repeat(4,minmax(0,1fr))}
.n-bar-list li{justify-content:flex-start;border-left:0;padding-left:0}
}
@media (max-width:640px){
.n-bar-list{grid-template-columns:repeat(2,minmax(0,1fr))}
.n-bar-list li{min-height:56px}
.n-bar-list li:nth-child(n+3){border-top:1px solid var(--line)}
}

/* ---------- window wall ---------- */
.n-wall-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 56px}
.n-state-sec{padding-bottom:clamp(48px,5vw,80px)}
.n-wall{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,24px)}
.n-col{display:flex;flex-direction:column;gap:clamp(12px,1.6vw,24px)}
.n-col:nth-child(2){padding-top:clamp(60px,9vw,160px)}
.n-col:nth-child(3){padding-top:clamp(24px,4vw,64px)}
.n-shot{margin:0;display:flex;flex-direction:column;gap:10px}
.n-shot-img{position:relative;overflow:hidden;aspect-ratio:3/4;border-radius:18px;background:var(--warm)}
.n-shot-img img{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover}
.n-shot figcaption{font-size:14px;color:var(--mute)}

/* ---------- up here ---------- */
.n-floor{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:start;gap:clamp(36px,6vw,104px)}
.n-floor-media{position:sticky;top:calc(var(--hdr) + 24px)}
.n-ap{position:relative;margin:0;overflow:hidden;border-radius:18px;background:var(--warm)}
.n-ap img{position:absolute;inset:-8% 0;width:100%;height:116%;object-fit:cover}
.n-floor-copy{display:flex;flex-direction:column;gap:24px}
.n-sign{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;min-height:36px;padding:0 14px 0 10px;border-radius:999px;background:var(--btn);color:var(--btn-fg);font-size:14px;font-weight:500}
.n-type-list{margin:12px 0 0;padding:0;list-style:none;border-top:1.5px solid currentColor}
.n-type-list li{display:flex;align-items:center;gap:18px;min-height:74px;padding:14px 0;border-bottom:1px solid var(--line);font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(19px,1.7vw,25px);line-height:1.2;letter-spacing:var(--mid-track)}
.n-type-list .n-ic{color:var(--kick)}

/* ---------- downstairs ---------- */
.n-pool{overflow:hidden}
/* light, calm spa tone instead of the dark blue */
.n-spa{--spa:#E2E8E3;background:var(--spa);color:var(--ink)}
.look-a .n-spa{--spa:#DCE8EF}
.look-c .n-spa{--spa:#E2EEF6}
.n-pool-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:end;gap:24px 72px}
.n-pool-top > div{display:flex;flex-direction:column;gap:22px}
.n-giant{margin:clamp(48px,6vw,96px) 0 0;padding:0;list-style:none;border-top:1px solid var(--line)}
.n-giant li{display:flex;align-items:center;padding-block:clamp(8px,1.2vw,20px);border-bottom:1px solid var(--line);white-space:nowrap;font-family:var(--disp);font-weight:var(--giant-w);font-style:var(--giant-style);font-size:clamp(34px,7.4vw,140px);line-height:1.08;letter-spacing:var(--giant-track)}
.n-giant li:nth-child(2){justify-content:flex-end}
.n-giant .n-gw{display:inline-flex;align-items:center;gap:clamp(14px,2vw,32px)}
.n-giant .n-ic{width:.42em;height:.42em;color:var(--kick)}
.n-giant.n-wrap{padding-inline:calc(var(--gut) + clamp(16px,5vw,96px))}
.n-giant small{align-self:center;font-family:var(--text);font-style:normal;font-weight:500;font-size:clamp(14px,1.2vw,18px);letter-spacing:0;color:var(--mute)}
.n-pool-foot{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.3fr);gap:12px;margin-top:clamp(40px,5vw,72px)}
.n-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;aspect-ratio:4/5;border-radius:18px;border:1.5px dashed var(--line);font-size:14px;color:var(--mute);text-align:center;padding:12px}
.n-ph .n-ic{color:var(--kick)}
.n-pool-info{display:flex;flex-direction:column;justify-content:flex-end;gap:16px;padding:8px 0 4px clamp(0px,2vw,24px)}
.n-pool-info p{margin:0;display:flex;align-items:center;gap:10px;font-size:16px}

/* ---------- next door ---------- */
.n-area-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:start;gap:clamp(36px,6vw,104px)}
.n-area-copy{display:flex;flex-direction:column;gap:24px}
.n-also{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 0;padding:0;list-style:none}
.n-board{margin:0;border-radius:18px;padding:clamp(22px,2.6vw,36px);box-shadow:0 30px 60px -36px rgba(0,0,0,.5)}
.n-board-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:16px;border-bottom:1.5px solid var(--line);font-size:15px;font-weight:500;color:var(--kick)}
.n-board ul{margin:0;padding:0;list-style:none}
.n-board li{display:grid;grid-template-columns:28px minmax(0,auto) minmax(24px,1fr) auto;align-items:center;gap:14px;min-height:62px;border-bottom:1px solid var(--line);font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(18px,1.6vw,23px);letter-spacing:var(--mid-track)}
.n-board li .n-ic{color:var(--accent)}
.n-board li i{height:0;border-top:1.5px dotted var(--line);transform-origin:left}
.n-board li span:last-child{font-family:var(--text);font-size:14px;font-weight:500;letter-spacing:0;color:var(--mute)}
.n-board-ph{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:20px;min-height:150px;border-radius:12px;border:1.5px dashed var(--line);font-size:14px;color:var(--mute)}

/* ---------- reviews: the Wall of Love ---------- */
.n-love{padding-bottom:clamp(72px,8vw,128px)}
.n-love-body{margin-top:0}
.n-love-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:end;gap:20px clamp(32px,5vw,80px)}
.n-love-head > div{display:flex;flex-direction:column;gap:18px}
.n-love-h{margin:0;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(48px,8.4vw,150px);line-height:.98;letter-spacing:var(--disp-track)}
.look-b .n-love-h .n-wm:last-child{font-style:italic}
.n-love-body{position:relative;margin-top:clamp(40px,5vw,72px)}
/* the score stays put while the reviews slide up over it */
.n-love-pin{position:sticky;top:calc(var(--hdr) + 3vh);z-index:0;display:flex;flex-direction:column;align-items:center;gap:14px;padding:clamp(8px,2vw,24px) var(--gut) clamp(40px,5vw,72px);text-align:center}
.n-love-score{margin:0;display:flex;align-items:center;justify-content:center;gap:clamp(6px,1.4vw,22px)}
.n-love-score{font-weight:inherit}
.n-love-score b{font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(64px,10.4vw,170px);line-height:.92;letter-spacing:var(--disp-track);text-align:center}
.look-b .n-love-score b{font-style:italic}
.look-c .n-love-score b{font-size:clamp(44px,8vw,140px)}
.n-love-lau svg{display:block;width:clamp(44px,7.4vw,120px);height:auto;color:var(--accent)}
.n-love-meta{margin:clamp(10px,1.4vw,22px) 0 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 16px;font-size:clamp(15px,1.2vw,18px);color:var(--mute)}
.n-love-stars .n-stars{gap:8px;color:var(--accent)}
.n-love-stars .n-stars svg{width:clamp(20px,1.8vw,28px);height:clamp(20px,1.8vw,28px)}
.n-stars{display:flex;gap:4px;color:var(--kick)}
.n-lv-wall{position:relative;z-index:1;display:flex;align-items:flex-start;gap:clamp(14px,1.8vw,26px)}
.n-lv-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:clamp(14px,1.8vw,26px)}
.n-lv-col:nth-child(2){padding-top:clamp(80px,10vw,180px)}
.n-lv-col:nth-child(3){padding-top:clamp(30px,4vw,72px)}
.n-lv{position:relative;margin:0;display:flex;flex-direction:column;gap:22px;padding:clamp(24px,2.4vw,36px);border-radius:22px;background:var(--deep-2);color:var(--on-deep);box-shadow:0 40px 70px -40px rgba(0,0,0,.6)}
.n-lv-q{display:block;height:.5em;margin-bottom:-6px;font-family:var(--disp);font-size:88px;line-height:.9;color:var(--accent)}
.n-lv blockquote{margin:0}
.n-lv blockquote p{margin:0;font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(19px,1.5vw,22px);line-height:1.45;letter-spacing:var(--mid-track)}
.n-lv-xl blockquote p{font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(24px,2.1vw,32px);line-height:1.25;letter-spacing:var(--disp-track)}
.n-lv figcaption{display:flex;align-items:center;gap:12px;padding-top:18px;border-top:1px solid var(--line);font-size:14px;line-height:1.4;color:var(--mute)}
.n-lv figcaption b{display:block;font-size:16px;font-weight:600;color:currentColor}
.n-lv figcaption > span:last-child{display:flex;flex-direction:column;gap:2px}
.n-lv-av{flex:none;display:flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;border:1.5px dashed currentColor}
.n-lv .n-stars{color:var(--accent)}
/* warm cards for rhythm */
.n-lv-hot{background:var(--accent);color:var(--deep);--line:rgba(0,0,0,.18);--mute:var(--deep)}
.n-lv-hot .n-lv-q,.n-lv-hot .n-stars{color:var(--deep)}
.n-lv-hot figcaption{color:var(--deep)}
.n-lv-hot .tbd{background:rgba(255,255,255,.55);color:var(--deep);outline:1px dashed currentColor;outline-offset:1px}
.n-love-foot{display:flex;justify-content:center;margin-top:clamp(48px,5vw,80px)}
/* Tweak: show six reviews instead of nine (the last card of each column goes) */
.n.rev-6 [data-rev="3"],.n.rev-6 [data-rev="6"],.n.rev-6 [data-rev="9"]{display:none}

/* ---------- Skopje: a sketch map of the city, a full section that breaks the scroll ---------- */
.n-break{position:relative}
.n-break-stage{position:relative;display:flex;align-items:center;min-height:clamp(640px,62vw,900px);padding-block:clamp(64px,7vw,104px);overflow:hidden}
.n-sk{display:grid;grid-template-columns:minmax(0,4.4fr) minmax(0,7.6fr);grid-template-areas:"copy map" "list map" "cta map";grid-template-rows:auto auto 1fr;align-items:start;gap:0 clamp(32px,5vw,88px)}
.n-sk-copy{grid-area:copy;display:flex;flex-direction:column;gap:18px}
.n-break-h{margin:0;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(36px,4.4vw,72px);line-height:var(--disp-lh);letter-spacing:var(--disp-track)}
.look-b .n-break-h .n-wm:last-child{font-style:italic}
.n-sk-list{grid-area:list;margin:28px 0 0;padding:0;list-style:none;border-top:1.5px solid currentColor}
.n-sk-list li{display:flex;align-items:center;gap:14px;min-height:62px;padding:10px 0;border-bottom:1px solid var(--line)}
.n-sk-list b{display:block;font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(17px,1.35vw,20px);letter-spacing:var(--mid-track);line-height:1.25}
.n-sk-list small{display:block;font-size:14px;line-height:1.4;color:var(--mute)}
.n-sk-n{flex:none;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:var(--deep);font-size:14px;font-weight:700;font-variant-numeric:tabular-nums}
.n-sk-cta{grid-area:cta;align-self:start;margin-top:28px}
.n-sk-map{grid-area:map;position:relative;margin:0;align-self:center}
.n-sk-frame{position:relative;overflow:hidden;aspect-ratio:826/600;border-radius:28px;background:var(--deep-2);box-shadow:0 50px 90px -50px rgba(0,0,0,.7)}
.n-sk-zoom{position:absolute;inset:0}
.n-sk-zoom svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.n-sk-water{color:#8EC3E6}
.n-sk-pin{position:absolute;z-index:2;display:flex;align-items:center;gap:8px;transform:translate(-15px,-50%);white-space:nowrap}
.n-sk-pin i{flex:none;display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:var(--accent);color:var(--deep);font-style:normal;font-size:14px;font-weight:700;box-shadow:0 0 0 4px var(--deep-2)}
.n-sk-pin span{padding:3px 9px;border-radius:999px;background:rgba(0,0,0,.35);font-size:13px;font-weight:500;color:var(--on-deep)}
.n-sk-pin-l{flex-direction:row-reverse;transform:translate(calc(-100% + 15px),-50%)}
.n-sk-home{position:absolute;z-index:3;transform:translate(-50%,-50%)}
.n-sk-home b{position:relative;display:flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:50%;background:var(--on-deep);color:var(--deep)}
.n-sk-home b::before{content:"";position:absolute;inset:-10px;border-radius:50%;border:1.5px solid var(--on-deep);opacity:.5}
.n-sk-home span{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);white-space:nowrap;padding:4px 10px;border-radius:999px;background:var(--on-deep);color:var(--deep);font-size:13px;font-weight:600}
.n-sk-note{margin-top:12px;font-size:13px;color:var(--mute)}
@media (max-width:980px){
.n-sk{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "map" "list" "cta";grid-template-rows:auto}
.n-sk-map{margin-top:32px}
}
@media (max-width:700px){
.n-sk-pin span,.n-sk-home span{display:none}
.n-sk-pin,.n-sk-pin-l{transform:translate(-50%,-50%)}
.n-sk-pin i{width:24px;height:24px;font-size:12px;box-shadow:0 0 0 3px var(--deep-2)}
.n-sk-home b{width:32px;height:32px}
.n-sk-home b svg{width:16px;height:16px}
.n-sk-frame{border-radius:20px}
}

/* ---------- faq, enquire ---------- */
.n-faq{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);align-items:start;gap:40px 80px}
.n-faq-side{position:sticky;top:calc(var(--hdr) + 32px);display:flex;flex-direction:column;gap:20px}
.n-qs{border-top:1.5px solid currentColor}
.n-q{border-bottom:1px solid var(--line)}
.n-q summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:78px;padding:12px 0;cursor:pointer;font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(18px,1.4vw,21px);letter-spacing:var(--mid-track)}
.n-q summary::-webkit-details-marker{display:none}
.n-q summary .n-ic{transition:transform .45s var(--ease)}
.n-q[open] summary .n-ic{transform:rotate(45deg)}
.n-q p{margin:0;padding:0 48px 26px 0;max-width:40em;font-size:16px;line-height:1.7;color:var(--mute)}
.n-enq{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);align-items:center;gap:clamp(40px,6vw,96px)}
.n-enq-copy{display:flex;flex-direction:column;gap:26px}
.n-enq .n-h2{font-size:clamp(38px,5.4vw,88px)}
.n-enq-ctas{display:flex;flex-wrap:wrap;gap:10px}
.n-contact{margin:0;display:flex;flex-wrap:wrap;gap:6px 24px;font-size:14px;color:var(--mute)}
.n-enq .n-ap{aspect-ratio:3/4}

@media (max-width:980px){
.n-hero-copy,.n-floor,.n-pool-top,.n-area-grid,.n-faq,.n-enq,.n-love-head{grid-template-columns:minmax(0,1fr)}
.n-lv-wall{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
.n-lv-col{display:contents}
.n-floor-media,.n-faq-side{position:static}
.n-pool-foot{grid-template-columns:repeat(3,minmax(0,1fr))}
.n-pool-info{grid-column:1 / -1;padding:12px 0 0}
.n-enq .n-ap{max-width:420px}
}
@media (max-width:700px){
.n-frame{height:122vw;max-height:560px}
.n-hero .n-crop{transform:scale(1.5);transform-origin:50% 37%}
.n-hero .n-ctas{flex-direction:column;align-items:stretch}
.n-hero .n-ctas .n-btn{width:100%}
.n-hero .n-photo img{object-position:center 0%}
.n-hero .n-photo img{position:absolute;left:0;top:-19%;height:160%;object-position:50% 50%}
.n-hero-copy{padding-top:0}
.n-hero-copy{padding-top:22px}
.n-wall{grid-template-columns:repeat(2,minmax(0,1fr))}
.n-col:nth-child(3){display:none}
.n-board li{grid-template-columns:24px minmax(0,1fr) auto}
.n-board li i{display:none}
.n-q p{padding-right:0}
.n-pool-foot{gap:8px}
.n-lv-wall{grid-template-columns:minmax(0,1fr)}
.n-love-pin{top:calc(var(--hdr) + 12px)}
.n-love-score b{font-size:15vw}
.look-c .n-love-score b{font-size:10.5vw}
.n-love-lau svg{width:12vw}
}

/* ---------- hero variant: laurels either side of the letters ---------- */
.n-hv{--fs:calc(var(--mark-wide) * .6)}
.n-hero .n-k-wide{font-size:var(--fs)}
.n-hero .n-k-wide .n-k-t{font-size:1em}
/* the laurels: as tall as 1.65x the capitals, .07em clear of the word (3.012em wide), smaller if the screen is too narrow */
.n-hl-row{position:absolute;z-index:1;left:0;right:0;top:var(--ty);display:flex;align-items:center;justify-content:center;gap:.07em;font-size:var(--fs);color:var(--field-kick);pointer-events:none;transform:translateY(calc(-50% + .07em))}
.n-hl-gap{flex:none;width:3.012em}
.n-hl-side{flex:none;display:block;width:min(.75em,calc((100% - 3.012em) / 2 - .07em - 16px))}
.n-hl{display:block;width:100%;height:auto;aspect-ratio:.6}
.n-hl-l{transform-origin:100% 90%}
.n-hl-r{transform-origin:0% 90%}

@media (min-width:700.02px){.n-hv .n-frame{height:clamp(320px,28vw,500px)}}
.n-hv-fav{display:flex;align-items:center;justify-content:center;margin:0;padding:0;color:var(--field-mute);pointer-events:auto}
.n-hv-fav b{font-family:var(--text);font-weight:600;font-size:clamp(12px,1vw,14px);line-height:1.2;letter-spacing:.22em;text-transform:uppercase}
/* "Guest favourite" sits just under the bottom of the letters */
.n .n-hv .n-fav-row{position:absolute;left:0;right:0;top:calc(var(--ty) + var(--fs) * .515);margin:0;padding:0}
.n-hv-rating{margin:0 0 -6px;display:inline-flex;align-items:center;gap:10px;font-size:15px;font-weight:500;color:var(--field-mute)}
.n-hv-rating .n-stars{display:flex;gap:3px;color:var(--field-kick)}
.n-hv-rating .n-stars svg{width:18px;height:18px}
.n:not(.hv-rate) .n-hv-rating{display:none}
@media (max-width:700px){
/* phones: НЕБО on one line too, between the laurels */
.n-hv .n-k-wide{display:block}
.n-hv{--fs:calc(var(--mark-wide) * .66)}
.n-hv .n-frame{height:52vw;max-height:300px}
.n-hv .n-photo img{top:-58%}
}

.n-gl-stage{padding-block:clamp(56px,6vw,96px)}
.n-gl-note{margin:0 0 20px;font-size:14px;color:var(--mute)}
.n-gl{background:var(--deep);color:var(--on-deep);--kick:var(--accent);--mute:var(--on-deep-mute);--line:var(--deep-line);--btn:var(--accent);--btn-fg:var(--deep);--btn-hover:var(--on-deep);--btn-hover-fg:var(--deep);--focus:var(--accent)}
.n.gl-sand .n-gl{background:var(--accent);color:var(--deep);--kick:var(--deep);--mute:var(--deep);--line:rgba(0,0,0,.16);--btn:var(--deep);--btn-fg:var(--paper);--btn-hover:var(--ink);--btn-hover-fg:var(--paper);--focus:var(--deep)}
.n-gl-style{display:none}
.n.gl-ticker .n-gl-ticker,.n.gl-book .n-gl-book,.n.gl-badges .n-gl-badges{display:block}
.n:not(.gl-six) .n-gl-x{display:none!important}
.n:not(.gl-rate) .n-gl-r{display:none!important}

/* rating cell, shared */
.n-gl-rate{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.n-gl-lau{width:15px;height:30px;color:var(--kick)}
.n-gl-rate b{font-family:var(--disp);font-weight:var(--disp-w);font-size:26px;letter-spacing:-.02em;line-height:1}
.n-gl-rate small{display:block;font-size:12px;font-weight:600;letter-spacing:.04em;line-height:1.2}
.n-gl-rate > span{display:flex;flex-direction:column;align-items:center;padding:0 4px}

/* A. ticker */
.n-gl-tk{position:relative;display:flex;align-items:center;min-height:84px;overflow:hidden}
.n-gl-track{display:flex;flex:none;width:max-content;animation:n-gl-run 36s linear infinite}
.n-gl-tk:hover .n-gl-track,.n-gl-tk:focus-within .n-gl-track,.n.gl-paused .n-gl-track{animation-play-state:paused}
@keyframes n-gl-run{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.n-gl-track{animation:none}.n-gl-pause{display:none!important}}
.n-gl-run{display:flex;align-items:center;flex:none}
.n-gl-run > span{display:inline-flex;align-items:center;gap:14px;padding:0 28px;white-space:nowrap;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(24px,2.4vw,36px);letter-spacing:var(--disp-track)}
.look-b .n-gl-run > span em{font-style:italic}
.n-gl-run > span em{font-style:normal}
.n-gl-run .n-ic{color:var(--kick)}
.n-gl-run .n-gl-sep{padding:0;color:var(--kick);font-size:20px}
.n-gl-pause{position:absolute;right:12px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:var(--deep);color:inherit;cursor:pointer}
.n.gl-sand .n-gl-pause{background:var(--accent)}
.n-gl-pause .n-gl-play{display:none}
.n.gl-paused .n-gl-pause .n-gl-play{display:block}
.n.gl-paused .n-gl-pause .n-gl-stop{display:none}

/* B. bar + booking */
.n-gl-bk{display:flex;align-items:stretch;max-width:1600px;margin:0 auto;padding:0 var(--gut)}
.n-gl-bk ul{flex:1;display:flex;margin:0;padding:0;list-style:none}
.n-gl-bk li{flex:1 1 auto;display:flex;align-items:center;justify-content:center;gap:10px;min-height:76px;padding:12px 14px;border-left:1px solid var(--line);font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(15px,1.15vw,18px);letter-spacing:var(--mid-track);white-space:nowrap}
.n-gl-bk li:first-child{border-left:0;padding-left:0;justify-content:flex-start}
.n-gl-bk li .n-ic{color:var(--kick)}
.n-gl-cta{flex:none;display:flex;align-items:center;gap:18px;padding-left:24px;border-left:1px solid var(--line)}
.n-gl-cta p{margin:0;font-size:14px;line-height:1.3;color:var(--mute)}
.n-gl-cta p b{display:block;font-family:var(--disp);font-weight:var(--disp-w);font-size:22px;color:var(--on-deep);letter-spacing:-.01em}
.n.gl-sand .n-gl-cta p b{color:var(--deep)}
.n-gl-cta .n-btn{min-height:46px;padding:0 20px}

/* C. icon badges */
.n-gl-bd{display:flex;align-items:flex-start;justify-content:center;flex-wrap:wrap;gap:24px clamp(20px,3.4vw,56px);max-width:1600px;margin:0 auto;padding:30px var(--gut) 28px;list-style:none}
.n-gl-bd li{display:flex;flex-direction:column;align-items:center;gap:10px;min-width:96px;text-align:center;font-size:15px;font-weight:500;line-height:1.3}
.n-gl-bd li > i{display:flex;align-items:center;justify-content:center;width:60px;height:60px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--line);color:var(--kick)}
.n-gl-bd li.n-gl-r > i{width:auto;padding:0 6px;border-radius:999px}

@media (min-width:1100.02px){
.n.gl-six .n-gl-bk ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.n.gl-six .n-gl-bk li{justify-content:flex-start;padding-left:22px}
.n.gl-six .n-gl-bk li:nth-child(4n+1){border-left:0;padding-left:0;justify-content:flex-start}
.n.gl-six .n-gl-bk li:nth-child(n+5){border-top:1px solid var(--line)}
}
@media (max-width:1100px){
.n-gl-bk{flex-direction:column}
.n-gl-bk ul{flex-wrap:wrap}
.n-gl-bk li{flex:1 1 40%;justify-content:flex-start;padding-left:0;border-left:0;border-bottom:1px solid var(--line);min-height:58px;white-space:normal}
.n-gl-cta,.n.gl-six .n-gl-cta{padding:16px 0 20px;border-left:0;border-top:0;justify-content:space-between}
}
@media (max-width:520px){
.n-gl-cta{flex-direction:column;align-items:stretch}
.n-gl-cta .n-btn{width:100%}
.n-gl-bd{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}
}

/* Lift. --lp is the car's trip from the apartment (0) down to the mall (1); it follows the scroll position
   (see the motion block at the end). Without scroll-driven animations it stays 0: the car waits on the top floor.
   The two floors are made the same height so the floor marks can sit between their middles. */
@property --lp1{syntax:'<number>';inherits:true;initial-value:0}
@property --lp2{syntax:'<number>';inherits:true;initial-value:0}
.n-ld{position:relative;display:grid;grid-auto-rows:1fr;--rw:clamp(150px,13vw,190px);--rg:clamp(28px,4vw,64px);--lp:calc(var(--lp1) + var(--lp2));--up:clamp(0,(.5 - var(--lp)) * 1000,1);--mv:calc(clamp(0,(var(--lp) - .06) * 1000,1) * clamp(0,(.94 - var(--lp)) * 1000,1))}
.n-ld-sec{position:relative;min-height:600px;display:flex;align-items:center;padding-block:clamp(56px,5vw,80px)}
.n-ld-up{background:var(--deep);color:var(--on-deep);--kick:var(--accent);--mute:var(--on-deep-mute);--line:var(--deep-line);--card:var(--deep-2);--focus:var(--accent)}
.n-ld-down{background:var(--warm);color:var(--ink)}
.n-ld-in{width:100%;max-width:1360px;margin:0 auto;padding-inline:calc(var(--gut) + var(--rw) + var(--rg)) var(--gut);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);align-items:center;gap:clamp(28px,4vw,64px)}
.n-ld-txt{display:flex;flex-direction:column;gap:14px}
.n-ld-h{margin:0;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(36px,4vw,64px);line-height:var(--disp-lh);letter-spacing:var(--disp-track);text-wrap:balance}
.look-b .n-ld-h .n-wm:last-child{font-style:italic}
.n-ld-txt > p{margin:0;max-width:30em;font-size:clamp(16px,1.2vw,18px);line-height:1.7;color:var(--mute)}
.n-ld-list{margin:6px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
.n-ld-list li{display:flex;align-items:center;gap:12px;min-height:46px;padding:6px 0;border-bottom:1px solid var(--line);font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(16px,1.25vw,19px);line-height:1.25;letter-spacing:var(--mid-track)}
.n-ld-list .n-ic{color:var(--kick)}
.n-ld-media{position:relative;margin:0;aspect-ratio:5/4;overflow:hidden;border-radius:24px;background:var(--card)}
.n-ld-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.n-ld-ph{display:flex;align-items:center;justify-content:center;gap:10px;background:transparent;border:1.5px dashed var(--line);font-size:14px;color:var(--mute)}
.n-ld-ph .n-ic{color:var(--kick)}

/* the shaft runs down through both sections; the lift panel is the car */
.n-ld-rail{position:absolute;z-index:2;top:0;bottom:0;left:max(var(--gut), calc((100% - 1360px) / 2 + var(--gut)));width:var(--rw);pointer-events:none;overflow-x:visible;overflow-y:clip}
.n-ld-rail::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;margin-left:-1px;background:repeating-linear-gradient(to bottom,rgba(150,150,150,.55) 0 7px,transparent 7px 14px)}
.n-ld-stop{position:absolute;z-index:1;left:calc(max(var(--gut), calc((100% - 1360px) / 2 + var(--gut))) + var(--rw) / 2);display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:1.5px solid rgba(150,150,150,.6);background:inherit;font-size:13px;font-weight:700;letter-spacing:.06em;color:rgba(150,150,150,.95)}
.n-ld-panel{position:sticky;top:calc(50vh - 209px);pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:20px;padding:20px 16px 24px;border-radius:999px 999px 28px 28px;background:var(--deep-2);color:var(--on-deep);--line:var(--deep-line);--mute:var(--on-deep-mute);--focus:var(--accent);box-shadow:0 40px 70px -30px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.08);will-change:transform}
.n-ld-disp{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;width:100%;aspect-ratio:1/1;border-radius:50%;background:#0E1418;color:#F3B37A;overflow:hidden;font-variant-numeric:tabular-nums}
.n-ld-dir{display:flex;height:22px;transition:opacity .3s,transform .3s var(--ease)}
.n-ld-dir .n-ic{width:22px;height:22px}
.n-ld-dir{opacity:calc(.25 + .75 * var(--mv))}
.n-ld-num{position:relative;display:block;height:1em;overflow:hidden;font-family:var(--text);font-size:clamp(34px,3vw,46px);font-weight:700;line-height:1;letter-spacing:.04em;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent)}
.n-ld-strip{display:flex;flex-direction:column;align-items:center;transform:translateY(calc(var(--lp) * -13em))}
.n-ld-strip > span{display:block;height:1em;text-align:center}
/* lights of the floors you pass, sweeping up the display while the car goes down */
.n-ld-disp::after{content:"";position:absolute;left:0;right:0;height:40%;top:100%;background:linear-gradient(to bottom,transparent,rgba(243,179,122,.22),transparent);opacity:0;pointer-events:none}
@media (prefers-reduced-motion:no-preference){
.n-ld-disp::after{opacity:var(--mv);animation:n-ld-pass .55s linear infinite}
}
@keyframes n-ld-pass{from{top:100%}to{top:-40%}}
/* the cable the car hangs from (cut off at the top of the shaft), and the floor marks along the shaft */
.n-ld-panel::before{content:"";position:absolute;bottom:100%;left:50%;width:2px;height:300vh;margin-left:-1px;background:linear-gradient(to bottom,rgba(150,150,150,.3),rgba(150,150,150,.9))}
.n-ld-ticks{position:absolute;left:50%;top:25%;bottom:25%;width:0;display:flex;flex-direction:column;justify-content:space-between;align-items:center}
/* a mark lights up once the car has passed that floor */
.n-ld-ticks i{--on:clamp(0,(var(--lp) * 13 - var(--i,0)) * 1000 + 1,1);display:block;width:calc(14px + 8px * var(--on));height:2px;border-radius:2px;background:color-mix(in srgb,var(--accent) calc(var(--on) * 100%),rgba(150,150,150,.6))}
.n-ld-ticks i:nth-child(2){--i:1}.n-ld-ticks i:nth-child(3){--i:2}.n-ld-ticks i:nth-child(4){--i:3}.n-ld-ticks i:nth-child(5){--i:4}.n-ld-ticks i:nth-child(6){--i:5}.n-ld-ticks i:nth-child(7){--i:6}.n-ld-ticks i:nth-child(8){--i:7}.n-ld-ticks i:nth-child(9){--i:8}.n-ld-ticks i:nth-child(10){--i:9}.n-ld-ticks i:nth-child(11){--i:10}.n-ld-ticks i:nth-child(12){--i:11}.n-ld-ticks i:nth-child(13){--i:12}
.n-ld-ticks i:first-child,.n-ld-ticks i:last-child{visibility:hidden}
/* lift doors over each floor's picture: shut while the car is between floors, open when it arrives */
/* --shut: 0 open, 1 closed. The apartment's doors close as the car leaves; the mall's open as it arrives. */
.n-ld-door{display:none;position:absolute;z-index:2;top:0;bottom:0;width:50.5%;background:linear-gradient(90deg,#9AA3AA,#C9CFD3 45%,#8D969D);box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)}
.n-ld-up{--shut:clamp(0,(var(--lp) - .04) / .14,1)}
.n-ld-down{--shut:clamp(0,(.96 - var(--lp)) / .14,1)}
.n-ld-door::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:rgba(0,0,0,.25)}
.n-ld-door-l{left:0;transform:translateX(calc(-101% * (1 - var(--shut))))}
.n-ld-door-l::after{right:0}
.n-ld-door-r{right:0;transform:translateX(calc(101% * (1 - var(--shut))))}
.n-ld-door-r::after{left:0}
.n-ld-name{display:grid;justify-items:center;font-size:12px;font-weight:700;letter-spacing:.18em}
.n-ld-name > span{grid-area:1 / 1;opacity:var(--up)}
.n-ld-name > span + span{opacity:calc(1 - var(--up))}
.n-ld-btns{display:flex;flex-direction:column;align-items:center;gap:14px}
/* the button for the floor the car is on is lit */
.n-ld-btn{--a:var(--up);display:flex;flex-direction:column;align-items:center;gap:8px;color:inherit;text-decoration:none}
.n-ld-btn[data-go="down"]{--a:calc(1 - var(--up))}
.n-ld-btn i{display:flex;align-items:center;justify-content:center;width:62px;height:62px;border-radius:50%;border:1.5px solid var(--line);transition:background-color .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease),color .35s var(--ease)}
.n-ld-btn > span{font-size:14px;font-weight:500;color:var(--mute)}
.n-ld-btn:hover i{border-color:currentColor}
.n-ld-btn i{background:color-mix(in srgb,var(--accent) calc(var(--a) * 100%),transparent);border-color:color-mix(in srgb,var(--accent) calc(var(--a) * 100%),var(--line));color:color-mix(in srgb,var(--deep) calc(var(--a) * 100%),var(--on-deep));box-shadow:0 0 0 calc(var(--a) * 6px) color-mix(in srgb,var(--accent) 28%,transparent)}
.n-ld-btn:hover i{border-color:color-mix(in srgb,var(--accent) calc(var(--a) * 100%),currentColor)}
.n-ld-btn > span{color:color-mix(in srgb,var(--on-deep) calc(var(--a) * 100%),var(--mute))}
.n-ld-btn:focus-visible{outline:none}
.n-ld-btn:focus-visible i{outline:2px solid var(--focus);outline-offset:4px}

@media (max-width:900px){
.n-ld{--rw:0px;--rg:0px}
.n-ld-sec{min-height:0;padding-top:116px;padding-bottom:48px;align-items:flex-start}
.n-ld-in{grid-template-columns:minmax(0,1fr)}
.n-ld-media{order:-1;aspect-ratio:16/9}
.n-ld-rail{left:0;right:0;width:auto}
.n-ld-rail::before,.n-ld-stop,.n-ld-panel::before,.n-ld-ticks{display:none}
.n-ld-panel{top:calc(var(--hdr) + 10px);flex-direction:row;justify-content:space-between;gap:12px;width:calc(100% - 2 * var(--gut));max-width:420px;margin:14px auto 0;padding:10px 12px;border-radius:999px}
.n-ld-disp{flex:none;flex-direction:row;gap:6px;width:auto;height:56px;aspect-ratio:auto;padding:0 16px;border-radius:999px}
.n-ld-num{font-size:24px}
.n-ld-name{font-size:11px}
.n-ld-btns{flex-direction:row;gap:10px}
.n-ld-btn{flex-direction:row;gap:8px}
.n-ld-btn i{width:48px;height:48px}
}
@media (max-width:420px){
.n-ld-btn > span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.n-ld-list{grid-template-columns:minmax(0,1fr)}
}

.n-ev{--spa:#E2E8E3;background:var(--spa);color:var(--ink);padding-block:clamp(72px,8vw,128px)}
.n.tone-pool .n-ev{--spa:#DCE8EF}
.n.look-c.tone-pool .n-ev{--spa:#E2EEF6}
.n.tone-night .n-ev{background:var(--deep);color:var(--on-deep);--kick:var(--accent);--mute:var(--on-deep-mute);--line:var(--deep-line);--btn:var(--accent);--btn-fg:var(--deep);--btn-hover:var(--on-deep);--btn-hover-fg:var(--deep);--focus:var(--accent)}
.n.tone-night .n-ev .tbd{background:transparent;color:var(--accent);outline:1px dashed currentColor;outline-offset:1px}
.n-ev-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:end;gap:20px clamp(32px,5vw,80px)}
.n-ev-head > div{display:flex;flex-direction:column;gap:20px}
.n-ev-side{align-items:flex-start}
/* line the button's bottom up with the bottom of the title (the ripple sits below both) */
@media (min-width:980.02px){.n-ev-side{margin-bottom:38px}}
.n .n-ev-btn{min-height:58px;padding:0 32px;font-size:17px}
@media (max-width:700px){.n .n-ev-btn{width:100%;min-height:60px}}
/* a slow ripple under the title, like the pool surface */
.n-ev-wave{display:block;width:clamp(160px,18vw,260px);height:18px;overflow:hidden;color:var(--kick)}
.n-ev-wave svg{display:block;width:200%;height:100%;animation:n-ev-ripple 4s linear infinite}
@keyframes n-ev-ripple{to{transform:translateX(-25%)}}
.n-ev-sign .n-ic{animation:n-ev-bob 2.4s var(--ease) infinite}
@keyframes n-ev-bob{0%,100%{transform:translateY(-2px)}50%{transform:translateY(3px)}}
@media (prefers-reduced-motion:reduce){.n-ev-wave svg,.n-ev-sign .n-ic{animation:none}}
.n-ev-sign{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;min-height:36px;padding:0 14px 0 10px;border-radius:999px;border:1.5px solid var(--line);font-size:14px;font-weight:500;color:var(--kick)}
.n-ev-h{margin:0;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(44px,6.4vw,112px);line-height:1;letter-spacing:var(--disp-track)}
.look-b .n-ev-h .n-wm:last-child{font-style:italic}
.n-ev-steps{margin:clamp(48px,6vw,96px) 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,40px);align-items:start}
.n.ev-stagger .n-ev-step:nth-child(2){margin-top:clamp(48px,7vw,120px)}
.n.ev-stagger .n-ev-step:nth-child(3){margin-top:clamp(16px,2.4vw,40px)}
.n-ev-step{display:flex;flex-direction:column;gap:6px}
.n-ev-arch{position:relative;display:flex;align-items:center;justify-content:center;aspect-ratio:3/4;margin-bottom:18px;overflow:hidden;border-radius:999px 999px 22px 22px;background:var(--g);color:#fff}
.n.ev-rounded .n-ev-arch{border-radius:24px;aspect-ratio:4/5}
.n.ev-circles .n-ev-arch{border-radius:50%;aspect-ratio:1/1;width:88%}
.n-ev-arch::after{content:"";position:absolute;inset:-40% -20%;background:radial-gradient(ellipse 40% 12% at 30% 40%,rgba(255,255,255,.28),transparent 70%),radial-gradient(ellipse 30% 9% at 70% 62%,rgba(255,255,255,.22),transparent 70%),radial-gradient(ellipse 35% 10% at 45% 82%,rgba(255,255,255,.18),transparent 70%);animation:n-ev-shimmer 9s ease-in-out infinite alternate}
@keyframes n-ev-shimmer{from{transform:translate3d(-4%,-3%,0)}to{transform:translate3d(4%,3%,0)}}
@media (prefers-reduced-motion:reduce){.n-ev-arch::after{animation:none}}
.n-ev-arch .n-ic{position:relative;z-index:1;width:clamp(44px,5vw,72px);height:clamp(44px,5vw,72px)}
.n-ev-tag{position:absolute;z-index:1;left:50%;bottom:18px;transform:translateX(-50%);white-space:nowrap;padding:5px 12px;border-radius:999px;background:rgba(0,0,0,.58);color:#fff;font-size:13px;font-weight:500}
.n-ev-pool{--g:linear-gradient(180deg,#A9D3E8 0%,#4C8FB5 100%)}
.n-ev-sauna{--g:linear-gradient(180deg,#E6C29B 0%,#9C6640 100%)}
.n-ev-gym{--g:linear-gradient(180deg,#D3CEC6 0%,#7F786E 100%)}
.n-ev-n{margin:0;font-size:14px;font-weight:600;letter-spacing:.08em;color:var(--kick);font-variant-numeric:tabular-nums}
.n-ev-step h3{margin:0;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 14px;font-family:var(--disp);font-weight:var(--giant-w);font-style:var(--giant-style);font-size:clamp(40px,4.6vw,76px);line-height:1.02;letter-spacing:var(--giant-track)}
.n-ev-step h3 small{font-family:var(--text);font-style:normal;font-weight:500;font-size:clamp(14px,1.1vw,16px);letter-spacing:0;color:var(--mute)}
.n-ev-line{margin:6px 0 0;max-width:24em;font-size:16px;line-height:1.6;color:var(--mute)}
.n.ev-titles .n-ev-line{display:none}
.n-ev-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;margin-top:clamp(48px,5vw,80px);padding-top:28px;border-top:1px solid var(--line)}
.n-ev-facts{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
@media (max-width:980px){
.n-ev-head{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:700px){
.n-ev-steps{grid-template-columns:minmax(0,1fr);gap:40px}
.n.ev-stagger .n-ev-step:nth-child(n){margin-top:0}
.n-ev-arch{aspect-ratio:4/3;border-radius:50% 50% 22px 22px / 46% 46% 22px 22px}
.n.ev-rounded .n-ev-arch{aspect-ratio:4/3}
.n.ev-circles .n-ev-arch{width:72%;aspect-ratio:1/1}
}

/* ---------- V5: meet your host (closing CTA) ---------- */
.n-hc{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;gap:clamp(40px,6vw,104px)}
.n-hc-copy{display:flex;flex-direction:column;gap:26px}
.n-hc .n-h2{font-size:clamp(38px,5.4vw,88px)}
.n-hc-q{margin:0;padding-left:18px;border-left:2px solid var(--accent)}
.n-hc-q p{margin:0;font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(18px,1.4vw,21px);line-height:1.45;letter-spacing:var(--mid-track)}
.n-hc-q footer{margin-top:6px;font-size:14px;color:var(--mute)}
.n-hc-ctas{display:flex;flex-wrap:wrap;gap:10px}
.n .n-hc-ctas .n-btn:first-child{min-height:60px;padding:0 30px;font-size:17px}
.n-hc-card{position:relative;margin:0;padding:12px 12px 22px;border-radius:28px;background:var(--deep-2);color:var(--on-deep);box-shadow:0 50px 90px -50px rgba(0,0,0,.7)}
.n-hc-photo{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;aspect-ratio:4/4.4;border-radius:20px;border:1.5px dashed currentColor;background:rgba(255,255,255,.04);color:var(--mute);font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.n-hc-badge{position:absolute;left:16px;bottom:16px;display:inline-flex;align-items:center;gap:7px;padding:8px 14px 8px 11px;border-radius:999px;background:var(--accent);color:var(--deep);font-size:14px;font-weight:600;letter-spacing:0;text-transform:none}
.n-hc-name{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;padding:20px 10px 0}
.n-hc-name b{font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(28px,2.4vw,36px);line-height:1.05;letter-spacing:var(--disp-track)}
.n-hc-name span{font-size:14px;color:var(--mute)}
.n-hc-stats{margin:18px 10px 0;padding:16px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));list-style:none;border-top:1px solid var(--line)}
.n-hc-stats li{display:flex;flex-direction:column;gap:3px;padding:0 6px}
.n-hc-stats li + li{border-left:1px solid var(--line);padding-left:16px}
.n-hc-stats b{font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(22px,1.9vw,28px);line-height:1.1;color:var(--accent)}
.n-hc-stats span{font-size:13px;line-height:1.35;color:var(--mute)}
@media (max-width:980px){
.n-hc{grid-template-columns:minmax(0,1fr)}
.n-hc-card{max-width:440px}
}
/* the three contact buttons stay on one row (phones keep the full-width stack below) */
@media (min-width:700.02px){.n-hc-ctas{flex-wrap:nowrap}}
@media (min-width:700.02px) and (max-width:980px){.n .n-hc-ctas .n-btn,.n .n-hc-ctas .n-btn:first-child{padding:0 18px;font-size:16px}}
/* tablets: keep Svetlana's card beside the words, as on desktop, instead of below the fold */
@media (min-width:700.02px) and (max-width:980px){
.n-hc{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:center;gap:32px}
.n-hc-card{max-width:none;padding:10px 10px 18px;border-radius:24px}
.n-hc-photo{aspect-ratio:4/4.2;border-radius:16px}
.n-hc-name{padding:16px 8px 0}
.n-hc-name b{font-size:24px}
.n-hc-stats{margin:14px 8px 0;padding-top:12px}
.n-hc-stats li + li{padding-left:10px}
.n-hc-stats b{font-size:20px}
.n-hc-stats span{font-size:12px}
}
@media (max-width:700px){
.n-hc-ctas{flex-direction:column;align-items:stretch}
.n-hc-ctas .n-btn{width:100%}
.n-hc-card{max-width:none}
.n-hc-photo{aspect-ratio:4/3.4}
.n-hc-stats li + li{padding-left:10px}
}

/* ---------- V5: FAQ motion ---------- */
.n-qs{position:relative;border-top:0}
.n-qs::before{content:"";position:absolute;left:0;right:0;top:0;height:1.5px;background:currentColor;transform:scaleX(var(--rule,1));transform-origin:0 50%}
.n-q{position:relative;border-bottom:0}
.n-q::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);transform:scaleX(var(--ln,1));transform-origin:0 50%}
.n-q-ic{flex:none;display:flex}
.n-q-a{display:block}
.n-faq-mark{display:block;margin-top:clamp(8px,2vw,28px);font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(150px,17vw,280px);line-height:.8;color:transparent;-webkit-text-stroke:1.5px var(--kick);opacity:.55;transform-origin:30% 80%;user-select:none}
.look-b .n-faq-mark{font-style:italic}
@media (prefers-reduced-motion:no-preference){
.n-q summary{transition:padding-left .45s var(--ease),color .3s var(--ease)}
.n-q summary:hover{padding-left:12px;color:var(--kick)}
.n-q summary:hover .n-ic{transform:rotate(90deg)}
.n-q[open] summary:hover .n-ic{transform:rotate(45deg)}
}
@media (max-width:980px){.n-faq-mark{display:none}}

.n-vs{position:relative;overflow:hidden;padding-block:clamp(80px,9vw,150px);color:#1F2A33;--kick:#7A3B1E;--mute:#3B2A22;--line:rgba(31,42,51,.2);--btn:#1F2A33;--btn-fg:#FFF8EE;--btn-hover:#7A3B1E;--btn-hover-fg:#FFF8EE;--focus:#1F2A33;
background:radial-gradient(circle at 1px 1px,rgba(31,42,51,.14) 1px,transparent 1.6px) 0 0/18px 18px,radial-gradient(120% 90% at 85% 20%,#FFD7A8 0%,rgba(255,215,168,0) 55%),linear-gradient(135deg,#F6B48A 0%,#F39C86 48%,#F7C59F 100%)}
.n.vs-sand .n-vs{background:radial-gradient(circle at 1px 1px,rgba(31,42,51,.12) 1px,transparent 1.6px) 0 0/18px 18px,var(--accent)}
.n.vs-dark .n-vs{background:radial-gradient(circle at 1px 1px,rgba(255,255,255,.08) 1px,transparent 1.6px) 0 0/18px 18px,var(--deep);color:var(--on-deep);--kick:var(--accent);--mute:var(--on-deep-mute);--line:var(--deep-line);--btn:var(--accent);--btn-fg:var(--deep);--btn-hover:var(--on-deep);--btn-hover-fg:var(--deep);--focus:var(--accent)}
.n-vs-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(40px,6vw,104px)}
.n-vs-copy{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:22px}
.n-vs-h{margin:0;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(44px,6vw,104px);line-height:1;letter-spacing:var(--disp-track)}
.look-b .n-vs-h .n-wm:nth-last-child(-n+2){font-style:italic}
.n .n-vs-btn{min-height:58px;padding:0 30px;font-size:17px}

/* the guidebook */
.n-vs-book{justify-self:center;perspective:1400px;width:min(100%,420px)}
.n-vs-cover{position:relative;aspect-ratio:3/4;border-radius:6px 18px 18px 6px;background:#F4EBDD;color:#1F2A33;--cv:#1F2A33;box-shadow:-14px 0 0 -6px #C9B79E inset,0 50px 90px -40px rgba(0,0,0,.75),0 0 0 1px rgba(0,0,0,.06);transform:rotateY(-14deg) rotateX(4deg);transform-style:preserve-3d;overflow:hidden}
.n-vs-cover::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,0) 35%,rgba(0,0,0,.06) 100%);pointer-events:none}
.n-vs-cv{position:absolute;inset:0;display:flex;flex-direction:column;padding:clamp(22px,2.6vw,34px) clamp(22px,2.6vw,34px) clamp(22px,2.6vw,34px) clamp(30px,3.2vw,44px)}
.n-vs-top{display:flex;justify-content:space-between;align-items:center;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.n-vs-title{margin-top:auto;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(46px,5vw,76px);line-height:.95;letter-spacing:var(--disp-track)}
.look-b .n-vs-title i{font-style:italic}
.n-vs-title i{font-style:normal;display:block}
.n-vs-year{font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(84px,10vw,150px);line-height:.82;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px var(--cv)}
.n-vs-sub{margin-top:14px;padding-top:14px;border-top:1.5px solid currentColor;font-size:13px;line-height:1.45;font-weight:500}
.n-vs-river{position:absolute;right:-10%;top:18%;width:85%;height:auto;opacity:.5;color:#6EA6CC}
.n-vs-stamp{position:absolute;right:clamp(18px,2vw,28px);top:30%;display:flex;flex-direction:column;align-items:center;justify-content:center;width:92px;height:92px;border-radius:50%;border:1.5px dashed currentColor;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;line-height:1.3;text-align:center;transform:rotate(-12deg)}

/* stickers around the book */
.n-vs-book{position:relative}
.n-vs-stk{position:absolute;z-index:2;display:inline-flex;align-items:center;gap:8px;padding:9px 15px 9px 11px;border-radius:999px;background:#FFF8EE;color:#1F2A33;font-size:14px;font-weight:600;white-space:nowrap;box-shadow:0 14px 28px -14px rgba(60,20,0,.45),0 0 0 1px rgba(31,42,51,.06);transform:rotate(var(--r,0deg))}
.n-vs-stk .n-ic{color:#C2502D}
.n-vs-stk-in{display:inline-flex;align-items:center;gap:8px;animation:n-vs-bob var(--d,4s) ease-in-out 3 alternate}
@keyframes n-vs-bob{from{transform:translateY(-4px)}to{transform:translateY(5px)}}
.n-vs-doodle{position:absolute;left:calc(100% - 40px);top:58%;width:clamp(120px,14vw,200px);height:auto;color:currentColor;opacity:.85;pointer-events:none}
.n-vs-spark{position:absolute;color:#FFF8EE}
@media (max-width:860px){
.n-vs-stk{font-size:12px;padding:7px 12px 7px 9px}
.n-vs-stk:nth-of-type(3),.n-vs-stk:nth-of-type(5){display:none}
.n-vs-stk:nth-of-type(1){left:-10%!important;top:-3%!important}
.n-vs-stk:nth-of-type(2){left:46%!important;top:-8%!important}
.n-vs-stk:nth-of-type(4){left:40%!important;top:94%!important}
.n-vs-doodle{display:none}
}
@media (prefers-reduced-motion:reduce){.n-vs-stk-in{animation:none}}
@media (max-width:860px){
.n-vs-in{grid-template-columns:minmax(0,1fr)}
.n-vs-book{order:-1;width:min(76%,340px)}
.n .n-vs-btn{width:100%}
.n-vs-stamp{top:15%;width:66px;height:66px;font-size:9px}
}
@media (prefers-reduced-motion:reduce){.n-vs-cover{transform:none}}
.n-vs-copy .n-p{max-width:27em}
.look-c .n-vs-title{font-size:clamp(34px,3.6vw,56px)}
.look-c .n-vs-year{font-size:clamp(60px,7.4vw,112px)}

/* ---------- conversion variants ---------- */
.n-cv{position:relative;padding-block:clamp(72px,7vw,112px)}
.n-cv + .n-cv{border-top:1px solid var(--line)}
.n-cv-tag{position:absolute;top:18px;left:var(--gut);display:inline-flex;align-items:center;gap:8px;min-height:28px;padding:0 12px;border-radius:999px;background:#1B1A17;color:#fff;font-size:12px;font-weight:600;letter-spacing:.04em;z-index:3}
.n-cv-h{margin:0;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(38px,4.6vw,76px);line-height:var(--disp-lh);letter-spacing:var(--disp-track);text-wrap:balance}
.look-b .n-cv-h .n-wm:last-child{font-style:italic}
.n-cv-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:12px 22px}
.n .n-cv-ctas .n-btn:first-child{min-height:58px;padding:0 28px;font-size:17px}
.n-cv-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:500;color:inherit;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1.5px}
.n-cv-link .n-ic{transition:transform .3s var(--ease)}
.n-cv-link:hover .n-ic{transform:translateX(4px)}
.n-cv .n-btn .n-go{transition:transform .3s var(--ease)}
.n-cv .n-btn:hover .n-go{transform:translateX(4px)}
.n-cv-micro{margin:0;font-size:14px;color:var(--mute)}

/* A: lead with the free guide */
.n-cv-a{background:var(--field);color:var(--field-ink);--kick:var(--field-kick);--mute:var(--field-mute);--line:var(--field-line);--btn:var(--field-btn);--btn-fg:var(--field-btn-fg);--btn-hover:var(--field-ink);--btn-hover-fg:var(--field)}
.n-cv-a .n-wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:clamp(32px,6vw,96px)}
.n-cv-copy{display:flex;flex-direction:column;gap:22px}
.n-cv-badge{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 14px 0 10px;border-radius:999px;background:var(--accent);color:#1B1A17;font-size:14px;font-weight:600}
.n-cv-ticks{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.n-cv-ticks li{display:flex;align-items:flex-start;gap:12px;font-size:clamp(16px,1.25vw,19px);line-height:1.45}
.n-cv-ticks .n-ic{flex:none;margin-top:2px;color:var(--kick)}
.n-cv-ticks b{font-weight:600}
.n-cv-a .n-vs-book{width:min(100%,380px)}
.n-cv-a .n-vs-stamp{background:var(--accent);border-style:solid;border-color:var(--accent);color:#1B1A17}

/* B: pick your trip */
.n-cv-b{background:var(--paper);color:var(--ink)}
.n-cv-b-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 48px;margin-bottom:clamp(32px,4vw,56px)}
.n-cv-b-head > div{display:flex;flex-direction:column;gap:14px}
.n-cv-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.8vw,24px)}
.n-cv-card{position:relative;display:flex;flex-direction:column;gap:18px;padding:clamp(24px,2.4vw,34px);border-radius:24px;background:var(--warm);color:inherit;text-decoration:none;transition:transform .45s var(--ease),box-shadow .45s var(--ease),background-color .45s var(--ease)}
.n-cv-card:hover{transform:translateY(-6px);box-shadow:0 30px 60px -30px rgba(0,0,0,.35)}
.n-cv-card:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.n-cv-card-ic{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--accent);color:#1B1A17}
.n-cv-card h3{margin:0;font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(26px,2.4vw,36px);line-height:1.05;letter-spacing:var(--disp-track)}
.n-cv-card ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column}
.n-cv-card li{padding:10px 0;border-top:1px solid var(--line);font-size:16px;line-height:1.4;color:var(--mute)}
.n-cv-card-go{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-weight:600}
.n-cv-card-go .n-ic{transition:transform .3s var(--ease)}
.n-cv-card:hover .n-cv-card-go .n-ic{transform:translateX(5px)}
.n-cv-card.is-dark{background:var(--deep);color:var(--on-deep);--mute:var(--on-deep-mute);--line:var(--deep-line)}

/* C: come for the city, stay for the view */
.n-cv-c{background:var(--deep);color:var(--on-deep);--kick:var(--accent);--mute:var(--on-deep-mute);--line:var(--deep-line);--btn:var(--accent);--btn-fg:var(--deep);--btn-hover:var(--on-deep);--btn-hover-fg:var(--deep);--focus:var(--accent)}
.n-cv-c .n-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(32px,6vw,96px)}
.n-cv-days{margin:0;padding:0;list-style:none;position:relative;display:flex;flex-direction:column;gap:14px}
.n-cv-days::before{content:"";position:absolute;left:23px;top:24px;bottom:24px;width:2px;background:repeating-linear-gradient(to bottom,var(--accent) 0 6px,transparent 6px 12px);opacity:.6}
.n-cv-day{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:18px;align-items:start;padding:18px 20px 18px 0;border-radius:18px}
.n-cv-day-n{position:relative;z-index:1;display:flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--accent);color:var(--deep);font-weight:700;font-size:14px}
.n-cv-day b{display:block;font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(19px,1.6vw,24px);letter-spacing:var(--mid-track)}
.n-cv-day div > span{display:block;margin-top:4px;font-size:15px;color:var(--mute)}

/* D: the slim nudge */
.n-cv-d{padding-block:clamp(40px,4vw,64px);background:var(--warm)}
.n-cv-strip{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px 28px;padding:clamp(18px,2vw,26px) clamp(20px,2.4vw,32px);border-radius:999px;background:var(--deep);color:var(--on-deep);--btn:var(--accent);--btn-fg:var(--deep);--btn-hover:var(--on-deep);--btn-hover-fg:var(--deep);--focus:var(--accent)}
.n-cv-strip-ic{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--accent);color:var(--deep)}
.n-cv-strip p{margin:0;font-family:var(--mid);font-weight:var(--mid-w);font-size:clamp(18px,1.6vw,24px);line-height:1.3;letter-spacing:var(--mid-track)}
.n-cv-strip p span{display:block;margin-top:2px;font-family:var(--text);font-weight:400;font-size:15px;letter-spacing:0;color:var(--on-deep-mute)}

@media (max-width:980px){
.n-cv-a .n-wrap,.n-cv-c .n-wrap{grid-template-columns:minmax(0,1fr)}
.n-cv-a .n-vs-book{order:-1;width:min(70%,300px)}
.n-cv-cards{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:700px){
.n-cv{padding-top:72px}
.n-cv-ctas{flex-direction:column;align-items:stretch}
.n-cv-ctas .n-btn{width:100%}
.n-cv-ctas .n-cv-link{justify-content:center}
.n-cv-strip{grid-template-columns:minmax(0,1fr);border-radius:28px;text-align:left}
.n-cv-strip-ic{display:none}
.n-cv-strip .n-btn{width:100%}
.n-cv-a .n-vs-cover{overflow:visible}
.n-cv-a .n-vs-stamp{top:-18px;right:-18px}
}

/* ---------- V5 ---------- */
.n-gl-stage{padding:0}
.n-gl-note{display:none}
.n-wall-m{display:none}
/* the guide section sits on paper, so it doesn't run into the FAQ's colour below */
#skopje.n-cv-a{background:var(--paper);color:var(--ink);--kick:inherit;--mute:inherit;--line:inherit;--btn:inherit;--btn-fg:inherit;--btn-hover:inherit;--btn-hover-fg:inherit}
/* header: one family of quiet text links; "Enquire now" is the only button */
.n .n-nav ul{gap:2px}
.n .n-nav ul a,.n .n-nav ul a.n-nav-guide,.n .n-nav ul a:hover,.n .n-nav ul a.n-nav-guide:hover,.n .n-nav ul a[aria-current="page"]{padding:0 14px;border-color:transparent;background-color:transparent;color:inherit}
.n .n-nav ul a{background-image:linear-gradient(currentColor,currentColor);background-repeat:no-repeat;background-position:14px calc(100% - 9px);background-size:0 1.5px;transition:background-size .35s var(--ease),opacity .3s}
.n .n-nav ul a:hover,.n .n-nav ul a[aria-current="page"]{background-size:calc(100% - 28px) 1.5px}
.n .n-nav ul a.n-nav-guide .n-ic{display:none}
/* footer nav: four big links spread across the full width */
.n-foot-top{display:block;padding-bottom:clamp(40px,5vw,72px)}
.n-foot-top nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:1.5px solid var(--on-deep);border-bottom:1px solid var(--line)}
.n-foot-top nav a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:clamp(84px,8vw,120px);padding:0 clamp(16px,2vw,28px);font-family:var(--disp);font-weight:var(--disp-w);font-size:clamp(20px,2.1vw,32px);line-height:1.1;letter-spacing:var(--disp-track);color:var(--on-deep);text-decoration:none;transition:color .3s var(--ease),background-color .3s var(--ease)}
.n-foot-top nav a:first-child{padding-left:0}
.n-foot-top nav a + a{border-left:1px solid var(--line)}
.n-foot-top nav a:hover{color:var(--accent)}
.n-foot-top nav .n-fgo{flex:none;color:var(--accent);transition:transform .35s var(--ease)}
.n-foot-top nav a:hover .n-fgo{transform:translateX(4px)}
.n-foot-top nav a:hover .n-up{transform:translateY(-4px)}
@media (max-width:700px){
.n-foot-top nav{grid-template-columns:repeat(2,minmax(0,1fr))}
.n-foot-top nav a{min-height:76px;font-size:20px}
.n-foot-top nav a:nth-child(3){padding-left:0;border-left:0}
.n-foot-top nav a:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:700px){
.n-wall-d{display:none}
.n-wall.n-wall-m{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.n-wall-m .n-col:nth-child(2){padding-top:72px}
.n-wall-m .n-shot-img{aspect-ratio:4/5}
}
.n-lv-av{border-style:solid;font-family:var(--disp);font-weight:var(--disp-w);font-size:18px;line-height:1}
.n-lv-wall:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:24px}
@media (max-width:700px){
.n-love .n-wrap{padding-inline:0}
.n-love-pin{position:relative;top:auto;padding-bottom:28px}
.n-lv-wall{display:flex;align-items:stretch;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gut);padding:6px var(--gut) 18px;scrollbar-width:none}
.n-lv-wall::-webkit-scrollbar{display:none}
.n-lv-col{display:contents}
.n-lv{flex:0 0 min(84%,340px);scroll-snap-align:start}
.n-lv blockquote{flex:1}
.n-lv-xl blockquote p{font-size:24px}
}

/* =====================================================================================
   Motion (home). Replaces the GSAP / ScrollTrigger / Lenis script.
   1. Entrances that play once on load are ordinary keyframe animations.
   2. Everything tied to scrolling uses scroll-driven animations (animation-timeline). Browsers without them,
      and visitors who ask for reduced motion, get the still, finished layout: nothing is hidden waiting for a script.
   ===================================================================================== */
@keyframes n-hero-photo{from{scale:1.28}}
@keyframes n-hl-l{from{opacity:0;scale:.4;rotate:-35deg}}
@keyframes n-hl-r{from{opacity:0;scale:.4;rotate:35deg}}
@keyframes n-fav-in{from{opacity:0;translate:0 26px;scale:.7}}
@keyframes n-in{from{opacity:0;translate:0 20px}}
/* hero zoom, laid out like the old timeline: 0-22% copy leaves, 5-78% the letters grow 6x into the Н,
   41-71% the paper around them fades, 77-88% the caption arrives, then a short hold */
@keyframes hz-copy{0%{opacity:1;translate:0 0;visibility:visible}21.6%,100%{opacity:0;translate:0 -40px;visibility:hidden}}
@keyframes hz-lau{0%,4.9%{opacity:1}19.6%,100%{opacity:0}}
@keyframes hz-k{0%,4.9%{transform:scale(1);animation-timing-function:cubic-bezier(.55,.085,.68,.53)}78.4%,100%{transform:scale(6)}}
@keyframes hz-cover{0%,41.2%{opacity:1}70.6%,100%{opacity:0}}
@keyframes hz-photo{0%{scale:1.1;object-position:50% 72%}88.2%,100%{scale:1;object-position:50% 46%}}
@keyframes hz-cap{0%,76.5%{opacity:0}88.2%,100%{opacity:1}}
@keyframes n-lit{from{opacity:.18}}
@keyframes n-drift{from{translate:0 calc(var(--d0,0) * 1px)}to{translate:0 calc(var(--d1,0) * 1px)}}
@keyframes n-rise-far{from{opacity:0;translate:0 60px}}
@keyframes n-lp1{to{--lp1:.5}}
@keyframes n-lp2{to{--lp2:.5}}
@keyframes n-ld-img{from{translate:0 -6%;scale:1.08}to{translate:0 6%;scale:1.08}}
@keyframes n-arch{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes n-wave{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes n-slide{from{opacity:0;translate:-24px 0}}
@keyframes n-card{from{opacity:0;translate:0 110px;rotate:var(--tilt,-3deg);scale:.94}}
@keyframes n-card-x{from{opacity:0;translate:90px 0}}
@keyframes n-score-in{from{opacity:0;translate:0 40%;scale:.86}}
@keyframes n-score-out{to{scale:.82;opacity:.5}}
@keyframes n-line{from{scale:0 1}}
@keyframes n-mark-in{from{opacity:0;scale:.5}}
@keyframes n-mark-drift{from{rotate:-8deg;translate:0 30px}to{rotate:10deg;translate:0 -40px}}
@keyframes n-book{from{opacity:0;rotate:y 60deg;translate:0 60px}}

@media (prefers-reduced-motion:no-preference){
/* ---- on load: the letters open one at a time, the photo settles, the laurels swing in, then the words ---- */
.n-hero .n-k-wide .n-k-t{animation:n-k-up 1.5s var(--expo) .1s both}
.n-hero .n-k-wide tspan{animation:n-k-fill .9s cubic-bezier(.25,.46,.45,.94) both;animation-delay:calc(.15s + var(--ti,0) * .11s)}
.n-hero tspan:nth-child(2){--ti:1}.n-hero tspan:nth-child(3){--ti:2}.n-hero tspan:nth-child(4){--ti:3}
.n-hero .n-photo{animation:n-hero-photo 2.6s var(--expo) .1s both}
.n-hl-l{animation:n-hl-l 1.3s var(--back) .65s both}
.n-hl-r{animation:n-hl-r 1.3s var(--back) .65s both}
.n-hv-fav{transform-origin:50% 100%;animation:n-fav-in .9s var(--back2) 1s both}
.n-hero-copy [data-intro]{animation:n-in 1.1s var(--p3) both;animation-delay:calc(1.1s + var(--di,0) * .07s)}
.n-hero-l > :nth-child(2){--di:1}.n-hero-l > :nth-child(3){--di:2}.n-hero-r > :nth-child(1){--di:3}.n-hero-r > :nth-child(2){--di:4}

@supports (animation-timeline:view()){
/* ---- the statement lights up word by word as you read ---- */
.n-big{view-timeline:--big block;view-timeline-inset:0px}
.n-lit{animation:n-lit linear both;animation-timeline:--big;animation-range:cover calc(22vh + var(--k,0) * 5vh) cover calc(42vh + var(--k,0) * 5vh)}
.n-lit:nth-child(2){--k:1}.n-lit:nth-child(3){--k:2}.n-lit:nth-child(4){--k:3}.n-lit:nth-child(5){--k:4}.n-lit:nth-child(6){--k:5}.n-lit:nth-child(7){--k:6}

/* ---- the stay at a glance ---- */
.n-gl-bk li{animation:n-in linear both;animation-timeline:view();animation-range:entry 0% cover calc(15% + var(--k,0) * 3%)}
.n-gl-bk li:nth-child(2){--k:1}.n-gl-bk li:nth-child(3){--k:2}.n-gl-bk li:nth-child(4){--k:3}.n-gl-bk li:nth-child(5){--k:4}.n-gl-bk li:nth-child(n+6){--k:5}

/* ---- window wall: photos rise in, the columns drift at different speeds ---- */
.n-wall{view-timeline:--wall block}
.n-wall .n-shot{animation:n-rise-far linear both;animation-timeline:view();animation-range:entry 0% entry 90%}
.n-col{animation:n-drift linear both;animation-timeline:--wall;animation-range:cover}
.n-wall-d .n-col:nth-child(1){--d0:50;--d1:-50}.n-wall-d .n-col:nth-child(2){--d0:-40;--d1:40}.n-wall-d .n-col:nth-child(3){--d0:110;--d1:-110}
.n-wall-m .n-col:nth-child(1){--d0:40;--d1:-40}.n-wall-m .n-col:nth-child(2){--d0:-40;--d1:40}

/* ---- the lift: --lp runs 0 to 1 while the screen's middle travels from the apartment's middle to the mall's ---- */
.n-ld{timeline-scope:--ld-up,--ld-down;animation:n-lp1 linear both,n-lp2 linear both;animation-timeline:--ld-up,--ld-down;
animation-range:cover 50% entry-crossing calc(100% + 50vh),entry-crossing 50vh cover 50%}
#ld-up{view-timeline:--ld-up block;view-timeline-inset:0px}
#ld-down{view-timeline:--ld-down block;view-timeline-inset:0px}
.n-ld-door{display:block}
.n-ld-media{view-timeline:--ldm block}
.n-ld-media img{animation:n-ld-img linear both;animation-timeline:--ldm;animation-range:cover}
.n-ld-stop{animation:n-pop linear both;animation-timeline:view();animation-range:entry 0% entry 100%}

/* ---- spa: heading drifts, the three arches fill like water rising, then their words follow ---- */
.n-ev-head{view-timeline:--evh block}
.n-ev-h{animation:n-drift linear both;animation-timeline:--evh;animation-range:cover;--d0:30;--d1:-30}
.n-ev-sign{transform-origin:0 50%;animation:n-pop linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
.n-ev-wave{animation:n-wave linear both;animation-timeline:view();animation-range:entry 0% cover 30%}
.n-ev-side .n-p{animation:n-rise linear both;animation-timeline:view();animation-range:entry 0% entry 80%}
.n-ev-side .n-btn{animation:n-slide linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
.n-ev-step{view-timeline:--step block}
.n-ev-arch{animation:n-arch linear both;animation-timeline:--step;animation-range:entry 0% cover 30%}
.n-ev-arch .n-ic{animation:n-rise linear both;animation-timeline:--step;animation-range:entry 30% cover 30%}
.n-ev-step > :not(.n-ev-arch){animation:n-in linear both;animation-timeline:--step;animation-range:entry 20% cover 32%}
@media (min-width:700.02px){
.n-ev-steps{view-timeline:--steps block}
.n-ev-step{animation:n-drift linear both;animation-timeline:--steps;animation-range:cover}
.n-ev-step:nth-child(1){--d0:30;--d1:-30}.n-ev-step:nth-child(2){--d0:70;--d1:-70}.n-ev-step:nth-child(3){--d0:10;--d1:-40}
}

/* ---- Wall of Love: "Guest favourite" rises as the laurels swing open; each review lands as you reach it ---- */
.n-love-pin{view-timeline:--pin block}
/* the reviews wall is its own scroller on phones, so the cards follow a timeline named on the wall itself */
.n-love-body{timeline-scope:--lvwall}
.n-lv-wall{view-timeline:--lvwall block;view-timeline-inset:0px}
.n-love-score b{animation:n-score-in linear both;animation-timeline:--pin;animation-range:entry 0% entry 100%}
.n-love-lau-l svg{transform-origin:100% 95%;animation:n-hl-l linear both;animation-timeline:--pin;animation-range:entry 10% entry 100%}
.n-love-lau-r svg{transform-origin:0% 95%;animation:n-hl-r linear both;animation-timeline:--pin;animation-range:entry 10% entry 100%}
.n-love-stars .n-stars svg{animation:n-pop linear both;animation-timeline:--pin;animation-range:entry calc(var(--k,0) * 6%) entry calc(40% + var(--k,0) * 6%)}
.n-love-stars svg:nth-child(2){--k:1}.n-love-stars svg:nth-child(3){--k:2}.n-love-stars svg:nth-child(4){--k:3}.n-love-stars svg:nth-child(5){--k:4}
.n-love-meta{animation:n-in linear both;animation-timeline:--pin;animation-range:entry 40% entry 100%}
@media (min-width:700.02px){
.n-lv{animation:n-card linear both;animation-timeline:view();animation-range:entry 0% entry 100%;transform-origin:50% 100%}
.n-lv-col:nth-child(2n) .n-lv:nth-child(2n+1),.n-lv-col:nth-child(2n+1) .n-lv:nth-child(2n){--tilt:3deg}
.n-love-score{animation:n-score-out linear both;animation-timeline:--lvwall;animation-range:cover 30vh entry-crossing calc(100% + 40vh)}
}
@media (min-width:980.02px){
.n-lv-col{animation:n-drift linear both;animation-timeline:--lvwall;animation-range:cover}
.n-lv-col:nth-child(1){--d0:40;--d1:-80}.n-lv-col:nth-child(2){--d0:140;--d1:-160}.n-lv-col:nth-child(3){--d0:80;--d1:-120}
}
@media (max-width:700px){
.n-lv{animation:n-card-x linear both;animation-timeline:--lvwall;animation-range:entry 0% entry 60%}
}

/* ---- the free guide: the book swings round as it arrives ---- */
.n-cv-a .n-vs-cover{animation:n-book linear both;animation-timeline:view();animation-range:entry 0% cover 40%}

/* ---- FAQ: the rules draw in, the questions rise, the big "?" bobs as you scroll ---- */
.n-qs::before{animation:n-line linear both;animation-timeline:view();animation-range:entry 0% cover 25%}
.n-q{view-timeline:--q block}
.n-q::after{animation:n-line linear both;animation-timeline:--q;animation-range:entry 0% cover 30%}
.n-q summary{animation:n-in linear both;animation-timeline:--q;animation-range:entry 0% entry 100%}
#faq{view-timeline:--faq block}
.n-faq-mark{animation:n-mark-in linear both,n-mark-drift linear both;animation-timeline:view(),--faq;animation-range:entry 0% cover 40%,cover}
}

/* ---- FAQ answers glide open and shut (where the browser can animate to "auto") ---- */
@supports selector(::details-content){
.n-q{interpolate-size:allow-keywords}
.n-q::details-content{block-size:0;overflow-y:clip;opacity:0;transition:block-size .5s var(--ease),opacity .5s var(--ease),content-visibility .5s allow-discrete}
.n-q[open]::details-content{block-size:auto;opacity:1}
}
}

/* ---- the hero zoom: tall screens only. The hero becomes 2.7 screens tall, the stage stays pinned,
   and scrolling pulls you through the Н into the living-room photo ---- */
@media (min-width:960px) and (min-height:620px) and (prefers-reduced-motion:no-preference){
@supports (animation-timeline:view()){
.n-hero{height:calc(var(--vh) * 2.7);view-timeline:--hero block;view-timeline-inset:0px;--ty:30%;--fs:min(calc(var(--mark-wide) * .6),calc(var(--vh) * .26))}
.n-stage{position:sticky;top:0;height:var(--vh);overflow:hidden;padding:0}
.n-hv .n-frame{position:absolute;inset:0;height:auto}
/* the word's middle sits 30% down: the SVG is drawn taller than the frame, so its centre line lands there */
.n-hero .n-k-wide{top:-40%;height:140%;transform-origin:calc(50% - 1.334em) calc(50% + .03em)}
.n-hero .n-photo img{object-position:50% 72%}
.n-hero-copy{position:absolute;left:0;right:0;bottom:0;margin:0 auto;padding-bottom:calc(clamp(24px,3.4vh,44px) + 44px)}
.n-hero-copy,.n .n-hv .n-fav-row{animation:hz-copy linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%}
.n-hl-row{animation:hz-lau linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%}
.n-hero .n-k-wide{animation:hz-k linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%}
.n-hero .n-k-cover{animation:hz-cover linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%}
.n-hero .n-photo img{animation:hz-photo linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%}
.n-cap{animation:hz-cap linear both;animation-timeline:--hero;animation-range:contain 0% contain 100%}
}
}
@media (min-width:960px) and (min-height:620px) and (max-height:780px) and (prefers-reduced-motion:no-preference){
@supports (animation-timeline:view()){.n-hero{--fs:min(calc(var(--mark-wide) * .6),calc(var(--vh) * .22))}}
}

/* ---- phones: dots under the swipeable reviews, drawn by the browser (CSS scroll markers) where supported ---- */
@supports (scroll-marker-group:after){
@media (max-width:700px){
.n-lv-wall{scroll-marker-group:after}
.n-lv-wall::scroll-marker-group{display:flex;justify-content:center;gap:8px;margin:4px 0 0}
.n-lv::scroll-marker{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.3;transition:opacity .3s,width .3s var(--ease)}
.n-lv::scroll-marker:target-current{width:22px;border-radius:4px;opacity:1;background:var(--accent)}
}
}
