/* =============================================================
   RCI responsive layer
   Loaded AFTER style.css. Only overrides layout; colors/fonts unchanged.
   Breakpoints: <=1219px (fluid desktop/tablet), <=900px (tablet), <=600px (phone)
   ============================================================= */

/* ---- Global safety nets ---------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
img { max-width: 100%; height: auto; }
html, body { overflow-x: hidden; }
body { background: #1b1b1b; }          /* no grey band under a short page */
.banner_in p.wp-block-paragraph:empty { display: none; }   /* stray empty block in hero */

/* Clearfix for the floated rows (footer was collapsing to 0px) */
.header_in::after,
.footer_in::after,
.services_block::after { content: ""; display: table; clear: both; }

/* ---- Fluid below the 1200px design width ------------------- */
@media (max-width: 1219px) {
  .wrapper { min-width: 0; }

  .header_in,
  .banner_in,
  .main_container_in,
  .footer_in,
  .resources_in,
  .product_1_in,
  .product_2_in,
  .about_banner_in,
  .about_content_in,
  .time_line_in,
  .contact_content_in,
  .nav_in,
  .location,
  .slider { width: auto; max-width: 1200px; padding-left: 24px; padding-right: 24px; }

  /* Header: logo + search on top row, nav on its own row beneath */
  .header { padding: 14px 0 10px; }
  .header_in { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
  .logo { float: none; margin: 0; }
  .navigation { float: none; display: block; width: 100%; order: 3; }
  .navigation ul { float: none; display: flex; flex-wrap: wrap; margin: 0; }
  .navigation ul li { float: none; padding: 0 4px 4px 0; }
  .navigation ul li a,
  .navigation ul li.current-menu-item a { font-size: 15px; padding: 10px 12px; }
  .search { margin-left: auto; width: auto; }
  #search { padding: 0; }

  /* Hero */
  .banner { min-height: 60vh; display: block; }
  .banner_in h1 { padding-left: 0; line-height: 1.2; }
  .banner_in p  { width: auto; max-width: 939px; padding: 12px 16px;
                  background: rgba(255,255,255,.75); border-radius: 2px; }

  /* Service tiles: 3-up flexible grid instead of fixed 368px floats */
  .services_block { padding-left: 0; display: flex; gap: 24px; }
  .service {
    float: none; flex: 1 1 0; width: auto; height: auto; margin: 0;
    padding: 40px 20px;
  }
  .service p { width: auto; margin: 0 auto; }

  /* "Service details" tab: center it instead of left:495px */
  .details { left: 50%; transform: translateX(-50%); width: auto; padding: 28px 39px 27px; white-space: nowrap; }

  /* Footer: flex row instead of fixed-width floats */
  .footer_in { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
  .footer_left, .footer_mid, .footer_right { float: none; width: auto; padding: 0; }
  .footer_left p { padding-right: 40px; }
  .footer_right a { margin-left: 40px; }
}

/* ---- Tablet --------------------------------------------- */
@media (max-width: 900px) {

  .banner { min-height: 480px; }
  .banner_in { padding-top: 40px; }
  .banner_in h1 { font-size: 30px !important; }   /* overrides inline 40px */
  .banner_in p  { font-size: 24px; line-height: 32px; }

  .main_container { padding: 80px 0 60px; }
  .services_block { gap: 16px; }
  .service { padding: 32px 16px; }
  .service p { font-size: 14px; line-height: 21px; }
  .service img { padding-bottom: 20px; }
  .service h4 { padding-bottom: 24px; margin-bottom: 24px; }

  .footer_in { flex-direction: column; text-align: center; }
  .footer_left, .footer_right { display: flex; flex-direction: column; align-items: center; gap: 8px; }
  .footer_left p, .footer_left a, .footer_right p, .footer_right a { float: none; padding: 0; margin: 0; }
  .footer_mid { order: -1; }
}

/* ---- Phone ---------------------------------------------- */
@media (max-width: 600px) {
  .header_in, .banner_in, .main_container_in, .footer_in { padding-left: 16px; padding-right: 16px; }

  .logo img { width: 220px; height: auto; }
  .search { width: 100%; order: 4; }
  .search input[type='search'] { width: 100%; height: 36px; padding: 0 8px; font-size: 16px; } /* 16px stops iOS zoom-on-focus */

  .navigation ul li a,
  .navigation ul li.current-menu-item a { font-size: 14px; padding: 9px 10px; }

  .banner { min-height: 420px; background-position: 60% bottom; }
  .banner_in h1 { font-size: 22px !important; letter-spacing: 0; }
  .banner_in p  { font-size: 18px; line-height: 26px; letter-spacing: 0.2px; padding: 12px; }

  .details { top: -70px; padding: 22px 28px; }
  .main_container { padding: 60px 0 40px; }
  .services_block { flex-direction: column; }
  .service p { font-size: 15px; line-height: 23px; }
}
