:root {
  --brand-cyan: #33BAE2;
  --brand-blue: #2A61BC;
  --brand-magenta: #C6287B;
  --brand-dark: #2B1930;
  --brand-light: #E6E9F3;


/* Senegal accents */
--senegal-green: #0B8F3A;
--senegal-yellow: #F7C600;
--senegal-red: #D62828;
--senegal-ink: #0b1220;
}

.btn-brand {
  /* Bootstrap button variables (so hover/active keep the right colors) */
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--brand-blue);
  --bs-btn-border-color: var(--brand-blue) !important;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #2F6BD0;
  --bs-btn-hover-border-color: var(--brand-blue) !important;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #24539F;
  --bs-btn-active-border-color: var(--brand-blue) !important;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--brand-blue);
  --bs-btn-disabled-border-color: var(--brand-blue) !important;

  background-color: var(--brand-blue) !important;
  border-color: var(--brand-blue) !important;
  color: #fff !important;
  opacity: 1 !important;
  transition: transform .15s ease, filter .15s ease, opacity .15s ease;
}

.btn-brand:hover,
.btn-brand:focus,
.btn-brand:active,
.btn-brand:focus-visible {
  opacity: 1 !important;
  background-color: var(--bs-btn-hover-bg) !important;
  border-color: var(--bs-btn-hover-border-color) !important;
  color: #fff !important;
  transform: translateY(-1px);
}

.btn-brand:disabled,
.btn-brand.disabled {
  opacity: .85 !important;
  filter: none;
  transform: none;
}


body {
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--brand-dark);
  background: linear-gradient(180deg, #fff 0%, rgba(230,233,243,.35) 45%, #fff 100%);
  min-height: 100vh;
}

/* Background blobs */
.bg-blob {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
}
.blob {
  position: absolute;
  border-radius: 9999px;
  filter: blur(56px);
  opacity: .25;
}
.blob.cyan { background: var(--brand-cyan); width: 24rem; height: 24rem; top: -8rem; left: -8rem; opacity: .30; }
.blob.blue { background: var(--brand-blue); width: 28rem; height: 28rem; top: 10rem; right: -6rem; opacity: .20; }
.blob.magenta { background: var(--brand-magenta); width: 32rem; height: 32rem; bottom: -10rem; left: 50%; transform: translateX(-50%); opacity: .15; }

