/* =====================================================================================================================
   PDVS · svetainės dizainas (etalonas pristatymo stilius, PDVS programos spalvos) – bendras branduolys ir pradžios puslapis.
   Failai: site.css (žetonai, bazė, antraštė, poraštė, pradžios sekcijos, forma, slapukų juosta) · pages.css (vidinių puslapių
   komponentai) · scene.css (sistemos išvaizdos atkartojimas) · site.js (antraštė, slideris, karuselės, atsiradimas slenkant).
   Spalvos keičiamos vienoje vietoje – :root žemiau (--brand …).
   ===================================================================================================================== */
:root{
  color-scheme:light;

  /* ---------- PDVS programos spalvos (išmatuotos tikruose sistemos ekranuose: login_page.png, dvs.png, manager_approval.png) ----------
     Norite kitos raudonos? Pakeiskite tik šias 4 eilutes (--brand*). Svetainės raudona – #B5121F / #8A0D18; replikos – #BA0646 / #9A0538. */
  --brand:#9E2520;          /* pagrindinė raudona  (etalonas: šalavijas #85A6A6) */
  --brand-hover:#8B211C;    /* užvedus pelę        */
  --brand-tint:#F1DFE0;     /* šviesus atspalvis   */
  --brand-soft:#E8938C;     /* raudona ant tamsaus fono – tekstui ir smulkiems ženklams (kontrastas ≥ 6:1) */

  /* tamsūs paviršiai (etalonas: #163838 / #2F4F4F) */
  --dark:#2B1311;
  --dark-2:#43201D;

  /* tekstas ir linijos (etalonas: #28241F / #797979 / #EAEAEA / #F7F7F7) */
  --ink:#1D1E20;            /* antraštės – kaip programos --text-dark */
  --body:#646C74;           /* pastraipos – kaip programos --text-secondary, patamsinta iki 5:1 ant pilkos juostos (#F7F8F9) */
  --on-dark:#CFC6C5;        /* tekstas ant tamsaus (etalonas #B8B7B7) */
  --line:#EAEAEA;
  --soft:#F7F8F9;           /* šviesūs plotai – programos turinio fonas */

  --f-head:"Wix Madefor Display",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-body:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;

  /* ---------- sinonimai komponentų CSS (kortelės, sekcijos, antraštė …) ---------- */
  --c-dark:var(--dark);
  --c-dark-2:var(--dark-2);
  --c-accent:var(--brand);        /* ant šviesaus; tamsiuose blokuose perrašoma į --brand-soft */
  --c-ink:var(--ink);
  --c-text:var(--body);
  --c-text-on-dark:var(--on-dark);
  --c-line:var(--line);
  --c-soft:var(--soft);
  --c-white:#fff;
  --c-meter-track:#EEEEEE;
  --c-hairline-on-dark:rgba(255,255,255,.23);
  --c-bracket:rgba(255,255,255,.46);

  --header-h:111px;

  /* ---------- sinonimai apatinėms sekcijoms (integracijos, principai, naujienos, poraštė) ---------- */
  --accent:var(--brand);
  --slate:var(--dark-2);
  --dark-fade:var(--dark);
  --ink-link:var(--ink);
  --on-dark-soft:#D6CBC9;
  --on-dark-line:rgba(255,255,255,.31);
  --foot-text:#B9AEAC;
  --foot-line:#4B2825;
  --foot-divider:rgba(255,255,255,.14);
  --pre-bg:#eee;
  --pre-ink:#212529;
  --logo-gap:100px;
  --logos-per-view:3;
}

/* tamsūs blokai: „šalavijo“ vaidmuo ten – švelnesnė raudona */
.sys__stage,.proc,.rating-card{--c-accent:var(--brand-soft)}
.band--quotes,.foot{--accent:var(--brand-soft)}


/* ---------- bazė ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:var(--header-h)}
body{margin:0;overflow-x:clip;background:#fff;color:var(--c-text);font:400 16px/30px var(--f-body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3,h4,h5,p,ul,ol,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;vertical-align:middle}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.skip{position:absolute;left:-999px;top:8px;z-index:100000;padding:8px 14px;background:var(--ink);color:#fff}
.skip:focus{left:8px}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
:focus-visible{outline:2px solid var(--brand);outline-offset:3px}
::selection{background:var(--brand);color:#fff}

/* =====================================================================================================================
   HERO SLIDERIS – išdėstymas (iš etalono išmatuotas, 25 plotuose patikrintas) + judesio kabliukai
   ---------------------------------------------------------------------------------------------------------------------
   KAIP VEIKIA IŠDĖSTYMAS
   - .hero yra „konteinerio užklausos“ matas: viskas seka hero PLOTĮ (be slinkties juostos), kaip etalonas Slider Revolution.
   - 4 lygiai: A ≥1024, B 778–1023, C 480–777, D ≤479. Kiekvienas turi „dizaino drobę“ --gw × --gh (nematomi dizaino pikseliai).
   - VIENAS DIZAINO PIKSELIS --u = min(1px, 100cqw / --gw). Hero aukštis = ceil(--gh × --u). Drobė centruota, jos kairysis kraštas --gl.
   - Viskas rašoma dizaino pikseliais: calc(N * var(--u)); šrifto dydžiai / eilučių aukščiai / tarpai apvalinami iki sveikų px (kaip SR7).
   ===================================================================================================================== */

:root {
  --hero-dark:      var(--dark);
  --hero-accent:    var(--brand-soft);            /* švelni raudona: slankiklis, aktyvus taškas, užvedimo spalva */
  --hero-tint-1:    rgba(46, 6, 4, .66);          /* vienodas tamsus tonas virš 1 slaido vaizdo (etalonas: rgba(0,25,21,.66)) */
  --hero-tint-3:    rgba(30, 5, 4, .42);          /* ... virš 3 slaido – prisijungimo langas (etalonas: .51) */
  --hero-tint-2:    rgba(46, 6, 4, .5);           /* ... virš 2 slaido – nuotrauka; tas pats bordo kaip 1 slaide, kiek skaidresnis (nuotrauka raudonai nuspalvinta pačiame faile) */
  --hero-ink:       #fff;
  --hero-ink-soft:  rgba(255, 255, 255, .77);
  --hero-ink-dim:   rgba(255, 255, 255, .5);
  --hero-ink-hover: rgba(255, 255, 255, .69);
  --hero-line:      rgba(255, 255, 255, .25);
  --hero-track:     rgba(255, 255, 255, .3);
  --hero-dot-idle:  rgba(255, 255, 255, .28);
  --hero-hint-fill: rgba(158, 37, 32, .62);       /* pasiūlymo rodyklės dėžė = programos raudona 62 % (etalonas: šalavijas 60 %) */
  --hero-ease-hover: cubic-bezier(.25, .46, .45, .94);
  --hero-ff-display: var(--f-head);
  --hero-ff-text:    var(--f-body);
}

/* ---------- 1. konteineris + scena ---------- */
.hero { container: hero / inline-size; position: relative; background: var(--hero-dark); isolation: isolate; }

.hero__stage {
  --gw: 1400; --gh: 1050;                                      /* A lygis */
  --u:  min(1px, calc(100cqw / var(--gw)));                    /* vienas dizaino pikselis   */
  --gl: max(0px, calc((100cqw - var(--gw) * 1px) / 2));        /* drobės kairysis kraštas   */
  position: relative; overflow: clip;   /* clip, ne hidden: fokusas negali paslinkti scenos į šoną */
  height: calc(var(--gh) * var(--u));
  height: round(up, calc(var(--gh) * var(--u)), 1px);
  background: var(--hero-dark);
  color: var(--hero-ink);
  font-family: var(--hero-ff-text);
  touch-action: pan-y;         /* vertikali slinktis lieka įprasta, horizontalus tempimas = slaido keitimas */
  user-select: none; -webkit-user-select: none;
}
:where(.hero__stage, .hero__stage *, .hero__stage *::before, .hero__stage *::after) { box-sizing: border-box; }
:where(.hero__stage p, .hero__stage h1, .hero__stage h2, .hero__stage ol, .hero__stage ul, .hero__stage strong) { margin: 0; padding: 0; list-style: none; }
:where(.hero__stage button) { appearance: none; margin: 0; padding: 0; border: 0; background: none; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; }

@container hero (max-width: 1023px) { .hero__stage { --gw: 1024; --gh: 768; } }   /* B lygis */
@container hero (max-width: 777px)  { .hero__stage { --gw: 778;  --gh: 550; } }   /* C lygis */
@container hero (max-width: 479px)  { .hero__stage { --gw: 480;  --gh: 550; } }   /* D lygis */

/* ---------- 2. slaidai: vaizdas (cover, KAIRYS-APAČIA) + vienodas tamsus tonas ---------- */
.hero__slides { position: absolute; inset: 0; }
.hero__slide { position: absolute; inset: 0; display: none; overflow: hidden; }
.hero__slide.is-current, .hero__slide.is-leaving, .hero__slide.is-entering { display: block; }
.slide__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 0% 100%; display: block; }
.hero__slide.is-mosaic .slide__img { visibility: hidden; }          /* kol vyksta mozaika, vaizdą piešia canvas */
.hero--static .slide__img { visibility: visible !important; }
.slide__canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }
.hero__tint { position: absolute; inset: 0; background: var(--tint); }
.hero__slide--1 { --tint: var(--hero-tint-1); }
.hero__slide--3 { --tint: var(--hero-tint-3); }
.hero__slide--2 { --tint: var(--hero-tint-2); }
.hero__slide:not(.is-current) .hero__tint { pointer-events: none; }

/* „kaukė“: tekstas atsiranda iš savo dėžės viduje (overflow:hidden); kol sluoksnis išeina, kaukė atsidaro */
.hl[data-masked] { overflow: hidden; }
.hl.is-open { overflow: visible !important; }
[data-fx] { transform-origin: 50% 50%; }
.ch { display: inline-block; transform-origin: 50% 50%; backface-visibility: hidden; }

/* ---------- 3. tekstai: etiketė + antraštė (lygių žetonai, slaidų išimtys) ---------- */
.hero__slide {
  /* A lygis */
  --lref: var(--gl); --lx: 32; --ly: 330; --lw: 650; --lfs: 18; --llh: 30; --lls: 2; --lal: left;
  --tref: var(--gl); --tx: 25; --tt: 370; --tw: 1130; --tfs: 82; --tlh: 88; --tpb: 10; --tal: left;
}
.hero__slide--3 { --lx: 25; --ly: 331; --lw: 437; --tx: 21; --tt: 362; --tw: 995; --tfs: 72; --tlh: 80; }   /* 3 slaido antraštė siauresnė – kad nesiliestų su prisijungimo kortele */
.hero__slide--2 { --ly: 318; --lfs: 20; --lls: 4; --tt: 358; --tw: 840; --tfs: 72; --tlh: 80; }   /* 2 slaido antraštė kairėje – žmogus nuotraukos dešinėje */

.hero__label {
  position: absolute;
  left: calc(var(--lref) + var(--lx) * var(--u));
  top: calc(var(--ly) * var(--u));
  width: calc(var(--lw) * var(--u));
  font-size: calc(var(--lfs) * var(--u));
  font-size: round(calc(var(--lfs) * var(--u)), 1px);
  line-height: calc(var(--llh) * var(--u));
  line-height: round(calc(var(--llh) * var(--u)), 1px);
  letter-spacing: calc(var(--lls) * var(--u));
  font-weight: 600; text-transform: uppercase; text-align: var(--lal);
  color: var(--hero-ink-soft);
}
.hero__title {
  position: absolute;
  left: calc(var(--tref) + var(--tx) * var(--u));
  top: calc(var(--tt) * var(--u));
  width: calc(var(--tw) * var(--u));
  padding-bottom: calc(var(--tpb) * var(--u));
  padding-bottom: round(calc(var(--tpb) * var(--u)), 1px);
  font-family: var(--hero-ff-display); font-weight: 600; letter-spacing: 0; text-align: var(--tal);
  font-size: calc(var(--tfs) * var(--u));
  font-size: round(calc(var(--tfs) * var(--u)), 1px);
  line-height: calc(var(--tlh) * var(--u));
  line-height: round(calc(var(--tlh) * var(--u)), 1px);
  color: var(--hero-ink);
}
.hero__title :is(h1, h2) { font: inherit; letter-spacing: inherit; }

@container hero (max-width: 1023px) {          /* B lygis */
  .hero__slide    { --lx: 35; --ly: 160; --lw: 650; --lfs: 17; --llh: 30; --lls: 2;
                    --tx: 33; --tt: 192.5; --tw: 925; --tfs: 67; --tlh: 79; }
  .hero__slide--3 { --lw: 425; --tx: 30; --tt: 191.5; --tw: 822; --tfs: 58; --tlh: 68; }
  .hero__slide--2 { --tt: 192; --tw: 640; --tfs: 58; --tlh: 68; }
}
@container hero (max-width: 777px) {           /* C lygis */
  .hero__slide    { --lx: 31; --ly: 98; --lw: 560; --lfs: 17; --llh: 25; --lls: 1;
                    --tx: 28; --tt: 129; --tw: 661; --tfs: 48; --tlh: 58; }
  .hero__slide--3 { --lw: 448; --tx: 29; --tt: 127; --tw: 557; --tfs: 42; --tlh: 51; }
  .hero__slide--2 { --tt: 127; --tw: 480; --tfs: 42; --tlh: 51; }
}
@container hero (max-width: 479px) {           /* D lygis: centruotas tekstas */
  .hero__slide    { --lref: 50%; --lx: -229.5; --ly: 90; --lw: 459; --lfs: 13; --llh: 31; --lls: .6; --lal: center;
                    --tref: 50%; --tx: -237; --tt: 125; --tw: 474; --tfs: 40; --tlh: 51; --tal: center; }
  .hero__slide--3 { --lfs: 15; --lls: 1; --tx: -229; --tt: 120; --tfs: 40; --tlh: 51; }
  .hero__slide--2 { --lfs: 15; --lls: 3; --tt: 125; --tfs: 40; --tlh: 51; }
}

/* ---------- 4. bendri valdikliai (rodomi tik kai veikia JS) ---------- */
.hero__ui { display: none; position: absolute; inset: 0; z-index: 100; pointer-events: none; }
.hero.is-ready .hero__ui { display: block; }
.hero__ui :is(button, a) { pointer-events: auto; cursor: pointer; }
.hero :is(button, a):focus-visible { outline: 2px solid var(--hero-accent); outline-offset: 2px; }

/* A lygis: „Ankstesnė / Kita“ stiklo dėžė apačioje kairėje (matoma tik kol žymeklis virš hero) */
.hero__nav {
  position: absolute; left: 0; bottom: 0; width: calc(192 * var(--u)); height: calc(111 * var(--u));
  opacity: 0; transition: opacity .3s;
}
.hero:hover .hero__nav, .hero:focus-within .hero__nav { opacity: 1; }
.hero__navcard { position: absolute; inset: 0; border: 1px solid var(--hero-line); border-width: 1px 1px 0 0; border-top-right-radius: 15px; }
.hero__prev-wrap, .hero__next-wrap { position: absolute; left: 0; width: calc(192 * var(--u)); }
.hero__prev-wrap { bottom: calc(56 * var(--u)); }
.hero__next-wrap { bottom: 0; }
.hero__prev, .hero__next {
  display: block; width: 100%;
  padding: calc(11 * var(--u)) 0;
  padding: round(calc(11 * var(--u)), 1px) 0;
  font-size: calc(16 * var(--u));
  font-size: round(calc(16 * var(--u)), 1px);
  line-height: calc(30 * var(--u));
  line-height: round(calc(30 * var(--u)), 1px);
  letter-spacing: calc(2 * var(--u)); font-weight: 600; text-transform: uppercase; text-align: center;
  color: var(--hero-ink); transition: color .3s var(--hero-ease-hover);
}
.hero__prev { border-bottom: 1px solid var(--hero-line); }
.hero__prev:hover, .hero__next:hover { color: var(--hero-accent); }

