/* ABC Translation Srbija ------------------------------------------------- */
@font-face{font-family:"Source Serif";src:url(/assets/fonts/sourceserif4-latin.woff2) format("woff2");font-weight:400 650;font-display:swap;unicode-range:U+0000-024F,U+2010-2027,U+2030-203A,U+20AC,U+2116,U+2122,U+2212}
@font-face{font-family:"Source Serif";src:url(/assets/fonts/sourceserif4-cyr.woff2) format("woff2");font-weight:400 650;font-display:swap;unicode-range:U+0400-045F,U+0490-0491}
@font-face{font-family:"Manrope";src:url(/assets/fonts/manrope-latin.woff2) format("woff2");font-weight:400 800;font-display:swap;unicode-range:U+0000-024F,U+2010-2027,U+2030-203A,U+20AC,U+2116,U+2122,U+2212}
@font-face{font-family:"Manrope";src:url(/assets/fonts/manrope-cyr.woff2) format("woff2");font-weight:400 800;font-display:swap;unicode-range:U+0400-045F,U+0490-0491}

:root{
  --paper:#F4F6F9; --surface:#FFFFFF; --ink:#13213C; --text:#283040; --muted:#5A6475;
  --rule:#D5DBE4; --seal:#A3171E; --seal-dark:#82121A; --link:#1F4FA3;
  --flag-red:#C6363C; --flag-blue:#0C4076;
  --serif:"Source Serif",Georgia,"Times New Roman",serif;
  --sans:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --wrap:1200px; --gutter:clamp(16px,4vw,40px);
  --step--1:.875rem; --step-0:1.0625rem; --step-1:1.25rem; --step-2:1.5625rem; --step-3:1.953rem; --step-4:clamp(2.1rem,4.4vw,3.35rem);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;background:var(--paper);color:var(--text);font:400 var(--step-0)/1.65 var(--serif);font-kerning:normal;text-rendering:optimizeLegibility}
