/*
 * Transdepas - visi svetainės stiliai.
 *
 * Perkelta iš patvirtinto prototipo (prototipai/index.html + vidinių puslapių
 * bendras blokas). Tokenai dubliuojami theme.json, kad tas pačias spalvas
 * matytų ir redaktorius - keičiant spalvą, keisti abiejose vietose.
 */


:root{
  /* === VARIANT B: dark + brand teal only. Tokens mirror DESIGN.md === */
  --bg:#0B0D0E;                      /* near-black charcoal */
  --surface:#14181A;                 /* cards, header */
  --surface-2:#0F1D1C;               /* teal-tinted anchor panels */
  --career-solid:#00554F;
  --career-grad:linear-gradient(135deg,#00504A 0%,#00847C 100%); /* teal gradient */
  --career-text:#D9F0EE;
  --career-fine:#BCE2DF;
  --ink:#EDF2F1;                     /* main text on dark */
  --muted:#9FACAA;
  --accent:#00A89F;                  /* brand teal, AA 6.4:1 on --bg */
  --accent-bright:#2DC4BA;           /* hover teal */
  --btn-ink:#06110E;                 /* dark text on teal pills */
  --white:#FFFFFF;
  --line:#252D2F;
  --ghost:#2A3538;
  --scrim:rgba(8,12,13,.62);
  /* Light cookie bar: deliberately breaks the dark palette so consent is noticed */
  --cookie-bg:#FFFFFF;--cookie-ink:#1B2224;--cookie-line:#B7C4C1;--cookie-link:#00615C;
  --font-display:'Montserrat','Segoe UI',system-ui,sans-serif;
  --font-body:'Inter','Segoe UI',system-ui,sans-serif;
  --text-sm:.9rem;--text-base:1.05rem;--text-lg:clamp(1.15rem,2.3vw,1.3rem);
  --text-xl:clamp(1.5rem,3.5vw,2rem);--text-xxl:clamp(2.2rem,5.5vw,3.6rem);
  --ghost-size:clamp(3.2rem,9vw,7rem);
  /* extra top room in blocks that carry a ghost heading */
  --ghost-clear:clamp(2rem,4vw,4.5rem);
  --space-10:.5rem;--space-20:1rem;--space-30:2rem;--space-40:3.5rem;--space-50:6.5rem;
  --radius:10px;
  --radius-pill:999px;
  --shadow-1:none;--shadow-2:none;
  --ease:cubic-bezier(.4,0,.2,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:400 var(--text-base)/1.65 var(--font-body);font-synthesis:none;font-optical-sizing:auto;text-wrap:pretty}
h1,h2,h3{font-family:var(--font-display);line-height:1.12;letter-spacing:-.01em;text-wrap:balance}
h1{font-size:var(--text-xxl);font-weight:800;margin-bottom:var(--space-20)}
h2{font-size:var(--text-xl);font-weight:700;margin-bottom:var(--space-20)}
h3{font-size:var(--text-lg);font-weight:600;margin-bottom:var(--space-10)}
p+p{margin-top:var(--space-20)}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-underline-offset:.18em}
a:hover{color:var(--accent-bright)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Anchor targets clear the sticky header */
#content [id]{scroll-margin-top:96px}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--bg);padding:.6rem 1rem;z-index:100}
.skip-link:focus{left:var(--space-20)}
.wrap{max-width:1400px;margin:0 auto;padding-inline:clamp(1rem,4vw,2.5rem)}
.ico{width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
/* Ghost display titles: stroke-only, decorative (aria-hidden), -webkit-text-stroke keeps them legible-but-quiet */
.ghost{font:800 var(--ghost-size)/1 var(--font-display);letter-spacing:.02em;text-transform:uppercase;color:var(--bg);-webkit-text-stroke:2px var(--ghost);paint-order:stroke fill;user-select:none;white-space:nowrap;overflow:hidden;max-width:100%}
/* Ghost sits vertically centred on the heading it is attached to (same rule everywhere) */
.h-ghost{position:relative;display:block}
.h-ghost > .ghost{position:absolute;left:0;top:0;transform:translateY(-50%);z-index:0;pointer-events:none}
/* Sits entirely ABOVE the heading's first line, never overlapping it. line-height .8 keeps the
   ghost box tight around the caps, so the offset below is predictable on every heading size. */
.h-ghost > .ghost{line-height:.8}
.h-ghost > .ghost{margin-top:calc(var(--ghost-size) * -.48)}
.h-ghost > .ht{position:relative;z-index:1;display:block}
@media (prefers-reduced-motion:no-preference){
  a,button,.btn{transition:color .12s var(--ease),background .12s var(--ease),border-color .12s var(--ease)}
  .hero-copy{animation:rise .6s var(--ease) both .1s}
  @keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
}

/* === Pill buttons === */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.7rem;border-radius:var(--radius-pill);font:600 1rem var(--font-body);text-decoration:none;border:1px solid transparent;cursor:pointer;white-space:nowrap}
.btn.btn-primary{background:var(--accent);color:var(--btn-ink)}
.btn.btn-primary:hover{background:var(--accent-bright);color:var(--btn-ink)}
.btn.btn-ghost{border-color:var(--muted);color:var(--ink);background:transparent}
.btn.btn-ghost:hover{border-color:var(--accent);color:var(--accent);background:transparent}
.btn .ico{width:18px;height:18px;flex-basis:18px}

/* === Header === */
.site-header{min-height:72px;background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.site-header > .header-in{display:flex;align-items:center;gap:var(--space-30);min-height:72px}
/* Exact client logo (PNG on white) inside a white chip, like the LinkedIn covers */
.logo-chip{display:inline-flex;align-items:center;background:var(--white);border-radius:8px;padding:.45rem .8rem}
.logo-chip img{height:26px;width:auto}
.site-header .nav ul{list-style:none;display:flex;gap:1.5rem;padding:0}
.site-header .nav a{white-space:nowrap;text-decoration:none;color:var(--ink);font-weight:500;font-size:.98rem}
.site-header .nav a:hover{color:var(--accent)}
.header-menu{display:flex;align-items:center;gap:var(--space-30);margin-left:auto}
.lang{display:flex;gap:.15rem;list-style:none;padding:0;font-size:.85rem}
.site-header .lang a,.site-header .lang span{text-decoration:none;color:var(--muted);padding:.3rem .5rem;border-radius:6px;display:inline-block}
.site-header .lang a[aria-current],.site-header .lang .cur{color:var(--accent);font-weight:600;background:var(--bg)}
.nav-toggle{display:none;margin-left:auto;background:none;border:1px solid var(--line);border-radius:8px;padding:.5rem .65rem;cursor:pointer;color:var(--ink)}
@media (max-width:1150px){
  .header-menu{display:none}
  .nav-toggle{display:block}
  /* Open menu carries the links, the language switcher and the CTA, so nothing is lost on mobile */
  .header-menu.open{display:flex;flex-direction:column;align-items:stretch;gap:var(--space-20);position:fixed;inset:72px 0 auto 0;background:var(--surface);border-bottom:1px solid var(--line);padding:var(--space-20);max-height:calc(100dvh - 72px);overflow-y:auto}
  .header-menu.open .nav ul{flex-direction:column;gap:.2rem}
  .header-menu.open .nav a{display:block;padding:.7rem .5rem;font-size:1.05rem}
  .header-menu.open .lang{gap:.4rem;border-top:1px solid var(--line);padding-top:var(--space-20)}
  .header-menu.open .lang a,.header-menu.open .lang span{font-size:1rem;padding:.5rem .8rem}
  .header-menu.open .header-cta{justify-content:center}
}

/* === Hero: full-screen looping video === */
.hero{position:relative;min-height:86vh;display:grid;align-items:center;overflow:hidden;background:var(--bg)}
.hero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(6,10,11,.72) 0%,rgba(6,10,11,.47) 55%,rgba(6,10,11,.26) 100%),linear-gradient(180deg,rgba(6,10,11,.3) 0%,rgba(8,12,13,.53) 85%)}
.hero > .hero-in{position:relative;z-index:2;padding-block:var(--space-50) var(--space-40);width:100%}
.hero .hero-tagline{font:600 1rem var(--font-body);color:var(--accent-bright);margin-bottom:var(--space-10);letter-spacing:.02em}
.hero .hero-copy h1{color:var(--white);max-width:740px}
.hero .lead{font-size:var(--text-lg);color:#D5DEDC;max-width:710px;text-align:justify}
@media (max-width:700px){.hero .lead{text-align:left}}
.hero .hero-ctas{display:flex;gap:var(--space-20);margin-top:var(--space-30);flex-wrap:wrap}

/* === Stats band === */
.stats{background:var(--surface);border-block:1px solid var(--line)}
.stats > .stats-in{padding-block:var(--space-40)}
.stats .stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-30)}
.stats .stat{display:grid;grid-template-columns:auto 1fr;column-gap:1.05rem;align-items:start}
.stats .stat .ico{grid-row:1/3;align-self:center;width:40px;height:40px;flex-basis:40px;color:var(--accent)}
.stats .stat b{display:block;font:800 clamp(1.8rem,3.5vw,2.6rem)/1.1 var(--font-display);font-variant-numeric:tabular-nums;color:var(--white)}
.stats .stat span{color:var(--muted);font-size:var(--text-sm)}
@media (max-width:760px){.stats .stats-grid{grid-template-columns:repeat(2,1fr)}
  .stats .stat{column-gap:.7rem}
  .stats .stat .ico{width:30px;height:30px;flex-basis:30px}}

