:root{
  --alb:#ffffff;
  --fundal:#f2f8ff;
  --bleu:#e4f0fd;
  --bleu-tare:#cbe2fa;
  --albastru:#1673e6;
  --albastru-apasat:#0b57d0;
  --inchis:#0d2b4e;
  --text:#153453;
  --sters:#5d7c9c;
  --umbra:0 1px 2px rgba(13,43,78,.06),0 8px 24px rgba(13,43,78,.08);
  --rotund:14px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--fundal);color:var(--text);
  font:16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
a{color:var(--albastru-apasat)}
.cadru{width:100%;max-width:980px;margin:0 auto;padding:0 18px}

/* ---------- antet ---------- */
header{
  background:var(--alb);border-bottom:1px solid var(--bleu-tare);
  position:sticky;top:0;z-index:20;
}
header .cadru{display:flex;align-items:center;gap:10px;min-height:58px;flex-wrap:nowrap}
.logo{
  display:flex;align-items:center;gap:7px;font-weight:800;font-size:16px;
  color:var(--inchis);text-decoration:none;letter-spacing:-.2px;white-space:nowrap;
}
.logo b{font-weight:800}
.logo i{font-style:normal;color:var(--albastru)}
header nav{margin-left:auto;display:flex;gap:7px;align-items:center;flex:0 0 auto}
@media(max-width:439px){.logo b{display:none}}
.buton-mic{
  display:inline-block;padding:8px 13px;border-radius:999px;font-size:13.5px;
  font-weight:700;text-decoration:none;background:var(--bleu);color:var(--albastru-apasat);
  white-space:nowrap;
}
.buton-mic:hover{background:var(--bleu-tare)}
.limba{
  display:inline-block;padding:7px 12px;border-radius:999px;font-size:13px;
  font-weight:800;text-decoration:none;color:var(--sters);border:1.5px solid var(--bleu-tare);
  letter-spacing:.5px;
}
.limba:hover{color:var(--albastru-apasat);border-color:var(--albastru)}

/* ---------- erou ---------- */
.erou{
  background:linear-gradient(170deg,#0d2b4e 0%,#14477f 55%,#1673e6 100%);
  color:#fff;padding:40px 0 92px;text-align:center;
}
.erou h1{
  margin:0 0 10px;font-size:29px;line-height:1.25;letter-spacing:-.6px;font-weight:800;
}
.erou p{margin:0;color:#c5ddf7;font-size:16px}

/* ---------- cautare ---------- */
.cautare{
  background:var(--alb);border-radius:18px;box-shadow:var(--umbra);
  padding:16px;margin-top:18px;position:relative;z-index:5;
}
.cautare.lipit{margin-top:-62px}
.campuri{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.camp{display:flex;flex-direction:column;gap:5px}
.camp.lat{grid-column:1/-1}
.camp label{font-size:12px;font-weight:700;color:var(--sters);text-transform:uppercase;letter-spacing:.4px}
.camp label small{text-transform:none;letter-spacing:0;font-weight:600;opacity:.75}
.camp input{
  width:100%;padding:11px 12px;border:1.5px solid var(--bleu-tare);border-radius:11px;
  font-size:16px;color:var(--text);background:#fbfdff;font-family:inherit;
}
.camp input:focus{outline:none;border-color:var(--albastru);background:#fff}
.buton{
  display:block;width:100%;margin-top:12px;padding:14px;border:0;border-radius:12px;
  background:var(--albastru);color:#fff;font-size:16px;font-weight:800;cursor:pointer;
  font-family:inherit;text-align:center;text-decoration:none;
}
.buton:hover{background:var(--albastru-apasat)}
.eroare{margin:10px 0 0;color:#c0392b;font-size:14px;font-weight:600;display:none}

/* ---------- sectiuni ---------- */
section{padding:34px 0}
h2{font-size:21px;margin:0 0 4px;letter-spacing:-.3px;color:var(--inchis)}
.sub{margin:0 0 18px;color:var(--sters);font-size:14px}

/* ---------- oferte ---------- */
.oferte{display:grid;grid-template-columns:1fr;gap:12px}
.oferta{
  display:flex;align-items:center;gap:14px;background:var(--alb);border:1px solid var(--bleu-tare);
  border-radius:var(--rotund);padding:14px 16px;text-decoration:none;color:inherit;
}
.oferta:hover{border-color:var(--albastru);box-shadow:var(--umbra)}
.oferta .ruta{font-weight:700;color:var(--inchis);font-size:16px}
.oferta .info{color:var(--sters);font-size:13px;margin-top:2px}
.oferta .pret{margin-left:auto;text-align:right;white-space:nowrap}
.oferta .pret b{display:block;font-size:22px;color:var(--albastru);letter-spacing:-.5px}
.oferta .pret i{font-style:normal;font-size:11px;color:var(--sters)}

/* ---------- banda telegram ---------- */
.banda{
  background:var(--inchis);color:#fff;border-radius:18px;padding:26px 20px;text-align:center;
}
.banda h2{color:#fff;margin-bottom:6px}
.banda p{margin:0 0 16px;color:#bcd6f2;font-size:15px}
.banda .buton{background:#fff;color:var(--inchis);max-width:340px;margin:0 auto 10px}
.banda .buton.linie{background:transparent;color:#fff;border:1.5px solid #3f6da3}

/* ---------- rute ---------- */
.rute{display:flex;flex-wrap:wrap;gap:8px}
.rute a{
  background:var(--alb);border:1px solid var(--bleu-tare);border-radius:999px;
  padding:8px 14px;font-size:14px;text-decoration:none;color:var(--text);font-weight:600;
}
.rute a:hover{border-color:var(--albastru);color:var(--albastru-apasat)}

/* ---------- pagina de oferta ---------- */
.bilet{
  background:var(--alb);border-radius:18px;box-shadow:var(--umbra);
  overflow:hidden;margin:26px 0;
}
.bilet .cap{background:var(--bleu);padding:20px;text-align:center}
.bilet .cap .drum{font-size:23px;font-weight:800;color:var(--inchis);letter-spacing:-.4px}
.bilet .cap .tip{color:var(--sters);font-size:14px;margin-top:3px}
.bilet .mare{text-align:center;padding:24px 20px 4px}
.bilet .mare b{font-size:46px;color:var(--albastru);letter-spacing:-1.5px;line-height:1}
.bilet .mare span{display:block;color:var(--sters);font-size:13px;margin-top:6px}
.randuri{padding:18px 20px}
.rand{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--bleu)}
.rand:last-child{border:0}
.rand span{color:var(--sters);font-size:14px}
.rand b{font-weight:700;text-align:right;font-size:14px}
.bilet .jos{padding:0 20px 20px}
.nota{color:var(--sters);font-size:13px;text-align:center;margin:10px 0 0}
.text p{color:var(--text)}
footer{
  background:var(--alb);border-top:1px solid var(--bleu-tare);
  padding:24px 0;color:var(--sters);font-size:13px;text-align:center;margin-top:20px;
}
footer a{color:var(--sters)}

@media(min-width:720px){
  .erou{padding:64px 0 104px}
  .erou h1{font-size:40px}
  .erou p{font-size:18px}
  .cautare{padding:22px}
  .campuri{grid-template-columns:repeat(4,1fr)}
  .camp.lat{grid-column:auto}
  .buton{max-width:280px;margin-left:auto;margin-right:auto}
  .oferte{grid-template-columns:1fr 1fr}
  h2{font-size:25px}
}
