@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");

/* ===================== ROOT TOKENS ===================== */
:root {
  --brand: #B90000;
  --secondary: #111827;
  --dark: #000000;
  --gray: #6b7280;
  --body-text-color: #111827;
  --white: #ffffff;
  --body-font: "Poppins", sans-serif;
  --border-radius: 999px;      /* pill buttons */
  --primaryColor: #B90000;
  --eye: url("../images/eye.svg");
}

/* ===================== GLOBAL RESET ===================== */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-size: 100%;
  width: 100%;
  height: 100%;
  scroll-behavior: smooth;
  overflow-x: hidden !important;
}

body {
  background-color: #fff;
  text-rendering: optimizeLegibility;
  font-family: var(--body-font);
  line-height: 1.65;
  color: var(--body-text-color);
  font-size: 1rem;
  overflow-x: hidden !important;
}

/* ===================== TYPOGRAPHY ===================== */
.h1 {
  font-size: 2.75rem;
}

h1, h2, h3, h4, h5 {
  color: var(--dark);
  font-weight: 600;
}

h2, .h2 {
  font-size: 2.5rem;
}

h3, .h3 {
  font-size: 1.75rem;
}

h4, .h4 {
  font-size: 1.5rem;
}

h5, .h5 {
  font-size: 1.25rem;
}

.lead-lg {
  font-size: 1.375rem;
}

.lead-sm {
  font-size: 1.125rem;
}

.fs-12 { font-size: 12px; }
.fs-13 { font-size: 13px; }
.fs-15 { font-size: 0.937rem !important; }