/* Navbar */
.navbar-glass {
  background: rgba(255,255,255,.70);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

/* Soft shadow + large radius */
.shadow-soft { box-shadow: 0 10px 30px rgba(43,25,48,.10); }
.rounded-2xl { border-radius: 1.25rem; }
.rounded-3xl { border-radius: 1.5rem; }
.rounded-4xl { border-radius: 2rem; }

/* Noise header strip */
.noise {
  background-image: radial-gradient(circle at 1px 1px, rgba(255,255,255,.25) 1px, transparent 0);
  background-size: 18px 18px;
}

/* Buttons */
.btn-outline-muted { border-color: rgba(0,0,0,.10); }
.btn-outline-muted:hover { border-color: rgba(0,0,0,.18); background: rgba(255,255,255,.9); }

/* Pills/badges */
.badge-soft-cyan { background: rgba(51,186,226,.15); color: var(--brand-cyan); }
.badge-soft-blue { background: rgba(42,97,188,.15); color: var(--brand-blue); }
.badge-soft-magenta { background: rgba(198,40,123,.15); color: var(--brand-magenta); }
.badge-soft-neutral { background: rgba(0,0,0,.05); color: rgba(0,0,0,.70); }

/* Cards */
.card-glass { background: rgba(255,255,255,.70); border: 1px solid rgba(0,0,0,.05); }

/* Featured pricing card: avoid corner artifacts by using an inset border */
.pricing-featured{
  background: #fff !important;
  border: 2px solid transparent !important;
  border-radius: 2rem !important;
  overflow: hidden;
  /* keep existing soft shadow + add inset border */
  box-shadow: 0 10px 30px rgba(43,25,48,.10), inset 0 0 0 2px var(--brand-blue) !important;
}

/* Hero dashboard container */
.dashboard-wrap {
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(0,0,0,.05);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  overflow: hidden;
}

/* Banner gradient */
.banner-gradient {
  background: linear-gradient(90deg, var(--brand-blue) 0%, var(--brand-magenta) 100%);
  color: #fff;
}

/* Blur price like the mock */
.blur-price { filter: blur(5px); user-select: none; }

section { scroll-margin-top: 5rem; }

.text-brand-blue { color: var(--brand-blue) !important; }
.text-brand-cyan { color: var(--brand-cyan) !important; }
.text-brand-magenta { color: var(--brand-magenta) !important; }
.bg-brand-light { background: var(--brand-light) !important; }

/* Scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 600ms ease, transform 600ms ease;
  will-change: opacity, transform;
}
.reveal.is-revealed { opacity: 1; transform: translateY(0); }

/* Chatbot */
.chatbot-launcher {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 1055;
}
.chatbot-dot {
  width: 10px;
  height: 10px;
  border-radius: 9999px;
  background: rgba(255,255,255,1);
  box-shadow: 0 0 0 0 rgba(255,255,255,.7);
  animation: pulse 1.6s infinite;
  display: inline-block;
}
@keyframes pulse {
  0% { box-shadow: 0 0 0 0 rgba(255,255,255,.6); }
  70% { box-shadow: 0 0 0 10px rgba(255,255,255,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); }
}

.chatbot-widget {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: min(92vw, 360px);
  background: rgba(255,255,255,.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 1.75rem;
  overflow: hidden;
  z-index: 1056;
}
.chatbot-head {
  padding: 14px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: rgba(255,255,255,.75);
  border-bottom: 1px solid rgba(0,0,0,.06);
}
.chatbot-body {
  padding: 14px;
  max-height: 340px;
  overflow: auto;
  display: grid;
  gap: 10px;
}
.chat-msg {
  padding: 10px 12px;
  border-radius: 1rem;
  font-size: 14px;
  line-height: 1.35;
  max-width: 85%;
}
.chat-msg.bot {
  background: #fff;
  border: 1px solid rgba(0,0,0,.05);
  color: var(--brand-dark);
  justify-self: start;
}
.chat-msg.user {
  background: var(--brand-blue);
  color: #fff;
  justify-self: end;
}
.chatbot-actions {
  padding: 0 14px 12px 14px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.chatbot-foot {
  padding: 12px 14px;
  display: flex;
  gap: 8px;
  border-top: 1px solid rgba(0,0,0,.06);
  background: rgba(255,255,255,.75);
}
.chatbot-foot .form-control { border: 1px solid rgba(0,0,0,.10); }


/* Chatbot button focus fix (avoid blue spill / outline artifacts) */
.chatbot-launcher .btn-brand:focus,
.chatbot-launcher .btn-brand:focus-visible,
.chatbot-launcher .btn-brand:active {
  box-shadow: 0 10px 30px rgba(43,25,48,.10) !important;
  outline: none !important;
}


/* Featured products (carousel horizontal) */
.featured-track{
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
}
.featured-track::-webkit-scrollbar{ display:none; }
.featured-card{
  flex: 0 0 320px;
  scroll-snap-align: start;
  overflow: hidden;
}
@media (max-width: 576px){
  .featured-card{ flex-basis: 280px; }
}
.featured-img{
  position: relative;
  height: 150px;
  background: rgba(0,0,0,.05);
}
.featured-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}
.featured-img .badge{
  position:absolute;
  top: 12px;
  left: 12px;
}


/* Disable scroll-snap when autoplaying for a seamless infinite loop */
.featured-track.no-snap{ scroll-snap-type: none !important; }
.featured-track.no-snap .featured-card{ scroll-snap-align: none !important; }



/* Soft badges (Bootstrap helpers) */
.bg-brand-blue-soft{ background: rgba(54,99,196,.12) !important; }
.bg-brand-cyan-soft{ background: rgba(0,206,209,.14) !important; }
.bg-brand-magenta-soft{ background: rgba(227,73,154,.14) !important; }


/* Featured products font sizing (vitrine) */
.featured-card .h5{
  font-size: 1.05rem;
  line-height: 1.2;
}
@media (max-width: 576px){
  .featured-card .h5{ font-size: 1rem; }
}


/* Vitrine: details on one line */
.featured-meta{
  font-size: .78rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


/* Vitrine (featured) card layout */
.featured-track{
  scroll-behavior: smooth;
}
.featured-card{
  width: 360px;
  flex: 0 0 auto;
}
@media (max-width: 576px){
  .featured-card{ width: 320px; }
}
.tag-pill{
  display: inline-flex;
  align-items: center;
  padding: .35rem .75rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 600;
  background: rgba(225,233,243,.55);
  border: 1px solid rgba(0,0,0,.06);
  white-space: nowrap;
}
.kpi-box{
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 16px;
  background: rgba(255,255,255,.85);
  padding: .75rem .85rem;
}
.kpi-box .kpi-val{
  font-size: 1.25rem;
  line-height: 1.1;
}


/* Crisp snap + momentum scrolling */
.featured-card{
  scroll-snap-align: start;
  scroll-snap-stop: always;
}


/* ===== Senegal "vivant" add-ons ===== */
.scroll-progress{
  position: fixed;
  top: 0; left: 0;
  height: 3px;
  width: 0%;
  z-index: 9999;
  background: linear-gradient(90deg, var(--senegal-green), var(--senegal-yellow), var(--senegal-red));
  box-shadow: 0 6px 18px rgba(0,0,0,.12);
}

.bg-blobs{
  position: fixed;
  inset: -10vh -10vw auto -10vw;
  height: 60vh;
  pointer-events: none;
  z-index: 0;
  filter: blur(38px);
  opacity: .50;
}
.bg-blobs span{
  position: absolute;
  border-radius: 999px;
  width: 42vmax;
  height: 42vmax;
  animation: blobFloat 16s ease-in-out infinite;
  will-change: transform;
}
.bg-blobs span:nth-child(1){
  left: -10vmax; top: -14vmax;
  background: radial-gradient(circle at 30% 30%, rgba(11,143,58,.55), rgba(59,130,246,.15) 55%, transparent 70%);
}
.bg-blobs span:nth-child(2){
  left: 30vmax; top: -18vmax;
  animation-duration: 18s;
  background: radial-gradient(circle at 40% 40%, rgba(247,198,0,.45), rgba(236,72,153,.12) 55%, transparent 70%);
}
.bg-blobs span:nth-child(3){
  left: 58vmax; top: -6vmax;
  animation-duration: 20s;
  background: radial-gradient(circle at 40% 40%, rgba(214,40,40,.42), rgba(6,182,212,.12) 55%, transparent 70%);
}

@keyframes blobFloat{
  0%,100%{ transform: translate3d(0,0,0) scale(1); }
  33%{ transform: translate3d(2.5vmax, -1.6vmax, 0) scale(1.06); }
  66%{ transform: translate3d(-2.2vmax, 1.8vmax, 0) scale(0.98); }
}

/* Senegal pill */
.senegal-pill{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  padding:.35rem .65rem;
  border-radius:999px;
  background: linear-gradient(90deg, rgba(11,143,58,.16), rgba(247,198,0,.18), rgba(214,40,40,.16));
  border: 1px solid rgba(0,0,0,.06);
  color: rgba(0,0,0,.72);
  font-weight: 700;
  letter-spacing: .02em;
}

/* Stat cards */
.stat-card{
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(255,255,255,.75);
  border-radius: 1.6rem;
  padding: 1rem 1rem;
  box-shadow: 0 18px 50px rgba(12,18,32,.06);
  transition: transform .18s ease, box-shadow .18s ease;
}
.stat-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 26px 70px rgba(12,18,32,.10);
}
.stat-val{
  font-weight: 900;
  letter-spacing: -.02em;
  background: linear-gradient(90deg, var(--senegal-green), var(--brand-blue), var(--senegal-red));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Ticker */
.ticker{
  position: relative;
  overflow: hidden;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(255,255,255,.70);
}
.ticker__inner{
  display: flex;
  gap: 1.25rem;
  white-space: nowrap;
  padding: .6rem 1rem;
  animation: tickerMove 18s linear infinite;
}
.ticker:hover .ticker__inner{ animation-play-state: paused; }
@keyframes tickerMove{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

/* Ripple on brand buttons (JS adds span) */
.btn-ripple{
  position: relative;
  overflow: hidden;
}
.btn-ripple .ripple{
  position:absolute;
  border-radius:999px;
  transform: translate(-50%, -50%);
  animation: ripple 520ms ease-out forwards;
  background: rgba(255,255,255,.55);
  pointer-events:none;
}
@keyframes ripple{
  from{ width: 0; height: 0; opacity: .8; }
  to{ width: 520px; height: 520px; opacity: 0; }
}

@media (prefers-reduced-motion: reduce){
  .bg-blobs span, .ticker__inner{ animation: none !important; }
  html { scroll-behavior: auto; }
}


/* Section dots */
.section-dots{
  position: fixed;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 9998;
}
.section-dots a{
  width: 10px; height: 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.18);
  background: rgba(255,255,255,.65);
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.section-dots a:hover{ transform: scale(1.15); }
.section-dots a.active{
  background: linear-gradient(90deg, var(--senegal-green), var(--senegal-yellow), var(--senegal-red));
  border-color: rgba(0,0,0,.10);
  transform: scale(1.25);
}

/* Testimonials */
.t-track{
  display: flex;
  gap: 14px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding-bottom: 6px;
}
.t-card{
  flex: 0 0 auto;
  width: min(420px, 82vw);
  scroll-snap-align: start;
  border-radius: 1.6rem;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(255,255,255,.75);
  box-shadow: 0 18px 50px rgba(12,18,32,.06);
  padding: 14px 14px;
  transition: transform .18s ease, box-shadow .18s ease;
}
.t-card:hover{ transform: translateY(-2px); box-shadow: 0 26px 70px rgba(12,18,32,.10); }

/* ===== Mode nuit — amélioré (Bootstrap) ===== */
body.theme-dark{
  color-scheme: dark;
  background: radial-gradient(1100px 700px at 18% -12%, rgba(59,130,246,.18), transparent 62%),
              radial-gradient(900px 550px at 88% 6%, rgba(247,198,0,.14), transparent 55%),
              radial-gradient(850px 520px at 75% 90%, rgba(214,40,40,.10), transparent 60%),
              linear-gradient(180deg, #070B14, #0B1220);
  color: rgba(255,255,255,.92);
}

body.theme-dark .navbar-glass{
  background: rgba(10,16,28,.74) !important;
  border-color: rgba(255,255,255,.10) !important;
}

body.theme-dark .card-glass{
  background: rgba(17,24,39,.74) !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: 0 22px 70px rgba(0,0,0,.42) !important;
}

body.theme-dark .text-muted,
body.theme-dark .text-secondary{
  color: rgba(255,255,255,.62) !important;
}

body.theme-dark .border,
body.theme-dark .border-top,
body.theme-dark .border-bottom,
body.theme-dark .border-start,
body.theme-dark .border-end{
  border-color: rgba(255,255,255,.12) !important;
}

body.theme-dark .btn-outline-muted{
  border-color: rgba(255,255,255,.18) !important;
  color: rgba(255,255,255,.85) !important;
}
body.theme-dark .btn-outline-muted:hover{
  background: rgba(255,255,255,.08) !important;
}

body.theme-dark .accordion-item{
  background: rgba(17,24,39,.72) !important;
  border-color: rgba(255,255,255,.12) !important;
}
body.theme-dark .accordion-button{
  background: rgba(17,24,39,.55) !important;
  color: rgba(255,255,255,.90) !important;
}
body.theme-dark .accordion-button:not(.collapsed){
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.10) !important;
}
body.theme-dark .accordion-body{
  color: rgba(255,255,255,.72) !important;
}

body.theme-dark .form-control,
body.theme-dark .form-select{
  background: rgba(17,24,39,.72) !important;
  color: rgba(255,255,255,.92) !important;
  border-color: rgba(255,255,255,.14) !important;
}
body.theme-dark .form-control::placeholder{
  color: rgba(255,255,255,.45) !important;
}
body.theme-dark .form-control:focus,
body.theme-dark .form-select:focus{
  box-shadow: 0 0 0 4px rgba(247,198,0,.18) !important;
  border-color: rgba(247,198,0,.28) !important;
}

/* Blobs/decors : calmer en nuit */
body.theme-dark .hero-blobs{ opacity: .42; filter: blur(46px) saturate(0.9); }

/* Dots */
body.theme-dark .section-dots a{ background: rgba(17,24,39,.72); border-color: rgba(255,255,255,.18); }

/* Chat */
body.theme-dark .chat-panel{
  background: rgba(17,24,39,.92) !important;
  border-color: rgba(255,255,255,.12) !important;
}

/* Extra dark-mode text fixes (Bootstrap) */
body.theme-dark .text-dark{ color: rgba(255,255,255,.92) !important; }
body.theme-dark .link-dark{ color: rgba(147,197,253,.92) !important; }
body.theme-dark .link-dark:hover{ color: rgba(191,219,254,.98) !important; }
body.theme-dark .modal-content{
  background: rgba(17,24,39,.92) !important;
  border-color: rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,.92) !important;
}
body.theme-dark .modal-header,
body.theme-dark .modal-footer{
  border-color: rgba(255,255,255,.12) !important;
}

/* ===== Fix visibilité menu + cartes en mode nuit ===== */
body.theme-dark .navbar-glass{
  /* Bootstrap navbar variables */
  --bs-navbar-color: rgba(255,255,255,.82);
  --bs-navbar-hover-color: rgba(255,255,255,.95);
  --bs-navbar-active-color: rgba(255,255,255,.95);
  --bs-navbar-brand-color: rgba(255,255,255,.92);
  --bs-navbar-brand-hover-color: rgba(255,255,255,.98);
}

body.theme-dark .navbar-glass .nav-link{
  color: rgba(255,255,255,.82) !important;
}
body.theme-dark .navbar-glass .nav-link:hover,
body.theme-dark .navbar-glass .nav-link:focus{
  color: rgba(255,255,255,.96) !important;
}

body.theme-dark .navbar-toggler-icon{
  filter: invert(1) grayscale(1);
  opacity: .92;
}
body.theme-dark .navbar-toggler:focus{
  box-shadow: 0 0 0 4px rgba(247,198,0,.18) !important;
}

/* Cartes Bootstrap "classiques" (sinon texte blanc sur fond blanc) */
body.theme-dark .card:not(.card-glass){
  background: rgba(17,24,39,.74) !important;
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}
body.theme-dark .card:not(.card-glass) .text-muted{
  color: rgba(255,255,255,.62) !important;
}
body.theme-dark .shadow-sm{
  box-shadow: 0 18px 60px rgba(0,0,0,.40) !important;
}

/* Fonds utilitaires fréquents */
body.theme-dark .bg-white{
  background: rgba(17,24,39,.74) !important;
}

/* Titres lisibles en mode nuit (Bootstrap) */
body.theme-dark h1,
body.theme-dark h2,
body.theme-dark h3,
body.theme-dark h4,
body.theme-dark h5{
  color: rgba(255,255,255,.92) !important;
}
body.theme-dark .fw-extrabold{
  color: rgba(255,255,255,.92) !important;
}

/* Testimonials (Bootstrap) */
.testimonial-track{
  display:flex;
  gap:14px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width:none;
  padding: 6px 2px 2px;
}
.testimonial-track::-webkit-scrollbar{ display:none; }

.testimonial-card{
  scroll-snap-align:start;
  flex: 0 0 320px;
  border-radius: 22px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.86);
  box-shadow: 0 18px 60px rgba(12,18,32,.12);
  padding: 16px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
}
.testimonial-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 28px 90px rgba(12,18,32,.16);
}
.testimonial-stars{
  color: rgba(247,198,0,.98);
  filter: drop-shadow(0 6px 16px rgba(0,0,0,.20));
}
body.theme-dark .testimonial-card{
  background: rgba(17,24,39,.86);
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 22px 70px rgba(0,0,0,.42);
}
body.theme-dark .testimonial-card:hover{
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 34px 100px rgba(0,0,0,.55);
}

/* KPI blocks (Stock/Lot) */
.kpi-grid{ display:flex; gap:10px; }
.kpi-box{
  border-radius: 18px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.86);
  padding: 10px 12px;
}
.kpi-label{
  font-size: 11px;
  font-weight: 800;
  color: rgba(12,18,32,.62);
}
.kpi-value{
  margin-top: 4px;
  font-size: 16px;
  font-weight: 900;
  line-height: 1;
  color: rgba(12,18,32,.92);
}
body.theme-dark .kpi-box{
  background: rgba(17,24,39,.86);
  border-color: rgba(255,255,255,.12);
}
body.theme-dark .kpi-label{ color: rgba(255,255,255,.62); }
body.theme-dark .kpi-value{ color: rgba(255,255,255,.92); }

