/* Design "Noć" (noc.js): an evening wedding in candlelight. A gold gate opens into the hall, then night scenes
   (hall, banquet table, garden) stay still behind frosted glass panels with thin serif capitals and gold script.
   Active when <html data-dizajn="noc">; colour from data-boja (zlatna / plava). Photos dizajn/noc/*.jpg; until a photo
   exists its scene is a warm gradient with candle bokeh (class n-ima-<ime> on <html> once the photo has loaded). */
:root[data-dizajn="noc"],.n-kapija{
  --n-noc:#0f0a08; --n-tekst:#f5ecdc; --n-sivo:#cdbfa6; --n-zlato:#e2c27e; --n-rub:rgba(226,194,126,.42);
  --n-staklo:rgba(24,16,12,.38); --n-svjetlo:255,206,128;
  --n-foil:linear-gradient(100deg,#b8913f 0%,#f3dc9c 22%,#fff1c8 34%,#d9b464 50%,#a87f35 66%,#ecd393 84%,#b8913f 100%);
  --n-btn:linear-gradient(135deg,#ecd393,#c9a457 45%,#9c7633);
  --acc:#e2c27e; --gold:#e2c27e; --ink:var(--n-tekst); --muted:var(--n-sivo); --line:rgba(226,194,126,.28); --on-acc:#1a120c;
  --paper:rgba(24,16,12,.55); --bg:#120c09; --bg2:#0f0a08;
}
:root[data-dizajn="noc"][data-boja="plava"],:root[data-dizajn="noc"][data-boja="plava"] .n-kapija{
  --n-noc:#080b12; --n-tekst:#eef2f8; --n-sivo:#b9c4d4; --n-zlato:#cfdcef; --n-rub:rgba(200,216,238,.42);
  --n-staklo:rgba(12,18,30,.4); --n-svjetlo:205,222,250;
  --n-foil:linear-gradient(100deg,#8fa3bf 0%,#e6eef9 24%,#ffffff 36%,#b9c8de 52%,#8597b3 68%,#dbe6f5 86%,#8fa3bf 100%);
  --n-btn:linear-gradient(135deg,#e6eef9,#b4c4dc 45%,#7f91ad);
  --acc:#cfdcef; --gold:#cfdcef; --line:rgba(200,216,238,.28); --on-acc:#0c1220;
}

:root[data-dizajn="noc"] body{background:var(--n-noc);color:var(--n-tekst)}
:root[data-dizajn="noc"] .wrap{max-width:none;padding:0 0 40px;gap:0;position:relative;z-index:1;overflow-x:clip}
:root[data-dizajn="noc"] .env,:root[data-dizajn="noc"] .hint{display:none}
:root[data-dizajn="noc"] .vrh{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));left:0;right:0;z-index:30}
:root[data-dizajn="noc"] .oznaka,:root[data-dizajn="noc"] .jezik{background:rgba(15,10,8,.5);border-color:var(--n-rub);color:var(--n-sivo);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
:root[data-dizajn="noc"] .foil{background:var(--n-foil);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* ---------- Night scenes behind the page ---------- */
.n-scena{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:var(--n-noc)}
.n-scena > i{position:absolute;inset:-4%;opacity:0;transition:opacity 1.6s ease,transform 14s ease-out;transform:scale(1.04);background-size:cover;background-position:center}
.n-scena[data-poz="sala"] .n-p-sala,.n-scena[data-poz="sto"] .n-p-sto,.n-scena[data-poz="vrt"] .n-p-vrt{opacity:1;transform:scale(1.1)}
/* Without the photos: warm light from chandeliers, a row of candles on the table, string lights in the garden */
.n-p-sala{background-image:
  radial-gradient(ellipse 40% 18% at 50% 6%,rgba(var(--n-svjetlo),.55),transparent 70%),
  radial-gradient(ellipse 26% 12% at 16% 18%,rgba(var(--n-svjetlo),.3),transparent 70%),
  radial-gradient(ellipse 26% 12% at 84% 18%,rgba(var(--n-svjetlo),.3),transparent 70%),
  radial-gradient(ellipse 60% 26% at 50% 104%,rgba(214,140,120,.28),transparent 70%),
  radial-gradient(ellipse 90% 60% at 50% 40%,#3a2516,#170e09 70%,#0b0705)}
.n-p-sto{background-image:
  radial-gradient(ellipse 70% 16% at 50% 70%,rgba(var(--n-svjetlo),.42),transparent 70%),
  radial-gradient(ellipse 22% 30% at 12% 100%,rgba(232,170,170,.3),transparent 70%),
  radial-gradient(ellipse 22% 30% at 88% 100%,rgba(190,206,232,.26),transparent 70%),
  radial-gradient(ellipse 50% 12% at 50% 10%,rgba(var(--n-svjetlo),.35),transparent 70%),
  linear-gradient(180deg,#1b110b,#2c1b10 60%,#120b07)}
.n-p-vrt{background-image:
  radial-gradient(ellipse 50% 30% at 50% 58%,rgba(var(--n-svjetlo),.26),transparent 70%),
  radial-gradient(ellipse 30% 22% at 50% 100%,rgba(232,176,176,.28),transparent 70%),
  linear-gradient(180deg,#0b0e16,#16131a 45%,#24170f 80%,#120b07)}
:root.n-ima-sala .n-p-sala{background-image:url(/dizajn/noc/sala.jpg)}
:root.n-ima-sto .n-p-sto{background-image:url(/dizajn/noc/sto.jpg)}
:root.n-ima-vrt .n-p-vrt{background-image:url(/dizajn/noc/vrt.jpg)}
/* Candle bokeh (drawn only without the photos) and a soft vignette so the glass always reads */
.n-scena > i::before{content:"";position:absolute;inset:0;background-image:
  radial-gradient(circle at 12% 30%,rgba(var(--n-svjetlo),.22) 0 2.2%,transparent 2.6%),
  radial-gradient(circle at 84% 22%,rgba(var(--n-svjetlo),.18) 0 3%,transparent 3.4%),
  radial-gradient(circle at 70% 62%,rgba(var(--n-svjetlo),.14) 0 4%,transparent 4.5%),
  radial-gradient(circle at 26% 78%,rgba(var(--n-svjetlo),.16) 0 2.6%,transparent 3%),
  radial-gradient(circle at 92% 84%,rgba(var(--n-svjetlo),.2) 0 1.8%,transparent 2.2%),
  radial-gradient(circle at 44% 14%,rgba(var(--n-svjetlo),.14) 0 1.6%,transparent 2%),
  radial-gradient(circle at 6% 60%,rgba(var(--n-svjetlo),.12) 0 3.6%,transparent 4%),
  radial-gradient(circle at 58% 90%,rgba(var(--n-svjetlo),.14) 0 2%,transparent 2.4%);filter:blur(3px)}
:root.n-ima-sala .n-p-sala::before,:root.n-ima-sto .n-p-sto::before,:root.n-ima-vrt .n-p-vrt::before{display:none}
.n-scena::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 80% 70% at 50% 50%,rgba(8,5,4,.12),rgba(8,5,4,.6))}
.n-iskre{position:absolute;inset:0;width:100%;height:100%;z-index:1}

/* ---------- Glass ---------- */
.n-ploca,:root[data-dizajn="noc"] main > section:not(#muzika):not(.n-ekran){position:relative;background:var(--n-staklo);border:1px solid var(--n-rub);border-radius:2px;
  backdrop-filter:blur(14px) saturate(1.15);-webkit-backdrop-filter:blur(14px) saturate(1.15);box-shadow:0 30px 60px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.08)}
/* A second hairline inside, like etched glass */
.n-ploca::before,:root[data-dizajn="noc"] main > section:not(#muzika):not(.n-ekran)::before{content:"";position:absolute;inset:7px;border:1px solid rgba(226,194,126,.16);pointer-events:none}
:root[data-dizajn="noc"][data-boja="plava"] .n-ploca::before,:root[data-dizajn="noc"][data-boja="plava"] main > section:not(#muzika):not(.n-ekran)::before{border-color:rgba(200,216,238,.16)}
:root[data-dizajn="noc"] main > section:not(.n-ekran),:root[data-dizajn="noc"] main > footer{max-width:min(460px,calc(100% - 32px));margin:56px auto 0;width:100%}
:root[data-dizajn="noc"] main > section:not(.n-ekran){padding:44px 26px 36px;text-align:center}
:root[data-dizajn="noc"] h2{font-family:"Bodoni Moda",var(--f-head);font-weight:400;font-size:clamp(24px,6.8vw,34px);letter-spacing:.16em;text-transform:uppercase;color:var(--n-tekst);margin:0 0 22px;line-height:1.2;padding-left:.2em}
:root[data-dizajn="noc"] h2 small{font-family:var(--f-script);font-size:30px;letter-spacing:0;text-transform:none;font-weight:400;margin-bottom:4px;color:var(--n-zlato);padding:0 .1em}
:root[data-pismo="cirilica"][data-dizajn="noc"] h2{font-family:var(--f-head)}

/* ---------- Gate ---------- */
.n-kapija{position:fixed;inset:0;z-index:50;overflow:hidden;cursor:pointer;background:var(--n-noc);perspective:1400px;transition:opacity 1.2s ease}
.n-k-iza{position:absolute;inset:0;background:radial-gradient(ellipse 34% 46% at 50% 55%,rgba(var(--n-svjetlo),.55),rgba(var(--n-svjetlo),.12) 55%,transparent 75%),radial-gradient(ellipse 90% 70% at 50% 50%,#2e1d11,#0b0705 75%);transition:transform 2.6s cubic-bezier(.4,.1,.2,1)}
:root.n-ima-sala .n-k-iza{background:linear-gradient(rgba(10,6,4,.2),rgba(10,6,4,.2)),url(/dizajn/noc/sala.jpg) center/cover}
/* The drawn gate stands in a column as tall as the screen; the photo of a gate fills the whole screen */
.n-k-vrata{position:absolute;top:0;bottom:0;left:50%;width:min(100vw,50svh);transform:translateX(-50%);display:flex;transform-style:preserve-3d}
:root.n-ima-kapija .n-k-vrata{width:100vw}
.n-k-krilo{position:relative;flex:1;height:100%;overflow:hidden;transition:transform 2.2s cubic-bezier(.55,.05,.25,1) .15s;backface-visibility:hidden}
.n-k-krilo.l{transform-origin:0 50%}
.n-k-krilo.d{transform-origin:100% 50%}
.n-k-crtez{position:absolute;inset:0;width:100%;height:100%}
.n-k-krilo.d .n-k-crtez{transform:scaleX(-1)}
.n-k-crtez .puno{fill:url(#n-zlato);stroke-width:1}
.n-k-crtez .tanko{stroke-width:1.4}
.n-k-crtez .okvir,.n-k-crtez .sina{stroke-width:4.5}
.n-k-crtez .medaljon{stroke-width:4}
.n-k-slika{display:none;position:absolute;top:0;bottom:0;width:200%;background:url(/dizajn/noc/kapija.jpg) center/cover}
.n-k-krilo.d .n-k-slika{left:-100%}
:root.n-ima-kapija .n-k-slika{display:block}
:root.n-ima-kapija .n-k-crtez,:root.n-ima-kapija .n-k-mono{display:none}
.n-k-mono{position:absolute;top:66.7%;font-family:"Bodoni Moda",var(--f-head);font-size:min(9vw,4.4svh);font-weight:500;letter-spacing:.02em;white-space:nowrap;background:var(--n-foil);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 6px rgba(var(--n-svjetlo),.5))}
.n-k-krilo.l .n-k-mono{right:0;transform:translate(50%,-50%)}
.n-k-krilo.d .n-k-mono{left:0;transform:translate(-50%,-50%)}
/* Candles on the ground, each flame flickering on its own */
.n-k-svijece{position:absolute;left:0;right:0;bottom:0;height:30%;pointer-events:none;transition:opacity 1s}
.n-k-svijece i{position:absolute;bottom:3%;width:clamp(12px,3.6vw,20px);transform:translateX(-50%);border-radius:3px 3px 2px 2px;background:linear-gradient(90deg,#c9b394,#f6ecd8 40%,#e6d6bb 70%,#b49d7d);box-shadow:0 0 30px rgba(var(--n-svjetlo),.25)}
.n-k-svijece b{position:absolute;left:50%;bottom:100%;width:10px;height:22px;margin-left:-5px;border-radius:50% 50% 45% 45%/65% 65% 35% 35%;background:radial-gradient(ellipse at 50% 75%,#fff 0 18%,#ffe39a 38%,#ff9f3a 70%,transparent 72%);transform-origin:50% 100%;animation:n-plamen 1.3s ease-in-out var(--k) infinite alternate}
.n-k-svijece b::after{content:"";position:absolute;left:50%;top:50%;width:90px;height:90px;margin:-45px;border-radius:50%;background:radial-gradient(circle,rgba(var(--n-svjetlo),.38),transparent 65%)}
@keyframes n-plamen{0%{transform:scale(1,1) rotate(-2deg)}40%{transform:scale(.92,1.08) rotate(2deg)}100%{transform:scale(1.04,.94) rotate(-1deg);opacity:.85}}
:root.n-ima-kapija .n-k-svijece{display:none}
.n-k-vrh{position:absolute;left:0;right:0;top:calc(9% + env(safe-area-inset-top,0px));text-align:center;padding:0 24px;transition:opacity .8s}
.n-k-mali{margin:0 0 6px;font-family:var(--f-head);font-size:11.5px;letter-spacing:.32em;text-transform:uppercase;color:var(--n-sivo);text-shadow:0 1px 8px rgba(0,0,0,.8)}
.n-k-imena{margin:0;font-family:var(--f-script);font-size:clamp(40px,11vw,58px);line-height:1.15;padding:0 .14em;background:var(--n-foil);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 2px 10px rgba(0,0,0,.7))}
.n-k-hint{position:absolute;left:0;right:0;bottom:calc(5% + env(safe-area-inset-bottom,0px));margin:0;text-align:center;font-family:var(--f-head);text-transform:uppercase;letter-spacing:.34em;font-size:11.5px;color:var(--n-tekst);text-shadow:0 1px 10px rgba(0,0,0,.9);animation:n-puls 2.6s ease-in-out infinite;transition:opacity .6s}
@keyframes n-puls{50%{opacity:.4}}
.n-k-svjetlo{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 55%,rgba(var(--n-svjetlo),.9),rgba(var(--n-svjetlo),.3) 30%,transparent 60%);transition:opacity 1.4s ease .5s}
.n-kapija.otvara .n-k-krilo.l{transform:rotateY(82deg)}
.n-kapija.otvara .n-k-krilo.d{transform:rotateY(-82deg)}
.n-kapija.otvara .n-k-iza{transform:scale(1.35)}
.n-kapija.otvara .n-k-hint,.n-kapija.otvara .n-k-vrh{opacity:0;animation:none}
.n-kapija.otvara .n-k-svijece{opacity:0}
.n-kapija.otvara .n-k-svjetlo{opacity:.7}
.n-kapija.gotovo{opacity:0;pointer-events:none}

/* ---------- Screens ---------- */
.n-ekrani{position:relative;z-index:1}
.n-ekran{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:84px 16px 48px;position:relative}
.n-ploca{width:min(100%,440px);padding:54px 26px 46px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.n-mali{margin:0;font-family:var(--f-head);font-size:12px;letter-spacing:.32em;text-transform:uppercase;color:var(--n-sivo);line-height:1.8;padding-left:.32em}
.n-crta{width:120px;height:12px;margin:14px 0;background:linear-gradient(90deg,transparent,var(--n-zlato) 40%,transparent 40% 60%,var(--n-zlato) 60%,transparent) center/100% 1px no-repeat;position:relative}
.n-crta::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px;background:var(--n-zlato);transform:rotate(45deg)}
.n-imena{margin:0;display:flex;flex-direction:column;align-items:center;font-family:var(--f-script);font-weight:400;font-size:clamp(58px,17vw,88px);line-height:1.02}
.n-imena > span{padding:0 .16em;background:var(--n-foil);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(var(--n-svjetlo),.35));animation:n-sjaj 7s ease-in-out infinite}
.n-imena .n-amp{font-family:"Bodoni Moda",var(--f-head);font-style:italic;font-size:.42em;margin:.1em 0}
@keyframes n-sjaj{50%{background-position:100% 0}}
.n-datum{margin:0;font-family:"Bodoni Moda",var(--f-head);font-weight:400;font-size:clamp(28px,8.4vw,38px);letter-spacing:.14em;font-variant-numeric:lining-nums;padding-left:.14em}
.n-dan{margin:4px 0 0;font-family:var(--f-head);font-size:12.5px;letter-spacing:.3em;text-transform:uppercase;color:var(--n-zlato);padding-left:.3em}
.n-mjesto{margin:10px 0 0;font-family:var(--f-head);font-size:14px;letter-spacing:.08em;color:var(--n-sivo)}
.n-dole{position:absolute;bottom:calc(22px + env(safe-area-inset-bottom,0px));left:50%;width:14px;height:14px;margin-left:-7px;border-right:1px solid var(--n-zlato);border-bottom:1px solid var(--n-zlato);transform:rotate(45deg);animation:n-dole 2.2s ease-in-out infinite}
@keyframes n-dole{50%{transform:translateY(8px) rotate(45deg);opacity:.4}}
/* The couple in a tall frame with a double gold hairline */
.n-foto{position:relative;width:min(80vw,360px);aspect-ratio:4/5;padding:10px;border:1px solid var(--n-rub);background:rgba(15,10,8,.3);box-shadow:0 30px 60px rgba(0,0,0,.5)}
.n-foto::after{content:"";position:absolute;inset:4px;border:1px solid rgba(226,194,126,.25);pointer-events:none}
.n-foto img{width:100%;height:100%;object-fit:cover;object-position:50% 20%;display:block}
.n-foto img.cb{filter:grayscale(1)}
.n-foto-mono{display:none}
.n-foto.prazno img{display:none}
.n-foto.prazno .n-foto-mono{display:flex;height:100%;align-items:center;justify-content:center;font-family:"Bodoni Moda",var(--f-head);font-size:64px;letter-spacing:.04em;background:var(--n-foil);-webkit-background-clip:text;background-clip:text;color:transparent}
.n-foto.prazno{aspect-ratio:1;width:min(60vw,260px);border-radius:50%}
.n-foto.prazno::after{border-radius:50%}
.n-ekran:has(.n-foto.prazno){min-height:56svh}

/* ---------- Sections restyled ---------- */
:root[data-dizajn="noc"] #s-uvod{margin-top:0}
:root[data-dizajn="noc"] .intro{font-family:var(--f-head);font-style:normal;font-size:16.5px;line-height:1.9;color:var(--n-tekst)}
:root[data-dizajn="noc"] .count-l{color:var(--n-sivo);letter-spacing:.3em;margin-top:30px}
:root[data-dizajn="noc"] .count{gap:0;margin-top:12px}
:root[data-dizajn="noc"] .count > div{border-left:1px solid var(--n-rub);font-family:"Bodoni Moda",var(--f-head);font-weight:400;font-size:34px;color:var(--n-zlato)}
:root[data-dizajn="noc"] .count > div:first-child{border-left:0}
:root[data-dizajn="noc"] .count span{color:var(--n-sivo)}
:root[data-dizajn="noc"] .prog{gap:0}
:root[data-dizajn="noc"] .prog li{display:flex;flex-direction:column;align-items:center;gap:3px;border:0;padding:20px 0;position:relative}
:root[data-dizajn="noc"] .prog li + li::before{content:"";position:absolute;top:0;left:50%;width:7px;height:7px;margin:-3.5px;border:1px solid var(--n-zlato);transform:rotate(45deg)}
:root[data-dizajn="noc"] .prog li + li::after{content:"";position:absolute;top:0;left:50%;width:120px;margin-left:-60px;height:1px;background:linear-gradient(90deg,transparent,var(--n-rub) 35%,transparent 45% 55%,var(--n-rub) 65%,transparent)}
:root[data-dizajn="noc"] .prog time{font-family:"Bodoni Moda",var(--f-head);font-size:28px;font-weight:400;color:var(--n-zlato);letter-spacing:.06em}
:root[data-dizajn="noc"] .prog b{font-family:var(--f-head);text-transform:uppercase;letter-spacing:.22em;font-size:13.5px;font-weight:500;color:var(--n-tekst)}
:root[data-dizajn="noc"] .prog p{font-family:var(--f-head);font-size:14.5px;color:var(--n-sivo)}
:root[data-dizajn="noc"] .pr-ikona{color:var(--n-zlato)}
:root[data-dizajn="noc"] .p-karta{color:var(--n-zlato)}
:root[data-dizajn="noc"] #adresa{font-family:var(--f-head);letter-spacing:.06em;color:var(--n-tekst)}
:root[data-dizajn="noc"] .note{color:var(--n-sivo)}
:root[data-dizajn="noc"] .btn-o{border-radius:0;border-color:var(--n-zlato);color:var(--n-zlato);letter-spacing:.24em;text-transform:uppercase;font-size:12px;font-family:var(--f-head);padding:13px 24px;background:rgba(0,0,0,.15)}
:root[data-dizajn="noc"] .btn-o:hover{background:var(--n-zlato);color:var(--on-acc)}
.n-dress{display:none}
:root[data-dizajn="noc"] .n-dress{display:block}
:root[data-dizajn="noc"] .n-dress[hidden]{display:none}
.n-boje{display:flex;justify-content:center;gap:14px;margin:4px 0 18px}
.n-boje i{width:40px;height:40px;border-radius:50%;box-shadow:0 0 0 1px var(--n-rub),0 0 0 5px rgba(0,0,0,.25),0 0 0 6px var(--n-rub)}
.n-dress p{margin:0;font-family:var(--f-head);font-size:14px;letter-spacing:.2em;text-transform:uppercase}
/* RSVP on glass, dark and gold */
:root[data-dizajn="noc"] #rsvp > h2{font-size:clamp(24px,6.6vw,32px)}
:root[data-dizajn="noc"] .deadline{font-family:var(--f-head);text-transform:uppercase;letter-spacing:.2em;font-size:12px;color:var(--n-zlato)}
:root[data-dizajn="noc"] .pchip{background:rgba(0,0,0,.25);border-color:var(--n-rub);color:var(--n-tekst)}
:root[data-dizajn="noc"] #rsvp input[type=text],:root[data-dizajn="noc"] #rsvp select,:root[data-dizajn="noc"] #rsvp textarea{background:rgba(0,0,0,.18);color:var(--n-tekst);border:0;border-bottom:1px solid var(--n-rub);border-radius:0;padding:11px 6px}
:root[data-dizajn="noc"] #rsvp input::placeholder,:root[data-dizajn="noc"] #rsvp textarea::placeholder{color:rgba(205,191,166,.6)}
:root[data-dizajn="noc"] #rsvp option{color:#2a2420;background:#fff}
:root[data-dizajn="noc"] #rsvp label,:root[data-dizajn="noc"] #rsvp .lbl{font-family:var(--f-head);text-transform:uppercase;letter-spacing:.2em;font-size:11.5px;font-weight:500;text-align:left;color:var(--n-sivo)}
:root[data-dizajn="noc"] .pomoc,:root[data-dizajn="noc"] .meni-zbir,:root[data-dizajn="noc"] .privatnost{color:var(--n-sivo)}
:root[data-dizajn="noc"] .choice label{border-radius:0;border-color:var(--n-rub);font-family:var(--f-head);letter-spacing:.14em;text-transform:uppercase;font-size:13px;color:var(--n-tekst)!important;background:rgba(0,0,0,.15)}
:root[data-dizajn="noc"] .choice input:checked + label{background:var(--n-btn);border-color:var(--n-zlato);color:var(--on-acc)!important}
:root[data-dizajn="noc"] .meni-red{border-color:var(--line)}
:root[data-dizajn="noc"] .step button{border-radius:0;background:transparent;border-color:var(--n-rub);color:var(--n-zlato)}
:root[data-dizajn="noc"] .step output{color:var(--n-tekst)}
:root[data-dizajn="noc"] .submit{border-radius:0;background:var(--n-btn)!important;color:var(--on-acc)!important;font-family:var(--f-head);letter-spacing:.32em;font-weight:500}
:root[data-dizajn="noc"] .thanks .big{font-size:52px}
:root[data-dizajn="noc"] .btn-t{color:var(--n-zlato)}
:root[data-dizajn="noc"] .greska{color:#f0a49c}
:root[data-dizajn="noc"] #muzika{position:fixed;right:calc(16px + env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:40;padding:0;width:auto;max-width:none;margin:0;background:none;border:0}
:root[data-dizajn="noc"] #muzika > div{display:none}
:root[data-dizajn="noc"] .play{width:48px;height:48px;background:var(--n-btn);box-shadow:0 0 0 1px rgba(255,255,255,.2),0 6px 22px rgba(var(--n-svjetlo),.35)}
:root[data-dizajn="noc"] .play svg{fill:var(--on-acc)}
:root[data-dizajn="noc"] .poruka b{color:var(--n-tekst)}
:root[data-dizajn="noc"] .gal{display:flex;flex-direction:column;gap:18px}
:root[data-dizajn="noc"] .gal img{border-radius:0;box-shadow:0 0 0 1px var(--n-rub),0 20px 40px rgba(0,0,0,.4)}
/* Closing monogram in a gold ring */
:root[data-dizajn="noc"] footer{padding:70px 24px 30px;gap:16px}
.n-kraj{display:none}
:root[data-dizajn="noc"] .n-kraj{display:flex;width:104px;aspect-ratio:1;border-radius:50%;border:1px solid var(--n-zlato);box-shadow:0 0 0 6px rgba(0,0,0,.2),0 0 0 7px var(--n-rub),0 0 40px rgba(var(--n-svjetlo),.25);align-items:center;justify-content:center}
.n-kraj span{font-family:"Bodoni Moda",var(--f-head);font-size:30px;background:var(--n-foil);-webkit-background-clip:text;background-clip:text;color:transparent}
:root[data-dizajn="noc"] footer .potpis{font-size:38px;background:var(--n-foil);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
:root[data-dizajn="noc"] .brend{color:var(--n-sivo)}
:root[data-dizajn="noc"] .brend b{color:var(--n-zlato)}

/* Glass rises from below and comes into focus */
:root[data-dizajn="noc"] .n-otkrij{opacity:0;transform:translateY(34px);filter:blur(6px);transition:opacity 1.2s ease var(--kasni,0s),transform 1.3s cubic-bezier(.2,.7,.2,1) var(--kasni,0s),filter 1.2s ease var(--kasni,0s)}
:root[data-dizajn="noc"] .n-otkrij.vidljiv{opacity:1;transform:none;filter:none}
@media (prefers-reduced-motion:reduce){
  :root[data-dizajn="noc"] .n-otkrij{opacity:1;transform:none;filter:none;transition:none}
  .n-scena > i{transition:opacity .6s;transform:none!important}
  .n-imena > span,.n-dole,.n-k-svijece b,.n-k-hint{animation:none}
}
@media (min-width:900px){
  .n-ekran{padding-top:110px}
  :root[data-dizajn="noc"] main > section:not(.n-ekran){max-width:520px}
}