/* Web Encore · F content in the Bijela gradijent v2 style.
   Loads after wf.css: white page, grey stage panels, hairline borders, black pills, Geist type,
   gradient only on the lighter half of headlines. Animations: small, each uses ONE accent (one blue, --a1, the logo's). */

.wf{
  --surface:#ffffff;--sunken:#f3f3f4;--raised:#ffffff;--border:#e6e6e8;--border-strong:#cfcfd4;
  --ink:#0b0b0c;--muted:#5c5c63;--faint:#8a8a90;
  --accent:#0b0b0c;--accent-ink:#ffffff;--accent-soft:#f3f3f4;--hover:rgba(11,11,12,.05);--btn-hover:#2a2a2d;
  --success:#1f9d55;--success-soft:#e6f4ec;--warning:#c27a12;--warning-soft:#fbf1df;--danger:#c62f3a;--danger-soft:#fbe9ea;
  --a1:#008AFF;--a2:var(--a1);--a3:var(--a1);
  --blue:var(--a1);--cyan:var(--a1);--coral:var(--a3);--amber:var(--a1);--pink:var(--a3);--violet:var(--a2);--mint:var(--a1);
  --blue-t:var(--a1);--cyan-t:var(--a1);--coral-t:var(--a3);--amber-t:var(--a1);--pink-t:var(--a3);--violet-t:var(--a2);--mint-t:var(--a1);
  --g-brand:linear-gradient(100deg,#00B8F5 0%,#008AFF 100%);
  --g-bright:var(--ink);
  --elev:0 1px 2px rgba(0,0,0,.04),0 12px 32px -18px rgba(0,0,0,.16);
  --elev-lg:0 1px 2px rgba(0,0,0,.04),0 24px 48px -30px rgba(0,0,0,.22);
  --bm1:transparent;--bm2:transparent;
  font-family:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:16px;line-height:1.55;
}
.wf[data-theme="dark"],.wf .is-dark{
  --surface:#0b0b0d;--sunken:#151619;--raised:#101114;--border:#26272c;--border-strong:#3a3b42;
  --ink:#f4f4f5;--muted:#b3b5bb;--faint:#8d8f96;
  --accent:#f4f4f5;--accent-ink:#0b0b0d;--accent-soft:#151619;--hover:rgba(244,244,245,.07);--btn-hover:#d4d5d9;
  --success:#3ccf82;--success-soft:rgba(60,207,130,.14);--warning:#e3a53a;--warning-soft:rgba(227,165,58,.14);--danger:#ff6b74;--danger-soft:rgba(255,107,116,.14);
  --a1:#3D9EFF;--a2:var(--a1);--a3:var(--a1);
  --g-brand:linear-gradient(100deg,#00CCFF 0%,#3D9EFF 100%);
  --elev:0 0 0 1px rgba(255,255,255,.03),0 18px 40px -22px rgba(0,0,0,.8);
  --elev-lg:0 0 0 1px rgba(255,255,255,.04),0 30px 70px -34px rgba(0,0,0,.9);
}
/* no tinted hero zone: header and hero sit on the page colour */
.wf .zh,.wf[data-theme="dark"] .zh,.wf .is-dark.zh{--surface:inherit;background:transparent}
.wf{background:var(--surface);color:var(--ink)}
.wf .zh{--sunken:var(--sunken)}
/* one accent per service (illustration + number + links) */
.wf .h-web{--c:var(--a1);--ct:var(--a1);--c2:color-mix(in srgb,var(--a1) 38%,var(--sunken))}
.wf .h-shop{--c:var(--a3);--ct:var(--a3);--c2:color-mix(in srgb,var(--a3) 38%,var(--sunken))}
.wf .h-gfx{--c:var(--a2);--ct:var(--a2);--c2:color-mix(in srgb,var(--a2) 38%,var(--sunken))}
.wf .h-host{--c:var(--a1);--ct:var(--a1);--c2:color-mix(in srgb,var(--a1) 38%,var(--sunken))}
.wf .h-mail{--c:var(--a2);--ct:var(--a2);--c2:color-mix(in srgb,var(--a2) 38%,var(--sunken))}
.wf .h-care{--c:var(--a3);--ct:var(--a3);--c2:color-mix(in srgb,var(--a3) 38%,var(--sunken))}
.wf .h-cyan{--c:var(--a1);--ct:var(--a1);--c2:color-mix(in srgb,var(--a1) 38%,var(--sunken))}

/* type */
.wf .mono{font-family:"Geist Mono",ui-monospace,Menlo,Consolas,monospace}
.wf .h1{font-size:clamp(40px,5.2vw,72px);line-height:1.02;font-weight:700;letter-spacing:-.045em}
.wf .h1-sm{font-size:clamp(38px,4.4vw,60px)}
.wf .h2{font-size:clamp(32px,4vw,52px);line-height:1.06;font-weight:700;letter-spacing:-.04em}
.wf .h3{font-weight:600;letter-spacing:-.02em}
.wf .lead{font-size:clamp(17px,1.5vw,19px);line-height:1.55;color:var(--muted)}
.wf .subheading{font-size:17px;line-height:1.55;color:var(--muted)}
.wf .grad-text{background:var(--g-brand);background-size:100% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;animation:none}
.wf .eyebrow{font:500 12px/1 "Geist Mono",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}
.wf .eyebrow::before{display:none}
.wf .sec{padding:120px 0}
.wf .sec.alt{background:transparent}
.wf .sec.wash::before{display:none}
.wf .sec-head{align-items:flex-start;text-align:left;margin-inline:0;max-width:720px;gap:16px}
.wf .sec-head .subheading{max-width:560px}
.wf .sec-head[style]{align-items:flex-start !important;text-align:left !important}
.wf .sec-head .h2{font-weight:600;letter-spacing:-.045em;line-height:1.05}
.wf :where(a:not(.btn)){color:var(--ink);text-decoration-color:var(--border-strong)}
.wf :where(a:not(.btn)):hover{color:var(--ink);text-decoration-color:var(--ink)}
.wf :focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:6px}

/* buttons: black pills */
.wf .btn{height:44px;padding:0 20px;border-radius:999px;font:600 15px/1 "Geist",sans-serif;box-shadow:none}
.wf .btn:hover{transform:none}
.wf .btn-primary,.wf[data-theme="dark"] .btn-primary,.wf .is-dark .btn-primary{background:var(--ink);color:var(--surface);box-shadow:none;border-color:transparent}
.wf .btn-primary:hover,.wf[data-theme="dark"] .btn-primary:hover{background:var(--btn-hover);color:var(--surface)}
.wf .btn-primary::after{display:none}
.wf .btn-outline{background:var(--sunken);color:var(--ink);border-color:transparent;box-shadow:none}
.wf .btn-outline:hover{background:var(--border);border-color:transparent;color:var(--ink)}
.wf .btn:disabled{opacity:.4}

/* badges and chips: quiet mono pills */
.wf .badge,.wf .badge-c,.wf .badge-accent,.wf .pill-ag,.wf .pill-we{background:var(--sunken);color:var(--muted);font:500 11.5px/20px "Geist Mono",monospace;padding:2px 10px}
.wf .badge-ok{background:var(--success-soft);color:var(--success)}.wf .badge-warn{background:var(--warning-soft);color:var(--warning)}.wf .badge-no{background:var(--danger-soft);color:var(--danger)}
.wf .badge-ph{font-family:"Geist Mono",monospace}
.wf .chip{background:var(--surface);border:1px solid var(--border);color:var(--ink);font-weight:500}
.wf .chip svg{color:var(--faint)}
.wf .chip:hover{transform:none;border-color:var(--ink);background:var(--surface)}

/* cards, wells, tiles */
.wf .card{background:var(--raised);border:1px solid var(--border);border-radius:20px;box-shadow:none}
.wf .card-elev,.wf .gb{box-shadow:var(--elev)}
.wf .gb{border:1px solid var(--border);background:var(--raised)}
.wf .tile{background:var(--sunken);border:0;border-radius:22px;box-shadow:none}
.wf .tile:hover{transform:none;border:0;box-shadow:none}
.wf .tile::before{opacity:.35}
.wf .tile .num{font-family:"Geist Mono",monospace;color:var(--faint)}
.wf .tile h3{font-weight:600;letter-spacing:-.025em}
.wf .tile .go{color:var(--ink);font-weight:600}
.wf .tile .art{max-width:240px}
.wf .tile:hover .art{transform:translateY(-3px)}
.wf .tile.row .art{max-width:300px}.wf .tile.row.s6 .art{max-width:260px}
.wf .ic{background:var(--surface);border:1px solid var(--border);color:var(--ink);border-radius:14px}
.wf .tile .bgic{display:none}
.wf .stage{background:var(--sunken);border:0;border-radius:28px}
.wf .stage::before{display:none}
.wf .stage .il{max-width:360px}
.wf .stage .no{-webkit-text-stroke:1px var(--border-strong)}
.wf .il .sh{filter:drop-shadow(0 8px 12px rgba(0,0,0,.10))}
.wf .il .fk{fill:var(--surface)}
.wf .il .fb{fill:var(--border)}
.wf .rart{background:var(--sunken)}
.wf .plate{background:var(--sunken);opacity:1;border-radius:22px}.wf .plate::after{display:none}
.wf .kpi{background:var(--sunken);border-radius:12px}.wf .kpi::after{display:none}
.wf .winbar{background:var(--sunken)}
.wf .winbar i:nth-child(1),.wf .winbar i:nth-child(2),.wf .winbar i:nth-child(3){background:var(--border-strong)}
.wf .rep.tilt .card,.wf .rep.tilt:hover .card{transform:none}
.wf .inc{border-radius:20px}.wf .inc::before{width:3px;background:var(--c)}
.wf .ag-call{background:var(--sunken);border:0;border-radius:28px}
.wf .proj{background:var(--raised);border:1px solid var(--border);border-radius:22px;box-shadow:none}
.wf .proj:hover{transform:none;border-color:var(--ink);box-shadow:none}
.wf .proj .thumb{background:var(--sunken)}
.wf .callout.info{background:var(--sunken)}
.wf .callout svg{color:var(--ink)}

/* forms */
.wf .input{border-radius:12px;border:1px solid var(--border);background:var(--surface);color:var(--ink);font-family:"Geist",sans-serif}
.wf .input:focus{border-color:var(--ink);box-shadow:none}
.wf .label{font-weight:600;font-size:13.5px}
.wf .radio-card{border-radius:12px;border:1px solid var(--border);font-family:"Geist",sans-serif}
.wf .radio-card:hover{border-color:var(--border-strong)}
.wf .radio-card.on{border-color:var(--ink);background:none;box-shadow:inset 0 0 0 1px var(--ink)}
.wf .radio-card.on .radio-dot{border-color:var(--ink)}
.wf .opt{border-radius:14px;background:var(--surface)}
.wf .opt:hover{transform:none}
.wf .opt.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);background:var(--surface)}
.wf .opt.on .dot{border-color:var(--ink)}
.wf .chk.on{background:var(--ink);border-color:var(--ink)}
.wf .stepnum{background:var(--ink);color:var(--surface);border-radius:12px;font-family:"Geist Mono",monospace}
.wf .step::before{display:none}
.wf .summary{border-radius:20px}.wf .summary::before{display:none}
.wf .tld{background:var(--surface);font-family:"Geist",sans-serif}
.wf .qty{background:var(--surface)}
.wf .tier i{background:var(--c)}
.wf .checks .tk{background:var(--ink);color:var(--surface)}
.wf .checks .tk svg{color:var(--surface);stroke:var(--surface)}