/* header shadow tweak (mode nuit) */
body.theme-dark header .shadow-soft{
  box-shadow: 0 12px 34px rgba(0,0,0,.26) !important;
}

/* dashboard-preview shadow removal in dark mode */
body.theme-dark .dashboard-preview{
  box-shadow: none !important;
}

/* Cookie consent UI (Bootstrap) */
.cookie-banner{
  position: fixed;
  left: 16px;
  right: 16px;
  bottom: 14px;
  z-index: 9999;
}
.cookie-banner-inner{
  display:flex;
  align-items:flex-start;
  justify-content: space-between;
  gap: 14px;
  border-radius: 22px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.86);
  backdrop-filter: blur(10px);
  padding: 14px;
  box-shadow: 0 18px 60px rgba(12,18,32,.12);
}
.cookie-banner-title{ font-weight: 900; }
.cookie-banner-desc{ margin-top: 4px; font-size: 13px; color: rgba(12,18,32,.62); line-height: 1.35; }
.cookie-banner-actions{ display:flex; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }

.cookie-modal-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.35);
  z-index: 10000;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding: 16px;
}
.cookie-modal{
  width: min(680px, 100%);
  border-radius: 24px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.94);
  backdrop-filter: blur(10px);
  box-shadow: 0 28px 90px rgba(12,18,32,.16);
  overflow:hidden;
}
.cookie-modal-head{ display:flex; align-items:center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid rgba(0,0,0,.08); }
.cookie-modal-title{ font-weight: 900; }
.cookie-modal-close{ border: 1px solid rgba(0,0,0,.10); background: rgba(255,255,255,.75); border-radius: 14px; padding: 6px 10px; }
.cookie-modal-body{ padding: 14px 16px; }
.cookie-row{ display:flex; align-items:flex-start; justify-content: space-between; gap: 14px; padding: 12px 0; border-bottom: 1px dashed rgba(0,0,0,.12); }
.cookie-row-name{ font-weight: 900; }
.cookie-row-desc{ margin-top: 2px; font-size: 13px; color: rgba(12,18,32,.62); }
.cookie-pill{ border-radius: 999px; padding: 6px 10px; font-size: 12px; font-weight: 900; background: rgba(11,143,58,.10); border: 1px solid rgba(11,143,58,.18); color: rgba(11,143,58,.95); white-space: nowrap; }
.cookie-pill-muted{ background: rgba(0,0,0,.06); border-color: rgba(0,0,0,.10); color: rgba(12,18,32,.62); }
.cookie-note{ margin-top: 12px; font-size: 12.5px; color: rgba(12,18,32,.62); }
.cookie-modal-foot{ display:flex; justify-content:flex-end; gap: 10px; padding: 14px 16px; border-top: 1px solid rgba(0,0,0,.08); }

