:root{
  --primary:#e2794a;
  --primary-soft:#fdefe4;
  --primary-dark:#c65b2f;
  --navy:#1c2757;
  --navy-deep:#141c40;
  --gold:#e2794a;
  --ink:#20232d;
  --mute:#6b7186;
  --line:#e7e5df;
  --surface:#faf7f3;
  --white:#ffffff;
  --shadow-soft: 0 1px 2px rgba(20,28,64,.04), 0 8px 24px rgba(20,28,64,.06);
  --shadow-lift: 0 12px 40px rgba(226,121,74,.18);
  --grad-primary: linear-gradient(135deg,#f19163,#c65b2f);
  --grad-cta: linear-gradient(100deg,#fdefe4,#f9dfc6,#fdefe4);
}
*{ -webkit-font-smoothing:antialiased; }
html{ scroll-behavior:smooth; }
body{
  font-family:'Inter', system-ui, sans-serif;
  color:var(--ink);
  background:var(--white);
  line-height:1.55;
}
h1,h2,h3,h4,h5{
  font-family:'Plus Jakarta Sans','Inter',sans-serif;
  letter-spacing:-0.02em;
  color:var(--navy-deep);
  font-weight:800;
}
a{ color:var(--primary); text-decoration:none; }
a:hover{ color:var(--primary-dark); }
.text-primary{ color:var(--primary)!important; }
.text-navy{ color:var(--navy)!important; }
.text-navy-deep{ color:var(--navy-deep)!important; }
.text-mute{ color:var(--mute)!important; }
.text-ink{ color:var(--ink)!important; }
.bg-navy-deep{ background:var(--navy-deep)!important; color:#fff; }
.bg-surface{ background:var(--surface)!important; }
.bg-primary-soft{ background:var(--primary-soft)!important; }
.section{ padding:5rem 0; }
.section-lg{ padding:6rem 0; }
.eyebrow{
  font-size:.72rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--primary);
  margin-bottom:1rem;
}
.chip-eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  border:1px solid rgba(226,121,74,.25);
  background:rgba(255,255,255,.85);
  padding:.35rem .85rem;
  border-radius:999px;
  font-size:.7rem; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--primary);
  box-shadow:var(--shadow-soft);
}
.chip-eyebrow::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--primary); }
.highlight{
  background: linear-gradient(180deg, transparent 62%, rgba(226,121,74,.28) 62%, rgba(226,121,74,.28) 92%, transparent 92%);
  padding: 0 .12em;
}
.highlight-gold{
  background: linear-gradient(180deg, transparent 62%, rgba(240,180,80,.4) 62%, rgba(240,180,80,.4) 92%, transparent 92%);
}
/* Navbar */
.navbar-clf{
  position:fixed; top:0; left:0; right:0; z-index:1030;
  transition:all .25s ease;
  padding:.9rem 0;
}
.navbar-clf.transparent{ background:transparent; }
.navbar-clf.solid{ background:rgba(255,255,255,.96); backdrop-filter:blur(10px); box-shadow:0 1px 0 rgba(15,23,42,.06); }
.navbar-clf .navbar-brand img{ height:40px; }
.navbar-clf.transparent:not(.solid) .navbar-brand{
  background:rgba(255,255,255,.95); padding:.35rem .55rem; border-radius:8px; box-shadow:var(--shadow-soft);
}
.navbar-clf .nav-link{
  color:var(--navy)!important;
  font-size:.9rem; font-weight:500;
  padding:.5rem 1rem!important; border-radius:999px;
  transition:all .2s;
}
.navbar-clf .nav-link:hover, .navbar-clf .nav-link.active{
  background:rgba(226,121,74,.1); color:var(--primary)!important;
}
.navbar-clf .dropdown-menu{
  border:0; border-radius:14px; box-shadow:var(--shadow-lift);
  padding:.5rem; margin-top:.25rem;
}
.navbar-clf .dropdown-item{
  border-radius:8px; font-weight:500; padding:.5rem .75rem; font-size:.9rem;
}
.navbar-clf .dropdown-item:hover{ background:var(--primary-soft); color:var(--primary); }
/* Buttons */
.btn-clf{
  display:inline-flex; align-items:center; gap:.5rem;
  padding:.7rem 1.35rem;
  border-radius:999px;
  font-weight:600; font-size:.9rem;
  transition:all .2s;
  border:0;
  white-space:nowrap;
}
.btn-clf-lg{ padding:.85rem 1.6rem; font-size:.95rem; }
.btn-clf-primary{ background:var(--grad-primary); color:#fff; box-shadow:var(--shadow-lift); }
.btn-clf-primary:hover{ transform:translateY(-1px); color:#fff; box-shadow:0 16px 44px rgba(226,121,74,.28); }
.btn-clf-outline{ background:transparent; color:var(--navy-deep); border:1.5px solid var(--navy-deep); }
.btn-clf-outline:hover{ background:var(--navy-deep); color:#fff; }
.btn-clf-outline-white{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,.5); }
.btn-clf-outline-white:hover{ background:rgba(255,255,255,.1); color:#fff; }
.btn-clf-ghost{ background:transparent; color:var(--navy); }
.btn-clf-ghost:hover{ background:rgba(226,121,74,.1); color:var(--primary); }
/* Hero */
.hero{
  position:relative; overflow:hidden;
  min-height:88vh;
  display:flex; align-items:center;
  padding:9rem 0 6rem;
  background:url('../assests/img/hero-bg-5.png') center top/cover no-repeat;
}
.hero-bg{ position:absolute; inset:0; z-index:-2; width:100%; height:100%; object-fit:cover; object-position:right; }
.hero-fade{
  position:absolute; inset:0; z-index:-1;
  background:linear-gradient(to right,var(--surface) 0%, rgba(250,247,243,.7) 35%, transparent 60%);
}
.hero-fade-dark{
  background:linear-gradient(to right,var(--navy-deep) 0%, rgba(20,28,64,.75) 45%, rgba(20,28,64,.15) 75%);
}
.hero h1{
  font-size:clamp(2.25rem,5vw,4.5rem);
  line-height:1.05;
  max-width:800px;
}
.hero p.lead{
  font-size:clamp(1rem,1.4vw,1.25rem);
  color:rgba(32,35,45,.75);
  max-width:38rem;
  margin-top:1.5rem;
}
/* Cards */
.card-clf{
  background:#fff; border-radius:18px;
  box-shadow:var(--shadow-soft);
  border:1px solid var(--line);
  padding:0rem;
  height:100%;
  transition:all .25s;
}
.card-clf:hover{ transform:translateY(-3px); box-shadow:var(--shadow-lift); border-color:rgba(226,121,74,.3); }

.vbi-part .card-clf:hover img{filter: grayscale(0)!important;}

.l-icon{min-width: 95px; animation: floatIcon 3s ease-in-out infinite;
    min-height: 95px;
    position: absolute;
    left: 53px;
    color: #e8522245;
    z-index: -1;
    top: 87px;}

    @keyframes floatIcon {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
}

.r-icon {
    min-width: 110px; animation: floatIcon 3s ease-in-out infinite;
    min-height: 110px;
    position: absolute;
    right: 99px;
    color: #e8522245;
    z-index: -1;
    top: 111px;
}  

.icon-square{
  width:44px; height:44px; border-radius:12px;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(226,121,74,.1); color:var(--primary);
}
.icon-square-lg{ width:52px; height:52px; border-radius:14px; }
/* Sections tints */
.tint-cream{ background:var(--surface); }
.tint-gold{ background:oklch(0.975 0.02 75); background:#fdf6ec; }
/* Dot pattern */
.dot-pattern{
  position:absolute; inset:0; pointer-events:none; opacity:.3;
  background-image: radial-gradient(rgba(226,121,74,.35) 1px, transparent 1px);
  background-size:24px 24px;
}
.dot-pattern-white{
  background-image: radial-gradient(rgba(255,255,255,.9) 1.1px, transparent 1.1px);
  opacity:.12;
}
/* Partner logo grid */
.logo-tile{
  background:#fff; border-radius:16px; padding:1rem;
  border:1px solid var(--line);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-height:110px; transition:all .25s;
  text-decoration:none; color:var(--navy);
}
.logo-tile:hover{ transform:translateY(-3px); box-shadow:var(--shadow-soft); border-color:rgba(226,121,74,.35); color:var(--navy); }
.logo-tile img{ max-height:40px; width:auto; filter:grayscale(1); transition:filter .25s; }
.logo-tile:hover img{ filter:none; }
.logo-tile .name{ font-size:.75rem; font-weight:700; margin-top:.5rem; text-align:center; }
/* Stat */
.stat-num {
    font-family: 'Plus Jakarta Sans', sans-serif;
    font-weight: 800;
    font-size: clamp(2.5rem, 5vw, 2.8rem);
    color: #ffffff;
    line-height: 1;
}
.stat-label {
    margin-top: .5rem;
    font-weight: 700;
    color: #fff;
    text-transform: uppercase;
}
.stats svg{max-width: 59%;}
.stat-sub{ margin-top:.35rem; font-size:.85rem; color:rgba(255,255,255,.65); }
/* CTA band */
.cta-panel {
    position: relative;
    overflow: hidden;
    border-radius: 22px;
    padding: 2.5rem;
    background: #fff;
    border-left: 5px solid #e85121;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05);
}
.cta-panel h3{ font-size:1.6rem; }
/* DPI infographic */
.dpi-node{
  background:#fff; border-radius:18px; padding:1.4rem;
  border:1px solid rgba(20,28,64,.08);
  display:flex; flex-direction:column;
  min-height:180px;
}
.dpi-node.accent{ background:var(--grad-primary); color:#fff; border-color:transparent; box-shadow:var(--shadow-lift); }
.dpi-node img{ height:40px; width:fit-content; }
.dpi-node .heading{ font-weight:800; font-size:1.15rem; }
.dpi-node .badge-4c{
  display:inline-flex; align-items:center;
  background:rgba(255,255,255,.95); color:var(--primary);
  font-size:.7rem; font-weight:800;
  padding:2px 8px; border-radius:6px; margin-left:6px;
}
.dpi-arrow{ display:flex; align-items:center; justify-content:center; color:var(--primary); font-size:1.5rem; }
/* Sketch box (VBI foundationals) */
.sketch-box{
  position:relative;
  background:#fff; border-radius:14px; padding:1.25rem;
  box-shadow:4px 6px 0 rgba(15,23,42,.08);
  border:1.5px solid rgba(226,121,74,.5);
}
.sketch-box .num{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px; border-radius:50%;
  background:rgba(226,121,74,.1); color:var(--primary);
  font-weight:800; font-size:.85rem;
}
/* Pillar */
.pillar{ display:flex; flex-direction:column; align-items:center; }
.pillar .cap{ height:16px; background:var(--navy-deep); border-radius:6px 6px 0 0; width:110%; max-width:340px; }
.pillar .cap1{ 
    border-radius: 0px 0px 6px 6px;
   }
.pillar .cap-thin{ height:8px; background:rgba(20,28,64,.9); width:102%; max-width:320px; }
.pillar .shaft{
  width:94%; max-width:300px; background:linear-gradient(to bottom, #fff, #fdf6ec);
  padding:2rem 1.5rem 2.5rem; border:1px solid var(--line);
  box-shadow: inset 6px 0 16px rgba(15,23,42,.05), inset -6px 0 16px rgba(15,23,42,.05), 0 10px 30px -15px rgba(15,23,42,.2);
  text-align:center; border-radius:6px 6px 0 0;
}
.pillar.accent .cap, .pillar.accent .cap-thin{ background:var(--primary); }
.pillar .icon-p{
  display:inline-flex; width:44px; height:44px; align-items:center; justify-content:center;
  border-radius:12px; background:rgba(226,121,74,.1); color:var(--primary); margin-bottom:.75rem;
}
.pillar.accent .icon-p{ background:var(--primary); color:#fff; }
.pillar-ground{ margin-top:.5rem; height:8px; width:80%; max-width:280px; background:rgba(20,28,64,.1); border-radius:50%; filter:blur(6px); }
/* Story cards */
.story-card{
  background:#fff; border-radius:18px; overflow:hidden; box-shadow:var(--shadow-soft); border:1px solid var(--line);
  display:flex; flex-direction:column; height:100%;
}
.story-card .img{ aspect-ratio:16/10; background-size:cover; background-position:center; }
.story-card .body{ padding:1.5rem 1rem; flex:1; display:flex; flex-direction:column; }
.story-card .tag{ font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.16em; color:var(--primary); }
.story-card h4{ font-size:1.1rem; margin-top:.5rem; line-height:1.35; }
.story-card p{ color:var(--mute); font-size:.9rem; margin-top:.5rem; flex:1; }
/* Footer */
.footer{ background:var(--navy-deep); color:#fff; padding:5rem 0 2rem; }
.footer h5{ font-size:.7rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--primary); }
.footer a{ color:rgba(255,255,255,.75); font-size:.9rem; text-decoration:none; }
.footer a:hover{ color:#fff; }
.footer .logo-tile-footer{ display:inline-flex; background:#fff; padding:.5rem .8rem; border-radius:8px; }
.footer .logo-tile-footer img{ height:40px; }
.footer .social{
  display:inline-flex; align-items:center; justify-content:center;
  width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.06); color:rgba(255,255,255,.7);
}
.footer .social:hover{ background:var(--primary); color:#fff; }
.footer .legal{ border-top:1px solid rgba(255,255,255,.1); padding-top:2rem; margin-top:4rem; font-size:.75rem; color:rgba(255,255,255,.5); }
/* Utility */
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none;  }
.ring-line{ border:1px solid var(--line); }
.rounded-2xl{ border-radius:18px; }
.rounded-3xl{ border-radius:22px; }
.min-vh-hero{ min-height:88vh; }
/* Icon (svg feather-ish) */
.i{ display:inline-block; width:1em; height:1em; vertical-align:-.15em; stroke:currentColor; fill:none; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; }