/*!
Theme Name: RBW-2026
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: rbw-2026
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

RBW-2026 is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");

@tailwind base;
@tailwind components;
@tailwind utilities;

.grid-container-wrapper .center-img {
    aspect-ratio: 1 / 1;
    border-radius: 0%;
    box-shadow: none;
    border: solid white 16px;
        border-radius: 0% !important;

}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Inter", sans-serif !important;
}

:root {
  --primary: #233155;
  --primary-dark: #0d1625;
  --secondary: #ffc557;
}

.text-primary {
  color: var(--primary) !important;
}
.text-primary-dark,
.text-dark {
  color: var(--primary-dark) !important;
}
.text-secondary {
  color: var(--secondary) !important;
}

.bg-primary {
  background-color: var(--primary) !important;
}
.bg-primary-dark,
.bg-dark {
  background-color: var(--primary-dark) !important;
}
.bg-secondary {
  background-color: var(--secondary) !important;
}
.border-primary {
  border-color: var(--primary) !important;
}
.border-secondary {
  border-color: var(--secondary) !important;
}

a.link-underline-ltr {
  position: relative;
  text-decoration: none;
  --link-underline-thickness: 2px;
}

a.link-underline-ltr::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: var(--link-underline-thickness);
  background-color: currentColor;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.3s ease;
}

a.link-underline-ltr:hover::after,
a.link-underline-ltr:focus-visible::after {
  transform: scaleX(1);
}

a.link-underline-ltr.thickness-1 {
  --link-underline-thickness: 1px;
}

a.link-underline-ltr.thickness-2 {
  --link-underline-thickness: 2px;
}

a.link-underline-ltr.thickness-3 {
  --link-underline-thickness: 3px;
}

a.link-underline-ltr.thickness-4 {
  --link-underline-thickness: 4px;
}

html,
body {
  /* Hide scrollbar for Chrome, Safari and Opera */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE and Edge */
}

html::-webkit-scrollbar,
body::-webkit-scrollbar {
  display: none; /* Chrome, Safari and Opera */
  width: 0;
  height: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
span {
  font-family: "Inter", sans-serif;
}

canvas#bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 40;
}

.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

.lenis.lenis-stopped {
  overflow: hidden;
}

.lenis.lenis-scrolling iframe {
  pointer-events: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Inter" !important;
}

/* Bootstrap Typography Overrides */
h1,
.h1,
.fs-1 {
  font-size: clamp(2.2rem, 2vw + 1rem, 3.4rem) !important;
}

h2,
.h2,
.fs-2 {
  font-size: clamp(1.8rem, 2vw + 1rem, 2.8rem) !important;
}

h3,
.h3,
.fs-3 {
  font-size: clamp(1.25rem, 2vw + 1rem, 2rem) !important;
  line-height: 1.3;
  letter-spacing: -0.01rem;
}

h4,
.h4,
.fs-4 {
  font-size: clamp(1.2rem, 2vw + 0.5rem, 1.4rem) !important;
}

h5,
.h5,
.fs-5 {
  font-size: clamp(1.1rem, 1.5vw + 0.5rem, 1.25rem) !important;
}

h6,
.h6,
.fs-6,
p {
  font-size: clamp(0.9rem, 1vw + 0.5rem, 1.1rem) !important;
}

.italic {
  font-style: italic !important;
}

h2.hero-sub {
  letter-spacing: 3px;
}

.wp-block-heading {
  color: var(--primary) !important;
}

.rbw-special-list {
  list-style: none;
  padding-left: 0;
}

.rbw-special-list li {
  position: relative;
  padding-left: 40px; /* space for icon */
  margin-bottom: 12px;
}

.rbw-special-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 4px;

  width: 24px;
  height: 24px;

  background-image: url('https://rbwdev.wpenginepowered.com/wp-content/uploads/2026/03/checkmark.png');
  background-size: contain;
  background-repeat: no-repeat;
}

b,
strong {
  font-weight: 600;
}

main#primary {
    min-height: 80vh;
}

img.hero-img-static {
  position: relative;
  width: 95%;
  object-fit: contain;
}