body.theme-dark .cookie-banner-inner{ background: rgba(17,24,39,.88); border-color: rgba(255,255,255,.12); box-shadow: 0 22px 70px rgba(0,0,0,.42); }
body.theme-dark .cookie-banner-desc{ color: rgba(255,255,255,.62); }
body.theme-dark .cookie-modal{ background: rgba(17,24,39,.94); border-color: rgba(255,255,255,.12); box-shadow: 0 34px 100px rgba(0,0,0,.55); }
body.theme-dark .cookie-modal-head, body.theme-dark .cookie-modal-foot{ border-color: rgba(255,255,255,.10); }
body.theme-dark .cookie-row{ border-bottom-color: rgba(255,255,255,.14); }
body.theme-dark .cookie-row-desc, body.theme-dark .cookie-note{ color: rgba(255,255,255,.62); }
body.theme-dark .cookie-modal-close{ background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color: rgba(255,255,255,.85); }
body.theme-dark .cookie-pill-muted{ background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.12); color: rgba(255,255,255,.62); }

@media (max-width: 520px){
  .cookie-banner-inner{ flex-direction: column; align-items: stretch; }
  .cookie-banner-actions{ justify-content: flex-start; }
}

/* Tour guided overlay (Bootstrap) */
.tour-overlay{
  position: fixed;
  inset: 0;
  z-index: 11000;
}
.tour-highlight{
  position: fixed;
  border-radius: 18px;
  border: 2px solid rgba(255,255,255,.85);
  box-shadow: 0 0 0 9999px rgba(11,18,32,.56), 0 25px 80px rgba(0,0,0,.45);
  pointer-events: none;
  z-index: 11001;
}
.tour-card{
  position: fixed;
  width: min(420px, 92vw);
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.18);
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(10px);
  box-shadow: 0 25px 90px rgba(0,0,0,.28);
  padding: 14px 16px;
  z-index: 11002;
}
body.theme-dark .tour-card{
  background: rgba(17,24,39,.92);
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 32px 110px rgba(0,0,0,.55);
}
body.theme-dark .tour-card .text-muted{ color: rgba(255,255,255,.66) !important; }
body.theme-dark .tour-card .btn-outline-muted{
  border-color: rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.84) !important;
}
body.theme-dark .tour-card .btn-outline-muted:hover{
  background: rgba(255,255,255,.08) !important;
}

