/* ==========================================================
   atvyk.lt - titulinis ir uzsakymo forma.
   Kvietimu isvaizda cia NEGYVENA: ji yra temos/*.css, o
   struktura - sablonai/_karkasas.html. Sitas failas tik
   apie svetaine, kuri kvietimus parduoda.
   ========================================================== */

@font-face { font-family:'Playfair Display'; src:url('fonts/playfair-latin-ext.woff2') format('woff2'); font-weight:400 500 600; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Playfair Display'; src:url('fonts/playfair-latin.woff2') format('woff2');     font-weight:400 500 600; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'Fraunces'; src:url('fonts/fraunces-latin-ext.woff2') format('woff2'); font-weight:400 500 600; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Fraunces'; src:url('fonts/fraunces-latin.woff2') format('woff2');     font-weight:400 500 600; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'Inter'; src:url('fonts/inter-latin-ext.woff2') format('woff2'); font-weight:400 500 600; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Inter'; src:url('fonts/inter-latin.woff2') format('woff2');     font-weight:400 500 600; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'Cinzel'; src:url('fonts/cinzel-latin-ext.woff2') format('woff2'); font-weight:400 900; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Cinzel'; src:url('fonts/cinzel-latin.woff2') format('woff2');     font-weight:400 900; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'Cormorant Garamond'; src:url('fonts/cormorant-latin-ext.woff2') format('woff2'); font-weight:300 400; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Cormorant Garamond'; src:url('fonts/cormorant-latin.woff2') format('woff2');     font-weight:300 400; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'Boska'; src:url('fonts/boska-latin-ext.woff2') format('woff2'); font-weight:200 900; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Boska'; src:url('fonts/boska-latin.woff2') format('woff2');     font-weight:200 900; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'Bodoni Moda'; src:url('fonts/bodoni-latin-ext.woff2') format('woff2'); font-weight:400 600; font-style:normal; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Bodoni Moda'; src:url('fonts/bodoni-latin.woff2') format('woff2');     font-weight:400 600; font-style:normal; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'Bodoni Moda'; src:url('fonts/bodoni-italic-latin-ext.woff2') format('woff2'); font-weight:400 600; font-style:italic; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Bodoni Moda'; src:url('fonts/bodoni-italic-latin.woff2') format('woff2');     font-weight:400 600; font-style:italic; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'Italianno'; src:url('fonts/italianno-latin-ext.woff2') format('woff2'); font-weight:400; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'Italianno'; src:url('fonts/italianno-latin.woff2') format('woff2');     font-weight:400; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family:'JetBrains Mono'; src:url('fonts/jetbrains-mono-latin-ext.woff2') format('woff2'); font-weight:400 500; font-display:swap; unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family:'JetBrains Mono'; src:url('fonts/jetbrains-mono-latin.woff2') format('woff2');     font-weight:400 500; font-display:swap; unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

:root {
  --paper:   #f5f3ef;   /* neutralus siltai pilkas - galerijos siena */
  --smelis:  #eae6de;   /* greige juosta; be geltonumo, kad netrukdytu
                           nei rozinems, nei melynoms miniatiuroms */
  --card:    #fffefb;
  --ink:     #16181a;
  --dim:     #5b5f60;
  /* Akcentu SAMONINGAI tik du: royal green veiksmui, auksas plonoms
     linijoms. Buve terakota/vynas/melsva/rausva ismesti 2026-08-10 -
     ju kaitaliojimasis darė puslapi marga, o prabanga yra santurumas. */
  --royal:   #1d4634;   /* royal green - pagrindinis akcentas */
  --royal-t: #12301f;   /* tamsesnis, uzvedus pele */
  --auksas:  #a8874c;   /* plonos linijos, smulkūs zenklai */
  --krema:   #f2efe8;   /* tekstas ant tamsiai zalio */
  --lapai:   #6f7f63;   /* eukalipto sakelems */
  /* Cinzel - graviruotos romenu kapiteles (jos pasirinkimas 2026-08-11:
     Bodoni rutuliukai jai skaitesi neaiskiai). Cinzel turi TIK didziasias
     ir neturi kursyvo, todel h1/h2 kursyviniai akcentai piesiami
     Cormorant Garamond kursyvu - kapiteles + rasto kursyvas yra
     klasikine „Vogue" pora. Bodoni Moda ir Boska lieka atsargoje. */
  --antraste: 'Cinzel', 'Boska', Georgia, serif;

  --line:    rgba(22,24,26,.14);
  --ease:    cubic-bezier(.22,1,.36,1);
  --shadow:  0 18px 40px -18px rgba(30,42,34,.34);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  /* sakeles samoningai kysa uz lapo krasto (right:-34px) ir viduriniuose
     plociuose darydavo horizontalia slinkti; clip nukerpa be slinkties
     ir, kitaip nei hidden, nekuria scroll konteinerio - sticky navigacija
     lieka gyva */
  overflow-x: clip;
}

.wrap   { width: min(1440px, 94vw); margin: 0 auto; }
.narrow { width: min(660px, 89vw);  margin: 0 auto; }

a { color: var(--royal); }

/* ---------- virsus ---------- */

/* GLAUSTAS hero - kategoriju puslapiams, kur svarbiausia ne ispudis, o
   kad sablonai butu matomi kuo greiciau. Trys skirtumai nuo titulinio:
   mazesnis oras, mazesne antraste ir platesne jos eilute.
   `max-width: 18ch` yra butent tai, kas „Diena, kai svenciamas" lauze i
   dvi eilutes - cia jos leidziam 26ch, ir antraste stoja i dvi. */
header.glaustas { padding: 44px 0 52px; }

header.glaustas h1 {
  font-size: clamp(28px, 3.8vw, 43px);
  max-width: 26ch;
  margin: 0 auto;
}

/* Platesne eilute - tas pats tekstas sugula i tris eilutes vietoj
   keturiu, ir hero sutrumpeja dar per viena eilute. `margin: 0 auto`
   butinas: be jo blokas lieka prispaustas prie kaires, o centruotas
   atrodo tik jo tekstas. */
header.glaustas .lead { padding-top: 18px; max-width: 52ch; margin: 0 auto; }
header.glaustas .btns { margin-top: 26px; }

header {
  position: relative;
  overflow: hidden;
  /* daugiau oro nei skiltyse: pirmas ispudis turi kvepuoti */
  padding: 72px 0 88px;
  background:
    radial-gradient(46% 52% at 84% 20%, rgba(29,70,52,.07), transparent 70%),
    radial-gradient(40% 46% at 8% 86%, rgba(176,101,63,.06), transparent 70%);
}

/* auksine daugiakampio linija - motyvas is spausdintu kvietimu */
.frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  stroke: var(--auksas);
  fill: none;
  opacity: .34;
}

.mark {
  font-family: var(--antraste);
  font-size: 13px;
  letter-spacing: .4em;
  text-transform: uppercase;
  color: var(--royal);
  margin: 0 0 24px;
}

.mark a { text-decoration: none; color: inherit; }

/* Butiko mastelis: antraste didele ir PLONA (Boska 340), ne vidutine ir
   pusjuode - mastelio kontrastas tarp dideles antikvos ir smulkiu
   isretintu uzrasu ir yra tai, kas skaitosi kaip prabanga. */
/* Cinzel kapiteles uzima daugiau plocio nei mazosios, todel dydis
   mazesnis nei buvo su Bodoni, o isretinimas teigiamas - suspaustos
   kapiteles atrodo kaip klaida */
h1 {
  font-family: var(--antraste);
  font-weight: 400;
  font-size: clamp(30px, 4.6vw, 54px);
  line-height: 1.18;
  letter-spacing: .04em;
  margin: 0;
  max-width: 18ch;
}

/* 18ch dezute siauresne uz .narrow, ir be auto pariciu ji stovi
   kaireje - tekstas centruojasi JOJE, tad puslapyje atrodo pastumtas
   (issmatuota: 680 vietoj 720). Liecia tik centruotas antrastes;
   uzsakymo puslapio kaireje lygiuota antraste turi `.narrow` be
   `.wrap`, tad lieka savo vietoje. */
header .wrap.narrow h1 { margin-left: auto; margin-right: auto; }

/* Cinzel kursyvo netura - akcentas piesiamas Cormorant kursyvu.
   1.06em kompensuoja tai, kad mazosios optiskai mazesnes uz kapiteles. */
h1 em {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 1.06em;
  letter-spacing: 0;
  text-transform: none;
  color: var(--royal);
}

/* pagalbinis balsas - serif, kaip paciuose kvietimuose; auksine
   plaukeline linija atskiria antraste nuo teksto */
.lead {
  color: var(--dim);
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: 19.5px;
  line-height: 1.55;
  max-width: 44ch;
  margin: 0;
  padding-top: 26px;
}

.lead::before {
  content: "";
  display: block;
  width: 44px;
  height: 1px;
  background: var(--auksas);
  margin-bottom: 26px;
}

/* centruotose antrastese (vestuves, kitos-sventes, uzsakymas,
   konfiguratorius - visur .narrow) linija irgi centre */
.narrow .lead { margin-left: auto; margin-right: auto; }
.narrow .lead::before { margin-left: auto; margin-right: auto; }

.btns { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 30px; }

/* butiko mygtukas: smulkus isretintas caps, statmeni kampai -
   suapvalinti kampai ir 15px tekstas skaitesi kaip programele */
.btn {
  display: inline-block;
  padding: 16px 28px;
  border-radius: 0;
  text-decoration: none;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  border: 1px solid transparent;
  transition: transform .3s var(--ease), background .3s, border-color .3s;
}

