/* MARLEK v12 · zajednički stil za sve stranice (SR i EN) */
:root{
  --plum:#351E28;--plum-2:#4A2B39;--plum-3:#5A3A48;
  --paper:#F5F0E6;--card:#FFFDF8;--sky:#BCD3EC;--butter:#F5DE7A;
  --soft:#6B5B62;--line:#E6DFD1;--line-2:#D3CABD;--bezel:#1E1A1C;
  --f-head:'Gabarito',system-ui,sans-serif;
  --f-body:'Atkinson Hyperlegible Next','Atkinson Hyperlegible',system-ui,sans-serif;
  --f-mono:'IBM Plex Mono',ui-monospace,monospace;
  --gut:clamp(16px,4vw,40px);
  --ease:cubic-bezier(.3,.7,.4,1);--spring:cubic-bezier(.16,1,.3,1);
  --hdr:68px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr) + 16px);-webkit-text-size-adjust:100%}
html,body{margin:0;background:var(--paper);color:var(--plum);font-family:var(--f-body)}
body{overflow-x:clip;font-size:18px;line-height:1.55;-webkit-tap-highlight-color:rgba(53,30,40,.12)}
img,video,svg{display:block;max-width:100%}
img{height:auto}
::selection{background:var(--butter);color:var(--plum)}
a{color:inherit}
:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:4px}
h1,h2,h3,h4,p,figure,ul,ol{margin:0}
ul,ol{padding:0;list-style:none}
.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--plum);color:var(--paper);padding:10px 16px;border-radius:999px;text-decoration:none;font-weight:700}
.skip:focus{top:12px}

/* ---------- tipografija ---------- */
.wrap{width:100%;max-width:1240px;margin:0 auto;padding-inline:var(--gut)}
.eyebrow{font:500 12px/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.mono{font-family:var(--f-mono);font-weight:500;letter-spacing:.06em}
.h1{font:800 clamp(40px,6.2vw,88px)/.96 var(--f-head);letter-spacing:-.04em;text-wrap:balance}
.h2{font:800 clamp(34px,4.6vw,64px)/.98 var(--f-head);letter-spacing:-.03em;text-wrap:balance}
.h3{font:800 clamp(28px,3.2vw,44px)/1.02 var(--f-head);letter-spacing:-.025em;text-wrap:balance}
.h4{font:800 clamp(21px,1.9vw,26px)/1.12 var(--f-head);letter-spacing:-.015em;text-wrap:balance}
.lead{font:400 clamp(19px,1.6vw,22px)/1.5 var(--f-body);text-wrap:pretty;max-width:640px}
.quote{font:400 clamp(24px,2.4vw,34px)/1.18 var(--f-head);letter-spacing:-.01em;text-wrap:balance}
.small{font-size:15px;line-height:1.5;color:var(--soft)}
.cap{font:500 11px/1.5 var(--f-mono);letter-spacing:.06em;color:var(--soft);text-transform:uppercase}

/* puter marker preko jedne reči */
.mk{position:relative;display:inline-block;isolation:isolate;white-space:nowrap}
.mk::after{content:"";position:absolute;z-index:-1;left:-.05em;right:-.05em;bottom:.05em;height:.34em;background:var(--butter);border-radius:3px;transform:scaleX(0);transform-origin:left center;transition:transform 700ms var(--spring) 250ms}
.in .mk::after,.mk.in::after{transform:scaleX(1)}
.on-dark .mk{color:var(--paper)}
.on-dark .mk::after{opacity:.95;height:.16em;bottom:-.02em}

/* dugmad */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 24px;border-radius:999px;background:var(--plum);color:var(--paper);font:700 17px/1.2 var(--f-body);text-decoration:none;border:0;cursor:pointer;transition:background 200ms ease,transform 200ms ease,box-shadow 200ms ease;text-align:center}
.btn:hover{background:var(--plum-2)}
.btn:active{transform:translateY(1px)}
.btn .arr{transition:transform 250ms var(--spring)}
.btn:hover .arr{transform:translateX(4px)}
.btn--light{background:var(--paper);color:var(--plum)}
.btn--light:hover{background:#fff}
.btn--butter{background:var(--butter);color:var(--plum)}
.btn--butter:hover{background:#F8E596}
.btn--ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 1.5px currentColor}
.btn--ghost:hover{background:rgba(53,30,40,.06)}
.link{font-weight:700;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:6px}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:6px 14px;border-radius:999px;box-shadow:inset 0 0 0 1.5px currentColor;font:500 13px/1.2 var(--f-mono);letter-spacing:.04em;white-space:nowrap}
.pill--fill{background:var(--plum);color:var(--paper);box-shadow:none}
.pill--butter{background:var(--butter);box-shadow:none}
.pill--sky{background:var(--sky);box-shadow:none}

/* ---------- zaglavlje ---------- */
.hdr{position:fixed;inset:0 0 auto;height:var(--hdr);z-index:50;background:rgba(245,240,230,.94);backdrop-filter:saturate(1.2) blur(8px);-webkit-backdrop-filter:saturate(1.2) blur(8px);border-bottom:1.5px solid var(--line)}
.hdr .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}
.hdr-logo{display:flex;align-items:center;min-height:44px;gap:12px;text-decoration:none}
.hdr-logo img{width:104px;height:auto}
.hdr-tag{font:500 11px/1 var(--f-mono);letter-spacing:.08em;padding:6px 10px;border-radius:999px;background:var(--plum);color:var(--paper)}
.hdr-nav{display:flex;gap:24px;font:500 13px var(--f-mono);letter-spacing:.06em}
.hdr-nav a{min-height:44px;display:inline-flex;align-items:center;text-decoration:none}
.hdr-nav a:hover{text-decoration:underline;text-underline-offset:5px}
.hdr-right{display:flex;align-items:center;gap:10px}
.lang{display:flex;align-items:center;border:1.5px solid var(--plum);border-radius:999px;padding:3px;font:500 11px var(--f-mono);letter-spacing:.05em}
.lang a{display:flex;align-items:center;justify-content:center;min-width:34px;min-height:32px;border-radius:999px;text-decoration:none}
.lang a[aria-current]{background:var(--plum);color:var(--paper)}
.hdr .btn{min-height:44px;padding:10px 18px;font-size:15px}
@media(max-width:820px){.hdr-nav{display:none}}
@media(max-width:560px){.hdr .btn{display:none}.hdr-logo img{width:92px}.hdr-tag{display:none}}
main{padding-top:var(--hdr)}

/* ---------- sekcije ---------- */
.sec{padding-block:clamp(72px,9vw,128px)}
.sec--tight{padding-block:clamp(48px,6vw,80px)}
.sec--sky{background:var(--sky)}
.sec--plum{background:var(--plum);color:var(--paper)}
.sec--card{background:#EFE8DA}
.sec-head{display:flex;flex-direction:column;gap:18px;margin-bottom:clamp(36px,5vw,64px);max-width:860px}
.sec-head--split{max-width:none;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:end;gap:20px clamp(32px,6vw,96px)}
@media(max-width:860px){.sec-head--split{grid-template-columns:1fr}}
.rule{padding-top:16px;border-top:1.5px solid currentColor}

/* pojavljivanje */
[data-reveal]{opacity:0;transform:translateY(18px);transition:opacity 700ms var(--ease),transform 700ms var(--ease)}
[data-reveal].in{opacity:1;transform:none}
[data-reveal="2"]{transition-delay:120ms}[data-reveal="3"]{transition-delay:240ms}[data-reveal="4"]{transition-delay:360ms}

/* ---------- uređaji ---------- */
.browser{background:#E9E6E1;border-radius:14px;padding:30px 7px 7px;position:relative;box-shadow:0 34px 70px -34px rgba(53,30,40,.45)}
.browser::before{content:"";position:absolute;left:14px;top:12px;width:8px;height:8px;border-radius:50%;background:#D4C9C0;box-shadow:14px 0 0 #D4C9C0,28px 0 0 #D4C9C0}
.browser .url{position:absolute;left:58px;right:14px;top:8px;height:16px;border-radius:999px;background:#F4F1EC;font:500 9px/16px var(--f-mono);color:#9B8F88;padding-left:10px;letter-spacing:.04em;white-space:nowrap;overflow:hidden}
.phone{background:var(--bezel);border-radius:34px;padding:8px;box-shadow:0 28px 60px -26px rgba(53,30,40,.55);position:relative}
.phone::before{content:"";position:absolute;left:50%;top:14px;width:34%;height:16px;transform:translateX(-50%);background:var(--bezel);border-radius:999px;z-index:3}
.screen{position:relative;overflow:hidden;background:var(--card);border-radius:6px}
.browser .screen{aspect-ratio:16/10}
.phone .screen{aspect-ratio:390/800;border-radius:27px}
.screen>img{width:100%;height:auto}
.screen.fit>img{width:100%;height:100%;object-fit:cover;object-position:top}
.scroller{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.scroller::-webkit-scrollbar{display:none}
.scroll-hint{position:absolute;left:10px;bottom:10px;z-index:2;display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:var(--plum);color:var(--paper);font:500 11px/1.3 var(--f-mono);letter-spacing:.06em;pointer-events:none;transition:opacity 400ms ease}
.scroll-hint::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--butter)}
.screen-wrap{position:relative}
.screen-wrap.used .scroll-hint{opacity:0}

/* ---------- početna: split hero ---------- */
.split{padding-top:clamp(28px,4vw,56px);padding-bottom:clamp(40px,5vw,72px)}
.split-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 40px;margin-bottom:clamp(24px,3vw,40px)}
.split-head .h1{max-width:880px}
.split-head p{max-width:340px;font:400 clamp(19px,1.6vw,22px)/1.4 var(--f-head)}
.split-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,1.6vw,22px)}
@media(max-width:900px){.split-grid{grid-template-columns:1fr}}
.door{position:relative;display:flex;flex-direction:column;gap:20px;border-radius:28px;padding:clamp(22px,2.6vw,36px);overflow:hidden;min-width:0}
.door--web{background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.door--sys{background:var(--plum);color:var(--paper)}
.door-top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.door-name{font:800 22px/1 var(--f-head);letter-spacing:-.01em}
.door-name small{font:500 11px var(--f-mono);letter-spacing:.08em;margin-right:8px;opacity:.7}
.door .quote{min-height:2.4em}
.door-visual{position:relative;flex:1;min-height:300px;display:flex;align-items:center;justify-content:center}
.door-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px}
.door-meta .mono{font-size:13px}
.door--sys .pill{color:var(--paper)}
.door-web-devices{position:relative;width:100%;max-width:560px;padding-right:14%}
.door-web-devices .phone{position:absolute;right:0;bottom:-12px;width:24%;border-radius:22px;padding:5px}
.door-web-devices .phone::before{top:9px;height:10px}
.door-web-devices .phone .screen{border-radius:17px}

/* ---------- red dokaza ---------- */
.proofs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1.5px solid var(--plum);border-bottom:1.5px solid var(--plum)}
@media(max-width:860px){.proofs{grid-template-columns:1fr}}
.proof{display:grid;grid-template-columns:96px minmax(0,1fr) 24px;align-items:center;gap:18px;padding:22px 18px 22px 0;text-decoration:none;min-height:132px;transition:background 250ms ease}
.proof+.proof{border-left:1.5px solid var(--line-2);padding-left:22px}
@media(max-width:860px){.proof+.proof{border-left:0;border-top:1.5px solid var(--line-2);padding-left:0}}
.proof:hover .proof-t{text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:5px}
.proof:hover .arr{transform:translateX(4px)}
.proof .arr{font:800 22px var(--f-head);transition:transform 250ms var(--spring)}
.proof-t{font:800 clamp(21px,1.8vw,25px)/1.1 var(--f-head);letter-spacing:-.015em;display:block}
.proof-s{font-size:15px;line-height:1.45;color:var(--soft);display:block;margin-top:6px}
.proof-v{width:96px;height:84px;position:relative}
.pv-stack img{position:absolute;width:72px;border-radius:6px;box-shadow:0 8px 18px -8px rgba(53,30,40,.45);border:1.5px solid var(--card);transition:transform 500ms var(--spring)}
.pv-stack img:nth-child(1){left:0;top:16px;transform:rotate(-8deg)}
.pv-stack img:nth-child(2){left:12px;top:8px;transform:rotate(-1deg)}
.pv-stack img:nth-child(3){left:24px;top:0;transform:rotate(6deg)}
.proof:hover .pv-stack img:nth-child(1){transform:rotate(-14deg) translateX(-6px)}
.proof:hover .pv-stack img:nth-child(3){transform:rotate(12deg) translateX(6px)}
.pv-watch{display:flex;align-items:center;justify-content:center}
.pv-list{display:flex;flex-direction:column;gap:6px;justify-content:center}
.pv-list i{display:flex;align-items:center;justify-content:space-between;height:12px;border-radius:3px;background:var(--line);position:relative}
.pv-list i::after{content:"";width:9px;height:9px;border-radius:50%;background:var(--plum);margin-left:auto;margin-right:-14px}
.pv-list b{font:800 26px/1 var(--f-head);letter-spacing:-.03em}