/* === Sections & ghost heads === */
.section{padding-block:var(--space-50)}
.sec-head{position:relative;margin-bottom:var(--space-40);padding-top:var(--ghost-clear)}
.sec-head h2{position:relative;z-index:1}
.sec-head p{position:relative;z-index:1;color:var(--muted);max-width:44rem}

/* === Service cards === */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-20)}
.card{border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-30);background:var(--surface)}
.card:hover{border-color:var(--accent)}
.card > .ico{width:28px;height:28px;flex-basis:28px;color:var(--accent);margin-bottom:var(--space-20)}
.card > h3{margin-top:0;color:var(--ink)}
.card > p{color:var(--muted);font-size:.95rem;margin-top:var(--space-10)}
@media (max-width:1000px){.cards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.cards{grid-template-columns:1fr}}

/* === About === */
.about{background:var(--surface-2);border-block:1px solid var(--line)}
.about > .about-in{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-40);align-items:center;padding-block:var(--space-50)}
.about > .about-in h2{color:var(--white)}
.about > .about-in p{color:var(--muted)}
.about > .about-in .more{color:var(--accent);font-weight:600}
.about > .about-in .more:hover{color:var(--accent-bright)}
.about-media{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line)}
.about-media img{width:100%;aspect-ratio:3/2;object-fit:cover}
/* Wide photo band - real Mercedes-Benz fleet imagery */
.band{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--surface);margin-top:var(--space-30)}
.band img{width:100%;display:block;aspect-ratio:21/9;object-fit:cover}
.band > figcaption{position:absolute;inset:auto 0 0 0;padding:var(--space-30);background:linear-gradient(180deg,rgba(8,12,13,0) 0%,rgba(8,12,13,.92) 72%);color:#C7D2CF;font-size:.95rem}
.band > figcaption b{display:block;font-family:var(--font-display);color:var(--white);font-size:1.15rem;margin-bottom:.25rem;max-width:52rem}
.band > figcaption > span{display:block;max-width:52rem}
@media (max-width:700px){.band img{aspect-ratio:16/10}}
@media (max-width:860px){.about > .about-in{grid-template-columns:1fr}}

/* === Fleet === */
.fleet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-20)}
.fleet-card{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.fleet-card img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:saturate(.85)}
.fleet-card > .fleet-body{position:absolute;inset:auto 0 0 0;padding:var(--space-30);background:linear-gradient(180deg,rgba(8,12,13,0) 0%,rgba(8,12,13,.88) 55%)}
.fleet-card > .fleet-body .tag{font:700 .78rem var(--font-body);color:var(--accent-bright);letter-spacing:.04em}
.fleet-card > .fleet-body h3{color:var(--white);margin-bottom:.2rem}
.fleet-card > .fleet-body p{color:#C7D2CF;font-size:.92rem}
@media (max-width:860px){.fleet-grid{grid-template-columns:1fr}}

/* === Careers === */
.career{background-color:var(--career-solid);background-image:var(--career-grad)}
.career > .career-in{padding-block:calc(var(--space-50) + var(--ghost-clear)) var(--space-50)}
.career > .career-in .ghost{color:var(--career-solid);-webkit-text-stroke:2px rgba(255,255,255,.28);paint-order:stroke fill}
.career > .career-in h2{color:var(--white)}
.career > .career-in .career-lead{color:var(--career-text);max-width:40rem}
.career > .career-in .perks{list-style:none;padding:0;display:flex;gap:1.4rem;flex-wrap:wrap;margin-top:var(--space-20)}
.career > .career-in .perks li{display:flex;gap:.5rem;align-items:center;color:var(--white);font-weight:600;font-size:.98rem}
.career > .career-in .perks .ico{color:var(--white);background:rgba(255,255,255,.14);border-radius:999px;padding:3px;width:24px;height:24px;flex-basis:24px}
.jobs{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-20);margin-top:var(--space-40)}
.job{background:rgba(4,20,19,.55);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);padding:var(--space-30)}
.job > h3{color:var(--white)}
.job > .job-meta{display:flex;gap:1.2rem;flex-wrap:wrap;color:var(--career-fine);font-size:var(--text-sm);margin-bottom:var(--space-20)}
.job > .job-meta span{display:flex;gap:.4rem;align-items:center}
.job > .job-pay{display:flex;flex-wrap:wrap;gap:.15rem .6rem;align-items:baseline;margin-bottom:var(--space-20)}
.job > .job-pay b{color:var(--white);font:700 1.1rem/1.2 var(--font-display);font-variant-numeric:tabular-nums}
.job > .job-pay span{color:var(--career-fine);font-size:var(--text-sm)}
.job > p{color:var(--career-text);font-size:.95rem;margin-bottom:var(--space-20)}
.job .btn-apply{background:var(--white);color:var(--career-solid);border-radius:var(--radius-pill);display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.4rem;font:600 .95rem var(--font-body);text-decoration:none}
.job .btn-apply:hover{background:var(--accent-bright);color:var(--btn-ink)}
.career > .career-in .fine{font-size:var(--text-sm);margin-top:var(--space-30);color:var(--career-fine)}
.career > .career-in .fine a{color:var(--white)}
.career > .career-in .fine a:hover{color:var(--career-fine)}
@media (max-width:860px){.jobs{grid-template-columns:1fr}}

