/* Azimundo — tema „jurnal de expediție”: navy adânc, auriu, serif elegant. */
:root{
  --bg:#060f1a; --panel:#0a2036; --panel2:#081a2c; --ink:#e9eef4; --dim:#9fb4c4;
  --gold:#ffd166; --coral:#ff8a5c; --teal:#7fd8c9;
  --serif:'Palatino Linotype','Book Antiqua',Georgia,'Times New Roman',serif;
  --sans:'Segoe UI',system-ui,sans-serif;
  --railw:432px;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--sans)}

/* ---------- navigație comună ---------- */
.topbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:18px;
  padding:14px 28px;background:rgba(6,15,26,.85);backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(255,209,102,.18)}
.brand{font-family:var(--serif);font-size:22px;color:#f7f2e7;text-decoration:none}
.brand em{font-style:normal;color:var(--gold)}
.topbar .spacer{flex:1}
.topbar a.btn, a.btn, button.btn{display:inline-flex;align-items:center;gap:8px;background:transparent;
  color:var(--ink);border:1px solid rgba(255,209,102,.4);border-radius:24px;padding:8px 18px;
  font-size:14px;font-weight:600;text-decoration:none;cursor:pointer;transition:all .2s;font-family:var(--sans)}
a.btn:hover, button.btn:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-1px)}
a.btn.solid, button.btn.solid{background:var(--gold);color:#082036;border-color:var(--gold)}
a.btn.solid:hover, button.btn.solid:hover{background:#ffe6a8;color:#082036}

/* ---------- landing ---------- */
.hero-landing{position:relative;min-height:calc(100vh - 61px);display:flex;align-items:center;
  background:radial-gradient(110% 90% at 25% 15%, #0b2438 0%, var(--bg) 55%, #03080f 100%);overflow:hidden}
.hero-in{position:relative;z-index:2;max-width:1140px;margin:0 auto;padding:60px 28px;display:grid;
  grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.hero-copy .eyebrow{font-size:12px;letter-spacing:5px;color:var(--gold);font-weight:600}
.hero-copy h1{font-family:var(--serif);font-size:52px;line-height:1.06;color:#f7f2e7;margin:16px 0 18px}
.hero-copy h1 em{font-style:normal;color:var(--gold)}
.hero-copy p{color:var(--dim);font-size:17px;line-height:1.65;max-width:520px}
.hero-cta{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}
/* Cadrul globului din pagina principală. Fără ramă/fundal: conținutul e un glob viu,
   iar un cerc desenat în jurul lui se vedea ca un disc străin în spatele planetei. */
.hero-art{position:relative;aspect-ratio:1}
.steps{max-width:1140px;margin:0 auto;padding:70px 28px;display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.step{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:26px}
.step .n{font-family:var(--serif);font-size:34px;color:var(--gold)}
.step h3{font-size:17px;margin:10px 0 8px;color:#f2f6fa}
.step p{font-size:14px;color:var(--dim);line-height:1.6}
.foot{padding:26px;text-align:center;color:#6b7f90;font-size:12.5px;border-top:1px solid rgba(255,255,255,.06)}

/* ---------- dashboard ---------- */
.wrap{max-width:1140px;margin:0 auto;padding:40px 28px}
.wrap h1{font-family:var(--serif);font-size:34px;color:#f7f2e7;margin-bottom:6px}
.wrap .sub{color:var(--dim);margin-bottom:28px}
.tripgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px}
.tripcard{display:block;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);
  border-radius:16px;padding:22px;text-decoration:none;color:var(--ink);transition:all .2s}
.tripcard:hover{border-color:rgba(255,209,102,.5);transform:translateY(-3px);
  box-shadow:0 14px 40px rgba(0,0,0,.4)}
.tripcard h3{font-family:var(--serif);font-size:20px;color:#f7f2e7;margin-bottom:8px}
.tripcard .meta{font-size:13px;color:var(--dim)}
.tripcard .status{display:inline-block;margin-top:12px;font-size:11px;letter-spacing:1.5px;
  font-weight:700;text-transform:uppercase;padding:4px 12px;border-radius:12px}
.status.ready{background:rgba(127,216,201,.14);color:var(--teal)}
.status.processing{background:rgba(255,209,102,.14);color:var(--gold)}
.status.draft{background:rgba(159,180,196,.14);color:var(--dim)}
.status.error{background:rgba(255,138,92,.16);color:var(--coral)}
.tripcard.new{display:flex;align-items:center;justify-content:center;min-height:150px;
  border-style:dashed;border-color:rgba(255,209,102,.4);color:var(--gold);font-size:16px;font-weight:600}

/* ---------- pagina de trip (glob + rail) ---------- */
.trip-body{overflow:hidden;display:flex;height:100vh}
.stage{flex:1;position:relative;min-width:0}
#map{position:absolute;inset:0}
#map canvas{outline:none}
.hero{position:absolute;top:24px;left:32px;z-index:10;pointer-events:none;max-width:520px}
.hero .eyebrow{font-size:11px;letter-spacing:4px;color:var(--gold);font-weight:600;text-shadow:0 1px 8px rgba(0,0,0,.9)}
.hero h1{font-family:var(--serif);font-size:32px;line-height:1.06;margin:6px 0 4px;color:#f7f2e7;
  text-shadow:0 2px 22px rgba(0,0,0,.85)}
.hero .sub{color:#cfdce8;font-size:13px;text-shadow:0 1px 8px rgba(0,0,0,.9)}
/* Bara de jos a hărții: butoanele și totalul stau în ACELAȘI rând flexibil.
   Când harta e îngustă (laptop 1200-1600px, cu meniu lateral + panou dreapta),
   totalul urcă deasupra butoanelor în loc să se suprapună peste ele. */
.stage-bottom{position:absolute;left:0;right:0;bottom:0;z-index:10;display:flex;flex-wrap:wrap-reverse;
  align-items:flex-end;justify-content:space-between;gap:10px;padding:0 26px 22px;pointer-events:none}
.stage-bottom > *{pointer-events:auto}
.controls{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.controls button{background:rgba(8,25,40,.85);color:var(--ink);border:1px solid rgba(255,209,102,.35);
  width:42px;height:42px;border-radius:50%;font-size:18px;cursor:pointer;transition:all .2s;
  display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.controls button:hover{border-color:var(--gold);color:var(--gold);transform:translateY(-2px)}
.controls .tour{width:auto;border-radius:24px;padding:0 20px;font-size:14px;font-weight:600}
.controls .tour.on{background:var(--gold);color:#082036;border-color:var(--gold)}
/* „Azi" și „Termene" sunt legături (a.btn), nu <button>, deci nu prindeau fundalul de
   mai sus și rămâneau transparente: peste ocean se citeau, dar peste deșert, zăpadă sau
   un nor luminos dispăreau cu totul — două butoane invizibile pe cel mai folosit ecran.
   Primesc același fundal opac ca restul comenzilor, plus o umbră care le desprinde de
   orice imagine satelitară ar nimeri dedesubt. */
.controls a.btn{background:rgba(8,25,40,.85);backdrop-filter:blur(4px);
  border-color:rgba(255,209,102,.5);height:42px;
  box-shadow:0 2px 12px rgba(0,0,0,.55),0 0 0 1px rgba(3,10,18,.55)}
.controls a.btn:hover{background:rgba(10,32,54,.95);border-color:var(--gold);color:var(--gold)}
.totals{margin-left:auto;background:rgba(8,25,40,.85);max-width:100%;
  border:1px solid rgba(255,209,102,.3);border-radius:12px;padding:9px 16px;backdrop-filter:blur(4px)}
.totals .val small{display:block;margin-top:2px}
.totals .lbl{font-size:10.5px;letter-spacing:2px;color:var(--dim)}
.totals .val{font-size:16px;font-weight:700;color:var(--gold)}
.totals .val small{color:var(--ink);font-weight:400;font-size:11px}

#tip{position:absolute;z-index:30;pointer-events:none;background:rgba(6,18,30,.95);
  border:1px solid rgba(255,209,102,.5);border-radius:10px;padding:9px 13px;max-width:270px;
  font-size:12.5px;line-height:1.45;color:var(--ink);opacity:0;transform:translateY(6px);
  transition:opacity .15s,transform .15s;box-shadow:0 8px 30px rgba(0,0,0,.6)}
#tip.show{opacity:1;transform:translateY(0)}
#tip b{color:var(--gold);display:block;font-size:13px}

.mk{cursor:pointer;display:flex;align-items:center;gap:7px;filter:drop-shadow(0 2px 6px rgba(0,0,0,.9))}
.mk .dot{width:14px;height:14px;border-radius:50%;background:var(--gold);border:2.5px solid #081c2e;
  box-shadow:0 0 0 2px rgba(255,209,102,.45),0 0 14px rgba(255,209,102,.6);flex:none}
.mk.minor .dot{width:10px;height:10px;box-shadow:0 0 0 1.5px rgba(255,209,102,.35)}
.mk .lb{color:#fff;font-size:13px;font-weight:600;text-shadow:0 1px 4px #000,0 0 10px rgba(0,0,0,.9);white-space:nowrap}
.mk.minor .lb{font-size:11.5px;color:#dbe6ee;font-weight:400}
.mk:hover .dot{background:#ffe6a8}
.mk:hover .lb{color:var(--gold)}
body.lowzoom .mk.minor .lb{display:none}
body.lowzoom .fmk{width:22px;height:22px;font-size:11px}
.fmk{cursor:pointer;width:26px;height:26px;border-radius:50%;background:rgba(8,25,40,.88);
  border:1.5px solid rgba(255,138,92,.9);color:#ffb287;font-size:13px;display:flex;
  align-items:center;justify-content:center;filter:drop-shadow(0 2px 5px rgba(0,0,0,.8));
  transition:background-color .15s,border-color .15s,color .15s}
.fmk:hover{background:var(--gold);color:#082036;border-color:var(--gold)}
.amk{cursor:pointer;width:30px;height:30px;border-radius:50%;background:rgba(8,30,34,.9);
  border:1.5px solid rgba(127,216,201,.85);font-size:15px;display:flex;align-items:center;
  justify-content:center;filter:drop-shadow(0 2px 5px rgba(0,0,0,.85));
  transition:background-color .15s,border-color .15s,color .15s}
.amk:hover{background:var(--teal);border-color:var(--teal)}
.pln{width:0;height:0;pointer-events:none;position:relative}
.pln span{position:absolute;left:-8px;top:-11px;font-size:16px;color:#ffe6a8;
  text-shadow:0 0 8px rgba(255,209,102,.95),0 1px 3px #000;display:block}
.maplibregl-popup-content{background:#0a2333!important;color:var(--ink)!important;
  border:1px solid rgba(127,216,201,.5);border-radius:12px!important;padding:14px 16px!important;
  font-family:var(--sans)!important;font-size:12.8px;line-height:1.55;
  box-shadow:0 10px 34px rgba(0,0,0,.6)!important}
.maplibregl-popup-content b{color:var(--teal);display:block;font-size:13.5px;margin-bottom:3px}
.maplibregl-popup-tip{border-top-color:#0a2333!important;border-bottom-color:#0a2333!important}
.maplibregl-popup-close-button{color:var(--dim)!important;font-size:18px!important;padding:2px 8px!important}
.maplibregl-ctrl-attrib{background:rgba(8,25,40,.7)!important;color:#8ba0b1!important;font-size:10px!important}
.maplibregl-ctrl-attrib a{color:#9fb4c4!important}

.rail{width:var(--railw);flex:none;background:linear-gradient(165deg,var(--panel),var(--panel2) 70%);
  border-left:1px solid rgba(255,209,102,.22);display:flex;flex-direction:column;z-index:20}
.rail-head{padding:20px 24px 10px}
.rail-head .k{font-size:11px;letter-spacing:4px;color:var(--gold);font-weight:600}
.rail-head h2{font-family:var(--serif);font-size:20px;color:#f7f2e7;margin-top:5px}
.rail-list{flex:1;overflow-y:auto;padding:4px 16px 14px;scrollbar-width:thin;scrollbar-color:#1d4869 transparent}

/* Itinerariul nu mai pierde șina în fața avertismentelor.
   Panoul „De verificat" se deschide singur la fiecare intrare în vacanță, iar lista lui
   putea crește până la 600px. Într-o șină de 620px asta însemna 18 pixeli pentru carduri:
   omul își deschidea vacanța și primea un perete de avertismente în locul drumului, iar
   drumul se vedea doar dacă ghicea că trebuie să plieze panoul. Aici lista de avertismente
   primește un plafon legat de înălțimea ecranului și scrollul ei propriu (`.wlist` are deja
   overflow-y:auto când e deschisă), ca partea mare a șinei să rămână mereu itinerariul.
   Prima valoare e pentru browserele fără min(); a doua o înlocuiește oriunde min() există.
   Selectorul e cu o clasă mai lung decât cel din trips/show.blade.php pentru că regula de
   acolo vine DUPĂ acest fișier în pagină — la specificitate egală ar câștiga ea. */
.rail .warns.open .wlist{max-height:264px;max-height:min(30vh,264px)}
.card{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:14px;
  margin-bottom:10px;overflow:hidden;transition:border-color .25s,background .25s}
.card:hover{border-color:rgba(255,209,102,.45);background:rgba(255,255,255,.05)}
.card-h{display:flex;gap:13px;align-items:center;padding:13px 15px;cursor:pointer;user-select:none}
.card-h .ico{width:38px;height:38px;flex:none;border-radius:50%;background:#0e2c44;
  border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;font-size:16px}
.card.todo .card-h .ico{border-color:rgba(159,180,196,.45);filter:grayscale(.4)}
.card-h .tt{flex:1;min-width:0}
.card-h .when{font-size:11px;letter-spacing:1.6px;font-weight:700;color:var(--gold);text-transform:uppercase}
.card.todo .card-h .when{color:var(--dim)}
.card-h .name{font-size:15px;font-weight:600;color:#f2f6fa;margin-top:1px}
.card.todo .card-h .name{color:#8ba0b1}
.card-h .chev{color:var(--dim);font-size:12px;transition:transform .3s}
.card.open .card-h .chev{transform:rotate(180deg);color:var(--gold)}
.card-b{max-height:0;overflow:hidden;transition:max-height .45s cubic-bezier(.4,0,.2,1)}
.card.open .card-b{max-height:1500px} /* șederile cu mai multe camere au corp dublu */
.card-b-in{padding:2px 16px 15px 66px;font-size:12.8px;color:#b9c8d5;line-height:1.6}
.rail-foot{padding:12px 24px 14px;border-top:1px solid rgba(255,209,102,.2)}
.rail-foot .lbl{font-size:10.5px;letter-spacing:2px;color:var(--dim)}
.rail-foot .val{font-size:15px;font-weight:700;color:var(--gold);margin-top:2px}
.rail-foot .val small{color:var(--ink);font-weight:400;font-size:11px}

/* upload zone */
.dropzone{margin:10px 16px;border:2px dashed rgba(255,209,102,.4);border-radius:14px;
  padding:18px;text-align:center;color:var(--dim);font-size:13px;cursor:pointer;transition:all .2s}
.dropzone:hover,.dropzone.drag{border-color:var(--gold);color:var(--gold);background:rgba(255,209,102,.05)}
.docrow{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--dim);
  padding:4px 18px}
.docrow .st-extracted{color:var(--teal)} .docrow .st-failed{color:var(--coral)}
.docrow .st-pending,.docrow .st-parsed{color:var(--gold)}

#offline{position:absolute;inset:0;z-index:50;display:none;align-items:center;justify-content:center;
  background:rgba(4,10,18,.92);text-align:center;padding:30px}
#offline .in{max-width:430px;border:1px solid rgba(255,209,102,.4);border-radius:16px;padding:30px;background:var(--panel2)}

/* Panoul „datele n-au ajuns" (public/js/globe.js).
   Când cererea de date cădea, globul rămânea un dreptunghi negru fără o vorbă și fără
   buton. Panoul se construiește din JavaScript, dar înfățișarea lui stă aici — un fișier
   servit static n-are voie să care stiluri în cod. Se pune peste #offline, care are deja
   poziția și fundalul potrivite; `.globe-eroare` e doar plasa de siguranță pentru o
   pagină care n-are #offline. */
.globe-eroare{position:absolute;inset:0;z-index:50;display:none;align-items:center;justify-content:center;
  background:rgba(4,10,18,.92);text-align:center;padding:30px}
.globe-eroare .in{max-width:430px;border:1px solid rgba(255,209,102,.4);border-radius:16px;
  padding:30px;background:var(--panel2)}
#offline .in h3,.globe-eroare .in h3{font-family:var(--serif);font-size:19px;color:var(--gold);margin-bottom:10px}
#offline .in p,.globe-eroare .in p{color:var(--dim);font-size:13.5px;line-height:1.65;margin-bottom:10px}
#offline .in p.fac,.globe-eroare .in p.fac{color:#cfdae5}
#offline .in .btn,.globe-eroare .in .btn{margin-top:8px}

/* Banda 981-1200px: trei coloane nu încap.
   Meniul lateral (262px) + șina de rezervări (432px) lăsau hărții 287px la 981px —
   o fâșie în care titlul dădea pe dinafară și numele locului se tăia. Sub 1200px
   meniul trece pe glisant (se deschide din butonul cu trei linii) și harta primește
   înapoi lățimea lui. Regula e legată de pagina globului, ca să nu strice ecranele
   obișnuite, unde meniul lateral la 1000px e perfect confortabil. */
@media (min-width:981px) and (max-width:1200px){
  .trip-body .sidebar{position:fixed;left:0;top:0;bottom:0;transform:translateX(-100%);
    transition:transform .28s cubic-bezier(.4,0,.2,1);box-shadow:22px 0 60px rgba(0,0,0,.6);
    width:280px;z-index:50}
  .trip-body .sidebar.open{transform:translateX(0)}
  .trip-body .sb-backdrop.show{display:block}
  .trip-body .globe-burger{display:flex}
  .rail{width:min(var(--railw),38vw)}
}

@media (max-width:980px){
  .hero-in{grid-template-columns:1fr}
  .hero-art{max-width:340px;margin:0 auto}
  .steps{grid-template-columns:1fr}
  .trip-body{flex-direction:column}
  .stage{height:52vh;flex:none}
  .rail{width:100%;flex:1;border-left:none;border-top:1px solid rgba(255,209,102,.22)}
  .hero h1{font-size:22px}
  .totals{display:none}
}

/* Telefoanele înguste (sub ~470px): pagina de prezentare nu mai iese din ecran.
   Bara de sus era un singur rând care nu se rupea niciodată — siglă + comutator de limbă
   + două butoane. Sub 470px nu mai încăpeau, iar pagina se lăța: la 375px lățimea reală a
   documentului ajungea la 469px, deci se plimba lateral cu 94px, iar „Creează cont gratuit"
   începea la 382px, adică 92% în afara ecranului. Îl lovea fiecare vizitator nou venit de pe
   telefon, exact butonul pentru care există pagina.
   `.spacer` (flex:1) e cel care ținea totul pe un rând, deci pe lățimile astea dispare, iar
   rândul are voie să se rupă. */
@media (max-width:470px){
  .topbar{flex-wrap:wrap;gap:10px;padding:11px 14px}
  .topbar .spacer{display:none}
  .brand{font-size:19px}
  .topbar .lang-switch{margin-left:auto}
  /* Butoanele împart rândul al doilea în părți egale, în loc să iasă din ecran. */
  .topbar a.btn,.topbar button.btn{flex:1 1 auto;min-width:0;justify-content:center;
    padding:8px 12px;font-size:13px;text-align:center}
  .hero-landing{min-height:0}
  .hero-in{padding:34px 16px;gap:26px}
  .hero-copy h1{font-size:33px}
  .hero-copy p{font-size:15px}
  /* Un buton pe rând: la lățimea asta, două alăturate ies din ecran oricum. */
  .hero-cta{gap:10px}
  .hero-cta .btn{flex:1 1 100%;justify-content:center}
  .steps{padding:44px 16px;gap:16px}
  .step{padding:20px}
  .foot{padding:22px 14px}
}

/* randuri structurate in cardurile de cronologie (v0.3) */
.card-b-in .brows{margin-top:10px;border-top:1px dashed rgba(255,255,255,.12);padding-top:8px}
.card-b-in .brow{display:flex;gap:10px;padding:3.5px 0;font-size:12.4px;line-height:1.45}
.card-b-in .brow .bk{flex:0 0 92px;color:var(--dim);font-size:11px;letter-spacing:.8px;
  text-transform:uppercase;padding-top:1px}
.card-b-in .brow .bv{flex:1;color:#cfdae5}
.card-b-in .brow .bv b{color:var(--ink)}
.card-b-in .brow .bv .money{color:var(--gold);font-weight:700}
.card-b-in .brow .bv small{color:var(--dim)}

/* obiective (v0.4): markere scalate + chips in rail */
.amk.sm{width:20px;height:20px;font-size:10px;border-width:1px}
.poichips{display:flex;flex-wrap:wrap;gap:7px}
.poichip{background:rgba(127,216,201,.08);border:1px solid rgba(127,216,201,.4);border-radius:16px;
  padding:5px 11px;font-size:12px;color:#bfe9e1;cursor:pointer;transition:all .15s;line-height:1.3}
.poichip:hover{background:var(--teal);color:#082036;border-color:var(--teal)}
.poicard .card-h .ico{border-color:var(--teal)}
.poicard .card-h .when{color:var(--teal)}
.card-b-in.poi-in{padding-left:16px}

/* v0.5: markere cu fotografii reale + popup cu imagine + distante */
.mk .pic{width:36px;height:36px;border-radius:50%;background-size:cover;background-position:center;
  border:2.5px solid var(--gold);box-shadow:0 0 0 2px rgba(255,209,102,.35),0 3px 10px rgba(0,0,0,.65);flex:none}
.mk.minor .pic{width:28px;height:28px;border-width:2px}
.mk .pic{transition:border-color .15s,transform .15s}
.mk.photo:hover .pic{border-color:#ffe6a8;transform:scale(1.06)}
.amk.photo{width:42px;height:42px;padding:0;background:none;border:none;position:relative;overflow:visible}
.amk.photo .pic{display:block;width:42px;height:42px;border-radius:50%;background-size:cover;background-position:center;
  border:2px solid var(--teal);box-shadow:0 3px 10px rgba(0,0,0,.7)}
.amk.photo .em{position:absolute;right:-5px;bottom:-5px;font-size:12px;background:rgba(8,30,34,.95);
  border:1px solid rgba(127,216,201,.6);border-radius:50%;width:20px;height:20px;
  display:flex;align-items:center;justify-content:center}
.amk.photo .pic{transition:border-color .15s,transform .15s}
.amk.photo:hover .pic{border-color:#bfe9e1;transform:scale(1.08)}
.amk.photo.sm{width:26px;height:26px}
.amk.photo.sm .pic{width:26px;height:26px;border-width:1.5px}
.amk.photo.sm .em{display:none}
.maplibregl-popup-content .poimg{width:calc(100% + 32px);margin:-14px -16px 10px;height:140px;
  object-fit:cover;border-radius:11px 11px 0 0;display:block}
.maplibregl-popup-content .dist{color:var(--teal);font-size:12px;margin:2px 0 7px;font-weight:600;line-height:1.5}

/* balon-cluster de obiective la zoom mic */
.clu{cursor:pointer;background:rgba(8,30,34,.92);border:1.5px solid var(--teal);color:#bfe9e1;
  border-radius:16px;padding:5px 12px;font-size:12px;font-weight:600;white-space:nowrap;
  font-family:'Segoe UI',system-ui,sans-serif;filter:drop-shadow(0 2px 6px rgba(0,0,0,.8));
  transition:background-color .15s,color .15s}
.clu:hover{background:var(--teal);color:#082036}

/* v0.6: fotografia hotelului ca icon al cardului de ședere */
.card-h .ico .cpic{display:block;width:100%;height:100%;border-radius:50%;
  background-size:cover;background-position:center}