/* štoperica */
.watch{position:relative;width:84px;height:84px}
.watch svg{width:100%;height:100%;transform:rotate(-90deg)}
.watch .track{stroke:var(--line-2)}
.watch .prog{stroke:var(--plum);stroke-dasharray:1;stroke-dashoffset:var(--off,1)}
.watch-num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font:800 22px/1 var(--f-head);font-variant-numeric:tabular-nums}
.watch-num small{font:500 9px var(--f-mono);letter-spacing:.06em;margin-top:2px}
.watch--lg{width:120px;height:120px}
.watch--lg .watch-num{font-size:34px}

/* ---------- Maria i Aleksa ---------- */
.duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,6vw,96px);align-items:center}
@media(max-width:860px){.duo{grid-template-columns:1fr}}
.duo-visual{position:relative;display:flex;align-items:center;justify-content:center;gap:0;padding:12px 0}
.person{width:min(46%,240px);aspect-ratio:1;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;padding:18px;transition:transform 900ms var(--spring)}
.person b{font:800 clamp(26px,3vw,40px)/1 var(--f-head);letter-spacing:-.02em}
.person span{font:500 10px/1.5 var(--f-mono);letter-spacing:.06em;text-transform:uppercase}
.person--m{background:var(--sky);transform:translateX(16%)}
.person--a{background:var(--butter);transform:translateX(-16%);mix-blend-mode:multiply}
.duo-visual.in .person--m{transform:translateX(6%)}
.duo-visual.in .person--a{transform:translateX(-6%)}
.duo-plus{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;background:var(--plum);color:var(--paper);display:flex;align-items:center;justify-content:center;font:800 22px var(--f-head);z-index:2}
.reasons{display:flex;flex-direction:column}
.reason{display:grid;grid-template-columns:44px minmax(0,1fr);gap:16px;padding:22px 0;border-top:1.5px solid var(--plum)}
.reason:last-child{border-bottom:1.5px solid var(--plum)}
.reason .n{font:500 12px var(--f-mono);letter-spacing:.06em;padding-top:8px}
.reason p{margin-top:8px;color:var(--plum-2);text-wrap:pretty}

/* ---------- završni izbor + logo animacija ---------- */
.choose{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:clamp(28px,3vw,40px);max-width:900px}
@media(max-width:700px){.choose{grid-template-columns:1fr}}
.choose a{display:flex;flex-direction:column;gap:10px;padding:24px 26px;border-radius:22px;text-decoration:none;min-height:150px;justify-content:space-between;transition:transform 300ms var(--spring),background 250ms ease}
.choose a:hover{transform:translateY(-3px)}
.choose .c-web{background:var(--paper);color:var(--plum)}
.choose .c-sys{background:var(--butter);color:var(--plum)}
.choose b{font:800 clamp(24px,2.4vw,32px)/1.05 var(--f-head);letter-spacing:-.02em}
.choose span{display:flex;justify-content:space-between;align-items:center;font:500 12px var(--f-mono);letter-spacing:.06em}
.choose span i{font:800 22px var(--f-head);font-style:normal}

.signoff{position:relative;background:var(--plum);color:var(--paper);overflow:hidden}
.signoff::before{content:"";position:absolute;inset:0;background:url(../pattern/pattern-sljiva-1080x1350.svg) center/540px auto repeat;opacity:.55;-webkit-mask-image:linear-gradient(90deg,transparent 10%,#000 70%);mask-image:linear-gradient(90deg,transparent 10%,#000 70%)}
.signoff .wrap{position:relative;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:end;gap:32px;padding-block:clamp(64px,8vw,112px)}
@media(max-width:760px){.signoff .wrap{grid-template-columns:1fr}}
.logo-anim{position:relative;width:100%;max-width:640px;aspect-ratio:1600/436}
.logo-anim .ink{position:absolute;inset:0;background:var(--paper);-webkit-mask:url(../logo/marlek-mask.png) center/100% 100% no-repeat;mask:url(../logo/marlek-mask.png) center/100% 100% no-repeat;clip-path:inset(0 100% 0 0)}
.logo-anim .dot{position:absolute;left:54.25%;top:79.6%;width:4.75%;aspect-ratio:1;border-radius:50%;background:var(--butter);transform:translate(-50%,-50%) scale(0)}
.logo-anim.done .ink{clip-path:inset(0 0 0 0)}
.logo-anim.done .dot{transform:translate(-50%,-50%) scale(1)}
.slogan{font:800 clamp(34px,4.6vw,64px)/.98 var(--f-head);letter-spacing:-.035em;text-align:right}
.slogan span{display:block;opacity:0;transform:translateY(14px);transition:opacity 700ms var(--ease),transform 700ms var(--ease)}
.slogan.in span{opacity:1;transform:none}
.slogan.in span+span{transition-delay:220ms}
@media(max-width:760px){.slogan{text-align:left}}

.ftr{padding-block:28px 36px;border-top:1.5px solid var(--line)}
.ftr .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:14px 28px;font:500 12px/1.5 var(--f-mono);letter-spacing:.06em}
.ftr nav{display:flex;flex-wrap:wrap;gap:6px 22px}
.ftr a{text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.ftr a:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- ponuda: hero ---------- */
.ohero{padding-top:clamp(36px,5vw,72px);padding-bottom:clamp(56px,7vw,96px)}
.ohero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,5vw,72px);align-items:center}
@media(max-width:980px){.ohero-grid{grid-template-columns:1fr}}
.ohero-copy{display:flex;flex-direction:column;gap:22px}
.ohero .h1{font-size:clamp(40px,5.4vw,76px)}
.ohero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding-top:4px}
.facts{display:flex;flex-wrap:wrap;gap:10px}
.fact{display:flex;flex-direction:column;gap:2px;padding:12px 16px;border-radius:14px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);min-width:120px}
.fact b{font:800 22px/1.05 var(--f-head);letter-spacing:-.015em}
.fact span{font:500 11px/1.3 var(--f-mono);letter-spacing:.05em;color:var(--soft);text-transform:uppercase}
.fact--hi{background:var(--butter);box-shadow:none}

.hero-devices{position:relative;padding:0 13% 28px 0}
.hero-devices .phone{position:absolute;right:0;bottom:0;width:27%;border-radius:26px;padding:6px}
.hero-devices .phone .screen{border-radius:20px}
.hero-devices .phone::before{top:11px;height:12px}
.toast{position:absolute;left:-14px;bottom:44px;z-index:4;display:flex;align-items:center;gap:12px;padding:12px 16px 12px 12px;border-radius:16px;background:var(--plum);color:var(--paper);box-shadow:0 18px 40px -16px rgba(53,30,40,.6);max-width:300px;opacity:0;transform:translateY(16px) scale(.96);transition:opacity 500ms var(--ease),transform 600ms var(--spring)}
.toast.show{opacity:1;transform:none}
.toast i{flex:0 0 36px;height:36px;border-radius:10px;background:var(--butter);display:flex;align-items:center;justify-content:center}
.toast b{display:block;font:700 15px/1.25 var(--f-body)}
.toast span{display:block;font:500 11px/1.4 var(--f-mono);letter-spacing:.05em;opacity:.8}
@media(max-width:560px){.toast{left:8px;bottom:-6px;max-width:250px}}

/* ---------- web: simptom / gubitak ---------- */
.leak{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,5vw,80px);align-items:center}
@media(max-width:900px){.leak{grid-template-columns:1fr}}
.bubbles{display:flex;flex-direction:column;gap:12px}
.bubble{align-self:flex-start;max-width:92%;padding:14px 18px;border-radius:20px 20px 20px 6px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);font:400 clamp(18px,1.6vw,21px)/1.35 var(--f-head);opacity:0;transform:translateY(12px);transition:opacity 500ms var(--ease),transform 500ms var(--ease)}
.bubble:nth-child(even){align-self:flex-end;border-radius:20px 20px 6px 20px;background:var(--sky);box-shadow:none}
.in .bubble{opacity:1;transform:none}
.in .bubble:nth-child(2){transition-delay:250ms}.in .bubble:nth-child(3){transition-delay:500ms}.in .bubble:nth-child(4){transition-delay:750ms}
.leak-card{background:var(--card);border:1.5px solid var(--plum);border-radius:24px;padding:clamp(18px,2.4vw,30px);display:flex;flex-direction:column;gap:18px}
.leak-svg{width:100%;height:auto}
.leak-svg text{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;fill:var(--plum)}
.leak-cost{display:flex;flex-direction:column;gap:6px;padding-top:16px;border-top:1.5px solid var(--line)}
.leak-cost b{font:800 clamp(22px,2vw,28px)/1.1 var(--f-head);letter-spacing:-.015em}