/* B–D lygiai: du paprasti tekstiniai mygtukai apačioje kairėje */
.hero__rprev, .hero__rnext { display: none; }
@container hero (max-width: 1023px) {
  .hero__nav { display: none; }
  .hero__rprev, .hero__rnext {
    --pl: 34; --pb: 53;
    display: block; position: absolute;
    left: calc(var(--gl) + var(--pl) * var(--u)); bottom: calc(var(--pb) * var(--u));
    padding: calc(10 * var(--u));
    padding: round(calc(10 * var(--u)), 1px);
    font-size: calc(16 * var(--u));
    font-size: round(calc(16 * var(--u)), 1px);
    line-height: calc(18.29 * var(--u));
    line-height: round(calc(18.29 * var(--u)), 1px);
    letter-spacing: calc(1 * var(--u)); font-weight: 400; text-transform: uppercase; text-align: left; color: var(--hero-ink);
    transition: color .3s var(--hero-ease-hover);
  }
  .hero__rnext { --pl: 166; }
  .hero__rprev:hover, .hero__rnext:hover { color: var(--hero-accent); }
}
@container hero (max-width: 777px) {                     /* C */
  .hero__rprev, .hero__rnext {
    --pb: 56;
    font-size: calc(15 * var(--u));
    font-size: round(calc(15 * var(--u)), 1px);
    line-height: calc(22 * var(--u));
    line-height: round(calc(22 * var(--u)), 1px);
  }
  .hero__rprev { --pl: 31; }
  .hero__rnext { --pl: 154; --pb: 57; }
}
@container hero (max-width: 479px) {                     /* D: vienas po kitu */
  .hero__rprev { --pl: 21; --pb: 79; }
  .hero__rnext { --pl: 41; --pb: 43; }
  .hero__rprev, .hero__rnext {
    line-height: calc(24 * var(--u));
    line-height: round(calc(24 * var(--u)), 1px);
  }
}

/* A lygis: „slinkite, kad naršytumėte“ dėžė apačioje dešinėje (spusteli – sklandžiai nuslenka žemyn) */
.hero__hint { position: absolute; right: 0; bottom: 0; display: none; width: calc(232 * var(--u)); height: calc(132 * var(--u)); color: var(--hero-ink); text-decoration: none; }
.hero__hint-card { position: absolute; inset: 0; border: 1px solid var(--hero-line); border-width: 1px 0 0 1px; border-top-left-radius: 15px; background: var(--hero-hint-fill); }
.hero__hint-bob { position: absolute; left: calc(44 * var(--u)); top: calc(44 * var(--u)); width: calc(39 * var(--u)); height: calc(39 * var(--u)); animation: hero-bob 3s cubic-bezier(.445, .05, .55, .95) infinite alternate; }
.hero__hint-icon { display: block; width: 100%; height: 100%; transition: opacity .3s var(--hero-ease-hover); }
.hero__hint-icon svg { display: block; width: 100%; height: 100%; }
.hero__hint-text {
  position: absolute; left: calc(92 * var(--u)); top: calc(39 * var(--u)); width: calc(140 * var(--u));
  font-size: calc(16 * var(--u));
  font-size: round(calc(16 * var(--u)), 1px);
  line-height: calc(25 * var(--u));
  line-height: round(calc(25 * var(--u)), 1px);
  letter-spacing: calc(2 * var(--u)); font-weight: 500; text-transform: uppercase; transition: color .3s var(--hero-ease-hover);
}
.hero__hint:hover .hero__hint-text { color: var(--hero-ink-hover); }
.hero__hint:hover .hero__hint-icon { opacity: .6; }
@keyframes hero-bob { from { transform: translateY(calc(-5 * var(--u))); } to { transform: translateY(calc(5 * var(--u))); } }   /* rodyklė ±5 px, 3 s kiekvienam keliui */

/* A lygis: taškai kairėje + skaitiklis dešinėje. Jie PRIEŠ drobę (115 / 127 px) – todėl siauresniuose languose (<~1600 px) apkarpomi; tai taip ir turi būti */
.hero__dots, .hero__count { display: none; }
.hero__dots  { position: absolute; left: calc(var(--gl) - 115px); top: calc(50% - 47.5px); width: 15px; height: 53px; }
.hero__dot   { position: absolute; left: 0; top: 0; width: 15px; height: 15px; border-radius: 50%; box-shadow: 0 0 0 2px transparent; transition: box-shadow .3s ease; }
.hero__dots li + li .hero__dot { top: 38px; }
.hero__dot::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--hero-dot-idle); transition: background-color .3s ease, transform .3s ease; }
.hero__dot[aria-current="true"], .hero__dot:hover { box-shadow: 0 0 0 2px var(--hero-accent); }
.hero__dot[aria-current="true"]::before, .hero__dot:hover::before { transform: scale(.4); background: var(--hero-accent); }