/* cookie UI v2 (Bootstrap) */
.cookie-banner-inner{
  width: min(980px, calc(100vw - 32px));
  margin: 0 auto;
  border-radius: 26px;
  padding: 16px;
  border: 1px solid rgba(0,0,0,.10);
  background: linear-gradient(135deg, rgba(255,255,255,.88), rgba(255,255,255,.82));
  position: relative;
  overflow:hidden;
}
.cookie-banner-inner:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(900px 280px at 10% 0%, rgba(51,186,226,.14), transparent 55%),
    radial-gradient(900px 280px at 90% 100%, rgba(198,40,123,.12), transparent 55%);
  opacity:.9;
}
.cookie-banner-inner > *{ position: relative; z-index: 1; }

.cookie-banner-title{
  display:flex;
  align-items:center;
  gap: 10px;
  font-weight: 900;
}
.cookie-badge{
  display:inline-flex;
  align-items:center;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 11px;
  font-weight: 900;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(11,143,58,.10);
  color: rgba(11,143,58,.96);
}
.cookie-banner-actions{
  gap: 10px;
}

.cookie-btn{
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 900;
  font-size: 13px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.65);
  backdrop-filter: blur(8px);
  box-shadow: 0 18px 60px rgba(12,18,32,.12);
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease, color .18s ease;
  white-space: nowrap;
}
.cookie-btn:hover{
  transform: translateY(-1px);
  box-shadow: 0 28px 90px rgba(12,18,32,.16);
}
.cookie-btn:active{
  transform: translateY(0);
  box-shadow: 0 18px 60px rgba(12,18,32,.12);
}
.cookie-btn--ghost:hover{ background: rgba(255,255,255,.85); }
.cookie-btn--outline{ background: rgba(255,255,255,.50); }
.cookie-btn--outline:hover{ background: rgba(255,255,255,.74); }
.cookie-btn--primary{
  border-color: rgba(44,91,202,.25);
  background: linear-gradient(135deg, rgba(54,99,207,1), rgba(41,116,214,1));
  color: rgba(255,255,255,.98);
}
.cookie-btn--primary:hover{ border-color: rgba(255,255,255,.25); }