/* COLORS / UTILITIES */
.bg-light { background-color: #F9F9F9 !important; }
.bg-primary { background-color: var(--brand) !important; }
.bg-dark { background-color: var(--dark) !important; }

.text-primary { color: var(--brand) !important; }
.text-dark { color: var(--dark) !important; }
.text-55 { color: #555 !important; }
.text-gray { color: var(--gray) !important; }

.text-justify { text-align: justify; }

.bgi {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.object-cover {
  object-fit: cover;
  object-position: center center;
}

/* Links */
a {
  text-decoration: none;
  display: inline-block;
  transition: all 0.3s ease-in-out;
  color: var(--dark);
}
a:hover {
  color: var(--brand);
}

/* Lists */
ul {
  padding-left: 0;
  margin-bottom: 0;
}
ul li { list-style-type: none; }

/* Images – NO global pointer-events disable! */
img {
  /* max-width: 100%; */
  height: auto;
  display: block;
}

/* Buttons / Forms */
.btn:focus,
.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  box-shadow: none;
}

.btn {
  font-weight: 500;
  color: var(--dark);
  font-size: 1rem;
  border-radius: var(--border-radius);
  padding: 0 2rem;
  justify-content: center;
  align-items: center;
  display: inline-flex;
  transition: all 0.3s ease-in-out;
  background-color: #fff;
}
.btn.height { min-height: 2.875rem; }
.btn.height.sm {
  font-size: 0.875rem;
  min-height: 2.25rem;
}

.btn-primary {
  background-color: var(--brand);
  border-color: var(--brand);
  color: var(--white);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: var(--secondary);
  border-color: var(--secondary);
  color: var(--white);
}

/* Hover image wrapper */
.img-hover {
  overflow: hidden;
  border-radius: 35%;
}
.img-hover img {
  transition: all 0.3s ease-in-out;
}
.img-hover:hover img {
  transform: scale(1.1);
}

/* ===================== RESPONSIVE TYPOGRAPHY ===================== */
@media (max-width: 1399.99px) {
  .h1 { font-size: 2.5rem; }
  .lead { font-size: 1.125rem; }
}
@media (max-width: 991.99px) {
  html { font-size: 93.75%; }
  .h1 { font-size: 2.4rem; }
  h2, .h2 { font-size: 2.25rem; }
  h3, .h3 { font-size: 1.6rem; }
}
@media (max-width: 767.99px) {
  .h1 { font-size: 2.2rem; }
  h2, .h2 { font-size: 2rem; }
  h3, .h3 { font-size: 1.45rem; }
}
@media (max-width: 575.99px) {
  html { font-size: 87.5%; }
  .fs-13 { font-size: 11px; }
  .lead { font-size: 1rem; }
  .h1 { font-size: 2.1rem; }
  h2, .h2 { font-size: 1.9rem; }
  h3, .h3 { font-size: 1.4rem; }
  h4, .h4 { font-size: 1.3rem; }
  h5, .h5 { font-size: 1.067rem; }

  .btn {
    font-size: 0.937rem;
    padding: 0 0.75rem;
  }
  .btn.height { min-height: 2.5rem; }

  .container {
    max-width: calc(100% - 20px);
  }
}

/* ===================== NAVBAR ===================== */
/* smart-scroll JS toggles .scrolled-up / .scrolled-down on nav */

.navbar {
  z-index: 999;
  padding: 0.75rem 0;
  transition: background-color .3s ease, box-shadow .3s ease, transform .3s ease;
  background: linear-gradient(to bottom, rgba(0,0,0,.8), transparent);
  backdrop-filter: blur(16px);
}
.navbar .navbar-brand img {
  max-height: 2.4rem;
  width: auto;
}

.navbar .nav-item .nav-link {
  font-size: 0.98rem;
  color: #f9fafb;
  padding: 0.25rem 0;
  margin: 0 0.75rem;
  position: relative;
}
.navbar .nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 0;
  height: 2px;
  background-color: var(--brand);
  border-radius: 999px;
  transition: width .25s ease;
}
.navbar .nav-link:hover,
.navbar .nav-link:focus {
  color: #fff;
}
.navbar .nav-link:hover::after,
.navbar .nav-link.active::after {
  width: 100%;
}

.navbar .navbar-toggler {
  border: 1px solid transparent;
  position: relative;
}
.navbar .navbar-toggler:focus {
  box-shadow: none;
  outline: none;
}

/* hamburger icon */
.hamburger ._line{
  width: 32px;
  height: 3px;
  background-color: #ecf0f1;
  display: block;
  margin: 6px auto;
  border-radius: 4px;
  transition: all 0.3s ease-in-out;
}
.hamburger:hover { cursor: pointer; }

.navbar-toggler:not(.collapsed) .hamburger ._line:nth-child(2){
  opacity: 0;
}
.navbar-toggler:not(.collapsed) .hamburger ._line:nth-child(1){
  transform: translateY(9px) rotate(45deg);
}
.navbar-toggler:not(.collapsed) .hamburger ._line:nth-child(3){
  transform: translateY(-9px) rotate(-45deg);
}

/* scroll behaviour */
.scrolled-down {
  transform: translateY(-100%);
}
.scrolled-up {
  transform: translateY(0);
  background-color: rgba(0,0,0,0.92) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

/* mobile nav background */
@media (max-width: 991px) {
  .navbar {
    padding: 0.75rem 0;
  }
  .navbar .navbar-brand img {
    max-height: 2.3rem;
  }
  .navbar .navbar-collapse {
    background-color: var(--dark);
    padding: 1rem;
  }
  .navbar .nav-link {
    margin: 0.35rem 0;
  }
}

/* ===================== HERO ===================== */
.header__wrapper {
  background-color: rgba(5, 80, 123, 0.09);
  min-height: 100vh;
}
.header__wrapper .right__aligned__box,
.header__wrapper .thumb__box {
  min-height: calc(100vh - 10rem);
}
.header__wrapper .h1 {
  font-size: 3rem;
}
.header__wrapper .overlay {
  background-color: #000;
  opacity: 0.4;
}

@media (min-width: 2000px) {
  .header__wrapper {
    min-height: 1080px;
  }
  .header__wrapper .right__aligned__box,
  .header__wrapper .thumb__box {
    min-height: calc(1080px - 10rem);
  }
}
@media (max-width: 992px) {
  .header__wrapper {
    padding: 4rem 0 2rem 0;
  }
  .header__wrapper .h1 {
    font-size: 2.6rem;
  }
  .header__wrapper .right__aligned__box,
  .header__wrapper .thumb__box {
    min-height: auto;
  }
}
@media (max-width: 767px) {
  .header__wrapper .h1 { font-size: 2.3rem; }
}
@media (max-width: 575px) {
  .header__wrapper .h1 { font-size: 2.1rem; }
}
@media (min-width: 992px) {
  .header__wrapper .h1 {
    white-space: nowrap;
  }
  .right__aligned__box {
    position: absolute;
    top: 0;
    left: 0;
  }
  .right__aligned__box.col--5 {
    width: 45vw;
  }
}

/* red underline under section titles */
.line {
  position: relative;
  display: inline-block;
}
.line::after {
  content: "";
  width: 100%;
  height: 2px;
  background: var(--brand);
  display: inline-block;
  position: absolute;
  bottom: -0.1rem;
  left: 0;
}

/* ===================== GENERIC PAGE ELEMENTS ===================== */
.page__header {
  min-height: 13rem;
  border: 1px solid #707070;
}
@media (max-width: 576px) {
  .page__header {
    min-height: 10rem;
    padding: 4rem 0;
  }
  .page__header .h1 { font-size: 2.1rem; }
}

.top__title {
  color: #383838;
  font-size: 2.25rem !important;
}

/* Map wrapper */
.map {
  overflow: hidden;
  position: relative;
  width: 100%;
  background-color: #ccc;
  max-height: 27rem;
}
.map::after {
  padding-top: 56.25%;
  display: block;
  content: "";
}
.map iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-width: 0;
}

/* Gallery overlay */
.galleryItem {
  position: relative;
}
.galleryItem::after {
  content: "";
  width: calc(100% - 2rem);
  height: calc(100% - 2rem);
  position: absolute;
  top: 1rem;
  left: 1rem;
  background: var(--eye) no-repeat center center/2rem;
  background-color: rgba(0, 0, 0, 0.71);
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out;
}
.galleryItem:hover::after {
  opacity: 1;
  visibility: visible;
}

/* Services (other pages) */
.services__offered__wraper .services__offered__box {
  padding: 3.5rem 2.25rem;
  border: 1px solid #707070;
  transition: all 0.5s ease-in-out;
}
.services__offered__wraper .services__offered__box h3 { color: #2C2C2C; }
.services__offered__wraper .services__offered__box p { color: #2C2C2C; }
.services__offered__wraper .services__offered__box .title__mini__box { height: 3.25rem; }
.services__offered__wraper .services__offered__box .mini__text { height: calc(100% - 3.25rem); }
.services__offered__wraper .services__offered__box:hover {
  background-color: var(--brand);
}
.services__offered__wraper .services__offered__box:hover h3,
.services__offered__wraper .services__offered__box:hover p {
  color: var(--white);
}
@media (max-width: 575px) {
  .services__offered__wraper .services__offered__box {
    padding: 1.5rem 1.25rem;
  }
}

/* Contact form */
.contact__wrapper .form-control,
.contact__wrapper .form-select {
  height: 3.25rem;
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
  border: 1px solid #CBCBCB;
  border-radius: 12px;
  font-weight: 500;
  padding-left: 1.125rem;
  background-color: #FFFFFF;
}
.contact__wrapper .form-control::placeholder,
.contact__wrapper .form-select::placeholder {
  color: rgba(51, 51, 51, 0.2);
}
.contact__wrapper textarea.form-control {
  height: auto;
  padding-top: 1rem;
}
.contact__wrapper .btn-primary {
  background-color: var(--brand);
  border-color: var(--brand);
  border-width: 2px;
  font-size: 1.25rem;
  min-height: 3.5rem;
}
.contact__wrapper .btn-primary:hover {
  color: var(--brand);
  background-color: transparent;
}
.error { padding-top: 0.25rem; }

/* ===================== OWNER AREA ===================== */
.owner-area { background:#f8fafc; }
.owner-card,
.owner-pill {
  background:#fff;
  border:1px solid #eef0f6;
  border-radius:18px;
  box-shadow:0 6px 18px rgba(19,33,68,.06);
}
.owner-bullets li { margin:.35rem 0; }

/* Portrait */
.owner-portrait {
  border-radius:20px;
  padding:2px;
  margin:0 0 1rem 0;
  background:linear-gradient(135deg,#63a3ff,#ffd26f);
  box-shadow:0 10px 30px rgba(20,38,66,.08);
}
.owner-portrait img {
  display:block;
  width:100%;
  border-radius:18px;
  background:#fff;
  object-fit:cover;
}

/* Media frame */
.owner-media {
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 28px rgba(16,24,40,.12);
}
.owner-media img { width:100%; height:100%; }

/* Carousel controls */
.btn-circle{
  width:42px;
  height:42px;
  border-radius:50%;
  padding:0;
  line-height:1;
}
.owner-nav .btn{
  transition:transform .15s ease, opacity .2s;
}
.owner-nav .btn:hover{
  transform:translateY(-1px);
  opacity:.92;
}

/* Auto-hide controls if single slide */
.owner-carousel.is-single .owner-nav { display:none; }

/* Restrict pointer-events disable to carousel images ONLY */
.owner-carousel img {
  pointer-events: none;
  user-select: none;
  -webkit-user-drag: none;
  -webkit-touch-callout: none;
}

/* ===================== BACK TO TOP ===================== */
.backTop {
  bottom: 1rem;
  right: 1rem;
  width: 3rem;
  height: 3rem;
  background-color: var(--brand);
  z-index: 999;
  display: none;
  border: 2px solid var(--white);
}
.backTop:hover,
.backTop:focus,
.backTop:active {
  background-color: var(--dark);
}
.backTop.show {
  display: flex;
}

/* ===================== LAUNCH BOX ===================== */
.launch-box {
  background-color: #b30000;
  border-radius: 24px;
}
@media (max-width: 767.98px) {
  #launch-update .launch-box {
    text-align: center;
  }
}

/* ===================== FOOTER ===================== */
footer {
  background: #EEE;
}
@media (min-width: 992px) {
  footer .container {
    min-height: 3rem;
  }
  footer .logo {
    position: absolute;
    top: 0;
    left: 0;
  }
}
@media (max-width: 575.99px) {
  footer .logo img {
    max-height: 2.5rem;
    width: auto;
  }
}

/* ========== ROADMAP FLOW DIAGRAM ========== */

.roadmap-section {
  background: #ffffff;
  position: relative;
  overflow: hidden;
}

.roadmap-status {
  border-radius: 22px;
  position: relative;
}
.roadmap-status::after {
  /* soft glow behind */
  content:"";
  position:absolute;
  inset:10%;
  border-radius:inherit;
  background: radial-gradient(circle at 10% 0%, rgba(255,255,255,.14), transparent 55%);
  opacity:.7;
  pointer-events:none;
}
.roadmap-status-list li { margin-bottom: .15rem; }

/* Flow container */
.roadmap-flow {
  position: relative;
  max-width: 960px;
  margin: 3rem auto 0;
  padding: 2rem 0 1rem;
}

/* Center vertical line */
.roadmap-line {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 2px;
  transform: translateX(-50%);
  background-image: linear-gradient(
    to bottom,
    rgba(185,0,0,1),
    rgba(185,0,0,.3),
    rgba(185,0,0,0)
  );
  opacity: .9;
}

/* Each phase card */
.roadmap-item {
  position: relative;
  width: 50%;
  background: #ffffff;
  border-radius: 18px;
  padding: 1rem 1.25rem 1rem;
  box-shadow: 0 10px 30px rgba(15,23,42,.08);
  border: 1px solid #e5e7eb;
  margin-bottom: 3rem;
  z-index: 1;
  isolation: isolate;
  transition: transform .25s ease, box-shadow .25s ease;
}

/* left / right alignment */
.roadmap-item.left {
  margin-right: auto;
  padding-right: 2.5rem;
}
.roadmap-item.right {
  margin-left: auto;
  padding-left: 2.5rem;
}

/* little phase pill */
.roadmap-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.15rem 0.75rem;
  border-radius: 999px;
  background: rgba(185,0,0,0.09);
  color: var(--brand);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  margin-bottom: .35rem;
}

/* Dot on the line */
.roadmap-item::before {
  content:"";
  position:absolute;
  top: 50%;
  width: 14px;
  height: 14px;
  border-radius:50%;
  background:#ffffff;
  border: 3px solid var(--brand);
  box-shadow: 0 0 0 4px rgba(185,0,0,.15);
  transform: translateY(-50%);
}

/* dotted connector "flow" with animation */
.roadmap-item::after {
  content:"";
  position:absolute;
  top: 50%;
  height: 0;
  border-top: 2px dotted rgba(37,99,235,.6);
  width: 40px;
  transform: translateY(-50%);
  background-image: radial-gradient(circle, rgba(37,99,235,.9) 2px, transparent 2px);
  background-size: 8px 8px;
  background-repeat: repeat-x;
  animation: roadmap-dots 1.5s linear infinite;
}

/* Left items: dot on right, arrow to center */
.roadmap-item.left::before {
  right: -7px;
}
.roadmap-item.left::after {
  right: -47px;      /* 40 (line) + 7 (dot radius) */
}

/* Right items: dot on left, arrow to center */
.roadmap-item.right::before {
  left: -7px;
}
.roadmap-item.right::after {
  left: -47px;
}

/* hover micro interaction */
.roadmap-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 40px rgba(15,23,42,.15);
}

/* dotted movement */
@keyframes roadmap-dots {
  from { background-position-x: 0; }
  to   { background-position-x: -16px; }
}

/* ---------- Responsive tweaks ---------- */
@media (max-width: 991.98px) {
  .roadmap-item {
    width: 100%;
    padding: 1rem 1.1rem 1rem 1.1rem;
  }
  .roadmap-line {
    left: 24px;
    transform: none;
  }
  .roadmap-item.left,
  .roadmap-item.right {
    margin-left: 2.5rem;
    margin-right: 0;
  }
  .roadmap-item::before {
    left: -22px;
  }
  .roadmap-item::after {
    left: -2px;
    right: auto;
    width: 24px;
  }
}

@media (max-width: 575.98px) {
  .roadmap-flow {
    margin-top: 2rem;
    padding-top: 1.25rem;
  }
  .roadmap-item { margin-bottom: 2.25rem; }
}

/* ================== BETTER LAUNCH STATUS CARD ================== */

/* Remove the solid red panel look */
.launch-box {
  border-radius: 20px;
  border: 1px solid #fee2e2;
  box-shadow: 0 18px 40px rgba(15,23,42,.08);
}

/* Specific tweaks for the status card */
.roadmap-status {
  position: relative;
  padding: 1.75rem 2rem;
}

.roadmap-status::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 0% 0%, rgba(248,113,113,.11), transparent 55%),
    radial-gradient(circle at 100% 100%, rgba(248,113,113,.09), transparent 55%);
  opacity: 1;
  pointer-events: none;
  z-index: 0;
}

