/* DIAMMANI - stilovi */
:root{
  --bg:#fff; --tx:#000; --grey:#c7c7c7;
  --ff:'Inter Tight',"Helvetica Neue",Helvetica,Arial,sans-serif;
  --e-out:cubic-bezier(.16,1,.3,1);
  --e-io:cubic-bezier(.87,0,.13,1);
  --e-s:cubic-bezier(.48,0,.52,1);
  --pad:1.26vw;        /* bočna margina logotipa */
  --padt:.93vw;        /* gornja margina logotipa */
  --strip:1.06vw;      /* visina sabijenog logotipa */
  --nav-fs:3.5vw; --nav-top:2.98vw; --nav-left:5.42vw; --nav-in:8vw;
  --sm:1.15vw;          /* sitan tekst */
  --xs:.95vw;
  --big:4.7vw;        /* veliki pasusi */
  --cols:6;
}
*{margin:0;padding:0;font:inherit;box-sizing:border-box}
html{-webkit-text-size-adjust:none;text-size-adjust:none;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
body,html{overscroll-behavior:none}
body{font-family:var(--ff);background:var(--bg);color:var(--tx);overflow-x:hidden}
body.is-loading{overflow:hidden;height:100vh}
li,ul{list-style:none}
button{display:block;color:inherit;outline:0;border:0;background:0 0;cursor:pointer;text-transform:inherit;letter-spacing:inherit}
a{color:inherit;text-decoration:none;display:inline-block}
img,svg,video{display:block}
img{width:100%;height:auto}
figure{margin:0}
::selection{color:#fff;background:#000}
#s{position:absolute;width:0;height:0;overflow:hidden}
h1{position:absolute;font-size:0}
html.has-c, html.has-c *{cursor:none!important}

/* --- reveal linija --- */
.y_{display:block;overflow:hidden;margin-inline:-1px}
.y{display:block;position:relative;will-change:transform;padding-inline:1px;transform:translateY(120%);transition:transform .6s var(--e-out);transition-delay:calc(var(--i,0)*28ms);white-space:nowrap}
.on>.y_>.y,.on .y_>.y,.y_.on>.y{transform:translateY(0)}
[data-lines] .y_:not(:first-child){text-indent:0}
[data-lines] .y{text-indent:0}
[data-lines] .y_:first-child .y{text-indent:inherit}

/* --- reveal slika (clip-path) --- */
figure.cp{overflow:hidden}
figure.cp img{transition:clip-path .65s var(--e-out),transform .9s var(--e-out);transform:scale(1.2);will-change:transform,clip-path}
figure.cp.on img{transform:scale(1);clip-path:inset(0)}
figure.cp-bt img{clip-path:inset(100% 0 0 0)}
figure.cp-lr img{clip-path:inset(0 100% 0 0)}
figure.cp-rl img{clip-path:inset(0 0 0 100%)}
figure.cp-c img{clip-path:inset(50%)}
.r_{position:relative;width:100%;overflow:hidden}
.r{object-fit:cover;width:100%;height:100%}

/* --- LOADER --- */
#lo{position:fixed;inset:0;z-index:9994}
#lo-bg{position:absolute;inset:0;background:#fff;transition:clip-path .42s var(--e-io)}
#lo.out #lo-bg{clip-path:inset(0 0 100% 0)}
#lo-pr{position:absolute;overflow:hidden;width:100%;height:2px;top:0;left:0}
#lo-pr>div{background:#000;width:100%;height:100%;transform:translateX(-100.4%);transition:transform .5s var(--e-out);will-change:transform}
#lo.out #lo-pr{opacity:0;transition:opacity .3s}
#lo-co{position:absolute;inset:0;padding:2.38vw 2.38vw 0;text-transform:uppercase;pointer-events:none;overflow:hidden;font-weight:800;letter-spacing:-.05em;line-height:.92;font-size:6vh}
#lo-co{display:flex;flex-direction:column;align-items:flex-start}
#lo-co .lo-l{display:block;overflow:hidden;height:.92em;transform:scaleX(2.75);transform-origin:left center;flex:none}
#lo-co .lo-l.on{display:block}
#lo-co .lo-l>span{display:block;animation:lol .32s var(--e-out) both;animation-delay:calc(var(--i)*22ms)}
@keyframes lol{from{transform:translateY(105%)}to{transform:none}}
#lo-im{display:flex;flex-wrap:nowrap;gap:.4vw;height:9.5vh;margin:.45vh 0;width:max-content;flex:none}
#lo-im figure{position:relative;height:100%;aspect-ratio:3/4;overflow:hidden;display:none}
#lo-im figure.on{display:block;animation:lof .2s var(--e-out) both}
@keyframes lof{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0)}}
#lo-im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1)}

