
/* Vynoriz homepage layout isolation — V2.9.9c */
.vx-home-help-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:16px;
  width:100%;
  margin-top:26px;
}
.vx-home-help-card{
  box-sizing:border-box;
  min-width:0;
  min-height:210px;
  display:flex;
  flex-direction:column;
  text-decoration:none;
  border:1px solid #e6e8ef;
  border-radius:18px;
  padding:22px;
  background:#fff;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
.vx-home-help-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(15,23,42,.08)}
.vx-home-help-icon{width:48px;height:48px;display:grid;place-items:center;border-radius:14px;background:#f1edff;font-size:24px}
.vx-home-help-card strong{display:block;margin-top:22px;font-size:18px;line-height:1.25;color:#101828}
.vx-home-help-card p{margin:8px 0 0;font-size:13px;line-height:1.55;color:#667085}
.vx-home-help-link{display:block;margin-top:auto;padding-top:18px;font-size:12px;font-weight:800;color:#6d28d9}

/* Homepage hero: explicit desktop + mobile layout, independent of legacy .hero media rules. */
.vx-home-hero{
  box-sizing:border-box;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);
  gap:42px;
  align-items:center;
  max-width:1180px;
  margin:28px auto 0;
  padding:64px 56px;
  border-radius:28px;
  background:linear-gradient(135deg,#172554 0%,#312e81 52%,#4c1d95 100%);
  overflow:hidden;
}
.vx-home-hero .hero-copy{min-width:0}
.vx-home-hero .eyebrow,.vx-home-hero h1,.vx-home-hero h1 span,.vx-home-hero .hero-copy>p,.vx-home-hero .trust-row{color:#fff}
.vx-home-hero .hero-copy>p{opacity:.9}
.vx-home-hero .hero-card{min-width:0;background:#fff;color:#101828}

@media (max-width:1100px){
  .vx-home-help-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vx-home-hero{margin-left:20px;margin-right:20px;padding:48px 36px;gap:28px}
}
@media (max-width:760px){
  .vx-home-hero{
    display:block;
    width:auto;
    margin:0;
    padding:38px 18px 28px;
    border-radius:0 0 26px 26px;
    overflow:hidden;
  }
  .vx-home-hero .hero-copy{width:100%;max-width:none}
  .vx-home-hero h1{font-size:clamp(34px,10vw,48px);line-height:1.03;overflow-wrap:anywhere}
  .vx-home-hero .hero-copy>p{font-size:15px;line-height:1.6}
  .vx-home-hero .hero-card{width:100%;max-width:100%;box-sizing:border-box;margin-top:28px}
  .vx-home-hero .hero-search{width:100%;box-sizing:border-box}
  .vx-home-hero .hero-search input{min-width:0;width:100%}
  .vx-home-help-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .vx-home-help-card{min-height:190px;padding:18px}
}
@media (max-width:480px){
  .vx-home-help-grid{grid-template-columns:1fr}
  .vx-home-help-card{min-height:0}
  .vx-home-hero .trust-row{display:flex;flex-wrap:wrap;gap:8px}
  .vx-home-hero .hero-search{display:grid;grid-template-columns:auto minmax(0,1fr)}
  .vx-home-hero .hero-search button{grid-column:1/-1;width:100%;margin-top:8px}
}

/* V2.9.9d — hero visual refinement */

/* Desktop: restore the softer, well-seated banner proportions. */
@media (min-width:1101px){
  .vx-home-hero{
    max-width:1180px;
    margin:28px auto 0;
    padding:56px 56px 54px;
    border-radius:30px;
    min-height:0;
  }
}

/* The talent/search panel needs strong contrast. Legacy homepage rules were
   fading its text; explicitly restore readable product UI colors here. */
.vx-home-hero .hero-card{
  background:#fff !important;
  color:#101828 !important;
  opacity:1 !important;
}
.vx-home-hero .hero-card-title strong{
  color:#101828 !important;
  opacity:1 !important;
}
.vx-home-hero .hero-card-title small{
  color:#667085 !important;
  opacity:1 !important;
}
.vx-home-hero .live-dot{
  color:#087a55 !important;
  background:#ecfdf3 !important;
  border:1px solid #a6f4c5 !important;
  opacity:1 !important;
  padding:5px 8px;
  border-radius:999px;
  font-weight:800;
}
.vx-home-hero .hero-search{
  background:#f8fafc !important;
  border:1px solid #dfe3eb !important;
  box-shadow:0 10px 28px rgba(15,23,42,.10) !important;
}
.vx-home-hero .hero-search span{
  color:#475467 !important;
  opacity:1 !important;
}
.vx-home-hero .hero-search input{
  color:#101828 !important;
  background:transparent !important;
  opacity:1 !important;
}
.vx-home-hero .hero-search input::placeholder{
  color:#667085 !important;
  opacity:1 !important;
}
.vx-home-hero .hero-chips span{
  color:#6941c6 !important;
  background:#f4f0ff !important;
  border:1px solid #e4dcff !important;
  opacity:1 !important;
}
.vx-home-hero .mini-request{
  color:#101828 !important;
  opacity:1 !important;
  border-color:#eef0f4 !important;
}
.vx-home-hero .mini-request:hover{background:#f8fafc !important}
.vx-home-hero .mini-copy b{
  color:#101828 !important;
  opacity:1 !important;
}
.vx-home-hero .mini-copy small{
  color:#667085 !important;
  opacity:1 !important;
}
.vx-home-hero .mini-meta{
  color:#6941c6 !important;
  opacity:1 !important;
}
.vx-home-hero .mini-request .arrow{
  color:#7c3aed !important;
  opacity:1 !important;
}
.vx-home-hero .hero-card-link{
  color:#6941c6 !important;
  opacity:1 !important;
  font-weight:800 !important;
}

/* Keep mobile correction intact without forcing desktop geometry onto it. */
@media (max-width:760px){
  .vx-home-hero{
    margin:0;
    border-radius:0 0 26px 26px;
    padding:38px 18px 28px;
  }
  .vx-home-hero .hero-card{
    border-radius:20px;
    padding:18px;
  }
}