/* === Footer === */
.site-foot{background:var(--surface);border-top:1px solid var(--line)}
.site-foot > .foot-in{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:var(--space-40);padding-block:var(--space-40)}
.site-foot > .foot-in h3{color:var(--white);font-size:1rem}
.site-foot > .foot-in .foot-desc{color:var(--muted);margin-top:1rem;max-width:26rem}
.contact{list-style:none;padding:0;display:grid;gap:var(--space-10)}
.contact li{display:flex;gap:.6rem;align-items:flex-start}
.site-foot > .foot-in .contact .ico{margin-top:.25rem;color:var(--accent)}
.site-foot a{text-decoration:none}
.site-foot > .foot-in .contact a{color:var(--ink)}
.site-foot > .foot-in .contact a:hover{color:var(--accent)}
.site-foot > .foot-in .contact span{color:var(--muted)}
.foot-nav{list-style:none;padding:0;display:grid;gap:.45rem}
.site-foot > .foot-in .foot-nav a{color:var(--muted);text-decoration:none}
.site-foot > .foot-in .foot-nav a:hover{color:var(--white)}
.social{list-style:none;padding:0;display:flex;gap:.4rem;margin-top:var(--space-20)}
.site-foot > .foot-in .social a{display:grid;place-items:center;width:44px;height:44px;border-radius:999px;color:var(--ink);border:1px solid var(--line)}
.site-foot > .foot-in .social a:hover{color:var(--accent);border-color:var(--accent)}
.social svg{width:20px;height:20px;fill:currentColor}
.site-foot > .foot-bottom{border-top:1px solid var(--line);padding-block:var(--space-20);display:flex;flex-wrap:wrap;gap:var(--space-20);justify-content:space-between;font-size:var(--text-sm)}
.site-foot > .foot-bottom span{color:var(--muted)}
.site-foot > .foot-bottom a{color:var(--muted)}
.site-foot > .foot-bottom a:hover{color:var(--white)}
@media (max-width:860px){.site-foot > .foot-in{grid-template-columns:1fr}}