/* Put content above the background effect */
.roadmap-status .row > [class^="col-"] {
  position: relative;
  z-index: 1;
}

/* Typography / colors */
.roadmap-status h3,
.roadmap-status h4 {
  color: #b91c1c;          /* deep red for headings */
}



.roadmap-status-list {
  margin-bottom: .35rem;
}

@media (max-width: 767.98px) {
  .roadmap-status {
    padding: 1.5rem 1.25rem;
    text-align: left;
  }
}

/* ================== ROADMAP RESPONSIVE FIXES ================== */

/* base tweaks: make cards a bit narrower on large screens */
.roadmap-flow {
  max-width: 960px;
  margin: 3rem auto 0;
  padding: 2rem 0 1rem;
}

.roadmap-item {
  width: 46%;                /* less than half – more room in the middle */
  margin-bottom: 2.5rem;
}

/* ---------- Tablet & down: full-width cards ---------- */
@media (max-width: 1199.98px) {
  .roadmap-item {
    width: 100%;
    padding: 1rem 1.15rem;
  }

  /* put the vertical line on the left */
  .roadmap-line {
    left: 18px;
    transform: none;
  }

  /* all items align from left, with margin so line is visible */
  .roadmap-item.left,
  .roadmap-item.right {
    margin-left: 2.75rem;
    margin-right: 0;
    padding-left: 1.25rem;
    padding-right: 1rem;
  }

  /* connector dot sits on the line */
  .roadmap-item::before {
    left: -23px;
    right: auto;
  }

  /* dotted connector shortened */
  .roadmap-item::after {
    left: -3px;
    right: auto;
    width: 22px;
  }
}