.w-90 {
  width: 90% !important;
}

.w-80 {
  width: 80% !important;
}

.w-70 {
  width: 70% !important;
}

.w-60 {
  width: 60% !important;
}

.entry-footer {
  display: none !important;
}

/* Navy Blue Brand Color */
:root {
  --rbw-navy: #1a2b49;
}

.navbar-brand img {
  /* Scales from 50px on mobile to 80px on desktop */
  height: clamp(50px, 8vw + 20px, 80px);
  width: auto; /* Maintains aspect ratio */
}

@media (min-width: 992px) {
  .site-header {
    position: sticky;
    top: 0;
    z-index: 1030;
    width: 100%;
  }
}

.navbar {
  background-color: transparent;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  border-bottom: 1px solid transparent !important;
  box-shadow: none !important;
}


/* On Scroll Styles (added via JS) */
.navbar.scrolled {
  background-color: rgba(255, 255, 255, 0.8) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.07) !important;
}

.logo-container {
  transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55),
    opacity 0.4s ease, visibility 0.4s ease;
}

.logo-hidden {
  transform: translateX(-150%);
  opacity: 0;
  visibility: hidden;
}

.corporate-btn {
  position: relative;
  overflow: hidden;
  text-decoration: none;
  z-index: 1;
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  font-weight: 600;
  font-size: 0.85rem;
  padding: 12px 24px !important;
  border-width: 2px;
  border-style: solid;
  cursor: pointer;
}

.btn-outline {
  background: transparent;
  border-color: #1a2b49;
  color: #1a2b49;
}

.btn-filled {
  background-color: #1a2b49;
  border-color: #1a2b49;
  color: #ffffff;
}

.secondary.btn-outline {
  border-color: #ffffff;
  color: #ffffff;
}

.secondary.btn-filled {
  background-color: var(--secondary);
  border-color: #ffffff;
  color: #1a2b49;
}

.slide-bg {
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  transition: transform 0.4s cubic-bezier(0.65, 0, 0.35, 1);
  z-index: -1;
}

.btn-outline .slide-bg {
  background: #1a2b49;
}

.btn-filled .slide-bg {
  background: #0d1625;
}

.secondary.btn-outline .slide-bg {
  background: var(--secondary);
}

.secondary.btn-filled .slide-bg {
  background: var(--secondary);
}

.corporate-btn:hover .slide-bg {
  transform: translateX(100%);
}

.corporate-btn:hover {
  border-color: transparent;
}

.btn-outline:hover {
  color: #ffffff !important;
}

.secondary.btn-outline:hover {
  color: #1a2b49 !important;
}

.btn-text,
.arrow-icon {
  position: relative;
}

.lh-sm.industry-list li a {
    text-decoration: none !important;
    color: unset;
}

/* Explicit offcanvas backdrop visibility control */
.offcanvas-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  background-color: rgba(0, 0, 0, 0.5);
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.15s ease-in-out, visibility 0.15s ease-in-out;
  pointer-events: none;
}

.offcanvas-backdrop.show {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  z-index: 50 !important;
}

#mobileMenu {
  transform: translateX(100%);
  visibility: hidden;
  transition: transform 0.25s ease-in-out, visibility 0.25s ease-in-out;
}

#mobileMenu.show {
  transform: translateX(0);
  visibility: visible;
}

.corporate-btn:active {
  transform: scale(0.95);
}

.nav-item-custom {
  width: 145px;
  display: flex;
  flex-direction: column;
  transition: opacity 0.2s ease;
}

.nav-item-custom:hover {
  opacity: 0.7;
}

.top-line {
  height: 2px;
  background-color: #dee2e6; /* light grey line */
  width: 100%;
}

.nav-label {
  white-space: pre-line;
  /* font-size: 0.85rem; */
  line-height: 1.6;
  color: var(--rbw-navy);
  font-weight: 600;
  letter-spacing: 0.02em;
}

.nav-arrow {
  font-size: 1.2rem;
  color: var(--rbw-navy);
  font-weight: 300;
  line-height: 1;
  margin-left: 8px;
}

