/* ===============================
   BASE
=================================*/
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  background:#f4f6f9;
  color:#111;
}
.page{min-height:100vh}

/* ===============================
   HEADER (Loan header look)
=================================*/
.kib-header{
  position:sticky; top:0; z-index:50;
  background:#fff;
  border-bottom:1px solid rgba(0,0,0,.06);
}
.kib-header__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 14px;
  max-width:1100px;
  margin:0 auto;
}
.kib-brand{ text-decoration:none; color:#111; display:flex; align-items:center; gap:10px; }
.kib-brand__name{ font-weight:900; letter-spacing:.2px; line-height:1.05; }
.kib-brand__abbr{ font-weight:800; opacity:.7; margin-top:2px; }
.kib-header__right{ display:flex; align-items:center; gap:10px; }

.kib-lang{ display:flex; gap:8px; }
.kib-pill{
  border:1px solid rgba(0,0,0,.08);
  background:#fff;
  padding:10px 16px;
  border-radius:999px;
  font-weight:900;
  cursor:pointer;
}
.kib-pill.is-active{
  background:#0b1a2f;
  color:#fff;
  border-color:#0b1a2f;
}

.kib-menu-btn{
  width:44px;height:44px;border-radius:999px;
  border:1px solid rgba(0,0,0,.08);
  background:#fff; cursor:pointer;
  display:grid; place-items:center;
}
.kib-menu-btn__icon{
  width:18px;height:2px;background:#111;
  position:relative; display:block;
}
.kib-menu-btn__icon::before,
.kib-menu-btn__icon::after{
  content:""; position:absolute; left:0; width:18px;height:2px;background:#111;
}
.kib-menu-btn__icon::before{ top:-6px; }
.kib-menu-btn__icon::after{ top:6px; }

/* drawer */
.kib-drawer{ position:fixed; inset:0; pointer-events:none; }
.kib-drawer.is-open{ pointer-events:auto; }
.kib-drawer__backdrop{
  position:absolute; inset:0;
  background:rgba(0,0,0,.35);
  opacity:0; transition:opacity .25s ease;
}
.kib-drawer.is-open .kib-drawer__backdrop{ opacity:1; }
.kib-drawer__panel{
  position:absolute; right:0; top:0; bottom:0;
  width:min(340px, 86vw);
  background:#fff;
  transform:translateX(105%);
  transition:transform .25s ease;
  padding:14px;
}
.kib-drawer.is-open .kib-drawer__panel{ transform:translateX(0); }
.kib-drawer__head{ display:flex; justify-content:space-between; align-items:center; padding:6px 4px 14px; }
.kib-drawer__title{ font-weight:900; font-size:18px; }
.kib-drawer__close{ border:none; background:transparent; font-size:22px; cursor:pointer; }
.kib-drawer__link{
  display:block;
  padding:14px 10px;
  border-radius:12px;
  text-decoration:none;
  color:#111;
  font-weight:800;
}
.kib-drawer__link:hover{ background:#f4f6f9; }

/* ===============================
   HERO + SLIDER
=================================*/
.hero{
  padding:16px 0 10px;
  background:linear-gradient(180deg,#dfe8f4,#f4f6f9 55%);
}
.hero__wrap{
  max-width:1100px;
  margin:0 auto;
  padding:0 14px;
}
.hero-slider{
  width:100%;
  border-radius:22px;
  overflow:hidden;
  background:#cfe0f6;
  box-shadow:0 14px 34px rgba(0,0,0,.08);
}
.hero-slider__track{
  display:flex;
  width:300%;
  transform:translateX(0%);
  transition:transform .5s ease;
  touch-action:pan-y;
}
.hero-slide{ width:100%; flex:0 0 100%; height:280px; background:#cfe0f6; }
.hero-slide__img{ width:100%; height:100%; object-fit:cover; display:block; }
.hero-slide__img.is-missing{
  background:linear-gradient(135deg,#cfe0f6,#b9d1f4);
  width:100%; height:100%;
}
.hero-slider__dots{
  display:flex; justify-content:center; gap:10px;
  padding:12px;
  background:rgba(255,255,255,.4);
}
.dot{
  width:10px;height:10px;border-radius:50%;
  border:none; cursor:pointer;
  background:rgba(0,0,0,.25);
}
.dot.is-active{ background:#0b1a2f; }

.hero-card{
  margin-top:14px;
  background:#fff;
  border-radius:22px;
  padding:18px;
  box-shadow:0 14px 34px rgba(0,0,0,.10);
}
.crumbs{ color:#6b7280; font-weight:800; display:flex; gap:8px; flex-wrap:wrap; }
.crumbs .sep{ opacity:.7; }
.crumbs .is-current{ color:#2f6fb0; }
.hero-title{ margin:10px 0 10px; font-size:44px; line-height:1.05; font-weight:1000; }
.hero-underline{ width:74px; height:3px; background:#111; opacity:.35; border-radius:999px; margin-bottom:12px; }
.hero-subtitle{ margin:0; font-size:18px; font-weight:700; color:#111; opacity:.9; }

/* ===============================
   CONTENT
=================================*/
.section{ padding:14px 0 26px; }
.container{ max-width:1100px; margin:0 auto; padding:0 14px; display:grid; gap:16px; }

.card{
  background:#fff;
  border-radius:22px;
  padding:18px;
  box-shadow:0 14px 34px rgba(0,0,0,.08);
  overflow:hidden;
}
.card__title{ margin:0 0 10px; font-size:30px; font-weight:1000; }
.card__text{ margin:0 0 14px; font-size:18px; font-weight:700; line-height:1.5; color:#111; opacity:.9; }

.card__banner{
  margin-top:14px;
  border-radius:18px;
  overflow:hidden;
  background:#dbe8fb;
}
.card__banner img{ width:100%; height:220px; object-fit:cover; display:block; }
.card__banner img.is-missing{ height:220px; background:linear-gradient(135deg,#dbe8fb,#c7dbfb); }

.card--imageOnly{ padding:0; }
.card--imageOnly .card__banner{ margin:0; border-radius:22px; }
.card__banner--tall img{ height:360px; }
.btn--overlay{ position:absolute; z-index:2; left:18px; top:18px; }
.card--imageOnly{ position:relative; }

.card--remit{ padding:0; }
.remit-banner{ position:relative; border-radius:22px; overflow:hidden; }
.remit-banner img{ width:100%; height:300px; object-fit:cover; display:block; }
.remit-banner img.is-missing{ height:300px; background:linear-gradient(135deg,#b9d1f4,#86b0f1); }
.remit-overlay{
  position:absolute; inset:0;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-start;
  padding:18px;
  gap:8px;
  color:#111;
  background:linear-gradient(180deg,rgba(255,255,255,.0),rgba(255,255,255,.35) 50%, rgba(255,255,255,.65));
}
.remit-title{ margin:4px 0 0; font-size:30px; font-weight:1000; }
.remit-sub{ margin:0 0 8px; font-size:18px; font-weight:800; opacity:.9; }

/* Support card */
.support-card{
  background:#fff;
  border-radius:22px;
  overflow:hidden;
  box-shadow:0 14px 34px rgba(0,0,0,.08);
}
.support-card__head{ padding:18px; }
.support-card__title{ margin:0 0 8px; font-size:34px; font-weight:1000; }
.support-card__text{ margin:0 0 14px; font-size:18px; font-weight:700; line-height:1.5; opacity:.9; }
.support-card__phone{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.support-card__icon{ font-size:18px; }
.support-card__link{ color:#2f6fb0; font-weight:1000; text-decoration:none; font-size:22px; }
.support-card__image{ background:linear-gradient(180deg,#dbe8fb,#7fb0ee); height:260px; position:relative; }
.support-card__image img{ width:100%; height:100%; object-fit:cover; display:block; }
.support-card__image img.is-missing{ background:linear-gradient(180deg,#dbe8fb,#7fb0ee); }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:10px;
  text-decoration:none;
  border-radius:14px;
  padding:12px 18px;
  font-weight:900;
  border:1px solid rgba(0,0,0,.06);
  cursor:pointer;
}
.btn--soft{
  background:#d9ecfb;
  color:#2f6fb0;
}
.btn--large{ width:min(320px, 100%); padding:14px 18px; font-size:18px; }

/* ===============================
   REVEAL FADE IN ON SCROLL
=================================*/
.reveal{ opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
.reveal.is-visible{ opacity:1; transform:translateY(0); }

/* ===============================
   KIB FOOTER (MATCH IMAGE 2 & 3)
=================================*/
.kib-footer{
  margin-top: 30px;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

/* BLUE ACCORDION AREA (NAV) */
.kib-footer__nav{
  background:#3b6ea8;
  color:#fff;
  padding:16px 0 12px;
}

/* each accordion row */
.kib-acc-item{
  border-top:1px solid rgba(255,255,255,.18);
}
.kib-acc-item:first-child{ border-top:none; }

.kib-acc-header{
  width:100%;
  background:transparent;
  border:none;
  color:#fff;
  font-weight:900;
  font-size:26px;
  padding:18px 18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor:pointer;
}

.kib-acc-icon{
  font-size:18px;
  opacity:.9;
  transform: rotate(0deg);
  transition: transform .25s ease;
}

/* open state */
.kib-acc-item.is-open .kib-acc-icon{ transform: rotate(180deg); }

/* accordion body */
.kib-acc-body{
  max-height:0;
  overflow:hidden;
  transition:max-height .3s ease;
  padding:0 18px;
}
.kib-acc-item.is-open .kib-acc-body{ padding-bottom:12px; }

/* links inside */
.kib-acc-links a{
  display:block;
  color:#fff;
  text-decoration:none;
  font-size:22px;
  font-weight:700;
  padding:10px 0;
  opacity:.95;
}

/* group company line */
.kib-footer__group{
  padding:14px 18px 6px;
  font-size:20px;
  font-weight:800;
  border-top:1px solid rgba(255,255,255,.18);
  margin-top:10px;
  opacity:.95;
}

/* ADDRESS AREA (WHITE PAGE) */
.kib-footer__address{
  background:#ffffff;
  padding:18px 16px 0;
}

/* address card */
.kib-footer__address-card{
  background:#fff;
  border-radius:18px;
  padding:22px 20px 26px;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
}

/* badge */
.kib-footer__badge{
  background:#3b6ea8;
  color:#fff;
  display:block;
  width:100%;
  text-align:center;
  padding:14px 18px;
  border-radius:14px;
  font-weight:900;
  font-size:18px;
  letter-spacing:.5px;
  margin-bottom:18px;
}

.kib-footer__address h3{
  font-size:38px;
  font-weight:900;
  margin:0 0 16px;
  color:#0c0c0c;
}
.kib-footer__address p{
  font-size:20px;
  font-weight:700;
  line-height:1.45;
  margin:0 0 14px;
  color:#1a1a1a;
}
.kib-footer__branchTitle{
  font-weight:900;
  margin-top:18px;
  margin-bottom:6px;
}

/* BOTTOM BAR */
.kib-footer__bottom{
  margin-top:18px;
  background:linear-gradient(180deg,#4f7fba,#3b6ea8);
  color:#fff;
  text-align:center;
  padding:18px 12px;
  border-bottom-left-radius:22px;
  border-bottom-right-radius:22px;
}
.kib-footer__social{
  display:flex;
  justify-content:center;
  gap:14px;
  margin-bottom:10px;
}
.kib-social{
  width:44px;
  height:44px;
  border-radius:50%;
  background:rgba(255,255,255,.22);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  text-decoration:none;
  font-weight:900;
}
.kib-footer__copy{
  font-weight:900;
  font-size:18px;
}

/* MOBILE TWEAKS */
@media (max-width:420px){
  .hero-slide{ height:240px; }
  .hero-title{ font-size:38px; }
  .kib-acc-header{ font-size:24px; }
  .kib-acc-links a{ font-size:20px; }
  .kib-footer__address h3{ font-size:32px; }
  .kib-footer__address p{ font-size:18px; }
}