/* assets/css/app.css */

/* app.css */

/* Default body font */
body {
  font-family: 'Inter', sans-serif;
}

/* Headings get a display font */
h1, h2, h3, .display-1, .display-2, .display-3, .display-4, .display-5 {
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  letter-spacing: -0.5px;
}

/* Optional: add a subtle gradient text effect for premium look */
.gradient-heading {
  background: linear-gradient(90deg, #1e3c72, #2a5298);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

body { background:#f7f7f9; }
.navbar .material-icons { vertical-align: middle; }
.loader-overlay { position: fixed; inset: 0; display:flex; align-items:center; justify-content:center; background: rgba(255,255,255,.7); z-index: 2000; }
.shimmer-card { border-radius: 1rem; background: #fff; padding: 1rem; box-shadow: 0 4px 16px rgba(0,0,0,.06); }
.shimmer-title, .shimmer-line { height: 14px; background: linear-gradient(90deg,#eee,#f5f5f5,#eee); background-size: 200% 100%; animation: shimmer 1.2s infinite; border-radius: 8px; }
.shimmer-title { width: 40%; margin-bottom: 10px; height: 18px; }
.shimmer-line { width: 60%; margin-bottom: 8px; }
@keyframes shimmer { 0%{background-position: 200% 0;} 100%{background-position: -200% 0;} }
.card { border: 0; border-radius: 1rem; }



/* Toasts */
.cg-toast{ position: fixed; left:50%; bottom:24px; transform:translateX(-50%) translateY(20px); opacity:0; padding:12px 16px; border-radius:12px; background:#111; color:#fff; box-shadow:0 10px 30px rgba(0,0,0,.15); z-index:3000; transition: all .25s ease; }
.cg-toast.ok{ background:#111; }
.cg-toast.error{ background:#b00020; }
.cg-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }



:root{
  --cg-bg:#0f1221;          /* deep indigo */
  --cg-grad-1:#10132b;
  --cg-grad-2:#1b2240;
  --cg-accent:#2f7dfa;      /* primary blue */
  --cg-accent-2:#00d4ff;    /* cyan edge */
  --cg-ink:#0c0c0d;
  --cg-ink-soft:#5e5f6b;
  --cg-card:#ffffff;
  --cg-soft:#f0f2f8;
}



/* HERO */
.hero-wrap{ position:relative; color:#fff; }
.text-hero-sub{ color:#cfd6ff; }
.hero-grad{
 position:absolute; 
 inset:auto 0 0 0; 
 height:48px; 
 display: none;
 background: linear-gradient(180deg,transparent,rgba(247,247,249,1)); 
}
.btn-hero{ background:var(--cg-accent); color:#fff; border:none; }
.btn-hero:hover{
 filter:brightness(0.95); 
 color:white;
 background-color: #687184;
}
.btn-outline-hero{ border:1px solid rgba(255,255,255,.4); color:#343c61; background:transparent; }
.btn-outline-hero:hover{ background:rgba(255,255,255,.08); }

/* Shadows */
.shadow-hero{ box-shadow: 0 25px 80px rgba(0,0,0,.35); }

/* Market strip */
.market-strip{ overflow-x:auto; scrollbar-width:none; }
.market-strip::-webkit-scrollbar{ display:none; }
.market-pill{ background:#fff; border:1px solid #eee; border-radius:999px; padding:8px 14px; display:inline-flex; gap:10px; align-items:center; box-shadow:0 6px 18px rgba(0,0,0,.06); }
.market-pill .sym{ font-weight:600; color:#222; }
.market-pill .price{ color:#555; }
.coin-icon{ width:28px; height:28px; display:inline-grid; place-items:center; }
.coin-icon.lg{
 width:46px; height:46px; 
}
.coin-icon.lg img,.coin-icon img{
	width: 100%;
}

/* Asset cards */
.asset-card{ background:var(--cg-card); border-radius:16px; padding:16px; box-shadow:0 10px 30px rgba(0,0,0,.06); border:1px solid #eee; transition:transform .18s ease, box-shadow .18s ease; }
.asset-card:hover{ transform:translateY(-4px); box-shadow:0 16px 38px rgba(0,0,0,.09); }
.bg-soft{ background:#f2f6ff!important; color:#305; }

/* Feature area */
.bg-hero-card{ background:linear-gradient(180deg,#fff,#f6f8ff); border:1px solid #eef1ff; }
.feature-card{ background:#fff; border:1px solid #eee; border-radius:14px; padding:14px 16px; margin-bottom:12px; box-shadow:0 6px 18px rgba(0,0,0,.05); }
.feature-icon{ color:var(--cg-accent); margin-right:6px; vertical-align:middle; }

/* Reveal on scroll */
.reveal{ opacity:0; transform:translateY(18px); transition:all .6s ease; }
.reveal.revealed{ opacity:1; transform:none; }

/* Keep existing */
.navbar .material-icons { vertical-align: middle; }
.loader-overlay { position: fixed; inset: 0; display:flex; align-items:center; justify-content:center; background: rgba(255,255,255,.7); z-index: 2000; }
.shimmer-card { border-radius: 1rem; background: #fff; padding: 1rem; box-shadow: 0 4px 16px rgba(0,0,0,.06); }
.shimmer-title, .shimmer-line { height: 14px; background: linear-gradient(90deg,#eee,#f5f5f5,#eee); background-size: 200% 100%; animation: shimmer 1.2s infinite; border-radius: 8px; }
.shimmer-title { width: 40%; margin-bottom: 10px; height: 18px; }
.shimmer-line { width: 60%; margin-bottom: 8px; }
@keyframes shimmer { 0%{background-position: 200% 0;} 100%{background-position: -200% 0;} }
.card { border: 0; border-radius: 1rem; }

/* Toasts (already added) */
.cg-toast{ position: fixed; left:50%; bottom:24px; transform:translateX(-50%) translateY(20px); opacity:0; padding:12px 16px; border-radius:12px; background:#111; color:#fff; box-shadow:0 10px 30px rgba(0,0,0,.15); z-index:3000; transition: all .25s ease; }
.cg-toast.ok{ background:#111; }
.cg-toast.error{ background:#b00020; }
.cg-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }




/* Softer feature cards inside the banner */
.bg-illustrated .feature-card{
  background:#fff;
  border:1px solid #eef1ff;
  border-radius:12px;
  padding:10px 12px;
  box-shadow:0 6px 18px rgba(0,0,0,.05);
}
.bg-illustrated .feature-icon{ color:var(--cg-accent); }


footer h6, footer h5 { color:#454a55; }
footer ul li { margin-bottom: .5rem; }
footer a:hover { text-decoration: underline; }

.form-control:focus{
	box-shadow:none;
}



/* Coin icon sizes */
.coin-24{ width:44px; height:44px; object-fit:contain; }
.coin-16{ width:16px; height:16px; object-fit:contain; }

/* Type chips */
.chip{
  cursor: pointer;
  display:inline-flex; align-items:center; gap:6px;
  padding:4px 8px; border-radius:999px; font-size:.85rem; font-weight:600;
  border:1px solid transparent; background:#f5f6fa; color:#333;
}
.chip-icn{ font-size:18px; line-height:1; vertical-align:-3px; }

.chip-deposit{ 
  background:#e9f9ef; 
  color:#106a2b; 
  border-color:#c6f0d2;

}     

/* greenish */
.chip-withdrawal{ background:#ffefef; color:#8a1f1f; border-color:#ffd4d4; }   /* red-ish */
.chip-trade{ background:#eef5ff; color:#1b4f9b; border-color:#d8e8ff; }        /* blue-ish */
.chip-fee{ background:#f1f1f3; color:#4a4a4a; border-color:#e5e5e8; }          /* gray-ish */



/* Dashboard sidebar */
.nav-link {
  color: #333;
  display: flex; align-items: center;
  font-weight: 500;
}
.nav-link .material-icons { font-size:24px; }
.nav-link:hover, .nav-link.active {
  background:#f5f7fa;
  border-radius:8px;
  color:#111;
}


.card-body{
	min-height: 100px;
}

/* Truncate long wallet addresses inside cards */
.card .card-body code {
  display: inline-block;
  max-width: 234px;   /* adjust as needed */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: middle;
}



/* Slide-in drawer + overlay */
/* prevent background scroll while a drawer is open */
body.no-scroll { overflow: hidden; }


.cg-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.35);
  opacity:0; pointer-events:none; transition:opacity .25s ease; z-index:2000;
}
.cg-overlay.show{ opacity:1; pointer-events:auto; }


/* drawer responsiveness + safe-area */
.cg-drawer{
  position:fixed; top:0; right:0; height:100dvh; /* better on mobile */
  width:420px; max-width:90vw;
  background:#fff; box-shadow: -20px 0 40px rgba(0,0,0,.15);
  transform: translateX(100%); transition: transform .3s ease; z-index:2001;
  display:flex; flex-direction:column;
  padding-bottom: env(safe-area-inset-bottom, 0);
}

.cg-drawer.show,.cg-drawer.open{ transform: translateX(0); }
 
.cg-drawer-header{
  display:grid; grid-template-columns: 1fr auto 1fr; align-items:center;
  padding:12px 16px; border-bottom:1px solid #eef1f4;
}
.cg-drawer-header .btn-close{ grid-column: 3; }



/* Drawer header: title left, close button right */
.cg-drawer-header{
  padding:12px 16px;
  border-bottom:1px solid #eef1f4;
}

/* Bigger centered QR */
.deposit-qr{
  width: 240px;
  height: 240px;
  border-radius: 16px;
  background:#fff;
  image-rendering: crisp-edges;
}

/* Responsive: shrink QR on small screens */
@media (max-width: 480px){
  .deposit-qr{ width: 200px; height: 200px; }
}

/* Keep address truncation neat under QR too */
#depositAddress{
  display:inline-block;
  max-width: 100%;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cg-drawer-header h5{ font-weight: 700; }

code {
    font-size: .875em;
    color: #198754;
    word-wrap: break-word;
}



.fiat-est-box{
  width: 100%;
  display:inline-block;
  padding:14px 18px;
  border-radius:14px;
  background: #eaf7f0;      /* soft green or swap to #eaf1ff for blue */
  border: 1px solid #d7efdf; /* matching border */
  font-weight: 700;
  font-size: 1.1rem;
}



/* Send drawer fiat estimate */
.fiat-est-box{
  display:inline-block;
  min-width: 260px;
  padding: 12px 16px;
  border-radius: 14px;
  background: #e8f6f0;           /* soft green */
  border: 1px solid #d3eee4;
  box-shadow: 0 6px 20px rgba(0,0,0,.06);
}
.fiat-est-title{
  font-size: .85rem;
  color: #2d6a4f;
  margin-bottom: 4px;
}
.fiat-est-value{
  font-size: 1.4rem;
  font-weight: 700;
  color: #1b4332;
}

/* Hide number spinners just in case (some browsers still show them) */
input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }

.coin-20, .pm-20 { width:20px; height:20px; object-fit:contain; vertical-align:-3px; }

.send-progress { background:#f7f9fc; border:1px solid #eef1f4; border-radius:12px; padding:12px; }
.send-progress .sp-row { display:flex; align-items:center; gap:8px; padding:6px 4px; }
.send-progress .sp-icon { font-size:20px; color:#98a1b2; }
.send-progress .sp-row.is-active .sp-icon { animation: cg-spin 1s linear infinite; }
.send-progress .sp-row.is-done .sp-icon { color:#16a34a; } /* green */
.send-progress .sp-row.is-done .sp-icon::before { content:''; }
@keyframes cg-spin { 
  from{ transform:rotate(0deg); 
  } to { transform:rotate(360deg); } }

.pm-icon{ width:22px; height:22px; object-fit:contain; }
.coin-24{ width:30px; height:30px; object-fit:contain; }
#sellFiatBox, .fiat-est-box{ font-weight:600; }
.coin-16{ width:16px; height:16px; object-fit:contain; }

/* Mini market card */
.market-card{ border-radius:1rem; background:#fff; box-shadow:0 6px 20px rgba(0,0,0,.06); }
.market-card .hdr{ display:flex; align-items:center; gap:.75rem; }
.coin-32{ width:32px; height:32px; object-fit:contain; }

.fiat-est-box{ display:inline-block; padding:.6rem .9rem; border-radius:12px; background:#eef8f1; }
.fiat-est-box.big{ display:inline-block; padding:1rem 1.25rem; font-size:1.45rem; background:#eef7ff; border:1px solid #dbe9ff; border-radius:14px; }

/* Instructions list */
.sell-steps li{ margin-bottom:.35rem; }

/* Chart container height */
#sellChart{ width:100%; height:220px; }

/* disable number spinners weirdness */
input[type="number"] { -moz-appearance: textfield; }
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Chart sizing without resize loops */
.chart-wrap{
  position: relative;
  height: 220px; /* fixed height for the chart area */
  width: 100%;
}

#sellChart{
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
}

img.pm-24 {
    width: 24px;
}

.pm-icon { width: 28px; height: 18px; object-fit: contain; }
.market-card .chart-wrap { height: 180px; }

span.input-group-text .material-icons {
    color: #0c6efc;
}



#pmStepChoose button.btn.w-100.btn-outline-secondary.p-3.text-start {
    min-height: 180px;
}


.investment-package span.badge.text-bg-light {
    width: 100%;
    font-size: 19px;
    display: block;
}

.investment-info .fw-bold{
  font-size: 18px;
}

#txTypeIcon{
  width: 100px;
  height: 100px;
  padding-top: 25px;
  border-radius: 50px;
  border: 1px solid;
  margin:auto;
}




/* Make the quick-actions breathe a bit inside the UL */
.navbar .cg-quick-actions {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: .65rem;
}

.navbar .cg-qa {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  border: 1px solid rgba(0,0,0,.06);
  background: #fff;
  border-radius: 14px;
  padding: .85rem .5rem;
  min-height: 74px;            /* steady tap target */
  box-shadow: 0 1px 2px rgba(0,0,0,.04);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
  color: inherit;
}

.navbar .cg-qa .material-icons {
  font-size: 22px;
  line-height: 1;
  margin-bottom: .35rem;
  opacity: .85;
  transition: transform .12s ease, opacity .12s ease;
}

.navbar .cg-qa small {
  font-weight: 600;
  letter-spacing: .2px;
  font-size: .75rem;
  text-align: center;
  white-space: nowrap;
}

.navbar .cg-qa:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
  border-color: rgba(0,0,0,.12);
}

.navbar .cg-qa:hover .material-icons {
  transform: scale(1.08);
  opacity: 1;
}

/* Keep this mobile-only (the li itself is already d-lg-none, but belt-and-suspenders) */
@media (min-width: 992px) {
  .navbar .cg-quick-actions { display: none; }
}
@media (max-width: 380px) {
  .navbar .cg-quick-actions { grid-template-columns: repeat(3, 1fr); }
}



/* Global font */
html, body {
  font-family: "Inter", system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif !important;
}

/* Section reveals */
.reveal {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .6s ease, transform .6s ease;
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Soft badges */
.badge.bg-soft {
  background: rgba(0,0,0,.06);
  color: #222;
}

/* “Feature cards” & hover */
.feature-card {
  background: #fff;
  border-radius: 16px;
  padding: .9rem 1rem;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  transition: transform .12s ease, box-shadow .12s ease;
}
.feature-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(0,0,0,.08);
}
.feature-icon {
  background: #eef3ff;
  border-radius: 12px;
  padding: .4rem;
}

/* Hero buttons */
.btn-hero {
  background: linear-gradient(135deg, #4254ff, #6e46ff);
  border: 0;
  color: #fff;
}
.btn-outline-hero {
  border: 1px solid rgba(0,0,0,.12);
  background: #fff;
}

/* Subtle floating shadow for hero image */
.shadow-hero {
  box-shadow: 0 28px 60px rgba(0,0,0,.18);
  border-radius: 22px!important;
}

/* Minimal parallax-ish sections */
.parallax {
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
}

/* Section dividers */
.section-divider {
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(0,0,0,.12), transparent);
  margin: 2.5rem 0;
}



.invest-card {
  background: linear-gradient(180deg, #f9fafb 0%, #ffffff 100%);
  border: 1px solid #eef0f4;
}
.invest-subtitle {
  color: #6b7280;
  font-size: .95rem;
}
.underline-anim {
  position: relative;
  height: 3px;
  background: #e5e7eb;
  overflow: hidden;
  border-radius: 3px;
}
.underline-anim::after {
  content: "";
  position: absolute; left: -30%;
  top: 0; bottom: 0;
  width: 30%;
  background: linear-gradient(90deg, transparent, #6366f1, transparent);
  animation: underline-slide 2.2s linear infinite;
}
@keyframes underline-slide {
  0%   { left: -30%; }
  100% { left: 100%; }
}



/* Market Prices */
.mp-spark-wrap{
  height: 42px;
  width: 100%;
  position: relative;
}
#mpTable tbody tr{
  transition: background-color .2s ease, transform .12s ease;
}
#mpTable tbody tr:hover{
  background: #f8f9fa;
  transform: translateY(-1px);
}
.badge.bg-success-subtle{ background: rgba(25,135,84,.12)!important; }
.badge.bg-danger-subtle{ background: rgba(220,53,69,.12)!important; }


.app_logo{
  width: 24px;
  margin-right: 15px;
}
.app_logo img{
  width: 100%;
}



/* About page styles */
.shadow-hero { box-shadow: 0 20px 60px rgba(0,0,0,.25); }
.team-photo { display:block; aspect-ratio:1/1; object-fit:cover; transition:transform .25s ease; }
.team-photo-btn:hover .team-photo { transform:scale(1.03); }
.team-card .fw-semibold { font-size: .98rem; }
.team-card .text-muted { font-size: .84rem; }

/* Stats grid */
.stats-grid {
  display:grid;
  min-height: 500px;
  gap:14px;
  grid-template-columns: repeat(2, minmax(0,1fr));
}
@media (min-width: 992px){ .stats-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
.stat {
  background:#fff;
  border-radius:16px;
  padding:18px 16px;
  box-shadow:0 1px 3px rgba(0,0,0,.06), 0 8px 30px rgba(0,0,0,.04);
}
.stat-num { font-weight:800; font-size:1.6rem; line-height:1.1; }
.stat-label { color:#6c757d; font-size:.9rem; margin-top:4px; }

/* Investors */
.investor-card { border-radius:16px; }


.parallax.about{
    min-height:520px;
    background-color: rgb(18, 29, 51);
    background:#0e102a;
    background-repeat: no-repeat;
    background-size: 45rem;
    background-position: right bottom;
    color: rgb(223, 227, 235);

}


img.circle{
  border-radius: 50px;
}




/* Careers hero (responsive sizes) */
.parallax.careers{
  min-height:520px;
  background-size: cover;
  background-repeat:no-repeat;
  background-color:#0e102a;
  background-position:right bottom;
  color:#dfe3eb;
}


/* Values pills */
.values-pills .nav-link{
  border-radius:14px;
  background:#f5f7fb;
  color:#0b1220;
}
.values-pills .nav-link.active{
  background:#0b1220;
  color:#fff;
}

/* Perk cards */
.perk-card{
  background:#fff; border-radius:16px; padding:18px 16px; height:100%;
  box-shadow:0 1px 3px rgba(0,0,0,.06), 0 8px 30px rgba(0,0,0,.04);
}
.perk-card .material-icons{ font-size:28px; margin-bottom:6px; }
.perk-title{ font-weight:700; }
.perk-desc{ color:#6c757d; font-size:.9rem; }

/* Jobs list */
.jobs-tabs .nav-link{ border-radius:999px; }
.job-list{
  display:flex; flex-direction:column; gap:12px;
}
.job-row{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 16px; border:1px solid rgba(0,0,0,.06); border-radius:14px; background:#fff;
}
.job-row a{
  color: darkblue;
}
.job-title{ font-size:1rem; }
.job-meta{ margin-top:2px; }
.job-actions .btn{ border-radius:999px; }



/* Values: shared look */
.value-box span.material-icons.me-2{
  font-size: 36px;
  display: block;
  color: #151a48;
  width: 100%;
}
.value-box.active span.material-icons.me-2{
    color: white !important;
}
.value-box {
  align-items: center;
  min-height: 340px;
  padding: 10px 12px;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: box-shadow .15s ease, transform .05s ease, border-color .15s ease, background .15s ease;
  white-space: nowrap;
}
.value-box:hover { box-shadow: 0 8px 30px rgba(0,0,0,.06); }
.value-box:active { transform: translateY(1px); }
.value-box.active {
    border-color: rgba(13,110,253,.35);
    background: #151a48;
    box-shadow: 0 8px 30px rgba(13,110,253,.08);
    color: white;
}
.value-box.active *{
  font-size: 3.5rem !important;
}
.value-box:focus-visible {
  outline: 3px solid rgba(13,110,253,.35);
  outline-offset: 2px;
  border-radius: 12px;
}

/* Mobile slider behavior */
@media (max-width: 576px){
  .value-box {
    display: none;
  }
  .values-grid {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 70%;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    gap: 10px;
    padding-bottom: 6px;
  }
  .values-grid > .col {
    scroll-snap-align: start;
    min-width: 0; /* avoid overflow */
  }
  /* Hide default row-g-* spacing on mobile since we use our own gap */
  .values-grid.g-2 { --bs-gutter-x: 0; --bs-gutter-y: 0; }
}


.job-list { position: relative; }
.job-row {
  display:flex; align-items:center; justify-content:space-between;
  padding: .9rem 1rem; border:1px solid #eee; border-radius: .75rem; margin-bottom:.75rem;
  background:#fff;
}
.job-row .job-title { font-size: 1rem; }
.job-row .job-meta { margin-top:.15rem; }


.application-meta .me-2{
  display: block;
  list-style: none;
  margin-top: 6px;
}
.me-2.dot{
  min-width: auto !important;
}

.accordion-button{
  outline: none;
  box-shadow: none !important;
}

.cursor-pointer {
  cursor: pointer;
}
.form-label{font-weight: bolder;}



.thesis-card {
  transition: transform .2s ease, box-shadow .2s ease;
}
.thesis-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 32px rgba(0,0,0,.25);
}

/* Gradients */
.gradient-blue {
  background: linear-gradient(135deg, #0d1b2a, #1b263b, #415a77);
}
.gradient-yellow {
  background: linear-gradient(135deg, #7a5e00, #b38600, #ffd60a);
}
.gradient-orange {
  background: linear-gradient(135deg, #7a2900, #cc5200, #ff7b00);
}
.gradient-purple {
  background: linear-gradient(135deg, #2d004d, #5a189a, #9d4edd);
}
.gradient-lightgreen {
  background: linear-gradient(135deg, #004d40, #00796b, #4caf50, #a5d6a7);
}

/* More reusable gradients */

/* Dark (general purpose, sleek) */
.gradient-dark {
  background: linear-gradient(135deg, #0f0f0f, #1c1c1c, #2e2e2e);
}
.cg-hero {
    position: relative;
    background: radial-gradient(circle at 20% 30%, #1a2a6c, transparent 70%),
              radial-gradient(circle at 80% 40%, #162447, transparent 60%),
              radial-gradient(circle at 50% 90%, #1f4068, transparent 65%),
              #0f1630;
    background-size: cover;
    background-attachment: fixed;
    overflow: hidden;
}

/* Brown (earthy, premium) */
.gradient-brown {
  background: linear-gradient(135deg, #4e342e, #6d4c41, #8d6e63);
}

/* Cream (soft and elegant) */
.gradient-cream {
  background: linear-gradient(135deg, #fdfcfb, #f5f5dc, #e6e2d3);
  color: #333; /* ensure text is readable */
}

/* Red (alert / highlight sections) */
.gradient-red {
  background: linear-gradient(135deg, #7b0000, #b71c1c, #f44336);
}

/* Teal (fresh, fintech feel) */
.gradient-teal {
  background: linear-gradient(135deg, #004d66, #007c91, #26c6da);
}

/* Indigo (deep, trustworthy) */
.gradient-indigo {
  background: linear-gradient(135deg, #1a237e, #283593, #3f51b5);
}

/* Pink (playful highlight) */
.gradient-pink {
  background: linear-gradient(135deg, #880e4f, #c2185b, #f06292);
}

/* Silver/Gray (subtle professional tone) */
.gradient-silver {
  background: linear-gradient(135deg, #eceff1, #cfd8dc, #b0bec5);
  color: #212121;
}

/* Cyan-Blue mix (modern tech feel) */
.gradient-cyanblue {
  background: linear-gradient(135deg, #006064, #0288d1, #29b6f6);
}

.pfilter-dialog {
  transform: translate(-50%, -20px) scale(.96);
  transition: transform .25s ease, opacity .25s ease;
}
.pfilter-overlay.show .pfilter-dialog {
  transform: translate(-50%, 0) scale(1);
  opacity: 1;
}


/* ---------- Legal Tabs: premium look ---------- */
.legal-tabs {
  position: relative;
  background: linear-gradient(180deg, rgba(13,27,42,.03), rgba(13,27,42,0));
  border-bottom: 1px solid #edf2f7;
}
.lt-nav {
  position: relative;
  display: flex;
  gap: 4px;
  padding: 8px 0;
  overflow-x: auto;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}
.lt-nav::-webkit-scrollbar { height: 6px; }
.lt-nav::-webkit-scrollbar-thumb { background: #d0d7de; border-radius: 8px; }

.lt-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  height: 44px;
  padding: 0 14px;
  border-radius: 12px;
  font-weight: 600;
  font-size: .95rem;
  color: #334155;             /* slate-700 */
  text-decoration: none;
  transition: color .15s ease, background .15s ease, transform .06s ease;
}
.lt-link:hover { color: #0d6efd; background: rgba(13,110,253,.06); }
.lt-link:active { transform: translateY(1px); }
.lt-link.active {
  color: #0d6efd;
  background: rgba(13,110,253,.08);
}

/* Active ink underline */
.lt-ink {
  position: absolute;
  bottom: -1px;
  height: 2.5px;
  width: 40px;
  background: linear-gradient(90deg, #0d6efd, #6f42c1);
  border-radius: 2px;
  transition: transform .25s cubic-bezier(.4,0,.2,1), width .25s ease;
  pointer-events: none;
}

/* Fade edges when overflow */
.legal-tabs::before,
.legal-tabs::after {
  content:'';
  position:absolute; top:0; bottom:0; width:28px; pointer-events:none;
}
.legal-tabs::before {
  left:0; background: linear-gradient(90deg, rgba(255,255,255,1), rgba(255,255,255,0));
}
.legal-tabs::after  {
  right:0; background: linear-gradient(270deg, rgba(255,255,255,1), rgba(255,255,255,0));
}

/* ---------- Premium content styling ---------- */
.legal-shell {                  /* optional wrapper around your terms body */
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 10px 30px rgba(2,8,20,.06);
  border: 1px dashed #333a40;
  min-height: 180px;
}
.legal-shell .legal-section {   /* works with your existing .legal-section */
  padding: 1.5rem 1rem 1rem;
  margin: 0 0 .5rem;
  border-top: 1px dashed #edf2f7;
}
.legal-shell .legal-section:first-of-type {
  border-top: 0;
  padding-top: 1rem;
}

/* Headlines */
.section-title{
  font-family: 'Clash Display','Inter',system-ui,-apple-system,sans-serif;
  font-weight: 700;
  letter-spacing: -.01em;
  color: #0b1220;
  font-size: large !important;
}

/* Lead & body */
.legal-shell p, .legal-shell li { color: #4b5563; } /* slate-600 */

/* Callouts */
.callout {
  border: 1px solid #e6eef7;
  background: linear-gradient(180deg, #f8fbff, #ffffff);
  border-radius: 16px;
  padding: 1rem 1.125rem;
}
.callout .callout-title{
  font-weight: 700; color:#0b1220; margin-bottom:.35rem;
}

/* Code / inline kbd */


/* Tables */
.legal-table {
  --row: #f8fafc;
  border: 1px solid #edf2f7;
  border-radius: 14px;
  overflow: hidden;
}
.legal-table table { margin: 0; }
.legal-table thead th {
  background: #f8fafc;
  color: #0b1220;
  font-weight: 700;
  border-bottom: 1px solid #edf2f7;
}
.legal-table td, .legal-table th { padding: .9rem 1rem; }



/* Anchor offset for smooth-scroll targets */
.legal-section[id]::before {
  content: '';
  display: block;
  height: 70px;            /* header offset */
  margin-top: -70px;
  visibility: hidden;
}

/* Print polish */
@media print {
  .legal-tabs, .lt-ink { display:none !important; }
  .legal-shell { box-shadow: none; border: 0; border-radius: 0; }
}




/* Parallax hero for legal/terms */
.terms-hero{
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  position: relative;
  isolation: isolate;
}
.terms-hero::before{
  content:"";
  position:absolute; inset:0;
  background: radial-gradient(1200px 360px at 20% 10%, rgba(255,255,255,.35), rgba(255,255,255,0)),
              linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.75));
  pointer-events:none; z-index:0;
}
.terms-hero .container{ position:relative; z-index:1; }

/* Gentle background drift for a premium feel (reduced on motion-pref) */
@keyframes legalDrift {
  0%   { background-position: center 0px; }
  50%  { background-position: center -14px; }
  100% { background-position: center 0px; }
}
.terms-hero { animation: legalDrift 14s ease-in-out infinite; }

@media (max-width: 991.98px){
  .terms-hero{ background-attachment: scroll; } /* better perf on mobile */
}

/* Optional: jumbo display sizing if not already defined */
.display-jumbo{
  font-family: var(--font-display, 'Clash Display','Inter',system-ui,-apple-system,sans-serif);
  font-weight: 100 !important;
  letter-spacing: -.01em;
  line-height: 1.05;
  font-size: clamp(2.2rem, 3.2vw + 1.2rem, 3.5rem);
}

.list-group-item.active {
    z-index: 2;
    color: var(--bs-list-group-active-color);
    background-color: #343a40;
    border-color: #343a40;
}

.cg_hero_overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(279deg, rgb(125 84 255 / 55%), rgba(255, 255, 255, .25));
    pointer-events: none;
}

.parallax.about,.parallax.ventures{
  position: relative;
}


/* Learning hero (parallax) */
.learn-hero{
  background-position:center; background-size:cover; background-attachment:fixed;
  position:relative; isolation:isolate;
}
.learn-hero::before{
  content:""; position:absolute; inset:0;
  background: radial-gradient(1200px 360px at 25% 10%, rgba(255,255,255,.35), rgba(255,255,255,0)),
              linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.75));
  pointer-events:none; z-index:0;
}
.learn-hero .container{ position:relative; z-index:1; }
@media (max-width: 991.98px){ .learn-hero{ background-attachment:scroll; } }

/* Sticky TOC */
.learn-toc .nav-link{ color:#6c757d; border-left:2px solid transparent; }
.learn-toc .nav-link:hover{ color:#0d1b2a; }
.learn-toc .nav-link.active{
  color:#0d1b2a; border-left-color:#0d6efd; font-weight:600;
}

/* Section polish */
.learn-section .card:hover{ transform: translateY(-2px); transition: transform .15s ease; }





/* ========== Bespoke Capital Solutions slider ========== */
.bc-slider { position: relative; }
.bc-viewport { overflow: hidden; }
.bc-track { display: flex; gap: 16px; will-change: transform; transition: transform .35s ease; }
.bc-card { min-width: clamp(260px, 45vw, 340px); }

.bc-dots { display:flex; justify-content:center; gap:8px; }
.bc-dots button{
  width:8px; height:8px; border-radius:50%; border:none;
  background:#d2d6db; padding:0; display:inline-block;
}
.bc-dots button.active{ background:#0d6efd; }

/* Keyboard focus */
.bc-dots button:focus-visible { outline: 2px solid #0d6efd; outline-offset: 2px; }

/* ========== Partner logo fader ========== */
.logo-fader { position: relative; height: 220px; }
.logo-fader-slide{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  opacity:0; transform: scale(.985); transition: opacity .5s ease, transform .5s ease;
}
.logo-fader-slide.active{ opacity:1; transform: scale(1); }
.logo-fader img{ max-height: 180px; width:auto; object-fit: contain; filter: drop-shadow(0 6px 16px rgba(0,0,0,.12)); }

/* Nice hover for slider cards */
.bc-card:hover { transform: translateY(-2px); transition: transform .18s ease; }






/*******ANIMATION WAVE******/

/* Base hero look */
.cg-hero {
  position: relative;
  color: #fff;
  background: linear-gradient(90deg,#001f3f 3%,#003366 30%,#004080 65%,#001a33);
}

/* Keep your content above the waves */
.cg-hero .container,
.cg-hero .row,
.cg-hero .col-lg-6,
.cg-hero .hero-visual {
  position: relative;
  z-index: 2;
}

/* Wave field lives directly in the section */
.cg-hero {
  --scale-x: 4;
  --scale-y: calc(4 * 1.5);
  --wave-c1: rgba(0,51,102,.4);   /* dark navy */
  --wave-c2: rgba(0,102,204,.4);  /* blue accent */
}

/* Wider field option via class already on your section */
.cg-hero.hero-waves-wide {
  --scale-x: 2.7;
  --scale-y: calc(2 * 2.6);
}

/* Individual waves injected by JS */
.cg-hero .hero-wave {
  position: absolute;
  top: 38%;
  left: 20%;
  translate: -50% -50%;
  width:500px;
  height: 300px;
  border-radius: 50%;
  background: linear-gradient(90deg,var(--wave-c1),var(--wave-c2));
  opacity: 0;
  transform: scaleX(1) scaleY(1);
  transform-origin: center center;
  animation: cgHeroWave 40s linear infinite;
  pointer-events: none;
  z-index: 0;
  filter: blur(.2px);
}
@media (min-width: 768px){
  .cg-hero .hero-wave { width: 560px; height: 408px; }
}

/* Staggered delays for a continuous loop */
.cg-hero .hero-wave:nth-child(1) { animation-delay: 0s; }
.cg-hero .hero-wave:nth-child(2) { animation-delay: -5s; }
.cg-hero .hero-wave:nth-child(3) { animation-delay: -10s; }
.cg-hero .hero-wave:nth-child(4) { animation-delay: -15s; }
.cg-hero .hero-wave:nth-child(5) { animation-delay: -20s; }
.cg-hero .hero-wave:nth-child(6) { animation-delay: -25s; }
.cg-hero .hero-wave:nth-child(7) { animation-delay: -30s; }
.cg-hero .hero-wave:nth-child(8) { animation-delay: -35s; }
.cg-hero .hero-wave:nth-child(9) { opacity: 1; animation: none; 
  filter: blur(40.9px);}

@keyframes cgHeroWave {
  0%   { transform: scaleX(1) scaleY(1); opacity: 0; }
  5%   { opacity: .8; }
  100% { transform: scaleX(var(--scale-x)) scaleY(var(--scale-y)); opacity: 0; }
}

/* Motion safety */
@media (prefers-reduced-motion: reduce){
  .cg-hero .hero-wave { animation: none; opacity: 0; }
}

/*******ANIMATION WAVE END******/



.prose h1,.prose h2,.prose h3{font-weight:800;letter-spacing:-.01em}
.prose h2{margin-top:2rem}
.prose p{color:#495057;margin:0 0 1.1rem 0}
.prose img{max-width:100%;height:auto;border-radius:12px}
.prose blockquote{border-left:3px solid #0d6efd;padding-left:1rem;color:#6c757d}
.prose pre{background:#0f172a;color:#e2e8f0;border-radius:12px;padding:1rem;overflow:auto}




/* Mega dropdown panel */
.mega-dropdown {
  min-width: 820px;           /* comfy width on desktop */
  max-width: 100vw;
  border: 1px solid rgba(0,0,0,.06);
}

/* Link styling */
.mega-link {
  display: block;
  text-decoration: none;
  color: #111827;
  padding: 6px 0;
  border-radius: 8px;
  transition: background .15s ease, transform .15s ease, color .15s ease;
}
.mega-link:hover {
  background: #f8fafc;
  color: #0d6efd;
}

/* Make the dropdown aligned under the icon and not full-width on small screens */
@media (max-width: 991.98px) {
  .mega-dropdown { min-width: 0; width: calc(100vw - 2rem); margin: 0 1rem; }
}