.films-lead{max-width:720px;margin:-18px 0 28px;color:var(--muted);font-size:18px;line-height:1.65}
.film-tabs{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:32px}
.film-tab{border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--navy);padding:11px 20px;font:inherit;font-weight:800;cursor:pointer;transition:background .18s,border-color .18s,color .18s,transform .18s}
.film-tab:hover{border-color:var(--cyan);transform:translateY(-1px)}
.film-tab.is-active{border-color:var(--navy);background:var(--navy);color:#fff}
.film-tab:focus-visible{outline:3px solid #8ce4ff;outline-offset:2px}
.film-panel{display:grid;grid-template-columns:minmax(260px,.78fr) minmax(0,1.22fr);gap:64px;align-items:center;padding:34px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(135deg,#fff,#f2fbfe);box-shadow:0 18px 55px rgba(6,43,92,.09)}
.film-panel[hidden]{display:none}
.film-copy h3{margin:0 0 10px;font-size:34px}
.film-for{margin:0 0 20px;color:#334e6b;font-size:17px;line-height:1.65}
.film-list{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:11px}
.film-list li{position:relative;padding-left:30px;color:#334e6b;line-height:1.5}
.film-list li::before{position:absolute;left:0;top:0;font-weight:900}
.film-list .yes::before{content:"✓";color:#168454}
.film-list .note::before{content:"i";width:18px;height:18px;border-radius:50%;background:#e9f7fc;color:#057ca3;text-align:center;font-size:12px;line-height:18px;top:2px}
.film-demo{text-align:center}
.film-phone{position:relative;isolation:isolate;overflow:hidden;width:200px;height:370px;margin:auto;border:8px solid #07182c;border-radius:30px;background:linear-gradient(145deg,#1a6b9d,#062b5c);box-shadow:0 22px 45px rgba(3,26,56,.22);display:flex;align-items:flex-end;justify-content:center}
.film-phone::before{content:"";position:absolute;z-index:-1;inset:0;background:radial-gradient(circle at 65% 25%,rgba(18,181,229,.9),transparent 30%),linear-gradient(145deg,#399ed0,#062b5c 70%)}
.phone-label{margin-bottom:16px;color:#fff;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 1px 8px #031a38}
.phone-glare{position:absolute;top:-20%;left:-42%;width:92%;height:150%;transform:rotate(18deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.62),transparent)}
.demo-matte::after{content:"";position:absolute;inset:0;background:rgba(235,249,253,.17);backdrop-filter:blur(2px)}
.demo-matte .phone-glare{filter:blur(22px);opacity:.2}
.demo-privacy::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,7,14,.95),rgba(2,7,14,.62) 28%,transparent 50%,rgba(2,7,14,.62) 72%,rgba(2,7,14,.95))}
.phone-side{position:absolute;z-index:2;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;color:#d8edf6;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.demo-self .phone-scratch{position:absolute;top:34%;left:18%;width:65%;height:2px;transform:rotate(-10deg);background:linear-gradient(90deg,rgba(255,255,255,.9),transparent);animation:scratch-fade 4.5s ease-in-out infinite}
@keyframes scratch-fade{0%,18%{opacity:.9}72%,100%{opacity:.08}}
@media(prefers-reduced-motion:reduce){.demo-self .phone-scratch{animation:none;opacity:.4}}
.demo-note{max-width:310px;margin:18px auto 0;color:var(--muted);font-size:14px;line-height:1.55}
.film-table-wrap{margin-top:38px;overflow-x:auto;border:1px solid var(--line);border-radius:16px}
.film-table{width:100%;min-width:730px;border-collapse:collapse;font-size:14px}
.film-table caption{text-align:left;padding:19px 20px;background:var(--navy);color:#fff;font-size:18px;font-weight:900}
.film-table th,.film-table td{padding:14px 16px;border-bottom:1px solid var(--line);text-align:left}
.film-table thead th{background:var(--ice);color:var(--navy)}
.film-table tbody th{color:var(--navy)}
.film-table tbody tr:last-child th,.film-table tbody tr:last-child td{border-bottom:0}
.promise{margin-top:38px;padding:34px;border-radius:22px;background:var(--deep);color:#fff;display:grid;grid-template-columns:.75fr 1.5fr;gap:20px 48px;align-items:start}
.promise h3{margin:10px 0 0;font-size:30px}
.promise-list{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.promise-list li{position:relative;padding-left:28px;color:#d3e5f2;line-height:1.55}
.promise-list li::before{content:"✓";position:absolute;left:0;color:#65ddff;font-weight:900}
.promise-list a{text-decoration:underline}
.promise>.btn{grid-column:2;justify-self:start}
@media(max-width:850px){.film-panel{grid-template-columns:1fr;gap:34px}.film-phone{width:165px;height:300px}.promise{grid-template-columns:1fr}.promise>.btn{grid-column:1}}
@media(max-width:560px){.films-lead{font-size:16px}.film-tabs{display:grid;grid-template-columns:1fr 1fr}.film-tab{padding:10px 8px}.film-panel{padding:24px 18px}.film-copy h3{font-size:29px}.film-table-wrap::after{content:"Pomaknite za celotno primerjavo →";display:block;padding:10px 14px;background:var(--ice);color:var(--muted);font-size:12px}.promise{padding:26px 20px}}