/* ===========================
   UB HOME (estilo Uber-ish)
   - No pisa todo Bootstrap, sólo clases ub-*
   =========================== */

.ub-home{
  --ub-bg:#0b0c10;
  --ub-bg2:#10121a;
  --ub-card:#121521;
  --ub-soft:#f5f6f8;
  --ub-text:#0f1220;
  --ub-muted:#6b7280;
  --ub-white:#ffffff;
  --ub-border:rgba(255,255,255,.10);
  --ub-border2:rgba(0,0,0,.08);
  --ub-shadow:0 16px 40px rgba(0,0,0,.22);
  --ub-shadow2:0 10px 30px rgba(0,0,0,.12);
  --ub-radius:18px;
  --ub-radius2:24px;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
}

.ub-hero{
  position: relative;
  min-height: 78vh;
  display:flex;
  align-items:center;
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center;
  overflow:hidden;
}

.ub-hero__overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(1200px 700px at 50% 25%, rgba(0,0,0,.45), rgba(0,0,0,.85)),
    linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.90));
}

.ub-hero__grid{
  position:absolute; inset:-2px;
  opacity:.22;
  background-image:
    linear-gradient(to right, rgba(255,255,255,.08) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(closest-side at 50% 35%, rgba(0,0,0,1), rgba(0,0,0,0));
}

.ub-hero__container{ position:relative; z-index:2; }
.ub-hero__inner{ padding: 64px 0 38px; }

.ub-hero__title{
  color: var(--ub-white);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height:1.05;
  font-size: clamp(34px, 4vw, 56px);
  margin: 0 auto 22px;
  max-width: 980px;
  text-shadow: 0 12px 24px rgba(0,0,0,.35);
}

/* Cards */
.ub-hero__actions{
  display:flex;
  gap:16px;
  justify-content:center;
  flex-wrap:wrap;
  margin: 22px 0 26px;
}

.ub-card{
  width: min(420px, 92vw);
  display:flex;
  align-items:center;
  gap:14px;
  padding:18px 18px;
  border-radius: var(--ub-radius2);
  text-decoration:none !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
  box-shadow: 0 18px 40px rgba(0,0,0,.25);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);
}

.ub-card--primary{
  background: rgba(255,255,255,.10);
}
.ub-card--secondary{
  background: rgba(255,255,255,.07);
}

.ub-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 26px 60px rgba(0,0,0,.32);
  border-color: rgba(255,255,255,.18);
}

.ub-card__icon{
  width: 46px; height:46px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: #ffffff9e;
  flex:0 0 auto;
}
.ub-card__icon img{ width:28px; height:auto; }

.ub-card__content{ flex:1 1 auto; text-align:left; }
.ub-card__title{
  color: var(--ub-white);
  font-weight: 800;
  font-size: 18px;
  letter-spacing: -.01em;
  margin:0 0 2px;
}
.ub-card__hint{
  color: rgba(255,255,255,.78);
  font-size: 13px;
  margin:0;
}

.ub-card__arrow{
  width:42px; height:42px;
  border-radius: 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(0,0,0,.35);
  color: var(--ub-white);
  flex: 0 0 auto;
}

/* Search */
.ub-search{
  width:min(880px, 94vw);
  margin: 0 auto 14px;
  text-align:left;
}
.ub-search__label{
  color: rgba(255,255,255,.82);
  font-weight: 700;
  font-size: 13px;
  letter-spacing:.02em;
  margin: 0 0 8px;
}

.ub-search__wrap{
  position:relative;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 18px;
  display:flex;
  align-items:center;
  gap:10px;
  padding: 10px 10px 10px 42px;
  backdrop-filter: blur(10px);
  box-shadow: 0 16px 44px rgba(0,0,0,.25);
}

.ub-search__pin{
  position:absolute;
  left:14px;
  color: rgba(255,255,255,.80);
  font-size: 18px;
}

.ub-search__input{
  flex:1 1 auto;
  height: 46px;
  border:0;
  outline:0;
  background: transparent;
  color: var(--ub-white);
  font-size: 16px;
}
.ub-search__input::placeholder{ color: rgba(255,255,255,.70); }