.btn-main  { background: var(--royal); color: #fdf8f2; }
.btn-main:hover  { background: var(--royal-t); transform: translateY(-1px); }
.btn-ghost { border-color: var(--line); color: var(--ink); }
.btn-ghost:hover { border-color: var(--royal); transform: translateY(-1px); }

/* ---------- skiltys ---------- */

/* Oras yra pigiausia prabangos priemone: 54px tarpai skaitesi kaip
   katalogas, ne kaip butikas. Telefone kiek mažiau, kad puslapis
   nepavirstu vien slinkimu. */
section { padding: clamp(64px, 9vw, 104px) 0; border-top: 1px solid var(--line); }

/* glaustos skiltys - pagalbinis turinys, kuris neturi valgyti pilno
   ekrano ir stumti prekiu zemyn */
section.glausta { padding: clamp(36px, 5vw, 56px) 0; }

h2 {
  font-family: var(--antraste);
  font-weight: 400;
  font-size: clamp(21px, 3vw, 29px);
  letter-spacing: .05em;
  margin: 0 0 10px;
}

/* paantrastes kursyvine antikva - tas pats registras, kuriuo kalba
   kvietimai; Inter cia skambejo kitu balsu nei pats produktas */
/* 66ch, ne 52ch: Cormorant 19px yra smulkus, ir siauresne juosta ilgesni
   tekstai virsdavo „eilerascio stulpeliu" (jos pastaba 2026-08-11) */
.sub {
  color: var(--dim);
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 19px;
  /* 1.75, ne 1.55: kursyvinis Cormorant su ankstu tarpu atrodo
     sugrustas (jos pastaba 2026-08-11) */
  line-height: 1.75;
  margin: 0 0 30px;
  max-width: 66ch;
}

p { color: var(--dim); }

/* ==========================================================
   Sablonu katalogas
   ========================================================== */

/* 210px -> i 1020px juosta telpa lygiai KETURIOS kategorijos vienoje
   eiluteje (4x210 + 3x18 = 894). Penktos nebededam samoningai: penki
   telefonai reikalautu ~1500px, o tada peržiūros taptu neiskaitomos. */
.sablonai {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 40px 26px;
}

/* Telefonai stovi TIESIAI ant galerijos sienos - baltos korteles su
   remeliais skaitesi kaip elektronikos parduotuve. Gyli duoda pacios
   perziuros seselis, ne dezute aplink ja. */
/* Flex stulpelis + `.sablonas-info { margin-top: auto }`: kortelės
   vienoje eileje yra vienodo aukscio (grid stretch), tad parasa
   prisegam prie APACIOS. Kitaip karuseles taskeliai (juos turi tik
   kelios kortelės) nustumia „Uzsakyti sita" zemyn ir gretimu korteliu
   mygtukai stovi skirtingame aukstyje. */
.sablonas {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  transition: transform .35s var(--ease);
}

.sablonas:hover { transform: translateY(-4px); }

/* be remelio fokusas turi buti piesiamas atskirai, kitaip klaviatura
   naviguojantis zmogus nemato, kur yra */
.sablonas:focus-visible { outline: 2px solid var(--royal); outline-offset: 6px; }

.juostele { transition: box-shadow .35s var(--ease); }

.sablonas:hover .juostele {
  box-shadow: 0 10px 22px -12px rgba(0,0,0,.55),
              0 0 0 1px rgba(255,255,255,.06) inset;
}

/* --- miniatiura: tikras sablono virselis, tik mazas ---
   Spalvos ir sriftai imami is tu paciu reiksmiu, kaip temos/*.css,
   tad katalogas rodo, kaip kvietimas is tikruju atrodo. */

/* Miniatiura - telefono EKRANAS be korpuso: juodo apvado nera, forma
   pasakoma proporcija (190x400 ~ 0.47, kaip tikro telefono) ir apvaliais
   kampais. Su apvadu kortele atrode kaip prietaisas vitrinoje, o mums
   svarbu, kad matytusi pats kvietimas. */
.perziura {
  /* Fiksuotas dydis VISOSE kortelese - nuo jo priklauso mastelis
     apacioje, o jei remas keistusi kartu su stulpeliu, tektu mastelį
     perskaiciuoti JS'u per kiekviena resize. */
  /* Aukstis kintamuoju: nuo jo priklauso ir kadro proporcija
     (`generuok_perziuras.py` fotografuoja 390x821, t. y. 190x400 x2).
     Buvo irasytas 400px dviejose vietose, tad pakeitus viena ekranas
     nukirpdavo maketa. */
  --ekrano-aukstis: 400px;
  width: 190px;
  height: var(--ekrano-aukstis);
  flex: 0 0 190px;
  position: relative;
  overflow: hidden;
  background: var(--p-bg);
  color: var(--p-ink);
  /* seselio ir remo nebera - juos dabar nesa .juostele korpusas */
  border-radius: 20px;
}

.perziura::before {
  content: "";
  position: absolute;
  inset: -30% -20% auto -30%;
  height: 140%;
  background: var(--p-fx);
  pointer-events: none;
}

/* Sablono virselis - nuotrauka is `media/perziuros/`, pagaminta
   `generuok_perziuras.py` is to paties demo puslapio.

   Anksciau cia stovejo <iframe> su VISU kvietimu. Kataloge ju yra
   penkiasdesimt su virsum, tad narsykle krove penkiasdesimt pilnu
   svetainiu; kol jos krovesi, kortele rode piesta pakaitala, ir vaizdas
   persimesdavo zmogui pries akis. Kelimo eile dabar tvarko pati narsykle
   per `loading="lazy"`, o po nuotrauka lieka temos fonas ir `::before`,
   tad kortele nebuna tuscia nė akimirkos. */
.p-foto {
  position: absolute;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  /* kortele yra nuoroda - paveikslas neturi gaudyti paspaudimu */
  pointer-events: none;
  -webkit-user-drag: none;
}

/* Katalogo puslapiuose tinklelis ribojamas iki keturiu stulpeliu:
   septynios korteles tada gula 4+3, o ne 5+2 su tuscia skyle gale. */
.sablonai-4 {
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  max-width: 1100px;
  margin-inline: auto;
}

/* ---------- kategorijos juosta ----------
   Kategorijoje gali buti keli sablonai (vestuvese ju septyni). Rodom po
   viena, o juosta pati pasistumia - taip is karto matosi, kad po kortele
   slepiasi ne vienas dizainas. Vienintelis sablonas nesistumdo. */

/* Karuseles konteineris yra ir telefono KORPUSAS (jos prasymas
   2026-08-11: be remo miniatiura - „tuscias paveiksliukas").
   Remas dedamas cia, o ne ant .perziura: ekranas PRIVALO likti
   190px, nes nuo jo skaiciuojasi iframe mastelis, o border su
   border-box ji suspaustu. Matomas langas = 202 - 2x6 = 190. */
.juostele {
  width: 202px;
  padding: 6px;
  margin: 20px auto 0;
  overflow: hidden;
  position: relative;
  /* Juodas remas, bet NEUTRALUS: buves #2a2724 turejo rudumo ir ant
     royal green atrode purvinai rudas. Sidabras irgi atmestas
     (jos sprendimai 2026-08-11). Seselis minimalus - remas remiasi
     i fona, o ne kabo virs jo. */
  background: linear-gradient(160deg, #24262a, #0d0e10);
  border-radius: 26px;
  box-shadow: 0 6px 16px -10px rgba(0,0,0,.45),
              0 0 0 1px rgba(255,255,255,.06) inset;
}

/* Nurimus karuselei gretimos skaidres paslepiamos: esant Windows
   masteliui 125% skaidres riba gula ant dalinio pikselio ir pro
   sujungima prasisviecia gretimos (pvz., baltos) skaidres krastas.
   Uzdelsimas .8s - ilgiau nei takelio .7s perejimas, tad SLENKANT
   abi skaidres matomos, o pasislepia tik nurimus. Klase nuimta -
   skaidre matoma IS KARTO (bazinis .perziura perejimu neturi). */
.perziura.toli { visibility: hidden; transition: visibility 0s .8s; }

/* garsiakalbio ruozelis - be jo remas tik juodas staciakampis */
.juostele::after {
  content: "";
  position: absolute;
  top: 13px;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 4px;
  border-radius: 2px;
  background: rgba(255,255,255,.16);
  z-index: 2;
  pointer-events: none;
}

.juostele-takelis {
  display: flex;
  transition: transform .7s var(--ease);
  will-change: transform;
}

/* Taskeliai PASLEPTI (jos sprendimas 2026-08-11): ka jie sake - kad
   sablonas turi kelias spalvas - dabar pasako zenkliukas ant telefono
   („5 spalvos") ir parasas tituliniame („5 dizainai"). Skaidres
   toliau slenka pacios; skriptas taskelius vis dar zymi, tad grazinti
   uztenka isimti `display: none`. */
.taskai {
  display: none;
  gap: 5px;
  justify-content: center;
  margin-top: 12px;
}

.taskas {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(22,24,26,.22);
  transition: background .35s var(--ease), transform .35s var(--ease);
}

.taskas.yra { background: var(--royal); transform: scale(1.35); }

@media (prefers-reduced-motion: reduce) {
  .juostele-takelis { transition: none; }
}

/* Parasas po telefonu - kaip etikete galerijoje: centruotas, smulkus
   isretintas caps pavadinimui, kursyvas smulkmenoms */
.sablonas-info { padding: 18px 6px 0; text-align: center; margin-top: auto; }

.sablonas-info b {
  display: block;
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: .26em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

.sablonas-info small {
  color: var(--dim);
  font-size: 13.5px;
  line-height: 1.6;
  display: block;
  max-width: 30ch;
  margin: 0 auto;
}

/* „7 dizainai" - kursyvine pastaba po pavadinimu, ne zalias burbulas */
.sablonas-info .skaicius {
  display: block;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 14.5px;
  font-weight: 400;
  letter-spacing: .02em;
  text-transform: none;
  color: var(--auksas);
  margin: 4px 0 0;
}

.sablonas-info em {
  display: block;
  margin-top: 12px;
  font-style: normal;
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--royal);
}

.sablonas:hover .sablonas-info em { text-decoration: underline; text-underline-offset: 4px; }

/* „Pasimatuok" - antras veiksmas korteleje: kelias i konfiguratoriu.
   Kortele pati yra <a>, tad tikro <a> vidun deti negalima - span'a
   veda puslapio skriptas. Prislopintas, kad nesivarzytu su
   pagrindiniu „Ziureti pavyzdi". */
.sablonas-info .pasimatuok {
  display: inline-block;
  margin-top: 10px;
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--dim);
  border-bottom: 1px solid var(--line);
  padding-bottom: 2px;
  cursor: pointer;
}

.sablonas-info .pasimatuok:hover,
.sablonas-info .pasimatuok:focus-visible {
  color: var(--royal);
  border-color: currentColor;
}

/* „Ziureti pavyzdi" persikele ANT telefono (jos sprendimas 2026-08-11):
   po kortele buvo susikaupusios trys eilutes teksto, o miniatiura ir
   taip yra nuoroda i pavyzdi - uzrasas tik padaro tai matoma.
   Taikoma TIK kortelems, vedancioms i demo: tituliniame dalis korteliu
   veda i kategoriju puslapius, ten toks uzrasas meluotu. */
a.sablonas[href^="demo/"] .juostele::before {
  content: "Žiūrėti pavyzdį";
  position: absolute;
  inset: 6px;
  z-index: 3;
  border-radius: 20px;
  display: grid;
  place-items: center;
  background: rgba(12,14,16,.5);
  color: #fbfaf6;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 10.5px;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  pointer-events: none;
  opacity: 0;
  transition: opacity .3s var(--ease);
}

a.sablonas[href^="demo/"]:hover .juostele::before,
a.sablonas[href^="demo/"]:focus-visible .juostele::before { opacity: 1; }

/* „5 spalvos" - irgi ANT telefono, virsutiniame krašte: po kortele ji
   nustumdavo „Uzsakyti sita" zemyn ir gretimu korteliu mygtukai
   nebesilygiuodavo. Tamsi plevele su kreminiu tekstu skaitosi ir ant
   sviesiu, ir ant tamsiu virseliu. Skaiciu deda skriptas is
   sablonai.js - ranka jo niekur nerasom. */
.spalvu-zenklas {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 4;
  padding: 4px 9px;
  background: rgba(12,14,16,.55);
  color: #fbfaf6;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  pointer-events: none;
}

/* eilute po kortele nebereikalinga - ji dabar ant telefono */
a.sablonas[href^="demo/"] .sablonas-info em { display: none; }

/* LIECIAMUOSE ekranuose uzvedimo NERA, tad uzrasas rodomas visada -
   bet tik plona juostele apacioje, kad neuzdengtu viso virselio */
@media (hover: none) {
  a.sablonas[href^="demo/"] .juostele::before {
    inset: auto 6px 6px;
    border-radius: 0 0 20px 20px;
    padding: 11px 0;
    background: rgba(12,14,16,.7);
    opacity: 1;
  }
}

/* Tituliniame trys korteles veda i kategoriju puslapius („Ziureti
   vestuviu sablonus"), o Imones - tiesiai i demo. Vienoje eileje jos
   turi atrodyti VIENODAI, tad ten uzrasas ant telefono isjungiamas ir
   tekstas lieka po kortele. Atrankiklis ilgesnis TYCIA: turi nusverti
   auksciau esanti `a.sablonas[href^="demo/"]` (specifiskumas 0,3,2). */
.juosta-sablonai a.sablonas[href^="demo/"] .juostele::before { content: none; }
.juosta-sablonai a.sablonas[href^="demo/"] .sablonas-info em { display: block; }

/* „Uzsakyti sita" - kelias tam, kas nori sablono TOKIO, koks yra, be
   jokio spalvu matavimo (jos pastaba 2026-08-11: to kelio truko).
   Ryskesnis uz „Pasimatuok": tai pagrindinis veiksmas, o matavimas -
   neprivalomas zingsnis. */
.sablonas-info .uzsakyk {
  display: inline-block;
  margin-top: 12px;
  padding: 7px 15px;
  border: 1px solid var(--royal);
  color: var(--royal);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  cursor: pointer;
}

.sablonas:hover .uzsakyk,
.sablonas-info .uzsakyk:focus-visible {
  background: var(--royal);
  color: #fdf8f2;
}

/* Tarp dvieju veiksmu - tarpas: be jo pasimatavimo pabraukimas
   remiasi tiesiai i uzsakymo remeli. */
.sablonas-info .pasimatuok { margin-right: 14px; vertical-align: middle; }
.sablonas-info .uzsakyk { vertical-align: middle; }

/* Telefone veiksmai sustatomi stulpeliu - vienoje eiluteje jie
   susigrudo, o ir pirstu pataikyti buvo sunku (jos pastaba 2026-08-17). */
@media (max-width: 700px) {
  .sablonas-info .pasimatuok {
    display: block;
    width: fit-content;
    margin: 16px auto 0;
  }
  .sablonas-info .uzsakyk {
    display: block;
    width: fit-content;
    margin: 14px auto 0;
    padding: 9px 22px;
  }

  /* Katalogas telefone - PO DU stulpelius (jos prasymas 2026-08-17).
     Telefonelis mazinamas VISUR SUDERINTAI: remas 156 = perziura 146
     + 2x5 padding. Aukstis laiko proporcija 400/190 - nuotrauka
     `object-fit: cover`, tad nukrypus proporcijai ji butu apkarpyta.
     Titulinio juostos (.juosta-sablonai) sitos taisykles neliecia -
     ji turi savas, aukstesnio specifiskumo. */
  .sablonai {
    grid-template-columns: 1fr 1fr;
    gap: 30px 12px;
  }
  .juostele {
    width: 156px;
    padding: 5px;
    border-radius: 22px;
  }
  .perziura {
    --ekrano-aukstis: 308px;
    width: 146px;
    flex: 0 0 146px;
    border-radius: 17px;
  }

  .sablonas-info { padding-top: 12px; }
  .sablonas-info b { font-size: 12px; }
}

/* --- kiekvienos temos miniatiuros spalvos --- */

/* Pilis - sviesus kreminis lapas su salavijo rasalu ir pudrine roze.
   `--p-fx` cia svelnus dangaus atspindys vidury, kaip pacio kvietimo
   virselyje. */
.t-vestuves-pilis {
  --p-bg: #f4f1e8; --p-ink: #3b4038; --p-dim: #7a7f72; --p-akc: #c2a1a1;
  --p-serif: var(--antraste);
  --p-amp-size: .5em;
  --p-fx: radial-gradient(52% 40% at 50% 40%, rgba(160,182,196,.20), transparent 72%);
}

/* Pilis · Levanda - tas pats kreminis lapas, tik rasalas ir dekoras
   sodresni, alyviniai - ne pastele. */
.t-vestuves-levanda {
  --p-bg: #f5f1ec; --p-ink: #3d3548; --p-dim: #7d7286; --p-akc: #a97fc9;
  --p-serif: var(--antraste);
  --p-amp-size: .5em;
  --p-fx: radial-gradient(52% 40% at 50% 40%, rgba(138,107,176,.22), transparent 72%);
}

/* Santorinis - vienintele vestuviu tema, kurios miniatiura yra MELYNA.
   Ji katalogo juostoje ir turi issiskirti: visos kitos yra kreminės. */
.t-vestuves-santorinis {
  --p-bg: #f8f7f3; --p-ink: #1b3252; --p-dim: #6b7d94; --p-akc: #c2557e;
  --p-serif: var(--antraste);
  --p-amp-size: .5em;
  --p-fx: radial-gradient(52% 40% at 50% 40%, rgba(44,83,132,.20), transparent 72%);
}

.t-vestuves-bordo {
  --p-bg: #f7f1e7; --p-ink: #6d1f2c; --p-dim: #6f625b; --p-akc: #b08d4f;
  --p-serif: var(--antraste);
  --p-amp-size: .38em;
  --p-fx: radial-gradient(44% 34% at 50% 46%, rgba(109,31,44,.16), transparent 70%);
}

/* Vienintele TAMSI miniatiura kataloge - kitos visos ant popieriaus.
   Del to `--p-ink` cia kreminis, o ne rasalo spalvos. */
.t-vestuves-royal-green {
  --p-bg: #10261c; --p-ink: #f2ead9; --p-dim: rgba(242,234,217,.55); --p-akc: #c6a664;
  --p-serif: 'Cinzel', var(--antraste);
  --p-amp-size: .34em;
  --p-amp-font: 'Cormorant Garamond', Georgia, serif;
  --p-caps: uppercase;
  --p-fx: radial-gradient(46% 36% at 50% 42%, rgba(198,166,100,.22), transparent 70%);
}


/* Antra tamsi miniatiura - tamsiai ruda su kreminiu tekstu. Tas pats
   sprendimas del `--p-ink` ir isretinimo kaip royal-green virsuje. */
.t-vestuves-browny {
  --p-bg: #2a1b13; --p-ink: #fbf5ec; --p-dim: rgba(251,245,236,.55); --p-akc: #c79a68;
  --p-serif: 'Boska', var(--antraste);
  --p-weight: 300;
  --p-amp-size: .5em;
  --p-amp-font: 'Italianno', cursive;
  --p-amp-italic: normal;
  --p-caps: uppercase;
  --p-fx: radial-gradient(46% 36% at 50% 40%, rgba(199,154,104,.24), transparent 70%);
}

/* Karalisko ir Sakeles spalvu variantai korteliu karuselems - TIK
   paletes: skaidre gauna DVI klases (baze + variantas), isdestyma ir
   sriftus duoda bazine tema, variantas perraso tik kintamuosius.
   Spalvos imtos is temu css :root (bg / ink / akcentas). */
.t-vestuves-royal-black { --p-bg: #0e0e0e; --p-ink: #f4f1ea; --p-dim: rgba(244,241,234,.55); --p-akc: #c6a664; }
.t-vestuves-royal-grey  { --p-bg: #4a4a4e; --p-ink: #f6f3f1; --p-dim: rgba(246,243,241,.55); --p-akc: #cc819a; }
.t-vestuves-royal-rose  { --p-bg: #cc819a; --p-ink: #fff9f6; --p-dim: rgba(255,249,246,.6);  --p-akc: #211519; }
.t-vestuves-royal-white { --p-bg: #f7f3ea; --p-ink: #1d1a15; --p-dim: rgba(29,26,21,.55);   --p-akc: #a8863c; }
.t-vestuves-browny-balta  { --p-bg: #fbfaf7; --p-ink: #24201c; --p-dim: rgba(36,32,28,.55);    --p-akc: #b08d4f; }
.t-vestuves-browny-juoda  { --p-bg: #0c0c0c; --p-ink: #f3f1ec; --p-dim: rgba(243,241,236,.55); --p-akc: #c9a961; }
.t-vestuves-browny-pilka  { --p-bg: #4b4a4d; --p-ink: #f6f4f3; --p-dim: rgba(246,244,243,.55); --p-akc: #e2a7b8; }
.t-vestuves-browny-rozine { --p-bg: #cc819a; --p-ink: #ffffff; --p-dim: rgba(255,255,255,.7);  --p-akc: #f2dcae; }

/* Grafitas - juodas lapas ir plona rasysena. Pakaitalas matomas tik
   sekunde, kol uzsikrauna kadras, tad uztenka juodo popieriaus ir
   sviesaus rasalo. */
.t-vestuves-grafitas {
  --p-bg: #101010; --p-ink: #f1eeea; --p-dim: rgba(241,238,234,.55); --p-akc: #e7e2db;
  --p-serif: 'Italianno', cursive;
  --p-amp-size: .42em;
  --p-amp-italic: normal;
  --p-fx: radial-gradient(46% 36% at 50% 40%, rgba(231,226,219,.12), transparent 70%);
}

/* Portretas - juoda miniatiura su rasytiniais vardais, kaip kvietimo
   virselyje ant nuotraukos. Italianno smulkiu dydziu neiskaitomas, tad
   vardai cia stambesni, o eilutes suspaustos kaip paciame virselyje. */
.t-vestuves-portretas {
  --p-bg: #121110; --p-ink: #ece7de; --p-dim: rgba(236,231,222,.55); --p-akc: #d9d0bf;
  --p-serif: 'Italianno', cursive;
  --p-amp-size: .4em;
  --p-amp-italic: normal;
  --p-fx: radial-gradient(46% 36% at 50% 40%, rgba(217,208,191,.14), transparent 70%);
}

/* Monograma - vienintele tema be spalvos: juoda ant sviesiai pilko.
   Todel ir `--p-fx` cia beveik nematomas: bet koks spalvotas svytejimas
   sugriautu visa mintį. */
.t-vestuves-monograma {
  --p-bg: #f4f2ed; --p-ink: #12110f; --p-dim: #6b6a65; --p-akc: #12110f;
  --p-serif: 'Boska', var(--antraste);
  --p-weight: 300;
  --p-amp-size: .5em;
  --p-amp-font: 'Italianno', cursive;
  --p-amp-italic: normal;
  --p-caps: uppercase;
  --p-fx: radial-gradient(46% 36% at 50% 44%, rgba(18,17,15,.06), transparent 70%);
}

/* Vietoj sviesos demes - plonas remas, tas pats, kuris kvietime eina per
   visa lapa. */
.t-vestuves-monograma .perziura::before {
  inset: 10px;
  height: auto;
  background: none;
  border: 1px solid var(--p-ink);
  opacity: .4;
}

/* Trecia tamsi miniatiura - tamsiai melyna su auksu. Vardai didziosiomis
   ir isretinti, kaip pacioje temoje; jungtukas - smulkios auksines
   didziosios, ne kursyvas. */
.t-vestuves-royal-blue {
  --p-bg: #0a1630; --p-ink: #ece6da; --p-dim: rgba(236,230,218,.55); --p-akc: #c9a97a;
  --p-serif: 'Cormorant Garamond', Georgia, serif;
  --p-weight: 300;
  --p-caps: uppercase;
  --p-amp-size: .34em;
  --p-amp-italic: normal;
  --p-amp-track: .3em;
  --p-fx: radial-gradient(54% 30% at 22% 16%, rgba(3,8,22,.55), transparent 72%),
          radial-gradient(46% 26% at 80% 78%, rgba(3,8,22,.5), transparent 74%);
}

.t-vestuves-royal-blue { --p-ink: #ffffff; }

/* Auksines linijos virs ir po vardais - virselio zenklas, kuris ir
   miniatiuroje turi buti pirmas matomas dalykas. */
.t-vestuves-royal-blue .perziura::before {
  inset: auto 22px;
  top: 34%;
  height: 1px;
  background: var(--p-akc);
  opacity: .8;
}

/* --- monogramos spalvu variantai: tas pats isdestymas, kita palete --- */

.t-vestuves-monograma-auksas {
  --p-bg: #faf8f4; --p-ink: #12110f; --p-dim: #6d6a63; --p-akc: #a8874c;
  --p-serif: 'Boska', 'Playfair Display', Georgia, serif;
  --p-weight: 300;
  --p-caps: uppercase;
  --p-amp-size: .5em;
  --p-amp-font: 'Italianno', cursive;
  --p-amp-italic: normal;
  --p-mono: 'JetBrains Mono', ui-monospace, monospace;
  --p-fx: none;
}

.t-vestuves-monograma-auksas .perziura::before { inset: 10px; height: auto; background: none; border: 1px solid var(--p-akc); opacity: .5; }

.t-vestuves-monograma-juoda {
  --p-bg: #111110; --p-ink: #f6f4f0; --p-dim: rgba(246,244,240,.55); --p-akc: #c8a55f;
  --p-serif: 'Boska', 'Playfair Display', Georgia, serif;
  --p-weight: 300;
  --p-caps: uppercase;
  --p-amp-size: .5em;
  --p-amp-font: 'Italianno', cursive;
  --p-amp-italic: normal;
  --p-mono: 'JetBrains Mono', ui-monospace, monospace;
  --p-fx: none;
}

.t-vestuves-monograma-juoda .perziura::before { inset: 10px; height: auto; background: none; border: 1px solid var(--p-akc); opacity: .5; }

.t-vestuves-monograma-pilka {
  --p-bg: #57575a; --p-ink: #ffffff; --p-dim: rgba(255,255,255,.6); --p-akc: #e7b9b3;
  --p-serif: 'Boska', 'Playfair Display', Georgia, serif;
  --p-weight: 300;
  --p-caps: uppercase;
  --p-amp-size: .5em;
  --p-amp-font: 'Italianno', cursive;
  --p-amp-italic: normal;
  --p-mono: 'JetBrains Mono', ui-monospace, monospace;
  --p-fx: none;
}

.t-vestuves-monograma-pilka .perziura::before { inset: 10px; height: auto; background: none; border: 1px solid var(--p-akc); opacity: .5; }

.t-vestuves-monograma-rozine {
  --p-bg: #cc819a; --p-ink: #ffffff; --p-dim: rgba(255,255,255,.72); --p-akc: #ffe9cf;
  --p-serif: 'Boska', 'Playfair Display', Georgia, serif;
  --p-weight: 300;
  --p-caps: uppercase;
  --p-amp-size: .5em;
  --p-amp-font: 'Italianno', cursive;
  --p-amp-italic: normal;
  --p-mono: 'JetBrains Mono', ui-monospace, monospace;
  --p-fx: none;
}

.t-vestuves-monograma-rozine .perziura::before { inset: 10px; height: auto; background: none; border: 1px solid var(--p-akc); opacity: .5; }

.t-krikstynos {
  --p-bg: #f2f6f8; --p-ink: #2b2a28; --p-dim: #6f7b83; --p-akc: #b4785a;
  --p-serif: 'Fraunces', Georgia, serif;
  --p-amp-italic: normal; --p-amp-size: .36em;
  --p-fx: radial-gradient(38% 30% at 32% 40%, rgba(150,190,214,.40), transparent 70%),
          radial-gradient(34% 26% at 68% 58%, rgba(214,182,160,.34), transparent 70%);
}

/* .t-gimtadienis (Vaikiskas) istrinta 2026-08-11 kartu su sablonu */

/* Antras gimtadienio dizainas - svelnus, moteriskas: rasytinis vardas
   (Italianno) ir kapiteline paantraste, kaip paciame kvietime. */
.t-gimtadienis-fotojuosta {
  --p-bg: #ffffff; --p-ink: #43333a; --p-dim: #8d747c; --p-akc: #c25b7c;
  --p-serif: 'Italianno', cursive;
  --p-amp-font: 'Cormorant Garamond', Georgia, serif;
  --p-amp-italic: normal; --p-amp-size: .3em;
  --p-amp-caps: uppercase; --p-amp-track: .3em;
  --p-fx: radial-gradient(36% 30% at 32% 40%, rgba(194,91,124,.16), transparent 70%),
          radial-gradient(28% 24% at 70% 58%, rgba(194,91,124,.10), transparent 70%);
}


/* Likusios gimtadienio miniatiuros - paletes is temu css :root
   (bg / ink / akcentas), fx svyti akcento spalva */
.t-gimtadienis-polaroidas {
  --p-bg: #f7eee6; --p-ink: #5b3a41; --p-dim: rgba(91,58,65,.6); --p-akc: #d4808f;
  --p-fx: radial-gradient(36% 30% at 32% 40%, rgba(212,128,143,.18), transparent 70%);
}

.t-gimtadienis-disko {
  --p-bg: #faf1f8; --p-ink: #46264f; --p-dim: rgba(70,38,79,.6); --p-akc: #e0509b;
  --p-fx: radial-gradient(36% 30% at 34% 40%, rgba(224,80,155,.2), transparent 70%);
}

.t-gimtadienis-vienaragis {
  --p-bg: #fffafc; --p-ink: #4c3546; --p-dim: rgba(76,53,70,.6); --p-akc: #d9598e;
  --p-fx: radial-gradient(36% 30% at 32% 40%, rgba(217,89,142,.16), transparent 70%),
          radial-gradient(28% 24% at 70% 58%, rgba(155,135,207,.14), transparent 70%);
}

/* Vienaragio spalvu variantai - miniatiuru paletes. Fonas toks pat kaip
   kvietimo --bg, o rasalas ir akcentas imami is FONO kanalo: kortelėje
   matomas butent virselis, kuris guli ant fono, ne bloku tekstas. */
.t-gimtadienis-vienaragis-juoda {
  --p-bg: #000000; --p-ink: #f7eff5; --p-dim: rgba(247,239,245,.62); --p-akc: #ff9ec4;
  --p-fx: radial-gradient(36% 30% at 32% 40%, rgba(255,158,196,.22), transparent 70%);
}

.t-gimtadienis-vienaragis-oranzine {
  --p-bg: #985200; --p-ink: #fff6ea; --p-dim: rgba(255,246,234,.72); --p-akc: #ffc2d9;
  --p-fx: radial-gradient(36% 30% at 32% 40%, rgba(255,194,217,.18), transparent 70%);
}

.t-gimtadienis-vienaragis-zalia {
  --p-bg: #447e45; --p-ink: #fffdf6; --p-dim: rgba(255,253,246,.72); --p-akc: #ffeef5;
  --p-fx: radial-gradient(36% 30% at 32% 40%, rgba(255,238,245,.18), transparent 70%);
}

.t-gimtadienis-vienaragis-geltona {
  --p-bg: #f1f358; --p-ink: #2b2a10; --p-dim: rgba(43,42,16,.66); --p-akc: #a3123f;
  --p-fx: radial-gradient(36% 30% at 32% 40%, rgba(163,18,63,.16), transparent 70%);
}

.t-gimtadienis-voras {
  --p-bg: #fbfcfe; --p-ink: #232b45; --p-dim: rgba(35,43,69,.6); --p-akc: #cf3a30;
  --p-fx: radial-gradient(36% 30% at 34% 40%, rgba(207,58,48,.14), transparent 70%);
}

/* Viskis - vyriskas jubiliejus. Keturios paletes imtos TIESIAI is
   `temos/gimtadienis-viskis*.css`, kad miniatiura ir tikras kvietimas
   nesiskirtu. Trys tamsios, ketvirta (Smelis) sviesi - ji vienintele
   turi tamsu rasala. */
.t-gimtadienis-viskis {
  --p-bg: #000000; --p-ink: #ece4d6; --p-dim: rgba(236,228,214,.6); --p-akc: #c9a227;
  --p-serif: var(--antraste);
  --p-fx: radial-gradient(38% 30% at 36% 44%, rgba(201,162,39,.20), transparent 72%);
}

.t-gimtadienis-viskis-varis {
  --p-bg: #17181a; --p-ink: #e7e4de; --p-dim: rgba(231,228,222,.6); --p-akc: #bb7a3c;
  --p-serif: var(--antraste);
  --p-fx: radial-gradient(38% 30% at 36% 44%, rgba(187,122,60,.22), transparent 72%);
}

.t-gimtadienis-viskis-zalia {
  --p-bg: #0e1d17; --p-ink: #e9e6d9; --p-dim: rgba(233,230,217,.6); --p-akc: #c6a04a;
  --p-serif: var(--antraste);
  --p-fx: radial-gradient(38% 30% at 36% 44%, rgba(198,160,74,.20), transparent 72%);
}

.t-gimtadienis-viskis-smelis {
  --p-bg: #f4efe6; --p-ink: #2a231c; --p-dim: rgba(42,35,28,.62); --p-akc: #8a5a2b;
  --p-serif: var(--antraste);
  --p-fx: radial-gradient(38% 30% at 36% 44%, rgba(138,90,43,.16), transparent 72%);
}

/* Smokingas - vyriskas jubiliejus vakarinio kostiumo raktu. Trys
   paletes is `temos/gimtadienis-smokingas*.css`; visos tamsios, skiriasi
   tik metalas: auksas, sidabras ir melyna su auksu. */
.t-gimtadienis-smokingas {
  --p-bg: #08080a; --p-ink: #ece6da; --p-dim: rgba(236,230,218,.6); --p-akc: #cfa54f;
  --p-serif: var(--antraste);
  --p-fx: radial-gradient(38% 30% at 36% 44%, rgba(207,165,79,.20), transparent 72%);
}

.t-gimtadienis-smokingas-sidabras {
  --p-bg: #0b0b0c; --p-ink: #ecebe6; --p-dim: rgba(236,235,230,.6); --p-akc: #b9b5ab;
  --p-serif: var(--antraste);
  --p-fx: radial-gradient(38% 30% at 36% 44%, rgba(185,181,171,.18), transparent 72%);
}

.t-gimtadienis-smokingas-melyna {
  --p-bg: #0a1226; --p-ink: #e7e7ec; --p-dim: rgba(231,231,236,.6); --p-akc: #c8ab6a;
  --p-serif: var(--antraste);
  --p-fx: radial-gradient(38% 30% at 36% 44%, rgba(200,171,106,.20), transparent 72%);
}

/* Lelija (katalogas `gimtadienis-ametistas`) - tamsus vyno lapas su
   auksu; paleta is `temos/gimtadienis-ametistas.css`. */
.t-gimtadienis-lelija {
  --p-bg: #3a2029; --p-ink: #fbf4f5; --p-dim: rgba(251,244,245,.62); --p-akc: #c9a86a;
  --p-fx: radial-gradient(38% 30% at 36% 44%, rgba(201,168,106,.20), transparent 72%);
}

/* Vintazas - rudas pakavimo popierius, bordo rasalas; paleta is
   `temos/gimtadienis-vintazas.css`. */
.t-gimtadienis-vintazas {
  --p-bg: #cbb190; --p-ink: #33241a; --p-dim: rgba(51,36,26,.66); --p-akc: #7d2b2b;
  --p-fx: radial-gradient(38% 30% at 36% 44%, rgba(125,43,43,.16), transparent 72%);
}

.t-imones-vakarelis {
  --p-bg: #101214; --p-ink: #eceef0; --p-dim: #969ba1; --p-akc: #c8a45c;
  --p-serif: 'Inter', system-ui, sans-serif;
  --p-weight: 500;
  --p-mono: 'JetBrains Mono', ui-monospace, monospace;
  --p-amp-italic: normal; --p-amp-size: .24em; --p-amp-caps: uppercase; --p-amp-track: .3em;
  --p-amp-font: 'JetBrains Mono', ui-monospace, monospace;
  --p-fx: radial-gradient(40% 30% at 38% 46%, rgba(200,164,92,.20), transparent 72%);
}

/* ---------- ka gauni ---------- */

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
  border-radius: 3px;
  overflow: hidden;
}

.item { padding: 20px 22px 22px; background: var(--paper); }
.item b { display: block; font-weight: 500; margin-bottom: 5px; }
.item small { color: var(--dim); font-size: 14.5px; line-height: 1.6; }

/* ---------- eiga ---------- */

.steps { list-style: none; margin: 0; padding: 0; }

.steps li {
  display: grid;
  grid-template-columns: 40px 1fr;
  gap: 18px;
  padding: 17px 0;
  border-bottom: 1px solid var(--line);
}

.steps li:last-child { border-bottom: 0; padding-bottom: 0; }

/* Numeris, pavadinimas ir tekstas - TAS PATS registras kaip „ko
   popierinis negali" sarase auksciau: du numeruoti sarasai viename
   puslapyje skirtingais sriftais atrode kaip du skirtingi puslapiai
   (jos pastaba 2026-08-11). */
.steps span {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  color: var(--auksas);
  font-size: 17px;
  line-height: 1.5;
}

.steps b {
  display: block;
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.steps small {
  color: var(--dim);
  font-size: 15px;
  line-height: 1.6;
  display: block;
}

/* ---------- DUK ----------
   Sandara ir registras - TIKSLIAI kaip `.steps` zingsniu sarase:
   pavadinimas kapitelemis, tekstas Cormorant prislopintas, eilutes
   skiria plaukelines. Isskleidziamu `<details>` su pliusais atsisakyta
   (jos sprendimas 2026-08-11): atsakymai trumpi, tad slepti juos buvo
   tik papildomas paspaudimas ir dar vienas kitoks elementas puslapyje. */

.klausimas {
  padding: 17px 0;
  border-bottom: 1px solid var(--line);
}

.klausimas:last-child { border-bottom: 0; padding-bottom: 0; }

.klausimas b {
  display: block;
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--ink);
  margin-bottom: 4px;
}

.klausimas p {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: var(--dim);
}

/* Uzsakymo formos perziura: pasirinkto sablono demo mazesniame reme.
   Remas ir --matomas keiciami KARTU - mastelis skaiciuojamas is
   --matomas, ir jei jie nesutampa, kvietimas issikisa is remo. */
/* Variantu piliules formoje lygiuojamos KAIREJE per visa laukelio
   ploti: bazinis `.perjungiklis` yra centruotas ir tik 330px platus
   (jis skirtas hero telefonui), tad penkios piliules issibarstydavo
   ir paskutine nukrisdavo i vidurį po kitomis. */
#sab-variantai {
  justify-content: flex-start;
  max-width: none;
  margin-top: 10px;
}

.sab-perziura {
  display: grid;
  justify-items: center;
  gap: 14px;
  margin: 0 0 26px;
  order: -1;          /* siaurame ekrane - VIRS formos, ne jos gale */
}

.sab-perziura .telefonas-korpusas { width: 214px; padding: 7px; border-radius: 30px; }
.sab-perziura .telefonas-ekranas { --matomas: 200; --aukstis: 430px; border-radius: 24px; }
.sab-perziura .telefonas-korpusas::before { top: 15px; width: 44px; height: 4px; }

/* siaurame ekrane forma ir telefonas eina vienas po kitu */
.uzsakymo-tinklas { display: flex; flex-direction: column; }

@media (min-width: 1240px) {
  /* DU STULPELIAI, pora centruojama kaip visuma: `justify-content:
     center` centruoja abu kartu, tad kaireje ir desineje lieka
     vienodi tarpai. Formos stulpelis del to atsiduria kairiau
     puslapio vidurio - taip ir turi buti, telefonas yra jo pora. */
  .uzsakymo-tinklas {
    display: grid;
    grid-template-columns: min(660px, 58vw) 214px;
    gap: 52px;
    justify-content: center;
    align-items: start;
  }

  .uzsakymo-tinklas > section.narrow { width: auto; margin: 0; }

  /* Antraste stovi VIRS formos stulpelio, tad slenka kartu su juo:
     (52px tarpas + 214px telefonas) / 2 = 133px i kaire */
  body.uzsakymo-puslapis header .narrow {
    margin-left: calc(50% - 330px - 133px);
    margin-right: 0;
  }

  /* lipnus: pildant ilga forma telefonas lieka matomas */
  .sab-perziura {
    position: sticky;
    top: 104px;
    order: 0;
    margin: 0;
  }
}

/* ---------- pabaiga ---------- */

.end { text-align: center; }
.end .sub { margin-left: auto; margin-right: auto; }
.end .btns { justify-content: center; }

footer {
  padding: 30px 0 40px;
  border-top: 0;
  background: #142e22;
  text-align: center;
  color: rgba(242,239,232,.62);
  font-size: 13px;
}

footer a { color: #cfae6b; }

/* DUK isimtas is titulinio (per daug teksto), tad porasteje jis turi
   buti pastebimas - remelis, ne eilinis pilkas sakinys */
.footer-duk {
  display: block;
  width: fit-content;
  margin: 0 auto 16px;
  padding: 9px 18px;
  border: 1px solid rgba(207,174,107,.42);
  font-size: 10.5px;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
}

.footer-duk:hover { border-color: #cfae6b; }

/* ==========================================================
   Uzsakymo forma
   ========================================================== */

.field { margin-bottom: 18px; }

.field > label {
  display: block;
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--dim);
  margin-bottom: 8px;
}

/* Paaiskinimai - TAS PATS 15px Inter kaip visuose puslapio sarasuose;
   buvo 13.5px, tad forma atrode smulkesnio registro nei titulinis.
   `b` viduje - 500, ne narsykles numatytasis 700: visoje svetaineje
   pusjuodis yra 500. */
.field .hint { font-size: 15px; line-height: 1.6; color: var(--dim); margin: 0 0 8px; text-transform: none; letter-spacing: 0; }
.field .hint b { font-weight: 500; }

input, textarea, select {
  width: 100%;
  padding: 13px 14px;
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 3px;
  color: var(--ink);
  font: inherit;
  font-size: 15px;
  transition: border-color .3s;
}

input:focus, textarea:focus, select:focus {
  outline: 2px solid transparent;
  border-color: var(--royal);
  box-shadow: 0 0 0 3px rgba(29,70,52,.20);
}

fieldset { border: 0; margin: 0 0 18px; padding: 0; }

fieldset > legend {
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--dim);
  margin-bottom: 8px;
  padding: 0;
}

/* Grupes antraste sablonu pasirinkime („Vestuvės", „Kitos šventės").
   Vienuolika mygtuku viena kruva neskaitomi - reikia dvieju aisku pulku.
   Pirmajai grupei virsutinio tarpo nereikia: virs jos jau yra `legend`. */
.grupe {
  margin: 22px 0 8px;
  font-family: var(--antraste);
  font-size: 17px;
  color: var(--ink);
}

.grupe:first-of-type { margin-top: 4px; }
.grupe + .hint { margin: -4px 0 10px; }

.pasirinkimai { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }

.pasirinkimai label {
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 3px;
  background: var(--card);
  font-size: 15px;
  cursor: pointer;
  text-align: center;
  transition: border-color .3s, background .3s;
}

/* width:auto butina - kitaip paveldi input{width:100%} ir kyso uz ekrano */
.pasirinkimai input { position: absolute; width: auto; opacity: 0; pointer-events: none; }
.pasirinkimai input:checked + label { border-color: var(--royal); background: rgba(29,70,52,.10); }
.pasirinkimai input:focus-visible + label { box-shadow: 0 0 0 3px rgba(29,70,52,.28); }

.eilute { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

button {
  width: 100%;
  padding: 17px;
  margin-top: 4px;
  border: 0;
  border-radius: 0;
  background: var(--royal);
  color: #fdf8f2;
  font: inherit;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .3s, transform .3s var(--ease);
}

button:hover { background: var(--royal-t); transform: translateY(-1px); }
button[disabled] { opacity: .6; cursor: default; transform: none; }

/* Rodoma/slepiama per `hidden` atributa (ji valdo uzsakymas.html JS).
   Anksciau cia buvo `display: none` be jokio rodymo kelio - issiuntus
   uzsakyma padeka niekada nepasirodydavo (jos rasta klaida 2026-08-17). */
.done {
  padding: 26px;
  border: 1px solid var(--royal);
  border-radius: 3px;
  background: rgba(29,70,52,.07);
  text-align: center;
  color: var(--dim);
}

.done[hidden] { display: none; }

.done b {
  font-family: var(--antraste);
  font-size: 22px;
  font-weight: 400;
  display: block;
  margin-bottom: 6px;
  color: var(--ink);
}

/* ==========================================================
   Virsutine juosta
   ========================================================== */

.virsus {
  position: sticky;
  top: 0;
  z-index: 50;
  background: color-mix(in srgb, var(--paper) 90%, transparent);
  backdrop-filter: blur(10px);
  /* auksinis plaukelis vietoj pilko - juosta tampa svetaines dalimi,
     ne narsykles rėmu */
  border-bottom: 1px solid color-mix(in srgb, var(--auksas) 32%, transparent);
}

.virsus > div {
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 16px 0;
}

/* Logotipas - paveikslelis, ne tekstas (2026-08-13). Zenklas jau yra
   svetaines spalvu: royal green su auksiniu „.lt", tad prie antrastes
   dera be jokio perdazymo. `display:flex` nuima tarpa, kuri narsykle
   palieka po inline paveiksleliu, o `width:auto` leidzia auksciui
   valdyti dydi, nors HTML'e surasyti tikri matmenys (jie reikalingi,
   kad kraunantis puslapiui eilute nesutrukcioteu). */
.logo {
  display: flex;
  align-items: center;
  text-decoration: none;
  margin-right: auto;
}

/* Aukstis parinktas pagal RAIDES, ne pagal failo krastus: zenkle tik
   57 % aukscio yra pati raidziu juosta (virsuje `k` ir `lt` stiebai,
   apacioje `y` uodega). Prie 24 px raides likdavo ~14 px - tiek pat,
   kiek meniu tekstas, tik plonesnes, ir logotipas atrode susitraukes.
   34 px duoda ~19 px raidziu juosta, o antrastes aukstis nepasikeicia. */
.logo img {
  height: 34px;
  width: auto;
}

.virsus nav { display: flex; gap: 22px; align-items: center; }

/* Nuorodu grupe: desktope jos elgiasi taip, tarsi apvalkalo nebutu
   (display: contents), o telefone virsta isskleidziamu meniu. */
.virsus nav .nuorodos { display: contents; }

/* Burgerio mygtukas - tik telefonui; dvi plonos linijos, atidarius
   virsta kryzeliu. */
.m-burgeris {
  display: none;
  background: none;
  border: 0;
  padding: 10px 8px;
  margin: -10px -8px;
  cursor: pointer;
  flex-direction: column;
  gap: 5px;
  align-items: center;
}
.m-burgeris span {
  display: block;
  width: 20px;
  height: 1.6px;
  background: var(--ink);
  transition: transform .28s ease;
}
.virsus.atviras .m-burgeris span:first-child { transform: translateY(3.3px) rotate(45deg); }
.virsus.atviras .m-burgeris span:last-child { transform: translateY(-3.3px) rotate(-45deg); }

.virsus nav a {
  color: var(--dim);
  text-decoration: none;
  font-size: 11.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  transition: color .25s;
}

/* uzvedus po nuoroda issipiesia auksinis bruksnelis - tas pats zenklas
   kaip po antrastemis, tad juosta kalba svetaines kalba */
.virsus nav a:not(.btn) {
  position: relative;
  padding: 5px 0;
}
.virsus nav a:not(.btn)::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--auksas);
  transform: scaleX(0);
  transition: transform .3s ease;
}
.virsus nav a:not(.btn):hover::after { transform: scaleX(1); }

.virsus nav a:hover { color: var(--ink); }

.virsus nav .btn { padding: 10px 16px; font-size: 10.5px; letter-spacing: .22em; color: #fdf8f2; }
.virsus nav .btn:hover { color: #fdf8f2; }

/* dabartinis puslapis meniu - ne nuoroda kazkur, o vieta, kur stovi:
   rasalo spalva ir pastovus auksinis bruksnelis */
.virsus nav a[aria-current="page"] { color: var(--ink); }
.virsus nav a[aria-current="page"]::after { transform: scaleX(1); }

@media (max-width: 700px) {
  .virsus nav a:not(.btn) { display: none; }
  .logo img { height: 28px; }

  /* Telefone nuorodos gyvena isskleidziamame meniu po juosta.
     Atidaro burgeris (meniu.js prideda .atviras ant .virsus). */
  .m-burgeris { display: flex; }
  .virsus.atviras nav .nuorodos {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--paper);
    border-bottom: 1px solid color-mix(in srgb, var(--auksas) 32%, transparent);
    padding: 8px 0 18px;
    box-shadow: 0 18px 30px rgba(22, 24, 26, .08);
  }
  .virsus.atviras nav .nuorodos a {
    display: block;
    padding: 15px 0;
    font-size: 12.5px;
    letter-spacing: .26em;
    color: var(--ink);
    text-align: center;
  }
  /* plonos linijos tarp eiluciu - kaip kainu sarase */
  .virsus.atviras nav .nuorodos a + a {
    border-top: 1px solid color-mix(in srgb, var(--auksas) 18%, transparent);
  }
  .virsus.atviras nav .nuorodos a::after { display: none; }
}

/* ==========================================================
   Sventine grafika - eukalipto sakele
   Piesiama inline SVG, kad nereiketu jokiu failu ir kad
   spalva bei skaidruma butu galima valdyti is CSS.
   ========================================================== */

.sakele {
  position: absolute;
  pointer-events: none;
  stroke: var(--lapai);
  fill: none;
  opacity: .28;
  width: 190px;
  height: auto;
}

.sakele-vd { top: 26px; right: -34px; transform: rotate(14deg); }

@media (max-width: 900px) { .sakele { display: none; } }

/* ==========================================================
   Hero su gyva perziura
   ========================================================== */

/* Pora centruojama kaip visuma (kaip ir konfiguratoriuje): tekstas
   riboto plocio, telefonas salia, o ne isstumtas i tolima desini
   krasta - placiame lape per viduri likdavo tuscia dykuma */
.hero {
  display: grid;
  grid-template-columns: minmax(0, 620px) auto;
  gap: clamp(56px, 8vw, 116px);
  align-items: center;
  justify-content: center;
}

/* Antrastes uzuomina - plikas isretintas caps be jokio burbulo.
   Buves zalias pill su ikona skaitesi kaip programeles etikete;
   smulkios isretintos didziosios yra kvietimu registras. */
.zenkliukas {
  display: block;
  font-size: 11.5px;
  letter-spacing: .36em;
  text-transform: uppercase;
  color: var(--royal);
  margin: 0 0 26px;
}

.zenkliukas svg { display: none; }

.kaina {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin: 26px 0 0;
}

.kaina b {
  font-family: var(--antraste);
  font-size: 34px;
  font-weight: 400;
  color: var(--ink);
}

.kaina span { color: var(--dim); font-size: 14px; }
.kaina span a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.kaina span a:hover { color: var(--ink); }

/* Terminas po kaina. Atskira eilute, o ne `.kaina` viduje: telefone
   ji ir taip nusileidzia po kaina, o flex baseline ja pakeltu i sona. */
.terminas {
  margin: 10px 0 0;
  font-size: 14px;
  color: var(--dim);
}

/* ---- telefono remas ---- */

.telefonas { display: grid; justify-items: center; gap: 16px; }

.telefonas-korpusas {
  width: 258px;
  padding: 9px;
  border-radius: 36px;
  background: linear-gradient(160deg, #2a2724, #14120f);
  box-shadow: 0 40px 70px -34px rgba(30,42,34,.7), 0 0 0 1px rgba(255,255,255,.06) inset;
  position: relative;
}

/* garsiakalbio ruozelis - be jo remas atrodo kaip juodas staciakampis */
.telefonas-korpusas::before {
  content: "";
  position: absolute;
  top: 20px; left: 50%;
  transform: translateX(-50%);
  width: 54px; height: 5px;
  border-radius: 3px;
  background: rgba(255,255,255,.16);
  z-index: 2;
}

/* Kvietimas iframe'e turi gauti TIKRO telefono plotį, o ne remo plotį.
   Anksciau iframe buvo 240px - tokio siauro lango kvietimas realiai
   niekada nemato, tad viskas jame susispausdavo. Todel piesiam ji
   390x851 (iPhone 14 dydis) ir sumazinam per `scale`: maketas
   skaiciuojasi kaip telefone, o i rema telpa sumazintas.

   --matomas turi sutapti su remo vidumi (korpusas 258 - 2x9 padding). */
.telefonas-ekranas {
  --tikras:   390;      /* tikro telefono CSS plotis, be vieneto */
  --matomas:  240;      /* kiek vietos remo viduje */
  --mastelis: calc(var(--matomas) / var(--tikras));
  --aukstis:  524px;    /* kiek remas rodo */

  border-radius: 28px;
  overflow: hidden;
  background: var(--card);
  height: var(--aukstis);
}

.telefonas-ekranas iframe {
  width: calc(var(--tikras) * 1px);
  height: calc(var(--aukstis) / var(--mastelis));
  transform: scale(var(--mastelis));
  transform-origin: 0 0;
  border: 0;
  display: block;
}

.uzuomina {
  font-size: 12.5px;
  color: var(--dim);
  display: flex;
  align-items: center;
  gap: 7px;
}

.uzuomina svg { width: 13px; height: 13px; stroke: var(--royal); fill: none; }

/* ---- sablonu perjungiklis po telefonu ---- */

.perjungiklis { display: flex; flex-wrap: wrap; gap: 7px; justify-content: center; max-width: 330px; }

.perjungiklis button {
  width: auto;
  margin: 0;
  padding: 7px 13px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--card);
  color: var(--dim);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
  /* perjungiklis yra irankis, ne CTA - butiko caps jam netinka */
  text-transform: none;
  transition: border-color .25s, color .25s, background .25s;
}

.perjungiklis button:hover { color: var(--ink); border-color: var(--royal); transform: none; }

.perjungiklis button[aria-selected="true"] {
  background: var(--royal);
  border-color: var(--royal);
  color: #fdf8f2;
}

.viso-nuoroda {
  font-size: 13.5px;
  color: var(--royal);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 2px;
  opacity: .8;
}

.viso-nuoroda:hover { opacity: 1; }

/* dvi nuorodos po telefonu: „atidaryti" ir „noriu sito" (2026-09-03) */
.viso-nuorodos { display: flex; gap: 22px; flex-wrap: wrap; justify-content: center; margin: 0; }
.viso-noriu { font-weight: 500; opacity: 1; }

/* ---- „Svente dar toli?" patarimu forma (2026-09-03) ---- */
.patarimu-forma { display: flex; gap: 10px; flex-wrap: wrap; max-width: 640px; }
.patarimu-forma input[type="email"] { flex: 1 1 240px; width: auto; margin: 0; }
.patarimu-forma .btn { flex: 0 0 auto; padding-top: 14px; padding-bottom: 14px; }
.patarimu-ats { margin: 14px 0 0; font-size: 15px; color: var(--royal); }
/* slaptas laukas botams ir vizualiai paslepta etikete */
.slaptas { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---- kainu korteles (individualus.html, 2026-09-03) ---- */
.kainu-virsus { text-align: center; }
.kainu-virsus .sub { margin-left: auto; margin-right: auto; }
.kainu-korteles {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  max-width: 1040px;
  margin: 0 auto;
  text-align: left;
}
.kaina-kortele {
  display: flex; flex-direction: column; align-items: center;
  text-align: center;
  /* ARKA (jos prasymas 2026-09-03): virsus - pusapvalis lankas, kaip
     kvietimu arkose, apacia tiesi. Kontura viena auksine plaukeline,
     be seselio - arka su seseliu atrodo kaip programeles kortele.
     Baltas fonas, kad nesusilietu su smelio juosta. */
  padding: 64px 26px 30px;
  background: var(--card);
  border: 1px solid var(--auksas);
  border-radius: 999px 999px 0 0;
}
.kaina-kortele span {
  font-family: var(--antraste);
  font-size: 32px;
  line-height: 1.1;
  color: var(--ink);
}
.kaina-kortele b {
  display: block;
  margin: 10px 0 12px;
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.kaina-kortele small {
  display: block;
  flex: 1;
  color: var(--dim);
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 22px;
}
.kaina-kortele small a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.kaina-kortele .btn { align-self: center; padding: 13px 22px; }
/* Kortelėje gali buti du mygtukai (pavyzdys ir pokalbis) - tarp ju reikia oro */
.kaina-kortele .btn + .btn { margin-top: 10px; }

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; gap: 40px; justify-items: center; text-align: center; }
  .hero h1, .hero .lead { max-width: none; }
  .hero .btns, .kaina { justify-content: center; }
  .hero .lead { margin-left: auto; margin-right: auto; }
  /* centruotame hero auksine linija irgi centre */
  .hero .lead::before { margin-left: auto; margin-right: auto; }

  /* Telefone pirstas ant iframe slinktu kvietima, o ne puslapi, ir zmogus
     istrigtu viduryje titulinio. Todel maziems ekranams remas tampa
     paveiksleliu, o visas kvietimas atidaromas nuoroda. */
  .telefonas-ekranas iframe { pointer-events: none; }
  .uzuomina { display: none; }
}

@media (max-width: 380px) {
  /* Remo plotis lieka toks pat ir telefone: `--matomas` yra irasytas
     skaicius, tad remui isplatejus mastelis nebesutaptu ir kvietimas
     issikistu uz ekrano. 258px puikiai telpa i 375px. */
  .telefonas-ekranas { --aukstis: 460px; }
}

/* ==========================================================
   Privalumai
   ========================================================== */

.juosta { background: var(--smelis); border-top: 1px solid var(--line); }

/* Sablonu skiltis - royal green, ta pati kaip „Pradedam?" CTA gale
   (jos sprendimas 2026-08-11). Juodi telefonu remeliai sviesiame fone
   plaukiojo, o ant tamsos jie atrodo kaip tikri telefonai; sviesus
   kvietimai tamsoje sviecia. Kadangi fonas tamsus, VISI zenklai siame
   bloke perdazomi - likes royal green tekstas ar remelis butu
   nebeivelgiamas. */
.juosta-sablonai {
  background: var(--royal);
  border-top: 0;
}

.juosta-sablonai h2 { color: var(--krema); }
.juosta-sablonai .sub { color: rgba(242,239,232,.78); }
/* Pavadinimai auksiniai, kaip ir visi kiti zenklai sitoje juostoje
   (jos sprendimas 2026-08-13). Auksas cia sviesesnis nei --auksas:
   #a8874c ant royal green per tamsus. */
.juosta-sablonai .sablonas-info b { color: #d9bd85; }

/* Auksas cia sviesesnis nei --auksas: #a8874c ant royal green per
   tamsus, tekstas skestu fone */
.juosta-sablonai .sablonas-info em,
.juosta-sablonai .sablonas-info .skaicius { color: #d9bd85; }

/* „Pasimatuok spalvas" cia netaisom: titulinio korteles veda i
   kategoriju puslapius ir to zenklo neturi - jis gyvena sviesiuose
   kataloguose */

.juosta-sablonai .taskas { background: rgba(242,239,232,.28); }
.juosta-sablonai .taskas.yra { background: #d9bd85; }

/* fokuso remelis: royal green ant royal green butu nematomas -
   klaviatura naršantis zmogus pamestu, kur stovi */
.juosta-sablonai .sablonas:focus-visible { outline-color: #d9bd85; }

/* Mygtukas „Ziureti visus sablonus" stovi TAMSIOJE juostoje, tad
   `.btn-ghost` numatytoji rasalo spalva ten butu juoda ant tamsiai
   zalios (ismatuota rgb(22,24,26) - praktiskai nematoma). Tos pacios
   reiksmes, kaip `.tamsi` skiltyje. */
.juosta-sablonai .btn-ghost { border-color: rgba(242,239,232,.38); color: var(--krema); }

/* Juosta siauresne (jos sprendimas 2026-08-13): nuemus zenkliukus ir
   „Ziureti ..." eilutes korteles sutrumpejo, o senas 64-104 px tarpas
   virso ir apacioje paliko tamsios zalios lauka be jokio turinio. */
.juosta-sablonai { padding-top: clamp(44px, 6vw, 68px); padding-bottom: clamp(40px, 5vw, 60px); }

/* Mygtukas cia mazesnis uz iprasta CTA: jis yra kelias toliau, o ne
   pagrindinis veiksmas. Telefone NEtempiamas per visa ploti (bendra
   `.btn` taisykle po 560 px daro `flex: 1 1 100%`) - kitaip juosta vel
   paauga tiek, kiek ka tik sutrumpinom. */
/* Telefonas yra 202 px plocio, o `1fr` stulpelis placiame ekrane
   isteme jam 340 px - korteles issimetydavo, ir juosta atrodydavo
   per plati (jos pastaba 2026-08-13, ismatuota prie 1832 px).
   Dabar stulpelis neauga uz 250 px, o visas tinklas centruojamas,
   tad kad ir koks platus butu ekranas, telefonai stovi kartu. */
.juosta-sablonai .sablonai {
  /* `auto-fit` su `1fr`: kiek kortelių yra, tiek lygiu stulpeliu, ir jie
     issidalija visa `.wrap` ploti. Tad eile prasideda ir baigiasi ten pat,
     kur tekstas kitose skiltyse. */
  grid-template-columns: repeat(auto-fit, minmax(162px, 1fr));
  justify-items: center;
}

/* `.wrap` cia NEsiaurinamas: telefonu eile turi baigtis ten pat, kur
   tekstas kitose skiltyse (jos pastaba 2026-08-13). Isilyginima duoda
   penktas telefonas plius tinklas, uzpildantis visa ploti. */

/* Juosta buvo 861 px auksta, o daugiau nei puse to - telefonu ekranai
   (400 px) su tarpais aplink. Ekranas trumpinamas iki 320 px: mastelis
   nesikeicia (ji nustato PLOTIS), tiesiog rodoma virsutine kvietimo
   dalis - virselis, o tai ir yra tas daiktas, kuri zmogus renkasi. */
/* Telefonas MAZINAMAS PROPORCINGAI (0,8), o ne apkerpamas. Pirmas
   bandymas trumpino tik auksti - 190x320 duoda santyki 0,59, ir vietoj
   telefonu gavosi plansetes (jos pastaba). Dabar mazinami abu matmenys,
   tad santykis lieka 0,475, kaip tikro telefono - kitaip nuotrauka,
   kuri gula `object-fit: cover`, butu apkarpyta. */
.juosta-sablonai .perziura {
  --ekrano-aukstis: 320px;
  width: 152px;
  flex: 0 0 152px;
  border-radius: 16px;
}

/* Korpusas: 152 + 2x5 = 162 */
.juosta-sablonai .juostele {
  width: 162px;
  padding: 5px;
  border-radius: 21px;
}

/* garsiakalbis - tas pats 0,8 */
.juosta-sablonai .juostele::after {
  top: 10px;
  width: 32px;
  height: 3px;
}
.juosta-sablonai { padding-top: clamp(40px, 4.5vw, 52px); padding-bottom: clamp(36px, 4vw, 44px); }
.juosta-sablonai .sub { margin-bottom: 20px; }
.juosta-sablonai .juostele { margin-top: 14px; }
.juosta-sablonai .btns { margin-top: 26px; margin-bottom: 0; }

.juosta-sablonai .btns { margin-top: clamp(22px, 3vw, 32px); }
.juosta-sablonai .btn-ghost {
  flex: 0 0 auto;
  padding: 11px 22px;
  font-size: 10.5px;
  letter-spacing: .18em;
}
.juosta-sablonai .btn-ghost:hover { border-color: var(--krema); }

.juosta-sablonai .sakele { stroke: #d9bd85; opacity: .2; }
.juosta .item { background: var(--smelis); }
.juosta .grid { border-color: rgba(22,24,26,.12); background: rgba(22,24,26,.12); }

/* „Kodel ne penkios minutes" - kainos pagrindimas. Du stulpeliai su
   plaukelinemis virsuje: tas pats registras kaip gretimuose sarasuose
   (kapitelinis pavadinimas + prislopintas Inter), tik be numeriu, kad
   puslapyje neatsirastu treciasis numeruotas sarasas. */
/* Baneris `media/juosta-stalas` cia buvo isbandytas ir ISIMTAS
   2026-08-11: net su tankia plevele telefonu siluetai kirtosi su
   tekstu, o virs sios skilties ir taip yra keturi telefonai. Failai
   liko `media/` (jpg + webp), originalas - `media/inspiracijos/`. */

/* Antraste ir potekste - centruotos, o SARASAS lieka dviem
   stulpeliais: centruojam butent tuos du elementus, ne visa `.wrap`,
   kitaip centruotusi ir punktu tekstai. */
.kruopstumo-skiltis > .wrap > h2,
.kruopstumo-skiltis > .wrap > .sub { text-align: center; }
.kruopstumo-skiltis > .wrap > .sub { margin-left: auto; margin-right: auto; }

/* Tie patys du stulpeliai per visa `.wrap` ploti, kaip gretimoje
   „ko negali / ka moka" skiltyje - anksciau blokas buvo ribotas iki
   980px ir desineje likdavo tuscias trecdalis puslapio. */
.kruopstumas {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 clamp(40px, 5vw, 76px);
}

.kruopstus {
  padding: 17px 0;
  border-top: 1px solid rgba(22,24,26,.16);
}

.kruopstus b {
  display: block;
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  margin-bottom: 4px;
}

.kruopstus small {
  color: var(--dim);
  font-size: 15px;
  line-height: 1.6;
  display: block;
}

@media (max-width: 900px) {
  .kruopstumas { grid-template-columns: 1fr; }
}

/* Dvi skiltys viena salia kitos - „ko negali" ir „ka moka". Atskiromis
   juostomis jos suvalgydavo du pilnus ekranus ir nustumdavo sablonus
   toli zemyn; teksto abiejose liko po viena sakini, tad telpa greta. */
.dvi-skiltys {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(40px, 5vw, 76px);
  align-items: start;
}

/* Siaurame stulpelyje trys stulpeliai nebetelpa (aprasui liktu ~250px):
   numeris lieka kaireje, pavadinimas ir tekstas gula vienas po kitu */
.dvi-skiltys .privalumas { grid-template-columns: 30px 1fr; gap: 3px 14px; }
.dvi-skiltys .privalumas small { grid-column: 2; }

/* funkcijos stulpelyje eina viena po kita, ne dviem stulpeliais */
.dvi-skiltys .funkcijos { grid-template-columns: 1fr; gap: 15px; }

/* trys svarbiausios atskirtos plaukeline - hierarchija be kegelio */
.funkcijos.svarbios {
  padding-bottom: 18px;
  margin-bottom: 18px;
  border-bottom: 1px solid rgba(22,24,26,.16);
}

@media (max-width: 900px) {
  .dvi-skiltys { grid-template-columns: 1fr; gap: 52px; }
}

/* Redakcinis numeruotas sarasas: auksinis numeris / caps pavadinimas /
   tekstas desineje, eilutes skiria plaukelines linijos. Buve keturi
   stulpeliai su ikonomis atrode kaip programines irangos puslapis. */
.privalumai { counter-reset: privalumas; }

.privalumas {
  display: grid;
  grid-template-columns: 36px minmax(180px, 230px) 1fr;
  gap: 8px 22px;
  align-items: baseline;
  padding: 15px 0;
  border-top: 1px solid rgba(22,24,26,.16);
}

.privalumas:last-child { border-bottom: 1px solid rgba(22,24,26,.16); }

.privalumas::before {
  counter-increment: privalumas;
  content: "0" counter(privalumas);
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 17px;
  color: var(--auksas);
}

.privalumas b {
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
}

/* SMULKUS tekstas - Inter, ne Cormorant (jos pastaba 2026-08-11:
   „plonos linijos, sunkiai skaitomas"). Cormorant idetas tik 300–400
   svoriu ir yra didelio kontrasto sriftas: 16px dydziu jo plaukelines
   linijos tiesiog dingsta. Cormorant lieka ten, kur jis stambus ir
   dekoratyvus - `.sub`, `.lead`, numeriai. TAS PATS dydis visuose
   keturiuose sarasuose (privalumai, funkcijos, zingsniai, DUK). */
.privalumas small {
  color: var(--dim);
  font-size: 15px;
  line-height: 1.6;
}

/* siauram ekrane tekstas nusileidzia po pavadinimu, numeris lieka kaireje */
@media (max-width: 760px) {
  .privalumas { grid-template-columns: 44px 1fr; }
  .privalumas small { grid-column: 2; }
}

/* ==========================================================
   Kas viduje - funkciju sarasas su ikonomis
   ========================================================== */

/* .funkcijos-didzios / .funkcija-d isimta 2026-08-11: skiltis persikele
   i siaura stulpeli salia „ko negali", kur centruotos didziosios
   netelpa - hierarchija dabar per `.funkcijos.svarbios` linija */

.funkcijos { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px 30px; }

.funkcija { display: grid; grid-template-columns: 20px 1fr; gap: 12px; align-items: start; }

.funkcija svg {
  width: 19px; height: 19px;
  stroke: var(--royal);
  fill: none;
  stroke-width: 1.3;
  /* kapitelinis pavadinimas zemesnis uz buvusi 14.5px - ikona kyla
     aukstyn, kad stovetu ties pirma eilute, o ne tarp dvieju */
  margin-top: 0;
}

/* Tipografija TA PATI kaip gretimame „ko negali" sarase: pavadinimas -
   isretintos kapiteles, paaiskinimas - Cormorant. Anksciau sitas
   stulpelis buvo visas Inter'u ir salia atrode kaip kito puslapio
   gabalas (jos pastaba 2026-08-11). */
.funkcija b {
  display: block;
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  margin-bottom: 3px;
}

.funkcija small {
  color: var(--dim);
  font-size: 15px;
  line-height: 1.6;
}

/* ---------- tamsi CTA skiltis ----------
   VIENA sodri plokste per visa puslapi - royal green su kreminiu
   tekstu ir auksine plaukeline, kaip paciuose kvietimuose. Daugiau
   tamsiu juostu nedaryti: viena duoda gyli, dvi jau dalija puslapi. */

.tamsi {
  background: var(--royal);
  border-top: 0;
  padding: 96px 0;
}

.tamsi h2 { color: var(--krema); font-size: clamp(25px, 3.8vw, 36px); }

.tamsi h2::before {
  content: "";
  display: block;
  width: 44px;
  height: 1px;
  background: var(--auksas);
  margin: 0 auto 30px;
}

.tamsi .sub { color: rgba(242,239,232,.78); }

.tamsi .btn-main { background: var(--krema); color: var(--royal); }
.tamsi .btn-main:hover { background: #fff; }
.tamsi .btn-ghost { border-color: rgba(242,239,232,.38); color: var(--krema); }
.tamsi .btn-ghost:hover { border-color: var(--krema); }


/* priedu checkbox'ai: tekstas kaireje, o ne centre kaip radio
   mygtukuose - cia dvi eilutes teksto ir centras atrodytu netvarkingai */
.priedai { grid-template-columns: 1fr; }
.priedai label { text-align: left; }
.priedai label span {
  display: block;
  font-size: 13px;
  color: var(--dim);
  margin-top: 3px;
}

/* ---------- uzsakymo antras zingsnis ----------
   Visas sventes turinys suglaustas i viena juosta. Priezastis paprasta:
   pirma zmogus nusprendzia, ar uzsako, ir tam uztenka sablono, datos ir
   kontakto. Dienos eiga bei adresai tuo metu daznausiai dar nezinomi, o
   desimt tuscių laukų atrodo kaip namu darbai. Tai NE atskiras puslapis:
   forma viena, issiuntimas vienas, jokio serverio nereikia. */

/* JOKIO savo fono ir jokiu savo paraštciu: spalvota plokste su vidiniu
   ideklu skaitesi kaip ANTRA forma, priklijuota prie pirmos. Cia ta pati
   forma toliau - skiria tik plaukeline, o tekstas prasideda lygiai ten,
   kur ir laukų etiketes virsuje. Veiksma rodo mygtukas desineje. */
.turinys {
  border-top: 1px solid var(--line);
  margin: 36px 0 30px;
}

.turinys summary {
  list-style: none;
  cursor: pointer;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 7px 30px;
  padding: 28px 0 26px;
}

/* numatytoji trikampio rodykle dviejose narsykliu seimose skiriasi,
   o cia jos vietoje savas mygtukas - tad isjungiam abi jos formas */
.turinys summary::-webkit-details-marker { display: none; }

.turinys summary b {
  grid-column: 1;
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  /* ta pati spalva kaip laukų etikečių virsuje (`.field > label`) -
     juodas rasalas cia issoko is eiles */
  color: var(--dim);
}

.turinys summary span {
  grid-column: 1;
  max-width: 46ch;
  font-size: 15px;
  line-height: 1.6;
  color: var(--dim);
}

/* Mygtukas piesiamas pseudoelementu, o ne <button>: <summary> viduje
   tikras mygtukas pats gaudytu paspaudima ir juosta neatsivertu. */
.turinys summary::after {
  content: "Užpildyti";
  grid-column: 2;
  grid-row: 1 / span 2;
  padding: 14px 24px;
  border: 1px solid var(--auksas);
  color: var(--auksas);
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: background .3s var(--ease), color .3s var(--ease);
}

.turinys[open] summary::after { content: "Suskleisti"; }

.turinys summary:hover::after,
.turinys summary:focus-visible::after {
  background: var(--auksas);
  color: var(--card);
}

.turinys summary:focus-visible { outline: none; }

.turinio-vidus { padding: 2px 0 4px; }

/* Siaurame ekrane mygtukas nusileidzia po tekstu - salia jo
   antrastei liktu vos keli zodziai per eilute. */
@media (max-width: 560px) {
  .turinys summary { grid-template-columns: 1fr; padding: 24px 0 22px; }
  .turinys summary::after {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
    margin-top: 16px;
  }
}

/* ---------- judesys ---------- */

.rev { opacity: 0; transform: translateY(18px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.rev.in { opacity: 1; transform: none; }

.fade { opacity: 0; transform: translateY(14px); animation: rise .9s var(--ease) forwards; }
.fade.d1 { animation-delay: .05s; }
.fade.d2 { animation-delay: .25s; }
.fade.d3 { animation-delay: .45s; }
.fade.d4 { animation-delay: .65s; }
@keyframes rise { to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .fade, .rev { opacity: 1; transform: none; animation: none; transition: none; }
  .sablonas:hover { transform: none; }
}

@media (max-width: 560px) {
  .eilute { grid-template-columns: 1fr; }
  .btn { flex: 1 1 100%; text-align: center; }
  /* telefone kortelės eina viena po kitos, tad aukstos 4:5 perziuros
     isstumia puslapi per ilgai - kvadratas parodo tiek pat, tik trumpiau */
  .perziura { aspect-ratio: 1 / 1; }
  /* dvi nuotraukos eileje - po viena istemptu titulini dar per du ekranus */
  .popierius { grid-template-columns: 1fr 1fr; gap: 10px; }
}

/* Slaptas formos laukas botams. `display:none` netinka - dalis botu
   tokius praleidzia; sitas is ekrano isnesamas, bet lieka „tikras". */
.voratinklis {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Kainu sarasas Individualiame kvietime: stulpelis platesnis nei
   iprastuose zingsniuose, nes vietoj numerio 01 ten stovi kaina, o
   nuo 129 EUR i 40 px netelpa ir lauztusi i dvi eilutes. */
#kainos .steps li { grid-template-columns: 82px 1fr; }
@media (max-width: 560px) {
  #kainos .steps li { grid-template-columns: 74px 1fr; gap: 14px; }
}

/* Papildomos paslaugos - tos pacios varneles kaip skiltys, tik
   smulkesnes: skiltys yra kvietimo TURINYS ir renkamos beveik visada,
   o sitos yra priedas, tad neturi svertis daugiau uz pati kvietima. */
#papildomos-paslaugos { grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 8px; }
#papildomos-paslaugos label { padding: 8px 10px; font-size: 13px; line-height: 1.35; }

/* ==========================================================
   Visu sablonu puslapis (`sablonai.html`)

   Korteles ir filtrai generuojami is `window.SABLONAI`, tad cia tik
   tinklas ir filtru mygtukai. `.sablonas`, `.juostele`, `.perziura` ir
   `.sablonas-info` paveldimi is katalogo korteliu - ju nekartojam.
   ========================================================== */

.filtrai {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0 0 16px;
}

/* `button` turi bendra stiliu su 100% plociu ir royal fonu - filtrui
   viska nuimam, kitaip kiekvienas mygtukas uzimtu visa eilute. */
.filtras {
  width: auto;
  margin: 0;
  padding: 9px 16px;
  background: transparent;
  color: var(--ink);
  border: 1px solid var(--line);
  border-radius: 999px;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.filtras:hover { border-color: var(--royal); background: transparent; }
.filtras.yra { background: var(--royal); border-color: var(--royal); color: #fdf8f2; }
.filtras:focus-visible { outline: 2px solid var(--royal); outline-offset: 3px; }

.sablonu-tinklas {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(214px, 1fr));
  gap: clamp(20px, 3vw, 36px) clamp(12px, 2vw, 24px);
  justify-items: center;
}

/* Telefone - po du stulpelius, kaip kategoriju puslapiuose (telefonelio
   dydzius mazina bendros .juostele/.perziura mobilios taisykles).
   Blokas TYCIA po bazine taisykle: auksciau faile ji pralaimetu. */
@media (max-width: 700px) {
  .sablonu-tinklas {
    grid-template-columns: 1fr 1fr;
    gap: 30px 12px;
  }
}

/* Kol kvietimas dar neuzsikrove, ekranas neturi zioteti balta skyle */
.sablonu-tinklas .perziura { background: var(--card); }

.sablono-langas { display: block; text-decoration: none; color: inherit; }

/* `[hidden]` cia BUTINAS: `.sablonas` turi `display: flex`, o jis
   persveria narsykles `[hidden] { display: none }`. Be sitos eilutes
   filtras pazymedavo korteles paslėptomis, o jos likdavo matomos -
   atrodydavo, kad rusiavimas pagal kategorijas neveikia isvis. */
.sablonu-tinklas .sablonas[hidden] { display: none; }

/* Ta pati isvaizda kaip `.sablonas-info em`, tik cia tai tikra nuoroda */
.sablonas-info .tarsi-em {
  display: block;
  margin-top: 12px;
  font-size: 10.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--royal);
  text-decoration: none;
}

.sablonas:hover .sablonas-info .tarsi-em { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Instagram juosta (titulinis) ---------- */

/* 900px, o ne .narrow 660px: keturi kvadratai 660-yje butu per smulkus,
   o pilnas plotis muszsi su ramia galerijos siena aplink */
.ig-tinklelis {
  width: min(900px, 92vw);
  margin: 26px auto 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.ig-tinklelis a {
  display: block;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: var(--shadow);
}

.ig-tinklelis img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  transition: transform .4s var(--ease);
}

.ig-tinklelis a:hover img { transform: scale(1.04); }

.ig-sekti { text-align: center; margin-top: 26px; }

@media (max-width: 640px) {
  .ig-tinklelis { grid-template-columns: 1fr 1fr; }
}

/* ---------- Zigzagas: tekstas + nuotrauka pakaitomis (patarimai/) ---------- */
/* platesnis uz .narrow (660px) - dvi skiltys ten butu per ankstos */
.zigzag {
  width: min(900px, 92vw);
  margin: 0 auto;
  display: flex;
  align-items: center;
  gap: clamp(28px, 5vw, 56px);
}
.zigzag.atvirksciai { flex-direction: row-reverse; }
.zigzag .zz-foto { flex: 0 0 38%; }
.zigzag .zz-foto img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: var(--shadow);
}
.zigzag .zz-tekstas { flex: 1 1 auto; min-width: 0; }

@media (max-width: 700px) {
  .zigzag { flex-direction: column !important; gap: 20px; }
  .zigzag .zz-foto { flex: none; width: 100%; }
}

/* ---------- Terminu eile antrasteje (patarimai/) ---------- */
/* pakeicia ilga sub sakini - patys terminai ryskiai, taskeliais, po h1 */
.terminu-eile {
  max-width: 620px;
  margin: 0 auto;
  font-size: 15px;
  color: var(--dim);
}
.terminu-eile b { color: var(--auksas); font-weight: 400; opacity: .8; }

/* ---------- Straipsniu sarasas (/patarimai/) ---------- */
/* Kortele = viena nuoroda: paspaudziamas visas plotas, ne tik antraste.
   Nuotrauka butina - sarasas vien tekstu atrodo tuscias, lygiai kaip ir
   patys straipsniai atrode pries zigzago nuotraukas. */
/* Stulpeliu skaicius uzrasytas TIESIAI (4 / 2 / 1), o ne per `auto-fit`:
   auto-fit prie 1000px duodavo TRIS stulpelius, tad ketvirta kortele
   likdavo viena antroje eiluteje. 4 ir 2 dalija keturis be liekanos. */
.str-sarasas {
  width: min(1080px, 92vw);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(22px, 3vw, 34px);
}
@media (max-width: 999px) { .str-sarasas { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .str-sarasas { grid-template-columns: 1fr; } }
.str-kortele {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  transition: transform .4s var(--ease);
}
.str-kortele:hover { transform: translateY(-4px); }
/* `height: auto` BUTINAS: HTML `height="1184"` atributas yra prezentacine
   uzuomina, kuri be sito laimi pries `aspect-ratio` (proporcija veikia tik
   tada, kai vienas matmuo yra auto) - kortele issitempdavo per visa lapa. */
.str-kortele img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: var(--shadow);
}
.str-kortele b {
  display: block;
  margin: 16px 0 6px;
  font-family: var(--antraste);
  font-weight: 400;
  font-size: 16.5px;
  line-height: 1.35;
  letter-spacing: .02em;
}
.str-kortele small {
  color: var(--dim);
  font-size: 14.5px;
  line-height: 1.6;
}
.str-kortele .str-daugiau {
  margin-top: 10px;
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--auksas);
}

/* ---- atsiliepimai ----
   Skiltis tituliniame kol kas uzkomentuota (laukia tikru zodziu), bet
   stiliai laikomi cia, kad itraukimas butu vieno intarpo darbas.
   Trys stulpeliai stalinije, vienas telefone - `auto-fit` be
   `minmax` fiksuoto skaiciaus, tad du atsiliepimai atrodo taip pat
   tvarkingai kaip trys. */
.atsiliepimai {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 28px;
  margin-top: 34px;
  text-align: left;
}

.atsiliepimai figure {
  margin: 0;
  padding: 0 0 0 18px;
  border-left: 1px solid var(--line);
}

.atsiliepimai blockquote {
  margin: 0;
  font-family: var(--antraste);
  font-size: 19px;
  line-height: 1.5;
  color: var(--ink);
}

.atsiliepimai figcaption {
  margin-top: 12px;
  font-size: 13px;
  letter-spacing: .04em;
  color: var(--dim);
}

/* ---- lipni uzsakymo juosta (tik telefone) ----
   Statoma is `meniu.js`. Stalinije neegzistuoja visai: `display:none`
   yra numatytoji busena, o rodoma tik siauruose ekranuose ir tik su
   klase `.rodom`, kuria uzdeda skriptas. */
#lipni-juosta { display: none; }

@media (max-width: 700px) {
  #lipni-juosta {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 40;            /* zemiau virsutines juostos (50), kad
                               atidarytas meniu liktu virsuje */
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    /* iPhone naru juosta: be safe-area mygtukas atsiduria po ja */
    padding: 12px 18px calc(12px + env(safe-area-inset-bottom, 0px));
    background: color-mix(in srgb, var(--paper) 94%, transparent);
    backdrop-filter: blur(10px);
    border-top: 1px solid color-mix(in srgb, var(--auksas) 32%, transparent);
    /* pasislepusi busena: nustumta zemyn ir neliecialma */
    transform: translateY(110%);
    transition: transform .35s var(--ease);
    pointer-events: none;
  }

  #lipni-juosta.rodom {
    transform: translateY(0);
    pointer-events: auto;
  }

  .lj-kaina {
    font-family: var(--antraste);
    font-size: 19px;
    color: var(--ink);
    white-space: nowrap;
  }

  /* Mygtukas siauresnis nei skiltyse: juosta turi buti juosta, ne
     antras hero. Auksciu vis tiek lieka virs 44px - pirstui pakanka. */
  #lipni-juosta .btn {
    padding: 14px 20px;
    font-size: 11px;
    letter-spacing: .18em;
  }
}

@media (prefers-reduced-motion: reduce) {
  #lipni-juosta { transition: none; }
}

/* ==========================================================
   Kontaktu forma „Parasykite"

   Kam: iki siol vienintelis kelias susisiekti buvo uzsakymo forma, kuri
   is karto klausia sventes tipo ir datos. Kas dar tik svarsto, tokios
   formos nepildo. Cia trys laukai ir mygtukas.

   Delione: vienas 720 px stulpelis centre, vardas ir pastas vienoje
   eiluteje. Formos laukai ir mygtukas paveldi uzsakymo formos stiliu,
   tik didesni: 52 px aukscio, 16 px sriftas.
   ========================================================== */

.kontaktu-skiltis { padding: 64px 0 96px; }
.kontaktu-skiltis h2 { margin-bottom: 10px; }
.kontaktu-skiltis .sub { margin-bottom: 34px; }

.kontaktu-stulpelis { max-width: 720px; margin: 0 auto; text-align: left; }

.k-eile { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }

.kontaktu-forma input,
.kontaktu-forma textarea {
  min-height: 52px;
  padding: 14px 16px;
  font-size: 16px;
}
.kontaktu-forma textarea { min-height: 160px; }
.kontaktu-forma button[type="submit"] { width: 100%; margin-top: 4px; }

/* Trys smulkmenos po mygtuku vienoje eiluteje, ne atskirame stulpelyje. */
.k-smulkiai {
  margin: 14px 0 0;
  text-align: center;
  font-size: 14px;
  line-height: 1.7;
  color: var(--dim);
}
.k-smulkiai a { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }

/* Zinuciu mygtukai po kontaktu forma (2026-09-09). Telefone - vienas po
   kito: dvi UPPERCASE eilutes su .22em tarpais i 375px netelpa. */
.k-arba {
  margin: 16px 0 12px;
  text-align: center;
  font-size: 13px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--dim);
}
.k-dm-eile { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.k-dm {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 14px 16px;
  font-size: 11px;
  letter-spacing: .14em;
  text-align: center;
}
.k-dm svg { width: 18px; height: 18px; flex: 0 0 18px; }

@media (max-width: 560px) {
  .k-dm-eile { grid-template-columns: 1fr; }
}
.kontaktu-forma .klaida { margin-top: 12px; text-align: center; color: #9c3b3b; font-size: 15px; }

/* Padeka po issiuntimo. Be dezes: tik dvi plonos aukso linijos virsuje ir
   apacioje, aukstis natūralus (jokio `min-height` - anksciau jis tempdavo
   bloka per visa formos auksti, o mygtukas issitempdavo kartu). */
.aciu {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  padding: 56px 32px;
  border-top: 1px solid var(--auksas);
  border-bottom: 1px solid var(--auksas);
  text-align: center;
}
.aciu .btn { flex: none; align-self: center; padding: 14px 28px; }
.aciu[hidden] { display: none; }
.aciu h2 { margin: 0; font-size: clamp(26px, 4vw, 32px); }
.aciu p { margin: 0; color: var(--dim); font-size: 16px; }
.aciu p b { font-weight: 500; color: var(--ink); }

@media (max-width: 640px) {
  .k-eile { grid-template-columns: 1fr; gap: 0; }
  .kontaktu-skiltis { padding: 48px 0 72px; }
}

/* ==========================================================
   „Jusu istorija": ketvirta kaina, vitrina tituliniame, juosta vestuvese
   ========================================================== */

/* Keturios korteles vietoj triju: auto-fit, kad plansete jos gultu
   dviem eilemis po dvi, o ne suslegtu i keturis siaurus stulpelius. */
.kainu-korteles { grid-template-columns: repeat(auto-fit, minmax(215px, 1fr)); max-width: 1240px; }

/* Telefone - VIENA kolona. Ta pati taisykle anksciau gulejo prie kortelu
   apraso (~1698 eil.), bet virsutine `auto-fit` eilute yra failo gale ir
   ja perrasydavo: nuo ~455 px iki 860 px kortelės susispausdavo i du
   215 px stulpelius ir tekstas eidavo po keturis zodzius eiluteje.
   Todel ji turi likti CIA, po `auto-fit`. */
@media (max-width: 860px) {
  .kainu-korteles { grid-template-columns: 1fr; max-width: 360px; gap: 30px; }
}

.kaina-kortele.nauja { position: relative; border-color: var(--auksas); }
.kaina-kortele .zymele {
  position: absolute;
  top: 26px;
  left: 50%;
  transform: translateX(-50%);
  padding: 4px 14px;
  border: 1px solid var(--auksas);
  border-radius: 999px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--auksas);
  background: var(--card);
}

/* Vitrina tituliniame: paveikslas kaireje, tekstas desineje. Paveikslas
   apkerpamas iki 420 px aukscio - visas 9:16 kadras cia butu per aukstas
   ir istemptu skilti per visa ekrana. */
#istorijos-vitrina { padding: 96px 0; }
.istorijos-vitrina {
  display: grid;
  grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 60px);
  align-items: center;
}
.istorijos-vitrina .foto {
  padding: 8px;
  border: 1px solid var(--auksas);
  background: var(--card);
}
.istorijos-vitrina .foto img {
  display: block;
  width: 100%;
  height: 420px;
  object-fit: cover;
  object-position: 50% 42%;
}
.istorijos-vitrina h2 { margin-bottom: 12px; }
.istorijos-vitrina .kaina {
  margin: 16px 0 0;
  font-size: 11.5px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--auksas);
}
@media (max-width: 860px) {
  #istorijos-vitrina { padding: 64px 0; }
  .istorijos-vitrina { grid-template-columns: 1fr; }
  .istorijos-vitrina .foto { max-width: none; margin: 0; }
  .istorijos-vitrina .foto img { height: 60vw; }
}

/* Siaura juosta virs sablonu katalogo. */
.istorijos-juosta {
  border-top: 1px solid var(--auksas);
  border-bottom: 1px solid var(--auksas);
  background: var(--card);
  padding: 16px 0;
  text-align: center;
  font-size: 15px;
  color: var(--dim);
}
.istorijos-juosta a {
  color: var(--ink);
  text-decoration: underline;
  text-underline-offset: 3px;
  margin-left: 6px;
}

/* ==========================================================
   Hero telefone (iki 768 px)

   Kam: telefone ilga pastraipa, dvi kainu eilutes, terminas ir du mygtukai
   nustumdavo patį telefona zemiau pirmo ekrano - o būtent jis parodo, kas
   perkama. Dabar pirmame ekrane: antraste, vienas sakinys ir telefonas.

   `display: contents` teksto stulpeliui reikalingas tam, kad jo vaikai
   (antraste, sakinys, kaina, mygtukai) taptu tos pacios eiles nariais kaip
   telefonas, ir juos butu galima sudeti norima tvarka per `order`.
   ========================================================== */
@media (max-width: 768px) {
  header.pradzia { min-height: 100svh; padding: 40px 0 0; }
  header.pradzia .hero { display: flex; flex-direction: column; align-items: center; gap: 16px; }
  header.pradzia .hero > div:first-child { display: contents; }

  header.pradzia .zenkliukas { order: 1; }
  header.pradzia h1 { order: 2; font-size: 34px; line-height: 1.12; margin: 0; }
  header.pradzia .lead-mob { order: 3; display: block; font-size: 17px; line-height: 1.7; max-width: 30ch; margin: 0; }
  header.pradzia .lead { display: none; }
  /* Telefonas nukerpamas ne kirviu: apacia istirpsta i fona, tad matyti,
     kad ekranas tesiasi zemiau, o kaina po juo turi savo oro. */
  header.pradzia .telefonas {
    order: 4;
    max-height: 58svh;
    overflow: hidden;
    margin-top: 8px;
    -webkit-mask-image: linear-gradient(to bottom, #000 78%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 78%, transparent 100%);
  }
  header.pradzia .kaina { order: 5; margin: 32px 0 0; }
  header.pradzia .kaina span { display: none; }
  header.pradzia .terminas { display: none; }
  header.pradzia .btns { order: 6; margin: 0 0 28px; }
  header.pradzia .btns .btn-main { display: none; }
}

/* ==========================================================
   Vidiniu puslapiu antraste telefone (iki 768 px)

   Kam: vidinese antrastese telefone likdavo tuscia juosta - desktopo
   oras (72/88 px, `.glaustas` 44/52 px) mazame ekrane virsta zeme,
   pro kuria nesimato, kad puslapis apskritai turi turini. Dabar po
   paantraste iskart eina pirma skiltis.

   `:not(.pradzia)` o ne `.glaustas`: puse vidiniu puslapiu (individualus,
   duk, vestuves, kitos-sventes, privatumas) antrastes klases isvis
   neturi, tad taikantis i `.glaustas` jie liktu nepataisyti.

   `min-height: 0` cia ne del paveldejimo - jokia desktopo taisykle
   antrastei aukscio nededa (patikrinta 2026-09-08) - o kaip apsauga,
   jei kada nors bus pridėta.
   ========================================================== */
@media (max-width: 768px) {
  header:not(.pradzia) {
    min-height: 0;
    padding: 40px 0 28px;
    text-align: center;
  }
}

/* Desktope trumpasis sakinys nereikalingas: ten telpa visa pastraipa. */
.lead-mob { display: none; }

/* ==========================================================
   KAINU JUOSTA (2026-09-09, jos sprendimas)

   Buvo keturios arkos-kortelės ant smelio. Arka grazi tada, kai jos
   viduje paveikslas; su tekstu ir varnelemis ji virsta tusciu langu, o
   skirtingas stulpeliu aukstis matomas per korteles dugna - todel teksta
   tekdavo tempti, kad kortelės susilygintu.

   Dabar dugno nera: viena tamsi plokste per visa ploti, stulpelius
   skiria tik plonos auksines linijos, tustuma istirpsta fone.
   Puslapio ritmas: sviesu (hero) - tamsu (kainos) - sviesu (kuri rinktis).
   ========================================================== */
/* Kainu puslapio hero: tik zenkliukas ir antraste, be ivadinio sakinio,
   tad numatytieji `header` 72/88 px cia virsdavo tuscia juosta. */
.kainu-antraste { padding: 46px 0 40px; }

.kainu-juosta {
  /* `position` cia ne del fono, o del „Naujiena" zymeles, kuri
     pozicionuojama absoliuciai virs ketvirto stulpelio. */
  position: relative;
  background: var(--royal-t);
  color: var(--krema);
  padding: 40px 0 72px;   /* virsuje maziau: 30 px prideda `.kj-tinklas` */
}


.kj-tinklas {
  position: relative;   /* virs botanikos IR zymeles inkaras */
  padding-top: 30px;    /* vieta „Naujiena" zymelei */
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  max-width: 1120px;
}

/* Kainos, pavadinimai ir aprasymai - per centra (2026-09-09, jos
   sprendimas). Punktu sarasas lieka lygiuotas i kaire, tik pats blokas
   pastatomas per vidury: centruotos eilutes su varnelemis virsta
   zigzagu, kurio akis neperskaito kaip saraso. */
.kj-stulpelis {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 6px 28px 0;
}
.kj-punktai { text-align: left; }

/* Linija tik KAIREJE ir tik nuo antro stulpelio: kitaip juostos
   krastuose kabotu linija be poros. */
.kj-stulpelis + .kj-stulpelis {
  border-left: 1px solid rgba(168,135,76,.42);
}

.kj-kaina {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-weight: 300;
  font-size: 48px;
  line-height: 1.05;
  color: var(--auksas);
}

.kj-stulpelis b {
  display: block;
  /* 22px apacioje, ne 14: anksciau tarp pavadinimo ir punktu stovejo
     aprasomasis sakinys, o dabar jie remiasi tiesiai vienas i kita. */
  margin: 10px 0 22px;
  font-weight: 500;
  font-size: 11.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--krema);
}


/* `flex: 1` cia, o ne ant `small`: butent sarasas istempia stulpeli, tad
   mygtukai visose kolonose sugula i viena linija. */
.kj-punktai {
  flex: 1;
  list-style: none;
  margin: 0 0 22px;
  padding: 0;
  font-size: 14px;
  line-height: 1.5;
  color: rgba(242,239,232,.82);
}
.kj-punktai li {
  position: relative;
  padding-left: 22px;
  margin-top: 9px;
}
.kj-punktai li:first-child { margin-top: 0; }

/* Pavyzdziu eilute ketvirtoje pakopoje: tylesnė uz punktus, nes tai ne
   pasiulymo dalis, o galimybe pasiziureti pries rasant. */
.kj-pavyzdziai {
  margin: 0 0 18px;
  font-size: 12.5px;
  line-height: 1.6;
  color: rgba(242,239,232,.62);
}
.kj-pavyzdziai a { color: var(--auksas); text-decoration: underline; text-underline-offset: 3px; }

/* Varnele pieziama kraštinemis, ne „v" simboliu: simbolis skirtingose
   sistemose atrodo skirtingai, o dvi kraštines visur vienodos. */
.kj-punktai li::before {
  content: "";
  position: absolute;
  left: 2px;
  top: 4px;
  width: 9px;
  height: 5px;
  border-left: 1.5px solid var(--auksas);
  border-bottom: 1.5px solid var(--auksas);
  transform: rotate(-45deg);
}


.kj-btn {
  align-self: stretch;
  text-align: center;
  padding: 13px 18px;
  border-color: var(--auksas);
  color: var(--auksas);
  background: transparent;
}
.kj-btn:hover { background: rgba(168,135,76,.14); transform: translateY(-1px); }

/* Vienintelis uzpildytas mygtukas - ketvirtoje pakopoje: ji uzsakoma per
   pokalbi, ne per uzsakymo forma, tad ir veiksmas kitoks. */
.kj-btn-pilnas { background: var(--auksas); color: #16181a; }
.kj-btn-pilnas:hover { background: #bb9a5d; }

/* Zymele kabo VIRS stulpelio, o ne jo sraute: sraute ji nustumdavo
   ketvirtos pakopos kaina 30 px zemiau uz kitas tris, ir keturios
   kainos nebestovejo vienoje linijoje. */
.kj-nauja { position: relative; }
.kj-zymele {
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
  padding: 4px 12px;
  border: 1px solid var(--auksas);
  border-radius: 999px;
  font-size: 9.5px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--auksas);
}

@media (max-width: 980px) {
  .kj-tinklas { grid-template-columns: 1fr 1fr; }
  .kj-stulpelis { padding: 32px 24px 0; }
  /* Antroje eiluteje kairysis stulpelis vel yra krastinis, tad vertikali
     linija jam nebetinka - ja pakeicia horizontali virs eilutes. */
  .kj-stulpelis:nth-child(odd) { border-left: 0; }
  .kj-stulpelis:nth-child(n+3) { border-top: 1px solid rgba(168,135,76,.62); }
  /* Dviem stulpeliais ketvirtoji pakopa nusileidzia i antra eilute, tad
     virs jos jau nebe juostos krastas, o antrojo stulpelio mygtukas -
     kabanti zymele uzguldavo tiesiai ant jo. Cia ji grizta i srauta. */
  .kj-zymele { position: static; transform: none; margin-bottom: 12px; }
  .kj-tinklas { padding-top: 0; }
}

/* Telefone juosta suskyla i KETURIS atskirus tamsius blokus, o tarp ju
   matosi puslapio fonas (2026-09-09, jos sprendimas). Plona auksine
   linija vienoje ilgoje plokstėje nesimatydavo - zmogus neatskirdavo,
   kur baigiasi viena pakopa ir prasideda kita. Tarpas tai pasako be
   jokios linijos. */
@media (max-width: 620px) {
  .kainu-juosta {
    background: transparent;   /* fonas persikelia i pacius blokus */
    padding: 24px 0 44px;
  }
  /* 8px, o ne 14: jos prasymu tarpelis MINIMALUS - tik tiek, kad
     matytusi, kur baigiasi viena pakopa ir prasideda kita. */
  .kj-tinklas { grid-template-columns: 1fr; gap: 8px; padding-top: 0; }
  .kj-stulpelis {
    background: var(--royal-t);
    padding: 32px 24px 30px;
  }
  /* Linijos nebereikia: bloka nuo bloko skiria tarpas. */
  .kj-stulpelis + .kj-stulpelis { border: 0; margin-top: 0; }
  .kj-kaina { font-size: 40px; }
}