/* === Landing Page Styles — Eleganz === */
:root { --brand:#16a9e0; --brand-2:#273781; --ink:#0b1320; --topbar-h:0px; }

/* Base tweaks */
body { padding-top: 0; }
.navbar-brand img { height: 38px; }

/* ---------- Floating WhatsApp ---------- */
.whatsapp-float{
  position: fixed; right: 18px; bottom: 18px; z-index: 1050;
  width: 58px; height: 58px; border-radius: 50%;
  background: #25D366; color: #fff; display: flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .25); text-decoration: none;
  transition: transform .15s ease, filter .2s ease;
}
.whatsapp-float:hover{ transform: translateY(-2px); filter: brightness(.95); }
.whatsapp-float .bi{ font-size: 1.8rem; line-height: 1; }

/* ---------- Hero (original) ---------- */
.hero{
  position: relative; min-height: 72vh; display: grid; place-items: center;
  color: #fff; text-align: left; overflow: hidden; border-radius: 1rem;
}
.hero::before{
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(11, 19, 32, .6), rgba(11, 19, 32, .45));
}
.hero .hero-bg{
  position: absolute; inset: 0; background-position: center; background-size: cover;
  transform: scale(1.02); filter: brightness(.9);
}
.hero .hero-content{ position: relative; z-index: 2; }