/* Dark mode */
body.theme-dark .cookie-banner-inner{
  border-color: rgba(255,255,255,.12);
  background: linear-gradient(135deg, rgba(17,24,39,.92), rgba(17,24,39,.86));
}
body.theme-dark .cookie-banner-inner:before{
  opacity:.85;
  background:
    radial-gradient(900px 280px at 10% 0%, rgba(51,186,226,.22), transparent 55%),
    radial-gradient(900px 280px at 90% 100%, rgba(198,40,123,.18), transparent 55%);
}
body.theme-dark .cookie-badge{ border-color: rgba(255,255,255,.14); }
body.theme-dark .cookie-btn{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.88);
  box-shadow: 0 22px 70px rgba(0,0,0,.42);
}
body.theme-dark .cookie-btn:hover{
  background: rgba(255,255,255,.09);
  box-shadow: 0 34px 100px rgba(0,0,0,.55);
}

/* Footer v2 (Bootstrap) */
.footer-shell{
  border-radius: 34px !important;
  border: 1px solid rgba(0,0,0,.08) !important;
  background: rgba(255,255,255,.72) !important;
  backdrop-filter: blur(10px);
  box-shadow: 0 18px 60px rgba(12,18,32,.12);
  position: relative;
  overflow: hidden;
}
.footer-shell:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(900px 300px at 10% 0%, rgba(51,186,226,.12), transparent 55%),
    radial-gradient(900px 300px at 90% 100%, rgba(198,40,123,.10), transparent 55%);
  opacity: .95;
}
.footer-shell > *{ position: relative; z-index: 1; }

.footer-mark{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight: 1000;
  letter-spacing: .02em;
  color: rgba(255,255,255,.98);
  background: linear-gradient(135deg, rgba(54,99,207,1), rgba(41,116,214,1));
  box-shadow: 0 28px 90px rgba(12,18,32,.16);
}

.footer-col-title{
  font-weight: 900;
  color: rgba(12,18,32,.92);
}
.footer-link{
  color: rgba(12,18,32,.62) !important;
  text-decoration: none !important;
  transition: color .18s ease, transform .18s ease;
}
.footer-link:hover{
  color: rgba(54,99,207,1) !important;
  transform: translateX(2px);
}
.footer-chip{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 900;
  font-size: 12px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.62);
  box-shadow: 0 18px 60px rgba(12,18,32,.12);
  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
  white-space: nowrap;
}
.footer-chip:hover{
  transform: translateY(-1px);
  box-shadow: 0 28px 90px rgba(12,18,32,.16);
  background: rgba(255,255,255,.80);
}
.footer-tip{
  display:inline-block;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.60);
  padding: 10px 12px;
  font-size: 12px;
  color: rgba(12,18,32,.62);
}

