/* ============================================================
   RubiX refinements (loaded after rubixs.webflow.css)
   ============================================================ */

/* ── Remove outermost blue page-border frame ───────────────── */
.website-border { display: none !important; }

/* ── Header (01/02/03): curved image cards, no blue border ──── */
.hero-card {
  border-left: none;
  border-right: none;
  border-radius: 18px;
  overflow: hidden;
}

/* ── Problem section: subtle curvy Indian paisley motif on the
   white inner panel; rounded panel; borderless tiles.
   (decorative motif images keep their original absolute spots) ── */
.problem_component {
  position: relative;
  border-radius: 24px;
}
.problem_component::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 24px;
  background-image: url('../images/paisley.svg');
  background-repeat: repeat;
  background-size: 150px 150px;
  opacity: .06;
  pointer-events: none;
  z-index: 0;
}
.problem_component > .main_content-wrap,
.problem_component > .problem_content-wrap {
  position: relative;
  z-index: 1;
}
.problem_component > .bharatnatya,
.problem_component > .peacock,
.problem_component > .car {
  z-index: 2;
}
.problem_card {
  border: none;
}

/* ── Who section: copy stays Blue until the card fills with
   colour on scroll (OTAs → red, Brands & Media → green),
   then flips to Soft Canvas. ────────────────────────────── */
.who_card.is-red .heading-style-h2,
.who_card.is-red .who_card-cont,
.who_card.is-purple .heading-style-h2,
.who_card.is-purple .who_card-cont {
  color: #074AD6;
  transition: color .45s ease;
}
.who_card.is-red.who-active,
.who_card.is-red.who-active .heading-style-h2,
.who_card.is-red.who-active .who_card-cont,
.who_card.is-purple.who-active,
.who_card.is-purple.who-active .heading-style-h2,
.who_card.is-purple.who-active .who_card-cont {
  color: #FFF5DD !important;
}
.who_card.is-red.who-active .who_card-cont img,
.who_card.is-purple.who-active .who_card-cont img {
  filter: none;
}

/* Desktop: colour fill is driven by Webflow interactions (old palette).
   Take it over on scroll so it matches the new palette. */
@media (min-width: 992px) {
  .who_card {
    transition: background-color .55s ease, color .45s ease;
  }
  .who_card.is-red.who-active {
    background-color: #ED695A !important;
    color: #FFF5DD !important;
  }
  .who_card.is-blue.who-active {
    background-color: #dee448 !important;
    color: #1A1A1A !important;
  }
  .who_card.is-green.who-active {
    background-color: #40a2f7 !important;
    color: #1A1A1A !important;
  }
  .who_card.is-purple.who-active {
    background-color: #6abe52 !important;
    color: #FFF5DD !important;
  }
  .who_card.who-active .heading-style-h2 {
    color: inherit !important;
  }
  .who_card.is-blue.who-active .who_card-cont img,
  .who_card.is-green.who-active .who_card-cont img {
    filter: none;
  }
}

/* ── Vikas (Founding Team): RubiCore Blue → Light Blue ─────── */
.team_content.w-variant-f9f4ddf1-3791-f776-7cc8-4611d2204eea {
  background-color: #40a2f7;
}
.team_content.w-variant-f9f4ddf1-3791-f776-7cc8-4611d2204eea .text-size-xlarge,
.team_content.w-variant-f9f4ddf1-3791-f776-7cc8-4611d2204eea .text-size-regular {
  color: #1A1A1A;
}

/* ── Curve everything: soften every box / image / control
   (header 01/02/03 images intentionally excluded above). ──── */
.problem_card,
.problem_card-inside,
.build_card,
.build_content,
.build_img-wrap,
.build_img-wrap img,
.model_card,
.model_left,
.who_card,
.who_card-mes,
.who_card-img-wrap,
.who_card-img-wrap img,
.team_card,
.team_content,
.team_img-wrap,
.team_img-wrap img,
.team_long,
.build_tab-content,
.build_tab-panel,
.build1_meeting-scdl {
  border-radius: 20px;
}

.tag,
.button,
.faq_component,
.faq_question,
.faq_answer,
.build_tab-link,
.tab-link,
.w-input,
.w-select,
.footer-form,
.partner-with-rubix img {
  border-radius: 14px;
}

.button { border-radius: 12px; }
.tag { border-radius: 100px; }

/* keep imagery from spilling past the new radii */
.build_img-wrap,
.team_img-wrap,
.who_card-img-wrap,
.build_card,
.team_card {
  overflow: hidden;
}