/* ---------- Hero (enhanced) ---------- */
.hero--eleganz{
  position: relative; min-height: 76vh; border-radius: 1rem; overflow: hidden;
  display: grid; align-items: center;
}
.hero--eleganz .bg{
  position: absolute; inset: 0; background: center/cover no-repeat;
  transform: scale(1.02); filter: brightness(.9);
}
.hero--eleganz .overlay{
  position: absolute; inset: 0; z-index: 1;
  background:
    radial-gradient(60rem 30rem at 70% -10%, rgba(15, 76, 129, .45), transparent 60%),
    linear-gradient(180deg, rgba(11, 19, 32, .60), rgba(11, 19, 32, .35));
}
.hero--eleganz .content{ position: relative; z-index: 2; }
.hero--eleganz .kicker{
  background: #eef6ff; color: var(--brand); font-weight: 700;
  display: inline-block; padding: .35rem .75rem; border-radius: 999px; font-size: .9rem;
}
.hero--eleganz .title{ line-height: 1.1; letter-spacing: .2px; }
.hero--eleganz .sub{ color: #e9eef5; max-width: 56ch; }
.hero-facts{ gap: 1rem; margin-top: 1.25rem; }
.hero-facts .pill{
  backdrop-filter: blur(6px); background: rgba(255, 255, 255, .12);
  border: 1px solid rgba(255, 255, 255, .25); color:#fff; border-radius: 999px;
  padding: .5rem .9rem; font-size: .925rem; display: flex; align-items: center; gap: .4rem;
}
/* optional decorative wave */
.hero--eleganz .wave{
  position: absolute; left: 0; right: 0; bottom: -1px; height: 80px; z-index: 2;
}
@media (max-width: 768px){
  .hero--eleganz{ min-height: 64vh; }
  .hero--eleganz .title{ font-size: calc(1.5rem + 1.2vw); }
}

/* ---------- Buttons ---------- */
.btn-cta{
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  border: 0; box-shadow: 0 10px 24px rgba(15, 76, 129, .25);
}
.btn-cta:hover{ opacity: .95; }

/* ---------- Sections ---------- */
.section-title{ font-weight: 800; color: var(--ink); }
.section-sub{ color: #6b7280; max-width: 780px; }

.feature-card{
  border: 0; border-radius: 1rem;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .06);
  transition: transform .25s ease, box-shadow .25s ease; height: 100%;
}
.feature-card:hover{ transform: translateY(-4px); box-shadow: 0 18px 36px rgba(0, 0, 0, .08); }
.feature-card .bi{ font-size: 2rem; color: var(--brand); }

.kpis{
  background: linear-gradient(90deg, #0f4c81, #0a6d8b);
  color: #fff; border-radius: 1rem;
}
.kpi>.num{ font-size: 2rem; font-weight: 800; }
.kpi>.lbl{ opacity: .9; }

.why li::marker{ color: var(--brand); }

.cta-strip{
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
  color:#fff; border-radius:1rem;
}

.testimonial{
  background:#fff; border:0; border-radius:1rem;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}
.faq .accordion-button:not(.collapsed){ background:#eff6ff; color:#0b1320; }

.badge-soft{
  background:#eef6ff; color:var(--brand);
  border-radius:999px; padding:.35rem .75rem; font-weight:600;
}

/* helpers */
.xgap{ gap: 1.25rem; }

/* ---------- Gallery ---------- */
.gallery-grid{
  display: grid; grid-template-columns: repeat(12, 1fr); gap: 12px;
}
.gallery-grid .tile{
  position: relative; overflow: hidden; border-radius: 14px;
  box-shadow: 0 8px 20px rgba(0,0,0,.08); aspect-ratio: 16/10;
}
.gallery-grid .tile img{
  width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease;
}
.gallery-grid .tile:hover img{ transform: scale(1.04); }

/* sizes */
.tile.span-6{ grid-column: span 6; }
.tile.span-4{ grid-column: span 4; }
.tile.span-3{ grid-column: span 3; }
@media (max-width: 992px){
  .tile.span-6, .tile.span-4{ grid-column: span 6; }
  .tile.span-3{ grid-column: span 6; }
}
@media (max-width: 576px){ .tile{ grid-column: span 12; } }

/* --- Sticky navbar at top --- */
.navbar.sticky-top{ top: 0; z-index: 1030; }

/* --- Section spacing & container tweaks --- */
section.container{ scroll-margin-top: 64px; }
.section-title{ letter-spacing: .2px; }
.section-sub{ margin-top: .25rem; }

/* --- Service cards: nicer look --- */
.feature-card{
  border: 0; border-radius: 1rem;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .06);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  height: 100%; border: 1px solid rgba(15, 76, 129, .06);
}
.feature-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 18px 36px rgba(0, 0, 0, .10);
  border-color: rgba(22, 169, 224, .25);
}
.feature-card .bi{
  font-size: 1.9rem; color: #fff; width: 46px; height: 46px;
  display: inline-grid; place-items: center; border-radius:10px;
  background: linear-gradient(135deg, var(--brand), var(--brand-2));
}

/* --- Contact card polish --- */
.card.rounded-4{ border: 1px solid rgba(0, 0, 0, .06); }
/* ---------- Navbar (bigger + styles) ---------- */
.navbar-eleganz{
  background:#fff; border-bottom:1px solid rgba(0,0,0,.06);
  padding-top:.9rem; padding-bottom:.9rem; transition:padding .2s ease, box-shadow .2s ease;
}
.navbar-eleganz .navbar-brand img{ height:48px; transition:height .2s ease; }
@media (max-width: 420px){ .navbar-eleganz .navbar-brand img{ height:40px; } }

.navbar-eleganz .nav-link{
  padding:.75rem 1rem; font-weight:600; font-size:1.02rem; color:#1f2937;
  position: relative; /* needed for custom underlines */
}
.navbar-eleganz .nav-link:hover,
.navbar-eleganz .nav-link.active{ color:var(--brand-2); }

/* underline effect — exclude dropdown toggles so caret stays clean */
.navbar-eleganz .nav-link:not(.dropdown-toggle)::after{
  content:""; display:block; height:2px;
  background:linear-gradient(90deg,var(--brand),var(--brand-2));
  width:0; transition:width .2s ease; margin-top:6px;
}
.navbar-eleganz .nav-link:hover:not(.dropdown-toggle)::after,
.navbar-eleganz .nav-link.active:not(.dropdown-toggle)::after{ width:100%; }

/* dropdown menu styling */
.dropdown-menu{
  border-radius:.75rem; box-shadow:0 12px 28px rgba(0,0,0,.1);
  border:1px solid rgba(0,0,0,.06); padding:.5rem; min-width: 16rem;
}
.dropdown-header{ font-weight:700; color:#5b6b7a; }
.dropdown-item{ padding:.55rem .85rem; border-radius:.5rem; }
.dropdown-item:hover{
  background:linear-gradient(90deg,rgba(22,169,224,.08),rgba(39,55,129,.08));
}

/* keep the caret inline (to the SIDE) for dropdowns */
.navbar-eleganz .dropdown-toggle{ white-space:nowrap; }
.navbar-eleganz .dropdown-toggle::after{
  margin-left:.45rem; vertical-align:middle;
  border-top:.42em solid; border-right:.42em solid transparent;
  border-left:.42em solid transparent; border-bottom:0;
}

/* OPTIONAL: caret aligned at far right of the link area */
.navbar-eleganz .dropdown-toggle.caret-right{
  position:relative; padding-right:1.4rem; /* make room for caret on right */
}
.navbar-eleganz .dropdown-toggle.caret-right::after{
  position:absolute; right:.3rem; top:50%; transform:translateY(-50%); margin-left:0;
}

/* NEW: underline for dropdown tabs (Services / Industries) */
.navbar-eleganz .dropdown-toggle:hover::before,
.navbar-eleganz .dropdown-toggle.active::before{
  content:""; position:absolute; left:0; right:0; bottom:.35rem; height:2px;
  background:linear-gradient(90deg,var(--brand),var(--brand-2));
  pointer-events:none;
}
/* trim underline so it doesn't run under the far-right caret */
.navbar-eleganz .dropdown-toggle.caret-right:hover::before,
.navbar-eleganz .dropdown-toggle.caret-right.active::before{
  right:1.4rem; /* matches .caret-right padding-right */
}

/* Quote pill */
.btn-quote{
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  color:#fff; padding:.6rem 1.05rem; border-radius:999px; font-weight:700;
  box-shadow:0 10px 24px rgba(15,76,129,.2);
}
.btn-quote:hover{ color:#fff; opacity:.95; }

/* Shrink on scroll */
.navbar-eleganz.scrolled{
  padding-top:.55rem; padding-bottom:.55rem; box-shadow:0 6px 16px rgba(0,0,0,.06);
}
.navbar-eleganz.scrolled .navbar-brand img{ height:42px; }