/* === Cookie bar (demo; WP version gets full category management + consent withdrawal) === */
.cookies[hidden]{display:none}
.cookies{position:fixed;inset:auto 0 0 0;background:var(--cookie-bg);border-top:3px solid var(--accent);padding:var(--space-20);z-index:60;box-shadow:0 -12px 34px rgba(0,0,0,.45)}
.cookies > .cookies-in{display:flex;flex-wrap:wrap;gap:var(--space-20);align-items:center;justify-content:space-between}
.cookies > .cookies-in p{font-size:var(--text-sm);color:var(--cookie-ink);max-width:46rem}
.cookies > .cookies-in p > a{color:var(--cookie-link);font-weight:600}
.cookies .row{display:flex;gap:var(--space-10);flex-wrap:wrap}
.cookies .row .btn.c-ghost{border-color:var(--cookie-line);color:var(--cookie-ink);background:var(--cookie-bg)}
.cookies .row .btn.c-ghost:hover{border-color:var(--cookie-link);color:var(--cookie-link);background:var(--cookie-bg)}

/* ---------- Vidiniai puslapiai ---------- */

/* === Inner-page components (shared) === */
/* Ghost headings run 20% smaller on inner pages than on the homepage */
/* Prototipe siuos perrasymus kraudavo TIK vidiniai puslapiai (ju <style> blokas
   buvo antras). Sujungus viska i viena faila jie pradejo galioti ir pradiniam
   puslapiui, kur ghost antraste tapo 5,6rem vietoj 7rem, o sekciju tarpai
   susitrauke nuo 6,5rem iki 3,5rem. body:not(.home) grazina pradini elgesi:
   pradinis naudoja bazines reiksmes, visi kiti puslapiai (iskaitant 404 ir
   privatumo politika) - vidiniu puslapiu ritma, kaip ir prototipe. */