.ub-search__btn{
  height: 46px;
  border:0;
  border-radius: 14px;
  padding: 0 16px;
  font-weight: 800;
  background: #ffffff;
  color: #0b0c10;
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.ub-search__btn i{ margin-left:8px; }
.ub-search__btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 16px 32px rgba(0,0,0,.25);
}

/* Chips */
.ub-chips{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top: 12px;
}

.ub-chip{
  display:inline-flex;
  gap:8px;
  align-items:center;
  padding: 8px 12px;
  border-radius: 999px;
  font-weight: 700;
  font-size: 12px;
  color: rgba(255,255,255,.86);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255,255,255,.12);
}

/* Sections */
.ub-section{
  padding: 72px 0;
}
.ub-section--light{ background: #ffffff; }
.ub-section--soft{ background: var(--ub-soft); }

.ub-split{
  display:flex;
  align-items:center;
}
.ub-split--reverse{
  flex-direction: row-reverse;
}

.ub-media-card{
  border-radius: 24px;
  background: #fff;
  border: 1px solid var(--ub-border2);
  box-shadow: var(--ub-shadow2);
  padding: 18px;
}
.ub-media-card img{
  width:100%;
  border-radius: 18px;
}

/* Text */
.ub-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 999px;
  background: rgba(15,18,32,.06);
  border: 1px solid rgba(15,18,32,.08);
  margin-bottom: 14px;
}
.ub-kicker img{ width:18px; height:auto; }
.ub-kicker span{
  font-weight: 900;
  font-size: 12px;
  letter-spacing:.04em;
  text-transform: uppercase;
  color: rgba(15,18,32,.80);
}

.ub-h2{
  margin: 0 0 12px;
  font-size: clamp(24px, 2.2vw, 34px);
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--ub-text);
  line-height: 1.12;
}

.ub-p{
  margin: 0 0 18px;
  color: var(--ub-muted);
  font-size: 16px;
  line-height: 1.7;
  max-width: 560px;
}

.ub-cta{ margin-top: 10px; }

/* Buttons */
.ub-btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  height: 48px;
  padding: 0 16px;
  border-radius: 14px;
  font-weight: 900;
  text-decoration:none !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}