/* --- KURSOR --- */
#c_{position:fixed;top:0;left:0;width:2.6vw;height:2.6vw;min-width:28px;min-height:28px;margin:-1.3vw 0 0 -1.3vw;color:#fff;mix-blend-mode:difference;pointer-events:none;z-index:9999;will-change:transform;opacity:0;transition:opacity .3s}
html.has-c #c_{opacity:1}
#c{width:100%;height:100%;transition:transform .6s var(--e-out);transform-origin:center}
#c svg{width:100%;height:100%;overflow:visible}
#c svg path, #c svg use{vector-effect:non-scaling-stroke}
#c_.h #c{transform:scale(.45) rotate(45deg)}
#c_.im #c{transform:scale(1.6)}
@media (hover:none),(pointer:coarse){#c_{display:none}}

/* --- LOGO --- */
#l{position:fixed;inset:var(--padt) var(--pad);pointer-events:none;overflow-x:clip;mix-blend-mode:difference;color:#ebebeb;z-index:30}
#l-ar{position:absolute;pointer-events:none;width:100%;height:var(--strip);padding-block:var(--padt);box-sizing:content-box;top:calc(var(--padt)*-1);left:0}
#l.mini #l-ar{pointer-events:all}
#l-svg{position:absolute;inset:0;transform:translateX(-101%)}
body.ready #l-svg{transform:none;animation:lin .7s cubic-bezier(.2,.75,.15,1) both}
@keyframes lin{from{transform:translateX(-101%)}to{transform:none}}
#l-svg svg{width:100%;height:100%;overflow:visible;transform-origin:center top;transform:scaleY(var(--ls,1));will-change:transform}
#l.mini #l-svg svg{transition:transform .75s cubic-bezier(.16,1,.3,1)}
#l.mini #l-ar:hover~#l-svg svg{transform:scaleY(1)}
#l-svg text{font-family:var(--ff);font-size:100px;font-weight:800;letter-spacing:0}

/* --- NAV --- */
#n{position:fixed;user-select:none;text-transform:uppercase;pointer-events:none;mix-blend-mode:difference;z-index:20;color:#fff;font-weight:800;letter-spacing:-.045em;font-size:var(--nav-fs);line-height:1;top:var(--nav-top);left:var(--nav-left);transition:opacity .4s var(--e-s)}
#n.wo{opacity:.2}
#n.wo:hover{opacity:1}
#n-ti{overflow:hidden;padding-top:.07vw}
#n-ti a{pointer-events:all;will-change:transform;transform:translateY(120%);transition:transform .44s var(--e-out)}
#n-li{display:flex;flex-direction:column;align-items:flex-start;padding-left:var(--nav-in)}
#n-li li{display:block;overflow-x:visible;overflow-y:clip;height:.92lh;padding-top:.13vw}
#n-li a{position:relative;z-index:1;pointer-events:all;width:fit-content;padding-top:.07vw;transform:translateY(120%);transition:transform .44s var(--e-out);transition-delay:calc(var(--i)*22ms);white-space:nowrap;will-change:transform}
body.nav-on #n-ti a, body.nav-on #n-li a{transform:translateY(0)}
#n-li a>span{position:absolute;visibility:hidden;pointer-events:none;white-space:nowrap}
#n-li a::after{content:attr(data-text);position:relative;display:inline-block;transform-origin:left center;transition:transform .4s var(--e-out);transform:scaleX(1);pointer-events:none}
#n-li a.on::after{transform:scaleX(var(--sx,1))}
@media (hover:hover){#n-li a:hover::after{transform:scaleX(var(--sx,1))}}
#n-li a[aria-disabled]{pointer-events:none}

/* --- žuti tag --- */
#cr{position:fixed;mix-blend-mode:normal;z-index:50;bottom:.33vw;right:.33vw;font-size:var(--xs);line-height:1.15;opacity:0;transition:opacity .6s}
body.nav-on #cr{opacity:1}
#cr span{position:relative;display:inline-block;color:#000;background:#eef222;padding:.1vw .3vw}
#cr span::after{content:"";position:absolute;background:#fff;width:100%;height:100%;top:0;left:0;right:auto;transition:width 1.2s var(--e-out)}
body.nav-on #cr span::after{width:0;left:auto;right:0}
#cr:hover span{text-decoration:underline}

/* --- POČETNA --- */
#ho{position:relative;height:285vh;background:#fff}
#ho-st{position:sticky;top:0;height:100vh;height:100dvh;overflow:hidden;background:#fff}
#bg,#f-bg{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:.9vw;pointer-events:none;user-select:none;will-change:opacity}
#bg>div,#f-bg>div{display:flex;justify-content:space-between;width:100%}
#bg svg,#f-bg svg{width:.53vw;height:.53vw;min-width:5px;min-height:5px;color:#000;opacity:.55}
#ho-sl{position:absolute;inset:0}
.sl{position:absolute;inset:0;display:flex;--p:0}
.sl-h{position:relative;flex:1 1 50%;overflow:hidden;will-change:clip-path;background:#111}
.sl-h img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 22%;filter:grayscale(1) contrast(1.08);transform:scale(calc(1 + (1 - var(--p))*.3));will-change:transform}
.sl[data-k="0"]{clip-path:inset(var(--t,100%) 0 0 0)}
.sl:not([data-k="0"]) .sl-h:first-child{clip-path:inset(calc((1 - var(--p))*100%) 0 0 0)}
.sl:not([data-k="0"]) .sl-h:last-child{clip-path:inset(0 0 calc((1 - var(--p))*100%) 0)}
.sl-h+.sl-h{border-left:1px solid #000}
#ho-he{position:absolute;inset:0;pointer-events:none;z-index:2}
#ho-he-de{position:absolute;color:#fff;mix-blend-mode:difference;max-width:38vw;font-size:var(--sm);line-height:1.1;bottom:10.7vw;left:var(--nav-left)}
#ho-co{position:absolute;z-index:2;color:#fff;mix-blend-mode:difference;font-weight:800;letter-spacing:-.03em;text-transform:uppercase;font-size:1.45vw;line-height:1;top:var(--nav-top);right:var(--pad);opacity:0;transition:opacity .6s}
body.nav-on #ho-co{opacity:1}
.ho-co-r{display:flex;justify-content:flex-end;align-items:center;column-gap:.7vw}
.ho-co-r+.ho-co-r{margin-top:.33vw}
.ho-co-r svg{width:.9em;height:.9em}
.ho-co-r.o svg{animation:bv 1s linear infinite}
#ho-co-n{display:inline-block;min-width:1.4em;text-align:right}
@keyframes bv{0%,49%{visibility:visible}50%,100%{visibility:hidden}}

/* --- O BRENDU --- */
#ab{position:relative;background:#fff;z-index:1}
#ab-he{position:relative;height:66vw;min-height:100vh;overflow:hidden}
#ab-he-ga{position:absolute;inset:2.3vw 0}
#l-grey{position:absolute;inset:var(--padt) var(--pad);color:#f0f0f0;pointer-events:none;transform-origin:center bottom;transform:scaleY(0);transition:transform 1s var(--e-io)}
#ab-he.on #l-grey{transform:scaleY(1)}
#l-grey svg{width:100%;height:100%;overflow:visible}
#l-grey text{font-family:var(--ff);font-size:100px;font-weight:800}
.ab-r{position:absolute;width:7.2vw;height:9.1vw;will-change:transform;z-index:1}
.ab-r figure{width:100%;height:100%;overflow:hidden;clip-path:inset(100% 0 0 0);transition:clip-path 1s var(--e-out),transform .8s var(--e-out);transition-delay:calc(var(--i)*45ms),0s;transform-origin:center;background:#ddd}
#ab-he.on .ab-r figure{clip-path:inset(0)}
.ab-r img{width:100%;height:100%;object-fit:cover;filter:grayscale(1);transition:filter .5s}
.ab-r:hover{z-index:5}
.ab-r:hover figure{transform:scale(2.3)}
.ab-r:hover img{filter:none}
#ab-he-de{position:absolute;max-width:38vw;font-size:var(--sm);line-height:1.1;bottom:10.7vw;left:var(--nav-left);z-index:2;pointer-events:none}
#ab-ab{position:relative;width:100%;padding:1.52vw}
.ab-ab-p{letter-spacing:-.03em;text-indent:5.3vw;font-size:var(--big);font-weight:400;line-height:1.02}
.ab-ab-p:not(:last-of-type){padding-bottom:1lh}
.ab-ab-p:last-of-type{padding-bottom:1.85vw}
.ab-ab-p .y_{padding-bottom:.06em}
#ab-he-bi{height:125vw;max-height:160vh}
#ab-he-bi img{object-position:50% 30%}
#ab-ga{position:relative;padding-top:.66vw}
#ab-ga-a{display:flex;justify-content:space-between;align-items:flex-end;padding-inline:.66vw}
#ab-ga-a ._r:first-child{width:24.3vw;height:33.8vw}
#ab-ga-a ._r:nth-child(2){width:38.4vw;height:53.5vw}
#ab-ga>h2{letter-spacing:-.045em;text-transform:uppercase;overflow:hidden;width:100%;font-size:5.55vw;font-weight:800;line-height:1;padding:.6vw .66vw .3vw}
#ab-ga>h2 .y_{display:flex;flex-wrap:wrap;justify-content:space-between}
#ab-ga>h2 .y{white-space:nowrap;display:flex;justify-content:space-between;width:100%}
#ab-ga-b{display:flex;align-items:stretch;gap:.33vw;padding-inline:.33vw}
#ab-ga-b>figure{flex-basis:51%}
#ab-ga-b>div{display:flex;flex-direction:column;flex-basis:49%;gap:.33vw}
#ab-ga-b>div>figure{position:relative;flex:1 1 50%;min-height:20vw}
#ab-ga-b>div>figure>img{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;object-position:50% 25%}
#ab-fo{padding:.93vw .66vw 5vw}
#ab-fo p{letter-spacing:-.03em;font-size:var(--big);font-weight:500;line-height:1.05}
#ab-fo .y{display:flex;align-items:center;gap:1.7vw;white-space:normal}
#ab-fo svg{width:1.6vw;height:1.6vw;flex:none}

/* --- KOLEKCIJA --- */
#wo{position:relative;--wb:#fff;--wt:#000;background:var(--wb);color:var(--wt);transition:background-color .6s var(--e-s),color .6s var(--e-s);padding:0 .6vw 3.3vw;min-height:100vh;z-index:1}
#wo.b{--wb:#000;--wt:#fff}
#wo-n{position:sticky;top:0;z-index:6;display:flex;justify-content:space-between;align-items:center;padding:3.2vw 0 1vw;font-weight:800;letter-spacing:-.03em;text-transform:uppercase;font-size:1.1vw;line-height:1;background:linear-gradient(var(--wb) 70%,transparent);transition:background .6s}
.wo-n-g{display:flex;align-items:center;gap:.9vw;flex:1 1 33%}
#wo-z{justify-content:flex-end;gap:1.2vw}
#wo-v{justify-content:flex-end}
.wo-n-g>span{opacity:1}
.wo-n-g>span.sp{margin-left:1.6vw}
.wo-n-g button{color:var(--grey);transition:color .3s;position:relative;padding:.4vw 0}
#wo.b .wo-n-g button{color:#5c5c5c}
.wo-n-g button:hover,.wo-n-g button.on{color:var(--wt)!important}
.wo-n-g button.on::after{content:"";position:absolute;left:0;right:0;bottom:.15vw;height:1px;background:currentColor}
#wo-z button{color:var(--wt)!important}
#wo-z svg{width:1.5vw;height:1.5vw;min-width:16px;min-height:16px;transition:transform .5s var(--e-out)}
#wo-z button:hover svg{transform:scale(1.3)}
#wo-ga{display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:2.6vw 3.6vw;align-items:end;padding:2vw 1.2vw 4vw}
.wo-i{position:relative;transition:opacity .5s var(--e-s),transform .7s var(--e-out)}
.wo-i figure{overflow:hidden;clip-path:inset(100% 0 0 0);transition:clip-path 1s var(--e-out);transition-delay:calc(var(--i)*50ms)}
#wo-ga.on .wo-i figure{clip-path:inset(0)}
.wo-i img{transition:transform .8s var(--e-out);transform:scale(1);will-change:transform}
.wo-i:hover img{transform:scale(1.07)}
.wo-i figcaption,.wo-i .cap{display:block;margin-top:.5vw;font-size:.92vw;font-weight:500;letter-spacing:0;text-transform:uppercase;white-space:nowrap}
#wo-ga:hover .wo-i:not(:hover){opacity:.25}
.wo-i.off{opacity:0!important;transform:scale(.94);pointer-events:none}
.wo-i.gone{display:none}
#wo-fs[hidden]{display:none}
#wo-fs{padding:1vw 1.2vw 0}
#wo-fs-st{position:relative;height:74vh;display:flex;justify-content:center}
#wo-fs-im{height:100%;aspect-ratio:3/4;max-width:100%;overflow:hidden;clip-path:inset(0);transition:clip-path .26s var(--e-io)}
#wo-fs-im.sw{clip-path:inset(0 0 100% 0)}
#wo-fs-im img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--e-out)}
#wo-fs-im.sw img{transform:scale(1.15)}
#wo-fs-p,#wo-fs-x{position:absolute;top:0;bottom:0;width:50%}
#wo-fs-p{left:0}#wo-fs-x{right:0}
#wo-fs-in{display:flex;justify-content:space-between;padding:1vw 0;font-size:1.1vw;font-weight:800;letter-spacing:-.03em;text-transform:uppercase}
#wo-fs-in span{flex:1}
#wo-fs-in span:nth-child(2){text-align:center}
#wo-fs-in span:nth-child(3){text-align:right}
#wo-fs-th{display:flex;justify-content:center;gap:.33vw;padding-bottom:2vw}
#wo-fs-th button{width:3.4vw;min-width:34px;aspect-ratio:3/4;overflow:hidden;opacity:.3;transition:opacity .4s}
#wo-fs-th button.on,#wo-fs-th button:hover{opacity:1}
#wo-fs-th img{width:100%;height:100%;object-fit:cover}

/* --- blok hover --- */
a.bl{position:relative;overflow:visible;isolation:isolate;transition:color .2s var(--e-s),transform .8s var(--e-out)}
a.bl::before{content:"";position:absolute;pointer-events:none;inset:-.02em -.12em 0;background:#000;transform:scaleX(0);transform-origin:left bottom;transition:transform .35s var(--e-out);z-index:-1}
a.bl:hover{color:#fff}
a.bl:hover::before{transform:scaleX(1)}
#f-n li:last-child a.bl::before{transform-origin:right bottom}

/* --- KONTAKT --- */
#ko{position:relative;background:#fff;padding:12vw 2.38vw 6vw;z-index:1}
#ko-li li{display:flex;align-items:flex-start;column-gap:.9vw;border-top:1px solid #000;padding:1vw 0 1.6vw;overflow:hidden}
#ko-li li:last-child{border-bottom:1px solid #000}
#ko-li li>span{flex:0 0 12vw;text-transform:uppercase;font-weight:800;letter-spacing:-.02em;font-size:1.1vw;line-height:1;padding-top:.6vw}
#ko-li a{letter-spacing:-.045em;font-size:8.4vw;font-weight:800;line-height:.95;transform:translateY(110%)}
#ko-li li.on a{transform:translateY(0)}
#ko-de{max-width:33vw;font-size:var(--sm);line-height:1.15;margin:3vw 0 0 12.9vw}

/* --- FOOTER --- */
#f{position:relative;background:#fff;z-index:1}
#f-n{display:flex;justify-content:space-between;width:100%;padding:3vw 2.38vw 4vw}
#f-n>*{flex-basis:33.333%;display:flex;align-items:flex-start;column-gap:.66vw}
#f-n>:nth-child(2){justify-content:center}
#f-n>:nth-child(3){justify-content:flex-end}
#f-n li a,#f-n li p{letter-spacing:-.04em;font-size:var(--big);font-weight:500;line-height:1}
#f-n li>span{text-transform:uppercase;font-weight:800;font-size:.9vw;line-height:1;padding-top:.3vw}
#f-en{position:relative;height:100vh;height:100svh}
#f-p{position:absolute;left:0;right:0;bottom:1.32vw;text-align:center;font-size:var(--sm);line-height:1;mix-blend-mode:difference;color:#fff;z-index:40}

/* --- MOBILNI --- */
@media (max-width:820px){
  :root{--pad:3vw;--padt:3vw;--strip:3.2vw;--nav-fs:8.6vw;--nav-top:9vw;--nav-left:3vw;--nav-in:9vw;--sm:3.9vw;--xs:3.1vw;--big:8.2vw;--cols:3}
  #lo-co{font-size:5vh;padding:4vw 4vw 0}
  #lo-co .lo-l{transform:scaleX(1.85)}
  #lo-im{height:8vh;gap:1vw}
  .sl-h:last-child{display:none}
  .sl-h img{object-position:50% 20%}
  #ho-he-de,#ab-he-de{max-width:78vw;bottom:22vw}
  #ho-co{font-size:3.6vw;top:auto;bottom:6vw;right:3vw}
  .ho-co-r{column-gap:1.6vw}.ho-co-r+.ho-co-r{margin-top:1vw}
  #cr{bottom:1vw;right:auto;left:3vw}
  #cr span{padding:.4vw 1vw}
  #ab-he{height:150vw}
  .ab-r{width:17vw;height:21.5vw}
  .ab-r:hover figure{transform:scale(1.6)}
  #ab-ab{padding:3vw}
  .ab-ab-p{text-indent:12vw}
  #ab-he-bi{height:130vw}
  #ab-ga-a{padding-inline:3vw}
  #ab-ga-a ._r:first-child{width:34vw;height:47vw}
  #ab-ga-a ._r:nth-child(2){width:54vw;height:75vw}
  #ab-ga>h2{font-size:11.4vw;padding:2vw 3vw 1vw}
  #ab-ga>h2 .y{flex-wrap:wrap}
  #ab-ga-b{flex-direction:column;gap:1vw;padding-inline:1vw}
  #ab-ga-b>div{gap:1vw}
  #ab-ga-b>div>figure{min-height:70vw}
  #ab-fo{padding:4vw 3vw 14vw}
  #ab-fo .y{gap:3vw;flex-wrap:wrap}
  #ab-fo svg{width:4vw;height:4vw}
  #wo{padding:0 3vw 10vw}
  #wo-n{flex-wrap:wrap;row-gap:1.5vw;font-size:3.4vw;padding:9vw 0 3vw}
  .wo-n-g{gap:3vw;flex:1 1 100%}
  #wo-z{order:3;justify-content:flex-start;gap:5vw}
  #wo-v{justify-content:flex-start;flex-wrap:wrap}
  .wo-n-g>span.sp{margin-left:4vw}
  .wo-n-g button{padding:1.4vw 0}
  #wo-ga{gap:6vw 4vw;padding:4vw 0 10vw}
  .wo-i .cap{font-size:3vw;margin-top:1.4vw}
  #wo-ga:hover .wo-i:not(:hover){opacity:1}
  #wo-fs{padding:2vw 0 0}
  #wo-fs-st{height:auto}
  #wo-fs-im{height:auto;width:100%}
  #wo-fs-in{font-size:3vw;padding:3vw 0}
  #wo-fs-th{flex-wrap:wrap;gap:1vw}
  #wo-fs-th button{width:14vw}
  #ko{padding:26vw 3vw 14vw}
  #ko-li li{flex-direction:column;row-gap:2vw;padding:3vw 0 4vw}
  #ko-li li>span{flex:none;font-size:3vw;padding:0}
  #ko-li a{font-size:10.6vw}
  #ko-de{max-width:none;margin:8vw 0 0}
  #f-n{flex-direction:column;row-gap:6vw;padding:6vw 3vw 10vw}
  #f-n>*{justify-content:flex-start!important;column-gap:2vw}
  #f-n li>span{font-size:2.8vw;padding-top:1vw}
  #f-n li:last-child a.bl::before{transform-origin:left bottom}
  #f-p{bottom:8vw}
  #bg svg,#f-bg svg{opacity:.4}
}
@media (prefers-reduced-motion:reduce){
  .y,figure.cp,figure.cp img,#n-li a::after{transition-duration:.01s!important}
}