/* ============================================================
   GRIP Brand Overrides — Risk Vizon LLC
   Applied ON TOP of insur.css — does not replace it
   Only changes: nav labels, under-construction blocks,
   login page, and minor content typography
   ============================================================ */

/* GRIP section labels */
.rv-section-label {
  display: inline-block;
  color: #710202;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  margin-bottom: 12px;
  border-left: 3px solid #710202;
  padding-left: 10px;
}

/* Under construction placeholder */
.rv-under-construction {
  background: repeating-linear-gradient(45deg, #fff8e1, #fff8e1 10px, #fffde7 10px, #fffde7 20px);
  border: 2px dashed #ffc107;
  border-radius: 6px;
  padding: 24px;
  text-align: center;
  color: #6d4c00;
  font-size: 14px;
}
.rv-under-construction i {
  font-size: 28px;
  color: #ffc107;
  display: block;
  margin-bottom: 8px;
}

/* Login page */
.rv-login-wrap {
  min-height: 100vh;
  background: #1A2E4A;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
}
.rv-login-card {
  max-width: 420px;
  width: 100%;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 8px 40px rgba(0,0,0,0.2);
  overflow: hidden;
}
.rv-login-header {
  background: #1A2E4A;
  padding: 28px 36px 22px;
  text-align: center;
  border-bottom: 3px solid #710202;
}
.rv-login-header img { height: 44px; margin-bottom: 12px; }
.rv-login-header h2 {
  font-size: 20px;
  color: #fff;
  margin: 0 0 4px;
  font-family: Georgia, serif;
}
.rv-login-header p { font-size: 12px; color: rgba(255,255,255,0.6); margin: 0; }
.rv-login-body { padding: 32px 36px; }
.rv-login-footer {
  padding: 14px 36px;
  background: #f9fafc;
  border-top: 1px solid #eee;
  text-align: center;
  font-size: 12px;
  color: #888;
}
.rv-login-footer a { color: #710202; text-decoration: none; margin: 0 6px; }
.rv-form-group { margin-bottom: 18px; }
.rv-form-group label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #2C2C2A;
  margin-bottom: 6px;
}
.rv-form-group input,
.rv-form-group select,
.rv-form-group textarea {
  width: 100%;
  border: 1.5px solid #BDBDBD;
  border-radius: 4px;
  padding: 11px 14px;
  font-size: 14px;
  color: #2C2C2A;
  background: #fff;
  transition: border-color 0.2s;
  box-sizing: border-box;
  font-family: Calibri, 'Segoe UI', Arial, sans-serif;
}
.rv-form-group input:focus,
.rv-form-group select:focus,
.rv-form-group textarea:focus {
  border-color: #710202;
  outline: none;
  box-shadow: 0 0 0 3px rgba(113,2,2,0.1);
}
.rv-form-group textarea { min-height: 120px; resize: vertical; }
.rv-feedback {
  padding: 12px 16px;
  border-radius: 4px;
  font-size: 13px;
  margin-top: 14px;
  display: none;
}
.rv-feedback.success { background: #e8f5e9; border-left: 4px solid #4caf50; color: #2e7d32; }
.rv-feedback.error   { background: #ffebee; border-left: 4px solid #f44336; color: #c62828; }
.rv-feedback.loading { background: #e3f2fd; border-left: 4px solid #1976d2; color: #0d47a1; }
.rv-btn-login {
  width: 100%;
  background: #710202;
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 13px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s;
  font-family: Calibri, 'Segoe UI', Arial, sans-serif;
}
.rv-btn-login:hover { background: #590000; }
.rv-password-wrap { position: relative; }
.rv-password-wrap input { padding-right: 42px; }
.rv-eye-toggle {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  cursor: pointer;
  color: #888;
  font-size: 15px;
  background: none;
  border: none;
  padding: 0;
}
.rv-security-note {
  font-size: 11px;
  color: #888;
  text-align: center;
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.rv-security-note i { color: #4caf50; }
.rv-lockout-notice {
  background: #fff3e0;
  border-left: 3px solid #ff9800;
  padding: 12px 16px;
  font-size: 13px;
  color: #e65100;
  border-radius: 4px;
  margin-bottom: 16px;
}
.rv-timeout-notice {
  background: #fff8e1;
  border-left: 3px solid #ffc107;
  padding: 10px 14px;
  font-size: 13px;
  color: #6d4c00;
  border-radius: 4px;
  margin-bottom: 16px;
}
.rv-spinner {
  display: inline-block;
  width: 14px; height: 14px;
  border: 2px solid rgba(255,255,255,0.4);
  border-top-color: #fff;
  border-radius: 50%;
  animation: rv-spin 0.7s linear infinite;
  vertical-align: middle;
  margin-right: 6px;
}
@keyframes rv-spin { to { transform: rotate(360deg); } }

/* Nav "Request Demo" button highlight */
.rv-demo-btn {
  background: #710202 !important;
  color: #fff !important;
  padding: 8px 16px !important;
  border-radius: 4px !important;
}
.rv-demo-btn:hover { background: #590000 !important; color: #fff !important; }

/* ── Batch 1 UX additions ────────────────────────────────────── */

/* Smooth preloader fade */
.loader-wrap { transition: opacity 0.4s ease; }

/* Hero secondary button hover (inline style supplement) */
.hero-outline-btn:hover {
  background: #800000 !important;
  color: #fff !important;
}

/* Section sub-title styling — consistent across pages */
.section-title-three__sub-title {
  font-weight: 600;
  letter-spacing: 0.05em;
}

/* Service cards — subtle lift on hover */
.service-one__single {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.service-one__single:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.1) !important;
}

/* Tab buttons — GRIP value prop section */
.tab-btn.active-btn .content-box {
  border-left: 4px solid #710202;
}

/* Footer widget links */
.footer-widget-three__links-list li a {
  transition: color 0.2s, padding-left 0.2s;
}
.footer-widget-three__links-list li a:hover {
  padding-left: 4px;
}

/* Back to top button */
.scroll-to-top {
  background: #710202 !important;
  border-color: #710202 !important;
  transition: background 0.2s !important;
}
.scroll-to-top:hover { background: #590000 !important; }

/* Contact form focus states */
.comment-form__input-box input:focus,
.comment-form__input-box textarea:focus {
  border-color: #710202;
  box-shadow: 0 0 0 3px rgba(113,2,2,0.1);
  outline: none;
}

/* "Under Construction" badge for nav items */
.rv-soon-badge {
  font-size: 9px;
  background: #710202;
  color: #fff;
  padding: 1px 6px;
  border-radius: 10px;
  vertical-align: middle;
  margin-left: 4px;
  font-weight: 700;
  letter-spacing: 0.05em;
}

/* Responsive: hide USP strip text on mobile */
@media (max-width: 767px) {
  .rv-usp-strip .col-md-4 {
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding: 12px 0 !important;
  }
}

/* ── Mobile responsiveness ───────────────────────────────────── */
@media (max-width: 991px) {
  /* Why GRIP section — stack columns */
  #why_grip .col-lg-6 { margin-bottom: 24px; }
  #why_grip .row { flex-direction: column; }

  /* Three pillar summary cards — full width */
  #grip_solution .col-lg-4 { margin-bottom: 16px; }

  /* Module cards — 2 columns on tablet */
  .col-xl-3.col-lg-4 { flex: 0 0 50%; max-width: 50%; }
}

@media (max-width: 767px) {
  /* Hero section */
  .banner-section { min-height: 80vh !important; padding: 60px 16px !important; }
  .banner-section .container { max-width: 100% !important; padding: 0 !important; }

  /* Module cards — single column on mobile */
  .col-xl-3.col-lg-4 { flex: 0 0 100%; max-width: 100%; }

  /* Why GRIP video */
  #why_grip video { border-radius: 6px; }

  /* Root causes stat callout */
  #why_grip > div > div > .row > .col-lg-6:first-child > div:first-child {
    flex-direction: column; text-align: center;
  }

  /* Founder quote strip */
  .col-lg-8 p { font-size: 15px !important; }
  .col-lg-3 { border-left: none !important; border-top: 1px solid rgba(255,255,255,0.2); padding-top: 16px !important; margin-top: 16px !important; }

  /* Navigation */
  .main-header .container { padding: 0 12px; }

  /* Footer columns stack */
  .footer-widget-three { margin-bottom: 24px; }
}

@media (max-width: 480px) {
  /* Three pillar cards bullet text */
  #grip_solution ul li { font-size: 12px !important; }

  /* Section headings */
  .section-title-three__title { font-size: 24px !important; }
}

/* ── Mobile fixes for Why GRIP section ──────────────────────── */
@media (max-width: 767px) {

  /* Pathways 2-col grid → single column */
  .rv-pathways-grid {
    grid-template-columns: 1fr !important;
  }

  /* Three summary columns → single column */
  .rv-summary-grid {
    grid-template-columns: 1fr !important;
  }

  /* Framework 4-col layers → 2 columns */
  .rv-layers-grid {
    grid-template-columns: repeat(2,1fr) !important;
  }

  /* Pathways background section padding */
  .rv-pathways-grid > div {
    padding: 14px 14px !important;
  }

  /* Root causes heading clamp */
  #why_grip h2 {
    font-size: clamp(20px, 5vw, 28px) !important;
  }

  /* Callout box stacks on mobile */
  #why_grip .row.align-items-stretch > div {
    margin-bottom: 16px;
  }

  /* Video full width */
  #why_grip video {
    width: 100% !important;
    height: auto !important;
  }

  /* Three pillar cards stacked */
  .rv-pillar-card {
    border-right: none !important;
    border-bottom: 1px solid #e0e0e0 !important;
  }

  /* Why GRIP header band text */
  #why_grip h2[style*="42px"] {
    font-size: 28px !important;
  }

  /* Governance architecture visual */
  #governance-framework table,
  .rv-layers-grid {
    font-size: 11px !important;
  }

  /* Prevent horizontal scroll on whole page */
  body { overflow-x: hidden !important; }
  .container { padding-left: 12px !important; padding-right: 12px !important; }

  /* Module cards 2-col on mobile */
  .col-xl-3.col-lg-4 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
}

@media (max-width: 480px) {
  /* Module cards single column on very small screens */
  .col-xl-3.col-lg-4 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* Framework layers grid single column */
  .rv-layers-grid {
    grid-template-columns: 1fr !important;
  }

  /* Reduce padding on section headers */
  #why_grip > div,
  #grip_solution > div {
    padding: 28px 0 !important;
  }
}