body:not(.home){--ghost-size:clamp(2.56rem,7.2vw,5.6rem);--ghost-clear:clamp(1.2rem,2.6vw,2.5rem)}
/* Inner pages stack same-coloured sections, so they use a tighter, uniform rhythm than the homepage */
body:not(.home) .section{padding-block:var(--space-40)}
.page-hero{background:var(--surface-2);border-bottom:1px solid var(--line)}
.page-hero > .ph-in{position:relative;padding-block:calc(var(--space-50) + var(--ghost-clear)) var(--space-40)}
.page-hero > .ph-in.no-ghost{padding-block:var(--space-40)}
.page-hero > .ph-in h1{color:var(--white);position:relative;z-index:1;max-width:22ch}
.page-hero > .ph-in .lead{color:var(--muted);font-size:var(--text-lg);max-width:50rem;position:relative;z-index:1}
.split{display:grid;grid-template-columns:1.1fr .9fr;gap:var(--space-40);align-items:center}
.split.rev{grid-template-columns:.9fr 1.1fr}
@media (max-width:860px){.split,.split.rev{grid-template-columns:1fr}}
.media-frame{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line)}
.media-frame img{width:100%;aspect-ratio:3/2;object-fit:cover}
.steps{list-style:none;counter-reset:step;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-20)}
.steps > li{border-top:2px solid var(--accent);padding-top:var(--space-20);counter-increment:step}
.steps > li::before{content:counter(step,decimal-leading-zero);font:700 .85rem var(--font-body);color:var(--accent);letter-spacing:.05em}
.steps > li b{display:block;color:var(--white);font-family:var(--font-display);font-size:1.05rem;margin:.3rem 0 .35rem}
.steps > li span{color:var(--muted);font-size:.93rem}
@media (max-width:860px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}
.svc{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-40);display:grid;grid-template-columns:auto 1fr;gap:var(--space-30)}
.svc + .svc{margin-top:var(--space-20)}
.svc > .ico{width:32px;height:32px;flex-basis:32px;color:var(--accent);margin-top:.2rem}
.svc > div h2{margin-bottom:var(--space-10)}
.svc > div p{color:var(--muted)}
.svc > div ul{list-style:none;padding:0;margin-top:var(--space-20);display:grid;gap:.45rem}
.svc > div ul li{display:flex;gap:.55rem;align-items:flex-start;color:var(--ink);font-size:.97rem}
.svc > div ul .ico{width:18px;height:18px;flex-basis:18px;color:var(--accent);margin-top:.2rem}
@media (max-width:620px){.svc{grid-template-columns:1fr}}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-40)}
.panel > h2{color:var(--white)}
.panel > p{color:var(--muted)}
.panel > ul{list-style:none;padding:0;display:grid;gap:.6rem;margin-top:var(--space-20)}
.panel > ul li{display:flex;gap:.6rem;align-items:flex-start;color:var(--ink)}
.panel > ul .ico{color:var(--accent);margin-top:.25rem}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-20)}
@media (max-width:860px){.two-col{grid-template-columns:1fr}}
.cta-band{background-color:var(--career-solid);background-image:var(--career-grad);border-radius:var(--radius)}
.cta-band > .cta-in{padding:var(--space-40);display:grid;grid-template-columns:1fr auto;gap:var(--space-30);align-items:center}
.cta-band > .cta-in h2{color:var(--white);margin-bottom:.3rem}
.cta-band > .cta-in p{color:var(--career-text);margin:0}
.cta-band .btn-apply{background:var(--white);color:var(--career-solid);border-radius:var(--radius-pill);display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.7rem;font:600 1rem var(--font-body);text-decoration:none;white-space:nowrap}
.cta-band .btn-apply:hover{background:var(--accent-bright);color:var(--btn-ink)}
@media (max-width:700px){.cta-band > .cta-in{grid-template-columns:1fr}}
/* Forms: markup maps 1:1 to CF7 (label above input, one field per row) */
.xform{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-40)}
.xform h2{color:var(--white)}
.xform .form-note{color:var(--muted);font-size:var(--text-sm);margin-bottom:var(--space-30)}
.xform .grid2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-20)}
@media (max-width:620px){.xform .grid2{grid-template-columns:1fr}}
.xform .field{display:grid;gap:.35rem;margin-bottom:var(--space-20)}
.xform label{color:var(--ink);font-weight:500;font-size:.95rem}
.xform input,.xform select,.xform textarea{background:var(--bg);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:.75rem .9rem;font:400 1rem var(--font-body);width:100%;color-scheme:dark}
.xform textarea{min-height:120px;resize:vertical}
.xform input[type=file]{padding:.6rem .9rem;cursor:pointer}
.xform input[type=file]::file-selector-button{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:.4rem 1rem;margin-right:.8rem;font:600 .9rem var(--font-body);cursor:pointer}
.xform input[type=file]::file-selector-button:hover{border-color:var(--accent);color:var(--accent)}
.xform .hint{color:var(--muted);font-size:var(--text-sm)}
.xform ::placeholder{color:var(--muted);opacity:1}
.xform select:has(option[value=""]:checked){color:var(--muted)}
.xform select option{color:var(--ink)}
.xform input:focus-visible,.xform select:focus-visible,.xform textarea:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.xform .consent{display:flex;gap:.6rem;align-items:flex-start;margin-block:var(--space-30)}
.xform .consent input{width:18px;height:18px;margin-top:.2rem;accent-color:var(--accent)}
.xform .consent span{color:var(--muted);font-size:var(--text-sm)}
.contact-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-20)}
@media (max-width:860px){.contact-cards{grid-template-columns:1fr}}
.ccard{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:var(--space-30)}
.ccard > h2{font-size:1.05rem;color:var(--white)}
.ccard > ul{list-style:none;padding:0;display:grid;gap:var(--space-10)}
.ccard > ul li{display:flex;gap:.6rem;align-items:flex-start}
.ccard .ico{color:var(--accent);margin-top:.25rem}
.ccard a{color:var(--ink);text-decoration:none}
.ccard a:hover{color:var(--accent)}
.ccard li > span{color:var(--muted)}
.map-card{margin-top:var(--space-20);background:var(--surface);border:1px dashed var(--line);border-radius:var(--radius);padding:var(--space-40);text-align:center}
.map-card > p{color:var(--muted);margin-bottom:var(--space-20)}
.map-embed{margin-top:var(--space-30);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--surface);position:relative}
.map-embed iframe{display:block;width:100%;height:420px;border:0}
.map-embed > .map-facade{height:420px;display:grid;place-items:center;gap:var(--space-20);text-align:center;padding:var(--space-30);background:var(--surface-2)}
.map-embed > .map-facade p{color:var(--muted);max-width:34rem;margin:0}
.map-embed > .map-facade .ico{width:34px;height:34px;flex-basis:34px;color:var(--accent)}
.map-embed > .map-note{padding:.7rem var(--space-20);border-top:1px solid var(--line);color:var(--muted);font-size:var(--text-sm);display:flex;flex-wrap:wrap;gap:.6rem;justify-content:space-between;align-items:center}
.map-embed > .map-note a{color:var(--accent);text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:.4rem}
.map-embed > .map-note a:hover{color:var(--accent-bright)}
@media (max-width:700px){.map-embed iframe,.map-embed > .map-facade{height:320px}}
.prose{max-width:none}
.prose [id]{scroll-margin-top:96px}
.prose > h2{margin-top:var(--space-40);color:var(--white)}
.prose > p,.prose > ul li{color:var(--muted)}
.prose > ul{padding-left:1.2rem}
.prose .updated{font-size:var(--text-sm);color:var(--muted)}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);margin-block:var(--space-20)}
.tablewrap table{width:100%;border-collapse:collapse;font-size:.93rem;min-width:560px}
.tablewrap th,.tablewrap td{text-align:left;padding:.6rem .9rem;border-bottom:1px solid var(--line)}
.tablewrap th{color:var(--white);font-weight:600;background:var(--surface)}
.tablewrap td{color:var(--muted)}
.tablewrap tr:last-child td{border-bottom:none}
.draft-note{background:var(--surface);border:1px dashed var(--accent);border-radius:var(--radius);padding:var(--space-20);color:var(--muted);font-size:var(--text-sm);margin-bottom:var(--space-30)}
.nf{min-height:60vh;display:grid;align-items:center;text-align:left;background:var(--bg)}
.page-hero > .ph-in .ghost{color:var(--surface-2);-webkit-text-stroke-color:var(--ghost)}
.nf h1{color:var(--white)}
.nf > div > p{color:var(--muted);max-width:40rem}
.nf .row{display:flex;gap:var(--space-20);flex-wrap:wrap;margin-top:var(--space-30)}

