:root{
  --tuti:#c03886;        /* brändi magenta */
  --tuti-tume:#a02d70;
  --navy:#121e43;        /* tumesinine */
  --navy2:#182459;
  --kollane:#ffed4a;     /* CTA */
  --tekst:#1c2333;
  --tuhm:#61708a;
  --joon:#e4e8f0;
  --taust:#f7f9fc;
  /* Vahelduva rea taust. `--taust` (#f7f9fc) on valgest ainult 8/255 kaugusel
     ja suurel pinnal ei loe; see siin on 13/255 - naha, aga ei voistle
     sisuga. Nuppudel on oma valge taust, seega nad tousevad ribalt esile. */
  --riba:#f2f5fa;
}
*{box-sizing:border-box}
.ainult-lugejale{position:absolute!important;width:1px!important;height:1px!important;
  padding:0!important;margin:-1px!important;overflow:hidden!important;
  clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body{margin:0;background:#fff;color:var(--tekst);
  font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:inherit;text-decoration:none}
.raam{max-width:1180px;margin:0 auto;padding:0 20px}

/* ---------- päis ---------- */
header{background:var(--tuti);color:#fff;position:sticky;top:0;z-index:50;
  box-shadow:0 2px 12px rgba(0,0,0,.12)}
.pea{display:flex;align-items:center;gap:24px;padding:14px 0;flex-wrap:wrap}
.logo{font-size:24px;font-weight:800;letter-spacing:-.5px;display:flex;align-items:center;gap:9px}
.logo svg{width:30px;height:30px;flex:0 0 30px}
nav{margin-left:auto;display:flex;gap:22px;align-items:center;flex-wrap:wrap}
nav a{font-size:14.5px;font-weight:600;opacity:.94;padding:6px 0;border-bottom:2px solid transparent}
nav a:hover{border-bottom-color:var(--kollane);opacity:1}
nav a.esile{color:var(--kollane)}
.keeled{display:flex;gap:7px}
.keeled a{font-size:12px;font-weight:700;letter-spacing:.4px;opacity:.7;
  padding:3px 7px;border-radius:4px;background:rgba(255,255,255,.14)}
.keeled a:hover,.keeled a.aktiivne{opacity:1;background:rgba(255,255,255,.3)}

/* ---------- hero ---------- */
.hero{position:relative;background:var(--navy);color:#fff;text-align:center;
  padding:76px 0 128px;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;
  background:url('https://tutipluti.com/assets/img/aircraft-bg.jpg') center/cover no-repeat;
  opacity:.4}
.hero::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(18,30,67,.55) 0%,rgba(18,30,67,.9) 100%)}
.hero .raam{position:relative;z-index:2}
.hero h1{font-size:clamp(30px,5vw,50px);margin:0 0 14px;font-weight:800;letter-spacing:-1px}
.hero p{font-size:clamp(16px,2vw,19px);opacity:.9;margin:0 auto 28px;max-width:620px}
.cta{display:inline-block;background:var(--kollane);color:var(--navy);font-weight:800;
  padding:14px 32px;border-radius:999px;font-size:16px;
  box-shadow:0 6px 22px rgba(255,237,74,.3);transition:transform .15s}
.cta:hover{transform:translateY(-2px)}

/* ---------- otsingukast ---------- */
.otsikast{max-width:1000px;margin:-76px auto 0;position:relative;z-index:5;
  background:#fff;border-radius:14px;box-shadow:0 14px 44px rgba(18,30,67,.18);
  padding:22px}
.otsikast h2{margin:0 0 4px;font-size:17px}
.otsikast .abi{color:var(--tuhm);font-size:13.5px;margin:0 0 14px}
#widget-holder{min-height:112px}

/* ---------- sektsioonid ---------- */
section{padding:56px 0}
.pealkiri{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  margin-bottom:22px;flex-wrap:wrap}
.pealkiri h2{margin:0;font-size:26px;letter-spacing:-.4px}
.pealkiri a{color:var(--tuti);font-weight:700;font-size:14.5px}
.pealkiri p{margin:4px 0 0;color:var(--tuhm);font-size:15px;width:100%}

/* ---------- sihtkohad ---------- */
.sihid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:18px}
.siht{position:relative;border-radius:12px;overflow:hidden;aspect-ratio:4/3;
  background:var(--navy);display:block;box-shadow:0 3px 14px rgba(18,30,67,.1)}
/* `display:contents` teeb `<picture>` paigutusele labipaistvaks. Ilma
   selleta jaaks ta `.siht` ja `img` vahele ning `height:100%` ei leiaks
   alust - pilt kukuks kokku. */