/* lists, tables, faq */
.wf .tbl th{font:500 11.5px/1 "Geist Mono",monospace;letter-spacing:.03em;text-transform:uppercase;color:var(--faint)}
.wf .tbl.rows{border-spacing:0;margin-top:0}
.wf .tbl.rows td{background:none;border-top:0;border-bottom:1px solid var(--border);padding:16px 14px 16px 0}
.wf .tbl.rows td:first-child{border-left:0;border-radius:0;box-shadow:none;padding-left:0}
.wf .tbl.rows td:last-child{border-right:0;border-radius:0}
.wf .tbl.rows tr:last-child td{border-bottom:0}
.wf .tbl.rows tr:hover td{background:var(--hover)}
.wf .tbl.rows .num{padding-right:14px}
.wf .acc .qn{font-family:"Geist Mono",monospace;color:var(--faint)}
.wf .acc .pm{background:var(--sunken);color:var(--ink)}
.wf .acc button:hover .pm{background:var(--ink);color:var(--surface)}
.wf .acc .pm.open{background:var(--ink);color:var(--surface)}
.wf .faq,.wf .acc{border-color:var(--border)}

/* stepper */
.wf .road::before{height:2px;top:28px;background:var(--border)}
.wf .road::after{height:2px;top:28px;background:var(--a1)}
.wf .rdot{background:var(--surface);border:1px solid var(--border-strong);color:var(--muted);font-family:"Geist Mono",monospace}
.wf .rstep.done .rdot,.wf .rstep.on .rdot{background:var(--ink);border-color:var(--ink);color:var(--surface);box-shadow:none}
.wf .rstep.on .rdot{transform:scale(1.06)}
.wf .rstep .n{font-family:"Geist Mono",monospace;letter-spacing:.08em}
.wf .rpanel{border-radius:22px}
.wf .rpanel::before{display:none}
.wf .bignum{-webkit-text-stroke:1.5px var(--c);font-family:"Geist",sans-serif;font-weight:700}
.wf .s-box{background:var(--surface);border-radius:16px}