.ub-btn--dark{
  background: #0b0c10;
  color: #fff;
  box-shadow: 0 16px 30px rgba(0,0,0,.18);
}
.ub-btn--dark:hover{ transform: translateY(-2px); box-shadow: 0 22px 40px rgba(0,0,0,.22); color:#fff; }

.ub-btn--light{
  background: #fff;
  color: #0b0c10;
  border: 1px solid rgba(15,18,32,.12);
  box-shadow: 0 12px 24px rgba(0,0,0,.08);
}
.ub-btn--light:hover{ transform: translateY(-2px); box-shadow: 0 18px 34px rgba(0,0,0,.12); color:#0b0c10; }

.ub-btn--white{
  background:#fff;
  color:#0b0c10;
}
.ub-btn--white:hover{ transform: translateY(-2px); box-shadow: 0 20px 44px rgba(0,0,0,.28); color:#0b0c10; }

.ub-btn--outline{
  background: transparent;
  color: #0b0c10;
  border: 2px solid rgba(15,18,32,.14);
}
.ub-btn--outline:hover{
  transform: translateY(-2px);
  border-color: rgba(15,18,32,.28);
  box-shadow: 0 18px 34px rgba(0,0,0,.10);
  color:#0b0c10;
}

/* Internal banners */
.ub-banner{
  position:relative;
  padding: 86px 0;
  background-size:cover;
  background-position:center;
  overflow:hidden;
}
.ub-banner__overlay{
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.35));
}
.ub-banner .container{ position:relative; z-index:2; }

.ub-banner__box{
  border-radius: 26px;
  padding: 26px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(10px);
  box-shadow: 0 24px 60px rgba(0,0,0,.30);
}

.ub-kicker--on-dark{
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
}
.ub-kicker--on-dark span{ color: rgba(255,255,255,.86); }

.ub-h2--on-dark{ color: #fff; }
.ub-p--on-dark{ color: rgba(255,255,255,.82); max-width: 640px; }

/* Final CTA */
.ub-final{
  padding: 70px 0 86px;
  background: #ffffff;
}
.ub-final__card{
  border-radius: 26px;
  padding: 26px;
  border: 1px solid rgba(15,18,32,.10);
  box-shadow: 0 20px 50px rgba(0,0,0,.10);
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:14px;
}
.ub-final__title{
  font-weight: 950;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: var(--ub-text);
  max-width: 720px;
}
.ub-final__actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* Responsive fixes */
@media (max-width: 991px){
  .ub-split, .ub-split--reverse{ flex-direction: column; }
  .ub-p{ max-width: 100%; }
  .ub-banner__overlay{ background: linear-gradient(180deg, rgba(0,0,0,.82), rgba(0,0,0,.45)); }
}

@media (max-width: 520px){
  .ub-search__wrap{ padding-left: 38px; }
  .ub-search__btn{ width: 100%; }
  .ub-search__wrap{ flex-wrap: wrap; }
  .ub-search__input{ width: 100%; }
}

/* Extra punch para conductor */
.ub-home .ub-hero__title span{ opacity:.95; }
.ub-home .ub-banner{ background-attachment: fixed; }
@media (max-width: 991px){
  .ub-home .ub-banner{ background-attachment: scroll; }
}

/* ====== Form card (cliente) ====== */
.ub-form-card{
  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(15,18,32,.10);
  box-shadow: 0 18px 50px rgba(0,0,0,.10);
  padding: 18px;
}

.ub-field{ margin-bottom: 14px; }
.ub-label{
  display:block;
  font-size: 12px;
  font-weight: 900;
  letter-spacing:.03em;
  text-transform: uppercase;
  color: rgba(15,18,32,.70);
  margin: 0 0 6px;
}

.ub-input, .ub-select{
  width:100%;
  height: 48px;
  border-radius: 14px;
  border: 1px solid rgba(15,18,32,.14);
  padding: 0 14px;
  outline: none;
  background: #fff;
  font-size: 15px;
}

.ub-input:focus, .ub-select:focus{
  border-color: rgba(15,18,32,.28);
  box-shadow: 0 0 0 4px rgba(15,18,32,.06);
}

.ub-btn--full{
  width:100%;
  justify-content:center;
}

.ub-result{
  margin-top: 10px;
  border-radius: 14px;
  padding: 12px 14px;
  font-weight: 900;
  background: rgba(15,18,32,.06);
  border: 1px solid rgba(15,18,32,.10);
  color: rgba(15,18,32,.86);
}

/* ====== Map card ====== */
.ub-map-card{
  border-radius: 24px;
  background: #fff;
  border: 1px solid rgba(15,18,32,.10);
  box-shadow: 0 18px 50px rgba(0,0,0,.10);
  overflow:hidden;
}

.ub-map-head{
  padding: 16px 18px;
  border-bottom: 1px solid rgba(15,18,32,.08);
}

.ub-map-title{
  font-weight: 950;
  letter-spacing: -.01em;
  color: rgba(15,18,32,.92);
}

.ub-map-sub{
  font-size: 13px;
  font-weight: 700;
  color: rgba(15,18,32,.55);
  margin-top: 4px;
}

.ub-map-wrap{
  padding: 12px;
}

.ub-map-wrap #map{
  border-radius: 18px;
  overflow:hidden;
}

/* ====== Mini search (footer city) ====== */
.ub-mini-search{
  display:flex;
  gap:10px;
  align-items:center;
}

.ub-mini-input{
  flex: 1 1 auto;
  height: 48px;
  border-radius: 14px;
  border: 1px solid rgba(15,18,32,.14);
  padding: 0 14px;
  outline: none;
  background:#fff;
  font-size: 15px;
}

.ub-mini-input:focus{
  border-color: rgba(15,18,32,.28);
  box-shadow: 0 0 0 4px rgba(15,18,32,.06);
}

.ub-mini-btn{
  height: 48px;
  width: 54px;
  border: 0;
  border-radius: 14px;
  font-weight: 900;
  background: #0b0c10;
  color: #fff;
  display:flex;
  align-items:center;
  justify-content:center;
  transition: transform .18s ease, box-shadow .18s ease;
}
.ub-mini-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 18px 34px rgba(0,0,0,.18);
}