/* Dark mode */
body.theme-dark .footer-shell{
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(17,24,39,.78) !important;
  box-shadow: 0 24px 88px rgba(0,0,0,.45) !important;
}
body.theme-dark .footer-shell:before{
  opacity: .85;
  background:
    radial-gradient(900px 300px at 10% 0%, rgba(51,186,226,.22), transparent 55%),
    radial-gradient(900px 300px at 90% 100%, rgba(198,40,123,.16), transparent 55%);
}
body.theme-dark .footer-col-title{
  color: rgba(255,255,255,.92);
}
body.theme-dark .footer-link{
  color: rgba(255,255,255,.62) !important;
}
body.theme-dark .footer-link:hover{
  color: rgba(255,255,255,.92) !important;
}
body.theme-dark .footer-chip{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.88);
  box-shadow: 0 18px 70px rgba(0,0,0,.42);
}
body.theme-dark .footer-chip:hover{
  background: rgba(255,255,255,.09);
  box-shadow: 0 28px 96px rgba(0,0,0,.55);
}
body.theme-dark .footer-tip{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.62);
}
body.theme-dark .footer-bottom{
  color: rgba(255,255,255,.62) !important;
}

/* Header v2 (Bootstrap) */
.navbar.dt-header{
  position: sticky;
  top: 0;
  z-index: 1040;
  transform: translateY(-6px);
  opacity: 0;
  transition: transform .35s ease, opacity .35s ease, box-shadow .25s ease, background-color .25s ease;
  overflow: hidden;
}
.navbar.dt-header.dt-header--mounted{
  transform: translateY(0);
  opacity: 1;
}
.navbar.dt-header:before{
  content:"";
  position:absolute;
  inset: -40% -30%;
  background: radial-gradient(600px 220px at 10% 20%, rgba(51,186,226,.14), transparent 55%),
              radial-gradient(600px 220px at 85% 30%, rgba(198,40,123,.10), transparent 55%),
              linear-gradient(90deg, transparent, rgba(255,255,255,.65), transparent);
  transform: translateX(-18%) rotate(6deg);
  filter: blur(6px);
  opacity: .55;
  animation: dtSheen 10s ease-in-out infinite;
  pointer-events:none;
}
.navbar.dt-header > *{ position: relative; z-index: 1; }

.navbar.dt-header.dt-header--scrolled{
  box-shadow: 0 10px 40px rgba(12,18,32,.10);
  background: rgba(255,255,255,.82) !important;
}
.dt-brand img{
  transition: transform .18s ease, box-shadow .18s ease;
}
.dt-brand:hover img{
  transform: rotate(-2deg) scale(1.04);
  box-shadow: 0 18px 60px rgba(12,18,32,.14);
}

.dt-navlink{
  position: relative;
}
.dt-navlink:after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-10px;
  height:2px;
  border-radius:999px;
  transform: scaleX(0);
  transform-origin:left;
  background: linear-gradient(90deg, rgba(54,99,207,1), rgba(51,186,226,1), rgba(198,40,123,1));
  transition: transform .18s ease;
  opacity:.85;
}
.dt-navlink:hover:after{
  transform: scaleX(1);
}

.dt-cta{
  position: relative;
  overflow: hidden;
}
.dt-cta:before{
  content:"";
  position:absolute;
  inset:-40% -60%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
  transform: translateX(-40%) rotate(10deg);
  opacity: 0;
}
.dt-cta:hover:before{
  opacity:.85;
  animation: dtCtaShine .9s ease;
}
.dt-cta{
  animation: dtPulse 3.8s ease-in-out infinite;
}

.dt-iconbtn{
  overflow: hidden;
}
.dt-iconbtn{
  transition: transform .18s ease;
}
.dt-iconbtn:hover{
  transform: translateY(-1px);
}

@media (prefers-reduced-motion: reduce){
  .navbar.dt-header, .navbar.dt-header:before, .dt-cta{ animation: none !important; transition:none !important; }
  .navbar.dt-header{ opacity:1; transform:none; }
}

/* How images v3 (Bootstrap) */
.how-shell{
  position: relative;
  border-radius: 34px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.72);
  backdrop-filter: blur(10px);
}
.how-shell:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(900px 320px at 10% 0%, rgba(51,186,226,.12), transparent 55%),
    radial-gradient(900px 320px at 90% 100%, rgba(198,40,123,.10), transparent 55%);
  opacity: .95;
}
.how-shell > *{ position: relative; z-index: 1; }

.how-kicker{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: .02em;
  color: rgba(12,18,32,.62);
}
.how-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: linear-gradient(135deg, rgba(54,99,207,1), rgba(41,116,214,1));
  box-shadow: 0 10px 28px rgba(12,18,32,.18);
  display:inline-block;
}
.how-badge{
  border-radius: 999px;
  padding: 5px 10px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(54,99,207,.10);
  color: rgba(54,99,207,1);
}
.how-mini{
  border-radius: 22px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.60);
  box-shadow: 0 18px 60px rgba(12,18,32,.12);
  padding: 12px 14px;
  max-width: 34rem;
}
.how-mini-title{ font-weight: 900; font-size: 12px; color: rgba(12,18,32,.92); }
.how-mini-text{ font-size: 12.5px; line-height: 1.35; }