/* nav */
.wf .util{font:400 12.5px/1 "Geist Mono",monospace;color:var(--faint);background:var(--surface)}
.wf header.zh{background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:saturate(1.4) blur(10px);box-shadow:none}
.wf header.zh::after{display:none}
.wf .navitem{font-weight:500;font-size:14.5px;color:var(--muted);height:36px;padding:0 12px;border-radius:999px;background:none}
.wf .navitem:hover{color:var(--ink);background:none}
.wf .navitem.current{color:var(--ink);background:none}
.wf .navitem.current::before{display:none}
.wf .mnav summary{border-color:var(--border)}
.wf .mnav nav{border-radius:18px;box-shadow:var(--elev-lg)}
.wf .prog{height:2px;background:var(--a1)}

/* hero: white, one faint glow, threads in a single accent */
.wf .beam,.wf .b-glow,.wf .grain{display:none}
.wf .hero-sec{background:radial-gradient(ellipse 48% 62% at 92% 8%,color-mix(in srgb,var(--a1) 9%,transparent),transparent 72%)}
.wf .sticker{width:96px;height:96px}
.wf .sticker text{font-family:"Geist Mono",monospace;font-size:11px;fill:var(--muted)}
.wf .sticker .ring{animation-duration:40s}
.wf .float{scale:.74}
.wf .logo-row li{color:var(--faint)}