/* ---------- WordPress ---------- */

/* Hero be video: nuotrauka elgiasi lygiai kaip video sluoksnis.
   Prototipe video buvo visada, WP versijoje jis neprivalomas (telefonuose ir
   tada, kai klientas jo neįkelia), todėl fonui reikia ir img varianto. */
.hero img.hero-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}


/* Blokų redaktoriaus turinys .prose bloke.
   .prose pagrindiniai stiliai jau yra prototipo CSS - čia tik tai, ko
   prototipe nebuvo, nes ten turinys buvo rašomas ranka, o ne blokais. */
.prose .alignwide{max-width:1200px}
.prose .alignfull{max-width:none}
.prose img{max-width:100%;height:auto}
/* Lentelės blokas atkartoja prototipo .tablewrap: tas pats rėmelis, tarpai
   ir horizontalus slinkimas siaurame ekrane. */
.prose .wp-block-table{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);margin-block:var(--space-20)}
.prose .wp-block-table table{width:100%;border-collapse:collapse;font-size:.93rem;min-width:560px;border:0}
.prose .wp-block-table th,.prose .wp-block-table td{text-align:left;padding:.6rem .9rem;border:0;border-bottom:1px solid var(--line)}
.prose .wp-block-table th{color:var(--white);font-weight:600;background:var(--surface)}
.prose .wp-block-table td{color:var(--muted)}
.prose .wp-block-table tr:last-child td{border-bottom:none}
/* Blokų redaktoriaus lentelė turi ryškią 3px liniją po antrašte - makete jos nėra. */
.prose .wp-block-table thead,.prose .wp-block-table tfoot{border:0}