/* ---------- Small phones: tighter spacing ---------- */
@media (max-width: 575.98px) {
  .roadmap-flow {
    margin-top: 2rem;
    padding-top: 1.25rem;
  }
  .roadmap-item {
    margin-bottom: 2rem;
  }
}
/* ======= ROADMAP MOBILE FIX: NO HORIZONTAL CUT-OFF ======= */

/* make sure the section itself never shows horizontal scroll */
.roadmap-section {
    overflow-x: hidden;
}

/* tablet & down */
@media (max-width: 1199.98px) {
    .roadmap-flow {
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    /* width + left margin must stay <= 100% */
    .roadmap-item {
        width: calc(100% - 3rem);   /* 3rem ≈ left margin below */
        margin-left: 2.75rem;
        margin-right: 0;
        padding-left: 1.25rem;
        padding-right: 1.1rem;
    }
}

/* small phones: a bit less margin so there’s even more room */
@media (max-width: 575.98px) {
    .roadmap-item {
        width: calc(100% - 2.25rem);
        margin-left: 2.25rem;
        margin-right: 0;
    }
}

/* ======= MOBILE / TABLET ROADMAP: ONE STRAIGHT BULLET LINE ======= */
@media (max-width: 991.98px) {

  /* vertical red line fixed on the left */
  .roadmap-line {
    left: 32px;          /* position of the spine from container edge */
    transform: none;
  }

  /* ALL items share the same layout on small screens */
  .roadmap-item,
  .roadmap-item.left,
  .roadmap-item.right {
    width: calc(100% - 64px);  /* 64px = margin-left below */
    margin-left: 64px;         /* shift card to the right of the line */
    margin-right: 0;
    padding-left: 1.25rem;
    padding-right: 1.1rem;
  }

  /* Bullet (circle) – perfectly centred on the red line */
  .roadmap-item::before,
  .roadmap-item.left::before,
  .roadmap-item.right::before {
    left: -39px;      /* 64 + 7 - 32 = 39 (margin + radius – line offset) */
    right: auto;
  }

  /* Hide blue dotted connectors on mobile for a clean look */
  .roadmap-item::after,
  .roadmap-item.left::after,
  .roadmap-item.right::after {
    content: none !important;
    display: none !important;
  }
}

/* Extra tiny phones – slightly less left margin, keep alignment */
@media (max-width: 575.98px) {
  .roadmap-item,
  .roadmap-item.left,
  .roadmap-item.right {
    width: calc(100% - 56px);
    margin-left: 56px;
  }

  .roadmap-line {
    left: 28px;
  }

  .roadmap-item::before,
  .roadmap-item.left::before,
  .roadmap-item.right::before {
    left: -35px;      /* 56 + 7 - 28 = 35 */
  }
}
/* ===== OWNER CAROUSEL – CARD LOOK & IMAGE FIT ===== */

.owner-carousel {
  background: #f9fafb;
  border-radius: 24px;
  padding: 1.5rem 1.5rem 2.25rem;
  box-shadow: 0 18px 40px rgba(15,23,42,.08);
}

.owner-carousel .swiper-slide {
  display: flex;
  justify-content: center;
}

.owner-media {
  max-width: 720px;              /* keeps image nicely centered */
  width: 100%;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(15,23,42,.16);
  background: #000;              /* no gray gaps if image ratio is odd */
}

.owner-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;             /* always fills frame nicely */
}