/* ---------- web: portfolio ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.tab{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:8px 18px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--plum);font:700 16px var(--f-body);transition:background 200ms ease,color 200ms ease}
.tab:hover{background:rgba(53,30,40,.06)}
.tab[aria-selected=true]{background:var(--plum);color:var(--paper)}
.tab:focus-visible{outline:2px solid var(--plum);outline-offset:3px}
.tab small{font:500 10px var(--f-mono);letter-spacing:.06em;opacity:.75}
.panel[hidden]{display:none}
.panel{animation:fadeIn 500ms var(--ease)}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.work{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(28px,4vw,64px);align-items:center}
@media(max-width:900px){.work{grid-template-columns:1fr}}
.work-copy{display:flex;flex-direction:column;gap:16px}
.work-copy .h3{font-size:clamp(34px,4vw,56px)}
.work-stage{position:relative;padding:0 15% 26px 0}
.work-stage .phone{position:absolute;right:0;bottom:0;width:25%;border-radius:26px;padding:6px}
.work-stage .phone .screen{border-radius:20px}
.work-stage .phone::before{top:11px;height:12px}
.before{display:flex;gap:14px;align-items:center;padding:12px;border-radius:16px;background:#EFE8DA}
.before img{width:120px;border-radius:6px;filter:grayscale(.35);box-shadow:0 6px 14px -8px rgba(53,30,40,.5)}
.before p{font-size:15px;line-height:1.45}

/* ---------- web: priča ---------- */
.story{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,32px);position:relative}
@media(max-width:900px){.story{grid-template-columns:1fr}}
.story-step{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.story-step .tag{font:500 12px var(--f-mono);letter-spacing:.08em;padding:6px 12px;border-radius:999px}
.story-step:nth-child(1) .tag{background:#EFE8DA}
.story-step:nth-child(2) .tag{background:var(--paper)}
.story-step:nth-child(3) .tag{background:var(--butter)}
.story-step .phone{width:min(240px,70%);align-self:center}
.story-step p{text-wrap:pretty}
.story-note{width:100%;aspect-ratio:390/800;max-width:240px;align-self:center;border-radius:20px;background:var(--card);border:1.5px dashed var(--plum);padding:22px 18px;display:flex;flex-direction:column;gap:14px}
.story-note li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;font-size:15px;line-height:1.4;opacity:0;transform:translateX(-8px);transition:opacity 500ms var(--ease),transform 500ms var(--ease)}
.in .story-note li{opacity:1;transform:none}
.in .story-note li:nth-child(2){transition-delay:300ms}.in .story-note li:nth-child(3){transition-delay:600ms}.in .story-note li:nth-child(4){transition-delay:900ms}
.story-note li::before{content:"";width:18px;height:18px;margin-top:2px;border-radius:50%;background:var(--butter) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23351E28' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/12px no-repeat}
.story-note h4{font:800 20px/1.1 var(--f-head)}
.story-arrow{position:absolute;top:120px;width:60px;height:24px;color:var(--plum)}
@media(max-width:900px){.story-arrow{display:none}}

/* ---------- web: value stack (račun) ---------- */
.stack{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,4vw,64px);align-items:start}
@media(max-width:900px){.stack{grid-template-columns:1fr}}
.receipt{position:relative;background:var(--card);border-radius:6px;padding:clamp(22px,3vw,40px);box-shadow:0 30px 60px -36px rgba(53,30,40,.45);--zig:radial-gradient(circle at 8px 0,transparent 7px,var(--card) 7.5px)}
.receipt::after{content:"";position:absolute;left:0;right:0;bottom:-12px;height:12px;background:var(--zig);background-size:16px 12px;background-position:-8px 0}
.receipt-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:14px;border-bottom:1.5px dashed var(--line-2)}
.receipt-group{padding:18px 0 6px}
.receipt-group h4{font:500 11px var(--f-mono);letter-spacing:.08em;color:var(--soft);margin-bottom:6px;text-transform:uppercase}
.ri{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:12px;align-items:baseline;padding:9px 0;border-bottom:1px solid var(--line);font-size:17px;line-height:1.4}
.ri .ck{width:20px;height:20px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--plum);position:relative;top:3px;transition:background 300ms ease}
.ri .ck::after{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23351E28' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/13px no-repeat;transform:scale(0);transition:transform 400ms var(--spring)}
.ri.on .ck{background:var(--butter);box-shadow:none}
.ri.on .ck::after{transform:scale(1)}
.ri em{font:500 11px var(--f-mono);font-style:normal;letter-spacing:.05em;color:var(--soft);white-space:nowrap}
.receipt-total{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap;padding-top:20px;margin-top:10px;border-top:2px solid var(--plum)}
.receipt-total b{font:800 clamp(36px,4vw,52px)/.9 var(--f-head);letter-spacing:-.03em}
.addons{display:flex;flex-direction:column;gap:16px}
.addons ul{display:flex;flex-wrap:wrap;gap:8px}
.addons li{padding:9px 14px;border-radius:12px;background:#EFE8DA;font-size:15px;line-height:1.3}
.addon-note{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;align-items:center;padding:16px;border-radius:16px;background:var(--plum);color:var(--paper);font-size:15px;line-height:1.45}
.addon-note img{width:48px;height:48px}

/* ---------- proces sa linijom ---------- */
.timeline{position:relative;display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:24px;padding-top:44px}
.timeline::before,.timeline .tl-fill{content:"";position:absolute;left:0;right:0;top:12px;height:3px;border-radius:3px;background:var(--line-2)}
.timeline .tl-fill{background:var(--plum);transform-origin:left;transform:scaleX(var(--p,0));transition:transform 200ms linear}
.tl-step{position:relative;display:flex;flex-direction:column;gap:10px}
.tl-step::before{content:"";position:absolute;left:0;top:-41px;width:22px;height:22px;border-radius:50%;background:var(--paper);box-shadow:inset 0 0 0 3px var(--line-2);transition:background 300ms ease,box-shadow 300ms ease}
.tl-step.on::before{background:var(--butter);box-shadow:inset 0 0 0 3px var(--plum)}
.tl-step .big{font:800 clamp(34px,4vw,56px)/.9 var(--f-head);letter-spacing:-.04em;color:var(--line-2);transition:color 400ms ease;font-variant-numeric:tabular-nums}
.tl-step.on .big{color:var(--plum)}
.tl-step .tl-l{font:500 11px var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.tl-step p{font-size:16px;line-height:1.5;color:var(--plum-2);text-wrap:pretty}
@media(max-width:860px){
  .timeline{grid-template-columns:1fr;padding-top:0;padding-left:44px;gap:28px}
  .timeline::before,.timeline .tl-fill{left:10px;right:auto;top:0;bottom:0;width:3px;height:auto}
  .timeline .tl-fill{transform:scaleY(var(--p,0));transform-origin:top}
  .tl-step::before{left:-44px;top:4px}
}

/* ---------- garancija ---------- */
.guar{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,80px);align-items:center}
@media(max-width:860px){.guar{grid-template-columns:1fr}}
.seal{position:relative;width:min(100%,340px);aspect-ratio:1;justify-self:center}
.seal svg.ring{position:absolute;inset:0;width:100%;height:100%;animation:spin 40s linear infinite}
.seal svg.ring text{font:500 13.2px var(--f-mono);letter-spacing:.2em;fill:var(--plum)}
.seal-core{position:absolute;inset:19%;border-radius:50%;background:var(--butter);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-align:center;box-shadow:0 0 0 10px var(--paper),0 0 0 11.5px var(--plum)}
.seal-core b{font:800 clamp(48px,6vw,72px)/.85 var(--f-head);letter-spacing:-.04em}
.seal-core span{font:500 11px/1.3 var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
@keyframes spin{to{transform:rotate(360deg)}}
.promise{display:flex;flex-direction:column}
.promise li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px;padding:18px 0;border-top:1.5px solid var(--plum);font:400 clamp(19px,1.7vw,23px)/1.35 var(--f-head);text-wrap:pretty}
.promise li:last-child{border-bottom:1.5px solid var(--plum)}
.promise li::before{content:"";width:26px;height:26px;border-radius:50%;background:var(--plum) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5DE7A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/15px no-repeat;margin-top:2px}

/* test izveštaj (systems garancija) */
.report{background:var(--card);border:1.5px solid var(--plum);border-radius:22px;padding:clamp(18px,2.4vw,28px);display:flex;flex-direction:column;gap:6px;box-shadow:0 30px 60px -36px rgba(53,30,40,.45)}
.report-head{display:flex;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1.5px solid var(--plum)}
.rt{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-size:16px;line-height:1.35}
.rt small{display:block;font:500 10px var(--f-mono);letter-spacing:.06em;color:var(--soft)}
.rt .st{font:500 11px var(--f-mono);letter-spacing:.06em;padding:5px 10px;border-radius:999px;background:var(--line);color:var(--soft);transition:background 300ms ease,color 300ms ease;white-space:nowrap}
.rt.ok .st{background:var(--plum);color:var(--paper)}
.pay{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;padding:14px 16px;border-radius:14px;background:#EFE8DA;transition:background 400ms ease}
.pay b{font:800 18px/1.2 var(--f-head)}
.pay .lock{width:36px;height:36px;flex:0 0 36px}
.pay .lock .shackle{transition:transform 500ms var(--spring);transform-origin:16px 14px}
.pay.open{background:var(--butter)}
.pay.open .lock .shackle{transform:translateY(-4px) rotate(-28deg)}

/* ---------- FAQ ---------- */
.faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(28px,5vw,80px);align-items:start}
@media(max-width:860px){.faq{grid-template-columns:1fr}}
.qa{border-top:1.5px solid var(--plum)}
.qa:last-child{border-bottom:1.5px solid var(--plum)}
.qa summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(0,1fr) 28px;gap:16px;align-items:center;padding:20px 0;font:800 clamp(19px,1.7vw,23px)/1.2 var(--f-head);letter-spacing:-.01em;min-height:44px}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";font:800 26px/1 var(--f-head);text-align:center;transition:transform 300ms var(--spring)}
.qa[open] summary::after{transform:rotate(45deg)}
.qa p{padding:0 44px 22px 0;color:var(--plum-2);text-wrap:pretty}

/* ---------- CTA forma ---------- */
.cta{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,80px);align-items:start}
@media(max-width:900px){.cta{grid-template-columns:1fr}}
.form{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font:500 12px var(--f-mono);letter-spacing:.06em;text-transform:uppercase}
.field label small{text-transform:none;letter-spacing:0;font-family:var(--f-body);font-size:13px;opacity:.75}
.field input,.field textarea{font:400 18px/1.4 var(--f-body);color:var(--plum);background:var(--paper);border:1.5px solid transparent;border-radius:14px;padding:14px 16px;min-height:52px;width:100%}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--butter);box-shadow:0 0 0 3px rgba(245,222,122,.45)}
.form .btn{align-self:flex-start}
.form-note{font-size:15px;opacity:.85}
.form-ok{display:none;padding:18px 20px;border-radius:16px;background:var(--butter);color:var(--plum);font-weight:700}
.form.sent .form-ok{display:block}
.form.sent .field,.form.sent .btn{display:none}
.hp{position:absolute;left:-9999px}
.preview{background:var(--paper);color:var(--plum);border-radius:22px;padding:clamp(20px,2.4vw,28px);display:flex;flex-direction:column;gap:14px;transform:rotate(1.5deg);box-shadow:0 30px 60px -30px rgba(0,0,0,.5)}
.preview-head{display:flex;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1.5px solid var(--plum)}
.pv-item{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start}
.pv-item b{width:34px;height:34px;border-radius:50%;background:var(--sky);display:flex;align-items:center;justify-content:center;font:800 16px var(--f-head)}
.pv-item:nth-child(3) b{background:var(--butter)}
.pv-lines{display:flex;flex-direction:column;gap:7px;padding-top:4px}
.pv-lines i{display:block;height:10px;border-radius:4px;background:var(--line-2)}
.pv-lines i:first-child{background:var(--plum);opacity:.85;height:12px;width:70%}
.pv-lines i:nth-child(3){width:60%}
.flowmini{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.flowmini span{padding:8px 12px;border-radius:10px;background:#EFE8DA;font:500 12px var(--f-mono);letter-spacing:.04em}
.flowmini span.hi{background:var(--butter)}
.flowmini i{font:800 16px var(--f-head);font-style:normal}

/* ---------- systems: princip (Danas / Sa sistemom) ---------- */
.flow{position:relative;display:flex;flex-direction:column;gap:14px}
.flow-stage{position:relative;height:var(--fh,440px);border-radius:24px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);overflow:hidden}
.flow-stage::before{content:"";position:absolute;inset:0;background-image:linear-gradient(#EFE8DA 1px,transparent 1px),linear-gradient(90deg,#EFE8DA 1px,transparent 1px);background-size:28px 28px;opacity:1;transition:opacity 600ms ease}
.flow[data-state=order] .flow-stage::before{opacity:0}
.flow-board{position:absolute;inset:0;padding:16px 4% 0;opacity:0;transition:opacity 500ms ease}
.flow[data-state=order] .flow-board{opacity:1;transition-delay:250ms}
.flow-board .fb-h{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1.2fr);gap:10px;padding:0 14px 10px;border-bottom:1.5px solid var(--plum);font:500 10px var(--f-mono);letter-spacing:.08em}
.fi{position:absolute;left:var(--cx);top:var(--cy);width:var(--cw,42%);transform:rotate(var(--cr,0deg));transition:left 900ms var(--spring),top 900ms var(--spring),width 900ms var(--spring),transform 900ms var(--spring);transition-delay:calc(var(--i) * 70ms);z-index:2}
.flow[data-state=order] .fi{left:4%;top:calc(var(--top0,62px) + var(--i) * var(--rowh,66px));width:92%;transform:none}
.fi-in{position:relative;display:grid;border-radius:14px;background:var(--card);box-shadow:0 0 0 1.5px var(--plum),0 12px 24px -16px rgba(53,30,40,.5)}
.fi-raw,.fi-row{grid-area:1/1;transition:opacity 400ms ease}
.fi-raw{padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.fi-raw .src{font:500 10px var(--f-mono);letter-spacing:.08em;display:flex;align-items:center;gap:6px}
.fi-raw p{font:400 15px/1.3 var(--f-body)}
.fi-raw .warn{align-self:flex-start;margin-top:2px;font:500 10px var(--f-mono);letter-spacing:.04em;padding:3px 8px;border-radius:999px;background:var(--butter)}
.fi-row{opacity:0;display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1.2fr);gap:10px;align-items:center;padding:10px 14px;min-height:50px}
.fi-row b{font:700 15px/1.25 var(--f-body);display:flex;align-items:center;gap:8px;min-width:0}
.fi-row b span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fi-row .stt{justify-self:start;font:500 11px/1.2 var(--f-mono);letter-spacing:.04em;padding:5px 10px;border-radius:999px;background:var(--sky);white-space:nowrap}
.fi-row .stt.y{background:var(--butter)}.fi-row .stt.p{background:var(--plum);color:var(--paper)}
.fi-row .nx{font:400 14px/1.3 var(--f-body);color:var(--plum-2)}
.flow[data-state=order] .fi-raw{opacity:0;position:absolute;inset:0;overflow:hidden}
.flow[data-state=order] .fi-row{opacity:1;transition-delay:calc(300ms + var(--i) * 70ms)}
.ic{width:18px;height:18px;flex:0 0 18px;border-radius:5px;display:inline-flex;align-items:center;justify-content:center;font:800 10px/1 var(--f-head);color:var(--paper);background:var(--plum)}
.ic.ig{background:linear-gradient(135deg,#F5DE7A,#D9849B 55%,#7D5AA6)}
.ic.wa{background:#4FA36B}.ic.ml{background:#8AA9CC}.ic.tb{background:#6E9E73}.ic.pp{background:var(--butter);color:var(--plum)}
.flow-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.seg{display:inline-flex;padding:4px;border-radius:999px;box-shadow:inset 0 0 0 1.5px currentColor}
.seg button{all:unset;cursor:pointer;min-height:38px;padding:0 16px;border-radius:999px;display:inline-flex;align-items:center;font:500 12px var(--f-mono);letter-spacing:.06em;transition:background 250ms ease,color 250ms ease}
.seg button[aria-pressed=true]{background:var(--plum);color:var(--paper)}
.seg button:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.flow-cap{font-size:16px;line-height:1.45;min-height:3em;max-width:520px}
.on-dark .seg button[aria-pressed=true]{background:var(--paper);color:var(--plum)}
@media(max-width:600px){
  .fi-row{grid-template-columns:minmax(0,1fr) auto;padding:8px 10px;min-height:44px}
  .fi-row .nx{display:none}
  .flow-board .fb-h{grid-template-columns:minmax(0,1fr) auto}
  .flow-board .fb-h span:last-child{display:none}
  .fi-raw p{font-size:13px}
  .fi-row b{font-size:13px}
}
.door .flow-stage{--fh:340px}
.door--sys .flow-stage{background:#43283A;box-shadow:none}
.door--sys .flow-stage::before{background-image:linear-gradient(rgba(245,240,230,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(245,240,230,.06) 1px,transparent 1px)}
.door--sys .flow-board .fb-h{border-color:var(--paper);color:var(--paper)}
.door--sys .fi-in{color:var(--plum)}

/* ---------- systems: cena haosa ---------- */
.costs{display:flex;flex-direction:column}
.cost{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);gap:16px;align-items:center;padding:18px 0;border-top:1.5px solid var(--plum)}
.cost:last-child{border-bottom:1.5px solid var(--plum)}
.cost q{font:400 clamp(20px,1.9vw,26px)/1.25 var(--f-head);quotes:"„" "”"}
.cost .to{height:2px;background:var(--plum);position:relative;transform:scaleX(0);transform-origin:left;transition:transform 600ms var(--ease) 200ms}
.cost .to::after{content:"";position:absolute;right:-2px;top:-5px;border:6px solid transparent;border-left:8px solid var(--plum);border-right:0}
.in .cost .to,.cost.in .to{transform:scaleX(1)}
.cost span{display:flex;gap:10px;align-items:baseline;font:700 17px/1.4 var(--f-body)}
.cost span::before{content:"";flex:0 0 10px;height:10px;border-radius:50%;background:var(--butter);box-shadow:0 0 0 1.5px var(--plum)}
@media(max-width:700px){.cost{grid-template-columns:1fr;gap:10px}.cost .to{width:40px}}
.costs-foot{margin-top:28px;font:800 clamp(24px,2.4vw,34px)/1.1 var(--f-head);letter-spacing:-.02em;max-width:760px}

/* ---------- systems: primene ---------- */
.use{display:flex;flex-direction:column;gap:clamp(28px,3.5vw,48px)}
.use+.use{margin-top:clamp(80px,10vw,140px)}
.use-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:20px clamp(32px,5vw,80px);align-items:end}
@media(max-width:900px){.use-head{grid-template-columns:1fr}}
.use-head .num{font:500 12px var(--f-mono);letter-spacing:.08em}
.stat{display:flex;flex-direction:column;gap:6px;padding:20px 0;border-top:1.5px solid var(--plum);border-bottom:1.5px solid var(--plum)}
.stat b{font:800 clamp(44px,5vw,72px)/.9 var(--f-head);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.stat>span{font-size:17px;line-height:1.45;text-wrap:pretty}
.stat>.cap{font-size:11px}
.stat .cap{margin-top:4px}

/* inbox simulacija */
.sim{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(14px,2vw,24px)}
@media(max-width:900px){.sim{grid-template-columns:1fr}}
.simc{background:var(--card);border:1.5px solid var(--plum);border-radius:22px;padding:clamp(16px,2vw,22px);display:flex;flex-direction:column;gap:14px;min-width:0}
.simc-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1.5px solid var(--plum);font:500 11px var(--f-mono);letter-spacing:.06em}
.chat{display:flex;flex-direction:column;gap:12px;min-height:190px}
.msg{max-width:84%;padding:10px 14px;font:400 16px/1.35 var(--f-body);opacity:0;transform:translateY(8px);transition:opacity 380ms var(--ease),transform 380ms var(--ease)}
.msg.show{opacity:1;transform:none}
.msg.in{align-self:flex-start;border-radius:16px 16px 16px 4px;background:#EFE8DA}
.msg.out{align-self:flex-end;border-radius:16px 16px 4px 16px;background:var(--plum);color:var(--paper)}
.msg.typing{padding:12px 14px}
.dots3 i{display:inline-block;width:7px;height:7px;margin:0 2px;border-radius:50%;background:var(--paper);animation:dot3 900ms ease-in-out infinite}
.dots3 i:nth-child(2){animation-delay:150ms}.dots3 i:nth-child(3){animation-delay:300ms}
@keyframes dot3{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}
.msg-meta{align-self:flex-end;font:500 11px var(--f-mono);letter-spacing:.05em;opacity:0;transition:opacity 300ms ease}
.msg-meta.show{opacity:.8}
.lanes{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.lane{display:flex;flex-direction:column;gap:8px}
.lane-t{font:500 10px/1.3 var(--f-mono);letter-spacing:.05em;opacity:.55;padding-bottom:6px;border-bottom:2px solid var(--line);transition:opacity 300ms ease,border-color 300ms ease;min-height:34px}
.lane.on .lane-t{opacity:1;border-color:var(--plum)}
.lane-slot{height:96px;border-radius:12px;background:repeating-linear-gradient(135deg,#F3EDE2 0 8px,var(--card) 8px 16px);box-shadow:inset 0 0 0 1px var(--line)}
.token{position:absolute;top:50px;left:0;width:calc((100% - 32px)/5);height:96px;border-radius:12px;background:var(--card);box-shadow:0 0 0 1.5px var(--plum),0 14px 24px -14px rgba(53,30,40,.5);padding:10px;display:flex;flex-direction:column;justify-content:space-between;transform:translateX(calc(var(--s,0) * (100% + 8px)));transition:transform 650ms var(--spring),background 300ms ease}
.token .t1{display:flex;justify-content:space-between;align-items:center;font:500 10px var(--f-mono);letter-spacing:.05em}
.token .t2{font:700 13px/1.25 var(--f-body);filter:blur(3.5px);user-select:none}
.token .t3{font:500 10px var(--f-mono);letter-spacing:.04em}
.lanes-foot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font:500 11px var(--f-mono);letter-spacing:.05em;color:var(--soft);padding-top:6px}
@media(max-width:600px){
  .lanes{grid-template-columns:1fr;gap:0}
  .lane{flex-direction:row;align-items:center;min-height:46px;border-bottom:1px solid var(--line)}
  .lane-t{border:0;min-height:0;padding:0;font-size:11px}
  .lane-slot{display:none}
  .token{top:4px;left:auto;right:0;width:50%;height:38px;flex-direction:row;align-items:center;gap:8px;padding:0 10px;transform:translateY(calc(var(--s,0) * 46px))}
  .token .t3{display:none}
}

/* tabela -> dokument */
.tdoc{display:grid;grid-template-columns:minmax(0,1.2fr) 120px minmax(0,1fr);gap:0;align-items:center}
@media(max-width:900px){.tdoc{grid-template-columns:1fr}}
.tbl{background:var(--card);border:1.5px solid var(--line-2);border-radius:16px;overflow:hidden}
.tr{display:grid;grid-template-columns:1.1fr 1.2fr .8fr .8fr;border-bottom:1px solid var(--line)}
.tr>span{padding:12px 10px;font-size:14px;line-height:1.3;border-right:1px solid var(--line);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr.th>span{font:500 10px var(--f-mono);letter-spacing:.06em;padding:12px 10px}
.tr.dim{opacity:.45}
.tr.hot{background:var(--butter);font-weight:700;position:relative;transition:box-shadow 300ms ease}
.tdoc.run .tr.hot{box-shadow:inset 0 0 0 2px var(--plum)}
.blur{filter:blur(4px);user-select:none}
.tdoc-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:16px 0}
.tdoc-mid svg.arrowpath{width:110px;height:50px;overflow:visible}
.tdoc-mid svg.arrowpath path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 900ms var(--ease)}
.tdoc.run .tdoc-mid svg.arrowpath path{stroke-dashoffset:0}
@media(max-width:900px){.tdoc-mid{flex-direction:row;padding:18px 0}.tdoc-mid svg.arrowpath{transform:rotate(90deg);width:60px}}
.doc{background:var(--card);border:1.5px solid var(--line-2);border-radius:6px;padding:clamp(20px,2.6vw,30px);display:flex;flex-direction:column;gap:14px;box-shadow:0 24px 48px -32px rgba(53,30,40,.5)}
.doc-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;padding-bottom:12px;border-bottom:1.5px solid var(--plum)}
.doc-h b{font:800 26px/1 var(--f-head)}
.df{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;padding-bottom:10px;border-bottom:1px solid var(--line);font-size:15px;opacity:.15;transition:opacity 400ms ease}
.df.on{opacity:1}
.df span:first-child{font:500 10px var(--f-mono);letter-spacing:.06em;color:var(--soft);padding-top:3px}
.doc-ok{align-self:flex-start;font:500 11px var(--f-mono);letter-spacing:.06em;padding:6px 10px;border-radius:999px;background:var(--sky);opacity:0;transition:opacity 400ms ease}
.doc-ok.on{opacity:1}

/* uređaj sa videima */
.vdev{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.6fr);gap:clamp(24px,4vw,56px);align-items:center;margin-top:clamp(40px,5vw,64px);padding:clamp(20px,3vw,40px);border-radius:28px;background:#EFE8DA}
@media(max-width:900px){.vdev{grid-template-columns:1fr}}
.vtabs{display:flex;flex-direction:column;gap:8px}
.vtab{all:unset;cursor:pointer;display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:16px;transition:background 250ms ease}
.vtab b{font:800 20px/1.1 var(--f-head)}
.vtab span{font-size:15px;line-height:1.4;color:var(--plum-2)}
.vtab small{font:500 10px var(--f-mono);letter-spacing:.06em}
.vtab:hover{background:rgba(53,30,40,.05)}
.vtab[aria-selected=true]{background:var(--card);box-shadow:inset 0 0 0 1.5px var(--plum)}
.vtab:focus-visible{outline:2px solid var(--plum);outline-offset:2px}
.vstage{position:relative;display:flex;align-items:center;justify-content:center;min-height:360px}
.vpanel{width:100%;display:flex;justify-content:center}
.vpanel[hidden]{display:none}
.vpanel .browser{width:100%}
.vpanel .phone{width:min(260px,62%)}
.vpanel .screen{background:#111}
.vpanel video{width:100%;height:100%;object-fit:contain;background:#111}
.poster{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(14px,2vw,22px);background:var(--plum);color:var(--paper);border:0;cursor:pointer;text-align:left;font:inherit;transition:opacity 400ms ease}
.poster::before{content:"";position:absolute;inset:0;background:url(../pattern/pattern-sljiva-1080x1350.svg) center/360px auto repeat;opacity:.6}
.poster>*{position:relative}
.poster img{width:min(110px,32%)}
.poster b{font:800 clamp(20px,2.2vw,30px)/1.08 var(--f-head);letter-spacing:-.02em;max-width:92%}
.poster .play{display:inline-flex;align-items:center;gap:10px;font:500 12px var(--f-mono);letter-spacing:.06em}
.poster .play i{width:46px;height:46px;border-radius:50%;background:var(--butter);display:flex;align-items:center;justify-content:center}
.poster:hover .play i{transform:scale(1.06)}
.playing .poster{opacity:0;pointer-events:none}
.phone .poster{border-radius:27px}
.vcap{margin-top:14px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}

/* b2b */
.b2b{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:start}
@media(max-width:900px){.b2b{grid-template-columns:1fr}}
.blist{position:relative;border-top:1.5px solid var(--plum);border-bottom:1.5px solid var(--plum)}
.bl-h,.bl-r{display:grid;grid-template-columns:40px minmax(0,1.4fr) minmax(0,1fr) 28px;gap:12px;align-items:center}
.bl-h{padding:12px 0;border-bottom:1.5px solid var(--plum);font:500 10px var(--f-mono);letter-spacing:.06em}
.bl-r{min-height:44px;border-bottom:1px solid var(--line);opacity:0;transform:translateY(6px);transition:opacity 400ms var(--ease),transform 400ms var(--ease)}
.bl-r.on{opacity:1;transform:none}
.bl-r>span:first-child{font:500 11px var(--f-mono);color:var(--soft)}
.bl-r .nm{font-weight:700;font-size:15px;white-space:nowrap;overflow:hidden}
.bl-r .ct{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.blist-rows{-webkit-mask-image:linear-gradient(#000 70%,transparent);mask-image:linear-gradient(#000 70%,transparent)}
.bcount{position:absolute;right:0;bottom:12px;display:flex;flex-direction:column;align-items:flex-end;gap:4px;background:var(--paper);padding:10px 0 6px 16px;border-radius:12px 0 0 0}
.bcount b{font:800 clamp(72px,9vw,128px)/.82 var(--f-head);letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.fu{display:flex;flex-direction:column}
.fu li{position:relative;display:grid;grid-template-columns:28px minmax(0,1fr);gap:14px;padding:0 0 22px}
.fu li::before{content:"";width:16px;height:16px;border-radius:50%;margin:4px 0 0 4px;box-shadow:inset 0 0 0 2px var(--line-2);background:var(--paper);transition:background 300ms ease,box-shadow 300ms ease;z-index:1}
.fu li::after{content:"";position:absolute;left:11px;top:22px;bottom:-2px;width:2px;background:var(--line-2)}
.fu li:last-child::after{display:none}
.fu li.on::before{background:var(--butter);box-shadow:inset 0 0 0 2px var(--plum)}
.fu li.on::after{background:var(--plum)}
.fu b{display:block;font:800 19px/1.2 var(--f-head)}
.fu small{display:block;font:500 10px var(--f-mono);letter-spacing:.08em;color:var(--soft);margin-bottom:2px}
.fu p{font-size:15px;line-height:1.45;color:var(--plum-2);margin-top:3px}
.fu li:last-child b{display:inline-block;background:var(--butter);padding:0 6px;border-radius:4px}

/* sprint */
.sprint{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;counter-reset:s}
@media(max-width:980px){.sprint{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.sprint{grid-template-columns:1fr}}
.sp{position:relative;display:flex;flex-direction:column;gap:12px;padding:22px;border-radius:22px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);min-width:0}
.sp:not(:last-child)::after{content:"";position:absolute;right:-12px;top:50px;width:10px;height:10px;border-top:2px solid var(--plum);border-right:2px solid var(--plum);transform:rotate(45deg);z-index:2}
@media(max-width:980px){.sp::after{display:none}}
.sp .n{font:800 40px/.9 var(--f-head);letter-spacing:-.04em}
.sp svg{width:64px;height:64px}
.sp p{font-size:16px;line-height:1.5;color:var(--plum-2)}
.sp ul{display:flex;flex-direction:column;gap:6px;margin-top:auto;padding-top:12px;border-top:1px solid var(--line)}
.sp li{font:500 11px/1.4 var(--f-mono);letter-spacing:.04em;display:flex;gap:8px}
.sp li::before{content:"✓";font-family:var(--f-body);font-weight:700}
.sp:last-child{background:var(--plum);color:var(--paper);box-shadow:none}
.sp:last-child p{color:var(--paper);opacity:.85}
.sp:last-child ul{border-color:rgba(245,240,230,.2)}
.price-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 32px;align-items:center;margin-top:20px;padding:22px 26px;border-radius:22px;background:var(--butter)}
@media(max-width:700px){.price-row{grid-template-columns:1fr}}
.price-row b{font:800 clamp(24px,2.4vw,32px)/1.1 var(--f-head);letter-spacing:-.02em}

/* skrivene sekcije */
[data-pending]{display:none!important}

/* reduced motion */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0ms!important}
  [data-reveal]{opacity:1;transform:none}
  .seal svg.ring{animation:none}
}

/* telefon: sitne korekcije */
@media(max-width:600px){
  .tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut)}
  .tabs::-webkit-scrollbar{display:none}
  .tab{flex:0 0 auto}
  .story-note{aspect-ratio:auto}
  .door-visual{min-height:0;padding:8px 0}
  .door .quote{min-height:0}
  .door .flow-stage{--fh:320px}
}
:lang(en) .cost q{quotes:"“" "”"}

/* fotografija Marie i Alekse */
.duo-photo{position:relative;isolation:isolate;margin:0 0 0 clamp(0px,2vw,24px);max-width:520px;justify-self:center;width:100%}
.duo-photo::before{content:"";position:absolute;left:-24px;bottom:-24px;width:62%;height:48%;background:var(--sky);border-radius:22px;z-index:-1}
.duo-photo img{width:100%;border-radius:22px;box-shadow:0 30px 60px -34px rgba(53,30,40,.5)}
.duo-photo figcaption{position:absolute;inset:auto 14px 14px 14px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;pointer-events:none}
.chip{font:500 11px/1.2 var(--f-mono);letter-spacing:.06em;padding:8px 12px;border-radius:999px;background:var(--paper);color:var(--plum);box-shadow:0 6px 16px -8px rgba(53,30,40,.4)}
.chip--a{background:var(--butter)}
@media(max-width:860px){.duo-photo{margin:0 0 12px 12px;max-width:440px;width:calc(100% - 12px)}.duo-photo::before{left:-12px;bottom:-12px}}

/* ===================== v12.1: manje teksta, bez mono fonta ===================== */
:root{--f-mono:var(--f-body)}
.eyebrow,.cap,.mono,.pill,.tab small,.hdr-nav,.lang,.door-name small,.fact span,.tl-step .tl-l,.lane-t,.token .t1,.token .t3,.lanes-foot,.simc-h,.msg-meta,.tr.th>span,.df span:first-child,.doc-ok,.bl-h,.bl-r>span:first-child,.fu small,.rt small,.rt .st,.sp li,.vtab small,.poster .play,.preview-head .cap,.flowmini span,.seg button,.fi-raw .src,.fi-raw .warn,.fi-row .stt,.flow-board .fb-h,.chip,.scroll-hint,.hdr-tag,.report-head .cap,.receipt-group h4,.ri em,.tl-l{text-transform:none!important;letter-spacing:0!important;font-family:var(--f-body)!important}
.eyebrow{font-weight:700;font-size:15px;color:var(--plum-2)}
.on-dark .eyebrow,.sec--plum .eyebrow{color:var(--butter)}
.cap{font-size:13px;font-weight:400}
.pill{font-weight:700;font-size:14px}
.hdr-nav{font-weight:700;font-size:15px}
.lang{font-weight:700;font-size:12px}

/* veliki blok ponude */
.offer{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(20px,3vw,48px);align-items:center;padding:clamp(24px,4vw,56px);border-radius:32px;background:var(--butter);color:var(--plum);overflow:hidden}
@media(max-width:860px){.offer{grid-template-columns:1fr}}
.offer::after{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.28)}
.offer-price{display:flex;flex-direction:column;gap:6px;position:relative;z-index:1}
.offer-price small{font:700 16px/1.2 var(--f-body)}
.offer-price b{font:800 clamp(84px,12vw,168px)/.82 var(--f-head);letter-spacing:-.06em}
.offer-price span{font:400 clamp(19px,1.8vw,24px)/1.25 var(--f-head)}
.offer-list{display:flex;flex-direction:column;gap:10px;position:relative;z-index:1}
.offer-list li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:center;padding:14px 16px;border-radius:16px;background:rgba(255,253,248,.7);font:800 clamp(18px,1.6vw,21px)/1.2 var(--f-head)}
.offer-list li::before{content:"";width:30px;height:30px;border-radius:50%;background:var(--plum) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5DE7A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/16px no-repeat}
.offer-list li small{display:block;font:400 14px/1.35 var(--f-body);margin-top:2px;color:var(--plum-2)}
.offer .btn{margin-top:8px;align-self:flex-start}
.stamp{position:absolute;right:clamp(16px,3vw,40px);top:clamp(16px,3vw,32px);z-index:2;width:112px;height:112px;border-radius:50%;background:var(--plum);color:var(--butter);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transform:rotate(10deg);font:800 30px/.9 var(--f-head)}
.stamp small{font:700 12px/1.2 var(--f-body);color:var(--paper);margin-top:4px}
@media(max-width:860px){.stamp{width:88px;height:88px;font-size:24px}}

/* ikonice umesto liste */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.tile{display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:20px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);font:800 17px/1.15 var(--f-head)}
.tile svg{width:40px;height:40px}
.tile small{font:400 14px/1.3 var(--f-body);color:var(--soft)}
.extras{margin-top:18px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.extras b{font:700 15px var(--f-body);margin-right:4px}
.extras span{padding:8px 12px;border-radius:999px;background:#EFE8DA;font-size:14px}

/* kratki proces u 3 koraka */
.steps3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media(max-width:760px){.steps3{grid-template-columns:1fr}}
.st3{display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:24px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.st3 b{font:800 clamp(44px,5vw,64px)/.9 var(--f-head);letter-spacing:-.04em}
.st3 span{font:800 20px/1.15 var(--f-head)}
.st3:nth-child(2){background:var(--sky);box-shadow:none}
.st3:nth-child(3){background:var(--plum);color:var(--paper);box-shadow:none}

/* foto blok bez opisa uloga */
.duo-photo figcaption{display:none}
.team{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,5vw,80px);align-items:center}
@media(max-width:860px){.team{grid-template-columns:1fr}}

/* novi footer */
.foot{background:var(--plum);color:var(--paper);position:relative;overflow:hidden}
.foot::before{content:"";position:absolute;inset:0;background:url(../pattern/pattern-sljiva-1080x1350.svg) center/540px auto repeat;opacity:.5;-webkit-mask-image:linear-gradient(90deg,transparent 30%,#000);mask-image:linear-gradient(90deg,transparent 30%,#000)}
.foot .wrap{position:relative;display:flex;flex-direction:column;gap:clamp(36px,5vw,64px);padding-block:clamp(56px,7vw,96px) 28px}
.foot-top{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:28px;align-items:end}
@media(max-width:760px){.foot-top{grid-template-columns:1fr}}
.foot .logo-anim{max-width:520px}
.foot-cta{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.foot-cta p{font:800 clamp(28px,3vw,40px)/1 var(--f-head);letter-spacing:-.03em}
.foot-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;padding-top:20px;border-top:1px solid rgba(245,240,230,.18);font-size:14px;color:#D9CEC4}
.foot-bot nav{display:flex;flex-wrap:wrap;gap:4px 20px}
.foot-bot a{color:var(--paper);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.foot-bot a:hover{text-decoration:underline;text-underline-offset:4px}

/* kraće sekcije */
.sec{padding-block:clamp(56px,7vw,104px)}
.sec-head{margin-bottom:clamp(28px,4vw,48px)}
.use+.use{margin-top:clamp(64px,8vw,112px)}
.big-stat{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.big-stat b{font:800 clamp(56px,7vw,96px)/.85 var(--f-head);letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.big-stat span{font:700 17px/1.3 var(--f-body);max-width:260px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);font:700 15px var(--f-body)}
.chips span i{width:22px;height:22px;border-radius:50%;background:var(--butter);display:inline-flex;align-items:center;justify-content:center;font:800 11px var(--f-head);font-style:normal}
#garancija{overflow:hidden}
.tiles{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:860px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
.field label{text-transform:none;letter-spacing:0;font:700 15px var(--f-body)}
.offer-price .stamp{position:absolute;right:0;top:-8px}
@media(max-width:860px){.offer-price .stamp{top:-4px;right:-4px}}
.big-stat span{font:inherit;max-width:none}
.big-stat>span{font:700 17px/1.3 var(--f-body);max-width:260px}
.door--sys .pill--butter{color:var(--plum)}

/* ===================== v13: landing za automatizacije ===================== */
.lp-hdr .wrap{justify-content:space-between}
.lp-hero{padding-top:clamp(28px,4vw,56px);padding-bottom:clamp(48px,6vw,88px)}
.lp-hero .h1{font-size:clamp(38px,5.2vw,72px)}
.lp-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,4vw,64px);align-items:center}
@media(max-width:980px){.lp-hero-grid{grid-template-columns:1fr}}
.cta-block{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.cta-note{font-size:14px;color:var(--soft)}
.on-dark .cta-note{color:#D9CEC4}
.trust{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:6px}
.trust span{display:inline-flex;align-items:center;gap:8px;font:700 14px/1.3 var(--f-body)}
.trust span::before{content:"";flex:0 0 18px;height:18px;border-radius:50%;background:var(--butter) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23351E28' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/11px no-repeat}
.hero-video .browser{width:100%}
.hero-video .screen{background:#111}
.hero-video video{width:100%;height:100%;object-fit:contain;background:#111}
.hero-video .cap{margin-top:10px}
.lp-sec-head{display:flex;flex-direction:column;gap:14px;max-width:820px;margin-bottom:clamp(28px,4vw,48px)}
.lp-sec-head p{font-size:clamp(18px,1.5vw,20px);line-height:1.55;color:var(--plum-2);max-width:62ch}
.on-dark .lp-sec-head p{color:#E7DDD0}

/* lanac prepisivanja */
.chain{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;position:relative}
@media(max-width:760px){.chain{grid-template-columns:repeat(2,minmax(0,1fr))}}
.link-card{position:relative;display:flex;flex-direction:column;gap:10px;padding:18px;border-radius:20px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);opacity:.35;transform:translateY(8px);transition:opacity 500ms var(--ease),transform 500ms var(--ease),box-shadow 400ms ease}
.in .link-card{opacity:1;transform:none;box-shadow:inset 0 0 0 1.5px var(--plum)}
.in .link-card:nth-child(2){transition-delay:400ms}.in .link-card:nth-child(3){transition-delay:800ms}.in .link-card:nth-child(4){transition-delay:1200ms}
.link-card b{font:800 20px/1.1 var(--f-head)}
.link-card .typed{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;padding:5px 10px;border-radius:999px;background:#EFE8DA;font:700 13px var(--f-body)}
.link-card .typed i{width:2px;height:14px;background:var(--plum);animation:blink 1s steps(1) infinite}
.link-card:first-child .typed{background:var(--sky)}
@keyframes blink{50%{opacity:0}}
.chain-total{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px 16px;align-items:baseline;font:800 clamp(22px,2.2vw,30px)/1.15 var(--f-head)}
.chain-total span{font:400 17px/1.4 var(--f-body);color:var(--plum-2)}

/* kalkulator */
.calc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);align-items:stretch;padding:clamp(22px,3vw,40px);border-radius:28px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
@media(max-width:760px){.calc{grid-template-columns:1fr}}
.calc-in{display:flex;flex-direction:column;gap:22px}
.calc-in label{display:flex;flex-direction:column;gap:10px;font:700 16px var(--f-body)}
.calc-in .row{display:flex;align-items:center;gap:14px}
.calc-in input[type=range]{flex:1;accent-color:var(--plum);height:28px}
.calc-in output{min-width:64px;text-align:right;font:800 26px/1 var(--f-head);font-variant-numeric:tabular-nums}
.calc-out{display:flex;flex-direction:column;justify-content:center;gap:6px;padding:24px;border-radius:20px;background:var(--plum);color:var(--paper)}
.calc-out small{font:700 15px var(--f-body);color:var(--butter)}
.calc-out b{font:800 clamp(52px,6vw,84px)/.9 var(--f-head);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.calc-out span{font-size:16px;color:#E7DDD0}

/* poređenje */
.cmp-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:22px;box-shadow:inset 0 0 0 1.5px var(--line-2);background:var(--card)}
.cmp{width:100%;min-width:720px;border-collapse:collapse;font-size:15px;line-height:1.4}
.cmp th,.cmp td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.cmp thead th{font:800 16px/1.2 var(--f-head);background:#EFE8DA}
.cmp thead th.us{background:var(--plum);color:var(--paper)}
.cmp td.us{background:#FFF7D6;font-weight:700}
.cmp tbody th{font:700 15px var(--f-body);color:var(--plum-2);width:22%}
.cmp tr:last-child td,.cmp tr:last-child th{border-bottom:0}

/* mehanizam */
.mech{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
@media(max-width:860px){.mech{grid-template-columns:1fr}}
.mstep{display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:24px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.mstep .n{width:40px;height:40px;border-radius:50%;background:var(--butter);display:flex;align-items:center;justify-content:center;font:800 18px var(--f-head)}
.mstep h3{font:800 clamp(22px,2vw,28px)/1.1 var(--f-head)}
.mstep p{font-size:16px;line-height:1.5;color:var(--plum-2)}
.mstep .mini{margin-top:auto;padding:14px;border-radius:14px;background:#EFE8DA;display:flex;flex-direction:column;gap:8px;min-height:120px;justify-content:center}
.mini .cell{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.mini .cell i{height:22px;border-radius:4px;background:var(--card);box-shadow:inset 0 0 0 1px var(--line-2)}
.mini .cell.hot i{background:var(--butter);box-shadow:none}
.mini .docm{background:var(--card);border-radius:8px;padding:10px;display:flex;flex-direction:column;gap:6px}
.mini .docm i{display:block;height:7px;border-radius:3px;background:var(--line-2)}
.mini .docm i:first-child{width:60%;height:10px;background:var(--plum)}
.approve{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:999px;background:var(--plum);color:var(--paper);font:700 14px var(--f-body);animation:press 3.2s ease-in-out infinite}
@keyframes press{0%,60%,100%{transform:scale(1);background:var(--plum)}66%{transform:scale(.93)}72%,92%{background:#4FA36B}}
.mstep:last-child{background:var(--plum);color:var(--paper);box-shadow:none}
.mstep:last-child p{color:#E7DDD0}
.mstep:last-child .mini{background:rgba(245,240,230,.08)}

/* pre/posle */
.ba{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:760px){.ba{grid-template-columns:1fr}}
.ba-col{padding:24px;border-radius:24px;display:flex;flex-direction:column;gap:12px}
.ba-col h3{font:800 22px/1.1 var(--f-head)}
.ba-col li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;font-size:17px;line-height:1.4}
.ba-before{background:#EFE8DA}
.ba-before li::before{content:"✕";font:800 16px var(--f-head);color:var(--soft)}
.ba-after{background:var(--sky)}
.ba-after li::before{content:"✓";font:800 16px var(--f-head)}
.resist{margin-top:16px;padding:18px 22px;border-radius:18px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);font-size:17px;line-height:1.5}
.resist b{font-family:var(--f-head);font-size:19px}

/* dokazi */
.proofstrip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}
@media(max-width:860px){.proofstrip{grid-template-columns:1fr}}
.pcard{padding:22px;border-radius:22px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);display:flex;flex-direction:column;gap:8px}
.pcard b{font:800 clamp(40px,4vw,56px)/.9 var(--f-head);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.pcard span{font-size:16px;line-height:1.45}
.pcard small{font-size:13px;color:var(--soft)}

/* ponuda kartice */
.getgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
@media(max-width:980px){.getgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.getgrid{grid-template-columns:1fr}}
.get{padding:18px;border-radius:18px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);display:flex;flex-direction:column;gap:6px}
.get b{font:800 18px/1.15 var(--f-head)}
.get span{font-size:15px;line-height:1.45;color:var(--plum-2)}
.early{margin-top:16px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding:16px 20px;border-radius:18px;background:var(--plum);color:var(--paper);font-size:16px}
.early b{font:800 20px var(--f-head);color:var(--butter)}
.ps{max-width:68ch;font-size:18px;line-height:1.6;padding-top:24px;border-top:1px solid rgba(245,240,230,.2);margin-top:36px}
.ps b{color:var(--butter)}

/* ===================== v13: Web landing ===================== */
.ba-slider{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:6px;background:#fff;touch-action:pan-y}
.ba-slider img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}
.ba-slider .ba-new{clip-path:inset(0 0 0 var(--pos,50%))}
.ba-slider .ba-line{position:absolute;top:0;bottom:0;left:var(--pos,50%);width:3px;margin-left:-1.5px;background:var(--butter);box-shadow:0 0 0 1px rgba(53,30,40,.3);pointer-events:none}
.ba-slider .ba-knob{position:absolute;top:50%;left:var(--pos,50%);width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:var(--butter);box-shadow:0 6px 18px -6px rgba(53,30,40,.6);display:flex;align-items:center;justify-content:center;font:800 16px var(--f-head);pointer-events:none}
.ba-slider input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.ba-slider input:focus-visible~.ba-knob{outline:3px solid var(--plum);outline-offset:3px}
.ba-tag{position:absolute;top:12px;padding:6px 12px;border-radius:999px;font:700 13px var(--f-body);pointer-events:none}
.ba-tag.l{left:12px;background:rgba(53,30,40,.85);color:var(--paper)}
.ba-tag.r{right:12px;background:var(--butter);color:var(--plum)}
.horror{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:24px}
@media(max-width:860px){.horror{grid-template-columns:1fr}}
.horror blockquote{margin:0;padding:20px;border-radius:20px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);font:400 19px/1.3 var(--f-head);display:flex;flex-direction:column;gap:10px}
.horror cite{font:700 13px var(--f-body);font-style:normal;color:var(--soft)}
.addons-row{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.addons-row b{font:700 15px var(--f-body);margin-right:4px}
.addons-row span{padding:8px 12px;border-radius:999px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);font-size:14px}
.addons-row span em{font-style:normal;font-weight:700}
.hdr-nav a[aria-current]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}

/* v13.1: kontakt mejl + WhatsApp, primer popravki, manje praznog prostora */
.cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.btn--wa{background:transparent;color:var(--paper);box-shadow:inset 0 0 0 1.5px rgba(245,240,230,.55)}
.btn--wa:hover{background:rgba(245,240,230,.1)}
.btn--wa::before{content:"";width:10px;height:10px;border-radius:50%;background:#4FCB6B;flex:none}
:not(.on-dark)>.cta-row .btn--wa{color:var(--plum);box-shadow:inset 0 0 0 1.5px var(--plum)}
.on-dark .cta-row .btn--wa{color:var(--paper);box-shadow:inset 0 0 0 1.5px rgba(245,240,230,.55)}
.cta-note a{color:inherit;text-underline-offset:3px}
.addons-note{flex-basis:100%;font-style:normal;font-size:14px;color:var(--ink-2,inherit);opacity:.8}
.fixdemo{margin:0;background:var(--paper);color:var(--plum);border-radius:22px;padding:clamp(16px,2vw,22px);display:flex;flex-direction:column;gap:14px;box-shadow:0 30px 60px -30px rgba(0,0,0,.5);transform:rotate(1deg)}
.fixdemo-h{font:700 15px/1.3 var(--f-body)}
.fixdemo-img{position:relative;border-radius:12px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(53,30,40,.15)}
.fixdemo-img img{display:block;width:100%;height:auto}
.pin{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;background:var(--butter);color:var(--plum);font:800 15px/30px var(--f-head);text-align:center;box-shadow:0 0 0 3px var(--plum),0 6px 14px rgba(0,0,0,.3)}
.fixdemo-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:15px;line-height:1.4}
.fixdemo-list li{display:flex;gap:10px;align-items:flex-start}
.fixdemo-list b{flex:none;width:24px;height:24px;border-radius:50%;background:var(--butter);color:var(--plum);font:800 13px/24px var(--f-head);text-align:center;box-shadow:0 0 0 2px var(--plum)}
.direct{margin-top:22px;font-size:16px;color:#E7DDD0}
.direct a{color:var(--paper);text-underline-offset:4px}
/* sat je pun dok se ne pokrene animacija */
.watch .prog{stroke-dashoffset:var(--off,0)}
/* pocetna: manje praznog prostora */
#dokazi.sec--tight{padding-block:clamp(32px,4vw,56px) 0}
#o-nama.sec{padding-block:clamp(48px,6vw,88px)}
/* telefon: dugme u zaglavlju ostaje, kompaktno */
@media(max-width:560px){.hdr .btn{display:inline-flex;min-height:40px;padding:8px 14px;font-size:14px}.hdr .btn .arr{display:none}.hdr-nav{display:none}}
[data-tdoc] .watch .prog{stroke-dashoffset:var(--off,1)}
#pocetak{padding-bottom:clamp(24px,3vw,40px)!important}
#izbor.sec{padding-bottom:clamp(40px,5vw,64px)}
.sec--plum+.foot .wrap,main:has(>section.sec--plum:last-child)+.foot .wrap{padding-top:clamp(24px,3vw,40px)}

/* v15 · označen tekst na žutim površinama ostaje čitljiv */
.offer ::selection,.offer::selection,.pill--butter::selection,.btn--butter::selection,.btn--butter ::selection,.seal-core ::selection,.price-row ::selection,.choose .c-sys ::selection,.choose .c-sys::selection,.fact--hi ::selection,.form-ok::selection,.why-pin::selection,.mk::selection{background:var(--plum);color:var(--paper)}
.on-dark ::selection,.sec--plum ::selection,.why-pop::selection{background:var(--butter);color:var(--plum)}

/* v15 · tačke "zašto ovako" */
.shot{position:relative}
.shot>img{display:block;width:100%;height:auto}
.why{position:absolute;z-index:4;width:0;height:0}
.why-pin{all:unset;box-sizing:border-box;position:absolute;left:-13px;top:-13px;width:26px;height:26px;border-radius:50%;background:var(--butter);color:var(--plum);font:800 13px/26px var(--f-head);text-align:center;cursor:pointer;box-shadow:0 0 0 2px var(--plum),0 6px 14px -4px rgba(53,30,40,.6);transition:transform 200ms ease}
.why-pin::after{content:"";position:absolute;inset:-6px;border-radius:50%;box-shadow:0 0 0 2px var(--butter);opacity:0;animation:whyPulse 2.4s ease-out infinite}
.why-pin:hover,.why-pin[aria-expanded=true]{transform:scale(1.15)}
.why-pin[aria-expanded=true]{background:var(--plum);color:var(--butter);box-shadow:0 0 0 2px var(--butter)}
.why-pin[aria-expanded=true]::after{animation:none}
.why-pin:focus-visible{outline:3px solid var(--plum);outline-offset:3px}
@keyframes whyPulse{0%{transform:scale(.8);opacity:.9}70%,100%{transform:scale(1.5);opacity:0}}
.why-pop{position:absolute;left:-18px;top:22px;width:min(250px,60vw);padding:12px 14px;border-radius:12px;background:var(--plum);color:var(--paper);font:500 14px/1.45 var(--f-body);box-shadow:0 14px 30px -10px rgba(0,0,0,.5);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity 200ms ease,transform 200ms ease,visibility 0s 200ms;pointer-events:none}
.why--l .why-pop{left:auto;right:-18px}
.why--u .why-pop{top:auto;bottom:22px}
.why.open .why-pop{opacity:1;visibility:visible;transform:none;transition:opacity 200ms ease,transform 200ms ease}
.why.open{z-index:6}
.why-hint{font-size:15px;opacity:.8;display:flex;gap:10px;align-items:center}
.why-hint::before{content:"1";flex:0 0 22px;height:22px;border-radius:50%;background:var(--butter);box-shadow:0 0 0 1.5px var(--plum);font:800 11px/22px var(--f-head);text-align:center}
.live-link{align-self:flex-start;font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:var(--butter)}
.live-link:hover{text-decoration-color:currentColor}
@media (prefers-reduced-motion:reduce){.why-pin::after{animation:none}}

/* v15 · telefon se lista tek na klik */
.tap-scroll{all:unset;position:absolute;z-index:3;left:50%;bottom:12%;transform:translateX(-50%);display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:999px;background:var(--plum);color:var(--paper);font:700 12px/1 var(--f-body);cursor:pointer;white-space:nowrap;box-shadow:0 6px 14px -6px rgba(0,0,0,.6);transition:opacity 300ms ease}
.tap-scroll::before{content:"";width:0;height:0;border-left:7px solid var(--butter);border-top:4.5px solid transparent;border-bottom:4.5px solid transparent}
.tap-scroll:focus-visible{outline:3px solid var(--butter);outline-offset:2px}
.screen.playing .tap-scroll,.screen.used .tap-scroll{opacity:0;pointer-events:none}

/* v15 · autoškola pre/posle */
.pp{display:inline-flex;align-self:flex-start;padding:4px;border-radius:999px;box-shadow:inset 0 0 0 1.5px var(--plum);gap:4px}
.pp button{all:unset;cursor:pointer;min-height:40px;padding:0 20px;border-radius:999px;font:700 16px/40px var(--f-body)}
.pp button[aria-pressed=true]{background:var(--plum);color:var(--paper)}
.pp button:focus-visible{outline:2px solid var(--plum);outline-offset:3px}
.screen.fit>img.pp-old{position:absolute;inset:0;opacity:0;transition:opacity 350ms ease}
.screen.show-pre>img.pp-old{opacity:1}
.screen.show-pre .why{display:none}
.pp-tag{position:absolute;top:12px;left:12px;z-index:3;padding:6px 12px;border-radius:999px;background:rgba(53,30,40,.85);color:var(--paper);font:700 13px var(--f-body);opacity:0;transition:opacity 300ms ease;pointer-events:none}
.screen.show-pre .pp-tag{opacity:1}
@media (max-width:700px){
  .why-pop,.why--l .why-pop,.why--u .why-pop{position:fixed;left:16px;right:16px;top:auto;bottom:16px;width:auto;padding:16px 18px;font-size:15px;transform:translateY(12px)}
  .why.open .why-pop{transform:none}
}

/* v16 · dokazi u prozoru */
.proofstrip{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.pcard--open{font:inherit;color:inherit;text-align:left;border:0;width:100%;cursor:pointer;transition:transform 200ms ease,box-shadow 200ms ease}
.pcard--open:hover{transform:translateY(-3px);box-shadow:0 14px 30px -18px rgba(53,30,40,.6)}
.pcard--open:focus-visible{outline:3px solid var(--plum);outline-offset:3px}
.pmore{font-style:normal;font-weight:700;font-size:15px;margin-top:6px;text-decoration:underline;text-decoration-color:var(--butter);text-decoration-thickness:2px;text-underline-offset:4px}
.pdlg{width:min(980px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:28px;background:var(--paper);color:var(--plum);box-shadow:0 40px 90px -30px rgba(0,0,0,.6)}
.pdlg::backdrop{background:rgba(53,30,40,.6);backdrop-filter:blur(3px)}
.pdlg-in{position:relative;display:flex;flex-direction:column;gap:22px;padding:clamp(22px,4vw,48px)}
.pdlg-x{all:unset;position:sticky;top:0;align-self:flex-end;margin-bottom:-56px;z-index:2;width:44px;height:44px;border-radius:50%;background:var(--plum);color:var(--paper);font:400 26px/44px var(--f-body);text-align:center;cursor:pointer}
.pdlg-x:focus-visible{outline:3px solid var(--butter);outline-offset:2px}
.pdlg .h2{font-size:clamp(30px,4.4vw,52px);padding-right:52px}
.pdlg .h4{font:800 19px/1.25 var(--f-head);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.pdlg .h4 small{font:500 13px var(--f-body);opacity:.7}
.dks{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}
.dk{display:flex;flex-direction:column;gap:4px;padding:16px 18px;border-radius:18px;background:var(--card);box-shadow:inset 0 0 0 1.5px #E3D9C8}
.dk:first-child{background:var(--butter);box-shadow:none}
.dk b{font:800 clamp(30px,4vw,44px)/1 var(--f-head);letter-spacing:-.03em}
.dk span{font-size:14px;line-height:1.35}
.dks--s .dk{padding:12px 14px}.dks--s .dk b{font-size:28px}
.pdlg-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
.pdlg-grid>div{display:flex;flex-direction:column;gap:12px}
@media(max-width:720px){.pdlg-grid{grid-template-columns:1fr}}
.dbars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.dbars li{display:grid;grid-template-columns:130px 1fr 34px;gap:10px;align-items:center;font-size:14px}
.dbars i{height:12px;border-radius:999px;background:linear-gradient(90deg,var(--plum) var(--w),#E6DCCB var(--w))}
.dbars b{text-align:right}
.dgot{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;font-size:15px}
.dgot li{display:flex;gap:10px}
.dgot li::before{content:"✓";flex:0 0 22px;height:22px;border-radius:50%;background:var(--butter);font:800 12px/22px var(--f-body);text-align:center}
.dtable{overflow-x:auto;border-radius:16px;box-shadow:inset 0 0 0 1.5px #E3D9C8;background:var(--card)}
.dtable table{width:100%;border-collapse:collapse;font-size:14px;min-width:620px}
.dtable th,.dtable td{padding:11px 14px;text-align:left;border-bottom:1px solid #EDE5D7;white-space:nowrap}
.dtable th{font-weight:700;background:#F2EBDD}
.dtable tr:last-child td{border-bottom:0}
.dtable em{font-style:normal;font-weight:700;background:var(--butter);padding:2px 8px;border-radius:999px}
.dlog{min-width:0!important}
.dlog .ok{color:#3E7A50;font-weight:700}
.mask{display:inline-block;vertical-align:middle;width:110px;height:12px;border-radius:999px;background:repeating-linear-gradient(90deg,#CFC3B1 0 9px,#DED3C2 9px 15px);filter:blur(1.2px)}
.mask--s{width:54px}.mask--xs{width:36px}
.dangle{margin:0;padding:18px 20px;border-radius:18px;background:var(--plum);color:var(--paper);display:flex;flex-direction:column;gap:8px}
.dangle figcaption{font:700 13px var(--f-body);color:var(--butter)}
.dangle blockquote{margin:0;font-size:16px;line-height:1.5}
.dcal{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
@media(max-width:820px){.dcal{grid-template-columns:1fr}}
.dcal li{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:16px;background:var(--card);box-shadow:inset 0 0 0 1.5px #E3D9C8;font-size:14px}
.dcal li.done{background:#EAF3EC;box-shadow:inset 0 0 0 1.5px #B9D6C0}
.dcal .dd{font:800 22px var(--f-head)}
.dcal .dst{align-self:flex-start;font:700 12px var(--f-body);padding:3px 9px;border-radius:999px;background:#E6DCCB}
.dcal li.done .dst{background:#3E7A50;color:#fff}
.dcal em{font-style:normal;opacity:.8;line-height:1.4}
.dnote{font-size:14px;opacity:.8}
.pdlg-end{font:700 18px/1.45 var(--f-body);padding-top:6px;border-top:1.5px solid #E3D9C8}
.pdlg ::selection{background:var(--plum);color:var(--paper)}
.pdlg .dangle ::selection,.pdlg .dk:first-child ::selection{background:var(--plum);color:var(--paper)}

/* v17 · pravi sajt u ekranu */
.screen-wrap.is-live .scroller,.screen-wrap.is-live .scroll-hint{visibility:hidden}
.live-frame{position:absolute;inset:0;overflow:hidden;opacity:0;transition:opacity 400ms ease;background:var(--card)}
.live-frame.ready{opacity:1}
.live-frame iframe{display:block;border:0;transform-origin:0 0}
.live-tag{position:absolute;left:10px;bottom:10px;z-index:3;display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:var(--plum);color:var(--paper);font:700 12px/1.3 var(--f-body);pointer-events:none;transition:opacity 400ms ease}
.live-tag::before{content:"";width:8px;height:8px;border-radius:50%;background:#4FA36B;box-shadow:0 0 0 3px rgba(79,163,107,.3)}
.screen-wrap.touched .live-tag{opacity:0}

/* v17 · poruka odmah u pozivu na akciju */
.msgbox{display:flex;flex-direction:column;gap:12px;width:min(560px,100%)}
.msgbox .field label{color:var(--paper)}
.msgbox .field label small{color:var(--paper)}
.msgbox textarea{min-height:110px}
.msgbox-send{display:flex;flex-wrap:wrap;gap:10px}
.msgbox .btn{cursor:pointer;border:0;font:inherit;font-weight:700}
.msgbox .btn:active{transform:scale(.97)}
.btn--ghost{background:transparent;color:var(--paper);box-shadow:inset 0 0 0 1.5px rgba(245,240,230,.55)}
.btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--paper)}
.wa-ic{width:18px;height:18px;border-radius:50%;background:#4FA36B;flex:0 0 18px;box-shadow:inset 0 0 0 4px var(--butter)}
.msgbox-err{color:var(--butter);font-weight:700;font-size:15px}
.msgbox-ok{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:14px;background:rgba(245,222,122,.14);color:var(--paper);font-size:15px}
.msgbox-ok::before{content:"✓";flex:0 0 24px;height:24px;border-radius:50%;background:var(--butter);color:var(--plum);font:800 13px/24px var(--f-body);text-align:center}
.msgbox-ok[hidden],.msgbox-err[hidden]{display:none}

/* v17 · ikonice na karticama i znakovi u tabelama */
.get{position:relative}
.gi{display:block;width:30px;height:30px;margin-bottom:10px;background:var(--plum);-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.get b{display:block}
.get span{opacity:.75}
.cmp td.c-y,.cmp td.c-n,.cmp td.c-m,.cmp td.us{position:relative;padding-left:40px}
.cmp td.c-y::before,.cmp td.c-n::before,.cmp td.c-m::before,.cmp td.us::before{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:20px;height:20px;border-radius:50%;font:800 12px/20px var(--f-body);text-align:center}
.cmp td.c-y::before{content:"✓";background:#DCEBDF;color:#2F6B40}
.cmp td.c-n::before{content:"✕";background:#F3DCD6;color:#9A3B2A}
.cmp td.c-m::before{content:"~";background:#E9E2D5;color:#6B5B62}
.cmp td.us::before{content:"✓";background:var(--plum);color:var(--butter)}
.cmp td.c-n,.cmp td.c-m{color:#6B5B62}

/* v18 · hero: ceo sajt agencije za negu */
.hero-live .work-stage{padding:0 14% 22px 0}
.hero-live .browser .screen{aspect-ratio:16/11}
/* v18 · vrata na početnoj su klikabilna cela */
.door[data-href]{cursor:pointer;transition:transform 260ms cubic-bezier(.2,.9,.3,1),box-shadow 260ms ease}
.door[data-href]:hover{transform:translateY(-4px);box-shadow:0 26px 50px -30px rgba(53,30,40,.55)}
.door--web[data-href]:hover{box-shadow:inset 0 0 0 2px var(--plum),0 26px 50px -30px rgba(53,30,40,.55)}
.door[data-href]:active{transform:translateY(-1px) scale(.995)}
.door-meta .btn{min-height:52px;padding-inline:26px;font-size:17px}
.door[data-href]:hover .door-meta .arr{transform:translateX(4px)}
.door-meta .arr{display:inline-block;transition:transform 260ms cubic-bezier(.2,.9,.3,1)}
@media (prefers-reduced-motion:reduce){.door[data-href],.door-meta .arr{transition:none}.door[data-href]:hover{transform:none}}

/* v19 · snimak u ekranu */
.play-demo{all:unset;position:absolute;right:10px;bottom:10px;z-index:5;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:var(--butter);color:var(--plum);font:700 13px/1.2 var(--f-body);cursor:pointer;box-shadow:0 8px 18px -8px rgba(53,30,40,.6);transition:transform 120ms ease-out}
.play-demo::before{content:"";width:0;height:0;border-left:8px solid var(--plum);border-top:5px solid transparent;border-bottom:5px solid transparent}
.playing-demo .play-demo::before{width:9px;height:9px;border:0;background:var(--plum);border-radius:2px}
.play-demo:active{transform:scale(.96)}
.play-demo:focus-visible{outline:3px solid var(--plum);outline-offset:2px}
.demo-video{position:absolute;inset:0;z-index:4;width:100%;height:100%;object-fit:cover;object-position:top;background:var(--card)}
.screen-wrap.is-live .play-demo{display:none}
.live-frame{pointer-events:none}.live-frame.ready{pointer-events:auto}
.screen-wrap{isolation:isolate}

/* v20 · veće mete za prst kod mejla i telefona */
.foot-bot nav a{display:inline-flex;align-items:center;min-height:44px}
.cta-note a,.direct a{display:inline-block;padding-block:10px}
@media (max-width:560px){.lp-hdr .hdr-right .btn{font-size:13px;line-height:1.2;padding:8px 14px;max-width:46vw;text-align:center}}

/* v21 · knjiga koja se lista na slici */
.book-flip{all:unset;position:absolute;z-index:3;cursor:pointer;display:block}
.book-flip video{display:block;width:100%;height:100%;object-fit:fill;background:transparent;pointer-events:none}
.book-flip:focus-visible{outline:3px solid var(--plum);outline-offset:4px;border-radius:6px}
.book-cue{position:absolute;right:2%;bottom:-6%;padding:6px 12px;border-radius:999px;background:var(--plum);color:var(--paper);font:700 12px/1.2 var(--f-body);white-space:nowrap;box-shadow:0 8px 18px -8px rgba(53,30,40,.6);transition:opacity 300ms ease;pointer-events:none}
.book-flip.used .book-cue{opacity:0}
/* v21 · šta kažu ljudi */
.voices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media(max-width:900px){.voices{grid-template-columns:1fr}}
.voice{display:flex;flex-direction:column;gap:12px;padding:24px;border-radius:22px;background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.voice h3{font:800 19px/1.25 var(--f-head)}
.voice p{display:flex;flex-direction:column;gap:4px;font-size:16px;line-height:1.5}
.voice p b{font:700 13px var(--f-body);opacity:.65}
.voice .v-pre{color:#6B5B62}
.voice .v-now{padding:12px 14px;border-radius:14px;background:var(--butter);color:var(--plum)}
.voice .v-now b{opacity:.8}
.voices-note{margin-top:12px;font-size:14px;opacity:.7}

/* ===================== v22 · vizuelni pregled (samo izgled, tekst i ponašanje isti) ===================== */
:root{
  --sky-tint:#E1EAF3;
  --r-lg:28px;--r-md:18px;
  --ico-arr:url(../icons-marlek/strelica-desno.svg);
  --ico-chk:url(../icons-marlek/kvacica.svg);
  --ico-x:url(../icons-marlek/x.svg);
  --ico-crta:url(../icons-marlek/crta.svg);
  --ico-plus:url(../icons-marlek/plus.svg);
  --ico-listaj:url(../icons-marlek/listaj.svg);
  --chk-paper:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F5F0E6' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  --chk-plum:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23351E28' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");
  --x-soft:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B5B62' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M7 7l10 10M17 7L7 17'/%3E%3C/svg%3E");
  --crta-soft:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B5B62' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 12h12'/%3E%3C/svg%3E");
}

/* 1 · ritam pozadina: papir je osnova, nebo za 2-3 sekcije, bez bež pozadine */
.sec--sky{background:var(--sky);--soft:#4A2B39}
.sec{position:relative}
.sec:not(.sec--sky):not(.sec--plum)+.sec:not(.sec--sky):not(.sec--plum)::before,
.lp-hero+.sec:not(.sec--sky):not(.sec--plum)::before{content:"";position:absolute;top:0;left:max(var(--gut),calc((100% - 1240px)/2 + var(--gut)));right:max(var(--gut),calc((100% - 1240px)/2 + var(--gut)));border-top:1.5px dashed var(--line-2)}
.sec--sky .st3:nth-child(2){background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.sec--sky .duo-photo::before{background:var(--paper)}
.sec--sky .vdev{background:var(--paper)}
.sec--sky .cmp-wrap,.sec--sky .calc{box-shadow:none}

/* 2 · puter samo kao akcenat */
.voice .v-now{background:var(--sky-tint)}
.voice .v-now b{display:flex;align-items:center;gap:7px;opacity:1}
.voice .v-now b::before{content:"";flex:0 0 7px;height:7px;border-radius:50%;background:var(--butter);box-shadow:0 0 0 1.5px var(--plum)}
.cmp td.us{background:var(--sky-tint)}
.choose .c-sys{background:var(--sky)}
.offer::after{display:none}
.offer-list li{background:var(--paper)}
.offer-list li::before,.promise li::before{background-image:var(--chk-paper);background-size:16px}
.on-dark .eyebrow,.sec--plum .eyebrow{color:var(--paper);display:inline-flex;align-items:center;gap:8px}
.on-dark .eyebrow::before,.sec--plum .eyebrow::before{content:"";flex:0 0 7px;height:7px;border-radius:50%;background:var(--butter)}
.ps b{color:var(--paper)}
.calc-out small{color:var(--paper);display:inline-flex;align-items:center;gap:8px}
.calc-out small::before{content:"";flex:0 0 7px;height:7px;border-radius:50%;background:var(--butter)}
.dangle figcaption{color:var(--paper)}

/* 3 · stavke ponude u jednoj kartici, odvojene isprekidanom linijom */
.getgrid{gap:0;border-radius:var(--r-lg);background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2);overflow:hidden}
.get{border-radius:0;background:none;box-shadow:none;padding:20px 20px 22px;border-right:1.5px dashed var(--line-2);border-bottom:1.5px dashed var(--line-2);margin:0 -1.5px -1.5px 0}
.get .gi{width:24px;height:24px;margin-bottom:8px}
@media(max-width:520px){
  .getgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .get{padding:14px 12px 16px;gap:4px}
  .get b{font-size:16px}
  .get span{font-size:14px;line-height:1.4}
  .get .gi{width:22px;height:22px;margin-bottom:4px}
}

/* 4 · naše ikonice umesto znakova */
.arr,.choose span i{display:inline-block;width:18px;height:18px;flex:0 0 18px;font-size:0;line-height:0;background:currentColor;-webkit-mask:var(--ico-arr) center/contain no-repeat;mask:var(--ico-arr) center/contain no-repeat}
.proof .arr{width:24px;height:24px;font-size:0}
.choose span i{width:22px;height:22px}
.qa summary::after{content:"";justify-self:center;width:22px;height:22px;background:currentColor;-webkit-mask:var(--ico-plus) center/contain no-repeat;mask:var(--ico-plus) center/contain no-repeat}
.ba-before li::before,.ba-after li::before{content:"";width:18px;height:18px;margin-top:3px;background:currentColor;-webkit-mask:var(--ico-x) center/contain no-repeat;mask:var(--ico-x) center/contain no-repeat}
.ba-before li::before{background:var(--soft)}
.ba-after li::before{-webkit-mask-image:var(--ico-chk);mask-image:var(--ico-chk)}
.dgot li::before,.msgbox-ok::before{content:"";background:var(--butter) var(--chk-plum) center/13px no-repeat}
.tap-scroll::before{width:14px;height:14px;border:0;background:var(--butter);-webkit-mask:var(--ico-listaj) center/contain no-repeat;mask:var(--ico-listaj) center/contain no-repeat}

/* 5 · samo boje iz palete */
.cmp thead th{background:var(--paper)}
.ba-before{background:var(--card);box-shadow:inset 0 0 0 1.5px var(--line-2)}
.cmp td.c-y::before,.cmp td.c-n::before,.cmp td.c-m::before,.cmp td.us::before{content:"";background-position:center;background-repeat:no-repeat;background-size:13px}
.cmp td.c-y::before,.cmp td.us::before{background-color:var(--plum);background-image:var(--chk-paper)}
.cmp td.c-n::before{background-color:transparent;background-image:var(--x-soft);box-shadow:inset 0 0 0 1.5px var(--soft)}
.cmp td.c-m::before{background-color:transparent;background-image:var(--crta-soft)}
.ic{color:var(--plum)}
.ic.ig{background:var(--butter)}
.ic.wa{background:var(--sky)}
.ic.ml{background:var(--plum);color:var(--paper)}
.ic.tb{background:var(--card);box-shadow:inset 0 0 0 1.5px var(--plum)}
.wa-ic{width:10px;height:10px;flex:0 0 10px;background:var(--plum);box-shadow:none}
.btn--wa::before{background:var(--butter)}
.live-tag::before{background:var(--butter);box-shadow:none}
@keyframes press{0%,60%,100%{transform:scale(1);background:var(--plum)}66%{transform:scale(.93)}72%,92%{background:var(--plum-3)}}
.dlog .ok{color:var(--plum)}
.dcal li.done{background:var(--sky-tint);box-shadow:inset 0 0 0 1.5px var(--sky)}
.dcal li.done .dst{background:var(--plum);color:var(--paper)}

/* 6 · IBM Plex Mono za kratke oznake, statuse i trajanja (bez velikih slova) */
.eyebrow,.pill,.fi-row .stt,.fi-raw .src,.flow-board .fb-h,.scroll-hint,.voice p b,.doc-ok,.rt .st,.dcal .dst,.poster .play,.lang{font-family:'IBM Plex Mono',ui-monospace,monospace!important;font-weight:500!important;letter-spacing:.01em!important}
.eyebrow{font-size:14px}
.pill{font-size:13px}
.voice p b{font-size:12px}

/* 7 · tri zaobljenja: 28 blok, 18 kartica, pilula */
.door,.offer,.calc,.vdev,.pdlg,.getgrid{border-radius:var(--r-lg)}
.fact,.leak-card,.report,.simc,.preview,.fixdemo,.st3,.mstep,.link-card,.calc-out,.cmp-wrap,.ba-col,.resist,.pcard,.horror blockquote,.voice,.dk,.dcal li,.dtable,.dangle,.tile,.price-row,.addon-note,.msgbox-ok,.form-ok,.choose a,.duo-photo img,.duo-photo::before,.vtab,.tbl,.field input,.field textarea,.flow-stage,.before{border-radius:var(--r-md)}
.door .flow-stage{border-radius:var(--r-md)}
.voice .v-now,.mstep .mini,.fi-in{border-radius:12px}
.report,.duo-photo img{box-shadow:none}
.report{border-width:1.5px}

/* 8 · znak „rl“ kao tihi potpis u završnom pozivu */
.sec--plum{overflow:hidden}
.sec--plum::after{content:"";position:absolute;right:clamp(8px,4vw,64px);bottom:-18px;height:clamp(150px,62%,340px);aspect-ratio:72/100;background:url(../znak/znak-rl-papir.svg) center/contain no-repeat;opacity:.08;pointer-events:none}
.sec--plum>.wrap{position:relative;z-index:1}

/* 9 · sitnice u rasporedu */
.split-head{flex-direction:column;align-items:flex-start;justify-content:flex-start}
.split-head p{max-width:none}
.choose{max-width:none}
.wrap:has(>.leak-card){display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,4vw,64px);align-items:center}
.wrap:has(>.leak-card) .lp-sec-head{margin-bottom:0}
.wrap:has(>.leak-card) .leak-card{max-width:none!important}
@media(max-width:900px){.wrap:has(>.leak-card){grid-template-columns:1fr}}

/* v22.1 · puter marker pokriva donju polovinu reči, ne samo tanku traku */
.mk::after{height:.52em;bottom:.02em;border-radius:4px}

/* SEO/pristupačnost: bez JavaScripta sadržaj ostaje vidljiv (animacija pojavljivanja radi samo uz JS) */
@media (scripting:none){[data-reveal],.slogan span{opacity:1;transform:none}}

/* ===== v23 predlog (10.10.2026) ===== */
/* 1+7: marker svuda isti, prelazi celu donju polovinu reči (i u tamnim sekcijama, umesto tanke crte) */
.mk::after{height:.56em;bottom:-.02em}
.on-dark .mk{color:var(--plum);padding:0 .06em}
.on-dark .mk::after{opacity:1;height:1em;bottom:-.08em;left:-.04em;right:-.04em;border-radius:4px}
/* 4: hero se smanjuje na nižim ekranima (laptop) da se kartice vide odmah */
.split .h1{font-size:clamp(40px,min(6.2vw,10.5vh),88px)}
.split-head .hero-offer{max-width:none;flex-basis:100%;font:400 clamp(18px,1.5vw,21px)/1.45 var(--f-body);color:var(--plum)}
.split-head .hero-offer b{font-weight:700}
/* 8: CTA u zaglavlju dobija puter strelicu da se izdvoji od ostalih dugmadi */
.hdr .btn .arr{color:var(--butter)}
/* 3a: radovi odmah na početnoj */
.works-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,18px)}
.works-strip a{display:flex;flex-direction:column;gap:10px;text-decoration:none;color:inherit}
.works-strip .ws-img{aspect-ratio:16/10;border-radius:12px;overflow:hidden;border:1.5px solid var(--line-2);background:var(--card)}
.works-strip img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform 500ms var(--spring)}
.works-strip a:hover img{transform:scale(1.04)}
.works-strip b{font:800 19px/1.2 var(--f-head)}
.works-strip small{font:500 14px/1.3 var(--f-body);color:var(--soft)}
.works-head{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.works-head a{font-weight:700}
@media(max-width:860px){.works-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 2: hamburger meni ispod 820px */
.burger{display:none;width:44px;height:44px;border:0;border-radius:999px;background:transparent;color:var(--plum);cursor:pointer;align-items:center;justify-content:center}
.burger span,.burger span::before,.burger span::after{display:block;width:22px;height:2.5px;border-radius:2px;background:currentColor;position:relative;transition:transform 250ms var(--spring),background 150ms}
.burger span::before,.burger span::after{content:"";position:absolute;left:0}
.burger span::before{top:-7px}.burger span::after{top:7px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span::after{transform:translateY(-7px) rotate(-45deg)}
.mnav{position:fixed;inset:var(--hdr) 0 auto;z-index:49;background:var(--paper);border-bottom:1.5px solid var(--line);padding:12px var(--gut) 24px;display:flex;flex-direction:column;gap:4px}
.mnav[hidden]{display:none}
.mnav a:not(.btn){min-height:52px;display:flex;align-items:center;font:800 24px/1 var(--f-head);text-decoration:none;border-bottom:1.5px solid var(--line)}
.mnav .btn{margin-top:14px}
@media(max-width:820px){.burger{display:inline-flex}}
@media(min-width:821px){.mnav{display:none!important}}
@media(max-width:820px){.hdr-right>.btn{display:none!important}}