/* Pagina /gazduire-web/.
   Două lucruri: banda albă de sus, unde a urcat titlul paginii, și lista cu
   bifă din secțiunea „Găzduire Web Shared".
   Scris de scripts/gazduire.py. */

/* --- banda de sus ----------------------------------------------------- */
/* Titlul și paragraful erau albe, fiindcă stăteau pe violet. Acum deschid
   pagina, pe alb, deci titlul își ia degradeul site-ului de la futurist.css,
   iar paragraful culoarea obișnuită a textului. */
/* Ritmul dintre benzi îl ține futurist.css: 56px sus și 56px jos pentru
   fiecare bandă, adică 112px de gol între ele. Banda asta e nouă și avea
   spațiile ei, deci ieșea din rând. Acum le ia pe ale site-ului. */
.rdn-gw-sus{
  --awb-padding-top: 56px !important;
  --awb-padding-bottom: 56px !important;
  padding-top: 56px;
  padding-bottom: 56px;
}

/* Banda cu logourile de parteneri e, pe toate celelalte pagini, prima de
   sus, iar acolo stă strânsă: 22px sus, 18px jos. Aici a coborât la
   mijlocul paginii, între două benzi de conținut, deci trebuie să respire
   la fel ca vecinele ei. */
.rdn-parteneri.rdn-parteneri--mijloc{
  --awb-padding-top: 56px !important;
  --awb-padding-bottom: 56px !important;
  padding-top: 56px !important;
  padding-bottom: 56px !important;
}

.rdn-gw-sus .fusion-title{
  margin-bottom: 0;
}

/* Coloana trebuie să se poată strânge. Fără asta, pe telefon titlul se
   întindea la lățimea lui firească — 590px pe un ecran de 390 — și ieșea
   din pagină. „min-width:auto" e valoarea implicită a unui element flex și
   nu-l lasă să scadă sub conținut. */
.rdn-gw-sus .fusion-layout-column,
.rdn-gw-sus .fusion-column-wrapper,
.rdn-gw-sus .fusion-title{
  min-width: 0;
  max-width: 100%;
}

/* Lățimea și centrarea le ține cutia, nu paragraful: tema pune „margin:0"
   pe orice <p> din .fusion-text, cu mai multă greutate decât regula noastră,
   așa că un „margin:0 auto" acolo n-ar avea niciun efect. */
.rdn-gw-sus .fusion-text{
  display: block;
  max-width: 74ch;
  margin: 0 auto;
  text-align: center;
}

.rdn-gw-intro{
  font-size: 16px;
  line-height: 1.75;
  color: #55607a;
}

@media (max-width: 800px){
  .rdn-gw-intro{font-size: 15px}
}

/* --- numele pachetului, sub titlul tabelului -------------------------- */
/* Toate cele șase tabele scriau doar „Găzduire Shared". Titlul rămâne, iar
   dedesubt vine numele pachetului: Economy, Entry, Premium, Business,
   Corporate, Stellar. */
.rdn-pachet-nume{
  margin: 6px 0 0;
  font-family: 'Open Sans', Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2.6px;
  text-transform: uppercase;
  color: var(--rdn-cyan, #74c5da);
}

/* pe fundal deschis turcoazul e prea palid; îl întoarcem spre violet */
/* Numele stă acum înăuntrul titlului, ca <span> (vezi numele_in_titlu din
   scripts/gazduire.py): așa fiecare din cele șase titluri spune altceva.
   Ca <p>, marginea și înălțimea rândului i le dădeau regulile paragrafului
   („.post-content p"). Unui <span> nu i le mai dă nimeni, iar înălțimea
   rândului ar moșteni-o de la titlu — 54px în loc de 30. Le scriem aici,
   aceleași cifre, ca să arate neschimbat. */
.panel-heading .rdn-pachet-nume{
  color: #8b63e8;
  display: block;
  margin: 0 0 20px;
  line-height: 30px;
}

/* --- contoarele ------------------------------------------------------- */
/* Erau trei, identice. Au rămas două. Grila din sectiuni-flux.css taie rândul
   în trei coloane, așa că două cutii ar fi lăsat un gol în dreapta. */
.fusion-counters-box.fusion-columns-2{
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 800px){
  .fusion-counters-box.fusion-columns-2{grid-template-columns: 1fr}
}

/* Pe telefon, pasul de 56px al benzilor de aici iese prea mare, la fel ca
   peste tot; futurist.css le strânge la 36px, dar benzile astea două își
   scriu singure spațiul, deci trebuie strânse și ele. */
@media (max-width: 800px){
  .rdn-gw-sus{
    --awb-padding-top: 36px !important;
    --awb-padding-bottom: 36px !important;
    padding-top: 36px;
    padding-bottom: 36px;
  }
  .rdn-parteneri.rdn-parteneri--mijloc{
    --awb-padding-top: 36px !important;
    --awb-padding-bottom: 36px !important;
    padding-top: 36px !important;
    padding-bottom: 36px !important;
  }
}