.siht picture{display:contents}
.siht img{width:100%;height:100%;object-fit:cover;transition:transform .45s;display:block}
.siht:hover img{transform:scale(1.06)}
.siht::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 42%,rgba(18,30,67,.88) 100%)}
.siht-info{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;z-index:2;
  display:flex;justify-content:space-between;align-items:flex-end;gap:10px;color:#fff}
.siht-nimi{font-weight:700;font-size:16px;line-height:1.25}
.siht-hind{font-size:12.5px;opacity:.9;white-space:nowrap}
.siht-hind b{color:var(--kollane);font-size:16px}

/* ---------- kuidas töötab ---------- */
.taust{background:var(--taust)}
.sammud{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px}
.samm{background:#fff;border:1px solid var(--joon);border-radius:12px;padding:22px}
.samm .nr{width:34px;height:34px;border-radius:50%;background:var(--tuti);color:#fff;
  display:grid;place-items:center;font-weight:800;margin-bottom:12px}
.samm h3{margin:0 0 6px;font-size:17px}
.samm p{margin:0;color:var(--tuhm);font-size:14.5px}

/* ---------- SEO tekst ---------- */
.sisu{max-width:760px}
.sisu h2{font-size:24px;margin:0 0 12px}
.sisu p{color:#3b465c;margin:0 0 14px}

/* ---------- jalus ---------- */
footer{background:var(--navy);color:#fff;padding:48px 0 0;margin-top:20px}
.jalus{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:30px;
  padding-bottom:34px}
.jalus h4{margin:0 0 12px;font-size:13px;text-transform:uppercase;letter-spacing:.9px;
  color:var(--kollane)}
.jalus a{display:block;padding:4px 0;opacity:.82;font-size:14.5px}
.jalus a:hover{opacity:1;text-decoration:underline}
.autor{background:var(--navy2);text-align:center;padding:16px 0;font-size:13.5px;opacity:.85}

/* ---------- sihtkohalehe osad ---------- */
.hero-siht{padding:56px 0 40px;text-align:left}
.hero-siht::before{background-image:var(--siht-pilt, url('/assets/img/aircraft-bg.jpg'))}
.tee{font-size:13px;opacity:.75;margin:0 0 8px}
.hero-siht h1{font-size:clamp(28px,4.4vw,42px);margin:0 0 6px}
.alapealkiri{margin:0 0 20px;opacity:.9;font-size:16px}
.altid{display:flex;gap:9px;flex-wrap:wrap}
.alt{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);
  padding:8px 15px;border-radius:999px;font-size:14px;font-weight:600}
.alt b{color:var(--kollane)}
.alt:hover{background:rgba(255,255,255,.24)}
.alt.aktiivne{background:var(--kollane);color:var(--navy);border-color:var(--kollane)}
.alt.aktiivne b{color:var(--navy)}

.veerud{display:grid;grid-template-columns:1fr 330px;gap:32px;padding:36px 0 10px;align-items:start}
@media(max-width:900px){.veerud{grid-template-columns:1fr}}
.plokk{margin-bottom:34px}

.pakkumised{display:flex;flex-direction:column;gap:10px}
/* Taidis on 9px KOIGIL ridadel. Varem oli baasil 14px ja `.detailidega`
   kirjutas 9px peale - sisu korgus oli molemal identne (suurim laps 30px),
   aga lennuinfota rida jai 10px korgemaks ja nimekiri nagi ebauhtlane valja.
   Kui vahet ei ole sisus, ei tohi teda olla ka taidises. */
.pakkumine{display:grid;grid-template-columns:1fr auto auto;gap:16px;align-items:center;
  padding:9px 12px 9px 18px;background:transparent;border:0;border-radius:0}
.pk-kuup{display:flex;align-items:center;gap:12px;font-size:14.5px;flex-wrap:wrap}
.pk-nool{color:var(--tuhm)}
.pk-ood{color:var(--tuhm);font-size:13.5px;white-space:nowrap}
.pk-hind{font-weight:800;font-size:19px;color:var(--tuti);white-space:nowrap}
/* Kuupaeva veerg on `auto`, MITTE fikseeritud piksliarv.
   Proovisin jarjest 155, 172 ja 184 px - iga kord murdus mone keele mone
   kuupaari peal ikka midagi ("K 10. veebr → K 24. veebr" vajab 186 px).
   Pikslite jahtimine ei loppe kunagi: kuunimede pikkus soltub keelest,
   nadalapaevast ja sellest, kas paev on uhe- voi kahekohaline.
   `auto` annab veerule tapselt tema sisu laiuse ja marsruut (`minmax(0,1fr)`)
   votab ulejaanu - `white-space:nowrap` all tagab, et murdmist ei toimu. */
.pakkumine.detailidega{grid-template-columns:auto minmax(0,1.55fr) auto auto;gap:14px}
/* Kaks suunda korvuti. `minmax(0,1fr)` on oluline: ilma selleta ei kahaneks
   veerud alla sisu min-laiuse ja rida murduks. */
.pk-marsruudid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:2px 18px;min-width:0}
/* 108 px: "08:05-06:05+2" mootdetud vajadus. 92 px juures loigati "+1" ara. */
.pk-lend{display:grid;grid-template-columns:17px 108px minmax(0,1fr);align-items:baseline;
  gap:7px;min-width:0;font-size:12.5px;line-height:1.35}
/* Tekstisilt "VALJA"/"TAGASI" votas 42 px. Sama selge lennukisiluett on
   valjalennul paremale ja tagasilennul vasakule pooratud; see jaab ka 16 px
   juures arusaadavaks ning on keeleulene. `aria-label` kannab teksti edasi. */
.pk-suund{display:inline-flex;align-items:center;justify-content:center;
  width:17px;height:17px;color:var(--tuti);align-self:center}
.pk-suund svg{display:block;width:16px;height:16px}
.pk-ajad{font-size:13px;color:var(--tekst);white-space:nowrap}
.pk-lennu-meta{min-width:0;color:var(--tuhm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.koik-nupp{display:inline-block;margin-top:16px;color:var(--tuti);font-weight:700;font-size:15px}

aside .kaart-info{background:#fff;border:1px solid var(--joon);border-radius:12px;
  padding:18px;margin-bottom:18px}
aside h3{margin:0 0 12px;font-size:16px}
.faktid{list-style:none;margin:0;padding:0}
.faktid li{display:flex;justify-content:space-between;padding:7px 0;
  border-bottom:1px solid var(--joon);font-size:14.5px}
.faktid li:last-child{border:0}
.faktid span{color:var(--tuhm)}

/* ---------- kuude riba: hind ja ilm kõrvuti ---------- */
/* Flex, mitte grid auto-fit: kui skann leiab ainult paar kuud, venitas
   `1fr` need ule poole lehe ja riba nagi katki valja. `max-width` hoiab
   kaardi kuu-suuruseks ka siis, kui neid on kaks. */
.kuuriba{display:flex;flex-wrap:wrap;gap:9px;margin-top:6px}
.kuu-kaart{flex:1 1 104px;max-width:168px}
.kuu-kaart{position:relative;display:flex;flex-direction:column;gap:3px;
  background:#fff;border:1px solid var(--joon);border-radius:10px;padding:13px 11px 11px;
  text-align:center;transition:border-color .15s,transform .15s}
.kuu-kaart:hover{border-color:var(--tuti);transform:translateY(-2px)}
.kuu-nimi{font-size:12px;color:var(--tuhm);text-transform:uppercase;letter-spacing:.6px;font-weight:700}
.kuu-hind{font-size:19px;font-weight:800;color:var(--tekst)}
.kuu-ilm{font-size:12px;color:var(--tuhm)}
.kuu-kaart.odav .kuu-hind{color:#1a7f4b}
.kuu-kaart.parim{border-color:var(--tuti);border-width:2px;padding-top:18px;
  box-shadow:0 4px 18px rgba(192,56,134,.16)}
.kuu-kaart.parim .kuu-hind{color:var(--tuti)}
.lipik{position:absolute;top:-9px;left:50%;transform:translateX(-50%);
  background:var(--tuti);color:#fff;font-size:10px;font-weight:800;letter-spacing:.5px;
  padding:2px 9px;border-radius:999px;white-space:nowrap;text-transform:uppercase}
.kuuriba-selgitus{margin:14px 0 0;color:var(--tuhm);font-size:13.5px;line-height:1.55}
.kuuriba-selgitus b{color:var(--tekst)}

/* ---------- otsingu ülekate: vidin täislaiuses ---------- */
.otsi-nupp{display:block;width:100%;text-align:center;background:var(--tuti);color:#fff;
  border:0;border-radius:9px;padding:13px;font:inherit;font-weight:700;font-size:15px;
  cursor:pointer;transition:background .15s}
.otsi-nupp:hover{background:var(--tuti-tume)}
.otsi-abi{margin:9px 0 0;font-size:12.5px;color:var(--tuhm);text-align:center;line-height:1.5}

#ulekate{position:fixed;inset:0;z-index:900;display:none;
  background:rgba(12,18,34,.72);backdrop-filter:blur(3px)}
#ulekate.avatud{display:flex;align-items:flex-start;justify-content:center;padding:26px 16px}
.ulekate-sisu{background:#fff;border-radius:14px;width:100%;max-width:1080px;
  max-height:calc(100vh - 52px);display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.4)}
.ulekate-pea{display:flex;align-items:center;gap:14px;padding:14px 20px;
  border-bottom:1px solid var(--joon);flex:0 0 auto}
.ulekate-pea h3{margin:0;font-size:16.5px}
.ulekate-pea .alam{color:var(--tuhm);font-size:13px}
.ulekate-sulge{margin-left:auto;background:var(--taust);border:1px solid var(--joon);
  border-radius:8px;padding:7px 13px;font:inherit;font-size:14px;cursor:pointer}
.ulekate-sulge:hover{background:#eef1f6}
.ulekate-keha{flex:1;overflow:auto;-webkit-overflow-scrolling:touch}
.ulekate-keha iframe{width:100%;border:0;display:block;min-height:640px}
.ulekate-laeb{padding:60px 20px;text-align:center;color:var(--tuhm);font-size:14.5px}
@media(max-width:700px){
  #ulekate.avatud{padding:0}
  .ulekate-sisu{max-height:100vh;border-radius:0}
}
/* klikitavad kaardid */
.pakkumine,.kuu-kaart{cursor:pointer}

/* ---------- tabid: pakkumised vs oma otsing ---------- */
.tabid{display:flex;gap:4px;border-bottom:2px solid var(--joon);margin-bottom:20px}
.tab{background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-2px;
  padding:11px 18px;font:inherit;font-weight:700;font-size:15px;color:var(--tuhm);
  cursor:pointer;transition:color .15s,border-color .15s;display:flex;align-items:center;gap:7px}
.tab:hover{color:var(--tekst)}
.tab.aktiivne{color:var(--tuti);border-bottom-color:var(--tuti)}
.tab .arv{background:var(--taust);color:var(--tuhm);border-radius:999px;
  padding:1px 8px;font-size:12px;font-weight:700}
.tab.aktiivne .arv{background:#fce8f3;color:var(--tuti)}
.paneel{display:none}
.paneel.aktiivne{display:block}
.otsi-pea{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.otsi-pea h3{margin:0;font-size:17px}
.otsi-pea span{color:var(--tuhm);font-size:13.5px}
#paneel-otsing{padding:16px;border-radius:12px;background:#f4f6f8}
/* Korguse maarab vidin ise postMessage'iga (vt offers.blade.php).
   `min-height` on ainult stardiseis, kuni esimene teade saabub -
   `height` fikseeritud vaartus loikaks tulemused ara. */
#vidin-konteiner iframe,#tyhi-vidin iframe{width:100%;border:0;display:block;min-height:680px;
  border-radius:10px;transition:height .2s}
.vidin-laeb{padding:70px 20px;text-align:center;color:var(--tuhm);font-size:14.5px;
  border:1px dashed var(--joon);border-radius:10px}
@media(max-width:600px){
  .tab{padding:10px 12px;font-size:14px}
  #paneel-otsing{margin:0 -14px;padding:12px;border-radius:8px}
}

/* ---------- hero: peamine number kohe nähtavale ---------- */
.hero-kokkuvote{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:2px 0 14px}
.hero-hind{font-size:clamp(30px,4vw,40px);font-weight:800;color:var(--kollane);line-height:1}
.hero-hind small{font-size:15px;font-weight:600;opacity:.85;margin-right:5px;color:#fff}
.hero-vahe{opacity:.45}
.hero-fakt{font-size:15px;opacity:.92}
.hero-fakt b{color:var(--kollane)}

/* ---------- tabid täislaiuses, väljaspool veerge ---------- */
/* Kulgpolsterdus PEAB jaama: `.raam` annab 20px ja ilma selleta puutusid
   pakkumised ja tabid mobiilis ekraani serva, samal ajal kui pealkiri ja
   kuuriba seisid 20px sissepoole. Vertikaalne polsterdus on siin eriline,
   horisontaalne mitte. */
.laia-plokk{padding:10px 20px 46px}
.tabid-raam{border-bottom:2px solid var(--joon);margin-bottom:20px}

/* ---------- külgriba: toetab, ei võistle ---------- */
.ylevaade{background:var(--navy);color:#fff;border:0}
.ylevaade h3{color:var(--kollane)}
.yl-rida{display:flex;justify-content:space-between;align-items:baseline;gap:10px;
  padding:8px 0;border-bottom:1px solid rgba(255,255,255,.13);font-size:14.5px}
.yl-rida:last-child{border:0}
.yl-rida span{opacity:.72}
.yl-rida b{font-weight:700}
.yl-suur{font-size:22px;color:var(--kollane)}
.yl-vihje{margin:12px 0 0;font-size:12.5px;opacity:.62;line-height:1.5}
.lahedal a{display:flex;justify-content:space-between;padding:9px 0;font-size:14.5px;
  border-bottom:1px solid var(--joon)}
.lahedal a:last-child{border:0}
.lahedal a:hover{color:var(--tuti)}
.lahedal b{color:var(--tuhm);font-weight:600}
.lahedal a:hover b{color:var(--tuti)}

/* ---------- PARANDUSED ---------- */

/* Värv: aside .kaart-info (0,1,1) kaalus üles .ylevaade (0,1,0) ja jättis
   kollase teksti valgele taustale. Tõstame spetsiifilisuse (0,2,0). */
.kaart-info.ylevaade{background:var(--navy);color:#fff;border:0}
.kaart-info.ylevaade h3{color:var(--kollane)}

/* Paigutus: külgriba oli kaks korda pikem kui sisu tema kõrval ja jättis
   400 px tühja auku. Kaotame kaheveerulisuse - kõik sektsioonid täislaiuses,
   infokaardid ühele reale. Kuuriba saab nii ka 7 kaardile ühe rea. */
.veerud{display:block;padding:32px 0 0}
.veerud aside{display:contents}
.infokaardid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:18px;padding:6px 0 46px;align-items:start}
.infokaardid .kaart-info{margin:0}

/* Joondus: .hero p{margin:0 auto;max-width:620px} tsentreeris ka leivapuru
   ja alapealkirja, kuigi sihtkohalehe hero on vasakule joondatud. */
.hero-siht .tee,
.hero-siht .alapealkiri{margin-left:0;margin-right:0;max-width:none}
.hero-siht .alapealkiri{max-width:640px}

/* Tume täide maha: kolm kõrvuti kaarti peavad olema võrdsed, mitte üks
   raske plokk kahe hele kõrval. Hierarhia tuleb hinnast, mitte taustast.
   Ühtlasi lõppes tekst sinisest kastist välja. */
.kaart-info.ylevaade{background:#fff;color:var(--tekst);border:1px solid var(--joon)}
.kaart-info.ylevaade h3{color:var(--tekst)}
.ylevaade .yl-rida{border-bottom:1px solid var(--joon);min-width:0}
.ylevaade .yl-rida span{color:var(--tuhm);opacity:1;flex:0 0 auto}
.ylevaade .yl-rida b{color:var(--tekst);text-align:right;min-width:0;
  overflow-wrap:anywhere}
.ylevaade .yl-suur{color:var(--tuti);font-size:24px;line-height:1.1}
.ylevaade .yl-vihje{color:var(--tuhm);opacity:1;border-top:1px solid var(--joon);
  padding-top:10px;margin-top:12px}

/* Kastid maha. Vana reegel oli `aside .kaart-info`, aga kaardid ei ole enam
   aside sees - seetõttu sai äärise ainult Ülevaade ja kolmik nägi ebaühtlane
   välja. Kolm veergu ilma raamideta on puhtam kui kolm kasti. */
.infokaardid{gap:12px 48px;padding:10px 0 44px}
.infokaardid .kaart-info,
.infokaardid .kaart-info.ylevaade{
  background:none;border:0;border-radius:0;padding:0;margin:0}
.infokaardid h3{font-size:13px;text-transform:uppercase;letter-spacing:.8px;
  color:var(--tuhm);margin:0 0 10px;font-weight:700}
.infokaardid .yl-rida,
.infokaardid .faktid li,
.infokaardid .lahedal a{border-bottom:1px solid var(--joon);padding:9px 0}
.infokaardid .kaart-info > *:last-child{border-bottom:0}
.ylevaade .yl-suur{color:var(--tuti);font-size:23px;line-height:1.1;font-weight:800}
.ylevaade .yl-vihje{border-top:0;padding-top:8px;margin-top:8px;font-size:12px}

/* .ylevaade .yl-rida b (0,2,1) kaalus üles .ylevaade .yl-suur (0,2,0). */
.ylevaade .yl-rida b.yl-suur{color:var(--tuti)}

/* Lähedal: kitsast veerust täislaiuses ribaks. See on cross-sell ja sisemine
   linkimine, mitte kõrvalmärkus - hoiab külastajat saidil ja tugevdab
   teiste sihtkohalehtede positsiooni otsingus. Kaugus tuleb automaatselt
   koordinaatidest, hind andmebaasist - käsitsi ei hallata midagi. */
.lahedal-riba{padding:4px 0 44px}
.lahedal-riba h3{font-size:13px;text-transform:uppercase;letter-spacing:.8px;
  color:var(--tuhm);margin:0 0 12px;font-weight:700}
/* Kaardi struktuur on kolmerealine ja FIKSEERITUD: nimi, siis hind ja
   kaugus korvuti. Varem oli see uks flex-rida `flex-wrap`iga, mis tahendas,
   et pika nimega kaardil hupppas hind uuele reale ja luhikesega jai korvale
   - kuus kaarti, kuus eri korgust. */
.lahedal-sihid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.lahedal-sihid a{display:flex;flex-direction:column;justify-content:space-between;gap:8px;
  border:1px solid var(--joon);border-radius:10px;padding:12px 14px;
  transition:border-color .15s,background .15s}
.lahedal-sihid a:hover{border-color:var(--tuti);background:#fdf4f9}
.lahedal-sihid > a > span:first-child{font-weight:600;font-size:15px;line-height:1.3}

/* Kuu ja ood eraldi metareal: neli fakti uhel real ei mahu 190 px kaardile
   ilma murdumata, aga kolmerealisena on iga fakt oma kohal ja kaardid
   jaavad uhekorgusteks. */
.lahedal-meta{font-size:11.5px;font-weight:700;letter-spacing:.5px;
  text-transform:uppercase;color:#8a8fa3;margin-top:-2px}
.lahedal-sihid .lahedal-alumine{display:flex;align-items:baseline;
  justify-content:space-between;gap:10px}
.lahedal-sihid b{color:var(--tuti);font-weight:800;font-size:17px;white-space:nowrap}
.lahedal-sihid em{font-style:normal;color:var(--tuhm);font-size:12.5px;white-space:nowrap}

/* Hero kannab ainult otsust: nimi + hind + suund. Praktilised detailid
   (lennuaeg, vahemaandumised, ajavahe) on vaiksel metareal hero all -
   need huvitavad alles siis, kui inimene on juba huvitatud. */
.hero-kokkuvote{align-items:baseline;gap:14px;margin:2px 0 18px}
.hero-suund{font-size:16px;opacity:.88}
.meta-riba{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0;
  padding:14px 0 2px;color:var(--tuhm);font-size:13.5px}
.meta-riba span{display:flex;align-items:center;gap:8px}
.meta-riba span:not(:last-child)::after{content:"";width:3px;height:3px;
  border-radius:50%;background:var(--joon);margin-left:12px}
.meta-varske{color:#1a7f4b}
.meta-varske::before{content:"●";font-size:8px;margin-right:2px}

/* Reisipikkuse filter. Nupud tekivad skannitud andmetest - kui mingit
   pikkust andmetes ei ole, ei ole ka nuppu. Hind nupul teeb valikust
   info: kohe on näha, et 14 ööd on odavam kui 5. */
.ood-filter{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px}
.ood-nupp{background:#fff;border:1px solid var(--joon);border-radius:999px;
  padding:8px 15px;font:inherit;font-size:14px;cursor:pointer;
  display:flex;align-items:baseline;gap:7px;transition:all .15s}
.ood-nupp:hover{border-color:var(--tuti)}
.ood-nupp b{color:var(--tuti);font-weight:700}
.ood-nupp.aktiivne{background:var(--tuti);border-color:var(--tuti);color:#fff}
.ood-nupp.aktiivne b{color:#fff}
.pakkumine[hidden]{display:none}
.filter-tyhi{color:var(--tuhm);padding:22px 0;text-align:center}

/* "Näita rohkem" - filter ja piir töötavad koos, filtri vahetus alustab
   uuesti kümnest. */
.veel-nupp{display:block;width:100%;margin-top:12px;background:#fff;
  border:1px solid var(--joon);border-radius:10px;padding:13px;
  font:inherit;font-weight:600;font-size:14.5px;color:var(--tuti);cursor:pointer;
  transition:border-color .15s,background .15s}
.veel-nupp:hover{border-color:var(--tuti);background:#fdf4f9}
.veel-nupp[hidden]{display:none}

/* "Otsi ise" on konversioonitee, mitte passiivne silt. Lükkame paremale ja
   anname nupu ilme, aga jätame tabi semantika - see on ikkagi teine vaade,
   mitte eraldi leht. */
.tab-otsi{margin-left:auto;border:1px solid var(--joon);border-radius:999px;
  border-bottom-width:1px;margin-bottom:8px;padding:9px 18px;color:var(--tuti);
  background:#fff}
.tab-otsi svg{width:16px;height:16px;flex:0 0 16px}
.tab-otsi:hover{border-color:var(--tuti);background:#fdf4f9;color:var(--tuti)}
.tab-otsi.aktiivne{background:var(--tuti);border-color:var(--tuti);color:#fff;
  border-bottom-color:var(--tuti)}
@media(max-width:600px){
  .tab-otsi{margin-left:0;width:100%;justify-content:center;margin-top:6px}
  .tabid{flex-wrap:wrap}
}

/* "Otsi ise" on konversioonitee ja peab reas kõige tugevam olema. Valge nupp
   halli äärisega valgel taustal ei eristunud - täidame brändivärviga. */
.tab-otsi{background:var(--tuti);border-color:var(--tuti);color:#fff;font-weight:700;
  padding:11px 22px;box-shadow:0 3px 12px rgba(192,56,134,.28)}
.tab-otsi:hover{background:var(--tuti-tume);border-color:var(--tuti-tume);
  color:#fff;box-shadow:0 5px 16px rgba(192,56,134,.36);transform:translateY(-1px)}
.tab-otsi svg{width:17px;height:17px;flex:0 0 17px}
/* aktiivsena jääb täidetuks, aga rahuneb - vaade ise ütleb, kus sa oled */
.tab-otsi.aktiivne{box-shadow:none;transform:none;background:var(--tuti-tume);
  border-color:var(--tuti-tume)}

/* ---------- logo ---------- */
.logo{display:flex;align-items:center;text-decoration:none}
.logo-pilt{display:block;width:210px;height:30px;transition:transform .2s}
.logo:hover .logo-pilt{transform:translateY(-2px)}

/* ---------- keelevalik (dropdown) ---------- */
.keel{position:relative}
.keel > summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;
  font-size:12.5px;font-weight:700;letter-spacing:.4px;color:#fff;
  padding:5px 9px;border-radius:7px;background:rgba(255,255,255,.14);
  transition:background .15s}
.keel > summary::-webkit-details-marker{display:none}
.keel > summary:hover,.keel[open] > summary{background:rgba(255,255,255,.28)}
.keel-gloobus{width:15px;height:15px;flex:0 0 15px;fill:none;stroke:currentColor;
  stroke-width:1.7;opacity:.85}
.keel-nool{width:13px;height:13px;flex:0 0 13px;fill:none;stroke:currentColor;
  stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;opacity:.8;
  transition:transform .18s}
.keel[open] .keel-nool{transform:rotate(180deg)}
.keel > ul{position:absolute;top:calc(100% + 8px);right:0;z-index:60;
  min-width:172px;margin:0;padding:6px;list-style:none;
  background:#fff;border-radius:11px;box-shadow:0 12px 32px rgba(18,30,67,.24)}
.keel > ul a{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:7px;
  font-size:14px;font-weight:500;color:var(--navy);opacity:1;border-bottom:none}
.keel > ul a:hover{background:#f3f4f8;border-bottom:none}
.keel > ul a b{font-size:11px;font-weight:800;letter-spacing:.5px;color:#8a8fa3;
  min-width:20px}
.keel > ul a.aktiivne{background:rgba(192,56,134,.09);color:var(--tuti)}
.keel > ul a.aktiivne b{color:var(--tuti)}

/* ---------- Blade'i-spetsiifiline ---------- */
.keel > ul a img{width:18px;height:12px;object-fit:cover;border-radius:2px}
.tyhi-teade{max-width:640px;margin:48px auto;text-align:center;color:#5a6079}
.tyhi-teade h2{font-size:20px;color:var(--navy);margin:0 0 8px}
.tyhi-otsing{margin:26px 0 8px;padding:22px;background:#f4f6f8;border-radius:14px}
.tyhi-otsing-pea{max-width:720px;margin:0 auto 16px;text-align:center}
.tyhi-otsing-pea h2{margin:0 0 5px;font-size:21px;color:var(--navy)}
.tyhi-otsing-pea p{margin:0;color:var(--tuhm)}
@media(max-width:640px){
  .tyhi-otsing{margin:22px -20px 0;padding:18px 0;border-radius:0}
  .tyhi-otsing-pea{padding:0 18px}
}

/* Sihtkoht ilma pildita: uusi sihtkohti tuleb mootorist juurde kiiremini
   kui pilte jouab lisada. Ilma selleta oleks kaart labipaistev auk. */
.siht-pildita{background:linear-gradient(140deg,var(--navy2),var(--tuti))}
.siht-pildita::after{opacity:.35}

/* Hero ja sisu vahel peab olema hingamisruum. `.plokk` kannab ainult
   alumist marginaali, seega esimene plokk hero all kleepus vastu serva. */
.hero + .raam{padding-top:34px}
@media (max-width:640px){.hero + .raam{padding-top:20px}}

/* Piltideta sihtkoht: 133 uut sihtkohta 183-st tuli mootorist ilma pildita.
   Toon tuleb sihtkoha nimest, aga ainult brandi vahemikust (sinine ->
   lilla -> magenta). Vaba 0-360 andis oliivi ja pruuni, mis nagi vea moodi. */
.siht-pildita{background:linear-gradient(150deg,
  hsl(var(--h,250) 42% 24%), hsl(calc(var(--h,250) + 26) 52% 40%))}
.siht-pildita::after{opacity:.3}

.veel-riba{display:flex;justify-content:center;margin:26px 0 8px}

/* `.siht` maarab `display:block`, mis lubi ule brauseri `[hidden]` reegli -
   peidetud kaardid votsid endiselt ruumi ja leht jai 40 000 px pikaks.
   Sama loks ahvardab iga elementi, millele oleme display'd andnud. */
.siht[hidden],.pakkumine[hidden],.veel-nupp[hidden]{display:none !important}

/* ---------- ilmafilter sihtkohtade nimekirjas ---------- */
.ilma-filter{display:flex;flex-wrap:wrap;align-items:center;gap:18px 26px;margin:0 0 20px}
.filter-grupp{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.filter-silt{font-size:12px;font-weight:700;letter-spacing:.7px;text-transform:uppercase;
  color:var(--tuhm);margin-right:2px}

/* Ilm kaardil: sama ploki sees nagu nimi ja hind, aga omaette real, et
   hind jaaks juhtivaks numbriks. Temperatuur on see, mille jargi
   filtreeritakse, seega ta peab olema loetav ka pildi peal. */
.siht-ilm{position:absolute;top:10px;left:10px;z-index:2;display:flex;align-items:center;
  gap:7px;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:600;
  color:#fff;background:rgba(10,16,38,.55);backdrop-filter:blur(6px)}
.siht-kraadid{font-size:14px;font-weight:800;color:var(--kollane)}
.siht-vihm{opacity:.8;font-weight:500}

/* ---------- reisiperioodi valik ---------- */
.periood-filter{margin:0 0 18px;padding:16px 18px;border:1px solid var(--joon);
  border-radius:12px;background:#fbfbfd}
.periood-filter .filter-grupp{gap:12px}
.kp-nupp{align-self:flex-end;font:inherit;font-weight:700;font-size:14px;cursor:pointer;
  padding:9px 20px;border:0;border-radius:8px;background:var(--tuti);color:#fff;
  transition:background .15s}
.kp-nupp:hover{background:var(--tuti-tume)}
.kp-tyhista{align-self:flex-end;padding:9px 4px;font-size:13.5px;color:var(--tuhm);
  text-decoration:underline}
.kp-tyhista:hover{color:var(--tuti)}
.periood-abi{margin:10px 0 0}

/* Kuu kaardi paremas ulanurgas, ilmatsipi vastas. Kaks fakti servades
   hoiavad keskosa pildile vabaks ja alumise riba nimele ja hinnale. */
.siht-kuu{position:absolute;top:10px;right:10px;z-index:2;
  padding:5px 10px;border-radius:999px;font-size:11.5px;font-weight:800;
  letter-spacing:.6px;text-transform:uppercase;color:var(--navy);
  background:var(--kollane);box-shadow:0 2px 8px rgba(10,16,38,.25)}


/* Reisi pikkus kuu korval - sama vaiksem stiil, eraldatud punktiga. */
.siht-ood{font-style:normal;font-weight:600;opacity:.72;margin-right:5px;font-size:11.5px}
.siht-ood::before{content:"· ";opacity:.6}

/* ---------- kuupäevakalender ---------- */
.periood-filter{position:relative}
.kp-avaja{display:flex;align-items:center;gap:9px;font:inherit;font-size:14.5px;
  font-weight:600;color:var(--tekst);cursor:pointer;padding:10px 16px;
  border:1px solid var(--joon);border-radius:9px;background:#fff;transition:border-color .15s,box-shadow .15s}
.kp-avaja:hover{border-color:var(--tuti)}
.kp-avaja[aria-expanded="true"]{border-color:var(--tuti);box-shadow:0 0 0 3px rgba(192,56,134,.14)}
.kp-avaja svg{width:17px;height:17px;flex:0 0 17px;color:var(--tuti)}

.kalender{position:absolute;z-index:70;top:calc(100% - 8px);left:18px;
  padding:16px;border-radius:14px;background:#fff;
  border:1px solid var(--joon);box-shadow:0 18px 44px rgba(18,30,67,.2)}
.kal-pea{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.kal-kuud{font-size:14.5px;font-weight:700;color:var(--navy);text-transform:capitalize}
.kal-nool{font:inherit;font-size:20px;line-height:1;cursor:pointer;width:32px;height:32px;
  border:1px solid var(--joon);border-radius:8px;background:#fff;color:var(--navy)}
.kal-nool:hover{border-color:var(--tuti);color:var(--tuti)}

.kal-ruudustik{display:flex;gap:26px}
.kal-kuu{width:238px}
.kal-nadal{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.kal-pealkirjad span{text-align:center;font-size:11px;font-weight:700;letter-spacing:.4px;
  text-transform:uppercase;color:var(--tuhm);padding:4px 0 6px}

.kal-paev{font:inherit;font-size:13.5px;font-weight:600;cursor:pointer;aspect-ratio:1;
  border:0;background:transparent;color:var(--tekst);border-radius:8px;
  display:grid;place-items:center;transition:background .12s,color .12s}
.kal-paev:hover:not(:disabled){background:rgba(192,56,134,.12);color:var(--tuti)}
.kal-mineviku{color:#c3c7d4;cursor:default}
.kal-tana{outline:1px solid var(--joon)}

/* Vahemik: otsad taidetud, keskosa hele riba. `border-radius` ainult
   otstel, nii et riba loeb uhe pideva vahemikuna. */
.kal-vahemikus{background:rgba(192,56,134,.11);border-radius:0}
.kal-algus,.kal-lopp{background:var(--tuti);color:#fff}
.kal-algus{border-radius:8px 0 0 8px}
.kal-lopp{border-radius:0 8px 8px 0}
.kal-algus.kal-lopp{border-radius:8px}
.kal-algus:hover,.kal-lopp:hover{background:var(--tuti-tume);color:#fff}

.kal-jalg{display:flex;align-items:center;justify-content:space-between;gap:14px;
  margin-top:14px;padding-top:13px;border-top:1px solid var(--joon)}
.kal-valik{font-size:13px;font-weight:600;color:var(--tuhm)}

/* Kuu nimi iga kuu kohal. Laual dubleerib ta paise, seega on seal peidus;
   mobiilis on kuud ULEKSTEISE ja siis on oma pealkiri hadavajalik. */
.kal-kuu-nimi{display:none}

@media (max-width:700px){
  /* Mobiilis lykkab kalender sisu allapoole, mitte ei kata seda. Ripp-paneel
     jattis kinnitusnupu ekraanist valja ja kattis filtrid, mida kasutaja
     jargmisena vajutab. */
  .kalender{position:static;margin-top:14px;padding:14px;box-shadow:none;
    border-color:var(--joon)}

  /* Kaks kuud UKSTEISE ALL. Uhe kuuga pidi vahemiku lopu jaoks noolega
     jargmisse kuusse liikuma - ja just see tundus katki, sest reis ule
     kuupiiri on pigem reegel kui erand. */
  .kal-ruudustik{flex-direction:column;gap:18px}
  .kal-kuu{width:100%}
  .kal-kuu-nimi{display:block;margin:0 0 8px;font-size:14px;font-weight:700;
    color:var(--navy);text-transform:capitalize;text-align:center}
  .kal-kuud{display:none}          /* paises dubleeriks kuude nimesid */
  .kal-pea{justify-content:space-between}
  .kal-paev{font-size:15px}
  .kal-jalg{flex-wrap:wrap;position:sticky;bottom:0;background:#fff;
    padding-bottom:2px}
  .kp-nupp{flex:1 1 auto}
}

/* Ööde riba perioodivaliku all - lingid, mitte nupud, sest need muudavad
   URL-i ja peavad olema jagatavad. */
.ood-riba{margin-top:14px}
.ood-riba .ood-nupp{text-decoration:none}
.ood-yhik{font-weight:500;opacity:.7;font-size:12px}

/* ---------- mobiil: burgermenüü ---------- */
.burger{display:none;flex-direction:column;justify-content:center;gap:5px;
  width:42px;height:38px;margin-left:auto;padding:0 9px;cursor:pointer;
  border:1px solid rgba(255,255,255,.28);border-radius:9px;
  background:rgba(255,255,255,.12);transition:background .15s}
.burger span{display:block;height:2px;border-radius:2px;background:#fff;
  transition:transform .22s,opacity .18s}
.burger:hover{background:rgba(255,255,255,.22)}
.burger.avatud span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.avatud span:nth-child(2){opacity:0}
.burger.avatud span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:860px){
  /* Logo keskele, burger paremasse serva. `justify-content:center` koos
     absoluutse burgeriga hoiab logo tapselt keskel ka siis, kui nupu laius
     muutub - `margin-left:auto` oleks logo nupu vorra vasakule nihutanud. */
  .pea{position:relative;justify-content:center;gap:0;padding:13px 0;min-height:56px}
  .burger{display:flex;position:absolute;right:20px;top:50%;
    transform:translateY(-50%);margin-left:0}
  .logo-pilt{width:175px;height:25px}

  /* Menüü langeb päise alla täislaiuses paneelina. `max-height` animeerub,
     `display:none` ei animeeruks — ja jätaks lingid tabulaatorile kättesaadavaks. */
  header nav{position:absolute;top:calc(100% + 13px);left:0;right:0;z-index:60;
    flex-direction:column;align-items:stretch;gap:0;margin:0;
    max-height:0;overflow:hidden;background:var(--tuti-tume);
    box-shadow:0 14px 30px rgba(18,30,67,.22);
    transition:max-height .26s ease}
  header nav.avatud{max-height:340px}
  header nav > a{padding:14px 20px;border-bottom:1px solid rgba(255,255,255,.14);
    border-bottom-color:rgba(255,255,255,.14);font-size:15.5px}
  header nav > a:hover{background:rgba(255,255,255,.1);border-bottom-color:rgba(255,255,255,.14)}

  /* Keelevalik menüü sees: täislaiuses rida, avatuna kohapeal, mitte rippmenüüna */
  .keel{width:100%;padding:10px 20px 14px}
  .keel > summary{justify-content:flex-start}
  .keel > ul{position:static;margin-top:8px;min-width:0;box-shadow:none;
    background:rgba(255,255,255,.1);padding:5px}
  .keel > ul a{color:#fff}
  .keel > ul a:hover{background:rgba(255,255,255,.14)}
  .keel > ul a b{color:rgba(255,255,255,.65)}
  .keel > ul a.aktiivne{background:rgba(255,255,255,.2);color:#fff}
  .keel > ul a.aktiivne b{color:var(--kollane)}
}

@media (max-width:640px){
  .hero-siht h1,.hero h1{font-size:clamp(24px,7vw,32px)}

  /* Uks kaart rea kohta. Kaks korvuti tegi 375 px laiusel nimest ja hinnast
     loetamatu prahi - "Stockholm · 4 ööd a..." jai poolikuks. Tais laius
     annab pildile ruumi ja hoiab hinnarea uhel real. */
  .sihid{grid-template-columns:1fr;gap:14px}
  .siht{aspect-ratio:16/10}
  .siht-nimi{font-size:17px}
  .siht-hind{font-size:13.5px}

  .siht-kuu{top:9px;right:9px;padding:4px 9px;font-size:11px}
  .siht-ilm{top:9px;left:9px;padding:4px 8px;font-size:11.5px}
  .ilma-filter{gap:12px 16px}
  .periood-filter{padding:13px 14px}
}

/* Pildikrediit hero alumise ribana. CC BY-SA nouab autori nimetamist.
   Varem oli see absoluutselt paremas alanurgas ja maandus mobiilis
   otse hinnarea peale - kaks teksti uksteise otsas. Oma ribana ei saa
   ta kunagi sisuga kokku poorduda. */
.pildi-krediit{position:absolute;left:0;right:0;bottom:0;z-index:3;
  padding:16px 20px 7px;font-size:10.5px;line-height:1.3;
  color:rgba(255,255,255,.66);text-align:right;pointer-events:none;
  background:linear-gradient(to top,rgba(10,16,38,.5),transparent)}
@media (max-width:640px){
  .pildi-krediit{font-size:9.5px;text-align:left;padding:14px 20px 6px}
}

/* ---------- sihtkohaleht mobiilis ---------- */
@media (max-width:640px){
  .hero-siht{padding:34px 0 30px}
  .hero-kokkuvote{gap:8px;flex-wrap:wrap}
  .hero-hind{font-size:34px}
  .tee{font-size:12.5px;margin-bottom:10px}

  /* Kuuriba kerib kõrvale, mitte ei murdu mitmele reale: 12 kuud
     kolmes reas võtab pool ekraani ja kaotab võrreldavuse. */
  .kuuriba{flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x proximity;
    margin:6px -20px 0;padding:2px 20px 8px;-webkit-overflow-scrolling:touch}
  .kuuriba::-webkit-scrollbar{height:0}
  .kuu-kaart{flex:0 0 104px;max-width:none;scroll-snap-align:start}

  .kuuriba-selgitus{font-size:13px;line-height:1.5}

  /* Tabid ja pakkumised: väiksem sisemine polsterdus, et hind mahuks */
  .tabid{gap:8px;flex-wrap:wrap}
  .tab{padding:9px 2px;font-size:14.5px}
  .tab-otsi{padding:9px 15px;font-size:13.5px}
  .pakkumine{padding:12px 13px;gap:8px}
  .pk-kuup{font-size:13.5px}
  .pk-ood{font-size:12px}
  .pk-hind{font-size:17px}

  .ood-filter{flex-wrap:wrap}

  .lahedal-sihid{grid-template-columns:1fr 1fr;gap:8px}
  .sisu h2{font-size:20px}
}

/* Millal hinnad tõmmati. Väike ja tuhm — see on usalduse märk, mitte
   müügiargument, aga lennupileti puhul on "kui värske" oluline fakt. */
.uuendatud{margin:18px 0 0;text-align:center;font-size:12.5px;color:var(--tuhm)}
.uuendatud time{font-weight:600}

/* ---------- reisi aeg + pikkus ühes plokis ---------- */
.valik-plokk{margin:0 0 20px;padding:16px 18px;border:1px solid var(--joon);
  border-radius:12px;background:#fbfbfd;display:flex;flex-direction:column;gap:12px;
  align-items:flex-start}
.valik-plokk .filter-grupp{gap:8px}
.valik-plokk .kp-tyhista{align-self:flex-start;padding:0}




/* ---------- filtririba: üks paneel ---------- */
.filtririba{position:relative;margin:0 0 24px;border:1px solid var(--joon);border-radius:14px;
  background:#fff;overflow:hidden;box-shadow:0 8px 28px rgba(18,30,67,.07)}
.filtri-rida{display:flex;align-items:center;gap:16px;padding:11px 18px;
  border-top:1px solid #f0f1f5}
.filtri-rida:first-child{border-top:0}
.filtri-nimi{flex:0 0 108px;font-size:11px;font-weight:700;letter-spacing:.8px;
  text-transform:uppercase;color:#8a8fa3}
.filtri-valikud{display:flex;flex-wrap:wrap;gap:6px;flex:1 1 auto}

/* Kuu on peamine otsus ja saab oma täislaiuse. Kolm väiksemat valikut on
   all ühel real nagu kompaktsed väljad, mitte neli admin-tabeli rida. */
.filtri-kuud{padding:13px 16px;background:#fff}
.filtri-pagas{background:transparent}
.filtri-pagas .filtri-valikud{align-items:center;gap:12px}
.pagasi-abi{font-size:12.5px;color:var(--tuhm);line-height:1.35}
/* Viimane veerg on sorteerimine. `fr` andis talle 199 px, aga segment
   "Cheapest | Warmest" on 182 px ja `.segment` on `overflow:hidden` -
   seega "Warmest" loigati 16 px ulatuses ara.
   `minmax(max-content, ...)` EI aita: `.filtri-valikud` on `width:100%`
   ja protsentuaalne laius ei anna sisemise suuruse arvutusse panust,
   mistottu `max-content` jai fr-osast vaiksemaks. Seega selgesonaline
   alampiir: 182 px segment + 32 px rea polsterdust = 214, umardatud 220-le,
   et pikem tolge mahuks. Ulempiir jaab `fr`-iks, et laial ekraanil venitaks
   koos teistega. */
/* Sort kolis vaadete-ribale, seega on veerge yks vahem ja senine
   `minmax(220px, ...)` alampiir laks koos temaga - see oli olemas ainult
   selleks, et "Warmest" ara mahuks. */
/* Kellaajad kuuluvad kuude kõrvale: mõlemad vastavad samale küsimusele
   "millal ma lennata tahan?". Alumine rida saab seetõttu tagasi varasema
   kompaktse kolme veeru paigutuse. */
.filtri-pealmine{display:grid;grid-template-columns:minmax(0,1fr) max-content;background:#fff}
.filtri-pealmine > .filtri-rida{min-width:0;border-top:0}
.filtri-pealmine > .filtri-rida + .filtri-rida{border-left:1px solid var(--joon)}
.filtri-pealmine .filtri-nimi{flex:0 0 72px}
.filtri-pealmine .filtri-rida{gap:10px;padding-left:12px;padding-right:12px}
.filtri-pealmine .filtri-kellaajad{align-items:center}
.filtri-pealmine .filtri-kellaajad .filtri-valikud{flex:0 1 auto}

.filtri-alumine{display:grid;grid-template-columns:minmax(0,1fr) max-content;
  border-top:1px solid var(--joon);background:#fff}
.filtri-alumine.otselennuga{
  grid-template-columns:minmax(0,1fr) max-content max-content}
.filtri-alumine .filtri-rida{min-width:0;flex-direction:column;align-items:flex-start;
  gap:8px;padding:13px 16px;border:0;border-left:1px solid var(--joon)}
.filtri-alumine .filtri-rida:first-child{border-left:0}
.filtri-alumine .filtri-nimi{flex:0 0 auto}
/* `width:100%` siin tuhistas `max-content` veeru arvutuse (protsentuaalne
   laius ei anna sisemise suuruse arvutusse panust). Slaidri taitmise eest
   hoolitseb `.oode-vahemik{width:100%}` juba ise, seega saab selle siit ara
   votta ja veerud moota end sisu jargi. */
.filtri-alumine .filtri-valikud{align-items:center;gap:8px;flex-wrap:wrap}
/* Paise ja tema teine silt ("Flights ... Layover") uhel real.
   Paise on OMA element, mitte rea otsene laps: `max-content` veeru
   arvutuses moodetakse rida uhel real, seega paise ja kontrollid korvuti
   annaksid absurdselt laia veeru (mootdetud 521 px 407 asemel). Eraldi
   umbrisega on rea `max-content` = laiem kahest, mis on see, mida tahame. */
.fr-paise{display:flex;align-items:baseline;gap:12px;width:100%}
.fr-paise .umber-inline-silt{margin-left:auto}
.umber-inline-silt{font-size:11.5px;font-weight:600;color:var(--tuhm)}
.umber-segment .seg{padding-left:10px;padding-right:10px}

/* Kaks pöialt lubavad valida päris vahemiku (nt 7–10 ööd), ilma et peaks
   kasutaja eest suvalised valmis ämbrid otsustama. Mõlemad native-range'id
   jäävad klaviatuuri ja ekraanilugeja jaoks päris vormiväljadeks. */
/* Uheklikilised reisipikkused liuguri kohal. `width:100%` annab neile oma
   rea - `.filtri-valikud` on `flex-wrap:wrap` ja `.oode-vahemik` on samuti
   taislaiuses, seega nad ei tulgi korvuti. */
.oo-kiibid{width:100%}
.oo-kiibid .seg{flex:1 1 0;text-align:center;padding:7px 10px;font-size:13px}

.oode-vahemik{display:grid;grid-template-columns:minmax(120px,1fr) auto auto;
  align-items:center;gap:10px;width:100%}
.oode-vahemik.js-valmis{grid-template-columns:minmax(120px,1fr) auto}
.oode-vahemik.js-valmis .oo-rakenda{display:none}
.oo-liugur{position:relative;height:30px;min-width:120px}
.oo-rada{position:absolute;left:8px;right:8px;top:13px;height:4px;border-radius:4px;
  background:#dfe2eb}
.oo-rada::after{content:"";position:absolute;top:0;bottom:0;
  left:var(--oo-algus);right:calc(100% - var(--oo-lopp));border-radius:4px;
  background:var(--tuti)}
.oo-liugur input[type="range"]{position:absolute;inset:0;width:100%;height:30px;
  margin:0;appearance:none;-webkit-appearance:none;background:transparent;
  pointer-events:none}
.oo-liugur input[type="range"]::-webkit-slider-runnable-track{height:4px;background:transparent}
.oo-liugur input[type="range"]::-webkit-slider-thumb{width:18px;height:18px;margin-top:-7px;
  border:3px solid #fff;border-radius:50%;background:var(--tuti);
  box-shadow:0 1px 5px rgba(1,21,53,.3);-webkit-appearance:none;pointer-events:auto;cursor:grab}
.oo-liugur input[type="range"]::-moz-range-track{height:4px;background:transparent}
.oo-liugur input[type="range"]::-moz-range-thumb{width:14px;height:14px;
  border:3px solid #fff;border-radius:50%;background:var(--tuti);
  box-shadow:0 1px 5px rgba(1,21,53,.3);pointer-events:auto;cursor:grab}
.oo-liugur input[type="range"]:focus-visible::-webkit-slider-thumb{outline:3px solid rgba(192,56,134,.28);outline-offset:2px}
.oo-liugur input[type="range"]:focus-visible::-moz-range-thumb{outline:3px solid rgba(192,56,134,.28);outline-offset:2px}
.oo-valik{min-width:66px;font-size:13px;font-weight:700;color:var(--tekst);white-space:nowrap}
.oo-rakenda{border:0;border-radius:8px;padding:8px 11px;background:var(--tuti);color:#fff;
  font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.oo-rakenda:hover{background:var(--tuti-tume)}

/* AJAX jätab lehe paigale, kuid valik peab kohe reageerima. Õhuke liikuv
   joon ja kaartide kerge tuhmumine ütlevad, et tulemusi uuendatakse. */
#pakkumiste-vaade.vaade-laeb .filtririba{pointer-events:none}
#pakkumiste-vaade.vaade-laeb .filtririba::after{content:"";position:absolute;
  left:0;top:0;width:34%;height:3px;z-index:3;border-radius:0 3px 3px 0;
  background:var(--tuti);animation:filtri-laadimine .8s ease-in-out infinite alternate}
#pakkumiste-vaade.vaade-laeb .sihid{opacity:.45;transition:opacity .15s}
@keyframes filtri-laadimine{from{transform:translateX(-30%)}to{transform:translateX(225%)}}
@media (prefers-reduced-motion:reduce){
  #pakkumiste-vaade.vaade-laeb .filtririba::after{animation:none;width:100%}
}

/* Mobiilis võib vajutatud filter olla paneeli ülaservast mitu ekraanitäit
   allpool. Paneeli enda laadimisjoon jääks siis vaateväljast välja, seega
   näitame päringu ajal teist joont alati vaateakna ülaservas. */
@media (max-width:760px){
  #pakkumiste-vaade.vaade-laeb::before{content:"";position:fixed;left:0;top:0;
    width:34%;height:4px;z-index:100;pointer-events:none;background:var(--kollane);
    box-shadow:0 1px 5px rgba(18,30,67,.28);
    animation:filtri-laadimine .8s ease-in-out infinite alternate}
}
@media (max-width:760px) and (prefers-reduced-motion:reduce){
  #pakkumiste-vaade.vaade-laeb::before{animation:none;width:100%}
}

/* Nupp: silt + väike lisainfo (hind või ühik) samal real. Lisainfo on
   see, mis teeb valiku informeerituks — "okt 79 €" ütleb rohkem kui "okt". */
.fnupp{display:inline-flex;align-items:baseline;gap:6px;font:inherit;font-size:14px;
  font-weight:600;cursor:pointer;padding:7px 13px;border-radius:8px;
  border:1px solid transparent;background:#f4f5f8;color:var(--tekst);
  text-decoration:none;transition:background .14s,color .14s,border-color .14s}
.fnupp:hover{background:#eceef4}
.fnupp.aktiivne{background:var(--tuti);border-color:var(--tuti);color:#fff}
.fnupp-silt{white-space:nowrap}
.fnupp-lisa{font-size:12px;font-weight:600;color:var(--tuti);white-space:nowrap}
.fnupp:hover .fnupp-lisa{color:var(--tuti-tume)}
.fnupp.aktiivne .fnupp-lisa{color:rgba(255,255,255,.85)}
.fnupp-tyhi{align-self:center;margin-left:6px;font-size:13px;color:var(--tuhm);
  text-decoration:underline}
.fnupp-tyhi:hover{color:var(--tuti)}

/* Ruudustik/kaart on üks vaatevalik, mitte uus filter. Hoidmine eraldi
   tööriistaribal teeb selgeks, et kuu, pagas, ööd ja ilm jäävad mõlemas samaks. */
.vaadete-riba{display:flex;align-items:center;justify-content:flex-end;gap:10px;
  margin:-7px 0 18px}
.vaadete-riba .filtri-nimi{flex:0 0 auto}
/* Sort vasakusse serva, vaatelyliti jaab paremale. `margin-right:auto`
   lykkab vahe nende vahele ilma lisaelemendita. */
.vr-sort{display:flex;align-items:center;gap:10px;margin-right:auto}
.vaate-segment{display:inline-flex;border:1px solid var(--joon);border-radius:10px;
  overflow:hidden;background:#fff;box-shadow:0 2px 8px rgba(18,30,67,.05)}
.vaate-nupp{display:flex;align-items:center;gap:7px;padding:8px 13px;
  border-left:1px solid var(--joon);font-size:13px;font-weight:700;color:var(--tuhm)}
.vaate-nupp:first-child{border-left:0}
.vaate-nupp:hover{background:#f5f6fa;color:var(--tekst)}
.vaate-nupp.aktiivne{background:var(--navy);color:#fff}
.vaate-nupp svg{width:16px;height:16px;fill:currentColor}

/* Leaflet elab ainult kaardivaates. Oma stacking context hoiab kaardi
   kontrollid sticky-päise all; hinnasildid näitavad põhiinfo ilma klikita. */
.pakkumiste-kaart{position:relative;z-index:0;width:100%;height:610px;margin:0 0 18px;
  border:1px solid var(--joon);border-radius:14px;overflow:hidden;background:#edf1f6;
  box-shadow:0 6px 24px rgba(18,30,67,.09)}
.hinna-marker{background:transparent;border:0}
.hinna-marker span{display:grid;place-items:center;min-width:58px;height:30px;padding:0 9px;
  border:2px solid #fff;border-radius:999px;background:var(--tuti);color:#fff;
  box-shadow:0 2px 9px rgba(18,30,67,.35);font-size:13px;font-weight:800;
  line-height:1;white-space:nowrap;transition:transform .12s,background .12s}
.hinna-marker:hover span{transform:scale(1.08);background:var(--tuti-tume)}
.kaardi-popup{min-width:170px;padding:2px 1px 1px;color:var(--tekst)}
.kaardi-popup strong{display:block;font-size:15px;line-height:1.25;margin-bottom:3px}
.kaardi-popup p{margin:0 0 9px;color:var(--tuhm);font-size:12.5px}
.kaardi-popup a{display:block;border-radius:7px;padding:7px 10px;text-align:center;
  background:var(--tuti);color:#fff!important;font-size:12.5px;font-weight:800}
.pakkumiste-kaart .leaflet-control-attribution{font-size:10px}



/* Esiletõstetud sihtkohad päises — kollane nagu vanal saidil, väike
   päikeseikoon eristab neid tavalistest navilinkidest.
   Taastatud `ww2_oldphp` koopiast: reeglid kadusid koos `tuti.esile`
   configivõtmega ja ilma nendeta renderdus SVG 30 px suurusena, tekst
   kukkus ikooni alla ja päis kasvas kahekordseks. */
.paike{display:inline-flex;align-items:center;gap:6px;color:var(--kollane)}
.paike svg{width:15px;height:15px;flex:0 0 15px;opacity:.9}
.paike:hover{border-bottom-color:var(--kollane)}

@media (max-width:860px){
  .paike{padding:14px 20px}
  .paike svg{width:16px;height:16px;flex:0 0 16px}
}

/* ---------- filtririba: kuuvalik ---------- */
.filtri-kuud{align-items:center}
.kuuvalik-umbris{display:flex;align-items:stretch;gap:7px;flex:1 1 auto;
  min-width:0;max-width:100%}
.kuuvalik{display:flex;align-items:stretch;gap:6px;flex:1 1 0;width:0;min-width:0;
  overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x proximity;
  overscroll-behavior-inline:contain;scrollbar-width:none}
.kuuvalik::-webkit-scrollbar{display:none}
.kuuvalik-nool{flex:0 0 32px;align-self:stretch;display:grid;place-items:center;
  min-height:55px;padding:0;border:1px solid var(--joon);border-radius:10px;
  background:#fff;color:#69728a;cursor:pointer;transition:background .14s,color .14s,
  border-color .14s,opacity .14s}
.kuuvalik-nool:hover:not(:disabled){background:#f7f8fb;border-color:#c9cee0;color:var(--tuti)}
.kuuvalik-nool:disabled{opacity:.28;cursor:default}
.kuuvalik-nool svg{width:17px;height:17px;fill:none;stroke:currentColor;
  stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.filtri-pealmine .kuuvalik-umbris{gap:4px}
.filtri-pealmine .kuuvalik{gap:4px}
.filtri-pealmine .kuuvalik-nool{flex-basis:27px;min-height:55px}
.filtri-pealmine .kuuvalik-koik{flex-basis:56px;padding-left:8px;padding-right:8px}
.filtri-pealmine .kuuvalik-kuu{flex-basis:64px;padding-left:3px;padding-right:3px}

.kuuvalik-koik,.kuuvalik-kuu{border:1px solid var(--joon);border-radius:10px;
  background:#fff;transition:border-color .15s,background .15s,box-shadow .15s}

.kuuvalik-koik{flex:0 0 70px;display:grid;place-items:center;padding:0 14px;font-size:14px;
  font-weight:700;color:var(--tekst);white-space:nowrap}
.kuuvalik-koik:hover{border-color:#c9cee0;background:#f8f9fc}

/* Kaks rida, kaks fakti: millal ja kui palju. Tulp ja sihtkohtade arv
   said välja — tulp dubleeris numbrit ja arv ei ole see, mille järgi
   kuud valitakse. Arv on tooltipis, kui keegi tahab. */
.kuuvalik-kuu{flex:0 0 78px;min-width:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:2px;padding:7px 5px 8px}
.kuuvalik-koik,.kuuvalik-kuu{scroll-snap-align:start}
.kuuvalik-kuu:hover{border-color:#c9cee0;background:#f8f9fc}

.kv-nimi{font-size:10.5px;font-weight:700;letter-spacing:.8px;text-transform:uppercase;
  color:#9aa0b4;line-height:1}
.kv-aasta{font-size:9px;font-weight:700;letter-spacing:.45px;color:#a5aabc;line-height:1}
.kv-hind{font-size:15px;font-weight:800;color:var(--tekst);line-height:1;
  letter-spacing:-.3px}

/* Odavaim kuu: roheline number, õrn taust. Hinnavahe on väike (78–82 €),
   seega märgime selle värviga, mitte suurusega — muidu lubaks kujundus
   vahet, mida päriselt ei ole. */
.kuuvalik-kuu.odavaim{border-color:#bfe3cd;background:#f4fbf7}
.kuuvalik-kuu.odavaim .kv-hind{color:#2f8f5b}

.kuuvalik-koik.aktiivne,.kuuvalik-kuu.aktiivne{background:var(--tuti);
  border-color:var(--tuti);box-shadow:0 2px 10px rgba(192,56,134,.22)}
.kuuvalik-koik.aktiivne{color:#fff}
.kuuvalik-kuu.aktiivne .kv-nimi{color:rgba(255,255,255,.82)}
.kuuvalik-kuu.aktiivne .kv-aasta{color:rgba(255,255,255,.72)}
.kuuvalik-kuu.aktiivne .kv-hind{color:#fff}

/* ---------- segmenteeritud lüliti ---------- */
/* Ühendatud nupurida loeb ühe valikuna; lahtised pillid lugesid viie
   eraldi asjana ja rida nägi välja nagu suvaline nupuhunnik. */
/* Ääris on box-shadow, mitte border: border kuuluks konteinerile ja jätaks
   iga nupu ümber 1px klikkimatu rõnga (nurkades laiema). Shadow ei võta
   paigutuses ruumi, seega .seg lingid ulatuvad päris servani. */
.segment{display:inline-flex;box-shadow:0 0 0 1px var(--joon);border-radius:9px;
  overflow:hidden;background:#fff}
.seg{padding:8px 15px;font-size:13.5px;font-weight:600;color:var(--tekst);
  border-left:1px solid var(--joon);transition:background .14s,color .14s;white-space:nowrap}
.seg:first-child{border-left:0}
.seg:hover{background:#f4f5f8}
.seg.aktiivne{background:var(--tuti);color:#fff;border-left-color:var(--tuti)}
.seg.aktiivne + .seg{border-left-color:var(--tuti)}

/* Sama valik sihtkoha- ja kuupäevalehel. See asub pakkumiste kohal, sest
   pagas muudab kõiki hindu, mitte ainult üht lennurida. */
/* Paneeli sees teeb rea piiri `.filtri-rida` ise - oma hairjoont ja
   valismarginaali need read enam ei kanna. */
.pagasi-vaade{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:11px 18px;margin:0}
.pagasi-vaade .filtri-nimi{flex:0 0 108px}
.pagasi-vaade .pagasi-abi{margin-left:auto}
.umber-vaade{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:11px 18px;margin:0;border-top:1px solid #f0f1f5}
.umber-vaade .filtri-nimi{flex:0 0 108px}
.umber-vaade .umber-abi{margin-left:auto;color:var(--tuhm);font-size:13px}
.kellaaja-vaade{display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:11px 18px;margin:0;border-top:1px solid #f0f1f5}
.kellaaja-vaade .filtri-nimi{flex:0 0 108px}

/* Kuiva ilma lüliti on tõeväärtus, mitte valik viie seast — seega
   märkeruut, mitte segment. */
.lyliti{display:inline-flex;align-items:center;gap:8px;padding:8px 14px 8px 11px;
  border:1px solid var(--joon);border-radius:9px;font-size:13.5px;font-weight:600;
  color:var(--tekst);background:#fff;transition:border-color .14s,background .14s}
.lyliti:hover{background:#f4f5f8}
.lyliti-kast{width:15px;height:15px;border:1.8px solid #c3c7d4;border-radius:4px;
  flex:0 0 15px;transition:background .14s,border-color .14s;position:relative}
.lyliti.aktiivne{border-color:var(--tuti);background:#fdf4f9;color:var(--tuti)}
.lyliti.aktiivne .lyliti-kast{background:var(--tuti);border-color:var(--tuti)}
.lyliti.aktiivne .lyliti-kast::after{content:"";position:absolute;left:4px;top:1px;
  width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(42deg)}

/* 1120 px-st kitsamal ei mahu reisipikkus, ilm ja lennud enam ausalt ühele
   reale. Seal lähevad nad kaheks veeruks; suurel ekraanil jääb filter
   varasema kompaktse kolme rea kõrguseks. */
@media (max-width:1119px){
  .filtri-alumine,
  .filtri-alumine.otselennuga{grid-template-columns:1fr 1fr}
  .filtri-alumine:not(.otselennuga) .filtri-rida:last-child{grid-column:1/-1;
    border-left:0;border-top:1px solid var(--joon)}
  .filtri-alumine.otselennuga .filtri-rida:nth-child(n+3){border-top:1px solid var(--joon)}
  .filtri-alumine.otselennuga .filtri-rida:nth-child(3){border-left:0}
}

@media (max-width:900px){
  .kuuvalik-kuu{flex-basis:74px;padding:7px 3px 8px}
  .kv-hind{font-size:12.5px}
  .filtri-nimi{flex-basis:88px}
}

/* ---------- filtririba mobiilis ---------- */
/* Sama liides, mis laual — mitte eraldi select'id. Kaks liidest tähendas,
   et kogu disainitöö läks mobiilis kaotsi ja kasutaja nägi kuude kaupa
   sama nelja halli rippmenüüd. */
@media (max-width:760px){
  .filtririba{margin:0 -20px 20px;border-radius:0;border-left:0;border-right:0}
  .filtri-pealmine{display:block}
  .filtri-pealmine > .filtri-rida + .filtri-rida{border-left:0;
    border-top:1px solid var(--joon)}
  .filtri-pealmine .filtri-kellaajad{align-items:stretch}
  .filtri-pealmine .filtri-kellaajad .filtri-valikud{flex:1 1 auto;width:100%;min-width:0}
  .filtri-pealmine .filtri-nimi{flex:0 0 auto}
  .filtri-alumine{display:block}
  .filtri-rida{flex-direction:column;align-items:stretch;gap:9px;padding:13px 16px}
  .filtri-alumine .filtri-rida{border-left:0;border-top:1px solid var(--joon)}
  .filtri-alumine .filtri-rida:first-child{border-top:0}
  .filtri-nimi{flex:0 0 auto;align-self:flex-start}
  .filtri-kuud .filtri-nimi{align-self:flex-start}
  .filtri-pagas .filtri-valikud{align-items:stretch;gap:8px}
  .filtri-pagas .pagasi-abi{width:100%}

  /* Nool näitab, et kuid on veel; sõrmega ja puuteplaadiga saab sama riba
     loomulikult kerida. Kõiki kuid korraga ruudustikku ladudes kasvas filter
     telefonis nelja rea kõrguseks. */
  .kuuvalik-umbris{width:100%;gap:5px}
  .kuuvalik-nool{flex-basis:30px;min-height:58px}
  .kuuvalik-koik{flex-basis:66px;padding:9px 10px}
  .kuuvalik-kuu{flex-basis:76px;padding:10px 2px 11px;gap:4px}
  .kv-hind{font-size:14.5px}


  /* Segment täislaiuses ja jaotub võrdselt — nii on puutesihtmärgid
     suuremad ja rida ei murdu kahte ossa. */
  .segment{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;width:100%}
  .seg{padding:10px 6px;text-align:center;font-size:13px}
  .filtri-alumine .filtri-valikud{width:100%;flex-wrap:wrap}
  .oode-vahemik{grid-template-columns:1fr auto;gap:7px 12px}
  .oo-liugur{grid-column:1/-1;min-width:0}
  .oo-rakenda{padding:9px 16px}
  .filtri-alumine .lyliti{justify-content:center;padding:10px 14px;width:100%}
  .fnupp-tyhi{align-self:center;padding:4px 0}
  .pagasi-vaade{align-items:stretch;gap:8px}
  .pagasi-vaade .segment{order:2}
  .pagasi-vaade .pagasi-abi{order:3;margin-left:0;width:100%}
  .umber-vaade{align-items:stretch;gap:8px}
  .umber-vaade .segment{order:2}
  .umber-vaade .umber-abi{order:3;margin-left:0;width:100%}
  .kellaaja-vaade{align-items:stretch;gap:8px}
  .kellaaja-vaade .segment{order:2}
  .vaadete-riba{justify-content:space-between;margin:-5px 0 14px;
    flex-wrap:wrap;gap:10px}
  .vr-sort{margin-right:0;width:100%;justify-content:space-between}
  .vr-sort .segment{flex:1 1 auto}
  .vr-sort .seg{flex:1 1 auto;text-align:center}
  .pakkumiste-kaart{height:max(430px,62svh);border-radius:10px}
}

@media (max-width:400px){
  .seg{padding:10px 3px;font-size:12px}
  .kv-hind{font-size:9.5px}
}

.reisi-riba .raam{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:10px 20px}
.rr-silt{font-weight:800;font-size:15px}
.rr-ood{font-size:14px;opacity:.75}
.rr-hind{font-weight:800;font-size:16px;padding:3px 10px;border-radius:999px;
  background:var(--navy);color:var(--kollane)}
.rr-koik{margin-left:auto;font-size:13.5px;font-weight:700;
  text-decoration:underline;color:var(--navy)}
.rr-koik:hover{color:var(--tuti-tume)}

@media (max-width:640px){
  .reisi-riba .raam{gap:9px;padding:9px 20px}
  .rr-silt{font-size:14px}
  .rr-koik{margin-left:0;width:100%}
}

/* Maandumislehe selgitus — mida see sait teeb. Hero kandis enne ainult
   hinda ja numbrit, mis ei ütle midagi kellelegi, kes siia otsingust satub. */
.hero-siht .hero-selgitus{max-width:660px;margin:16px 0 0;font-size:16px;line-height:1.55;
  color:rgba(255,255,255,.82)}
.hero-siht .hero-filter{max-width:660px;margin:10px 0 0;font-size:13.5px;
  color:var(--kollane);font-weight:600}

@media (max-width:640px){
  .hero-siht .hero-selgitus{font-size:14.5px;margin-top:12px}
}

/* ---------- pakkumise rida ---------- */
/* Raam kuulub REALE, mitte selle osadele. Varem oli pakkumisel oma raam ja
   jagamisnupul teine — kaks kasti kõrvuti lugesid kahe eri asjana, kuigi
   nad kirjeldavad sama reisi. Nüüd on üks kaart, mille sees on põhitegevus
   (avab otsingu) ja kõrvaltegevus (jagab). */
.pakkumine-rida{display:flex;align-items:stretch;
  background:#fff;border:1px solid var(--joon);border-radius:11px;
  transition:border-color .15s,box-shadow .15s}
/* `overflow:hidden` loikas sildi maha. Umarad nurgad hoiab nuud
   jagamisnupp ise, mitte umbrise loikamine. */
.pakkumine-rida > .pakkumine{border-radius:10px 0 0 10px}
.pakkumine-rida > .jaga-nupp{border-radius:0 10px 10px 0}
.pakkumine-rida:hover{border-color:var(--tuti);box-shadow:0 4px 16px rgba(192,56,134,.13)}
/* `flex-basis:0`, mitte `auto`: `.pakkumine.detailidega` on grid, mille
   min-sisulaius (minmax(220px) + minmax(330px) + kaks auto veergu) noudis
   `auto` puhul terve rea ja "Vali" nupp kukkus omaette reale. Nulliga
   kahaneb ta olemasoleva ruumi jargi. */
.pakkumine-rida .pakkumine{flex:1 1 0;min-width:0}

/* Jagamisnupp on vaikselt olemas ja tuleb esile alles siis, kui rida on
   fookuses — muidu võistleks ta hinnaga, mis on rea peategelane. */
.jaga-nupp{flex:0 0 46px;display:grid;place-items:center;cursor:pointer;
  border:0;border-left:1px solid transparent;background:transparent;
  color:#c3c7d4;transition:color .15s,background .15s,border-color .15s;position:relative}
.pakkumine-rida:hover .jaga-nupp{color:var(--tuhm);border-left-color:var(--joon)}
.jaga-nupp:hover{color:var(--tuti);background:#fdf4f9}
.jaga-nupp svg{width:17px;height:17px}

.jaga-nupp.kopeeritud{color:#2f8f5b;background:#f4fbf7;border-left-color:#bfe3cd}
.jaga-nupp.kopeeritud::after{content:attr(data-kinnitus);position:absolute;
  bottom:calc(100% + 6px);right:4px;white-space:nowrap;font-size:12px;font-weight:600;
  padding:5px 9px;border-radius:7px;background:var(--navy);color:#fff;
  box-shadow:0 3px 10px rgba(18,30,67,.2);z-index:5}

@media (max-width:640px){
  /* Puutel pole hoveri't — nupp on alati nähtav, muidu ei tea keegi, et ta on olemas. */
  .jaga-nupp{flex:0 0 42px;color:var(--tuhm);border-left-color:var(--joon)}
  .pakkumine{padding:12px 12px 12px 13px}
  .pakkumine.detailidega{grid-template-columns:minmax(0,1fr) auto;padding:9px 12px 9px 13px;
    gap:5px 10px}
  .pakkumine.detailidega .pk-kuup{grid-column:1;grid-row:1}
  .pakkumine.detailidega .pk-hind{grid-column:2;grid-row:1}
  .pakkumine.detailidega .pk-ood{grid-column:2;grid-row:2;text-align:right}
  .pakkumine.detailidega .pk-marsruudid{grid-column:1/-1;grid-row:3;margin-top:2px}
  .pk-lend{grid-template-columns:38px 86px minmax(0,1fr);gap:5px;font-size:11.5px}
  .pk-ajad{font-size:12px}
  .pk-firma{display:none}
}

/* ---------- esiletõstetud pakkumine ---------- */
/* Nimekirjas, kus iga rida näeb ühesugune välja, ei ole hierarhiat — ja
   ilma hierarhiata peab inimene 53 rida ise läbi lugema. Kaks rida saavad
   sildi: odavaim ja parim väärtus öö kohta. Rohkem oleks juba müra. */
.pakkumine-rida{position:relative}
.pakkumine-rida.esile{border-color:var(--tuti);box-shadow:0 2px 12px rgba(192,56,134,.13)}

.rea-silt{position:absolute;top:-10px;left:14px;z-index:3;
  padding:2px 9px;border-radius:999px;font-size:10.5px;font-weight:800;
  letter-spacing:.6px;text-transform:uppercase;
  background:var(--tuti);color:#fff;box-shadow:0 2px 6px rgba(192,56,134,.28)}

/* Esiletõstetud read vajavad ülalt ruumi, et silt ei lõikuks eelmisega. */
/* Esiletostetud rida vajab ULEVALT ruumi, et silt mahuks - ka esimene,
   sest sildil pole seal midagi, mille peale minna. */
.pakkumine-rida.esile{margin-top:14px}
.pakkumised{padding-top:6px}

.pakkumine-rida.esile .pk-hind{color:var(--tuti)}

/* ---- Avalehelt kaasa tulnud valik ---------------------------------------
   Nimekirjas voib olla mitu sama hinnaga rida eri kuudest. Ilma selle
   margistuseta peab inimene seda rida, mida ta avalehe kaardil nagi,
   silmadega otsima. `scroll-margin-top` hoiab kleepuva paise rea eest ara. */
/* "Your pick" on KOLLANE (menuu CTA-toon), "Cheapest" jaab magentaks - kaks
   erinevat asja ei tohi valja naha uhtemoodi. Kollane taust nouab tumedat
   teksti: #ffed4a + #121e43 annab 13,5:1 (magenta+valge on 5,1:1), seega on
   see loetavam kui senine silt. Valge tekst kollasel oleks 1,2:1 - keelatud. */
.pakkumine-rida.valitud{background:#fffdf2;border-color:#e8cf3a;
  box-shadow:0 0 0 2px rgba(214,180,20,.38),0 6px 20px rgba(170,142,10,.15);
  scroll-margin-top:96px}
.pakkumine-rida.valitud .rea-silt{background:var(--kollane);color:var(--navy);
  box-shadow:0 2px 6px rgba(170,142,10,.4)}
.pakkumine-rida.valitud .pakkumine{background:transparent}
.pakkumine-rida.valitud .jaga-nupp{background:transparent}

/* `.pakkumine-rida` on flex, mis lööb üle brauseri `[hidden]` reegli —
   sama lõks nagu varem `.siht` kaartidega. */
.pakkumine-rida[hidden]{display:none !important}

/* ---------- jagamine reisilehel ---------- */
/* Nimekirjas oli igal real oma nupp — 45 nuppu ilma selge mõtteta. Siin on
   inimene ühe konkreetse reisi juures ja tal ON midagi jagada. */
.rr-jaga{display:inline-flex;align-items:center;gap:8px;margin-left:6px}
.jaga-suur{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:13.5px;
  font-weight:700;cursor:pointer;padding:6px 13px;border-radius:999px;
  border:1.5px solid var(--navy);background:transparent;color:var(--navy);
  transition:background .15s,color .15s;position:relative}
.jaga-suur:hover{background:var(--navy);color:var(--kollane)}
.jaga-suur svg{width:15px;height:15px}
.jaga-suur.kopeeritud{background:var(--navy);color:var(--kollane);border-color:var(--navy)}
.jaga-suur.kopeeritud::after{content:attr(data-kinnitus);position:absolute;
  bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);white-space:nowrap;
  font-size:12px;font-weight:600;padding:5px 10px;border-radius:7px;
  background:var(--navy);color:#fff;box-shadow:0 3px 10px rgba(18,30,67,.25)}
.jaga-fb{font-size:13.5px;font-weight:700;color:var(--navy);text-decoration:underline}
.jaga-fb:hover{color:var(--tuti-tume)}

@media (max-width:640px){
  .rr-jaga{margin-left:0;width:100%;gap:12px}
  .jaga-suur{flex:1 1 auto;justify-content:center}
}

/* ---------- kuulehe faktiplokk ---------- */
/* Kuulehel on selle kuu ilm ja hind PÕHISISU — just see vastab otsingule
   "Krakow oktoobris". Sihtkohalehel on sama info kuuribas kõrvalmärkusena. */
.h1-kuu{font-weight:600;opacity:.75}

.kuu-faktid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:12px;margin-top:6px}
.kf{display:flex;flex-direction:column;gap:3px;padding:16px 18px;
  border:1px solid var(--joon);border-radius:12px;background:#fff}
.kf-arv{font-size:26px;font-weight:800;letter-spacing:-.6px;color:var(--navy);line-height:1}
.kf-silt{font-size:12px;font-weight:600;color:var(--tuhm);letter-spacing:.3px}
.kf-hind .kf-arv{color:var(--tuti)}

/* Kuuvaate desktop-hero: foto paremat poolt ei jäta me dekoratiivseks
   tühjaks, vaid paneme otsust mõjutavad faktid ühte klaaspaneeli. Esimene
   rida on ilm, teine hind + pakkumiste arv — nii loeb paneel kahe selge
   mõtterühmana, mitte viie juhusliku kastina. */
.kuu-hero-paneel{display:none}
.kh-kuu{display:none}
@media (min-width:900px){
  .hero-kuu{padding:48px 0 36px}
  .hero-kuu .hero-veerud{display:grid;grid-template-columns:minmax(0,1fr) 500px;
    column-gap:56px;align-items:center}
  .kuu-hero-paneel{display:block}
  .kh-kuu{display:block}
  /* Kuu nimi paneeli kohal: ilma selleta lugesid arvud nagu Palma yldine
     ilm, mitte selle kuu oma. Vaikselt, sest H1 utleb sama - siin on ta
     ainult ankur numbrite jaoks. */
  .kh-kuu{margin:0 0 9px;padding-left:2px;font-size:12px;font-weight:750;
    letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.7)}
  .kuu-hero-faktid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;
    list-style:none;margin:0;padding:14px;border-radius:16px;
    background:rgba(12,24,57,.42);border:1px solid rgba(255,255,255,.22);
    box-shadow:0 16px 38px rgba(5,14,38,.22);backdrop-filter:blur(10px)}
  .kh-fakt{grid-column:span 2;display:flex;min-width:0;flex-direction:column;
    justify-content:center;gap:5px;padding:14px 12px;border-radius:10px;
    background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1)}
  .kh-fakt-hind,.kh-fakt-pakkumised{grid-column:span 3}
  .kh-fakt strong{font-size:25px;line-height:1;font-weight:800;letter-spacing:-.5px;
    color:#fff;white-space:nowrap}
  .kh-fakt span{font-size:11.5px;line-height:1.25;font-weight:650;
    color:rgba(255,255,255,.72)}
  .kh-fakt-hind strong{font-size:29px;color:var(--kollane)}
  .kuu-ilm-mobiil{display:none}
}

@media (min-width:900px) and (max-width:1100px){
  .hero-kuu .hero-veerud{grid-template-columns:minmax(0,1fr) 430px;column-gap:34px}
}

@media (max-width:640px){
  .kuu-faktid{grid-template-columns:1fr 1fr;gap:9px}
  .kf{padding:13px 14px}
  .kf-arv{font-size:22px}
  .h1-kuu{display:block;font-size:.6em;margin-top:4px}
}

/* ---------- reis hero's esile ---------- */
/* Kuupäevalehel peab olema kohe selge, mis reis see on. Ostutulemused
   algavad otse hero järel, seega eraldi dubleerivat CTA-d pole vaja. */
.reis-esile{margin:18px 0 0;padding:18px 20px;border-radius:14px;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);
  backdrop-filter:blur(4px);max-width:640px}
.re-kuup{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:19px;font-weight:600;color:#fff}
.re-kp b{font-weight:800;color:var(--kollane);margin-right:5px}
.re-nool{opacity:.6}
.re-alumine{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:14px}
.re-ood{font-size:14.5px;color:rgba(255,255,255,.82)}
.re-hind{font-size:30px;font-weight:800;color:var(--kollane);letter-spacing:-.8px;line-height:1}
.re-osta{margin-left:auto;padding:11px 24px;border-radius:999px;
  background:var(--kollane);color:var(--navy);font-weight:800;font-size:15px;
  box-shadow:0 4px 14px rgba(255,237,74,.3);transition:transform .15s,box-shadow .15s}
.re-osta:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(255,237,74,.42)}

@media (max-width:640px){
  .reis-esile{padding:15px 16px;margin-top:14px}
  .re-kuup{font-size:16px;gap:9px}
  .re-hind{font-size:26px}
  .re-osta{margin-left:0;width:100%;text-align:center}
  .re-alumine{gap:12px}
}

/* ---------- sisu järjekord ---------- */
/* Sihtkohalehel on küsimus "millal minna" → kuuriba enne, broneerimine taga.
   Reisilehel on küsimus juba vastatud ja ainus asi, mis loeb, on osta →
   vidin kohe hero järel. Järjekorda muudab `order`, mitte markupi
   dubleerimine — kaks koopiat lahkneksid esimese muudatusega. */
.sisu-jarjekord{display:flex;flex-direction:column}
.reisi-jarjekord > .laia-plokk{order:-1;background:#f4f6f8;
  /* Vidin kasutab sama halli. Taislaiune vari seob pealkirja ja iframe'i
     uheks broneerimisalaks, kuid `.raam` hoiab sisu endiselt 1180 px sees. */
  box-shadow:0 0 0 100vmax #f4f6f8;clip-path:inset(0 -100vmax)}
.reisi-jarjekord > .laia-plokk > .plokk{margin-bottom:0}
.broneeri-pea{margin:8px 0 16px}
.broneeri-pea p{max-width:720px}
.reisi-jarjekord > .kuuriba-plokk{order:1}
/* `.raam` kannab `margin:0 auto`. Flex-elemendil tühistab automaatne külgmargin
   venitamise ja plokk kahaneb sisu laiuseks — vidin jäi 1280px aknas 460px
   laiuseks. Selgesõnaline `width:100%` taastab plokkkäitumise ja `margin:auto`
   jääb tegema seda, milleks ta mõeldud on: tsentreerima max-width'i sees. */
.sisu-jarjekord > *{width:100%}

/* ---------- reisilehe hero: kaks veergu, madal ---------- */
/* Enne oli sama info kolmes kohas ykstteise all ja hero venis 421 px korgeks,
   parem pool tyhi. Nyyd: vasakul identiteet + faktid, paremal ostukaart.
   Vidin algab mobiilis ~200 px varem kui enne. */
.hero-veerud{display:block}
.hero-reis{padding:34px 0 30px}
.hv-faktid{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 0}
.hv-fakt{font-size:13.5px;font-weight:600;padding:5px 11px;border-radius:999px;
  background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.18);color:#fff}
/* Saast on ainus fakt, mis muudab otsust - ta peab ka valja nagema teisiti. */
.hv-voit{background:var(--kollane);border-color:var(--kollane);color:var(--navy)}

@media (min-width:900px){
  .hero-reis .hero-veerud{display:grid;grid-template-columns:minmax(0,1fr) 430px;
    column-gap:44px;align-items:center}
  .hero-reis .reis-esile{margin:0;max-width:none}
  .hero-reis h1{margin-bottom:0}
}
@media (max-width:899px){
  /* Poordjarjekord: pealkiri utleb KUHU, kaart utleb MILLAL ja PALJU.
     Kaart peab jaama pealkirja alla, mitte faktide vahele. */
  .hero-reis .reis-esile{margin-top:16px}
}

/* ---------- jagamine vidina all ---------- */
/* Jagatakse pakkumist, mida on juba nahtud. Hero ees oli jagamisriba
   takistus ostutee alguses. */
.jaga-all{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  margin:18px 0 0;padding-top:16px;border-top:1px solid var(--joon)}
.jaga-all .ja-silt{font-size:14px;color:var(--tuhm);font-weight:600}

@media (max-width:640px){
  /* Leivapuru kuupaevaosa kordab kaarti 60 px allpool ja murdis rea kaheks. */
  .tee-kp{display:none}
  .hero-reis{padding:22px 0 24px}
  .hero-reis h1{margin-bottom:0}
  .hv-faktid{margin-top:10px}
  .hv-fakt{font-size:12.5px;padding:4px 10px}
}

/* ---------- piirkond + pagas korvuti ---------- */
/* Kaks uherealist segmenti eraldi ridadena kulutasid 126 px, millest sisu
   tais alla poole. Laual seisavad nad korvuti: piirkond votab tapselt oma
   sisu laiuse, pagas ulejaanu.
   Mootdetud 1140 px ribal: piirkond vajab 405, pagas 793 = 1198 ehk 58 px
   ule. Puuduv ruum votetakse pagasi abitekstilt, mis tohib murduda kahele
   reale - 12,5 px tekst kahel real (34 px) mahub ikka rea 63 px sisse,
   seega rida ei kasva ja voit jaab terveks. */
.filtri-keskmine{display:block}
@media (min-width:981px){
  .filtri-keskmine.piirkonnaga{display:grid;
    grid-template-columns:auto minmax(0,1fr);align-items:stretch}
  .filtri-keskmine.piirkonnaga > .filtri-rida{border-top:0}
  .filtri-keskmine.piirkonnaga > .filtri-rida + .filtri-rida{
    border-left:1px solid var(--joon)}
  /* Silt on vaikimisi fikseeritud laiusega, mis korvuti asetuses raiskab
     ruumi. Siin piisab sisu laiusest. */
  .filtri-keskmine.piirkonnaga .filtri-nimi{flex-basis:auto;min-width:0}
  .filtri-keskmine.piirkonnaga .pagasi-abi{min-width:0}
}

/* ---------- piirkonnafilter ---------- */
/* Oma rida, mitte alumise ruudustiku viies veerg: neli veergu on juba
   kitsad ja viies loikaks sildid ara (vt sorteerimisveeru lugu ulal). */
/* Vahelduv taust annab paneelile rutmi: kuupaevad valge, piirkond+pagas
   hall, alumine ruudustik jalle valge. Varem olid esimesed kaks moelmad
   valged ja ainult alumine hall, mistottu paneel luges kahe suure plokina
   ja keskmine rida kadus ara.
   Taust on YMBRISEL, mitte lahtritel: lahtrite peal jaaks nende vaheline
   vertikaalne eraldusjoon valge tausta peale ja rida murduks pooleks. */
.filtri-keskmine{background:var(--riba)}
.filtri-piirkond{background:transparent}
.filtri-piirkond .filtri-valikud{align-items:center;gap:12px;flex-wrap:wrap}
/* Sihtkohtade arv nupu sees: ilma selleta ei tea inimene enne klikkimist,
   kas "Aasia" taga on 3 voi 30 kohta. */
.seg-arv{margin-left:6px;padding:1px 6px;border-radius:999px;font-size:11.5px;
  font-weight:700;background:rgba(18,30,67,.09);color:var(--tuhm)}
.seg.aktiivne .seg-arv{background:rgba(255,255,255,.24);color:#fff}
@media (max-width:760px){
  .filtri-piirkond .segment{width:100%}
  .filtri-piirkond .seg{flex:1 1 auto;justify-content:center;text-align:center}
}

/* ---------- pagasinupu tooltip ---------- */
/* Rea lõpus seisnud selgitus oli püsiv müra, mis kordas ainult aktiivse
   valiku juttu. Nüüd on ta iga nupu enda küljes ja ilmub hiire või
   klaviatuuri fookusega — nii saab teada, mida "Äraantav pagas" tähendab
   ENNE klikkimist. `title` atribuut markupis katab puute ja ekraanilugeja. */
.pagasi-segment{position:relative;overflow:visible}
.pagasi-segment .seg{position:relative}
.pagasi-segment .seg::after{
  content:attr(data-abi);position:absolute;bottom:calc(100% + 9px);left:50%;
  transform:translateX(-50%) translateY(3px);
  width:max-content;max-width:240px;white-space:normal;text-align:center;
  font-size:12px;font-weight:600;line-height:1.35;padding:7px 10px;
  border-radius:8px;background:var(--navy);color:#fff;
  box-shadow:0 6px 18px rgba(18,30,67,.22);
  opacity:0;pointer-events:none;z-index:6;
  transition:opacity .14s ease,transform .14s ease}
/* Nool tooltipi all, et side nupuga oleks nahtav. */
.pagasi-segment .seg::before{
  content:"";position:absolute;bottom:calc(100% + 4px);left:50%;
  transform:translateX(-50%) translateY(3px);
  border:5px solid transparent;border-top-color:var(--navy);
  opacity:0;pointer-events:none;z-index:6;
  transition:opacity .14s ease,transform .14s ease}
.pagasi-segment .seg:hover::after,.pagasi-segment .seg:focus-visible::after,
.pagasi-segment .seg:hover::before,.pagasi-segment .seg:focus-visible::before{
  opacity:1;transform:translateX(-50%) translateY(0)}
/* Esimese ja viimase nupu tooltip ei tohi paneelist valja joosta. */
.pagasi-segment .seg:first-child::after{left:0;transform:translateX(0) translateY(3px)}
.pagasi-segment .seg:first-child:hover::after,
.pagasi-segment .seg:first-child:focus-visible::after{transform:translateX(0) translateY(0)}
.pagasi-segment .seg:last-child::after{left:auto;right:0;transform:translateX(0) translateY(3px)}
.pagasi-segment .seg:last-child:hover::after,
.pagasi-segment .seg:last-child:focus-visible::after{transform:translateX(0) translateY(0)}

/* Laual on selgitus tooltipis; mobiilis hoverit ei ole, seega seal jaab
   aktiivse valiku tekst alles. */
@media (min-width:761px){
  .pagasi-abi{display:none}
}
@media (max-width:760px){
  /* Puutel tooltipi ei ole - `title` jaab, aga ::after ei tohi vilkuda. */
  .pagasi-segment .seg::after,.pagasi-segment .seg::before{display:none}
}

/* ---------- keelatud filter ---------- */
/* Ümberistumise valik jääb otselennu puhul NÄHTAVALE, aga tuhmiks. Varem ta
   kadus ja ruudustik arvutas end ümber — klikk ühte kasti nihutas naabreid
   kursori alt. Nähtav-aga-keelatud hoiab paigutuse paigal ja ütleb ka
   otsesõnu, MIKS: otselennul ei ole vahemaandumist. */
.umber-segment.keelatud{opacity:.4;pointer-events:none;filter:grayscale(1)}
.umber-segment.keelatud .seg{cursor:default}
.umber-inline-silt.keelatud{opacity:.45}

/* Sihtkohapõhised välislingid hero's, hinna all. Tume taust, seega
   kollane nagu ülejäänud hero-aktsendid; tuhm lauseosa, et link paistaks. */
/* `.hero p` on spetsiifilisem (0,1,1) kui `.siht-lingid` (0,1,0) ja voidab
   jarjekorrast hoolimata - tema `margin:0 auto` tsentreeris loigu ja
   `max-width:620px` andis 260 px vasakserva. Sama lõks, mille jaoks failis
   on juba `.hero-siht .tee` erand; jargin sama mustrit. */
.hero-siht .siht-lingid{margin:2px 0 0;max-width:640px;
  font-size:14px;color:rgba(255,255,255,.72)}
.siht-lingid a{color:var(--kollane);font-weight:600;
  border-bottom:1px solid rgba(255,237,74,.4)}
.siht-lingid a:hover{border-bottom-color:var(--kollane)}

/* "Parim aeg" tekst ja hero paneel utlevad sama asja. Paneel kuvatakse
   alles 900 px-st, seega peidame teksti tapselt samast piirist - allpool
   jaab ta ainsaks kandjaks. Sama piir molemal reeglil, et vahepealset
   auku ega kordust ei tekiks. */
@media (min-width:900px){
  .kuuriba-selgitus .parim-dubleeriv{display:none}
}

/* ---------- riigifilter (combobox) ---------- */
/* Alus on päris `<select>`; JS peidab ta ja ehitab kõrvale otsitava
   nimekirja. Kui skript ei jookse, jääb `<select>` nähtavaks ja töötab. */
.riigi-filter{position:relative;min-width:210px}
/* Natiivne `<select>` on JS-ita variant ja peab ka uksinda kohane valja
   nagema - AJAX-filtri hetkel on ta korraks nahtav enne, kui
   `algataRiigiFilter()` temast combobox'i teeb. Sama korgus ja aaris nagu
   korvalolevatel segmendinuppudel, muidu hupab rida. */
.riigi-select{padding:8px 12px;font:inherit;font-size:13.5px;font-weight:600;
  color:var(--tekst);background:#fff;border:1px solid var(--joon);border-radius:9px;
  min-width:210px;max-width:100%}
.riigi-select.rf-peidus{position:absolute;width:1px;height:1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.rf-kast{position:relative}
.rf-sisend{width:100%;padding:8px 12px;font:inherit;font-size:13.5px;font-weight:600;
  color:var(--tekst);background:#fff;border:1px solid var(--joon);border-radius:9px;
  transition:border-color .14s,box-shadow .14s}
.rf-sisend:focus{outline:0;border-color:var(--tuti);
  box-shadow:0 0 0 3px rgba(192,56,134,.13)}
/* Valitud riik peab olema näha ka ilma fookuseta - muidu ei tea inimene,
   et filter on peal. */
.rf-kast.rf-aktiivne .rf-sisend{border-color:var(--tuti);color:var(--tuti)}
/* `fixed`, mitte `absolute`: `.filtririba` on `overflow:hidden` (ümardatud
   nurkade pärast) ja z-index ei pääse ancestor'i lõikest välja — ainult
   paigutuskontekstist väljumine pääseb. Koordinaadid annab JS. */
.rf-loend{position:fixed;z-index:60;
  max-height:280px;overflow-y:auto;margin:0;padding:5px;list-style:none;
  background:#fff;border:1px solid var(--joon);border-radius:10px;
  box-shadow:0 10px 30px rgba(18,30,67,.16)}
.rf-rida{padding:7px 10px;border-radius:7px;font-size:13.5px;cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rf-rida:hover,.rf-rida.esile{background:#f4f5f8}
@media (max-width:760px){
  .riigi-filter{min-width:0;width:100%}
}

/* ---- Jagamismenuu -------------------------------------------------------
   `position:fixed` + body-portaal, sest .filtririba ja pakkumiste plokk
   loikavad `overflow`iga - z-index uksi ei paase loikest valja. JS annab
   left/top alles peale lisamist, seega mootmed peavad tulema siit. */
.jaga-menuu{position:fixed;z-index:70;min-width:186px;padding:6px;
  background:#fff;border:1px solid var(--joon);border-radius:12px;
  box-shadow:0 14px 34px rgba(18,24,44,.16);display:flex;flex-direction:column;gap:2px}
.jm-rida{display:flex;align-items:center;gap:9px;padding:9px 11px;border:0;
  border-radius:8px;background:none;font:inherit;font-size:13.5px;font-weight:600;
  color:var(--tekst);text-align:left;cursor:pointer;width:100%;
  transition:background .13s,color .13s}
.jm-rida:hover,.jm-rida:focus-visible{background:#f4f5f8}
/* Varvipunkt kanali ees - ikoonifonti ega valispilte me ei lae. */
.jm-rida::before{content:'';flex:0 0 9px;width:9px;height:9px;border-radius:50%;
  background:var(--tuhm)}
.jk-fb::before{background:#1877f2}
.jk-wa::before{background:#25d366}
.jk-tg::before{background:#2aabee}
.jk-x::before{background:#0f1419}
.jk-mail::before{background:var(--tuti)}
.jm-kopeeri{margin-top:2px;border-top:1px solid var(--joon);border-radius:0 0 8px 8px;
  padding-top:10px}
.jm-kopeeri::before{background:var(--tuhm)}
@media (max-width:640px){
  .jaga-menuu{min-width:170px}
  .jm-rida{padding:11px 11px}
}

/* ---- Sihtkohalehe filtripaneel ------------------------------------------
   Varem: "When to go" oli suurte kaartide ruudustik oma `<h2>` pealkirjaga,
   pagas ja umberistumine aga paljad read hairjoontega. 11 kuud laksid kahele
   reale ja esimene PAKKUMINE - lehe ainus toode - algas alles ~990 px pealt.
   Nuud on koik kolm valikut samas paneelis, uhes visuaalses keeles avalehega,
   ja kuud mahuvad uhele reale. */
.filtririba-siht{overflow:visible}          /* "parim aeg" lipik ulatub ule serva */
/* Selgituslause on paneeli VIIMANE rida, mitte kahe paneeli vaheline tekst -
   muidu loeks kaks umardatud karpi katkise tervikuna. */
.kuuriba-selgitus.filtri-rida{margin:0;padding:9px 18px 11px;font-size:12.5px;
  color:var(--tuhm);display:block}

.filtri-kuud-siht{padding-top:19px;align-items:stretch}
.filtri-kuud-siht > .filtri-nimi{align-self:center}
.kuuriba{flex-wrap:nowrap;gap:6px;margin:0;flex:1 1 auto;min-width:0}
.kuu-kaart{flex:1 1 0;min-width:56px;max-width:none;gap:1px;
  padding:7px 4px 8px;border-radius:10px;justify-content:center}
.kuu-nimi{font-size:10.5px;letter-spacing:.7px}
.kuu-hind{font-size:15px;line-height:1.1;letter-spacing:-.3px}
.kuu-ilm{font-size:10.5px;line-height:1.1}
/* Esiletostetud kuu ei tohi olla teistest korgem ega laiem: 2 px aaris soob
   seest ruumi, seega kompenseerime taandega, mitte korgusega. */
.kuu-kaart.parim{padding:6px 3px 7px}
/* Lipik seisis `top:-9px` peal ja kattis kompaktses tsipis kuu nime. Toume ta
   tervikuna tsipist valja - rea ulemine taane (19 px) hoiab talle ruumi. */
.filtri-kuud-siht .lipik{top:-13px;font-size:8.5px;padding:2px 6px;letter-spacing:.4px}
.kuu-kaart:hover{transform:none;border-color:var(--tuti)}

@media (max-width:900px){
  /* Kitsas vaates GRID, mitte horisontaalne kerimine. Kerimisriba oli
     vaikselt olemas, aga inimene ei pruugi taibata korvale kerida - osa
     kuid jai lihtsalt nagemata. Sama muster nagu avalehel. */
  .kuuriba{display:grid;grid-template-columns:repeat(4,1fr);
    gap:20px 6px;overflow:visible;padding-bottom:2px}
  .kuu-kaart{flex:none;min-width:0;max-width:none}
  .kuu-kaart.kuu-koik{grid-column:span 4;min-width:0;flex-direction:row;gap:8px}
}
@media (max-width:480px){
  /* Kolm veergu: nelja veeruga jaab tsipile 85 px ja "SEP 2026" murdub. */
  .kuuriba{grid-template-columns:repeat(3,1fr)}
  .kuu-kaart.kuu-koik{grid-column:span 3}
}
@media (max-width:760px){
  .filtri-kuud-siht{flex-direction:column;align-items:flex-start;gap:8px}
  .filtri-kuud-siht > .filtri-nimi{align-self:flex-start}
  .kuuriba{width:100%}
}

/* Sihtkohalehel oli filtripaneeli ja esimese pakkumise vahel 159 px puhast
   tuhikut: paneel -> tabid -> oode riba -> nimekiri, igauhe vahel oma
   marginaal. Toode ise algas alles ~900 px pealt. Kitsendame rutmi seal,
   kus vahe on dekoratiivne, mitte tahenduslik. */
.filtririba-jatk{margin-bottom:14px}
.filtririba-jatk + * .tabid,
.laia-plokk .tabid{margin-bottom:13px}
.laia-plokk .ood-filter{margin-bottom:11px}

/* Pagas on täislaiuses; lennuajad ja ümberistumine jagavad järgmise rea
   pooleks. Kolme kontrolli ühele reale surumine jätaks kellaajavalikud liiga
   kitsaks ja murraks pikad eestikeelsed sildid. */
@media (min-width:1160px){
  .filtririba-jatk{display:grid;grid-template-columns:1fr 1fr}
  .filtririba-jatk > .filtri-rida{min-width:0}
  .filtririba-jatk > .pagasi-vaade{grid-column:1/-1}
  .filtririba-jatk > .kellaaja-vaade:last-child{grid-column:1/-1}
  .filtririba-jatk > .umber-vaade{border-left:1px solid #f0f1f5}
  .filtririba-jatk > .umber-vaade .filtri-nimi{flex:0 0 auto}
  /* Selgitus elab `title`s - reas ei ole talle ruumi. */
  .filtririba-jatk > .umber-vaade .umber-abi{display:none}
}

/* ---- Sihtkoha kaart lehe lopus ---- */
.kaardi-pea{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:0 0 12px}
.kaardi-pea h2{margin:0}
.kaardi-jaam{font-size:13.5px;color:var(--tuhm)}
.kaardi-jaam b{color:var(--tekst);letter-spacing:.5px}
/* Korgus on fikseeritud, et Leafleti laadimine ei nihutaks lehte (CLS). */
.siht-kaart{height:340px;border-radius:14px;overflow:hidden;
  border:1px solid var(--joon);background:#eef1f6}
.siht-kaart .leaflet-tooltip{font-weight:700;font-size:12.5px;color:var(--tekst);
  border:1px solid var(--joon);box-shadow:0 2px 8px rgba(18,30,67,.12)}
@media (max-width:760px){ .siht-kaart{height:260px} }

/* ---- Pakkumise rida: jagamine vasakul, "Vali" paremal, detailid alla -------
   Varem oli kogu rida vaikne link Kiwisse ja ainus nupukujuline element reas
   oli jagamisikoon rea lopus - tapselt seal, kus inimene ootab tegevusnuppu.
   Nuud on ostutee nahtav ja jagamine korvaline. */
.pakkumine-rida{flex-wrap:wrap}
.pakkumine-rida > .jaga-nupp{order:1;border-left:0;border-right:1px solid transparent;
  border-radius:10px 0 0 10px}
.pakkumine-rida > .pakkumine{order:2}
.pakkumine-rida > .broneeri-nupp{order:3}
.pakkumine-rida > .rea-detail{order:4;flex:1 0 100%}
.pakkumine-rida:hover > .jaga-nupp{border-right-color:var(--joon)}
/* `.pakkumine` on nuud `<button>`, mitte `<a>` - nullime brauseri oma stiili.
   MITTE `width:100%`: `.pakkumine-rida` on `flex-wrap:wrap` ja taislaius
   lykkaks jagamise ning "Vali" nupu omaette ridadele. */
.pakkumine{border:0;background:none;font:inherit;color:inherit;text-align:left;
  flex:1 1 auto;min-width:0}

/* CTA on ROHELINE, mitte brandimagenta: magenta on lehel kojav (pealkirjad,
   hinnad, sildid, aktiivsed filtrid) ja ostunupp kadus selle sisse. Roheline
   on ainus koht, kus seda tooni kasutatakse, seega ta ei konkureeri millegagi.
   #157f4a + valge = 5,04:1 ehk tapselt sama kaal mis senisel magental
   (5,06:1) - vahetus ei tee nuppu loetamatuks. */
.broneeri-nupp{flex:0 0 auto;align-self:stretch;display:grid;place-items:center;
  padding:0 20px;margin:6px 6px 6px 0;border-radius:9px;
  background:#157f4a;color:#fff;font-weight:800;font-size:14px;
  white-space:nowrap;transition:background .14s}
.broneeri-nupp:hover{background:#0f6b3d;color:#fff}

/* Lahtikaiv ajatelg. Varem oli see hore loend, kus kuupaev puudus hoopis -
   inimene nagi ainult kellaaega ega teadnud, MIS PAEVAL lennatakse, ja oolennu
   jargmise paeva saabumine oli nahtamatu. Nuud on suunal taiskuupaev, punktidel
   linnanimi + kood ning joon, mis seob peatused kokku. */
.rea-detail{border-top:1px solid var(--joon);padding:16px 18px 14px;
  display:grid;grid-template-columns:1fr 1fr;gap:28px;background:#fbfcfe}
/* `display:grid` loob brauseri `[hidden]{display:none}` ule ja koik detailid
   jaid lahti - sama loks nagu varem `.pakkumine-rida` flexiga. */
.rea-detail[hidden]{display:none !important}
.pakkumine-rida.valitud .rea-detail{background:#fffdf2;border-top-color:#e8cf3a}

.rd-pea{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.rd-suund-nimi{font-size:10px;font-weight:800;letter-spacing:.7px;text-transform:uppercase;
  color:#fff;background:var(--tuti);padding:3px 9px;border-radius:999px}
.rd-kuupaev{font-size:14px;font-weight:700;color:var(--tekst)}
.rd-kokku{margin-left:auto;font-size:12.5px;color:var(--tuhm);white-space:nowrap}

/* Joon ja punktid on samal teljel: joon 60 px juures (2 px lai, kese 61),
   punkt 11 px lai, seega vasak serv 61 - 5,5 = 55,5. */
.rd-telg{list-style:none;margin:0;padding:0}
.rd-punkt{display:grid;grid-template-columns:52px 1fr;align-items:baseline;gap:16px;
  font-size:14px;position:relative;min-height:22px}
.rd-punkt::before{content:'';position:absolute;left:55.5px;top:.42em;
  width:7px;height:7px;border-radius:50%;background:#fff;border:2px solid var(--tuti)}
.rd-kell{font-weight:700;font-variant-numeric:tabular-nums;color:var(--tekst)}
.rd-jargmine{color:var(--tuti);font-size:10px;font-weight:800;top:-.5em}
.rd-koht b{font-weight:700;color:var(--tekst)}
.rd-kood{margin-left:7px;font-size:11.5px;font-weight:700;letter-spacing:.5px;color:var(--tuhm)}

.rd-lend,.rd-ootus{position:relative;padding:7px 0 7px 84px;font-size:12.5px;color:var(--tuhm)}
.rd-lend::before,.rd-ootus::before{content:'';position:absolute;left:60px;top:0;bottom:0;
  border-left:2px solid var(--joon)}
.rd-ootus{color:var(--tuti);font-weight:600}
.rd-ootus::before{border-left:2px dotted var(--tuti)}

.rd-jalus{display:flex;gap:12px;flex-wrap:wrap;margin-top:10px;padding-left:68px;
  font-size:12px;color:var(--tuhm)}
.rd-hoiatus{color:var(--tuti);font-weight:700}

@media (max-width:760px){
  .rea-detail{grid-template-columns:1fr;gap:20px;padding:14px 14px 12px}
  .broneeri-nupp{padding:0 16px;font-size:13.5px}
}

/* Mobiiliparandused pagasi/umberistumise ja kuuriba juures.
   1) Kitsas vaates on `.filtri-rida` VEERG. Seal maarab `flex-basis` mitte
      laiust vaid KORGUST, ja `flex:0 0 108px` tegi sildist 108 px korguse
      ploki - sildi ja segmendi vahele jai suur tuhimik (mootdetud 390 px
      ekraanil: `.pagasi-vaade` 206 px korge, sildil uksi 108).
   2) `.kuuriba{overflow-x:auto}` loikas "parim aeg" lipiku ara, sest lipik
      seisab tsibist 13 px korgemal. Anname kerimiskastile ulevalt ruumi. */
@media (max-width:900px){
  .filtri-kuud-siht{padding-top:6px}
  .kuuriba{padding-top:15px}
}
@media (max-width:760px){
  .pagasi-vaade .filtri-nimi,
  .umber-vaade .filtri-nimi,
  .kellaaja-vaade .filtri-nimi{flex:0 0 auto}
}

/* Pakkumise rida mobiilis. Laual mahub koik uhele reale, kitsas vaates mitte:
   mootdetud 390 px ekraanil oli "Vali" nupp 66x22 px ja jagamisikoon 42x19 -
   molemad alla puutesihiku miinimumi ja CTA nagi valja nagu jaralinnune
   tekst, mitte nupp. Nuud on CTA taislaiuses rea all. */
@media (max-width:760px){
  .pakkumine-rida{flex-wrap:wrap;padding-bottom:8px}
  /* Ikooni kesktelg oli 21 px, kuupaeval 25 - 4 px korgemal ja seetottu
     "holjus" rea kohal. Nihutame ta esimese rea joonele. */
  .pakkumine-rida > .jaga-nupp{order:1;flex:0 0 40px;height:40px;align-self:flex-start;
    margin-top:4px;border-radius:10px 0 0 0;border-left:0}
  /* `flex:1 1 0`, mitte `auto`: grid'i min-sisulaius nouaks muidu tervet rida
     ja jagamisikoon jaaks detailidega ridadel omaette reale. */
  .pakkumine-rida > .pakkumine{order:2;flex:1 1 0;min-width:0}
  /* `flex-basis:100%` on 100% rea SISUKASTIST ja marginaalid tulevad sellele
     OTSA - koos `flex-shrink:0`-ga ulatus nupp 11 px ule rea parema serva.
     Alus peab marginaali ise maha arvama; `1 1` jatab ka kahanemisruumi. */
  .pakkumine-rida > .broneeri-nupp{order:3;flex:1 1 calc(100% - 24px);
    margin:6px 12px 2px;min-height:44px;font-size:15px}
  .pakkumine-rida > .rea-detail{order:4}
}

/* Kuulehel nahtav "koik kuud" tsipp ja aktiivse kuu markistus. Varem sai
   kuulehele sisse, aga mitte tagasi - ainult leivapuru kaudu. */
.kuu-kaart.kuu-koik{flex:0 0 auto;min-width:64px;justify-content:center}
/* Valitud kuu on KOLLANE, nagu "Your pick" real - kollane tahendab saidil
   labivalt "sinu praegune valik", magenta aga susteemi silti (parim aeg,
   odavaim). Tekst peab siis olema navy: vaikimisi hall `--tuhm` annaks
   kollasel ainult 4,17:1 ja kukuks AA-st labi. Navy annab 13,5:1, sama
   0,72 lapipaistvusega veel 6,6:1. */
.kuu-kaart.aktiivne{border-color:#e8cf3a;border-width:2px;padding:6px 3px 7px;
  background:var(--kollane)}
.kuu-kaart.aktiivne .kuu-hind{color:var(--navy)}
.kuu-kaart.aktiivne .kuu-nimi,
.kuu-kaart.aktiivne .kuu-ilm{color:rgba(18,30,67,.72)}
.kuu-kaart.aktiivne:hover{border-color:var(--navy)}

/* Pagasiriba hinna ees: koik kolm liiki koos arvuga, ka nullid. Null on
   siin kasulikum kui uks: "araantav pagas" ei sisalda kasipagasit ja seda ei
   arvaks keegi ise. Olemasolev on tume, puuduv kahvatu ja labikriipsutatud -
   nii loeb seda ka see, kes varve ei erista. */
.pk-hind{display:flex;align-items:center;gap:12px;justify-content:flex-end}
.pk-summa{font-weight:800;font-size:19px;color:var(--tuti)}

.pk-pagasid{display:flex;align-items:center;gap:7px;flex:0 0 auto}
.pk-pg{display:inline-flex;align-items:center;gap:2px;
  font-size:10.5px;font-weight:800;line-height:1;letter-spacing:0}
.pk-pg svg{width:15px;height:15px}
.pk-pg-on{color:var(--tekst)}
.pk-pg-ei{color:#b9c0d0}
/* Puuduvale tommatakse joon labi - varv uksi ei ole ligipaasetav vihje. */
.pk-pg-ei{position:relative}
.pk-pg-ei svg{opacity:.75}
.pk-pg-ei::after{content:'';position:absolute;left:1px;right:9px;top:50%;
  border-top:1.5px solid currentColor;transform:rotate(-16deg)}
.pakkumine-rida:hover .pk-pg-on{color:var(--tuti)}

@media (max-width:760px){
  /* Mobiili rida on FLEX, mitte grid. Grid'i `1fr` veerg venitas kuupaeva
     laiaks ja lukustas pagasi, ood ning hinna paremasse serva kolme
     virna - keskele jai suur tuhi ala. Flexis kasvab kuupaev ainult oma
     sisu jargi ja ulejaanu saab kokku uheks ruhmaks, mis murdub alles
     siis, kui pariselt ei mahu (390 px murdub, 555 px mitte). */
  .pakkumine,
  .pakkumine.detailidega{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
  .pakkumine .pk-kuup{flex:0 1 auto;min-width:0}
  .pakkumine .pk-ood{order:2;white-space:nowrap}
  /* Pagas ja hind on UKS ruhm, mis ei murdu seest: kas nad mahuvad reale
     koos (>=520 px ekraan) voi lahevad koos jargmisele reale, alati paremale
     joondatult. Varem sundisin pagasi `flex:1 0 100%`-ga ALATI omaette reale,
     ka siis kui ruumi oli - sealt tekkis tuhimik hinnast vasakule. */
  .pakkumine .pk-hind{order:3;margin-left:auto;
    flex-direction:row;flex-wrap:nowrap;align-items:center;gap:10px}
  /* Kaks suunda korvuti on LAUA lahendus. 390 px ekraanil saaks kumbki 132 px
     ja tekst loigatakse - seal jaavad suunad ustteise alla. */
  .pakkumine .pk-marsruudid{order:4;flex:1 0 100%;margin-top:2px;
    grid-template-columns:minmax(0,1fr);gap:2px}
  .pk-pagasid{gap:5px}
  .pk-pg svg{width:13px;height:13px}
  .pk-pg{font-size:9.5px}
}

/* Lahtikaivas plokis seisis ulemine hairjoon 2 px "Vali" nupu kulje all ja
   luges nupu jarjena, mitte eraldi plokina. */
.pakkumine-rida > .broneeri-nupp{margin-bottom:10px}
.rea-detail{padding-top:18px}
@media (max-width:760px){
  .pakkumine-rida > .broneeri-nupp{margin:6px 12px 12px}
  .rea-detail{padding-top:16px}
}

/* Aasta kuusildil: "JAAN" uksi ei utle, kummast jaanuarist jutt on - kaardid
   ulatuvad 12 kuud ette ja katavad kahte aastat. Aasta on kergem kui kuu,
   et silt ei muutuks kaardi peategelaseks. */
.siht-kuu em{font-style:normal;font-weight:700;opacity:.72;letter-spacing:.3px}


/* Pikim eestikeelne kuupaevapaar ("K 9. dets → K 23. dets") ei mahtunud
   mobiilis uhele reale: veerg sai 156 px, vaja oli ~174. Vottsime ruumi
   vahedest, mitte kirjasuurusest - kuupaev on rea peamine sisu. */
@media (max-width:760px){
  .pakkumine{gap:10px}
  .pk-kuup{gap:6px;flex-wrap:nowrap}
  .pk-nool{flex:0 0 auto}
}

/* Pikim eestikeelne kuunimi ("MÄRTS 2027") oli 75 px 73 px laiuses tsibis ja
   murdus kahele reale, tehes uhe tsibi teistest korgemaks. Kitsendame tahe- ja
   kirjavahet ainult siin, mitte kogu saidil. */
.filtri-kuud-siht .kuu-nimi{white-space:nowrap;font-size:10px;letter-spacing:.4px}

/* Peatuste naidik: katkematu joon = otselend, iga mumm = uks vahemaandumine.
   Sona "otselend" vottis ~54 px, see 34 px - ja loeb hetkega ilma lugemata.
   Sisu ise (mis lennujaam, kui pikk ooteaeg) on akordionis. */
.pk-peatused{position:relative;display:inline-flex;align-items:center;
  justify-content:center;gap:5px;width:34px;height:10px;
  vertical-align:middle;margin-right:7px;flex:0 0 auto}
.pk-peatused::before{content:'';position:absolute;left:0;right:0;top:50%;
  border-top:1.5px solid #c6cddb;transform:translateY(-50%)}
.pk-peatused.otse::before{border-top-color:#2f8f5b;border-top-width:2px}
.pk-peatused i{position:relative;width:5px;height:5px;border-radius:50%;
  background:var(--tuti);box-shadow:0 0 0 2px #fff}
.pakkumine-rida:hover .pk-peatused i{box-shadow:0 0 0 2px #fdfbfc}
.pk-lennu-meta{display:flex;align-items:center}

/* "+1" reas: lend maandub jargmisel paeval. Mootdetud 9,3% suundadest.
   Taiskuupaeva suuna ette me EI pane - kuupaevapaar on samal real 200 px
   vasakul ja "esimene = valja, teine = tagasi" on universaalne. Puudu oli
   ainult see, kui saabumine libiseb ule keskoo. */
.pk-jargmine{color:var(--tuti);font-size:9.5px;font-weight:800;
  margin-left:1px;top:-.55em}

/* ---- Küpsiste nõusolekuriba ---------------------------------------------
   Alumine riba, mitte ekraani kattev modaal: sisu peab jaama loetavaks ka
   enne valikut. "Keeldun" on sama suur kui "Noustun" - erineva kaaluga
   nupud teeksid nousoleku mittevabaks. */
.kupsiseriba{position:fixed;left:0;right:0;bottom:0;z-index:80;
  background:var(--navy);color:#fff;box-shadow:0 -6px 24px rgba(10,16,38,.28)}
.kupsiseriba[hidden]{display:none !important}
.kr-sisu{max-width:1140px;margin:0 auto;padding:16px 20px;
  display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.kr-sisu p{margin:0;flex:1 1 340px;font-size:13.5px;line-height:1.5;
  color:rgba(255,255,255,.86)}
.kr-sisu b{color:#fff}
.kr-nupud{display:flex;gap:10px;flex:0 0 auto;margin-left:auto}
.kr-nupp{padding:11px 22px;border-radius:9px;border:1px solid transparent;
  font:inherit;font-weight:700;font-size:14px;cursor:pointer;
  transition:background .14s,border-color .14s}
.kr-jah{background:#157f4a;color:#fff}
.kr-jah:hover{background:#0f6b3d}
.kr-ei{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.kr-ei:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.7)}
@media (max-width:640px){
  .kr-sisu{padding:14px 16px;gap:12px}
  .kr-nupud{margin-left:0;width:100%}
  .kr-nupp{flex:1 1 0}
}
.autor-eraldaja{opacity:.5;margin:0 6px}
.kupsis-link{background:none;border:0;padding:0;font:inherit;color:inherit;
  opacity:.8;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.kupsis-link:hover{opacity:1}

/* ---- Lemmikud -------------------------------------------------------------
   Suda pakkumise real. Vaikimisi tuhm ja tagasihoidlik nagu jagamine -
   pohitegevus on endiselt "Vali". Salvestatuna taidetud ja brandivarvis. */
.lemmik-nupp{flex:0 0 34px;display:grid;place-items:center;cursor:pointer;
  background:none;border:0;padding:0;color:transparent;
  transition:color .14s,transform .12s}
.lemmik-nupp svg{width:17px;height:17px;fill:currentColor;stroke:var(--tuhm);
  transition:stroke .14s}
.pakkumine-rida:hover .lemmik-nupp svg{stroke:var(--tuti)}
.lemmik-nupp:hover{transform:scale(1.12)}
.lemmik-nupp.lemmik-on{color:var(--tuti)}
.lemmik-nupp.lemmik-on svg{stroke:var(--tuti)}
.pakkumine-rida > .lemmik-nupp{order:0;align-self:stretch}

/* Peamenüü link ja loendur */
.lemmik-link{display:inline-flex;align-items:center;gap:6px}
.lemmik-link svg{width:15px;height:15px}
.lemmik-arv{min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:var(--kollane);color:var(--navy);font-size:11px;font-weight:800;
  display:inline-grid;place-items:center;line-height:1}
.lemmik-arv[hidden]{display:none !important}

/* Lemmikute leht: sama rea keel nagu pakkumistel, aga hinnavahe juures. */
.lemmik-rida{align-items:center}
.lemmik-rida .pakkumine{cursor:pointer}
.lemmik-nimi{font-weight:700;color:var(--tekst);min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lemmik-vahe-riba{flex:1 0 100%;display:flex;gap:10px;align-items:baseline;
  padding:0 16px 10px;font-size:12.5px;color:var(--tuhm)}
.lemmik-vahe{font-weight:800}
.lv-alla{color:#157f4a}
.lv-yles{color:var(--tuti)}
.lv-sama{color:var(--tuhm)}
.lemmik-vana{text-decoration:line-through;opacity:.75}
.lemmik-kadunud{opacity:.6}
.lemmik-kadunud-silt{font-size:12.5px;font-weight:700;color:var(--tuhm)}
.lemmik-eemalda{flex:0 0 42px;align-self:stretch;background:none;border:0;
  border-left:1px solid var(--joon);font-size:22px;line-height:1;
  color:var(--tuhm);cursor:pointer;border-radius:0 10px 10px 0;
  transition:color .14s,background .14s}
.lemmik-eemalda:hover{color:var(--tuti);background:#fdf4f9}
.lemmik-teade{color:#157f4a;font-weight:600}

/* Kinnitusmodaal */
.lk-kate{position:fixed;inset:0;z-index:90;background:rgba(10,16,38,.55);
  display:grid;place-items:center;padding:20px}
.lk-kate[hidden]{display:none !important}
.lk-aken{background:#fff;border-radius:16px;padding:24px;max-width:400px;width:100%;
  box-shadow:0 24px 60px rgba(10,16,38,.35)}
.lk-aken h2{margin:0 0 6px;font-size:18px}
.lk-siht{margin:0 0 20px;color:var(--tuhm);font-size:14px}
.lk-nupud{display:flex;gap:10px;justify-content:flex-end}
.lk-nupp{padding:11px 20px;border-radius:9px;border:1px solid transparent;
  font:inherit;font-weight:700;font-size:14px;cursor:pointer}
.lk-ei{background:#fff;border-color:var(--joon);color:var(--tekst)}
.lk-ei:hover{background:#f4f5f8}
.lk-jah{background:var(--tuti);color:#fff}
.lk-jah:hover{background:var(--tuti-tume)}
@media (max-width:640px){
  .lk-nupud{flex-direction:column-reverse}
  .lk-nupp{width:100%}
  .lemmik-vahe-riba{padding:0 14px 10px}
}

/* Lemmiku rida on TAPSELT sama struktuuriga nagu pakkumiste rida - sama grid,
   samad plokid, sama korgus. Erinevusi on ainult kaks:
     1) rea alguses on `×` jagamise korval (suda oleks siin motetu - rida ISE
        on lemmik);
     2) sihtkoha nimi on kuupaeva kohal, sest lemmikute nimekirjas on korvuti
        eri sihtkohad ja kuupaev uksi ei utle, kuhu.
   Hinnamuutus on SILT (`rea-silt`), mitte omaette rida - nii jaab korgus
   samaks nagu pakkumistel. */
.lemmik-rida{flex-wrap:wrap;align-items:stretch}
.lemmik-rida > .lemmik-eemalda{order:0;flex:0 0 38px;align-self:stretch;
  border-left:0;border-right:1px solid transparent;border-radius:10px 0 0 10px}
.lemmik-rida:hover > .lemmik-eemalda{border-right-color:var(--joon)}
.lemmik-rida > .jaga-nupp{order:1}
.lemmik-rida > .pakkumine{order:2;flex:1 1 0;min-width:0}
.lemmik-rida > .broneeri-nupp{order:3}
.lemmik-rida > .rea-detail{order:4;flex:1 0 100%}

/* Kuupaevaplokk kannab kahte rida: sihtkoht ules, kuupaevad alla. */
.lemmik-rida .pk-kuup{flex-direction:column;align-items:flex-start;gap:1px}
.lemmik-siht{font-weight:700;font-size:14px;color:var(--tekst);
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lemmik-kp{font-size:12.5px;color:var(--tuhm);white-space:nowrap}
.lemmik-kp .pk-nool{margin:0 2px}

/* Hinnamuutuse silt. Roheline = odavnes, magenta = kallines. */
.rs-odavam{background:#157f4a;box-shadow:0 2px 6px rgba(21,127,74,.3)}
.rs-kallim{background:var(--tuti)}
.pakkumine-rida.lemmik-odavnes{border-color:#157f4a;
  box-shadow:0 2px 12px rgba(21,127,74,.14)}
.pakkumine-rida.lemmik-odavnes .pk-summa{color:#157f4a}

.lemmik-eemalda{background:none;border:0;font-size:20px;line-height:1;
  color:var(--tuhm);cursor:pointer;display:grid;place-items:center;
  transition:color .14s,background .14s}
.lemmik-eemalda:hover{color:var(--tuti);background:#fdf4f9}
.lemmik-kadunud{opacity:.6}
.lemmik-kadunud-silt{font-size:12.5px;font-weight:700;color:var(--tuhm)}
.lemmik-teade{color:#157f4a;font-weight:600}

/* Peamenüü link ja loendur */
.lemmik-link{display:inline-flex;align-items:center;gap:6px}
.lemmik-link svg{width:15px;height:15px}
.lemmik-arv{min-width:18px;height:18px;padding:0 5px;border-radius:999px;
  background:var(--kollane);color:var(--navy);font-size:11px;font-weight:800;
  display:inline-grid;place-items:center;line-height:1}
.lemmik-arv[hidden]{display:none !important}

/* Kinnitusmodaal */
.lk-kate{position:fixed;inset:0;z-index:90;background:rgba(10,16,38,.55);
  display:grid;place-items:center;padding:20px}
.lk-kate[hidden]{display:none !important}
.lk-aken{background:#fff;border-radius:16px;padding:24px;max-width:400px;width:100%;
  box-shadow:0 24px 60px rgba(10,16,38,.35)}
.lk-aken h2{margin:0 0 6px;font-size:18px}
.lk-siht{margin:0 0 20px;color:var(--tuhm);font-size:14px}
.lk-nupud{display:flex;gap:10px;justify-content:flex-end}
.lk-nupp{padding:11px 20px;border-radius:9px;border:1px solid transparent;
  font:inherit;font-weight:700;font-size:14px;cursor:pointer}
.lk-ei{background:#fff;border-color:var(--joon);color:var(--tekst)}
.lk-ei:hover{background:#f4f5f8}
.lk-jah{background:var(--tuti);color:#fff}
.lk-jah:hover{background:var(--tuti-tume)}

@media (max-width:760px){
  .lemmik-rida > .lemmik-eemalda{flex:0 0 38px;height:44px;align-self:flex-start;
    margin-top:4px}
  .lemmik-rida > .broneeri-nupp{order:4;flex:1 1 calc(100% - 24px);
    margin:6px 12px 12px;min-height:44px}
  .lemmik-rida > .rea-detail{order:5}
  .lk-nupud{flex-direction:column-reverse}
  .lk-nupp{width:100%}
}

/* Sihtkoha nimi lemmikute real on LINK sihtkohalehele: sealt saab inimene
   vaadata sama sihtkoha varskeid hindu teistel kuupaevadel. Alljoon ilmub
   hoveril, et ta ei konkureeriks reas hinnaga. */
a.lemmik-siht{color:var(--tekst);text-decoration:none;
  border-bottom:1px solid transparent;transition:color .14s,border-color .14s}
a.lemmik-siht:hover,a.lemmik-siht:focus-visible{color:var(--tuti);
  border-bottom-color:var(--tuti)}

/* Kuupaevapaar ei tohi KUNAGI murduda: veerg kohaneb (`auto`), tekst mitte. */
.pk-kuup{white-space:nowrap}
.pk-kuup > span{white-space:nowrap}

/* ---- Korduma kippuvad küsimused ----------------------------------------
   `<details>` hoiab ploki kompaktsena, aga vastus on DOM-is ja seega nii
   roomajale kui `FAQPage` margendusele vastavuses. */
.kkk-pealkiri{margin:26px 0 12px;font-size:19px}
.kkk{border-top:1px solid var(--joon)}
.kkk-rida{border-bottom:1px solid var(--joon)}
.kkk-rida summary{padding:13px 26px 13px 0;cursor:pointer;position:relative;
  font-weight:700;font-size:14.5px;color:var(--tekst);list-style:none}
.kkk-rida summary::-webkit-details-marker{display:none}
.kkk-rida summary::after{content:'';position:absolute;right:6px;top:50%;
  width:8px;height:8px;margin-top:-5px;border-right:2px solid var(--tuhm);
  border-bottom:2px solid var(--tuhm);transform:rotate(45deg);
  transition:transform .15s}
.kkk-rida[open] summary::after{transform:rotate(-135deg);margin-top:-2px}
.kkk-rida summary:hover{color:var(--tuti)}
.kkk-rida p{margin:0 0 14px;font-size:14px;line-height:1.6;color:var(--tuhm);
  max-width:70ch}