.how-heroimg{
  position: relative;
  width: min(520px, 100%);
  margin-left: auto;
  border-radius: 28px;
}
.how-heroimg__img{
  width: 100%;
  height: auto;
  border-radius: 28px;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 22px 80px rgba(12,18,32,.12);
}
.how-heroimg__chips{
  position:absolute;
  left: 14px;
  bottom: 12px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.chip{
  font-size: 12px;
  font-weight: 900;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.72);
  box-shadow: 0 18px 60px rgba(12,18,32,.10);
}
.chip-blue{ background: rgba(54,99,207,.12); }
.chip-cyan{ background: rgba(51,186,226,.14); }
.chip-magenta{ background: rgba(198,40,123,.10); }

.how-steps--withimg{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  position: relative;
}
.how-steps--withimg:before{
  content:"";
  position:absolute;
  left: 3%;
  right: 3%;
  top: 170px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(54,99,207,.18), rgba(51,186,226,.18), rgba(198,40,123,.18));
}
.how-step{
  border-radius: 28px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.74);
  box-shadow: 0 18px 60px rgba(12,18,32,.12);
  padding: 16px 16px 18px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
  position: relative;
  overflow:hidden;
}
.how-step:before{
  content:"";
  position:absolute;
  inset: 0;
  pointer-events:none;
  background:
    radial-gradient(420px 180px at 20% 0%, rgba(54,99,207,.10), transparent 60%),
    radial-gradient(420px 180px at 90% 90%, rgba(198,40,123,.08), transparent 60%);
  opacity: .8;
}
.how-step > *{ position: relative; z-index: 1; }
.how-step:hover{
  transform: translateY(-2px);
  box-shadow: 0 28px 90px rgba(12,18,32,.16);
  border-color: rgba(54,99,207,.18);
}
.how-step__media{
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.70);
  box-shadow: 0 16px 60px rgba(12,18,32,.10);
}
.how-step__img{
  width:100%;
  height:auto;
  display:block;
  transform: translateZ(0);
  transition: transform .22s ease;
}
.how-step:hover .how-step__img{ transform: scale(1.02); }
.how-num{
  position:absolute;
  right: 10px;
  top: 10px;
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .10em;
  border-radius: 999px;
  padding: 6px 10px;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(255,255,255,.74);
  color: rgba(12,18,32,.72);
}
.how-bullets{ display:grid; gap: 10px; }
.how-bullet{ display:flex; align-items:center; gap: 10px; }
.how-check{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(0,0,0,.08);
  background: rgba(11,143,58,.10);
  color: rgba(11,143,58,.96);
  font-size: 12px;
  font-weight: 900;
}

@media (max-width: 992px){
  .how-steps--withimg{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .how-steps--withimg:before{ display:none; }
}
@media (max-width: 640px){
  .how-steps--withimg{
    display:flex;
    overflow-x:auto;
    gap: 12px;
    padding-bottom: 8px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .how-step{ min-width: 86%; scroll-snap-align: start; }
}

/* Dark mode */
.theme-dark .how-shell{
  border-color: rgba(255,255,255,.12);
  background: rgba(17,24,39,.78);
  box-shadow: 0 24px 88px rgba(0,0,0,.45);
}
.theme-dark .how-shell:before{
  opacity: .85;
  background:
    radial-gradient(900px 320px at 10% 0%, rgba(51,186,226,.22), transparent 55%),
    radial-gradient(900px 320px at 90% 100%, rgba(198,40,123,.16), transparent 55%);
}
.theme-dark .how-kicker{ color: rgba(255,255,255,.62); }
.theme-dark .how-badge{
  border-color: rgba(255,255,255,.14);
  background: rgba(54,99,207,.22);
  color: rgba(255,255,255,.92);
}
.theme-dark .how-mini{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  box-shadow: 0 18px 70px rgba(0,0,0,.42);
}
.theme-dark .how-mini-title{ color: rgba(255,255,255,.92); }
.theme-dark .how-heroimg__img{
  border-color: rgba(255,255,255,.14);
  box-shadow: 0 18px 70px rgba(0,0,0,.42);
}
.theme-dark .chip{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
}
.theme-dark .how-step{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  box-shadow: 0 18px 70px rgba(0,0,0,.42);
}
.theme-dark .how-step:hover{
  border-color: rgba(255,255,255,.22);
  box-shadow: 0 28px 96px rgba(0,0,0,.55);
}
.theme-dark .how-step__media{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  box-shadow: 0 18px 70px rgba(0,0,0,.35);
}
.theme-dark .how-num{
  border-color: rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.82);
}
.theme-dark .how-check{ border-color: rgba(255,255,255,.14); }

/* dt-titleicon (Bootstrap) */
.dt-titleicon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 2rem;
  height: 2rem;
  border-radius: 999px;
  margin-right: .55rem;
  background: rgba(255,255,255,.65);
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 18px 60px rgba(12,18,32,.10);
  transform: translateY(-1px);
}
.theme-dark .dt-titleicon{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.14);
  box-shadow: 0 18px 70px rgba(0,0,0,.35);
}