/* ---------- Contact Form 7 ---------- */

/* Formų karkasas paveldimas iš .xform - čia tik tai, ką prideda pats CF7. */
.wpcf7 form .wpcf7-response-output{
  margin:var(--space-20) 0 0;padding:.75rem 1rem;
  border:1px solid var(--line);border-radius:var(--radius);
  color:var(--ink);font-size:var(--text-sm)
}
.wpcf7 form.sent .wpcf7-response-output{border-color:var(--accent);background:var(--surface-2)}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output{border-color:#E06C5A}
/* Klaidos tekstas gyvena tame paciame wrap'e kaip ir laukas, todel jam
   reikia savo tarpo ir line-height - kitaip prilimpa prie lauko krasto
   (wrap'ui nustatytas line-height:0 del textarea bazines linijos). */
.xform .wpcf7-not-valid-tip{
  display:block;margin-top:.45rem;line-height:1.45;
  color:#F0937F;font-size:var(--text-sm)
}
.xform input.wpcf7-not-valid,
.xform textarea.wpcf7-not-valid,
.xform select.wpcf7-not-valid{border-color:#E06C5A}
.wpcf7-spinner{margin:0 0 0 .5rem}

/* CF7 apvynioja laukus <span>, kuris kitaip sulaužo tinklelį. Laukai daromi
   block: kitaip inline elementas span'e palieka bazinės linijos tarpą ir
   textarea blokas tampa 8px aukštesnis nei makete. */
.xform .wpcf7-form-control-wrap{display:block}
.xform input:not([type=submit]),.xform select,.xform textarea{display:block}

/* line-height:0 cia tinka tik laukams: sutikimo eilutėje jis suplotų tekstą. */
.xform .field .wpcf7-form-control-wrap{line-height:0}

/* reCAPTCHA ženkliukas slepiamas - vietoj jo prie formos rodomas
   privalomas Google atribucijos tekstas (.form-fine). */
.grecaptcha-badge{visibility:hidden !important}

/* ---------- Admin juosta ---------- */
body.admin-bar .site-header{top:32px}
@media (max-width:782px){body.admin-bar .site-header{top:46px}}

/* CF7 tarnybiniai blokai: ekrano skaitytuvams reikalingi, bet matomo
   rėmelio palikti negalima - tuščias jis atrodo kaip lūžęs laukas. */
.wpcf7 .screen-reader-response{
  position:absolute;width:1px;height:1px;margin:-1px;padding:0;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0
}
.wpcf7 form .wpcf7-response-output:empty{display:none}

/* CF7 paslėptus laukus deda į <fieldset>, kuris be stiliaus piešiamas kaip
   tuščias rėmelis formos viršuje. */
.xform .hidden-fields-container{display:none}

/* Bendra input taisyklė duoda width:100%, o mygtukui to nereikia. */

/* Sutikimo langelis: CF7 pats sukuria <label>, todėl stilius kabinamas ant
   jo, o ne ant temos elemento - kitaip gautųsi label label viduje. */
/* Prototipo .consent taisykle daro ji flex konteineriu, bet CF7 markup'e tarp
   .consent ir langelio yra du <span>, todel flex turi buti ant CF7 <label>. */
.xform .consent{display:block;margin-block:var(--space-30)}
.xform .consent .wpcf7-form-control-wrap,
.xform .consent .wpcf7-acceptance,
.xform .consent .wpcf7-list-item{display:block;margin:0;line-height:inherit}
.xform .consent label{display:flex;gap:.6rem;align-items:flex-start;font-weight:400;cursor:pointer}
.xform .consent input[type=checkbox]{
  flex:0 0 18px;width:18px;height:18px;margin:.15rem 0 0;
  accent-color:var(--accent);display:block
}
.xform .consent .wpcf7-list-item-label{color:var(--muted);font-size:var(--text-sm)}
.xform .consent .wpcf7-list-item-label a{color:var(--accent)}

/* Privalomų laukų žvaigždutė. Dekoratyvi (aria-hidden): reikalavimą ekrano
   skaitytuvui perduoda pats laukas per aria-required, todėl garsiai skaityti
   „žvaigždutė" prie kiekvienos etiketės nereikia. */
/* .xform .consent span (0-2-1) nurungtu paprasta .xform .req (0-2-0), todel
   sutikimo eilutes zvaigzdutei reikia tikslesnio selektoriaus. */
.xform .req,
.xform .consent .req{color:#E06C5A;margin-left:.15rem;font-weight:600;font-size:inherit}
.xform .form-legend{color:var(--muted);font-size:var(--text-sm);margin:0 0 var(--space-20)}

/* ---------- Prototipo inline stiliai ---------- */

/* Prototipe siuos dalykus dengia style="" atributai konkrečiuose puslapiuose.
   Temoje tas pats pasiekiama klasėmis: rezultatas identiškas, o stilius lieka
   CSS faile, ne markup'e. */

/* section.wrap be .section: mažesnis vertikalus tarpas (parkas, karjera). */
.sec-y40{padding-block:var(--space-40)}

/* Kontaktų formos sekcija: tik viršutinis tarpas sumažintas. */
.sec-pt40{padding-top:var(--space-40)}

/* Juosta, kuri yra pirmas sekcijos vaikas - be viršutinio tarpo. */
.band.is-flush{margin-top:0}

/* Karjeros smulkus tekstas po anketa. */
.fine{margin-top:1rem;color:var(--muted);font-size:.9rem}

/* CF7 elementai, kurių prototipe nebuvo ir kurie be tvarkymo pailgina formą:
   sukimosi indikatorius rodomas tik siunčiant, o atsakymo blokas - tik tada,
   kai jame realiai kas nors yra. */
.wpcf7-spinner{display:none}
.wpcf7 form.submitting .wpcf7-spinner{display:inline-block}
.wpcf7 form:not(.sent):not(.invalid):not(.failed):not(.unaccepted):not(.spam) .wpcf7-response-output{display:none}

/* Siuntimo mygtukas yra tikras <button class="btn btn-primary"> (žr. inc/cf7.php),
   todėl jam galioja tos pačios .btn taisyklės kaip ir visiems kitiems. Čia tik
   nurungiama bendra .xform input taisyklė, kuri kitaip duotų lauko išvaizdą. */
.xform button[type=submit]{width:auto;background:var(--accent);color:var(--btn-ink)}
.xform button[type=submit]:hover{background:var(--accent-bright);color:var(--btn-ink)}

/* Nepažymėjus sutikimo CF7 grąžina bendrą pranešimą, bet prie paties langelio
   klaidos nededa - todėl eilutė paryškinama, kad iškart matytųsi, kur žiūrėti. */
.wpcf7 form.unaccepted .consent input[type=checkbox]{outline:2px solid #E06C5A;outline-offset:2px}

/* reCAPTCHA atribucijos eilutė (rodoma tik kai integracija įjungta). */
.xform .form-fine{margin:var(--space-20) 0 0;color:var(--muted);font-size:var(--text-sm)}
.xform .form-fine a{color:var(--accent)}

/* Kai forma jau buvo išsiųsta su klaidomis, kiekvienam laukui rezervuojama
   vieta klaidos eilutei, o pati eilutė pozicionuojama absoliučiai.
   Be to ištaisius vieną lauką jo pranešimas dingsta, visas turinys žemiau
   pašoka apie 28px aukštyn, ir jei naudotojas tuo metu spaudžia sutikimo
   langelį - paspaudimas prašauna (mousedown įvyksta, mouseup jau ne).
   Pradinėje būsenoje niekas nesikeičia, todėl maketas lieka toks pat. */
.wpcf7 form.invalid .field .wpcf7-form-control-wrap,
.wpcf7 form.unaccepted .field .wpcf7-form-control-wrap,
.wpcf7 form.invalid .grid2 .field .wpcf7-form-control-wrap,
.wpcf7 form.unaccepted .grid2 .field .wpcf7-form-control-wrap{
  position:relative;padding-bottom:1.6rem
}
.wpcf7 form.invalid .wpcf7-not-valid-tip,
.wpcf7 form.unaccepted .wpcf7-not-valid-tip{
  position:absolute;left:0;bottom:0;margin:0
}