img,svg{max-width:100%}
a{color:var(--link);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{color:var(--ink)}
:focus-visible{outline:3px solid var(--link);outline-offset:3px;border-radius:2px}
h1,h2,h3{color:var(--ink);font-family:var(--serif);font-weight:600;line-height:1.18;margin:0 0 .6em;text-wrap:balance}
h1{font-size:var(--step-4);line-height:1.08;letter-spacing:-.012em}
h2{font-size:var(--step-3);letter-spacing:-.006em}
h3{font-size:var(--step-1)}
p{margin:0 0 1em;max-width:68ch}
ul,ol{padding-left:1.2em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}
.narrow{max-width:820px}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:var(--ink);color:#fff;padding:.5em 1em;z-index:100;font-family:var(--sans)}
.skip:focus{left:8px}
.lead{font-size:var(--step-1);line-height:1.55;color:var(--text)}

/* buttons */
.btn{display:inline-block;font:700 1rem/1 var(--sans);background:var(--seal);color:#fff;text-decoration:none;padding:1em 1.4em;border-radius:6px;border:0;cursor:pointer;transition:background .15s}
.btn:hover{background:var(--seal-dark);color:#fff}
.btn-small{padding:.7em 1em;font-size:.9rem}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{background:#E7ECF3;color:var(--ink)}
.link-more{font-family:var(--sans);font-weight:700;font-size:.95rem}
.link-plain{font-family:var(--sans);font-weight:600}

/* header */
.site-header{background:var(--surface);border-bottom:1px solid var(--rule);position:sticky;top:0;z-index:50}
.header-row{display:flex;align-items:center;gap:24px;min-height:72px}
.logo{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;flex:none}
.logo-mark{width:40px;height:40px}
.logo-text{display:flex;flex-direction:column;line-height:1.05;font-family:var(--sans)}
.logo-name{font-weight:800;font-size:1.06rem;letter-spacing:-.01em}
.logo-tag{font-size:.8rem;color:var(--muted);font-weight:600}
.site-nav{display:flex;align-items:center;gap:22px;margin-left:auto;font-family:var(--sans)}
.nav-list,.lang-switch{list-style:none;margin:0;padding:0;display:flex;gap:4px}
.nav-list a{display:block;padding:.5em .7em;color:var(--ink);text-decoration:none;font-weight:600;font-size:.95rem;border-radius:4px}
.nav-list a:hover{background:var(--paper)}
.nav-list a[aria-current]{box-shadow:inset 0 -2px 0 var(--seal)}
.lang-switch{border:1px solid var(--rule);border-radius:6px;padding:2px;gap:0}
.lang-switch a{display:block;padding:.35em .6em;font-size:.8rem;font-weight:700;color:var(--muted);text-decoration:none;border-radius:4px}
.lang-switch a[aria-current]{background:var(--ink);color:#fff}
.nav-toggle{display:none;margin-left:auto;font:700 .95rem var(--sans);background:none;border:1px solid var(--rule);border-radius:6px;padding:.6em 1em;color:var(--ink)}
@media (max-width:1060px){
  .nav-toggle{display:block}
  .js .site-nav{display:none}
  .site-nav{position:absolute;left:0;right:0;top:100%;background:var(--surface);border-bottom:1px solid var(--rule);flex-direction:column;align-items:stretch;padding:12px var(--gutter) 20px;gap:14px}
  .js .site-nav.open{display:flex}
  .nav-list{flex-direction:column}
  .nav-list a{padding:.75em .2em;border-bottom:1px solid var(--paper);font-size:1.05rem}
  .lang-switch{align-self:flex-start}
  .header-cta{text-align:center}
  html:not(.js) .site-nav{position:static;border:0;padding:0}
  html:not(.js) .nav-toggle{display:none}
  html:not(.js) .header-row{flex-wrap:wrap;padding-bottom:10px}
}

/* breadcrumbs */
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:.3em;padding:18px 0 0;margin:0;font:500 .85rem var(--sans);color:var(--muted)}
.crumbs li+li::before{content:"/";margin-right:.3em;color:var(--rule)}
.crumbs a{color:var(--muted)}

/* hero */
.hero{background:var(--surface);border-bottom:1px solid var(--rule);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:center;padding-top:72px;padding-bottom:80px}
.hero-copy h1{max-width:19ch}
.hero-copy .lead{max-width:56ch}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin:28px 0 26px}
.hero-points{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px 22px;font:600 .92rem var(--sans);color:var(--muted)}
.hero-points li{display:flex;align-items:center;gap:.5em}
.hero-points li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--seal);flex:none}

/* the certified-translation bundle */
.doc-stack{position:relative;margin:0 auto;width:min(100%,400px);aspect-ratio:400/500}
.sheet{position:absolute;inset:0;background:var(--surface);border:1px solid var(--rule);border-radius:3px;box-shadow:0 1px 0 rgba(19,33,60,.04),0 18px 40px -24px rgba(19,33,60,.35)}
.sheet-back{transform:translate(26px,-30px) rotate(3.2deg);background:#FAFBFC}
.sheet-mid{transform:translate(13px,-15px) rotate(1.4deg);background:#FDFDFE}
.sheet-tab{position:absolute;top:-1px;right:22px;transform:translateY(-100%);font:700 .72rem var(--sans);color:var(--muted);background:inherit;border:1px solid var(--rule);border-bottom:0;padding:.35em .8em;border-radius:4px 4px 0 0}
.sheet-back .sheet-tab{right:190px}
.sheet-mid .sheet-tab{right:104px}
.sheet-front{padding:42px 34px 34px 64px;display:flex;flex-direction:column}
.sheet-front .sheet-tab{color:var(--seal)}
.doc-kicker{font:700 .78rem var(--sans);color:var(--seal);margin:0 0 .5em}
.doc-title{font:600 1.45rem/1.2 var(--serif);color:var(--ink);margin:0 0 .3em}
.doc-pair{font-size:.95rem;color:var(--muted);margin:0 0 1.3em}
.doc-lines{display:grid;gap:11px;margin-bottom:1.4em}
.doc-lines i{display:block;height:7px;border-radius:4px;background:#E6EAF0}
.doc-lines i.s{width:72%}.doc-lines i.xs{width:45%}
.doc-clause{font-size:.86rem;line-height:1.45;color:var(--text);margin:auto 0 .4em;padding-left:76px;max-width:none}
.doc-sign{color:var(--ink);width:120px;margin-left:auto}
.binding{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.binding .hole{fill:var(--paper);stroke:#B9C2CF;stroke-width:1}
.cord use{fill:none;stroke-width:5;stroke-linecap:butt}
.cord .w{stroke:#fff;filter:drop-shadow(0 .5px .7px rgba(19,33,60,.55));stroke-linecap:round}
.cord .r{stroke:var(--flag-red);stroke-dasharray:5 10}
.cord .b{stroke:var(--flag-blue);stroke-dasharray:5 10;stroke-dashoffset:-5}
.seal{position:absolute;left:-30px;bottom:2%;width:128px;height:128px;transform:rotate(-12deg)}
.seal-paper{fill:#fff;stroke:var(--rule)}
.seal-ring{fill:none;stroke:var(--seal);stroke-width:2.4;opacity:.92}
.seal-ring.thin{stroke-width:1.2}
.seal-text{font:700 9.4px var(--sans);fill:var(--seal)}
.seal-mid{font:800 21px var(--sans);fill:var(--seal)}
@media (prefers-reduced-motion:no-preference){
  .seal{animation:press .7s .35s cubic-bezier(.2,.9,.3,1.2) both}
  @keyframes press{from{opacity:0;transform:rotate(-12deg) scale(1.35)}to{opacity:1;transform:rotate(-12deg) scale(1)}}
}

/* sections */
.section{padding:84px 0}
.section-alt{background:var(--surface);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.section-ink{background:var(--ink);color:#DCE3EE}
.section-ink h2,.section-ink dt{color:#fff}
.section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:40px;align-items:end;margin-bottom:36px}
.section-head h2{margin:0}
.section-head p{margin:0}

/* service index: ruled list, not cards */
.svc-index{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px;border-top:2px solid var(--ink)}
.svc-index li{border-bottom:1px solid var(--rule)}
.svc-index a{display:block;padding:22px 0 20px;text-decoration:none;color:var(--text)}
.svc-index h2,.svc-index h3{font-size:var(--step-1);margin:0 0 .3em;color:var(--ink);transition:color .15s}
.svc-index a:hover h2,.svc-index a:hover h3{color:var(--seal);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em}
.svc-index p{margin:0;color:var(--muted);font-size:1rem}
.svc-index-lg{margin-top:12px;margin-bottom:84px}

/* price */
.price-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px}
.price-need{color:#fff;border-left:3px solid var(--flag-red);padding-left:16px}
.factors{margin:0;display:grid;gap:0}
.factors div{padding:18px 0;border-top:1px solid rgba(255,255,255,.18)}
.factors div:last-child{border-bottom:1px solid rgba(255,255,255,.18)}
.factors dt{font:700 1.05rem var(--sans);margin-bottom:.25em}
.factors dd{margin:0}

/* process (real sequence) */
.process{list-style:none;padding:0;margin:32px 0 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px;counter-reset:step}
.process li{counter-increment:step;border-top:2px solid var(--ink);padding-top:18px}
.process li::before{content:counter(step);display:block;font:600 2.4rem/1 var(--serif);color:var(--seal);margin-bottom:12px}
.process h3{font-size:1.15rem}
.process p{font-size:1rem;margin:0}

/* city & language indexes */
.two-col{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px}
.region{padding:14px 0;border-top:1px solid var(--rule)}
.region h3{font:700 .95rem var(--sans);margin-bottom:.3em}
.region p{margin:0;line-height:1.8}
.lang-index{list-style:none;padding:0;margin:0 0 1em;columns:3 9em;column-gap:24px}
.lang-index li{padding:3px 0;break-inside:avoid}
.pill-list{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:8px}
.pill-list a{display:inline-block;padding:.35em .85em;border:1px solid var(--rule);border-radius:999px;background:var(--surface);text-decoration:none;font:600 .9rem var(--sans);color:var(--ink)}
.pill-list a:hover{border-color:var(--ink)}
.inline-links{line-height:1.9}

/* faq */
.faq{border-top:2px solid var(--ink);margin-bottom:1.5em}
.faq-item{border-bottom:1px solid var(--rule)}
.faq-item summary{cursor:pointer;list-style:none;padding:18px 40px 18px 0;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"";position:absolute;right:6px;top:26px;width:10px;height:10px;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg);transition:transform .2s}
.faq-item[open] summary::after{transform:rotate(-135deg);top:31px}
.faq-item summary h3{margin:0;font-size:1.15rem;display:inline}
.faq-item p{padding-bottom:12px}

/* inner pages */
.page-head{padding:28px 0 12px;max-width:760px}
.narrow-head{padding-bottom:28px}
.page-meta{font:600 .9rem var(--sans);color:var(--muted);margin-bottom:.8em}
.article-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:64px;padding-bottom:84px}
.article .block{padding-top:28px;margin-top:28px;border-top:1px solid var(--rule)}
.article .block h2{font-size:var(--step-2)}
.block{margin-bottom:8px}
.check-list{list-style:none;padding:0;max-width:68ch}
.check-list li{position:relative;padding:6px 0 6px 28px}
.check-list li::before{content:"";position:absolute;left:2px;top:.9em;width:12px;height:6px;border-left:2px solid var(--seal);border-bottom:2px solid var(--seal);transform:rotate(-45deg)}
.steps-list{counter-reset:s;list-style:none;padding:0;max-width:68ch}
.steps-list li{counter-increment:s;position:relative;padding:8px 0 8px 44px}
.steps-list li::before{content:counter(s);position:absolute;left:0;top:6px;width:30px;height:30px;border-radius:50%;border:1.5px solid var(--ink);font:700 .85rem/27px var(--sans);text-align:center;color:var(--ink)}
.svc-mini{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px}
.svc-mini li{padding:10px 0;border-bottom:1px solid var(--rule)}
.svc-mini a{font-weight:600}
.svc-mini span{display:block;font-size:.92rem;color:var(--muted);line-height:1.45}
.sidebar{padding-top:28px}
.sidebar>*{position:relative}
.quote-box{background:var(--ink);color:#DCE3EE;padding:28px;border-radius:6px;margin:28px 0}
.sidebar .quote-box{margin-top:0}
.quote-box h2{color:#fff;font-size:1.4rem}
.quote-box .btn{margin-top:6px}
.side-nav,.side-card{padding:22px 0;border-top:2px solid var(--ink)}
.side-nav h2{font:700 1rem var(--sans);margin-bottom:.6em}
.side-nav ul{list-style:none;padding:0;margin:0 0 1em}
.side-nav li{padding:5px 0}
.side-card p{font-family:var(--sans);font-size:.95rem}
.region-block{padding:28px 0;border-top:2px solid var(--ink)}
.region-block:last-child{margin-bottom:84px}
.district-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:24px 40px}
.district h3{font:700 .95rem var(--sans);color:var(--muted);margin-bottom:.4em}
.district ul{list-style:none;padding:0;margin:0}
.district li{padding:3px 0}
.lang-table{list-style:none;padding:0;margin:0 0 84px;border-top:2px solid var(--ink)}
.lang-table a{display:grid;grid-template-columns:200px minmax(0,1fr) 220px;gap:24px;padding:14px 0;border-bottom:1px solid var(--rule);text-decoration:none;color:var(--text)}
.lang-table a:hover .lt-name{color:var(--seal);text-decoration:underline}
.lt-name{font-weight:600;color:var(--ink)}
.lt-countries{color:var(--muted)}
.lt-hague{font:600 .9rem var(--sans);color:var(--ink);text-align:right}
.thanks{padding:72px 0 120px}

/* contact & form */
.contact-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:64px;align-items:start}
.contact-page{padding-top:28px;padding-bottom:84px}
.contact-dl{margin:28px 0 0;font-family:var(--sans)}
.contact-dl div{padding:14px 0;border-top:1px solid var(--rule)}
.contact-dl dt{font-size:.85rem;color:var(--muted);font-weight:600}
.contact-dl dd{margin:0;font-weight:700;font-size:1.05rem;color:var(--ink)}
.quote-form{background:var(--surface);border:1px solid var(--rule);border-radius:8px;padding:clamp(20px,3vw,36px);font-family:var(--sans)}
.section-alt .quote-form{background:var(--paper)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{margin-bottom:16px}
.field label{display:block;font-weight:700;font-size:.9rem;color:var(--ink);margin-bottom:6px}
.req{font-weight:500;color:var(--muted);font-size:.8rem}
.field input[type=text],.field input[type=email],.field input[type=tel],.field select,.field textarea{width:100%;font:500 1rem var(--sans);color:var(--text);background:#fff;border:1px solid #B9C2CF;border-radius:6px;padding:.75em .8em}
.field textarea{resize:vertical;min-height:140px;line-height:1.5}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--link);outline:2px solid rgba(31,79,163,.25);outline-offset:0}
.field input[type=file]{font:500 .9rem var(--sans);max-width:100%}
.field .hint{font-size:.82rem;color:var(--muted);margin:.4em 0 0}
.field.invalid input,.field.invalid textarea,.field.invalid select{border-color:var(--seal)}
.field .err-msg{color:var(--seal);font-size:.82rem;margin:.3em 0 0}
.consent{display:flex;gap:10px;align-items:flex-start}
.consent input{margin-top:.25em;width:18px;height:18px;flex:none}
.consent label{font-weight:500;font-size:.88rem;line-height:1.45}
.form-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.form-status{margin:0;font-weight:600;font-size:.95rem}
.form-status.ok{color:#17663A}.form-status.err{color:var(--seal)}
.hp{position:absolute;left:-5000px;width:1px;height:1px;overflow:hidden}

/* footer */
.site-footer{background:var(--ink);color:#B9C4D6;font-family:var(--sans);font-size:.92rem}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{text-decoration:underline}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;padding-top:56px;padding-bottom:40px}
.footer-logo{color:#fff;font-weight:800;font-size:1.1rem}
.footer-logo span{font-weight:500;color:#B9C4D6}
.footer-h{color:#fff;font:700 .95rem var(--sans);margin-bottom:.8em}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li{padding:4px 0}
.footer-base{border-top:1px solid rgba(255,255,255,.14);padding-top:20px;padding-bottom:28px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px}
.footer-base p{margin:0}
.footer-cities a{color:#B9C4D6}

/* responsive */
@media (max-width:980px){
  .hero-grid,.two-col,.price-grid,.contact-grid,.article-grid,.section-head{grid-template-columns:1fr}
  .hero-grid{gap:64px;padding-top:44px;padding-bottom:64px}
  .doc-stack{width:min(86%,360px)}
  .process{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1fr 1fr}
  .sidebar{padding-top:0}
  .lang-table a{grid-template-columns:1fr;gap:2px}
  .lt-hague{text-align:left}
}
@media (max-width:640px){
  body{font-size:1rem}
  .section{padding:60px 0}
  .svc-index,.svc-mini,.field-row,.process{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .sheet-front{padding:34px 22px 26px 50px}
  .doc-clause{padding-left:64px}
  .seal{width:104px;height:104px;left:-14px}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
@media print{.site-header,.site-footer,.quote-form,.sidebar{display:none}body{background:#fff}}