@media (min-width: 768px) and (max-width: 1199.98px) {
  .tablet-hide {
    display: none !important;
  }
}
/* Two-row tablet header: logo row + nav row */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .navbar .container-xxl {
    flex-wrap: wrap !important;
    padding-top: 0.75rem !important;
    padding-bottom: 0 !important;
  }

  /* Row 1: logo full-width */
  .navbar .logo-container {
    width: 100%;
    justify-content: center;
    padding-bottom: 0.6rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    margin-bottom: 0;
  }

  .navbar-brand img {
    height: 52px !important;
  }

  /* Row 2: nav links left, button right */
  .navbar .desktop-nav-container {
    order: 3;
    flex: 1 1 auto;
    margin-right: 0 !important;
    justify-content: center;
    padding: 0.5rem 0;
  }

  .navbar .desktop-nav-container ~ div {
    order: 3;
    padding: 0.5rem 0;
  }

  .nav-item-custom {
    width: auto !important;
  }

  .nav-label {
    font-size: 0.9rem !important;
  }

  .nav-arrow {
    display: none !important;
  }

  .top-line {
    display: none;
  }

  .corporate-btn {
    padding: 8px 16px !important;
  }
}

/* Compact desktop menu for larger laptops */
@media (min-width: 1200px) and (max-width: 1299px) {
  .desktop-nav-container {
    gap: 2.5rem !important;
    margin-right: 2.5rem !important;
  }
  .nav-item-custom {
    width: auto !important;
  }
  .nav-label {
    font-size: 1rem !important;
  }
  .nav-arrow {
    display: none !important;
  }
  .navbar-brand img {
    height: 60px !important;
  }
}

