:root{
  --velora-ink:#0b1020;
  --velora-navy:#0a132b;
  --velora-gold:#caa86a;
  --velora-rose:#ff4d6d;
  --velora-violet:#6d5efc;
  --velora-cyan:#27c2ff;
}

.bg-velora{
  background:
    radial-gradient(1200px 600px at 10% 0%, rgba(109,94,252,.18) 0%, rgba(255,255,255,0) 55%),
    radial-gradient(900px 500px at 85% 10%, rgba(39,194,255,.16) 0%, rgba(255,255,255,0) 60%),
    radial-gradient(800px 500px at 40% 85%, rgba(255,77,109,.10) 0%, rgba(255,255,255,0) 60%),
    linear-gradient(180deg, #ffffff 0%, #f5f6fb 100%);
}
.bg-glass{ background: rgba(255,255,255,.78) !important; backdrop-filter: blur(10px); }
.hero-velora{
  background:
    radial-gradient(900px 500px at 10% 20%, rgba(202,168,106,0.22) 0%, rgba(255,255,255,0) 60%),
    radial-gradient(900px 500px at 80% 10%, rgba(109,94,252,0.16) 0%, rgba(255,255,255,0) 60%);
}
.brand-wordmark{ letter-spacing:.14em; font-weight:800; color:var(--velora-ink); font-size:.98rem; }
.brand-sub{ letter-spacing:.28em; font-size:.66rem; }
.btn-velora{ background: linear-gradient(135deg, var(--velora-navy), var(--velora-violet)); border: none; color: white; }
.btn-velora:hover{ filter: brightness(1.05); color:white; }
.accent-a{ background: linear-gradient(135deg, rgba(39,194,255,.10), rgba(255,255,255,.92)); }
.accent-b{ background: linear-gradient(135deg, rgba(109,94,252,.12), rgba(255,255,255,.92)); }
.accent-c{ background: linear-gradient(135deg, rgba(255,77,109,.10), rgba(255,255,255,.92)); }
.rounded-5{ border-radius: 1.6rem !important; }
.hover-rise{ transition: transform .15s ease, box-shadow .15s ease; }
.hover-rise:hover{ transform: translateY(-2px); box-shadow: 0 18px 40px rgba(2,6,23,.10) !important; }
.footer-link{ color:#111827; text-decoration:none; }
.footer-link:hover{ text-decoration:underline; }

.bg-soft{ background: radial-gradient(1200px 600px at 10% 0%, var(--velora-mist) 0%, #f7f7fb 45%, #f3f4f6 100%); }
.hero-gradient{
  background: radial-gradient(900px 500px at 10% 20%, rgba(202,168,106,0.20) 0%, rgba(255,255,255,0) 60%),
              radial-gradient(900px 500px at 80% 10%, rgba(79,70,229,0.14) 0%, rgba(255,255,255,0) 60%),
              linear-gradient(180deg, #ffffff 0%, #f5f6fb 100%);
}
.brand-wordmark{ letter-spacing:.14em; font-weight:700; color:var(--velora-ink); }
.btn-velora{ background: linear-gradient(135deg, var(--velora-navy), #2d2a76); border:none; color:white; }
.btn-velora:hover{ filter:brightness(1.05); color:white; }
.rounded-5{ border-radius:1.6rem; }
.footer-link{ color:#111827; text-decoration:none; }
.footer-link:hover{ text-decoration:underline; }



/* ===== VÉLORA Color Pack (v3+) ===== */
:root{
  --velora-sun:#ffcc66;
  --velora-mint:#2ee6a6;
  --velora-sky:#5bd6ff;
  --velora-lilac:#b9a8ff;
  --velora-ink2:#0f172a;
}

.hero-velora{
  position: relative;
  overflow: hidden;
}
.hero-velora::before{
  content:"";
  position:absolute;
  inset:-120px;
  background:
    radial-gradient(600px 420px at 15% 20%, rgba(255,204,102,.35) 0%, rgba(255,255,255,0) 60%),
    radial-gradient(700px 480px at 75% 10%, rgba(46,230,166,.22) 0%, rgba(255,255,255,0) 62%),
    radial-gradient(700px 520px at 70% 85%, rgba(91,214,255,.18) 0%, rgba(255,255,255,0) 60%),
    radial-gradient(700px 520px at 25% 90%, rgba(185,168,255,.18) 0%, rgba(255,255,255,0) 60%);
  filter: blur(1px);
  z-index:0;
}
.hero-velora > .container{ position:relative; z-index:1; }

.navbar .nav-link{
  border-radius: 999px;
  padding: .45rem .75rem;
}
.navbar .nav-link:hover{
  background: rgba(15,23,42,.06);
}
.navbar .btn{
  border-radius: 999px;
}

/* gradient outline cards */
.card.velora-outline{
  background: rgba(255,255,255,.82);
  border: 1px solid rgba(15,23,42,.06);
  position: relative;
}
.card.velora-outline::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,77,109,.35), rgba(91,214,255,.30), rgba(109,94,252,.35));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events:none;
}

.badge.velora-badge{
  background: linear-gradient(135deg, rgba(10,19,43,.96), rgba(109,94,252,.95));
  color: #fff;
  border: none;
}
.badge.velora-soft{
  background: rgba(109,94,252,.10);
  border: 1px solid rgba(109,94,252,.18);
  color: var(--velora-ink2);
}

.section-title{
  display:flex;
  align-items:center;
  gap:.65rem;
  margin-bottom: .5rem;
}
.section-title .dot{
  width:.7rem; height:.7rem; border-radius:999px;
  background: linear-gradient(135deg, var(--velora-rose), var(--velora-cyan), var(--velora-violet));
  box-shadow: 0 12px 30px rgba(2,6,23,.14);
}
.section-title h2, .section-title h1{
  margin:0;
}

.btn-dark{
  box-shadow: 0 16px 30px rgba(2,6,23,.14);
}
.btn-outline-dark:hover{
  box-shadow: 0 16px 30px rgba(2,6,23,.10);
}

footer{
  background:
    radial-gradient(900px 380px at 10% 10%, rgba(255,204,102,.18) 0%, rgba(255,255,255,0) 60%),
    radial-gradient(900px 380px at 80% 0%, rgba(91,214,255,.12) 0%, rgba(255,255,255,0) 60%),
    #ffffff;
}

/* subtle animated shimmer for premium feel */
@media (prefers-reduced-motion: no-preference){
  .shimmer{
    background-size: 200% 200%;
    animation: shimmerMove 9s ease-in-out infinite;
  }
  @keyframes shimmerMove{
    0%{ background-position: 0% 50%; }
    50%{ background-position: 100% 50%; }
    100%{ background-position: 0% 50%; }
  }
}

/* stronger page tint */
.container .card{ background-color: rgba(255,255,255,.86); }







/* ===== VÉLORA Dark Retheme (consistent contrast) ===== */
:root{
  --velora-bg0:#050814;
  --velora-bg1:#070b1a;
  --velora-surface:#0b1022;
  --velora-surface2:#0f1833;
  --velora-border:rgba(255,255,255,.10);

  /* Softer typography */
  --velora-title: rgba(245,247,255,.92);
  --velora-text:  rgba(220,226,255,.82);
  --velora-muted: rgba(220,226,255,.62);
  --velora-link:  rgba(170,185,255,.92);
}

body.bg-velora{
  color: var(--velora-text);
  background:
    radial-gradient(1100px 650px at 12% 0%, rgba(109,94,252,.30) 0%, rgba(5,8,20,0) 55%),
    radial-gradient(900px 560px at 88% 10%, rgba(39,194,255,.20) 0%, rgba(5,8,20,0) 60%),
    radial-gradient(900px 560px at 50% 95%, rgba(255,77,109,.14) 0%, rgba(5,8,20,0) 62%),
    linear-gradient(180deg, var(--velora-bg0) 0%, var(--velora-bg1) 100%);
}

h1,h2,h3,h4,h5,h6{ color: var(--velora-title) !important; }
p,li,label,small,td,th{ color: var(--velora-text); }
.text-muted, .form-text{ color: var(--velora-muted) !important; }

a{ color: var(--velora-link); }
a:hover{ color: rgba(245,247,255,.98); }

.bg-glass{
  background: rgba(8,12,26,.72) !important;
  border-bottom: 1px solid var(--velora-border) !important;
  backdrop-filter: blur(14px);
}
.navbar .nav-link{
  color: rgba(220,226,255,.74) !important;
  border-radius: 999px;
  padding: .45rem .75rem;
}
.navbar .nav-link:hover{
  background: rgba(255,255,255,.06) !important;
  color: rgba(245,247,255,.92) !important;
}

.dropdown-menu{
  background: rgba(10,16,34,.98) !important;
  border: 1px solid var(--velora-border) !important;
}
.dropdown-item{ color: rgba(220,226,255,.84) !important; }
.dropdown-item:hover{ background: rgba(255,255,255,.08) !important; }

.card, .card.velora-outline{
  background: linear-gradient(180deg, rgba(15,24,51,.92), rgba(11,16,34,.92)) !important;
  border: 1px solid var(--velora-border) !important;
  color: var(--velora-text) !important;
}
.card .text-muted{ color: var(--velora-muted) !important; }

/* Buttons */
.btn-velora{
  background: linear-gradient(135deg, rgba(109,94,252,.95), rgba(39,194,255,.85)) !important;
  border: none !important;
  color: rgba(245,247,255,.95) !important;
  box-shadow: 0 18px 40px rgba(0,0,0,.45);
}
.btn-velora:hover{ filter: brightness(1.06); }

.btn-dark{
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: rgba(245,247,255,.92) !important;
}
.btn-dark:hover{ background: rgba(255,255,255,.16) !important; }

.btn-outline-dark{
  border-color: rgba(255,255,255,.22) !important;
  color: rgba(220,226,255,.86) !important;
}
.btn-outline-dark:hover{
  background: rgba(255,255,255,.10) !important;
}

.form-control, .form-select{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: rgba(220,226,255,.88) !important;
}
.form-control::placeholder{ color: rgba(220,226,255,.48) !important; }

.table, .table *{ color: rgba(220,226,255,.86) !important; }
.table-light{ --bs-table-bg: rgba(255,255,255,.04); }

footer{
  color: rgba(220,226,255,.72);
  background:
    radial-gradient(900px 420px at 10% 10%, rgba(255,204,102,.10) 0%, rgba(5,8,20,0) 60%),
    radial-gradient(900px 420px at 85% 0%, rgba(91,214,255,.12) 0%, rgba(5,8,20,0) 60%),
    linear-gradient(180deg, rgba(5,8,20,.0) 0%, rgba(5,8,20,.90) 100%) !important;
  border-top: 1px solid var(--velora-border);
}
.footer-link{ color: rgba(220,226,255,.80) !important; }
.footer-link:hover{ color: rgba(245,247,255,.98) !important; }

/* Remove any “pure white” utility surprises */
.text-white, .text-white *{ color: var(--velora-title) !important; }
.text-white-50, .text-white-50 *{ color: var(--velora-muted) !important; }



/* ===== VÉLORA Final Contrast Fix (highest priority) ===== */
body.bg-velora{
  background:
    radial-gradient(1100px 650px at 12% 0%, rgba(109,94,252,.34) 0%, rgba(5,8,20,0) 55%),
    radial-gradient(900px 560px at 88% 10%, rgba(39,194,255,.22) 0%, rgba(5,8,20,0) 60%),
    radial-gradient(900px 560px at 50% 95%, rgba(255,77,109,.16) 0%, rgba(5,8,20,0) 62%),
    linear-gradient(180deg, #050814 0%, #070b1a 100%) !important;
  color: rgba(220,226,255,.82) !important;
}

/* Hero: add dark glass panel behind text so it’s readable even if background is light/cached */
.hero-velora .hero-panel{
  background: rgba(5,8,20,.60);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 1.75rem;
  padding: 2.25rem 2rem;
  box-shadow: 0 24px 60px rgba(0,0,0,.40);
  backdrop-filter: blur(10px);
}

.hero-velora h1{ color: rgba(245,247,255,.92) !important; }
.hero-velora p{ color: rgba(220,226,255,.70) !important; }

/* Make “pill” label readable on dark */
.hero-velora .badge, .hero-velora .pill{
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: rgba(245,247,255,.90) !important;
}

/* Buttons in hero */
.hero-velora .btn-outline-dark{
  border-color: rgba(255,255,255,.22) !important;
  color: rgba(220,226,255,.86) !important;
}
.hero-velora .btn-outline-dark:hover{
  background: rgba(255,255,255,.10) !important;
}



/* ===== HERO DARK FIX (make hero always dark) ===== */
.hero-velora{
  background:
    radial-gradient(900px 520px at 12% 15%, rgba(109,94,252,.30) 0%, rgba(5,8,20,0) 58%),
    radial-gradient(850px 520px at 88% 20%, rgba(39,194,255,.20) 0%, rgba(5,8,20,0) 60%),
    radial-gradient(900px 560px at 55% 95%, rgba(255,77,109,.14) 0%, rgba(5,8,20,0) 62%),
    linear-gradient(180deg, #050814 0%, #070b1a 100%) !important;
  color: rgba(220,226,255,.86) !important;
}
/* Kill any old light hero overlay from earlier packs */
.hero-velora::before{ display:none !important; }
.hero-velora h1{ color: rgba(245,247,255,.92) !important; }
.hero-velora p{ color: rgba(220,226,255,.70) !important; }

/* Left hero copy panel (optional but improves readability) */
.hero-velora .hero-panel{
  background: rgba(5,8,20,.35);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 1.75rem;
  padding: 2.25rem 2rem;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
}



/* ===== HERO GRADIENT DARK OVERRIDE (actual homepage class) ===== */
.hero-gradient{
  background:
    radial-gradient(900px 520px at 12% 15%, rgba(109,94,252,.30) 0%, rgba(5,8,20,0) 58%),
    radial-gradient(850px 520px at 88% 20%, rgba(39,194,255,.20) 0%, rgba(5,8,20,0) 60%),
    radial-gradient(900px 560px at 55% 95%, rgba(255,77,109,.14) 0%, rgba(5,8,20,0) 62%),
    linear-gradient(180deg, #050814 0%, #070b1a 100%) !important;
  color: rgba(220,226,255,.86) !important;
  position: relative;
}
.hero-gradient h1{ color: rgba(245,247,255,.92) !important; }
.hero-gradient p{ color: rgba(220,226,255,.70) !important; }

/* Ensure left content panel stays readable */
.hero-gradient .hero-panel{
  background: rgba(5,8,20,.35);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 1.75rem;
  padding: 2.25rem 2rem;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
  backdrop-filter: blur(10px);
}



/* ===== FOOTER DARK OVERRIDE ===== */
footer, .site-footer{
  background: linear-gradient(180deg, rgba(5,8,20,.65) 0%, rgba(5,8,20,.92) 100%) !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
  color: rgba(220,226,255,.72) !important;
}
footer a, .site-footer a{ color: rgba(170,185,255,.92) !important; }
footer a:hover, .site-footer a:hover{ color: rgba(245,247,255,.98) !important; }
footer .text-muted, .site-footer .text-muted{ color: rgba(220,226,255,.58) !important; }

/* If any sections use bg-light/bg-white, tone them down in dark theme */
body.bg-velora .bg-light,
body.bg-velora .bg-white{
  background: rgba(255,255,255,.03) !important;
}
body.bg-velora .border-top{
  border-top-color: rgba(255,255,255,.10) !important;
}



/* ===== VÉLORA Luxury Polish Pack (v4) ===== */

/* Typography refinement */
:root{
  --velora-title: rgba(245,247,255,.92);
  --velora-text:  rgba(220,226,255,.82);
  --velora-muted: rgba(220,226,255,.60);
  --velora-link:  rgba(170,185,255,.92);
}

h1.display-5{ letter-spacing: -0.02em; line-height: 1.05; }
.lead{ font-weight: 450; max-width: 52ch; }
.kicker{ letter-spacing: .18em; text-transform: uppercase; font-size: .72rem; color: var(--velora-muted); }

/* Luxury section wrapper */
.section{ padding: 4.5rem 0; }
.section .section-head{ display:flex; align-items:center; gap:.75rem; margin-bottom: 1.25rem; }
.section .section-head .dot{
  width:.75rem; height:.75rem; border-radius:999px;
  background: linear-gradient(135deg, rgba(255,77,109,.90), rgba(91,214,255,.85), rgba(109,94,252,.90));
  box-shadow: 0 18px 44px rgba(0,0,0,.35);
}
.section .section-head h2{ margin:0; font-size: 1.55rem; letter-spacing: -0.01em; }
.section .subhead{ color: var(--velora-muted); max-width: 68ch; }

/* Icon chip */
.icon-chip{
  width: 44px; height: 44px; border-radius: 14px;
  display:grid; place-items:center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 16px 34px rgba(0,0,0,.22);
}
.icon-chip svg{ width: 20px; height: 20px; opacity: .92; }

/* Card hover more premium */
.hover-rise{ transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.hover-rise:hover{
  transform: translateY(-3px);
  box-shadow: 0 24px 60px rgba(0,0,0,.40) !important;
  border-color: rgba(255,255,255,.16) !important;
}

/* Buttons */
.btn{ border-radius: 999px !important; }
.btn-velora{ box-shadow: 0 20px 48px rgba(0,0,0,.46); }
.btn-velora:active{ transform: translateY(1px); }

/* Subtle gradient drift */
@media (prefers-reduced-motion: no-preference){
  .lux-drift{ background-size: 180% 180%; animation: luxDrift 12s ease-in-out infinite; }
  @keyframes luxDrift{
    0%{ background-position: 0% 50%; }
    50%{ background-position: 100% 50%; }
    100%{ background-position: 0% 50%; }
  }

  /* === Showroom cinematic section === */
.showroom-hero{
  position: relative;
  border-radius: 2rem;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 30px 80px rgba(0,0,0,.45);
}

.showroom-hero img{
  width: 100%;
  height: min(62vh, 640px);
  object-fit: cover;
  display: block;
  transform: scale(1.02);
}

.showroom-hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 420px at 20% 30%, rgba(109,94,252,.22) 0%, rgba(0,0,0,0) 55%),
    radial-gradient(900px 420px at 80% 20%, rgba(39,194,255,.18) 0%, rgba(0,0,0,0) 55%),
    linear-gradient(90deg, rgba(5,8,20,.85) 0%, rgba(5,8,20,.35) 50%, rgba(5,8,20,.10) 100%);
}

.showroom-content{
  position:absolute;
  left: clamp(1rem, 5vw, 3rem);
  bottom: clamp(1rem, 5vw, 3rem);
  max-width: 52ch;
  z-index: 2;
}

.showroom-kicker{
  display:inline-block;
  padding:.35rem .7rem;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(245,247,255,.90);
  font-size: .78rem;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.showroom-title{
  margin: .75rem 0 .5rem;
  color: rgba(245,247,255,.94);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.showroom-sub{
  color: rgba(220,226,255,.72);
  margin-bottom: 1.25rem;
}



}