:root {
  --kk-gold: #f2a900;
  --kk-gold-dark: #d99500;
  --kk-navy: #2c2b38;
  --kk-text-dark: #1a1a1a;
  --kk-text-muted: #6c6c6c;
  --kk-band-bg: #f4f4f4;
  --kk-red: #c8202f;
  --kk-border: #e6e6e6;
  --kk-font-heading: "Raleway", sans-serif;
  --kk-font-body: "Roboto", sans-serif;
}

#rental-program-title {
    position: absolute;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    gap: 16px;
    padding: 5% 10%;
    background-color: #212121b0
}

#rental-program-title h1 {
    align-self: stretch;
    text-align: left;
    text-shadow: 5px 5px 20px #000;
    color: gold;
    font-size: 32px;
    line-height: 1.3;
}

#rental-program-title p {
    color: #fff;
    font-size: 16px;
    text-shadow: 5px 5px 20px #000
}

#rental-program-title img {
    width: 100px;
    height: auto;
    align-self: flex-start;
    margin-bottom: 10px;
}

@media (max-width:480px) {
    #rental-program-title h1 {
        font-size: 18px;
        line-height: 1.2;
        text-align: start
    }

    #rental-program-title p {
        font-size: 12px;
        line-height: 1.2
    }
}

.how-it-works-step { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.step-number {
  width: 40px; height: 40px; border-radius: 50%;
  background-color: var(--kk-gold, #f2a900);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 16px;
}
.how-it-works-step h3 { font-size: 14px; font-weight: 600; margin: 0; }

/* ==========================================================================
   Section 7 — Why Choose Kenkim
   ========================================================================== */
.why-choose-kenkim {
  padding: 45px 0;
  background-color: #ffffff;
}

.why-choose-item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.why-choose-item i {
  font-size: 22px;
  color: var(--kk-gold);
  flex-shrink: 0;
}

.why-choose-item h3 {
  font-family: var(--kk-font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--kk-text-dark);
  margin: 0;
  line-height: 1.3;
}

.package-card {
  height: 100%;
  padding: 24px;
  border: 1px solid #e6e6e6;
  border-radius: 6px;
  background: #fff;
  text-align: center;
}
.package-card h3 { font-size: 17px; font-weight: 700; margin-bottom: 14px; }
.package-card ul { list-style: none; padding: 0; margin: 0 0 18px 0; text-align: left; }
.package-card ul li {
  position: relative; padding-left: 16px; font-size: 14px;
  color: #6c6c6c; margin-bottom: 8px;
}
.package-card ul li::before {
  content: ""; position: absolute; left: 0; top: 7px;
  width: 6px; height: 6px; border-radius: 50%;
  background-color: var(--kk-gold, #f2a900);
}

/* ==========================================================================
   Section 5 — Industries We Serve
   ========================================================================== */
.industries-we-serve {
  padding: 45px 0;
  background-color: #ffffff;
}

.industry-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}

.industry-item i {
  font-size: 24px;
  color: var(--kk-navy);
}

.industry-item h3 {
  font-family: var(--kk-font-body);
  font-size: 14px;
  font-weight: 600;
  color: var(--kk-text-dark);
  margin: 0;
  line-height: 1.3;
}

.rental-content-block { max-width: 900px; margin: 0 auto 36px auto; }
.rental-content-block h2 {
  font-family: var(--kk-font-heading, "Raleway", sans-serif);
  font-size: 20px; font-weight: 800; margin-bottom: 10px;
}
.rental-content-block p { font-size: 14px; line-height: 1.7; color: #444; margin: 0; }

/* ==========================================================================
   Section 10 — Footer CTA
   ========================================================================== */
.footer-cta {
  padding: 50px 0;
  background-color: var(--kk-navy);
}

.footer-cta h2 {
  font-family: var(--kk-font-heading);
  font-size: 24px;
  font-weight: 800;
  color: #ffffff;
  margin-bottom: 24px;
}

.footer-cta-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px;
}

.footer-cta-buttons .btn-primary {
  background-color: var(--kk-gold);
  border-color: var(--kk-gold);
  color: #1a1a1a;
  font-weight: 700;
  padding: 10px 24px;
  border-radius: 4px;
}

.footer-cta-buttons .btn-primary:hover {
  background-color: var(--kk-gold-dark);
  border-color: var(--kk-gold-dark);
}

.footer-cta-buttons .btn-outline-primary {
  border-color: #ffffff;
  color: #ffffff;
  font-weight: 600;
  padding: 10px 24px;
  border-radius: 4px;
}

.footer-cta-buttons .btn-outline-primary:hover {
  background-color: #ffffff;
  color: var(--kk-navy);
}

/* ==========================================================================
   Responsive tweaks
   ========================================================================== */
@media (max-width: 767px) {
  .why-kenkim .col-6 h3,
  .industries-we-serve .col-6 h3 {
    font-size: 13px;
  }

  .footer-cta-buttons {
    flex-direction: column;
    align-items: stretch;
  }

  .footer-cta-buttons .btn {
    width: 100%;
  }
}

.kenkim-banner-buttons {
    display: flex;
    gap: 12px;
    margin-top: 6px;
    flex-wrap: wrap;
}

.kenkim-banner-buttons button {
    font-weight: 700;
    text-decoration: none;
    font-size: 16px;
    padding: 10px 20px;
    border-radius: 20px;
    border: 2px solid gold;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
    white-space: nowrap;
}

.banner-btn-primary {
    background-color: gold;
    color: #000;
}

.banner-btn-primary:hover {
    background-color: #e6c200;
}

.banner-btn-secondary {
    background-color: transparent;
    color: gold;
}

.banner-btn-secondary:hover {
    background-color: gold;
    color: #000;
}

@media (max-width: 480px) {
    .kenkim-banner-buttons button {
        font-size: 13px;
        padding: 8px 14px;
    }
}