.btn-cta {
  background-color: #1a2b49;
  color: white;
  font-size: 0.95rem;
  border: none;
  padding-left: 1.75rem !important;
  padding-right: 1.75rem !important;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

.btn-cta:hover {
  background-color: #111d31;
  color: white;
  transform: translateY(-1px);
}

.btn-cta span {
  font-size: 1.2rem;
  font-weight: 300;
}

/* Ensure font looks crisp */
nav {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Custom Dropdown Styling */
.dropdown-hover:hover .dropdown-menu {
  display: block;
}

.custom-dropdown {
  min-width: 300px;
  position: absolute;
  top: 100%;
  left: -1rem; /* Aligns dropdown items precisely with the nav text assuming px-3 on items */
  margin-top: 10px;
  animation: fadeIn 0.15s ease-in-out;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
}

/* Invisible bridge so mouse doesn't lose hover jumping the gap */
.custom-dropdown::before {
  content: "";
  position: absolute;
  top: -15px;
  left: 0;
  width: 100%;
  height: 15px;
  background: transparent;
}

.custom-dropdown-item {
  color: var(--primary) !important;
  transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);
  border: 1px solid transparent;
  z-index: 1;
}

.custom-dropdown-item:hover,
.custom-dropdown-item:focus {
  background-color: transparent !important;
  border: 1px solid transparent;
}

.custom-dropdown-item:hover .btn-text,
.custom-dropdown-item:focus .btn-text {
  color: #1f2a47 !important;
}

/* Identical Slide Background to RButton */
.custom-dropdown-item .slide-bg {
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  opacity: 0.5;
  background: var(--rbw-navy);
  transition: transform 0.3s cubic-bezier(0.65, 0, 0.35, 1);
  z-index: 2;
  background-color: #1f2a470f;
  border-radius: 100px;
}

.custom-dropdown-item:hover .slide-bg {
  transform: translateX(100%);
  opacity: 1;
}

.custom-dropdown-item:active {
  transform: scale(0.98);
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.footer-section {
  /* Ensuring background matches the light/white theme of the site */
  background-color: #ffffff;
}

.footer-link {
  transition: opacity 0.2s ease;
}

.footer-link:hover {
  opacity: 0.7;
}

.link-label {
  color: #233155; /* RBW Navy */
  font-size: 1.1rem;
  font-weight: 500;
  letter-spacing: 0.01em;
}

.link-arrow {
  color: #233155;
  font-size: 1.2rem;
  font-weight: 300;
  line-height: 1;
}

.copyright {
  color: #233155;
  font-size: 0.85rem;
  opacity: 0.6;
}

/* Tablet footer layout */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .footer-section .container-xxl {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }

  .footer-section .row {
    gap: 1.25rem;
  }

  .footer-section .row > .col-lg-9,
  .footer-section .row > .col-lg-3 {
    flex: 0 0 100%;
    max-width: 100%;
    width: 100%;
    text-align: center !important;
  }

  .footer-section .row > .col-lg-3 {
    margin-top: 0 !important;
  }

  .footer-section .col-lg-9 > div {
    justify-content: center;
    gap: 1rem 1.5rem !important;
    padding-top: 0 !important;
  }

  .footer-link {
    padding-bottom: 0 !important;
  }
}

/* Mobile adjustments */
@media (max-width: 991px) {
  .footer-link {
    width: 100%;
    justify-content: space-between;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(35, 49, 85, 0.1);
  }
}

@media (max-width: 767.98px) {
  h2.hero-sub {
    letter-spacing: 0 !important;
    font-size: 0.9rem !important;
    font-weight: 900 !important;
  }

  .hero-wrapper {
    padding-top: 2rem;
    height: 100vh;
  }

  img.hero-img-static {
    width: 100%;
    height: auto;
    position: relative;
  }

  .checkmark-icon {
    width: 20px !important;
    height: 20px !important;
  }

  h3,
  .h3,
  .fs-3 {
    font-size: 1.15rem !important;
    line-height: 1.3;
  }

  h2,
  .h2,
  .fs-2 {
    font-size: clamp(1.8rem, 2vw + 1rem, 2.8rem) !important;
    line-height: 2rem;
    letter-spacing: -1px;
  }

  h1,
  .h1,
  .fs-1 {
    font-size: clamp(2rem, 2vw + 1rem, 3.4rem) !important;
  }

  h1.hero-title {
    max-width: 80%;
    margin: auto;
    text-align: left;
  }

  h2.hero-sub {
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0.5rem;
    text-align: left;
  }

  .card-content .card-title {
    font-weight: 400 !important;
    font-size: 1.25rem !important;
    opacity: 0.9;
  }

  footer.footer-section {
    background-color: #233155 !important;
  }

  .link-label {
    color: #fff !important;
    margin-left: 1rem;
    padding-bottom: 10px !important;
  }

  .copyright {
    color: #ffffff70 !important;
    opacity: 1 !important;
  }

  .footer-link {
    width: 100%;
    justify-content: space-between;
    padding: 0 !important;
    border-bottom: 2px solid rgb(255 255 255 / 15%) !important;
  }
}

/* =========================================================================
   Mobile Device Specific Breakpoints
========================================================================= */

@media (max-width: 320px) {
}

@media (max-width: 375px) {
}

@media (max-width: 393px) {
}

@media (max-width: 414px) {
}

@media (max-width: 430px) {
}

@media (max-width: 480px) {
}

@media (max-width: 575.98px) {
}

@media (max-width: 767.98px) {
  .blog-dot-divider {
    height: 4px !important;
    background-size: 1px 100% !important;
  }
}

.blog-dot-divider {
  width: 100%;
  height: 8px;
  background-image: radial-gradient(circle, #1a2b49 3px, transparent 3px);
  background-size: 20px 100%;
  background-repeat: repeat-x;
  background-position: center;
  opacity: 0.8;
}


:where(.i-mdi\:chevron-right) {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='black' d='M8.59 16.58L13.17 12L8.59 7.41L10 6l6 6l-6 6z'/%3E%3C/svg%3E");
}

:where(.i-mdi\:chevron-left) {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-image: var(--svg);
    mask-image: var(--svg);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    --svg: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath fill='black' d='M15.41 16.58L10.83 12l4.58-4.59L14 6l-6 6l6 6z'/%3E%3C/svg%3E");
}