:root{
      --bg:#fdfeff;
      --bg2:#cbcdcf;
      --card: rgba(146, 143, 143, 0.582);
      --card2: rgba(146, 143, 143, 0.521);
      --line: rgba(255,255,255,.12);
      --dot: rgba(230,57,70,.15);
      --hero: rgba(80,140,255,.10);
      --heroMedia: rgba(0,0,0,.65); 
      --heroMedia2: rgba(0,0,0,.20);
      --heroMedia3: rgba(0,0,0,.55);
      --border: rgba(230,57,70,.35);
      --backgroundoptions: rgba(255,255,255,.06);
      --backgroundoptionsborder: rgba(255,255,255,.12);
      --bullet: rgba(255,255,255,.84);
      --green: #7CFFB4;
      --text: #19191a;
     /* --text:#b7bcc7; */
      --red:#e63946; /* KM red */
      --shadow: 0 18px 60px rgba(0,0,0,.55);
      --radius: 18px;
      --max: 100%;
    }
    footer {
  border-top: 1px solid var(--bg2);
  background: var(--card2);
  color: var(--text);
  padding: 50px 0 20px;
  font-size: 14px;
}

.footer-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr 1fr;
  gap: 30px;
}

.footer-title {
  font-weight: 900;
  margin-bottom: 12px;
  font-size: 15px;
  color: var(--text);
}
.footer-logo {
  font-size: 20px;
  font-weight: 900;
}

.footer-logo span {
  color: var(--red);
}

.footer-desc {
  margin-top: 10px;
  line-height: 1.5;
  color: var(--text);
}

.footer-links a {
  display: block;
  margin-bottom: 8px;
  color: var(--text);
  text-decoration: none;
  transition: .2s;
}

.footer-links a:hover {
  color: var(--heroMedia);
  transform: translateX(3px);
}
.footer-contact {
  font-size: 13px;
  line-height: 1.6;
  color: var(--text);
}

.footer-cta {
  margin-top: 14px;
  background-color: var(--red);
  border-radius: 30px;
}

.footer-cta .btn {
  width: 100%;
  text-align: center;
}

/* bottom bar */
.footer-bottom {
  margin-top: 30px;
  padding-top: 16px;
  border-top: 1px solid var(--bg2);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  font-size: 13px;
  color: var(--text);
}

/* social icons */
.footer-social {
  display: flex;
  gap: 10px;
}

.footer-social a {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid var(--bg2);
  transition: .2s;
}

.footer-social a:hover {
  background: var(--bg2);
}

/* responsive */
@media (max-width: 900px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 600px) {
  .footer-grid {
    grid-template-columns: 1fr;
  }
}
.flow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-top:30px;
}

.flow-step{
  text-align:center;
  flex:1;
  min-width:120px;
}

.circle{
  width:50px;
  height:50px;
  border-radius:50%;
  background:var(--red);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  margin:auto;
  margin-bottom:10px;
}
    /* simple mobile menu */
    #mobileMenu{
      display:none;
      position: fixed;
      inset: 0;
      background: var(--bg);
      z-index: 999;
      padding: 18px;
    }
    #mobileMenu .sheet{
      max-width: 520px;
      margin: 10vh auto 0;
      background: var(--bg);
      border: 1px solid var(--bg2);
      border-radius: 18px;
      padding: 14px;
      backdrop-filter: blur(10px);
    }
    #mobileMenu a{ display:block; padding: 14px 12px; border-radius: 14px; color: var(--text); font-weight: 900; }
    #mobileMenu a:hover{ background: var(--bg2); }
    #closeMenu{ width:100%; margin-top:10px; }
    
.icon-btn{
  width:44px; height:44px;
  display:inline-flex;
  align-items:center; justify-content:center;
  border-radius:999px;
  background:#292927;     /* Palomino orange */
  border:1px solid transparent;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border .15s ease;
}

.icon-btn img{
  width:22px; height:22px; display:block;
}

.icon-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0,0,0,.15);
  background: var(--primary-color);     /* subtle hover */
}