/* ===== OWNER CAROUSEL – ARROW BUTTONS ===== */

.owner-nav {
  margin-top: 1.5rem;
}

/* base style for both buttons */
.owner-nav .btn {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  padding: 0;
  font-size: 1.4rem;             /* bigger ‹ › symbols */
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #ffffff;
  box-shadow: 0 10px 24px rgba(15,23,42,.35);
  color: #ffffff;
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

/* left button – brand red */
.owner-prev {
  background-color: var(--brand);
}

/* right button – dark navy for contrast */
.owner-next {
  background-color: #111827;
}

/* hover / focus */
.owner-nav .btn:hover,
.owner-nav .btn:focus {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(15,23,42,.45);
  opacity: .95;
}

/* disabled state (when swiper blocks navigation) */
.owner-nav .swiper-button-disabled {
  opacity: .45;
  box-shadow: none;
}

/* mobile: bring buttons a bit closer to card */
@media (max-width: 575.98px) {
  .owner-carousel {
    padding: 1rem 1rem 1.75rem;
    border-radius: 18px;
  }
  .owner-nav {
    margin-top: 1.1rem;
  }
}
/* ================= NAVBAR FIX ================= */

.custom-nav {
  background: #000;
  padding: 0.75rem 0;
}

.nav-logo {
  height: 44px;
  width: auto;
}

.navbar-nav .nav-link {
  color: #fff !important;
  font-size: 1.05rem;
  font-weight: 500;
  padding: 0.5rem 1rem !important;
  white-space: nowrap;       /* prevents wrapping */
}

/* Reduce gap — your current gaps are too large */
.nav-gap {
  gap: 1.25rem;              /* keep in one line */
}

/* For extra large screens → increase gap slightly */
@media (min-width: 1400px) {
  .nav-gap {
    gap: 1.75rem;
  }
}

/* On tablets/phones — full width menu */
@media (max-width: 991.98px) {
  .navbar-collapse {
    background: #000;
    padding: 1rem 1.25rem;
  }
  .nav-gap {
    gap: 0.75rem;
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Keep everything single-line on desktop */
@media (min-width: 992px) {
  .navbar-nav {
    flex-wrap: nowrap !important;
  }
}

/* ========= NAV LOGO VISIBILITY FIX ========= */

/* Bigger, crisp logo by default */
.navbar-brand .nav-logo,
.navbar-brand img {
    height: auto;
    max-height: 3.2rem;        /* ~52px – adjust if you want larger */
    width: auto;
}

/* When scrolled up, keep it visible instead of shrinking too much */
.scrolled-up .navbar-brand .nav-logo,
.scrolled-up .navbar-brand img {
    max-height: 2.8rem;        /* instead of 2rem from old rule */
}

/* Give the logo a bit of breathing room on the left */
.navbar-brand {
    padding-right: 1.5rem;
}

/* Make background slightly lighter so logo pops more */
.custom-nav {
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0.95),
        rgba(5,16,40,0.9)
    );
}

/* Optional: subtle glow so it stands out on dark background */
.navbar-brand .nav-logo,
.navbar-brand img {
    filter: drop-shadow(0 0 4px rgba(0,0,0,0.7));
}

.blog-tag {
  display: inline-block;
  padding: 0.2rem 0.7rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: #f1f5f9;
  color: #64748b;
}
.blog-card {
  background: #ffffff;
  border-radius: 1.5rem;
  padding: 1.5rem;
  position: relative;
  display: flex;
  flex-direction: column;
}

.blog-image img {
  object-fit: cover;
}

.blog-tag {
  display: inline-block;
  padding: 0.2rem 0.7rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: #e5edf7;
  color: #64748b;
}
/* Blog nav buttons */
.blog-nav-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
  color: #ffffff;
}