.hero__count { position: absolute; right: calc(var(--gl) - 129.5px); bottom: 447px; width: 30px; flex-direction: column; align-items: center; }
.hero__count-cur, .hero__count-all { display: block; font-size: 20px; line-height: 25px; font-weight: 500; white-space: nowrap; text-align: center; }
.hero__count-all { opacity: .5; }
.hero__count-track { position: relative; width: 20px; height: 150px; margin: 15px 0 13px; }   /* 3 skaidrės × 50 px */
.seg-box { position: absolute; left: 0; width: 20px; height: 50px; top: calc(var(--i) * 50px); }
.seg { position: relative; display: block; width: 100%; height: 100%; }
.seg::before { content: ""; position: absolute; left: 9px; top: 0; width: 2px; height: 100%; background: var(--hero-track); transition: background-color .3s var(--hero-ease-hover); }
.seg-box.is-current .seg::before { left: 6px; width: 8px; background: var(--hero-accent); }
.seg-box.is-current .seg:hover::before { background: #fff; }

@container hero (min-width: 1024px) {
  .hero__dots  { display: block; }
  .hero__count { display: flex; }
  .hero__hint  { display: block; }
}

/* ---------- 5. 2 slaido ženklelis: pusapvalis „9 / moduliai vienoje sistemoje“ (etalonas „10/10“ vietoje – be išgalvotų įvertinimų) ---------- */
.hero__badge { position: absolute; inset: 0; pointer-events: none; }
.hero__ring { position: absolute; border: 1px solid var(--hero-line); border-radius: 50%; width: calc(400 * var(--u)); height: calc(400 * var(--u)); left: calc(50% - 200 * var(--u)); bottom: calc(-198 * var(--u)); }
.hero__dot-rim { position: absolute; border-radius: 50%; background: var(--hero-ink); width: calc(13.5 * var(--u)); height: calc(13.5 * var(--u)); left: calc(var(--gl) + 656 * var(--u)); top: calc(844.5 * var(--u)); }
.hero__rule { position: absolute; height: 1px; background: var(--hero-line); width: calc(373 * var(--u)); left: calc(50% - 186.5 * var(--u)); bottom: calc(73 * var(--u)); }
.hero__score {
  position: absolute; left: calc(50% - 200 * var(--u)); width: calc(400 * var(--u)); top: calc(50% + 357.5 * var(--u));
  font-family: var(--hero-ff-text); font-weight: 600; text-align: center; white-space: nowrap; color: var(--hero-ink);
  font-size: calc(70 * var(--u));
  font-size: round(calc(70 * var(--u)), 1px);
  line-height: calc(65 * var(--u));
  line-height: round(calc(65 * var(--u)), 1px);
  padding-bottom: calc(10 * var(--u));
  padding-bottom: round(calc(10 * var(--u)), 1px);
}
.hero__note {
  position: absolute; left: calc(50% - 189 * var(--u)); width: calc(378 * var(--u)); bottom: calc(20 * var(--u));
  font-size: calc(16 * var(--u));
  font-size: round(calc(16 * var(--u)), 1px);
  line-height: calc(30 * var(--u));
  line-height: round(calc(30 * var(--u)), 1px);
  letter-spacing: calc(1.5 * var(--u)); font-weight: 500; text-transform: uppercase; text-align: center; color: var(--hero-ink);
}

@container hero (max-width: 1023px) {            /* B lygis: mažas apskritimas dešinėje */
  .hero__ring { width: calc(200 * var(--u)); height: calc(200 * var(--u)); left: calc(50% + 207 * var(--u)); bottom: calc(-78 * var(--u)); }
  .hero__dot-rim { width: calc(9.9 * var(--u)); height: calc(9.9 * var(--u)); left: calc(var(--gl) + 780.9 * var(--u)); top: calc(648.5 * var(--u)); }
  .hero__rule, .hero__note { display: none; }
  .hero__score {
    left: calc(50% + 158 * var(--u)); width: calc(300 * var(--u)); top: auto; bottom: calc(21 * var(--u));
    font-size: calc(40 * var(--u));
    font-size: round(calc(40 * var(--u)), 1px);
    line-height: calc(50 * var(--u));
    line-height: round(calc(50 * var(--u)), 1px);
  }
}
@container hero (max-width: 777px) {             /* C lygis */
  .hero__ring { left: auto; right: calc(20 * var(--u)); bottom: calc(-74 * var(--u)); }
  .hero__dot-rim { display: none; }
  .hero__score {
    left: auto; right: calc(78 * var(--u)); width: auto; bottom: calc(28 * var(--u)); text-align: right; padding-bottom: 0;
    font-size: calc(45 * var(--u));
    font-size: round(calc(45 * var(--u)), 1px);
    line-height: calc(44 * var(--u));
    line-height: round(calc(44 * var(--u)), 1px);
  }
}
@container hero (max-width: 479px) {             /* D lygis: lieka tik skaičius */
  .hero__ring { display: none; }
  .hero__score {
    right: calc(29 * var(--u)); bottom: calc(21 * var(--u));
    font-size: calc(43 * var(--u));
    font-size: round(calc(43 * var(--u)), 1px);
    line-height: calc(56 * var(--u));
    line-height: round(calc(56 * var(--u)), 1px);
  }
}

/* PDVS: skaičius „9“ be paaiškinimo nieko nereiškia (etalonas ten rodo reitingą „10/10“), todėl žemesniuose lygiuose paliekamas ir užrašas */
@container hero (max-width: 1023px) {
  .hero__note { display: block; left: calc(50% + 158 * var(--u)); width: calc(300 * var(--u)); bottom: calc(80 * var(--u));
    font-size: max(11px, calc(13 * var(--u))); line-height: max(16px, calc(18 * var(--u))); letter-spacing: calc(1.2 * var(--u)); }
}
@container hero (max-width: 777px) {
  .hero__note { left: auto; right: calc(78 * var(--u)); width: calc(240 * var(--u)); bottom: calc(76 * var(--u)); text-align: right; }
}
@container hero (max-width: 479px) {
  .hero__note { right: calc(29 * var(--u)); width: auto; bottom: calc(82 * var(--u)); white-space: nowrap; font-size: 11px; letter-spacing: .8px; }
}

/* ---------- 6. 2 slaido „prisijungimo langas“: tikro PDVS prisijungimo ekrano kopija (viena siaura kortelė: gradiento juosta su ženklu,
   laukai, „Pamiršote slaptažodį?“ atskiroje eilutėje virš žymimojo langelio, mygtukas su piktograma prieš tekstą, apačioje pagalbos eilutė).
   HTML – aštrus visuose dydžiuose; matmenys dizaino pikseliais (em = --lgs × u) ---------- */
.hero__login{
  --lgs:16; --lgx:850; --lgy:225;                       /* A lygis: kortelė 448 px pločio (kaip tikras ekranas – max-width 450) */
  position:absolute;
  left:calc(var(--gl) + var(--lgx) * var(--u));
  top:calc(var(--lgy) * var(--u));
  display:flex;flex-direction:column;
  width:28em;
  font-size:calc(var(--lgs) * var(--u));
  border-radius:.75em;overflow:hidden;background:#fff;color:#1d1e20;
  box-shadow:0 1.1em 3.1em rgba(0,0,0,.4),0 0 0 1px rgba(255,255,255,.08);
  font-family:var(--hero-ff-text);line-height:1.4;pointer-events:none;
}
.lg__head{padding:1.9em 1.5em 1.5em;text-align:center;color:#fff;background:linear-gradient(135deg,#9E2520,#7E1E1A)}
.lg__logo{display:grid;place-items:center;width:5em;height:5em;margin:0 auto 1em;border-radius:50%;background:#fff;box-shadow:0 .3em 1em rgba(0,0,0,.22)}
.lg__logo .emblem{display:block;width:2.5em;height:2.5em;border:.17em solid #9E2520}
.lg__logo .emblem::before{display:none}
.lg__logo .emblem i{width:.95em;height:.95em;margin:-.475em 0 0 -.475em;background:#9E2520}
.lg__word{font:700 1.7em/1.1 var(--hero-ff-display);letter-spacing:.04em}
.lg__tag{margin:.4em 0 0;font-size:.82em;line-height:1.35;opacity:.9}
.lg__form{display:flex;flex-direction:column;gap:.95em;padding:1.6em 1.75em 1.5em;background:#fff}
.lg__lab{display:block;margin-bottom:.35em;font-size:.82em;font-weight:600;color:#2d2d2d}
.lg__inp{display:flex;align-items:center;gap:.65em;height:2.9em;padding:0 .95em;border:1px solid #dfe3e8;border-radius:.5em;background:#f7f8f9;font-size:.86em;color:#8c9097}
.lg__inp svg{width:1.15em;height:1.15em;fill:none;stroke:#9E2520;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.lg__link{align-self:flex-end;font-size:.78em;font-weight:600;color:#9E2520}
.lg__chk{display:inline-flex;align-items:center;gap:.55em;font-size:.82em;color:#5d6269}
.lg__chk i{flex:none;width:1.15em;height:1.15em;border:1px solid #c9cdd2;border-radius:.22em;background:#fff}
.lg__btn{display:flex;align-items:center;justify-content:center;gap:.6em;height:3em;border-radius:.5em;background:linear-gradient(135deg,#9E2520,#8B211C);color:#fff;font-size:.95em;font-weight:600;box-shadow:0 .4em 1em rgba(158,37,32,.35)}
.lg__btn svg{width:1.1em;height:1.1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.lg__help{margin:0;padding:.95em 1em;background:#f3f4f6;font-size:.75em;text-align:center;color:#6c757d}
.lg__help b{color:#9E2520;font-weight:600}

@container hero (max-width: 1023px) { .hero__login{--lgs:11;--lgx:588;--lgy:178} }      /* B: 308 px */
@container hero (max-width: 777px)  { .hero__login{--lgs:8.1;--lgx:488;--lgy:118} }     /* C: 227 px */
@container hero (max-width: 479px)  { .hero__login{display:none} }                      /* D: kortelės telefone nerodome */

/* ---------- 7. pagalbinė ---------- */
.hero__live { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (prefers-reduced-motion: reduce) {
  .hero__hint-bob { animation: none; }
  .hero__nav, .hero__dot, .hero__dot::before, .seg::before { transition-duration: .01s; }
}

/* =====================================================================================================================
   ANTRAŠTĖ · paieška · šoninis skydelis · telefono meniu · „į viršų“
   Išdėstymas ir judesys išmatuoti iš etalono (111 px juosta virš hero, nuslinkus – balta; ≤1024 px – 100 px balta juosta).
   ===================================================================================================================== */
.hdr,.mbar,.mbar-slot,.sp,.dr,.to-top,.oc{
  --c-dark:var(--dark);--c-dark-2:var(--dark-2);--c-soft:var(--brand);--c-ink:var(--ink);--c-body:var(--body);--c-mute:#333;
  --c-line:rgba(255,255,255,.09);--c-field:rgba(255,255,255,.06);--c-edge:#eaeaea;--c-x-hover:#121212;
  --font-ui:var(--f-body);--bar-h:110px;--mbar-h:100px;
  --arrow-short:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8'/></svg>");
}
/* antraštės plotas: skaidriame (tamsiame) režime „šalavijas“ = švelni raudona, baltame – pagrindinė raudona */
.hdr__bar:not(.is-stuck){--c-soft:var(--brand-soft)}
.hdr .ico,.mbar .ico,.to-top .ico,.oc .ico{display:block;fill:currentColor}
.hdr a:focus-visible,.hdr button:focus-visible,.mbar button:focus-visible,.dr a:focus-visible,.dr button:focus-visible,.sp button:focus-visible,.oc a:focus-visible,.oc button:focus-visible{outline:2px solid var(--brand-soft);outline-offset:3px}
/* =====================================================================
   Site header kit - re-implementation of the look/behaviour measured on the reference site.
   Own class names. Plain CSS + vanilla JS. Colours are role tokens (swap the 3 brand tokens).
   ===================================================================== */

/* ---------------------------------------------------------------- desktop header (>=1025px) */
.hdr { display: none; position: absolute; left: 0; right: 0; top: 0; z-index: 9999; color: var(--c-dark); }
.hdr__slot { height: calc(var(--bar-h) + 1px); }          /* keeps its height when the bar turns fixed */
.hdr__bar { position: relative; z-index: 3; border-bottom: 1px solid var(--c-line); background: rgba(255,255,255,.02);
            color: #fff; font: 700 14px/90px var(--font-ui); text-transform: uppercase; }
.hdr__bar.is-stuck { position: fixed; left: 0; right: 0; top: 0; z-index: 10; background: #fff; color: #000;
                     box-shadow: 0 0 20px -1px rgba(0,0,0,.1); animation: hdr-drop .35s; }
@keyframes hdr-drop { from { transform: translateY(-100%); } to { transform: none; } }

.hdr__in { display: flex; align-items: center; justify-content: space-between; height: var(--bar-h); padding: 0 30px; }
.hdr__col { display: flex; width: 20%; }
.hdr__col--c { width: 60%; justify-content: center; height: 90px; }
.hdr__col--r { justify-content: flex-end; align-items: center; height: 90px; }

/* logo: two swappable variants in a 110x110 box */
.hdr__logo { display: flex; align-items: center; height: 110px; }

/* primary menu */
.hdr__menu { display: flex; justify-content: center; height: 90px; }
.hdr__item { position: relative; float: left; padding: 0 24px; line-height: 90px; }
.hdr__item:first-child { padding-left: 0; }
.hdr__link { position: relative; z-index: 9; display: inline; color: #fff; letter-spacing: .7px; white-space: nowrap; }
.hdr__link:hover, .hdr__link:focus-visible, .hdr__item.is-current > .hdr__link { color: var(--c-soft); }
.hdr__link:hover { transition: all .3s ease-in-out; }                       /* hover-in only, hover-out snaps back */
.hdr__bar.is-stuck .hdr__link { color: var(--c-ink); }
.hdr__bar.is-stuck .hdr__link:hover, .hdr__bar.is-stuck .hdr__item.is-current > .hdr__link { color: var(--c-soft); }
.hdr__item--sub > .hdr__link { padding-right: 20px; }
.hdr__caret { position: absolute; right: 1.07px; top: 50%; width: 9.26px; height: 5.02px; margin-top: -3.1px; fill: currentColor; stroke: currentColor; stroke-width: 21; overflow: visible; }

/* drop-down panel */
.hdr__sub { position: absolute; left: 0; top: 125%; z-index: 99; width: 250px; background: #fff;
            border-radius: 0 0 10px 10px; box-shadow: 11px 10px 38px 0 rgba(0,0,0,.1);
            opacity: 0; visibility: hidden; transition: all .25s ease-in-out; }
.hdr__item:hover > .hdr__sub, .hdr__item:focus-within > .hdr__sub { opacity: 1; visibility: visible; top: 100%; }
.hdr__sub li { position: relative; padding: 3px 15px 3px 17px; line-height: 35px; }
.hdr__sub li:first-child { padding-top: 20px; }
.hdr__sub li:last-child { padding-bottom: 20px; }
.hdr__sub a { position: relative; display: block; padding: 0 10px; color: var(--c-ink); font-weight: 700; letter-spacing: 0; transition: all .3s; }
.hdr__sub a::before { content: ""; position: absolute; left: -20px; top: 50%; width: 14px; height: 4px; border-radius: 20px; background: var(--c-soft);
                      opacity: 0; transform: translateY(-50%); transition: all .6s cubic-bezier(.25, 1, .55, 1); }
.hdr__sub a:hover, .hdr__sub a:focus-visible { padding-left: 30px; color: var(--brand); }
.hdr__sub a:hover::before, .hdr__sub a:focus-visible::before { opacity: 1; left: 9px; }

/* right cluster */
.hdr__cta { display: inline-flex; align-items: center; margin-right: 30px; padding: 17px 30px; border-radius: 40px; background: var(--brand); color: #fff;
            font: 700 14px/14px var(--font-ui); letter-spacing: .7px; text-transform: uppercase; }
.hdr__cta:hover { background: var(--dark-2); color: #fff; transition: all .3s ease-in-out; }
.hdr__cta .ico { display: inline-block; width: 14px; height: 14px; margin: 0 .7px 0 4px; vertical-align: -.125em; }
.hdr__search { position: relative; top: -1px; width: 16px; height: 16px; margin-right: 30px; color: #fff; }
.hdr__search .ico { width: 16px; height: 16px; }
.hdr__search:hover { color: var(--c-soft); transition: all .3s ease-in-out; }
.hdr__bar.is-stuck .hdr__search { color: var(--c-ink); }
.hdr__bar.is-stuck .hdr__search:hover { color: var(--c-soft); }

/* 4-span toggle: three bars (42/24/24) + a small arrow that turns to "->" on hover; becomes an X when open */
.hdr__burger { position: relative; display: block; width: 50px; color: #fff; text-align: center; cursor: pointer; }
.hdr__burger span { display: block; width: 42px; margin: 8px 0; border-bottom: 2px solid; border-radius: 50px; transition: all ease .3s; }
.hdr__burger span:nth-child(2), .hdr__burger span:nth-child(3) { width: 24px; margin-left: 18px; }
.hdr__burger span:nth-child(3) { margin-bottom: 0; }
.hdr__burger span:nth-child(4) { position: relative; border: 0; }
.hdr__burger span:nth-child(4)::before { content: ""; position: absolute; left: -8px; top: -27.5px; width: 29px; height: 29px;
            background: var(--c-soft); transform: rotate(-45deg); transition: all .3s;
            -webkit-mask: var(--arrow-short) center / 100% 100% no-repeat; mask: var(--arrow-short) center / 100% 100% no-repeat; }
.hdr__burger:hover { color: var(--c-soft); transition: all .3s ease-in-out; }
.hdr__burger:hover span:nth-child(4)::before { transform: none; top: -28.5px; animation: hdr-blink 1s linear infinite; }
@keyframes hdr-blink { 0% { opacity: 1; } 50% { opacity: .3; } 100% { opacity: 1; } }
.hdr__bar.is-stuck .hdr__burger { color: var(--c-dark-2); transition: all .3s ease-in-out; }
.hdr__bar.is-stuck .hdr__burger:hover { color: var(--c-soft); }
.hdr__burger.is-open span:nth-child(1) { transform: rotate(45deg); margin-bottom: 0; border-radius: 0; width: 22px; }
.hdr__burger.is-open span:nth-child(2) { opacity: 0; }
.hdr__burger.is-open span:nth-child(3) { transform: rotate(-42deg) translateY(-27px); margin-bottom: 0; border-radius: 0; width: 22px; }
.hdr__burger.is-open span:nth-child(4) { transform: rotate(-45deg) translateY(-7px); margin-bottom: 0; }
.hdr__burger.is-open span:nth-child(4)::before, .hdr__burger.is-open:hover span:nth-child(4)::before { opacity: 0; transform: scale(0); transition: all .3s; animation: none; }

/* ---- width steps (exactly as measured) ---- */
@media (min-width: 1025px) { .hdr { display: block; } }
@media (max-width: 1540px) {
  .hdr__cta { display: none; }
  .hdr__item--sub > .hdr__link { padding-right: 14px; }
}
@media (max-width: 1400px) {
  .hdr__link, .hdr__sub a { font-size: 13px; }
  .hdr__item { padding: 0 16px; }
  .hdr__item:first-child { padding-left: 0; }
  .hdr__item--sub > .hdr__link { padding-right: 15px; }
  .hdr__search, .hdr__search .ico { width: 14px; height: 14px; }
  .hdr__search { top: 0; }
}
@media (max-width: 1200px) {
  .hdr__link { font-size: 11px; letter-spacing: .5px; }
  .hdr__sub a { font-size: 12px; }
  .hdr__item { padding: 0 11px; }
  .hdr__item--sub > .hdr__link { padding-right: 13px; }
  .hdr__caret { margin-top: -3px; }
  .hdr__search, .hdr__search .ico { width: 12px; height: 12px; }
}

/* ---------------------------------------------------------------- tablet / mobile bar (<=1024px) */
.mbar-slot { display: none; height: var(--mbar-h); }
.mbar { height: var(--mbar-h); background: #fff; color: var(--c-mute); }
.mbar.is-stuck { position: fixed; left: 0; right: 0; top: 0; z-index: 10; animation: hdr-drop .35s; }
.mbar__in { display: flex; align-items: center; justify-content: space-between; height: var(--mbar-h); padding: 10px 15px; }
.mbar__btn { display: flex; align-items: flex-start; width: 25px; height: 25.875px; color: var(--c-mute); }
.mbar__btn .ico { width: 25px; height: 25px; }
.mbar__logo { display: flex; align-items: center; justify-content: center; height: 80px; }
@media (max-width: 1024px) { .mbar-slot { display: block; } }

/* ---------------------------------------------------------------- slide-down search panel */
.sp { position: fixed; left: 0; right: 0; top: 0; z-index: 999999; height: 50%; background: var(--c-dark-2);
      visibility: hidden; transform: translateY(-100%); transition: all ease .9s; }
.sp.is-open { visibility: visible; transform: none; }
.sp__mark { position: absolute; left: 50%; top: calc(46% + 15px); width: 501px; height: 501px; margin: -251px 0 0 -251px; transform: rotate(-45deg);
            opacity: .1; fill: none; stroke: #fff; stroke-width: 1px; pointer-events: none; }
.sp__mark path { vector-effect: non-scaling-stroke; }
.sp__form { position: absolute; left: 0; right: 0; top: 68%; width: 65%; margin: 0 auto; transform: translateY(-50%); display: flex; }
.sp__label { display: block; flex: 1; min-width: 0; line-height: 1; }
.sp__field { display: block; width: 100%; height: 55px; margin-right: -6px; padding: 1px 2px 1px 23px; border: 1px solid rgba(255,255,255,.34); border-right: 0;
             border-radius: 30px 0 0 30px; background: var(--c-field); color: #fff; font: 400 16px/16px var(--font-ui); outline: 0; }
.sp__field::placeholder { color: #fff; opacity: 1; }
.sp__go { height: 55px; padding: 0 25px; border-radius: 0 30px 30px 0; background: var(--c-soft); color: #fff; font: 600 16px/54px var(--font-ui); text-transform: uppercase; white-space: pre; }
.sp__go:hover { background: rgba(132,166,166,.51); }
.sp__x { position: absolute; top: 50px; right: 50px; width: 32px; height: 32px; border-radius: 50px; background: var(--c-soft); cursor: pointer; }
.sp__x::before, .sp__x::after { content: ""; position: absolute; top: 8px; right: 15px; width: 2px; height: 16px; background: #fff; transition: all ease .4s; }
.sp__x::before { transform: rotate(45deg); }
.sp__x::after { transform: rotate(-45deg); }
.sp__x:hover { background: #fff; transition: all .3s ease-in-out; }
.sp__x:hover::before, .sp__x:hover::after { background: var(--c-x-hover); transform: rotate(90deg); }
@media (max-width: 1024px) { .sp__form { top: 50%; width: 80%; } .sp__x { top: 20px; right: 20px; } }
@media (max-width: 767px)  { .sp__field, .sp__go { height: 45px; padding-left: 17px; font-size: 14px; line-height: 45px; } .sp__go { padding: 0 17px; } }
@media (max-width: 480px)  { .sp__mark { display: none; } }

/* ---------------------------------------------------------------- mobile drawer */
.dr { position: fixed; left: -100%; top: 0; z-index: 999999; width: 100%; height: 100%; padding: 20px 15px; background: #fff; color: #000;
      overflow-y: auto; visibility: hidden; transition: all ease-in-out .5s; }   /* visibility: uzdarytas meniu nepasiekiamas Tab klavisu ir pagalbinems technologijoms */
body.is-drawer .dr { left: 0; visibility: visible; }
body.is-drawer { overflow: hidden; }
.dr > * { margin-bottom: 25px; }
.dr > nav { margin-top: 9px; }
.dr > :last-child { margin-bottom: 0; }
.dr__x { position: absolute; right: 20px; top: 30px; width: 30px; height: 2px; }
.dr__x::before, .dr__x::after { content: ""; display: block; width: 30px; height: 1px; border-bottom: 1px solid #000; }
.dr__x::before { transform: rotate(45deg); }
.dr__x::after { transform: rotate(-45deg); }
.dr__brand { margin-top: 30px; padding: 10px; }
.dr__brand a { display: block; }
.dr__brand .wm { margin: 0 auto; }
.dr__menu { padding-left: 15px; }
.dr__menu li { position: relative; display: block; }
.dr__menu a { display: block; padding: 15px 0; font-size: 16px; font-weight: 600; line-height: 1; color: #000; }
.dr__menu .is-current > a { color: var(--c-soft); }
.dr__form { display: flex; }
.dr__form label { display: block; flex: 1; min-width: 0; line-height: 1; }
.dr__field { display: block; width: 100%; height: 55px; padding: 0 17px; border: 1px solid var(--c-edge); border-radius: 30px 0 0 30px; background: transparent; color: var(--c-body); font: 400 16px/16px var(--font-ui); outline: 0; }
.dr__field::placeholder { color: var(--c-body); opacity: 1; }
.dr__go { height: 55px; padding: 0 19px; border-radius: 0 30px 30px 0; background: var(--c-soft); color: #fff; font: 600 16px/54px var(--font-ui); text-transform: uppercase; }
@media (min-width: 1025px) { .dr { display: none; } }
@media (max-width: 1024px) { .dr { max-width: 500px; } }
@media (max-width: 767px)  { .dr__field, .dr__go { height: 45px; font-size: 14px; line-height: 45px; } }

/* ---------------------------------------------------------------- back to top */
.to-top { position: fixed; right: 50px; bottom: 40px; z-index: 9; display: grid; place-items: center; width: 55px; height: 35px; border-radius: 30px;
          background: var(--c-soft); color: #fff; opacity: 0; visibility: hidden; transition: opacity .8s ease, visibility .8s ease, background-color .8s ease; }
.to-top.is-on { opacity: 1; visibility: visible; }
.to-top .ico { width: 15px; height: 15px; stroke: currentColor; stroke-width: 1.3; }
.to-top::after { content: ""; position: absolute; left: 0; top: 0; width: 55px; height: 35px; border-radius: 30px; background: var(--c-soft); z-index: -2; animation: to-top-ping .7s ease-out infinite forwards; }
.to-top:hover { background: var(--c-dark-2); transition: all .3s ease-in-out; }
.to-top:hover::after { content: none; }
@keyframes to-top-ping { 0% { opacity: 1; } 100% { opacity: 0; transform: scale(1.7); } }

/* ---------------------------------------------------------------- optional off-canvas panel (theme-native, NOT rendered on the reference) */
.oc { position: fixed; inset: 0; z-index: 99999; background: linear-gradient(90deg, var(--c-soft) 0, var(--c-dark-2) 100%); opacity: 0; visibility: hidden;
      transform: translateX(25%); transition: all ease-in-out .35s; }
.oc__in { position: absolute; right: -700px; top: 0; width: 700px; max-width: 100%; height: 100%; padding: 60px 50px 40px; overflow-y: auto; background: #fff;
          transition: all .35s ease-in-out .35s; }
body.is-offcanvas { overflow: hidden; }
body.is-offcanvas .oc { opacity: 1; visibility: visible; transform: none; }
body.is-offcanvas .oc__in { right: 0; box-shadow: 0 0 9px -1px rgba(64,64,64,.6); }
.oc__x { position: absolute; right: 0; top: 23px; width: 50px; }

/* CTA: visada vienoje eilutėje (PDVS užrašas ilgesnis nei „Susisiekite“) */
.hdr__cta{flex:none;white-space:nowrap}
.hdr__col--r{flex:none;width:auto;min-width:20%}

/* ---------- PDVS logotipas (gamybinio ženklo vektorius: „PDVS“ + raudonas taškas) ---------- */
.wm{display:block;width:147px;height:34px;color:#fff;--dot:var(--brand-soft)}
.logo-dot{fill:var(--dot,var(--brand))}
.hdr__bar.is-stuck .hdr__logo .wm{color:var(--ink);--dot:var(--brand)}
.mbar .wm,.dr .wm,.oc .wm{width:118px;height:27px;color:var(--ink);--dot:var(--brand)}
.hdr__logo{margin-left:-2px}

/* išskleidžiamas meniu: ilgesni PDVS pavadinimai (etalonas – 250 px) */
.hdr__sub{width:292px}
.hdr__sub li{padding-right:12px}

/* ---------- šoninis skydelis (keturių juostelių mygtukas) ---------- */
.oc{background:linear-gradient(90deg,var(--brand) 0,var(--dark) 100%)}
.oc__in{display:flex;flex-direction:column;padding:60px 56px 40px;color:var(--body)}
.oc__x{position:absolute;right:24px;top:24px;width:44px;height:44px;border-radius:50%}
.oc__x::before,.oc__x::after{content:"";position:absolute;left:12px;top:21px;width:20px;height:2px;border-radius:2px;background:var(--ink);transition:transform .4s ease,background .3s}
.oc__x::before{transform:rotate(45deg)}
.oc__x::after{transform:rotate(-45deg)}
.oc__x:hover{background:var(--brand)}
.oc__x:hover::before,.oc__x:hover::after{background:#fff;transform:rotate(90deg)}
.oc__brand{display:block;margin-bottom:26px}
.oc__lead{max-width:420px;margin:0 0 34px;font:700 24px/34px var(--f-head);color:var(--ink)}
.oc__links{margin:0 0 34px;border-top:1px solid var(--line)}
.oc__links a{display:flex;align-items:baseline;gap:18px;padding:13px 0;border-bottom:1px solid var(--line);font:600 20px/30px var(--f-head);color:var(--ink);transition:color .3s,padding .3s}
.oc__links a span{font:500 14px/1 var(--f-body);color:var(--brand);min-width:26px}
.oc__links a:hover{color:var(--brand);padding-left:10px}
.oc__cta{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;margin-bottom:38px;padding:17px 32px;border-radius:40px;background:var(--brand);color:#fff;font:700 14px/14px var(--f-body);letter-spacing:.7px;text-transform:uppercase;transition:background .3s ease-in-out}
.oc__cta:hover{background:var(--dark-2)}
.oc__cta .ico{width:14px;height:14px}
.oc__contact{display:grid;gap:14px;margin:0 0 auto}
.oc__contact dt{font:600 12px/18px var(--f-body);letter-spacing:2px;text-transform:uppercase;color:var(--brand)}
.oc__contact dd{margin:0;font:500 17px/26px var(--f-body);color:var(--ink)}
.oc__contact a:hover{color:var(--brand)}
.oc__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px 24px;margin-top:34px;padding-top:20px;border-top:1px solid var(--line)}
.oc__lang{display:flex;border:1px solid var(--line);border-radius:30px;overflow:hidden;font:700 12px/1 var(--f-body);letter-spacing:1px}
.oc__lang a{padding:9px 14px;color:var(--body)}
.oc__lang a[aria-current="true"]{background:var(--ink);color:#fff}
.oc__legal{display:flex;flex-wrap:wrap;gap:4px 18px;font:400 13px/22px var(--f-body)}
.oc__legal a:hover{color:var(--brand)}

/* ---------- paieškos rezultatai (tikra puslapių paieška – PDVS neturi svetainės paieškos, todėl ieškoma šio puslapio sąraše) ---------- */
.sp__form{transition:top .45s ease}
.sp.has-res .sp__form{top:30%}
.sp__res{position:absolute;left:0;right:0;top:calc(30% + 46px);width:65%;max-height:calc(70% - 76px);margin:0 auto;overflow-y:auto;border-radius:18px;background:rgba(255,255,255,.07);scrollbar-width:thin}
.sp__res[hidden]{display:none}
.sp__res a{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:10px 24px;border-bottom:1px solid rgba(255,255,255,.1);color:#fff;font:500 16px/24px var(--f-body);transition:background .25s,color .25s}
.sp__res li:last-child a{border-bottom:0}
.sp__res a small{flex:none;font:600 11px/1 var(--f-body);letter-spacing:1.6px;text-transform:uppercase;color:rgba(255,255,255,.55)}
.sp__res a:hover,.sp__res a:focus-visible,.sp__res a.is-sel{background:var(--brand);outline:0}
.sp__res .sp__none{padding:12px 24px;color:rgba(255,255,255,.7);font:400 15px/24px var(--f-body)}
@media (max-width:1024px){.sp.has-res .sp__form{top:26%}.sp__res{top:calc(26% + 46px);width:80%;max-height:calc(74% - 76px)}}
@media (max-width:767px){.sp__res a{padding:9px 16px;font-size:15px}}
@media (max-width:1024px){.hdr{display:none}}

/* telefono meniu: daugiau nuorodų nei etalonas – slenkamas sąrašas */
.dr__menu a{padding:13px 0}

/* naršyklės „išvalyti“ (×) mygtukas paieškos laukeliuose – savas X jau yra */
.sp__field::-webkit-search-cancel-button,.dr__field::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;display:none}

/* =====================================================================
   cards-about  ·  "3 pasirinkimai" blokas + "Apie mus" sekcija
   Plain CSS, no frameworks. Breakpoints: >=1025 desktop, <=1024 tablet, <=767 mobile.
   Colours are TOKENS (see :root). Map: teal -> PDVS dark, sage -> PDVS red accent.
   ===================================================================== */

/* fonts: load Wix Madefor Display + DM Sans (see fonts/fonts.css) */



/* scoped base: no global side effects (:where keeps specificity at 0) */






/* page wrapper right under the hero: no gap on desktop (hero bottom == block top), 50px gap on tablet/mobile */
.page{display:flow-root}

/* =====================================================================
   1) THREE PICKS  (directly under the hero)
   ===================================================================== */
.picks{border-bottom:1px solid var(--c-line)}
.picks__row{display:flex;margin:0;padding:0;list-style:none}
.pick{flex:1 1 0;min-width:0;display:flex;flex-direction:column;padding:75px 70px 80px;border-right:1px solid var(--c-line)}
.pick__box{position:relative;flex:1 1 auto;padding:0 15px}   /* ištempiama iki eilutės aukščio: 01./02./03., brūkšnys ir mygtukas visose kortelėse viename lygyje */
/* the horizontal rule between number and pill */
.pick__box::before{content:"";position:absolute;left:58px;right:44px;bottom:15px;height:1px;background:var(--c-dark-2)}
.pick__media{display:flex;align-items:flex-start}
.pick__icon{margin-right:20px;display:flow-root}                 /* stays even when empty (card 3) -> title indent of 20px */
.pick__fig{margin:0 0 22px}
.pick__fig img{display:block;width:64px;height:auto}   /* PNG is 64x64; shrinks (max-width:100%) when the column is very narrow */
.pick__body{flex:1 1 0%;min-width:auto}
.pick__title{margin:0 0 16px;font:700 28px/36px var(--f-head);color:var(--c-ink)}
.pick__text{margin:0 0 60px}                   /* 60px reserves the room for the absolutely placed number/pill row */

/* number "01." (absolute, bottom-left) */
.pick__num{position:absolute;left:26px;bottom:8px;font:500 18px/1 var(--f-body);color:var(--c-accent);transition:all .3s}
.pick__box:hover .pick__num{color:var(--c-dark-2)}

/* pill arrow button (absolute, bottom-right); grows leftwards on card hover */
.pick__go{position:absolute;right:15px;bottom:0;display:block;height:34px;padding:0 13px;
  border:1px solid var(--c-dark-2);border-radius:30px;background:var(--c-white);color:var(--c-accent);
  font:400 0/33px var(--f-body);text-align:center;transition:all .3s}
.pick__go-in{position:relative;z-index:2}
.pick__go-ico{float:right;width:30px;height:33px;font-size:30px;line-height:33px;border-radius:30px;transition:all .3s}
.pick__go-ico svg{display:block;width:30px;height:33px;transform:rotate(-45deg);transition:all .3s}
.pick__go-text{opacity:0}                      /* instantly toggled (no transition); the text "grows" with the font-size transition */
.pick:hover .pick__go{font-size:15px;padding:0 8px 0 18px}
.pick:hover .pick__go-text{opacity:1}
.pick__go:hover,.pick__go:focus-visible,.pick__go:focus{background:var(--c-dark-2);color:var(--c-white)}

/* =====================================================================
   2) ABOUT  ·  heading row
   ===================================================================== */
.about-head-wrap{padding:0 15px}
.about-head-inner{max-width:1400px;margin:0 auto;padding-top:140px;display:flow-root}
.about-head{display:flex;gap:20px;margin:0 15px 50px;padding-bottom:35px;border-bottom:1px solid var(--c-line)}
.about-head__title{flex:0 0 60%;display:flow-root}
.about-head__cta{flex:0 0 40%;align-self:center;display:flex;flex-direction:column;align-items:flex-end;padding:0 15px}
.about-head__cta .btn-dark{margin-top:38px}

.eyebrow{display:block;margin:0 0 8px;font:600 16px/1px var(--f-body);letter-spacing:2px;text-transform:uppercase;color:var(--c-accent)}
.about-head h2{font:700 52px/62px var(--f-head);color:var(--c-ink)}

.btn-dark{display:inline-block;position:relative;padding:17px 38px 16px 40px;border-radius:40px;background:var(--c-dark-2);color:var(--c-white);
  font:600 15px/15px var(--f-body);letter-spacing:1px;text-transform:uppercase;text-align:center;transition:all .3s}
.btn-dark:hover,.btn-dark:focus{background:var(--c-accent);color:var(--c-white);transition:all .3s ease-in-out}
.btn-dark__in{position:relative;z-index:2}
.btn-dark__ico{float:right;display:block;margin-left:4px;width:16px;font-size:15px;line-height:15px}
.btn-dark__ico svg{display:inline-block;width:16px;height:15px;vertical-align:-1.875px}

/* =====================================================================
   3) ABOUT  ·  two columns (photo + overlapping rating card | goal + values)
   ===================================================================== */
.about-split-wrap{overflow-x:clip}               /* the faint chart art spills ~30px right of its column; clip it (etalonas shows a horizontal scrollbar at 1025-1366px) */
.about-split{display:flex;max-width:1400px;margin:0 auto;padding-bottom:150px}
.about-split__media{position:relative;flex:0 0 50%;display:flex;flex-direction:column;padding-left:15px}
.about-split__fig{width:100%}
.about-split__img{display:block;width:100%;height:auto;aspect-ratio:900/930;object-fit:cover;border:1px solid var(--c-line);border-radius:10px;filter:brightness(1.08)}
.about-split__side{position:relative;flex:0 1 50%;display:flex;flex-direction:column;gap:20px;padding:60px 15px 0 80px}

/* feature-box "default" (Tikslas / Vertybes) */
.fbox{padding:0 15px}
.fbox__fig{margin:0 0 22px}
.fbox__fig img{display:block}
.fbox__title{margin:0 0 16px;font:700 28px/36px var(--f-head);color:var(--c-ink)}
.fbox__text{margin:0}
.fbox:hover .fbox__fig img{animation:flip-y 3s linear}

.goal-row{display:flex;margin-top:-22px;padding-bottom:77px}
.goal{flex:0 1 70%;min-width:0;display:flow-root}                /* 70% + 49% = 119% -> both shrink proportionally */
.goal-art{flex:0 1 49%;min-width:0;position:relative}
.goal-art__img{position:absolute;left:30px;top:3px;z-index:1;width:100%;height:auto;opacity:.1;pointer-events:none}

.proof-row{display:flex;margin-top:-18px}
.rating-card{position:relative;flex:0 1 65%;min-width:0;margin-left:-170px;display:flex;flex-direction:column;justify-content:space-between;
  padding:32px 31px 31px;border-radius:10px;background:var(--c-dark)}   /* 65% + 60% (.values): wider card, so its longer text still ends near the photo's bottom edge */
.rating{display:flex;margin:0 0 13px;padding:0 0 13px;border-bottom:1px solid rgba(255,255,255,.13)}
.rating__stars{display:flex;flex-wrap:wrap;margin:0 -9px -9px 0}
.rating__star{position:relative;width:20px;height:20px;margin:0 9px 9px 0;color:var(--c-white)}
.rating__star svg{display:block;width:20px;height:20px}
.rating__star-on{position:absolute;inset:0 auto 0 0;z-index:1;width:var(--fill,100%);overflow:hidden;color:var(--c-accent)}   /* --fill = share of the star that is lit (70% for 4.7) */
.rating__star-on svg{width:20px}
.rating-card__body{color:rgba(255,255,255,.92)}
.rating-card__title{margin:0 0 10px;font:700 24px/36px var(--f-head);color:var(--c-white)}
.rating-card__text{margin:0}
.values{flex:0 1 60%;min-width:0;padding-left:60px}

/* =====================================================================
   4) BREAKPOINTS
   ===================================================================== */
@media (max-width:1024px){
  .page{padding-top:50px}
  /* picks: single column */
  .picks{padding-bottom:50px}
  .picks__row{flex-direction:column;padding:0 15px}
  .pick{padding:0;border-right:0;margin-bottom:20px}
  .pick:last-child{margin-bottom:0}
  .pick__box{padding:0 0 32px}
  .pick__title{font-size:26px;margin-bottom:10px}
  .pick__text{margin-bottom:14px}
  .pick__num{left:0}
  .pick__go{right:0}

  /* about head */
  .about-head-wrap{padding:0}
  .about-head-inner{padding-top:50px}
  .about-head{display:block;margin:0 0 40px;padding:0 15px;border-bottom:0}
  .eyebrow{font-size:15px;line-height:15px}
  .about-head h2{font-size:40px;line-height:48px;margin-bottom:27px}
  .about-head__cta{display:block;padding:0}
  .about-head__cta .btn-dark{margin-top:0;padding:15px 30px}

  /* about split: stacked */
  .about-split-wrap{padding:0 15px}
  .about-split{display:block;max-width:none;padding-bottom:45px}
  .about-split__media{display:flex;flex-direction:row;padding:0}
  .about-split__fig{width:902px;max-width:100%}      /* photo is NOT stretched beyond 902px (900px file + 2px border) */
  .about-split__side{display:block;padding:0;margin-top:40px}
  .fbox{padding:0}
  .fbox__fig{margin-bottom:15px}
  .fbox__title{font-size:26px;margin-bottom:12px}
  .goal-row{display:block;margin-top:0;padding-bottom:0}
  .goal .fbox{margin-bottom:25px}
  .goal .fbox__text{margin-bottom:14px}
  .goal-art{display:none}
  .proof-row{display:block;margin-top:0}
  .rating-card{margin:0;padding:28px 30px;justify-content:center}
  .rating{margin-bottom:14px;padding-bottom:20px}
  .rating__stars{margin:0 -6px -6px 0}
  .rating__star{margin:0 6px 6px 0}
  .rating-card__title{font-size:22px;line-height:32px}
  .values{padding:30px 0 0}
}

@media (max-width:767px){
  .picks{padding-bottom:45px}
  .pick__box{padding-bottom:20px}
  .pick__media{display:block}
  .pick__fig{margin-bottom:17px}
  .pick__title{margin-bottom:13px}
  .pick__text{margin-bottom:25px}
  .pick:nth-child(2){margin-bottom:28px}

  .about-head h2{font-size:34px;line-height:44px}
  .about-head__cta .btn-dark{padding:15px 25px 14px 28px}

  .about-split-wrap{padding:0;margin-bottom:50px}
  .about-split{padding-bottom:0}
  .about-split__media{display:block;padding:0 15px}
  .about-split__fig{width:100%}
  .about-split__side{padding:0 15px;margin-top:30px}
  .fbox__fig{margin-bottom:17px}
  .fbox__title{margin-bottom:13px}
  .goal .fbox__text{margin-bottom:25px}
  .rating-card{flex-direction:column;padding:30px 20px 16px}
  .rating{margin-bottom:11px}
  .rating-card__body{margin-bottom:13px}
  .rating__star{width:18px;height:18px}
  .rating__star svg{width:18px;height:18px}
  .rating__star-on svg{width:18px}
}

@keyframes flip-y{from{transform:perspective(1000px) rotateY(0)}to{transform:perspective(1000px) rotateY(360deg)}}
@keyframes rise-in{from{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}
.js .reveal{visibility:hidden}
.js .reveal.is-in{visibility:visible;animation:rise-in 1.25s ease}

@media (prefers-reduced-motion:reduce){
  .pick__go,.pick__go-ico,.pick__go-ico svg,.pick__num,.btn-dark{transition:none}
  .fbox:hover .fbox__fig img{animation:none}
  .js .reveal,.js .reveal.is-in{visibility:visible;animation:none}
}

/* MID SECTIONS (sistema · moduliai · procesas) – iš etalono išmatuotas išdėstymas */
/* ------------------------------------------------------------------ shared: section title (eyebrow + heading) */
.sec-title__eyebrow{
  display:block;margin:0 0 8px;
  font:600 16px/1px var(--f-body);letter-spacing:2px;text-transform:uppercase;color:var(--c-accent);
}                                       /* 1px-tall line box on purpose: the text overflows 10px upwards */
.sec-title__heading{font:700 52px/62px var(--f-head);color:var(--c-ink)}

/* ------------------------------------------------------------------ shared: ghost pill button */
.btn-ghost{
  display:inline-flex;align-items:center;gap:4px;
  padding:17px 38px 16px 40px;border:1px solid var(--c-accent);border-radius:40px;background:transparent;
  color:#fff;font:600 15px/15px var(--f-body);letter-spacing:1px;text-transform:uppercase;
  transition:all .3s;
}
.btn-ghost:hover,.btn-ghost:focus-visible{background:var(--c-accent);border-color:var(--c-accent);transition-timing-function:ease-in-out}

/* ------------------------------------------------------------------ shared: scroll reveal (JS adds .is-in) */
.js .reveal{visibility:hidden}
.js .reveal.is-in{visibility:visible;animation:ms-zoom-in 1.25s both}
.js .reveal[data-reveal="fade-up"].is-in{animation-name:ms-fade-up}
@keyframes ms-zoom-in{from{opacity:0;transform:scale3d(.3,.3,.3)}50%{opacity:1}to{opacity:1;transform:none}}
@keyframes ms-fade-up{from{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.js .reveal,.js .reveal.is-in{visibility:visible;animation:none}}

/* ==========================================================================
   1. SYSTEM BAND
   ========================================================================== */
.sys{background:var(--c-soft)}

.sys__head{max-width:1400px;margin:0 auto;padding-top:130px}
.sys__head-row{display:flex;padding-left:15px}
.sys__title{width:61%;margin-bottom:50px}

.sys__stage{display:flex}
.sys__box{
  position:relative;flex:0 0 75%;padding-top:400px;
  background:url("img/ekranas-patvirtinimai.d22f4847814f.webp") right center/cover no-repeat fixed;        /* parallax picture: fixed on desktop */
}
.sys__box::before{                       /* top-to-bottom wash: transparent accent -> dark */
  content:"";position:absolute;inset:0;
  background:linear-gradient(178deg,rgba(43,19,17,.42) 0%,rgba(43,19,17,.86) 56%,var(--c-dark) 100%);
}
.sys__pillars{position:relative;display:flex;justify-content:space-between;border-top:1px solid var(--c-hairline-on-dark)}
.sys__pillar{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:center;text-align:center}
.sys__pillar:nth-child(3){margin:50px 0}
.sys__pillar h3{font:600 52px/52px var(--f-head);color:var(--c-accent)}

.sys__side{flex:0 0 25%}
.sys__card{
  position:relative;z-index:1;width:100%;
  margin:-151px 0 0 -149px;padding:69px 50px 60px;
  border-radius:15px;background:var(--c-dark);
}
.sys__card::before{                      /* barely visible tiled arrow pattern (4 % white) */
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:url("img/growth-tile.9c86c2d7cbc2.svg") 0 0/50px auto fixed;opacity:.04;
}
.sys__card > *{position:relative}

.sys__play-row{display:flex;width:100%;margin-left:1px;padding-bottom:40px}
.sys__play-wrap{position:relative;z-index:2;margin-left:15px;align-self:flex-start}
.play{
  position:relative;display:flex;align-items:center;justify-content:center;
  width:74px;height:74px;border:1px solid var(--c-accent);border-radius:50%;color:#fff;
  transition:border-color .3s ease-in-out;
}
.play::before{                           /* outer translucent disc, 100px */
  content:"";position:absolute;left:50%;top:50%;z-index:-1;width:100px;height:100px;
  border:1px solid rgba(234,234,234,.6);border-radius:50%;background:rgba(255,255,255,.3);
  opacity:.6;transform:translate(-50%,-50%);
}
.play:hover,.play:focus-visible{border-color:#fff}

.sys__card-title{margin:0 0 30px;font:600 28px/28px var(--f-head);color:#fff}

.meter{margin:0 0 30px;padding-left:80px;font:400 16px/30px var(--f-body)}
.meter:last-child{margin-bottom:0}
.meter__label{display:inline-block;margin-bottom:7px;font:700 14px/30px var(--f-head);letter-spacing:1px;text-transform:uppercase;color:#fff}
.meter__track{position:relative;height:4px;border-radius:2px;background:var(--c-meter-track)}
.meter__fill{display:flex;width:0;height:4px;border-radius:2px;background:var(--c-accent);transition:width 1s ease-in-out}
.meter__badge{
  position:absolute;left:-77px;top:-30px;width:60px;height:41px;border-radius:30px;background:var(--c-accent);
  color:#fff;font:600 11px/41px var(--f-body);text-align:center;
}
.meter.is-in .meter__fill{width:var(--v)}           /* --v (inline style on .meter) = target width; JS adds .is-in when the meter scrolls into view */
html:not(.js) .meter__fill{width:var(--v)}           /* no JS: show the final value */

/* ==========================================================================
   2. CAPABILITIES  (title left, 2 x 3 cards right)
   ========================================================================== */
.cap{padding:140px 15px}
.cap__inner{display:flex;max-width:1400px;margin:0 auto}
.cap__intro{flex:0 0 33.333%;padding:0 40px 0 15px}
.cap__title{padding-top:10px;margin-bottom:30px}
.cap__title .sec-title__eyebrow{margin-bottom:14px}
.cap__title .sec-title__heading{font-size:42px;line-height:50px}

.cap__grid{flex:0 0 66.67%}

.cap-card{display:flex;min-width:0;overflow:hidden;padding:50px 40px 55px;border:0 solid var(--c-line)}

.cap-card__item{position:relative;flex:1 1 auto;min-width:0;padding-bottom:40px;text-align:justify}
.cap-card__media{display:flex;align-items:flex-start}
.cap-card__icon{flex:none;margin-right:25px;color:var(--c-dark-2)}
.cap-card__svg{width:64px;height:64px;margin-bottom:22px}
.cap-card__body{flex:1 1 0;min-width:0}
.cap-card__title{margin:0 0 16px;font:700 28px/36px var(--f-head);color:var(--c-ink)}
.cap-card__text{margin:0 0 41px}

.cap-card__btn{
  position:absolute;left:0;bottom:0;display:flex;align-items:center;height:34px;padding:0 13px;
  border:1px solid var(--c-dark-2);border-radius:30px;background:#fff;color:var(--c-accent);
  font:400 0/33px var(--f-body);transition:all .3s;
}
.cap-card__btn-text{opacity:0}
.cap-card__btn-ico{flex:none;width:30px;height:30px;transform:rotate(-45deg)}
.cap-card:hover .cap-card__btn,.cap-card:focus-within .cap-card__btn{font-size:15px;padding:0 8px 0 18px}
.cap-card:hover .cap-card__btn-text,.cap-card:focus-within .cap-card__btn-text{opacity:1}
.cap-card__btn:hover,.cap-card__btn:focus-visible{background:var(--c-dark-2);color:#fff}

.cap-card__num{                          /* giant outlined numeral, clipped by the card (overflow:hidden) */
  position:absolute;right:-7px;bottom:-100px;
  font:700 150px/150px var(--f-body);color:transparent;-webkit-text-stroke:1px var(--c-accent);
  opacity:.3;transition:all .3s;
}
.cap-card__item:hover .cap-card__num{color:var(--c-dark-2);opacity:1}

/* ==========================================================================
   3. PROCESS  (dark band, staircase of three steps)
   ========================================================================== */
.proc{
  position:relative;padding:140px 15px 100px;
  background:var(--c-dark) url("img/proc-map.8eba5d035452.svg") 447px 119px/500px auto no-repeat;
}
.proc::before{                           /* dotted wave, 17 % */
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.17;
  background:url("img/proc-wave.1bf7a3e8bdbb.svg") left bottom/cover no-repeat;
}
.proc__inner{position:relative;display:flex;max-width:1400px;margin:0 auto}

.proc__intro{flex:0 0 37%;padding:49px 15px 0}
.proc__title{margin:0 -84px 40px 0;padding-top:10px}
.proc__title .sec-title__eyebrow{margin-bottom:14px}
.proc__title .sec-title__heading{color:#fff}

.proc__right{flex:0 0 63%;display:flex;padding:0 15px}
.proc__steps{flex:0 0 80%}

.step{
  position:relative;margin:0 var(--step-mr) 0 0;padding:0 var(--step-pr,0) 40px var(--step-pl);     /* 40px bottom padding (not margin): % offsets of the numeral resolve against it */
  color:var(--c-text-on-dark);text-align:justify;
}
.step:nth-child(1){--step-pl:405px;--step-mr:-195px;--bx:293px;--num-l:33%;--num-t:19%}
.step:nth-child(2){--step-pl:250px;--step-mr:-67px; --bx:139px;--num-l:18%;--num-t:18%}
.step:nth-child(3){--step-pl:94px; --step-mr:-200px;--step-pr:281px;--bx:0px;--num-l:-1%;--num-t:17%}
.step::before{                           /* corner bracket: top + left hairline, 109 x 83 */
  content:"";position:absolute;left:var(--bx);top:83px;width:109px;height:83px;pointer-events:none;
  border-top:1px solid var(--c-bracket);border-left:1px solid var(--c-bracket);
}
.step__media{display:flex}
.step__icon{flex:none;margin-right:25px;color:var(--c-accent);transition:transform .3s ease}
.step__svg{width:64px;height:64px;margin-bottom:22px}
.step:hover .step__icon{transform:rotate3d(15,15,15,360deg)}
.step__body{flex:1 1 0;min-width:0}
.step__title{margin:0 0 16px;font:700 28px/36px var(--f-head);color:#fff;text-align:left}
.step__text{margin:0}
.step__num{position:absolute;top:var(--num-t);left:var(--num-l);font:700 40px/40px var(--f-body);color:#fff;opacity:.1}
.step:hover .step__num{opacity:.6}



/* ==========================================================================
   TABLET  <= 1024px
   ========================================================================== */
@media (max-width:1024px){
  .sec-title__eyebrow{font-size:15px;line-height:1em}
  .sec-title__heading,.cap__title .sec-title__heading{font-size:40px;line-height:48px}

  /* 1. system band */
  .sys__head{padding-top:45px}
  .sys__head-row{padding-left:0}
  .sys__title{width:100%;margin-bottom:30px;padding:0 15px}
  .sys__stage{flex-direction:column}
  .sys__box{flex:none;width:100%;padding-top:250px;background-attachment:scroll}
  .sys__side{flex:none;width:100%}
  .sys__card{margin:0;padding:50px 40px;border-radius:0}
  .sys__card::before{background-attachment:scroll}
  .sys__card-title{margin-bottom:22px}

  /* 2. capabilities */
  .cap{padding:50px 15px}
  .cap__inner{flex-direction:column}
  .cap__intro{flex:none;width:100%;padding:0;margin-bottom:35px}
  .cap__title{padding-top:0;margin-bottom:25px}
  .cap__title .sec-title__eyebrow{margin-bottom:5px}
  .cap__grid{flex:none;width:100%}
  .cap-card{padding:25px 30px 30px}
  .cap-card__item{padding-bottom:0}
  .cap-card__title{margin-bottom:12px;font-size:26px;line-height:32px}
  .cap-card__text{margin-bottom:20px}
  .cap-card__btnwrap{padding-top:3px}     /* the original's inline-block sits 3px low on its 30px line */
  .cap-card__btn{position:relative;left:auto;bottom:auto;display:inline-flex;vertical-align:top}
  .cap-card__num{display:none}           /* font-size 40px + bottom:-100px = fully clipped in the original */

  /* 3. process */
  .proc{padding:50px 15px;background-image:none}
  .proc::before{display:none}
  .proc__inner{flex-direction:column}
  .proc__intro{flex:none;width:100%;padding:0;margin-bottom:30px}
  .proc__title{margin:0 0 25px;padding-top:0}
  .proc__title .sec-title__eyebrow{margin-bottom:14px}
  .btn-ghost{padding:15px 30px 14px}
  .proc__right{flex:none;width:100%;padding:0}
  .proc__steps{flex:none;width:100%}
  .step{margin:0 0 25px;padding:0}
  .step:last-child{margin-bottom:0}
  .step::before,.step__num{display:none}
  .step__title{margin-bottom:12px;font-size:26px;line-height:32px}
}

/* ==========================================================================
   MOBILE  <= 767px
   ========================================================================== */
@media (max-width:767px){
  .sec-title__heading,.cap__title .sec-title__heading{font-size:34px;line-height:44px}

  /* 1. system band */
  .sys__head{padding-top:50px}
  .sys__title{margin-bottom:0}
  .sys__stage{padding:30px 15px 50px}
  .sys__box{padding-top:150px}
  .sys__pillars{flex-direction:column}
  .sys__pillar{flex:none}
  .sys__play-row{margin-left:0;padding-bottom:30px}
  .sys__card-title{margin-bottom:20px;line-height:34px}

  /* 2. capabilities */
  .cap__title{margin-bottom:19px;text-align:center}
  .cap__title .sec-title__eyebrow{margin-bottom:8px}
  .cap-card{flex:none;width:100%}
  .cap-card__media{display:block}
  .cap-card__svg{margin-bottom:17px}
  .cap-card__title{margin-bottom:13px}
  .cap-card__text{margin-bottom:16px}

  /* 3. process */
  .proc__title{margin-bottom:30px}
  .proc__title .sec-title__eyebrow{margin-bottom:8px}
  .btn-ghost{padding:15px 25px 14px 28px}
  .step__media{display:block}
  .step__svg{margin-bottom:17px}
  .step__title{margin-bottom:13px}
}

/* ---- saugaus diapazono pataisos (1025–1299 px ir planšetės) ---- */


/* (1) Process staircase: offsets as % of the steps column instead of px  ->  identical at >= 1440px (column = 681.6px),
       scales down gracefully below (the original pushes step 1 up to 28px past the container edge and clips its text at 1280px). */
@media (min-width:1025px){
  .step:nth-child(1){--step-pl:59.4%;--step-mr:-28.6%;--bx:33.4%}
  .step:nth-child(2){--step-pl:36.7%;--step-mr:-9.8%; --bx:18.57%}
  .step:nth-child(3){--step-pl:13.8%;--step-mr:-29.3%;--step-pr:41.2%;--bx:0%}
}

/* (2) System band: the dark card is 25% wide and gets taller than the 400px box padding allows below ~1300px, so it covers the
       third pillar heading. Use the stacked (tablet) arrangement up to 1299px instead of 1024px. */
@media (min-width:1025px) and (max-width:1299px){
  .sys__head{padding-top:45px}
  .sys__head-row{padding-left:0}
  .sys__title{width:100%;margin-bottom:30px;padding:0 15px}
  .sys__title .sec-title__eyebrow{font-size:15px;line-height:1em}
  .sys__title .sec-title__heading{font-size:40px;line-height:48px}
  .sys__stage{flex-direction:column}
  .sys__box{flex:none;width:100%;padding-top:250px;background-attachment:scroll}
  .sys__side{flex:none;width:100%}
  .sys__card{margin:0;padding:50px 40px;border-radius:0}
  .sys__card::before{background-attachment:scroll}
  .sys__card-title{margin-bottom:22px}
}

/* (3) Pillar headings: never wider than their column (the original lets "centralizacija" spill out of the box at 768-1100px).
       (>= 1300px the 75% box is wide enough for 52px; 1025-1299px is stacked by (2).) */
@media (max-width:1024px){.sys__pillar h3{font-size:min(52px,5.3vw)}}
@media (max-width:767px){.sys__pillar h3{font-size:min(52px,14.2vw)}}


/* =====================================================================================================================
   PDVS pritaikymai: tai, kuo PDVS turinys skiriasi nuo etalonas (be išgalvotų rodiklių – plano pavadinimai, būsenos žetonai,
   vietoj „play“ – PDVS ženklas, vietoj nuotraukų – sistemos ekranai)
   ===================================================================================================================== */

/* 64/90 px linijinės ikonos (Lucide, ISC) – plona linija kaip etalonas piktogramose */
.ico64,.ico90{display:block;fill:none;stroke:currentColor;stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round}
.ico64{width:64px;height:64px}
.ico90{width:90px;height:90px;stroke-width:.85}
.pick__fig svg,.fbox__fig svg{color:var(--c-dark-2)}
.step__svg,.cap-card__svg{flex:none}

/* planų žetonai tamsioje kortelėje (vietoj žvaigždučių) */
.plans{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px;min-height:34px;margin:0 0 13px;padding:0 0 13px;border-bottom:1px solid rgba(255,255,255,.13)}
.plans li{height:29px;padding:0 13px;border:1px solid rgba(255,255,255,.38);border-radius:30px;color:#fff;font:600 11px/27px var(--f-body);letter-spacing:1.2px}
@media (max-width:1024px){.plans{margin-bottom:14px;padding-bottom:20px}}
@media (max-width:767px){.plans{margin-bottom:11px;padding-bottom:16px}}

/* ---------- „Sistema“: PDVS ženklas vietoj „play“ žiedo ---------- */
.emblem{position:relative;display:block;width:74px;height:74px;border:1px solid var(--c-accent);border-radius:50%}
.emblem::before{content:"";position:absolute;left:50%;top:50%;z-index:-1;width:100px;height:100px;border:1px solid rgba(232,147,140,.4);border-radius:50%;background:rgba(158,37,32,.38);transform:translate(-50%,-50%)}
.emblem i{position:absolute;left:50%;top:50%;width:26px;height:26px;margin:-13px 0 0 -13px;border-radius:50%;background:var(--brand-soft)}

/* būsenų žetonai vietoj procentų juostų – kaip sistemos UI */
.meter{padding-left:104px}
.meter__track{background:rgba(255,255,255,.2)}
.meter__badge{left:-101px;top:-27px;width:84px;height:35px;border-radius:30px;font:600 12px/35px var(--f-body);letter-spacing:.2px}
.meter__badge--ok{background:#E1F1E7;color:#2F6D44}
.meter__badge--wait{background:#FEF2C9;color:#765B17}
.js .meter{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.js .meter.is-in{opacity:1;transform:none}
.js .meter:nth-of-type(2){transition-delay:.12s}
.js .meter:nth-of-type(3){transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.js .meter{opacity:1;transform:none;transition:none}}

/* ---------- „Sprendimai“: 2 stulpelių tinklelis (9 moduliai + nuoroda), išoriniai kampai suapvalinti ---------- */
.cap__grid{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--c-line);border-radius:15px;overflow:hidden}
.cap-card{border-right-width:1px;border-bottom-width:1px}
.cap-card:nth-child(2n){border-right-width:0}
.cap-card:nth-last-child(-n+2){border-bottom-width:0}
/* paskutinė kortelė – nuoroda į visus sprendimus */
.cap-card--all{background:var(--brand);border-color:var(--brand)}
.cap-card--all .cap-card__icon,.cap-card--all .cap-card__title{color:#fff}
.cap-card--all .cap-card__text{color:rgba(255,255,255,.9)}
.cap-card--all .cap-card__btn{background:#fff;border-color:#fff;color:var(--brand)}
.cap-card--all .cap-card__btn:hover,.cap-card--all .cap-card__btn:focus-visible{background:var(--dark);border-color:var(--dark);color:#fff}
@media (max-width:767px){
  .cap__grid{grid-template-columns:1fr}
  .cap-card{border-right-width:0}
  .cap-card:nth-last-child(2){border-bottom-width:1px}
}

/* išlygiuotas tekstas (kaip etalonas) – su automatiniu skiemenų kėlimu, kad siauruose stulpeliuose neliktų „upių“; pavadinimai – kairėje */
.cap-card__title{text-align:left}
.cap-card__text,.step p{hyphens:auto;overflow-wrap:break-word}

/* ===== APATINĖS SEKCIJOS: integracijos · principai · naujienos · poraštė (etalonas išmatuotas išdėstymas) ===== */
/* nuorodų / piktogramų taisyklės – tik šiose juostose */
.band a{color:var(--ink-link);text-decoration:none}
.band a:hover,.band a:focus,.foot a:hover,.foot a:focus{color:var(--accent);transition:all .3s ease-in-out}
:where(.band,.foot) svg{fill:currentColor}
:where(.band,.foot) :is(h2,h3,h4,p,ul,pre){margin:0}
:where(.band,.foot) ul{padding:0;list-style:none}

/* ---------- full-bleed band + inner container -------------------------------- */
.band{position:relative;display:flex;flex-direction:column;padding:0 15px}
.band__in{position:relative;display:flex;flex-direction:column;width:100%;max-width:1400px;margin-left:auto;margin-right:auto}

/* ---------- section title block (eyebrow + h2) ------------------------------- */
.head{display:flex;flex-wrap:nowrap;column-gap:20px;row-gap:20px;width:100%;margin:0 15px 40px;padding-bottom:40px;border-bottom:1px solid var(--line)}
.head__text{flex:0 0 59%;width:59%}
.lw-eyebrow{margin:0 0 14px;font:600 16px/1px var(--f-body);letter-spacing:2px;text-transform:uppercase;color:var(--accent)}
.title{font:700 52px/62px var(--f-head);color:var(--ink);font-kerning:none;font-variant-ligatures:none}  /* the source splits section titles into per-letter inline-blocks (SplitType) = no kerning */

/* ========================================================================== 1. LOGO CAROUSEL */
.band--logos .band__in{padding:140px 0 150px}
.logos{width:50%;margin:0 auto}
.logos__view{overflow:hidden}
.logos__track{--i:0;display:flex;align-items:center;transform:translate3d(calc(-1 * var(--i) * (100% + var(--logo-gap)) / var(--logos-per-view)),0,0)}
.logos__slide{flex:0 0 auto;width:calc((100% - (var(--logos-per-view) - 1) * var(--logo-gap)) / var(--logos-per-view));margin-right:var(--logo-gap);text-align:center}
.logos__slide img{display:block;width:100%;height:auto}

/* ========================================================================== 2. TESTIMONIALS BAND */
.band--quotes{--glow:rgba(232,147,140,.2);background:var(--dark);overflow:hidden}
/* soft light glow, top right: a rotated ellipse with a linear radial falloff (the original is a blurred PNG whose left edge sits at x=1138px, opacity .37).
   --glow = tint at the centre; the numbers were fitted to the reference (mean error ~1/255). */
.band--quotes::before{content:"";position:absolute;left:1624px;top:246px;width:1141px;height:492px;margin:-246px 0 0 -570px;transform:rotate(-62deg);background:radial-gradient(closest-side,var(--glow),rgba(232,147,140,0));pointer-events:none}
.quotes{flex-direction:row;gap:10px;align-items:stretch;padding:140px 0}

.quotes__aside{min-width:0;flex:0 1 30%;display:flex;flex-direction:column;gap:20px;padding-left:15px}
.quotes__photo{display:block;width:100%;max-width:369px;margin:0 auto}
.quotes__card{position:relative;display:flex;flex-direction:column;margin-top:-268px}
/* fade that melts the lower part of the photo into the band colour (starts 91px above the card) */
.quotes__card::after{content:"";position:absolute;top:-91px;right:0;bottom:0;left:0;z-index:0;background:linear-gradient(to bottom,rgba(0,0,0,0) 0%,var(--dark-fade) 58%)}
.quotes__rating,.quotes__lead{position:relative;z-index:1}
.quotes__rating{display:flex;justify-content:space-around;align-items:center;gap:60px;margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--accent)}
.stars{display:flex;gap:8px;width:127px}
.star{position:relative;display:block;width:19px;height:19px;color:#fff}
.star svg{display:block;width:19px;height:19px}
.star__on{position:absolute;top:0;left:0;bottom:0;right:0;overflow:hidden;color:var(--accent)}
.star--part .star__on{right:30%}
.quotes__lead h3{margin:0 0 18px;font:700 28px/38px var(--f-head);color:#fff}
.quotes__lead p{font:400 18px/30px var(--f-body);color:var(--on-dark-soft)}

.quotes__main{min-width:0;flex:0 1 70%;display:flex;flex-direction:column;margin-left:35px;padding:0 15px 0 60px;border-left:1px solid var(--on-dark-line)}
.head--dark{margin:0 0 40px;border-bottom-color:var(--on-dark-line)}
.head--dark .title{color:#fff}
.head__text--70{flex-basis:70%;width:70%}
.quotes__row{position:relative;display:flex;flex-wrap:nowrap;column-gap:20px;row-gap:20px}
/* big outlined quotation-mark watermark, bottom right of the text column (hidden <=1024). Two "9"-shaped outlines, 5px stroke, 159px wide, 18% opacity */
.quotes__row::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 234 140' fill='none' stroke='%23fff' stroke-width='5' stroke-linejoin='round'%3E%3Cpath d='M58.5 112.8A55 55 0 1 1 112 62C112 100 88 126 50 137.5L58.5 112.8Z'/%3E%3Cpath transform='translate(119)' d='M58.5 112.8A55 55 0 1 1 112 62C112 100 88 126 50 137.5L58.5 112.8Z'/%3E%3C/svg%3E") 100% 137px/159px auto no-repeat;opacity:.18;pointer-events:none}
.slider{min-width:0;position:relative;flex:0 0 80%;width:80%;color:#fff}
.slider__view{overflow:hidden}
.slider__track{display:flex}
.quote{flex:0 0 100%;min-width:0;display:flow-root;text-align:center}
.quote p{margin-bottom:16px}
.quote__by{display:block;margin:0 0 22.4px;padding:22.4px;background:var(--pre-bg);color:var(--pre-ink);font:400 14px/30px SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;text-align:center;overflow:auto}

/* ========================================================================== 3. NEWS */
.band--news .band__in{padding:140px 0 90px}
.news-head{display:flex;padding-bottom:30px}
.news-head::before,.news-head::after{content:"";flex:0 1 50%}
.news-head__mid{min-width:0;flex:0 1 100%;padding:0 15px;text-align:center}
.news__grid{display:flex;flex-wrap:wrap;margin:0 -12px}
.news{margin-top:15px;padding:0 15px 32px}
.news__col{position:relative;flex:0 0 50%;max-width:50%;padding:0 15px}

/* featured post */
.feature{padding-right:40px;margin-right:10px;border-right:1px solid var(--line)}
.feature__fig{position:relative;margin-bottom:30px}
.feature__media{position:relative;display:block;overflow:hidden;border-radius:15px}
.feature__media img{display:block;width:100%}
/* dark teal glow in the bottom-left corner of the picture (centre = bottom-left corner, radii = full width/height) */
.feature__media::before{content:"";position:absolute;top:0;right:10px;width:200%;height:200%;border-radius:inherit;pointer-events:none;background:radial-gradient(50% 50% at 50% 50%,var(--slate) 0%,rgba(255,255,255,0) 100%)}
.feature .pill{position:absolute;left:31px;bottom:33px}
.feature__title{padding-right:30px}
.feature__title a{display:block;font:600 38px/46px var(--f-head);color:var(--ink-link)}
.feature__title a:hover,.feature__title a:focus{color:var(--accent)}
.feature .meta{padding-right:30px}

/* shared meta line (category / author / date) */
.meta{margin:0 0 12px;font:500 14px/14px var(--f-body);letter-spacing:.5px;text-transform:uppercase;color:var(--body)}
.meta__list{display:inline-block}
.meta li{display:inline-block;vertical-align:middle}
.meta li:first-child{margin-right:15px}
.meta a{position:relative;padding-left:15px;color:var(--body);white-space:nowrap}
.meta a:hover,.meta a:focus{color:var(--accent)}
.meta a::before{content:"";position:absolute;left:0;top:50%;width:8px;height:8px;border-radius:50px;background:var(--accent);transform:translateY(-50%)}
.meta a.meta__cat{margin:0 -2px;font-size:15px}
.meta a.meta__author{padding-left:0}
.meta a.meta__author::before{content:none}
.meta__author span{display:inline-block;vertical-align:middle}
.meta__ava img{display:block;width:20px;height:20px;border-radius:50%}
.meta__name{margin-left:7px}

/* arrow pills */
.pill{position:relative;display:inline-block;width:60px;height:34px;padding:0 14px;border:1px solid;border-radius:30px;background:transparent;line-height:32px;text-align:center;transition:all .3s}
.pill svg{display:block;width:30px;height:30px;margin-top:1px;transform:rotate(-45deg)}
.pill--light{color:#fff;border-color:#fff}
.pill--light:hover,.pill--light:focus{color:#fff;background:var(--accent);border-color:var(--accent)}
.pill--row{color:var(--accent);border-color:var(--slate)}
.pill--row:hover,.pill--row:focus{color:#fff;background:var(--slate)}

/* three stacked rows on the right */
.row{position:relative;display:flex;align-items:center;padding-right:140px;margin-bottom:60px}
.row:last-child{margin-bottom:0}
.row::before{content:"";position:absolute;left:0;right:0;bottom:-30px;height:1px;background:var(--line)}
.row::after{content:"";position:absolute;left:0;bottom:-30px;width:0;height:1px;background:var(--accent);opacity:0;transition:all .3s}
.row:hover::after{width:100%;opacity:1}
.row:last-child::before,.row:last-child::after{content:none}
.row__thumb{display:block;flex:0 1 auto;width:37%;position:relative}
.row__thumb img{display:block;width:100%;border-radius:10px}
.row__body{flex:1 1 0%;margin-left:30px}
.row__title{margin:0}
.row__title a{display:block;font:600 24px/34px var(--f-head);color:var(--ink-link)}
.row__title a:hover,.row__title a:focus{color:var(--accent)}
.row__more{position:absolute;right:0;top:50%;transform:translateY(-50%);height:83px;padding:20px 0 0 40px;border-left:1px solid var(--line)}
.row__more .pill{display:block}

/* ========================================================================== 4. FOOTER */
.foot{color:var(--foot-text);font:400 16px/30px var(--f-body)}
.foot a{color:var(--foot-text)}
.foot__main{position:relative;overflow:hidden;padding:110px 0 120px;background:var(--dark);border-bottom:1px solid var(--foot-line)}
.foot__in{width:100%;max-width:1400px;margin:0 auto;padding:0 15px}
.fcols{position:relative;display:flex}
/* vertical divider (>=1401: between the contact block and the link columns) */
.fcols::before{content:"";position:absolute;top:-200px;bottom:-200px;left:547px;width:1px;background:var(--foot-divider)}
.fcol{flex:0 1 auto}
.fcol--contact{flex-basis:40%}
.fcol--links{flex-basis:22%;padding-left:74px}
.fcol--more{flex-basis:16%;padding-left:22px}
.fcol--mail{flex-basis:22%}
/* giant outlined arrow watermark, cropped by the footer (hidden <=1024) */
.foot__mark{position:absolute;left:-371px;top:-138px;width:690px;height:690px;fill:none;stroke:var(--foot-line);stroke-width:.0232;transform:rotate(-45deg);pointer-events:none}
.contact{position:relative;display:flex;align-items:center;padding:16px 0 0 148px}
.contact__text{position:relative;z-index:2;flex:0 1 auto}
.contact__item{padding-bottom:33px;margin-bottom:29px;border-bottom:1px solid var(--foot-divider)}
.contact__item:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}
.contact__label{margin:0 0 3px;font:600 15px/30px var(--f-body);letter-spacing:.5px;text-transform:uppercase;color:var(--accent)}
.contact__phone{margin:0;font:700 28px/36px var(--f-head);color:#fff}
.foot .contact__phone a{font-size:30px;color:#fff}
.foot .contact__phone a:hover,.foot .contact__phone a:focus{color:var(--accent)}
.foot .contact__addr{display:inline-block;padding-right:30px;font:500 19px/30px var(--f-body);letter-spacing:-.2px;color:#fff}
.foot .contact__addr:hover,.foot .contact__addr:focus{color:var(--accent)}

.ftitle{position:relative;display:inline-block;margin:0 0 20px;padding-left:33px;font:600 24px/32px var(--f-head);color:#fff}
.ftitle::before{content:"";position:absolute;left:1px;top:50%;width:21px;height:9px;border-radius:30px;background:var(--accent);transform:translateY(-50%)}
.flinks li{padding-bottom:13px}
.flinks li:last-child{padding-bottom:0}
.foot .flinks a{line-height:23px;color:var(--foot-text)}
.foot .flinks a:hover,.foot .flinks a:focus{color:#fff}
.flinks svg{display:inline-block;width:13px;height:13px;margin-right:9px;color:var(--accent);vertical-align:-1px}
.foot .fmail{font:500 20px/30px var(--f-body);color:#fff}
.foot .fmail:hover,.foot .fmail:focus{color:var(--accent)}
.fmail svg{display:inline-block;width:20px;height:20px;margin-right:8px;color:var(--accent);vertical-align:-3px}

.foot__bar{padding:25px 0;background:var(--dark)}
.foot__in--bar{display:flex;justify-content:space-between;align-items:center}
.copy{color:var(--foot-text);text-align:center}
.foot .copy a{color:var(--accent)}
.foot .copy a:hover,.foot .copy a:focus{color:#fff}

/* ========================================================================== RESPONSIVE */
@media (max-width:1400px){
  .foot__main{padding:80px 0 90px}
  .foot__in{max-width:1200px}
  .fcols::before{content:none}
  .fcol--contact{position:relative}
  .fcol--contact::before{content:"";position:absolute;top:-200px;bottom:-200px;right:0;width:1px;background:var(--foot-divider)}
  .fcol--links{padding-left:40px}
  .foot__mark{left:-356px}
}

@media (max-width:1024px){
  /* title blocks */
  .lw-eyebrow{font-size:15px;line-height:15px}
  .title{font-size:40px;line-height:48px}
  .head{margin:0;padding-bottom:27px;border-bottom:0}
  .head--dark{border-bottom:1px solid var(--on-dark-line)}
  .head__text{flex-basis:100%;width:100%}

  /* logos */
  .band--logos .band__in{padding:50px 0 37px}

  /* testimonials */
  .band--quotes{--glow:rgba(232,147,140,.11);padding:0 40px}
  .band--quotes::before{left:64vw;top:32.4vw;width:150vw;height:64.8vw;margin:-32.4vw 0 0 -75vw}
  .quotes{flex-direction:column;gap:0;padding:50px 0}
  .quotes__aside{flex:0 0 auto;gap:0;margin-bottom:40px;padding-left:0}
  .quotes__photo{max-width:300px;margin-bottom:20px}
  .quotes__card{margin-top:0}
  .quotes__rating{justify-content:center}
  .quotes__lead{text-align:center}
  .quotes__lead h3{margin-bottom:15px}
  .quotes__main{flex:0 0 auto;margin:0;padding:0;border-left:0}
  .head--dark{flex-direction:column;gap:0;margin-bottom:25px;padding-bottom:33px;text-align:center}
  .head--dark .head__text{flex-basis:auto;width:100%}
  .quotes__row::before{content:none}
  .slider{flex-basis:100%;width:100%}

  /* news */
  .band--news{padding-left:0;padding-right:0}
  .band--news .band__in{padding:50px 0 0}
  .news-head{display:block;padding:0 15px}
  .news-head::before,.news-head::after{content:none}
  .news-head__mid{padding:0 0 30px}
  .news{margin-top:0;padding-bottom:0}
  .news__col{flex:0 0 100%;max-width:100%}
  .feature{padding-right:0;margin-right:0;border-right:0}
  .feature__fig{margin-bottom:28px}
  .feature .pill{bottom:35px}
  .feature .meta{padding-right:0;margin-bottom:7px}
  .feature__title{padding-right:0;margin-bottom:31px}
  .feature__title a{font-size:32px;line-height:39px}
  .row{padding-right:0}
  .row__title a{font-size:21px;line-height:32px}
  .row .meta{margin-bottom:9px}

  /* footer */
  .foot__main{padding:50px 0}
  .fcols{display:block}
  .fcol{margin-bottom:20px}
  .fcol--mail{margin-bottom:0}
  .fcol--contact::before{content:none}
  .fcol--links,.fcol--more{padding-left:0}
  .foot__mark{display:none}
  .contact{display:block;padding:12px 0 0}
  .contact__item{padding-bottom:17px;margin-bottom:0;border-bottom:0}
  .foot .contact__phone a{font-size:24px}
  .foot .contact__addr{padding-right:0;font-size:16px}
  .flinks li{padding-bottom:7px}
  .foot__in--bar{display:block;text-align:center}
  .copy{display:inline-block;margin-bottom:13px}
}

@media (max-width:991px){
  .row{margin-bottom:24px}
  .row::before{content:none}
  .row__more{position:relative;right:auto;top:auto;transform:none;height:64px;margin-bottom:5px;padding:21px 0 0;border-left:0}
  .copy{margin-bottom:0}
}

@media (max-width:767px){
  .lw-eyebrow{margin-bottom:8px}
  .title{font-size:34px;line-height:44px}
  .head{flex-wrap:wrap;padding-bottom:60px;text-align:center}
  .head__text{padding-bottom:13px}

  .band--logos .band__in{padding:50px 0}

  .band--quotes{padding:0 15px}
  .quotes{padding:50px 0 30px}
  .quotes__photo{max-width:100%;margin-bottom:0}
  .quotes__card{margin-top:25px}
  .quotes__rating{flex-direction:column;gap:11px;padding-bottom:28px}
  .stars{width:112px}
  .star,.star svg{width:16px;height:16px}
  .head--dark{margin-bottom:31px;padding-bottom:33px}
  .head--dark .head__text{padding-bottom:0}
  .quotes__row{flex-wrap:wrap;padding-bottom:20px}

  .band--news{margin-bottom:-20px}
  .news-head{padding:0}
  .news-head__mid{padding-bottom:25px}
  .feature__title{margin-bottom:25px}
  .row .meta{margin-bottom:5px}
  .row__more{margin-bottom:0}
}

@media (max-width:520px){
  .row{display:block;margin-bottom:15px}
  .row__body{margin:20px 0 0}
  .row__thumb{width:100%}
  .row__more{height:60px;padding-top:17px}
}

@media (max-width:420px){
  .row{padding-bottom:20px}
  .row__thumb{margin-bottom:30px}
}

@media (prefers-reduced-motion:reduce){
  .logos__track,.slider__track{transition:none !important}
}


/* ---------- apatinės sekcijos · PDVS pritaikymai ---------- */

/* integracijos: žodiniai ženklai vietoj trečiųjų šalių logotipų (jų PDVS neturi); eilutės aukštis = slaido plotis kaip etalonas kvadratiniam logotipui */
.logos__slide{aspect-ratio:1/1;display:grid;place-items:center}
.wmk{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:100%;height:100%;padding:0 10px;border:1px solid var(--line);border-radius:15px;background:var(--soft);text-align:center;color:var(--ink);transition:border-color .3s,background .3s,transform .3s}
.logos__slide:hover .wmk{border-color:var(--brand);background:#fff}
.wmk b{font:700 clamp(15px,1.5vw,24px)/1.18 var(--f-head);letter-spacing:-.2px}
.wmk small{font:600 11px/1.3 var(--f-body);letter-spacing:1.6px;text-transform:uppercase;color:#5d656c}
.wmk--you b{color:var(--brand)}
.band--logos .band__in{padding-bottom:104px}
.logos__note{max-width:700px;margin:26px auto 0;text-align:center;font:400 13px/22px var(--f-body);color:#5d656c}
@media (max-width:1024px){.band--logos .band__in{padding-bottom:30px}}
@media (max-width:767px){.band--logos .band__in{padding-bottom:36px}}

/* PDVS emblema (žiedas + taškas – kaip svetainės piktograma) */
.emblem--sm{width:30px;height:30px}
.emblem--sm::before{display:none}
.emblem--sm i{width:10px;height:10px;margin:-5px 0 0 -5px}
.emblem--xs{display:inline-block;width:20px;height:20px;border:1.5px solid var(--brand);border-radius:50%;vertical-align:middle;position:relative}
.emblem--xs::before{display:none}
.emblem--xs i{position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:var(--brand)}

/* „Principai“ juosta */
.quotes__photo{border-radius:14px 14px 0 0;-webkit-mask-image:linear-gradient(to bottom,#000 38%,transparent 96%);mask-image:linear-gradient(to bottom,#000 38%,transparent 96%)}
.quotes__card{margin-top:-130px}
.quotes__card::after{top:-120px;background:linear-gradient(to bottom,rgba(0,0,0,0) 0%,var(--dark-fade) 64%)}
@media (max-width:1024px){.quotes__card{margin-top:0}}
@media (max-width:767px){.quotes__card{margin-top:25px}}
.quotes__badge{display:inline-flex;align-items:center;gap:12px;color:#fff;font:600 14px/1 var(--f-body);letter-spacing:2px;text-transform:uppercase}
.quotes__badge .emblem{flex:none}
.quote__by{font-family:var(--f-body);font-weight:600;font-size:13px;letter-spacing:2px;text-transform:uppercase;color:var(--ink)}
.quote p{hyphens:auto}

/* naujienos */
.news__cap{margin:0 0 30px;padding-left:15px;font:600 14px/1 var(--f-body);letter-spacing:2px;text-transform:uppercase;color:var(--accent)}
.row__thumb img{aspect-ratio:195/137;object-fit:cover;height:auto}
.feature__media img{aspect-ratio:616/430;object-fit:cover;object-position:0 0}
.meta__ava{display:inline-flex;align-items:center;vertical-align:middle}
.meta__ava .emblem{margin-top:-1px}
@media (max-width:1024px){.news__cap{padding-left:0;margin-top:34px;margin-bottom:24px}}

/* poraštė: nuorodos jau tamsios; paskutinė nuoroda (maketų sąrašas) */
.foot__bar .copy a{margin-left:14px;white-space:nowrap;text-decoration:underline;text-underline-offset:3px}
.fcols .fcol--links .flinks li,.fcols .fcol--more .flinks li{padding-bottom:9px}
@media (min-width:1025px){.fcol--mail{padding-left:10px}}   /* tik šalia kitų stulpelių; sustumtame telefono išdėstyme – be įtraukos */

/* antraštės: be „našlaičių“ eilutėje */
.title,.sec-title__heading,.about-head h2,.cap-card__title,.pick__title,.step__title{text-wrap:balance}


/* =====================================================================================================================
   PDVS · pradžios puslapis – svetainės papildymai prie home.css (maketo CSS lieka nepaliestas).
   Čia – tai, ko maketas neturėjo, bet veikianti svetainė reikalauja:
     1. kalbos jungiklis (partials/_lang_switch.html → .lang) antraštėje, telefono meniu ir šoniniame skydelyje
     2. prisijungusio kliento žymė telefono meniu / šoniniame skydelyje (vietoj senos .pbar juostos)
     3. slapukų juosta (ją sukuria pdvs.js: .ck, .ck-box, .btn …) – naujo dizaino spalvomis
     4. demonstracijos užklausos sekcija ir forma (#demoForm – siunčia pdvs.js į /api/demo/)
     5. naujienų sekcijos papildymai (įrašai iš duomenų bazės, ne nuorodos-kabliukai)
     6. poraštės / integracijų pastabos smulkmenos
   Spalvos – tos pačios žetonai iš home.css (:root --brand, --dark, --ink …); raudoną keičiate vienoje vietoje.
   ===================================================================================================================== */

/* ---------- 1. kalbos jungiklis ---------- */
.lang{display:inline-flex;align-items:center;gap:2px}
.lang button{padding:6px 7px;border-radius:30px;font:700 12px/1 var(--f-body);letter-spacing:1px;color:inherit;opacity:.72;cursor:pointer;transition:opacity .2s,background .2s,color .2s}
.lang button:hover{opacity:1}
.lang button[aria-pressed="true"]{opacity:1;cursor:default}
/* antraštė: skaidri – balta, nuslinkus – tamsi */
.hdr .lang{margin-right:26px;color:#fff}
.hdr .lang button[aria-pressed="true"]{border-radius:0;box-shadow:inset 0 -2px 0 var(--brand-soft)}
.hdr__bar.is-stuck .lang{color:var(--ink)}
.hdr__bar.is-stuck .lang button[aria-pressed="true"]{box-shadow:inset 0 -2px 0 var(--brand)}
@media (max-width:1400px){.hdr .lang{margin-right:20px}}
@media (max-width:1200px){.hdr .lang{margin-right:16px}.hdr .lang button{padding:6px 5px;font-size:11px}}
/* telefono meniu */
.dr__lang{padding:4px 0 16px}
.dr .lang{border:1px solid var(--line);border-radius:30px;overflow:hidden;color:var(--body)}
.dr .lang button{padding:9px 16px;border-radius:0;opacity:1}
.dr .lang button[aria-pressed="true"]{background:var(--ink);color:#fff}
/* šoninis skydelis */
.oc .lang{border:1px solid var(--line);border-radius:30px;overflow:hidden;color:var(--body)}
.oc .lang button{padding:9px 14px;border-radius:0;opacity:1}
.oc .lang button[aria-pressed="true"]{background:var(--ink);color:#fff}

/* ---------- 2. prisijungęs klientas (anksčiau – .pbar juosta tarp antraštės ir turinio) ---------- */
.dr__acct,.oc__acct{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin:0 0 20px;padding:14px 16px;border-radius:14px;background:var(--soft);font:400 13px/20px var(--f-body);color:var(--body)}
.dr__acct b,.oc__acct b{font-weight:600;color:var(--ink);word-break:break-all}
.dr__acct a,.oc__acct a,.dr__acct button,.oc__acct button{font:600 13px/20px var(--f-body);color:var(--brand);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.dr__acct a:hover,.oc__acct a:hover,.dr__acct button:hover,.oc__acct button:hover{color:var(--brand-hover)}
.dr__acct form,.oc__acct form{display:inline}

/* ---------- 3. slapukų juosta (žymėjimą kuria pdvs.js) ---------- */
.ck{position:fixed;left:0;right:0;bottom:0;z-index:2147483000;padding:0 16px max(16px,env(safe-area-inset-bottom));pointer-events:none}
.ck[hidden]{display:none}
.ck:focus,.ck:focus-visible{outline:0}   /* pdvs.js fokusuoja visa juosta - be sios taisykles per ekrana eitu raudona linija */
.ck-box{display:flex;flex-direction:column;gap:12px;max-width:560px;margin:0;padding:24px 26px;border-radius:14px;background:#fff;color:var(--body);box-shadow:0 24px 60px -20px rgba(43,19,17,.5),0 0 0 1px var(--line);font:400 15px/24px var(--f-body);pointer-events:auto;animation:ck-in .45s cubic-bezier(.2,.7,.2,1) both}
@keyframes ck-in{from{opacity:0;transform:translateY(14px)}}
.ck-box .eyebrow{margin:0;font:600 12px/1 var(--f-body);letter-spacing:2px;text-transform:uppercase;color:var(--brand)}
.ck-box h3{margin:0;font:700 20px/28px var(--f-head);color:var(--ink)}
.ck-box .txt{margin:0;font-size:14px;line-height:22px;color:var(--body)}
.ck-opts{display:flex;flex-wrap:wrap;gap:10px 22px;padding:4px 0}
.ck-opt{display:flex;align-items:flex-start;gap:10px;cursor:pointer;font-size:14px}
.ck-opt input{flex:none;margin:4px 0 0;accent-color:var(--brand)}
.ck-opt span{display:flex;flex-direction:column;gap:2px}
.ck-opt b{font-weight:600;color:var(--ink)}
.ck-opt small{font-size:12px;line-height:18px;color:var(--body)}
.ck-btns{display:flex;flex-wrap:wrap;gap:8px}
.ck .btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 20px;border:1px solid var(--ink);border-radius:40px;background:transparent;color:var(--ink);font:700 13px/1 var(--f-body);letter-spacing:.6px;text-transform:uppercase;cursor:pointer;transition:background .25s,color .25s,border-color .25s}
.ck .btn:hover{background:var(--ink);color:#fff}
.ck .btn-red{border-color:var(--brand);background:var(--brand);color:#fff}
.ck .btn-red:hover{border-color:var(--brand-hover);background:var(--brand-hover)}
.ck .link{align-self:flex-start;font-size:13px;font-weight:600;color:var(--brand);text-decoration:underline;text-underline-offset:3px}
.ck .link:hover{color:var(--brand-hover)}
@media (max-width:640px){.ck-box{padding:20px 18px}.ck-btns .btn{flex:1 1 auto}}

/* ---------- 4. demonstracijos užklausa ---------- */
.demo{position:relative;padding:140px 15px;overflow:hidden;background:var(--dark);color:var(--on-dark);--accent:var(--brand-soft)}
.demo::before{content:"";position:absolute;left:-300px;top:-160px;width:1000px;height:600px;transform:rotate(-24deg);background:radial-gradient(closest-side,rgba(232,147,140,.16),rgba(232,147,140,0));pointer-events:none}
.demo__in{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:70px;align-items:start;max-width:1400px;margin:0 auto;padding:0 15px}
.demo .lw-eyebrow{color:var(--brand-soft)}
.demo .title{color:#fff}
.demo__lead{max-width:56ch;margin:26px 0 0;font:400 17px/30px var(--f-body);color:var(--on-dark)}
.demo__notes{display:grid;gap:12px;margin:28px 0 0;font:400 15px/26px var(--f-body);color:var(--on-dark)}
.demo__notes li{position:relative;padding-left:26px}
.demo__notes li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:8px;border-radius:50%;background:var(--brand-soft)}

.form{border-radius:18px;background:#fff;color:var(--body);font:400 16px/26px var(--f-body)}
.demo__form{padding:40px 42px 38px;box-shadow:0 40px 80px -40px rgba(0,0,0,.6)}
.form-fields{display:flex;flex-direction:column;gap:20px}
.form-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 16px}
.form-head h2,.form-head h3{margin:0;font:700 26px/34px var(--f-head);color:var(--ink)}
.form .code{font:600 12px/1 var(--f-body);letter-spacing:2px;color:var(--brand)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:end}
.field{display:flex;flex-direction:column;gap:8px;min-width:0}
.field label,.legend{padding:0;font:600 12px/1.2 var(--f-body);letter-spacing:1.6px;text-transform:uppercase;color:var(--ink)}
.field input,.field textarea{width:100%;padding:14px 16px;border:1px solid #D5D8DC;border-radius:10px;background:var(--soft);color:var(--ink);font:400 16px/24px var(--f-body);transition:border-color .2s,box-shadow .2s,background .2s}
.field input:focus,.field textarea:focus{outline:0;border-color:var(--brand);background:#fff;box-shadow:0 0 0 3px rgba(158,37,32,.16)}
.field textarea{min-height:110px;resize:vertical}
.field.invalid input,.field.invalid textarea{border-color:var(--brand);background:var(--brand-tint)}
.chips-set{display:flex;flex-direction:column;gap:10px;min-width:0;margin:0;padding:0;border:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative}
.chip input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.chip span{display:inline-block;padding:9px 16px;border:1px solid #D5D8DC;border-radius:30px;font:500 14px/1.2 var(--f-body);color:var(--ink);transition:background .2s,color .2s,border-color .2s}
.chip input:checked+span{border-color:var(--ink);background:var(--ink);color:#fff}
.chip input:focus-visible+span{outline:2px solid var(--brand);outline-offset:2px}
.form .btn{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;padding:17px 34px;border:0;border-radius:40px;background:var(--brand);color:#fff;font:700 14px/14px var(--f-body);letter-spacing:.7px;text-transform:uppercase;cursor:pointer;transition:background .3s ease-in-out}
.form .btn:hover{background:var(--dark-2)}
.form.sending .btn{opacity:.7;cursor:progress}
.form .note{margin:0;font:400 13px/22px var(--f-body);color:var(--body)}
.form .note a{color:var(--brand);text-decoration:underline;text-underline-offset:3px}
.form-err{margin:0;padding:10px 12px;border-left:3px solid var(--brand);background:var(--brand-tint);font:400 14px/22px var(--f-body);color:var(--brand-hover)}
.form-err a{font-weight:600;color:var(--brand-hover);text-decoration:underline}
.form-done{display:none;flex-direction:column;align-items:flex-start;gap:14px;padding:12px 0}
.form.sent .form-fields{display:none}
.form.sent .form-done{display:flex}
.form-done .stamp{display:inline-block;padding:8px 16px;border:3px solid var(--brand);border-radius:6px;font:700 14px/1 var(--f-head);letter-spacing:2px;text-transform:uppercase;color:var(--brand);transform:rotate(-4deg)}
.form-done h3{margin:0;font:700 26px/34px var(--f-head);color:var(--ink)}
.form-done p{max-width:46ch;margin:0}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
@media (max-width:1024px){.demo{padding:70px 15px}.demo__in{grid-template-columns:minmax(0,1fr);gap:40px}}
@media (max-width:767px){.demo{padding:50px 15px}.demo__in{padding:0}.demo__form{padding:28px 20px 26px}.row2{grid-template-columns:minmax(0,1fr)}.form-head h2,.form-head h3,.form-done h3{font-size:22px;line-height:30px}}

/* ---------- 5. naujienos: įrašai iš duomenų bazės ---------- */
.meta span.meta__cat,.meta time,.meta span.meta__author{position:relative;padding-left:15px;color:var(--body);white-space:normal;overflow-wrap:anywhere}
.meta time{white-space:nowrap}
.meta span.meta__cat::before,.meta time::before{content:"";position:absolute;left:0;top:50%;width:8px;height:8px;border-radius:50px;background:var(--accent);transform:translateY(-50%)}
.meta span.meta__author{padding-left:0}
.news--solo .news__grid{justify-content:center}
.news--solo .news__col{flex:0 0 min(760px,100%);max-width:min(760px,100%)}
.news--solo .feature{margin-right:0;padding-right:0;border-right:0}
.news--solo .feature .meta{padding-right:0}
.news__all{display:flex;flex-wrap:wrap;gap:10px 26px;margin:30px 0 0}
.link-more{font:600 14px/20px var(--f-body);letter-spacing:1px;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--brand);padding-bottom:2px;transition:color .3s}
.link-more:hover,.link-more:focus-visible{color:var(--brand)}

/* ---------- 6. poraštė ir integracijų pastaba ---------- */
.flinks + .ftitle{margin-top:34px}
.contact__addr{margin:0}
.logos__note .logos__more{margin-left:6px;color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.logos__note .logos__more:hover{color:var(--brand)}

/* =====================================================================================================================
   Peržiūros pataisos (2026-10-23): prieinamumas (klaviatūra, fokusas, kontrastas, taikinių dydžiai) ir smulkūs
   nukrypimai nuo patvirtinto maketo. Laikomos čia, failo gale, kad nereikėtų liesti išmatuotų taisyklių aukščiau.
   ===================================================================================================================== */
@container hero (max-width: 1658px) { .hero__dots, .hero__count { visibility: hidden; } }   /* apkarpyti valdikliai – ne Tab sekoje */
.hero__count-all{opacity:.75}
:focus-visible{outline-color:var(--ring,var(--brand))}
.proc,.foot,.demo,.band--quotes,.sys__stage{--ring:var(--brand-soft)}                         /* ant tamsių juostų – šviesesnis žiedas */
.hdr__bar.is-stuck a:focus-visible,.hdr__bar.is-stuck button:focus-visible,.hdr__sub a:focus-visible,.mbar a:focus-visible,.mbar button:focus-visible,.dr a:focus-visible,.dr button:focus-visible,.oc a:focus-visible,.oc button:focus-visible{outline-color:var(--brand)}   /* ant baltų paviršių – pagrindinė raudona (≥3:1) */
.sp__field:focus-visible{outline:2px solid var(--brand-soft);outline-offset:2px}
.dr__field:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
.hdr__item--sub.is-off > .hdr__sub{opacity:0;visibility:hidden}                              /* Esc uždaro išskleistą meniu */
.hdr .lang button{min-height:24px}
.hdr__search{display:grid;place-items:center;width:24px;height:24px}
.dr__x{width:44px;height:44px;right:8px;top:18px}
.dr__x::before,.dr__x::after{position:absolute;left:7px;top:21px}
.dr__acct,.oc__acct{color:#5d656c}
.field input::placeholder,.field textarea::placeholder{color:#5d656c;opacity:1}
.field input,.field textarea,.chip span{border-color:#8A9096}
.ck-box{max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}
.foot .to-top,.foot .to-top:hover,.foot .to-top:focus{color:#fff}
.cap__title .sec-title__heading{text-transform:uppercase}
.wmk{min-width:0;padding:0 6px}
.wmk small{letter-spacing:1px;overflow-wrap:anywhere}
.feature__title a,.row__title a{overflow-wrap:anywhere;hyphens:auto}
.auto-toggle{display:flex;width:max-content;margin:16px auto 0;padding:7px 16px;border:1px solid var(--line);border-radius:30px;background:#fff;color:var(--ink);font:600 12px/18px var(--f-body);letter-spacing:.6px;text-transform:uppercase;cursor:pointer}
.auto-toggle:hover,.auto-toggle:focus-visible{border-color:var(--brand);color:var(--brand)}
.band--quotes .auto-toggle{margin-left:0;border-color:rgba(255,255,255,.3);background:transparent;color:#fff}
.band--quotes .auto-toggle:hover,.band--quotes .auto-toggle:focus-visible{border-color:var(--brand-soft);color:var(--brand-soft)}
@media (max-width:1024px){.picks{padding-top:50px}}
@media (forced-colors:active){.chip input:checked+span{forced-color-adjust:none;background:Highlight;color:HighlightText;border-color:Highlight}}