/* Landing page (index.html and de.html, built by landing.js): cream and gold, Bodoni Moda, Pinyon Script, Karla */
:root{
  --ink:#2a2420; --muted:#7a7068; --line:#ece3d3; --krem:#fcf9f3; --krem2:#f4ebdc; --zlato:#a47e3b; --zlato-t:#8a6526;
  --foil:linear-gradient(100deg,#8a6526 0%,#b8913f 18%,#ecd393 32%,#b48c3c 46%,#8a6526 62%,#c9a457 80%,#94702f 100%);
  --goldbtn:linear-gradient(135deg,#d2ae64 0%,#b08a4a 45%,#94702f 100%);
  --da:#4a8a5f; --ne:#b5544c;
  color-scheme:only light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;font-family:Karla,system-ui,sans-serif;color:var(--ink);background:var(--krem);-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit}
h1,h2,h3{font-family:"Bodoni Moda",Didot,Georgia,serif;font-weight:600;margin:0;letter-spacing:-.01em}
h1 em,h2 em{font-family:"Pinyon Script",cursive;font-style:normal;font-weight:400;font-size:1.32em;line-height:.8;background:var(--foil);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;padding:0 .08em}
.ik{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Buttons */
.l-dugme{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 26px;border-radius:999px;background:var(--goldbtn);color:#fff;font-weight:700;font-size:15.5px;letter-spacing:.02em;text-decoration:none;box-shadow:0 10px 24px rgba(150,112,48,.28);transition:transform .2s,box-shadow .2s;text-align:center}
.l-dugme:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(150,112,48,.34)}
.l-dugme.mali{min-height:40px;padding:0 18px;font-size:14px}
.l-dugme.svijetlo{background:rgba(255,255,255,.94);color:var(--ink);box-shadow:0 8px 20px rgba(0,0,0,.16)}
.l-dugme.obrub{background:transparent;color:var(--zlato-t);box-shadow:inset 0 0 0 1.5px var(--zlato)}
.l-dugmad{display:flex;flex-wrap:wrap;gap:12px}

/* Header */
.l-zaglavlje{position:fixed;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;gap:20px;padding:12px max(16px,env(safe-area-inset-left,0px));background:rgba(252,249,243,.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(236,227,211,.8)}
.l-logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.l-logo-z{width:40px;height:40px;border-radius:50%;border:1.5px solid #c9a65f;display:grid;place-items:center;font-family:"Pinyon Script",cursive;font-size:24px;line-height:1;padding-bottom:3px;background:#fff}
.l-logo-z,.l-logo-t{background-clip:text}
.l-logo-t{font-family:"Bodoni Moda",serif;font-weight:600;font-size:11px;letter-spacing:.22em;text-transform:uppercase;line-height:1.3;color:var(--zlato-t)}
.l-nav{display:none;gap:26px;margin-left:auto}
.l-nav a{text-decoration:none;font-size:15px;color:var(--ink);opacity:.85}
.l-nav a:hover{opacity:1;color:var(--zlato-t)}
.l-zaglavlje .l-dugme{margin-left:auto}
@media (min-width:900px){.l-nav{display:flex}.l-zaglavlje .l-dugme{margin-left:12px}.l-zaglavlje{padding:14px 40px}}

/* Hero: a full-bleed photo, the text over its darker part */
.l-hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:#fff;overflow:hidden}
.l-hero-slika,.l-hero-slika img{position:absolute;inset:0;width:100%;height:100%}
.l-hero-slika img{object-fit:cover;object-position:50% 12%;animation:l-zum 18s ease-out both}
@keyframes l-zum{from{transform:scale(1.08)}to{transform:scale(1)}}
.l-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,14,8,.25) 0%,rgba(20,14,8,.05) 18%,rgba(20,14,8,.2) 34%,rgba(20,14,8,.72) 52%,rgba(20,14,8,.86) 100%)}
.l-hero-in{position:relative;z-index:1;width:100%;max-width:1180px;margin:0 auto;padding:110px 20px calc(36px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:18px}
.l-chip{align-self:flex-start;margin:0;padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);font-size:13px;font-weight:600;letter-spacing:.01em}
.l-hero h1{font-size:clamp(38px,10vw,76px);line-height:1.06;max-width:12em;text-shadow:0 2px 20px rgba(0,0,0,.25)}
.l-hero h1 em{background:linear-gradient(100deg,#e9cf8f,#fff3d0 40%,#d9b469 70%,#f4e1ac);-webkit-background-clip:text;background-clip:text}
.l-lead{margin:0;font-size:clamp(16px,4.2vw,19px);line-height:1.6;max-width:36em;color:rgba(255,255,255,.92)}
.l-povjerenje{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px;font-weight:600;color:rgba(255,255,255,.92)}
.l-povjerenje li{display:flex;align-items:center;gap:6px}
.l-povjerenje .ik{width:17px;height:17px;color:#e9cf8f;stroke-width:2.4}
/* Phones: the photo on top with the couple whole, the text below it on the dark fade */
@media (max-width:899px){
  .l-hero{display:block;min-height:0;background:#1d150c}
  .l-hero::after{display:none}
  .l-hero-slika{position:relative;display:block;height:min(124vw,70svh)}
  .l-hero-slika img{object-position:50% 14%}
  .l-hero-slika::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(29,21,12,.35) 0%,rgba(29,21,12,0) 22%,rgba(29,21,12,0) 58%,#1d150c 100%)}
  .l-hero-in{margin-top:-84px;padding-top:0}
}
@media (min-width:900px){
  .l-hero{align-items:center}
  .l-hero::after{background:linear-gradient(90deg,rgba(20,14,8,.82) 0%,rgba(20,14,8,.55) 38%,rgba(20,14,8,0) 60%)}
  .l-hero-slika img{object-position:100% 30%}
  .l-hero-in{margin:0;padding-left:max(40px,6vw);max-width:760px}
  .l-hero-in{padding:120px 40px 80px}
}

/* Numbers strip */
.l-brojke{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border-bottom:1px solid var(--line)}
.l-brojke div{background:#fff;padding:22px 16px;text-align:center;display:flex;flex-direction:column;gap:4px}
.l-brojke b{font-family:"Bodoni Moda",serif;font-size:clamp(22px,6vw,30px);font-weight:600;background:var(--foil);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.l-brojke span{font-size:13.5px;color:var(--muted)}
@media (min-width:900px){.l-brojke{grid-template-columns:repeat(4,1fr)}}

/* Sections */
.l-sekcija{padding:76px 20px;max-width:1180px;margin:0 auto;text-align:center}
.l-svijetla{max-width:none;background:linear-gradient(180deg,#fff,var(--krem2))}
.l-svijetla > *{max-width:1140px;margin-left:auto;margin-right:auto}
.l-kap{margin:0 0 12px;font-size:12.5px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--zlato)}
.l-sekcija h2,.l-obecanje h2{font-size:clamp(30px,7.6vw,48px);line-height:1.12;max-width:18em;margin:0 auto}
.l-uvod{margin:16px auto 0;max-width:38em;font-size:17px;line-height:1.65;color:var(--muted)}
.l-mali{margin:4px 0 0;font-size:14px;color:var(--muted)}
.l-otkrij{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.l-otkrij.vidljivo{opacity:1;transform:none}

/* Comparison */
.l-poredjenje{display:grid;gap:18px;margin-top:40px;text-align:left}
.l-kol{position:relative;background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px 24px}
.l-kol h3{font-size:24px}
.l-kol ul,.l-paket ul{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
.l-kol li,.l-paket li{display:flex;gap:10px;align-items:flex-start;font-size:15.5px;line-height:1.45}
.l-kol li .ik,.l-paket li .ik{margin-top:1px;stroke-width:2.4}
.l-kol.papir{background:#faf7f2}
.l-kol.papir li{color:var(--muted)}
.l-kol.papir .ik{color:var(--ne)}
.l-kol.dig{border:1.5px solid #d4b574;box-shadow:0 24px 50px rgba(150,112,48,.14)}
.l-kol.dig .ik{color:var(--da)}
.l-oznaka{position:absolute;top:-13px;left:24px;background:var(--goldbtn);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;padding:6px 12px;border-radius:999px}
.l-cijena-mala{margin:22px 0 0;padding-top:18px;border-top:1px dashed var(--line);display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.l-cijena-mala b{font-family:"Bodoni Moda",serif;font-size:30px}
.l-cijena-mala span{font-size:14px;color:var(--muted)}
@media (min-width:800px){.l-poredjenje{grid-template-columns:1fr 1fr;max-width:900px;margin-left:auto;margin-right:auto}}

/* Live examples in phones */
.l-demo{display:grid;gap:36px;margin-top:44px;justify-items:center;text-align:left}
.l-telefon{position:relative;width:min(100%,340px);aspect-ratio:9/19;border-radius:46px;padding:9px;background:linear-gradient(145deg,#f3e7cd 0%,#cdb07a 30%,#f2e4c4 55%,#b99659 80%,#e9d8b2 100%);box-shadow:0 40px 80px rgba(120,88,36,.28),0 0 0 1px rgba(150,115,55,.4)}
.l-telefon iframe{width:100%;height:100%;border:7px solid #15110e;border-radius:38px;background:#fff;display:block}
.l-notch{position:absolute;top:20px;left:50%;width:96px;height:26px;margin-left:-48px;border-radius:14px;background:#15110e;z-index:2;pointer-events:none}
.l-osobine{display:grid;gap:14px;width:100%;max-width:560px}
.l-osobina{display:flex;gap:14px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:18px;padding:16px 18px}
.l-osobina .ik{width:24px;height:24px;color:var(--zlato);margin-top:2px}
.l-osobina b{display:block;font-family:"Bodoni Moda",serif;font-size:17.5px;margin-bottom:3px}
.l-osobina span{font-size:14.5px;line-height:1.5;color:var(--muted)}
.l-osobine .l-dugme{justify-self:start;margin-top:6px}
@media (min-width:900px){
  .l-demo{grid-template-columns:auto 1fr;align-items:center;gap:60px;justify-items:start}
  .l-demo .l-osobine{grid-template-columns:1fr 1fr;max-width:none}
  .l-demo .l-osobine .l-dugme{grid-column:1/-1}
  .l-demo.obrnuto{grid-template-columns:1fr auto}
  .l-demo.obrnuto .l-telefon{order:2}
  .l-demo.obrnuto .l-osobine{grid-template-columns:1fr}
}

/* Link preview in a chat */
.l-chat-red{display:grid;gap:30px;margin-top:40px;justify-items:center;text-align:left}
.l-chat{width:min(100%,380px);border-radius:26px;overflow:hidden;background:#efe7dd;box-shadow:0 30px 60px rgba(60,40,20,.18);border:1px solid var(--line)}
.l-chat-vrh{display:flex;align-items:center;gap:10px;padding:14px 16px;background:#1f5c4d;color:#fff}
.l-chat-vrh small{margin-left:auto;opacity:.8}
.l-av{width:34px;height:34px;border-radius:50%;background:#f2d9a7;color:#6b4a1a;display:grid;place-items:center;font-weight:700}
.l-chat-tijelo{padding:16px 12px 20px;display:flex;flex-direction:column;gap:10px;background:#ece5dd url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Ccircle cx='6' cy='6' r='1.2' fill='%23d9cfc2'/%3E%3Ccircle cx='26' cy='22' r='1' fill='%23d9cfc2'/%3E%3C/svg%3E")}
.l-msg{margin:0;max-width:85%;padding:9px 12px;border-radius:12px;font-size:15px;line-height:1.4;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.l-msg.u{align-self:flex-start;background:#fff;border-top-left-radius:4px}
.l-msg.i{align-self:flex-end;background:#dcf8c6;border-top-right-radius:4px;padding:5px}
.l-msg.i > p{margin:6px 7px 4px;font-size:15px}
.l-kartica{background:rgba(255,255,255,.55);border-radius:9px;overflow:hidden}
.l-kartica img{display:block;width:100%;aspect-ratio:1200/630;object-fit:cover}
.l-kartica div{padding:8px 10px;display:flex;flex-direction:column;gap:2px}
.l-kartica b{font-size:14.5px}
.l-kartica span{font-size:13px;color:#555;line-height:1.35}
.l-kartica small{font-size:12px;color:#888}
.l-osobine.kratke{max-width:420px}
@media (min-width:900px){.l-chat-red{grid-template-columns:380px minmax(0,440px);justify-content:center;align-items:center;gap:60px;max-width:900px;margin-left:auto;margin-right:auto}.l-chat-red .l-osobine.kratke{width:100%}}

/* Steps */
.l-koraci{list-style:none;margin:44px auto 0;padding:0;display:grid;gap:16px;text-align:left;max-width:1000px}
.l-koraci li{background:#fff;border:1px solid var(--line);border-radius:22px;padding:26px 24px;display:flex;flex-direction:column;gap:8px}
.l-br{font-family:"Bodoni Moda",serif;font-size:44px;font-weight:600;line-height:1;background:var(--foil);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.l-koraci b{font-family:"Bodoni Moda",serif;font-size:21px}
.l-koraci span:last-child{font-size:15.5px;line-height:1.6;color:var(--muted)}
@media (min-width:800px){.l-koraci{grid-template-columns:repeat(3,1fr)}}

/* Promise */
.l-obecanje{max-width:980px;margin:0 auto;padding:44px 24px;display:flex;flex-direction:column;align-items:center;gap:26px;text-align:center;background:#fff;border:1.5px solid #e2cfa6;border-radius:30px;box-shadow:0 30px 60px rgba(150,112,48,.12);width:calc(100% - 40px)}
.l-obecanje p:last-child{margin:14px auto 0;max-width:36em;font-size:17px;line-height:1.65;color:var(--muted)}
.l-pecat{width:132px;height:132px;flex:none;border-radius:50%;background:var(--goldbtn);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 14px 30px rgba(150,112,48,.35),inset 0 0 0 6px rgba(255,255,255,.18),inset 0 0 0 7px rgba(255,255,255,.4)}
.l-pecat b{font-family:"Bodoni Moda",serif;font-size:36px;line-height:1}
.l-pecat span{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;margin-top:4px}
@media (min-width:800px){.l-obecanje{flex-direction:row;text-align:left;padding:44px 50px}.l-obecanje h2{margin:0}.l-obecanje p:last-child{margin-left:0}}

/* Packages */
.l-paketi{display:grid;gap:22px;margin-top:48px;text-align:left;max-width:1080px;margin-left:auto;margin-right:auto}
.l-paket{position:relative;background:#fff;border:1px solid var(--line);border-radius:24px;padding:30px 24px 26px;display:flex;flex-direction:column}
.l-paket h3{font-size:28px}
.l-paket.istaknut{border:1.5px solid #c9a65f;box-shadow:0 30px 60px rgba(150,112,48,.18)}
.l-cijena{margin:18px 0 0;display:flex;align-items:baseline;gap:10px}
.l-cijena b{font-family:"Bodoni Moda",serif;font-size:48px;font-weight:600;line-height:1;background:var(--foil);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.l-cijena span{font-size:15px;color:var(--muted)}
.l-paket li .ik{color:var(--zlato)}
.l-paket ul{flex:1}
.l-paket .l-dugme{margin-top:24px}
.l-napomena{margin:26px auto 0;max-width:40em;font-size:15px;color:var(--zlato-t);font-weight:600}
@media (min-width:900px){.l-paketi{grid-template-columns:repeat(3,1fr);align-items:stretch}.l-paket.istaknut{transform:translateY(-10px)}}

/* Reviews (only real ones) */
.l-utisci{display:grid;gap:18px;margin-top:40px;text-align:left}
.l-utisak{margin:0;background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px}
.l-zvj{display:flex;gap:3px;color:#c9a457}
.l-zvj .z{width:18px;height:18px;fill:currentColor}
.l-utisak blockquote{margin:12px 0;font-size:16px;line-height:1.6}
.l-utisak figcaption{font-size:14px;color:var(--muted)}
@media (min-width:900px){.l-utisci{grid-template-columns:repeat(3,1fr)}}

/* Questions */
.l-pitanja{max-width:780px;margin:40px auto 0;text-align:left;display:flex;flex-direction:column;gap:12px}
.l-pitanja details{background:#fff;border:1px solid var(--line);border-radius:18px;padding:0 20px}
.l-pitanja summary{list-style:none;cursor:pointer;padding:18px 30px 18px 0;font-family:"Bodoni Moda",serif;font-size:18px;font-weight:600;position:relative}
.l-pitanja summary::-webkit-details-marker{display:none}
.l-pitanja summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-family:Karla,sans-serif;font-size:26px;font-weight:400;color:var(--zlato);transition:transform .2s}
.l-pitanja details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.l-pitanja details p{margin:0 0 20px;font-size:15.5px;line-height:1.65;color:var(--muted)}

/* Closing call */
.l-kraj{margin:40px 0 0;padding:80px 20px 90px;text-align:center;background:radial-gradient(80% 90% at 50% 0%,#3a2c1a,#1e160d);color:#fff;display:flex;flex-direction:column;align-items:center;gap:18px}
.l-kraj h2{font-size:clamp(32px,8vw,52px);line-height:1.1;max-width:15em}
.l-kraj h2 em{background:linear-gradient(100deg,#e9cf8f,#fff3d0 40%,#d9b469 70%,#f4e1ac);-webkit-background-clip:text;background-clip:text}
.l-kraj p{margin:0;max-width:34em;font-size:17px;line-height:1.6;color:rgba(255,255,255,.82)}
.l-kraj .l-dugmad{justify-content:center;margin-top:8px}

/* Footer */
.l-podnozje{padding:34px 20px calc(110px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;background:#1e160d;color:rgba(255,255,255,.7);font-size:14px}
.l-podnozje .l-logo-t{color:#e9cf8f}
.l-podnozje p{margin:0}
.l-podnozje a{color:rgba(255,255,255,.85)}

/* Sticky bar on phones */
.l-traka{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:20;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 18px;border-radius:999px;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 14px 34px rgba(0,0,0,.18);font-size:13.5px;font-weight:600;transform:translateY(140%);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.l-traka.vidljiva{transform:none}
@media (min-width:900px){.l-traka{display:none}.l-podnozje{padding-bottom:34px}}

@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.l-hero-slika img{animation:none}.l-otkrij{opacity:1;transform:none}}

/* ---------- Computers: the hero follows the scroll (landing.js), the sticky stage inside a tall wrapper ---------- */
.l-natpisi,.l-skroluj{display:none}
.l-hero-omot.skrol{height:400vh;position:relative}
.skrol .l-hero{position:sticky;top:0;height:100vh;min-height:0}
.skrol .l-hero::after{background:linear-gradient(90deg,rgba(20,14,8,calc(.35 + .5 * var(--sjena,0))) 0%,rgba(20,14,8,calc(.15 + .35 * var(--sjena,0))) 40%,rgba(20,14,8,0) 62%),linear-gradient(0deg,rgba(20,14,8,.35),transparent 30%)}
.skrol .l-hero-slika img{animation:none;will-change:transform;transform-origin:70% 40%}
.l-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:100% 30%;opacity:0;transition:opacity .8s ease}
.video-spreman .l-hero-video{opacity:1}
.skrol .l-hero-in{opacity:0;will-change:opacity,transform}
.skrol .l-natpisi{display:block;position:absolute;z-index:1;left:max(40px,6vw);top:50%;transform:translateY(-50%);width:min(46vw,640px);height:3.2em;font-size:clamp(40px,4.6vw,72px)}
.l-natpis{position:absolute;inset:0;margin:0;opacity:0;font-family:"Bodoni Moda",serif;font-weight:600;line-height:1.08;color:#fff;text-shadow:0 2px 24px rgba(0,0,0,.45),0 1px 2px rgba(0,0,0,.35);will-change:opacity,transform}
.l-natpis em{font-family:"Pinyon Script",cursive;font-style:normal;font-weight:400;font-size:1.3em;line-height:.8;background:linear-gradient(100deg,#e9cf8f,#fff3d0 40%,#d9b469 70%,#f4e1ac);-webkit-background-clip:text;background-clip:text;color:transparent;padding:0 .06em}
.skrol .l-skroluj{display:flex;position:absolute;z-index:1;left:50%;bottom:34px;transform:translateX(-50%);flex-direction:column;align-items:center;gap:8px;color:rgba(255,255,255,.85);font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;transition:opacity .5s}
.pri-kraju .l-skroluj{opacity:0}
.l-prsten{width:40px;height:40px;transform:rotate(-90deg)}
.l-prsten circle{fill:none;stroke:rgba(255,255,255,.85);stroke-width:2.5;stroke-dasharray:126;stroke-dashoffset:126;transition:stroke-dashoffset .2s}
.l-skroluj::before{content:"";width:2px;height:26px;border-radius:2px;background:linear-gradient(rgba(255,255,255,.9),rgba(255,255,255,0));animation:l-kap 1.8s ease-in-out infinite;order:2}
.ucitava .l-skroluj::before{display:none}
.l-skroluj:not(:where(.ucitava *)) .l-prsten{display:none}
/* Phones: the same scrolling hero, upright: the film fills the screen, the captions sit low on a dark fade and at the
   end the whole hero text rises at the bottom */
@media (max-width:899px){
  .l-hero-omot.skrol{height:300svh}
  .skrol .l-hero{position:sticky;top:0;height:100svh;display:block}
  .skrol .l-hero-slika{position:absolute;inset:0;height:auto}
  .skrol .l-hero-slika::after{display:none}
  /* The dark fade lies over the photo and the film alike */
  .skrol .l-hero::after{display:block;z-index:1;background:linear-gradient(180deg,rgba(29,21,12,.4) 0%,rgba(29,21,12,0) 20%,rgba(29,21,12,calc(.1 + .35 * var(--sjena,0))) 45%,rgba(29,21,12,calc(.55 + .35 * var(--sjena,0))) 75%,rgba(29,21,12,.92) 100%)}
  .skrol .l-hero-slika img,.skrol .l-hero-video{object-position:50% 18%}
  .skrol .l-hero-in{position:absolute;z-index:2;left:0;right:0;bottom:0;margin:0;padding:0 20px calc(26px + env(safe-area-inset-bottom,0px))}
  .skrol .l-natpisi{z-index:2;left:20px;right:20px;width:auto;top:auto;bottom:calc(20svh + env(safe-area-inset-bottom,0px));transform:none;height:3.4em;font-size:clamp(34px,9.6vw,46px)}
  .skrol .l-skroluj{z-index:2;bottom:calc(20px + env(safe-area-inset-bottom,0px))}
}
@keyframes l-kap{0%{transform:translateY(-6px);opacity:0}40%{opacity:1}100%{transform:translateY(10px);opacity:0}}

/* ---------- Whole-page details ---------- */
/* A gold flourish that draws itself under every section title */
.l-crta{display:block;width:180px;height:14px;margin:18px auto 0;overflow:visible}
.l-crta path{fill:none;stroke:#c9a457;stroke-width:1.4;stroke-linecap:round;stroke-dasharray:260;stroke-dashoffset:260;transition:stroke-dashoffset 1.8s cubic-bezier(.4,.1,.2,1) .2s}
.l-crta circle{fill:#c9a457;opacity:0;transition:opacity .6s ease 1.4s}
.l-crta.vidljivo path{stroke-dashoffset:0}
.l-crta.vidljivo circle{opacity:1}
.l-crta.l-otkrij{transform:none}
/* Quiet sparkles in the light sections */
.l-svijetla{position:relative;overflow:hidden}
.l-iskrice{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;max-width:none!important}
.l-svijetla > :not(.l-iskrice){position:relative}
/* Packages one after another, chat messages one by one */
.l-paketi .l-paket{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .9s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i) * .14s + .1s)}
.l-paketi.vidljivo .l-paket{opacity:1;transform:none}
@media (min-width:900px){.l-paketi.vidljivo .l-paket.istaknut{transform:translateY(-10px)}}
.l-chat .l-msg{opacity:0;transform:translateY(10px) scale(.98);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.7,.2,1)}
.l-chat-red.vidljivo .l-msg{opacity:1;transform:none}
.l-chat-red.vidljivo .l-msg:nth-child(2){transition-delay:.7s}
.l-chat-red.vidljivo .l-msg:nth-child(3){transition-delay:1.6s}
.l-telefon{transition:transform .25s ease-out;will-change:transform}
/* The closing section on the last frame of the film (or the wide photo), darkened for the words */
.l-kraj{background:linear-gradient(180deg,rgba(24,17,9,.78),rgba(24,17,9,.86)),var(--kraj) center 35%/cover no-repeat,#1e160d}

@media (prefers-reduced-motion:reduce){
  .l-crta path{stroke-dashoffset:0;transition:none}.l-crta circle{opacity:1}
  .l-paketi .l-paket,.l-chat .l-msg{opacity:1;transform:none;transition:none}
}