/* =========================================================
   R2R Guided Journey V5 — corrected compact banners
   Loaded as a separate stylesheet so Hostinger applies it
   after the older inline journey CSS.
   ========================================================= */

/* Shared journey balance */
#start-r2r .journey-layout{
  grid-template-columns:minmax(0,.9fr) minmax(560px,1.25fr) !important;
  gap:34px !important;
}
#start-r2r .journey-copy-panel h2{
  font-weight:540 !important;
  letter-spacing:-.025em !important;
}

/* Main CTA + returning-user link */
#start-r2r .journey-action-group{
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:12px 16px !important;
  margin-bottom:20px !important;
}
#start-r2r .journey-fullscreen{
  margin:0 !important;
}
#start-r2r .journey-existing{
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  flex-wrap:wrap !important;
  gap:6px !important;
  font-size:13.5px !important;
}
#start-r2r .journey-existing a{
  font-weight:700 !important;
  text-decoration:none !important;
  border-bottom:1px solid currentColor;
}

/* Benefit cards: keep icon strokes clean and prevent black-filled SVGs */
#start-r2r .journey-benefits{
  gap:12px !important;
}
#start-r2r .journey-benefit{
  min-height:138px !important;
  padding:14px !important;
}
#start-r2r .journey-benefit-icon{
  width:46px !important;
  height:46px !important;
  flex:0 0 46px !important;
}
#start-r2r .journey-benefit-icon svg{
  width:24px !important;
  height:24px !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.9 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}
#start-r2r .journey-benefit strong{
  font-weight:620 !important;
}

/* Assistant card */
#start-r2r .journey-chat-card{
  border-radius:22px !important;
  overflow:hidden !important;
}

/* Compact branded banner for all three product areas */
#start-r2r .journey-chat-header{
  position:relative !important;
  min-height:76px !important;
  padding:10px 14px !important;
  gap:14px !important;
  overflow:hidden !important;
}
#start-r2r.journey-social .journey-chat-header{
  background:linear-gradient(110deg,#0e8ca5 0%,#116f91 60%,#155777 100%) !important;
}
#start-r2r.journey-private .journey-chat-header{
  background:linear-gradient(110deg,#8059c8 0%,#6c45b8 60%,#55319d 100%) !important;
}
#start-r2r.journey-landlord .journey-chat-header{
  background:linear-gradient(110deg,#6f893f 0%,#587534 60%,#405c29 100%) !important;
}

#start-r2r .journey-chat-brand{
  display:flex !important;
  align-items:center !important;
  flex:1 1 auto !important;
  min-width:0 !important;
}
#start-r2r .journey-logo-plate{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  width:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:none !important;
  padding:5px 8px !important;
  border-radius:11px !important;
  background:rgba(255,255,255,.96) !important;
  box-shadow:0 2px 10px rgba(0,0,0,.09) !important;
  border:1px solid rgba(255,255,255,.7) !important;
}
#start-r2r .journey-chat-logo{
  display:block !important;
  width:auto !important;
  height:40px !important;
  max-width:220px !important;
  object-fit:contain !important;
  object-position:left center !important;
  margin:0 !important;
}

/* Product-specific logo tuning */
#start-r2r.journey-social .journey-chat-logo{
  height:40px !important;
  max-width:218px !important;
}
#start-r2r.journey-private .journey-chat-logo{
  height:38px !important;
  max-width:205px !important;
}
#start-r2r.journey-landlord .journey-chat-logo{
  height:36px !important;
  max-width:190px !important;
}

/* Keep landlord banner intentionally the most compact */
#start-r2r.journey-landlord .journey-chat-header{
  min-height:70px !important;
}
#start-r2r.journey-landlord .journey-logo-plate{
  padding:4px 7px !important;
  border-radius:10px !important;
}

/* Guided support pill */
#start-r2r .journey-live{
  position:relative !important;
  z-index:2 !important;
  margin-left:auto !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
  padding:7px 10px !important;
  font-size:11px !important;
  font-weight:650 !important;
  color:#fff !important;
  background:rgba(255,255,255,.14) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:none !important;
}

/* About strip: fix the stray "i" and keep it visually attached to the assistant */
#start-r2r .journey-chat-intro{
  display:grid !important;
  grid-template-columns:32px minmax(0,1fr) !important;
  gap:10px !important;
  align-items:start !important;
  padding:11px 14px 12px !important;
  background:#fff !important;
  border-bottom:1px solid rgba(16,54,95,.08) !important;
}
#start-r2r .journey-chat-intro-icon{
  width:30px !important;
  height:30px !important;
  border-radius:9px !important;
  display:grid !important;
  place-items:center !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:800 !important;
}
#start-r2r.journey-social .journey-chat-intro-icon{
  background:#e1f5f8 !important;
  color:#0d7893 !important;
}
#start-r2r.journey-private .journey-chat-intro-icon{
  background:#f0e9fb !important;
  color:#7048bd !important;
}
#start-r2r.journey-landlord .journey-chat-intro-icon{
  background:#eaf1df !important;
  color:#557431 !important;
}
#start-r2r .journey-chat-intro strong{
  display:block !important;
  margin:0 0 2px !important;
  font-size:13.5px !important;
  line-height:1.3 !important;
  font-weight:650 !important;
  color:#143d67 !important;
}
#start-r2r.journey-landlord .journey-chat-intro strong{
  color:#315437 !important;
}
#start-r2r .journey-chat-intro p{
  margin:0 !important;
  font-size:12.8px !important;
  line-height:1.42 !important;
  color:#60758a !important;
}

/* Slightly reduce embed height on desktop */
#start-r2r .r2r-typebot-frame{
  height:530px !important;
}

@media(max-width:1080px){
  #start-r2r .journey-layout{
    grid-template-columns:1fr !important;
  }
}
@media(max-width:680px){
  #start-r2r .journey-chat-header{
    min-height:64px !important;
    padding:8px 10px !important;
  }
  #start-r2r .journey-chat-logo,
  #start-r2r.journey-social .journey-chat-logo,
  #start-r2r.journey-private .journey-chat-logo,
  #start-r2r.journey-landlord .journey-chat-logo{
    height:32px !important;
    max-width:165px !important;
  }
  #start-r2r .journey-live{
    padding:6px 8px !important;
    font-size:10.5px !important;
  }
}