/* ribbon: calm strip */
.wf .mq{background:var(--surface);color:var(--ink);border-block:1px solid var(--border)}
.wf .mq li{font:500 15px/1 "Geist",sans-serif;letter-spacing:-.01em;padding-block:16px;color:var(--muted)}
.wf .mq li svg{width:14px;height:14px}
.wf .mq li svg g{fill:var(--a1)}

/* cta + footer */
.wf .cta{background:var(--sunken);color:var(--ink);border-radius:28px;box-shadow:none}
.wf .cta::before{display:none}
.wf .cta .h2{color:var(--ink)}.wf .cta .lead{color:var(--muted)}
.wf .cta .rings{opacity:.5;transform:translateY(-50%) scale(.8)}
.wf .cta .btn-outline{background:var(--surface);color:var(--ink);border-color:var(--border)}
.wf .cta .btn-outline:hover{background:var(--surface);border-color:var(--ink);color:var(--ink)}
.wf .foot{background:transparent;border-top:1px solid var(--border)}
.wf .foot .col b{font:600 13px/1 "Geist",sans-serif;letter-spacing:0;text-transform:none}
.wf .mega{font-family:"Geist",sans-serif;font-weight:700;background:none;color:var(--sunken);-webkit-text-fill-color:currentColor}

/* motion: smaller, quieter */
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes rv{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.wf .il .bob{animation-duration:7s}
.wf .orbit{max-width:440px}
.wf .hl path{stroke:var(--a1)}

/* page transition veil uses the page colours */
html.wf-in::before{background:#0b0b0d}
html.wf-in[data-wf-t="light"]::before{background:#ffffff}
.wf-veil{--v:11,11,13}
.wf-veil[data-t="light"]{--v:255,255,255}
.wf-veil::before{background:linear-gradient(var(--dir),rgba(var(--v),0),rgba(var(--v),0)) !important}
.wf-veil::after{background:linear-gradient(90deg,transparent,var(--a1,#008AFF) 30%,var(--a1,#008AFF) 70%,transparent) !important;height:2px}
.wf-veil::after{box-shadow:none !important}
.wf .sec-head .eyebrow{align-self:flex-start}
.wf .rpanel{border:1px solid var(--border);box-shadow:none;background:var(--surface)}
.wf .checks .tk{background:var(--ink)}
.wf .stage .il .fc{fill:color-mix(in srgb,var(--c) 68%,var(--surface))}

/* segmented controls: grey track, white raised active pill (as in F profesionalno) */
.wf .seg{background:var(--sunken);border:0;padding:3px;gap:2px}
.wf .seg button{font:600 12px/1 "Geist",sans-serif;color:var(--muted);height:28px;background:transparent;box-shadow:none}
.wf .seg button:hover{color:var(--ink)}
.wf .seg button.on{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.16)}
.wf[data-theme="dark"] .seg button.on{background:#2a2c33;box-shadow:none}
.wf .seg-lg button{height:42px;padding:0 20px;font-size:14px}
/* sticky summary: sections clip instead of hiding overflow, so position:sticky keeps working */
.wf .sec{overflow:clip}

/* batch 3: small fixes */
.wf .cta .rings circle{transform-box:fill-box;transform-origin:center;transition:transform .9s cubic-bezier(.3,.1,.2,1),opacity .6s}
.wf .cta:hover .rings circle:nth-child(1){transform:translateX(-26px)}
.wf .cta:hover .rings circle:nth-child(2){transform:translateX(26px)}
.wf .cta:hover .rings circle:nth-child(3){transform:translateX(-14px) scale(1.08)}
.wf .cta:hover .rings circle:nth-child(4){transform:translateX(14px) scale(1.08)}
.wf .cta:hover .rings circle:nth-child(5){transform:scale(1.07)}
@media (prefers-reduced-motion:reduce){.wf .cta .rings circle{transition:none}}
.wf[data-theme="dark"] .util.zh{background:var(--surface)}
.wf[data-theme="dark"] header.zh{background:var(--surface)}
.wf .svc-art .stage:not(.full),.wf [data-sec="pricing"] .stage{background:transparent}
/* step panel: boxes first, illustration below; slide handled in JS */
.wf .rpanel{animation:none;overflow:hidden}
.wf .rpanel>div:nth-child(2){display:flex;flex-direction:column-reverse}
.wf .rpanel .rart{margin:12px 0 0}

/* hero B (v2 hero in a frame) */
.wf .hero-b{padding:0 0 70px}
.wf .hero-frame{display:block;width:100%;border:0;height:1100px;background:transparent;color-scheme:normal}
.wf .hero-b-tech{display:flex;flex-direction:column;align-items:center;gap:14px;padding-top:28px;border-top:1px solid var(--border);margin-top:8px}
.wf .hero-b-tech .logo-row{justify-content:center}

/* partners box under the services */
.wf .partners{display:flex;align-items:center;justify-content:space-between;gap:16px 28px;flex-wrap:wrap;padding:42px 28px;border-radius:22px;background:linear-gradient(110deg,#06265a 0%,#0a4cb0 58%,#0a7fe8 100%);color:#fff;margin-top:-24px}
.wf .partners h3{margin:0;font:600 20px/1.25 "Geist",sans-serif;letter-spacing:-.02em;color:#fff}
.wf .partners p{margin:4px 0 0;font-size:15px;color:rgba(255,255,255,.7)}
.wf .partners .pt-r{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.wf .partners .pav{display:flex;padding-left:15px}
.wf .partners .pav i{width:58px;height:58px;margin-left:-15px;border-radius:50%;display:grid;place-items:center;font:600 17px/1 "Geist",sans-serif;font-style:normal;color:#fff;background:#1a5fc2;box-shadow:0 0 0 3px #0a3f8e,inset 0 0 0 1px rgba(255,255,255,.22);transition:margin .3s cubic-bezier(.2,.7,.2,1)}
.wf .partners .pav i.more{background:#0a3f8e;color:rgba(255,255,255,.75);font-size:15px}
.wf .partners:hover .pav i{margin-left:-3px}
.wf .partners .pbtn{display:inline-flex;align-items:center;height:46px;padding:0 22px;border-radius:999px;background:#fff;color:#0b0b0c;font:600 15px/1 "Geist",sans-serif;text-decoration:none}
.wf .partners .pbtn:hover{opacity:.88}
@media (prefers-reduced-motion:reduce){.wf .partners .pav i{transition:none}}
@media (max-width:620px){.wf .partners{padding:24px}.wf .partners .pt-r,.wf .partners .pbtn{width:100%;justify-content:center}}

/* audience tabs */
.wf .aud-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:16px}
.wf .aud-panel{border:1px solid var(--border);border-radius:22px;padding:32px;display:flex;flex-direction:column;gap:18px;align-content:start;min-width:0;background:var(--surface)}
.wf .aud-panel h3{margin:0;font:700 26px/1.15 "Geist",sans-serif;letter-spacing:-.03em}
.wf .aud-panel p{margin:0;color:var(--muted)}
.wf .aud-ticks{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.wf .aud-ticks li{display:grid;grid-template-columns:20px 1fr;gap:10px;font-size:15px}
.wf .aud-ticks li::before{content:"";width:18px;height:18px;margin-top:2px;border-radius:50%;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.2l2.6 2.6L13 6.4' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat,var(--a1)}
.wf .aud-stage{background:var(--sunken);border-radius:22px;padding:clamp(18px,3vw,32px);display:grid;align-content:center;min-width:0}
.wf .aud-panel .tbl{width:100%}
@media (max-width:900px){.wf .aud-split{grid-template-columns:minmax(0,1fr)}}
/* mock site window: inverted against the page */
.wf .tm{--tb:#111215;--ti:#f4f4f5;--tmu:#8d8f96;--ts:#b3b5bb;--tl:#2a2b31;background:var(--tb);color:var(--ti);border:1px solid var(--tl);border-radius:16px;overflow:hidden;box-shadow:0 12px 32px -18px rgba(0,0,0,.25);text-align:left}
.wf[data-theme="dark"] .tm{--tb:#fff;--ti:#0b0b0c;--tmu:#8a8a90;--ts:#5c5c63;--tl:#e6e6e8}
.wf .tm-bar{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-bottom:1px solid var(--tl)}
.wf .tm-bar i{width:8px;height:8px;border-radius:50%;background:var(--tl)}
.wf .tm-bar span{margin-left:8px;font:400 11px "Geist Mono",monospace;color:var(--tmu)}
.wf .tm-bar em{margin-left:auto;font:500 10px "Geist Mono",monospace;font-style:normal;color:var(--tmu);border:1px solid var(--tl);border-radius:999px;padding:2px 7px}
.wf .tm-nav{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 16px;font-size:13px;border-bottom:1px solid var(--tl)}
.wf .tm-nav span{display:flex;gap:14px;color:var(--tmu);font-size:11.5px}.wf .tm-nav i{font-style:normal}
.wf .tm-hero{position:relative;height:150px;overflow:hidden;border-radius:14px;margin:12px 16px 0}
.wf .tm-hero svg{position:absolute;inset:0;width:100%;height:100%}
.wf .tm-cap{position:absolute;left:16px;bottom:16px;right:16px;display:grid;gap:2px;color:#fff}
.wf .tm-cap small{font:500 10.5px "Geist Mono",monospace;letter-spacing:.04em;text-transform:uppercase;opacity:.85}
.wf .tm-cap strong{font-size:20px;letter-spacing:-.03em;line-height:1.1}
.wf .tm-book{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px 16px 0}
.wf .tm-book .f{border:1px solid var(--tl);border-radius:10px;padding:7px 10px;display:grid;gap:1px}
.wf .tm-book small{font-size:10.5px;color:var(--tmu)}.wf .tm-book b{font-size:13px}
.wf .tm-btn{grid-column:1/-1;background:var(--ti);color:var(--tb);border-radius:999px;text-align:center;font-weight:600;font-size:13px;padding:9px 12px}
.wf .tm-am{display:flex;flex-wrap:wrap;gap:6px 14px;padding:14px 16px 0;font-size:12px;color:var(--ts)}.wf .tm-am i{font-style:normal}.wf .tm-am svg{display:none}
.wf .tm-price{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:14px 16px 16px;padding-top:12px;border-top:1px solid var(--tl)}
.wf .tm-price strong{display:block;font-size:13.5px}.wf .tm-price small{color:var(--tmu);font-size:11.5px}
.wf .tm-price .pr{text-align:right;white-space:nowrap}.wf .tm-price .pr b{font-size:18px}

/* project screenshots: full page, scrolls on hover */
.wf .proj .thumb.shot{display:block;padding:0;aspect-ratio:4/3;overflow:hidden;border-bottom:1px solid var(--border);background:var(--sunken);text-decoration:none}
.wf .proj .thumb.shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 0%;transition:object-position 2s cubic-bezier(.3,.1,.2,1)}
.wf .proj .thumb.shot:hover img,.wf .proj .thumb.shot:focus-visible img{object-position:50% 100%;transition-duration:3s;transition-timing-function:ease-in-out}
@media (prefers-reduced-motion:reduce){.wf .proj .thumb.shot img{transition:none!important}}
/* fixed browser bar above the scrolling screenshot */
.wf .proj .thumb.shot{display:flex;flex-direction:column}
.wf .proj .thumb.shot .sbar{flex:none;display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;background:var(--surface);border-bottom:1px solid var(--border)}
.wf .proj .thumb.shot .sbar i{width:8px;height:8px;border-radius:50%;background:var(--border-strong);opacity:.6}
.wf .proj .thumb.shot .sbar em{margin-left:8px;font:400 11px "Geist Mono",monospace;font-style:normal;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wf .proj .thumb.shot .sbody{display:block;flex:1;min-height:0;overflow:hidden}
.wf .rart{background:transparent}
.wf .portal-link{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 13px;border-radius:999px;background:var(--sunken);border:1px solid var(--border);color:var(--ink);font-weight:600;text-decoration:none;transition:border-color .15s}
.wf .portal-link:hover{border-color:var(--ink)}

.wf .wm .s0{stop-color:#00CCFF}.wf .wm .s1{stop-color:#008AFF}