.blog-nav-btn-red {
  background: #c00000; /* Raj red */
}

.blog-nav-btn-dark {
  background: #050b1f; /* deep navy */
}

.blog-nav-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.35);
}

.blog-nav-btn:active {
  transform: translateY(0);
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.2);
}

/* hide any leftover pagination dots if present */
.blog-pagination {
  display: none !important;
}

.display-6 , .display-5{
  color: #fff !important;
}
.text-white-50{
  color: #fff !important;
}
/* Base badge styling */
.status-badge {
  display: inline-block;
  padding: 8px 22px;
  border-radius: 40px;
  font-weight: 600;
  font-size: 15px;
  background: #ffffff;
  position: relative;
  z-index: 1;
  overflow: hidden;
  white-space: nowrap;
}

/* Flowing animated border (only border, not inside) */
.flow-border::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 2px; /* Border thickness */
  background: linear-gradient(
    120deg,
    rgba(200, 16, 46, 0.9),
    rgba(255, 85, 85, 0.6),
    rgba(200, 16, 46, 0.9)
  );
  background-size: 200% 200%;
  animation: borderGlow 6s ease infinite;
  -webkit-mask: 
      linear-gradient(#fff 0 0) content-box, 
      linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  z-index: -1;
}

@media (max-width: 575.98px) {
  .status-badge {
    font-size: 13px;         /* slightly smaller text on mobile */
    padding: 6px 16px;       /* reduce padding so the chip fits */
  }
}

/* Soft glow effect around border */
.flow-border::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(
    rgba(200, 16, 46, 0.35),
    transparent 70%
  );
  opacity: 0;
  animation: softGlow 3s ease-in-out infinite;
  z-index: -2;
}

/* Border movement animation */
@keyframes borderGlow {
  0% {
    background-position: 0% 0%;
  }
  50% {
    background-position: 150% 150%;
  }
  100% {
    background-position: 0% 0%;
  }
}

/* Gentle glow pulsing */
@keyframes softGlow {
  0% {
    opacity: 0.05;
  }
  50% {
    opacity: 0.25;
  }
  100% {
    opacity: 0.05;
  }
}

.img-size{
  height: 255px !important;
}

/* SAFARI NAVBAR FIX – always keep navbar visible */
.navbar {
  transform: translateY(0) !important;
}

/* If JS adds scrolled-down, neutralize it */
.scrolled-down {
  transform: translateY(0) !important;
}

/* Make sure it’s definitely above everything */
.navbar,
.custom-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}

/* Solid background fallback (also helps with readability) */
@supports not ((backdrop-filter: blur(10px))) {
  .navbar,
  .custom-nav {
    background-color: rgba(0, 0, 0, 0.95) !important;
  }
}