.tp-legacy-footer {
  display: none !important;
}

.tp-home-footer {
  position: relative;
  margin: 0;
  padding-top: 62px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  /* Tanpa sudut: footer lebar penuh bersiku, seperti gambar contoh Angga
     (30 Sep). Sudut atas 26px sempat tertinggal di T-232. (T-234) */
  border-radius: 0;
  background: var(--tp-common-black);
  /* background: linear-gradient(
    135deg,
    var(--tp-common-black) 0%,
    color-mix(in srgb, var(--tp-common-black) 90%, white) 58%,
    color-mix(in srgb, var(--tp-common-black) 82%, white) 100%
  ); */
  background: linear-gradient(
    135deg,
    #086d91 0%,
    color-mix(in srgb, #108fbb 90%, white) 58%,
    color-mix(in srgb, #0c6787 82%, white) 100%)
  ;
  box-shadow: 0 -14px 40px rgba(7, 21, 22, 0.12);
  overflow: hidden;
  isolation: isolate;
}

.tp-home-footer::before {
  position: absolute;
  top: -180px;
  right: -160px;
  width: 380px;
  height: 380px;
  border-radius: 50%;
  content: "";
  background: rgba(253, 70, 33, 0.1);
  filter: blur(10px);
  pointer-events: none;
}

.tp-home-footer-watermark {
  position: absolute;
  right: 0;
  bottom: 48px;
  left: 0;
  color: rgba(255, 255, 255, 0.027);
  font-family: var(--tp-ff-heading);
  font-size: clamp(72px, 16vw, 250px);
  font-weight: 500;
  line-height: 0.72;
  letter-spacing: -0.03em;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
  pointer-events: none;
}

.tp-home-footer-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 27px;
  margin-bottom: 42px;
  padding-bottom: 42px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.tp-home-footer-cta > span {
  display: inline-flex;
  margin-bottom: 13px;
  padding: 7px 11px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 999px;
  color: var(--tp-theme-1);
  background: rgba(255, 255, 255, 0.07);
  font-family: var(--tp-ff-body);
  font-size: 9px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tp-home-footer-cta h2 {
  margin: 0;
  color: var(--tp-common-white);
  font-family: var(--tp-ff-heading);
  font-size: clamp(35px, 10vw, 50px);
  font-weight: 500;
  line-height: 1.08;
}

.tp-home-footer-newsletter {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 9px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.tp-home-footer-newsletter:focus-within {
  border-color: rgba(253, 70, 33, 0.72);
  box-shadow: 0 0 0 4px rgba(253, 70, 33, 0.1);
}

.tp-home-footer-newsletter > i {
  display: none;
}

.tp-home-footer-newsletter input {
  width: 100%;
  min-height: 46px;
  padding: 10px 12px;
  border: 0;
  outline: 0;
  color: var(--tp-common-white);
  background: transparent;
  font-family: var(--tp-ff-body);
  font-size: 12px;
}

.tp-home-footer-newsletter input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}

.tp-home-footer-newsletter button {
  display: inline-flex;
  width: 100%;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 18px;
  border: 0;
  border-radius: 12px;
  color: var(--tp-common-white);
  background: var(--tp-theme-1);
  font-family: var(--tp-ff-body);
  font-size: 12px;
  font-weight: 600;
  transition: background-color 0.25s ease, transform 0.25s ease;
}

.tp-home-footer-newsletter button:hover {
  background: var(--tp-theme-1);
  transform: translateY(-2px);
}

.tp-home-footer-newsletter-status {
  display: none;
  color: rgba(255, 255, 255, 0.78);
  font-family: var(--tp-ff-body);
  font-size: 10px;
  text-align: center;
}

.tp-home-footer-newsletter-status:not(:empty) {
  display: block;
}

.tp-home-footer-main {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 36px 20px;
  padding-bottom: 48px;
}

.tp-home-footer-brand,
.tp-home-footer-contact {
  grid-column: 1 / -1;
}

.tp-home-footer-logo {
  display: inline-block;
  margin-bottom: 20px;
}

.tp-home-footer-logo img {
  display: block;
  width: 126px;
  height: auto;
}

.tp-home-footer-brand > p {
  max-width: 420px;
  margin: 0 0 21px;
  color: rgba(255, 255, 255, 0.6);
  font-family: var(--tp-ff-p);
  font-size: 13px;
  line-height: 1.7;
}

.tp-home-footer-socials {
  display: flex;
  align-items: center;
  gap: 8px;
}

.tp-home-footer-socials a {
  display: inline-flex;
  width: 39px;
  height: 39px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 50%;
  color: var(--tp-common-white);
  background: rgba(255, 255, 255, 0.07);
  font-size: 13px;
  transition: border-color 0.25s ease, background-color 0.25s ease, transform 0.25s ease;
}

.tp-home-footer-socials a:hover {
  border-color: var(--tp-theme-1);
  color: var(--tp-common-white);
  background: var(--tp-theme-1);
  transform: translateY(-3px);
}

.tp-home-footer-links h3,
.tp-home-footer-contact > h3 {
  margin: 0 0 17px;
  color: var(--tp-common-white);
  font-family: var(--tp-ff-body);
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tp-home-footer-links ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.tp-home-footer-links li:not(:last-child) {
  margin-bottom: 12px;
}

.tp-home-footer-links a {
  display: inline-flex;
  align-items: center;
  color: rgba(255, 255, 255, 0.62);
  font-family: var(--tp-ff-body);
  font-size: 11px;
  font-weight: 500;
  line-height: 1.35;
  transition: color 0.25s ease, transform 0.25s ease;
}

.tp-home-footer-links a::before {
  width: 0;
  margin-right: 0;
  color: var(--tp-theme-1);
  content: "\f061";
  font-family: var(--tp-ff-fontawesome);
  font-size: 9px;
  font-weight: 900;
  opacity: 0;
  overflow: hidden;
  transition: width 0.25s ease, margin-right 0.25s ease, opacity 0.25s ease;
}

.tp-home-footer-links a:hover {
  color: var(--tp-common-white);
  transform: translateX(3px);
}

.tp-home-footer-links a:hover::before {
  width: 10px;
  margin-right: 6px;
  opacity: 1;
}

.tp-home-footer-contact {
  padding: 22px 19px;
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.tp-home-footer-contact-item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.tp-home-footer-contact-item + .tp-home-footer-contact-item {
  margin-top: 17px;
  padding-top: 17px;
  border-top: 1px solid rgba(255, 255, 255, 0.11);
}

.tp-home-footer-contact-icon {
  display: inline-flex;
  flex: 0 0 auto;
  width: 43px;
  height: 43px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--tp-common-white);
  background: var(--tp-theme-1);
  box-shadow: 0 7px 18px rgba(253, 70, 33, 0.25);
  font-size: 14px;
}

.tp-home-footer-contact-item div {
  min-width: 0;
}

.tp-home-footer-contact-item small,
.tp-home-footer-contact-item a {
  display: block;
  font-family: var(--tp-ff-body);
}

.tp-home-footer-contact-item small {
  margin-bottom: 4px;
  color: rgba(255, 255, 255, 0.48);
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tp-home-footer-contact-item a {
  color: var(--tp-common-white);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.3;
  overflow-wrap: anywhere;
  transition: color 0.25s ease;
}

.tp-home-footer-contact-item a:hover {
  color: var(--tp-theme-1);
}

.tp-home-footer-bottom {
  position: relative;
  z-index: 2;
  padding: 22px 0 28px;
  background: rgba(0, 0, 0, 0.22);
}

.tp-home-footer-bottom .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  text-align: center;
}

.tp-home-footer-bottom p,
.tp-home-footer-bottom div {
  margin: 0;
  color: rgba(255, 255, 255, 0.5);
  font-family: var(--tp-ff-body);
  font-size: 12px;
  font-weight: 500;
}

.tp-home-footer-bottom strong {
  color: var(--tp-common-white);
}

.tp-home-footer-bottom div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.tp-home-footer-bottom a {
  color: rgba(255, 255, 255, 0.58);
  transition: color 0.25s ease;
}

.tp-home-footer-bottom a:hover {
  color: var(--tp-theme-1);
}

@media (min-width: 576px) {
  .tp-home-footer-newsletter {
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 7px;
    padding: 7px 7px 7px 18px;
    border-radius: 999px;
  }

  .tp-home-footer-newsletter > i {
    display: inline-block;
    color: rgba(255, 255, 255, 0.45);
    font-size: 16px;
  }

  .tp-home-footer-newsletter input {
    padding-right: 8px;
    padding-left: 8px;
  }

  .tp-home-footer-newsletter button {
    width: auto;
    border-radius: 999px;
  }

  .tp-home-footer-newsletter-status {
    position: absolute;
    top: calc(100% + 8px);
    right: 18px;
    text-align: right;
  }

  .tp-home-footer-logo img {
    width: 142px;
  }

  .tp-home-footer-links a {
    font-size: 14px;
  }

  .tp-home-footer-contact {
    padding: 25px 23px;
  }

  .tp-home-footer-contact-item a {
    font-size: 15px;
  }
}

@media (min-width: 768px) {
  /* Footer lebar penuh (revisi Angga 30 Sep, butir 3). Dulu `margin: 16px` +
     sudut 30px di sini dan `margin: 20px` + 34px di >= 1200px membuatnya
     tampak seperti kotak mengambang. (T-232) */
  .tp-home-footer {
    margin: 0;
    border-radius: 0;
  }

  .tp-home-footer-top {
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    align-items: center;
    gap: 48px;
    padding-bottom: 52px;
  }

  .tp-home-footer-main {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 30px;
  }

  .tp-home-footer-brand {
    grid-column: span 2;
  }

  .tp-home-footer-contact {
    grid-column: span 2;
  }

  .tp-home-footer-bottom {
    border-radius: 0;
  }

  .tp-home-footer-bottom .container {
    flex-direction: row;
    justify-content: space-between;
    text-align: left;
  }
}

@media (min-width: 1200px) {
  .tp-home-footer {
    padding-top: 92px;
  }

  .tp-home-footer-top {
    gap: 80px;
    margin-bottom: 58px;
    padding-bottom: 58px;
  }

  .tp-home-footer-main {
    grid-template-columns: minmax(0, 1.25fr) minmax(0, 0.55fr) minmax(0, 0.55fr) minmax(340px, 1.1fr);
    gap: 45px;
    padding-bottom: 64px;
  }

  .tp-home-footer-brand,
  .tp-home-footer-contact {
    grid-column: auto;
  }

  .tp-home-footer-contact {
    padding: 30px 27px;
  }

  .tp-home-footer-bottom {
    border-radius: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .tp-home-footer-newsletter,
  .tp-home-footer-newsletter button,
  .tp-home-footer-socials a,
  .tp-home-footer-links a,
  .tp-home-footer-links a::before,
  .tp-home-footer-contact-item a {
    transition: none;
  }
}

/* ==========================================================================
   Lencana unduh aplikasi (ARA-151)

   Menempati slot yang sama dengan `.tp-home-footer-newsletter`, jadi ukuran
   dan bahasa rupanya sengaja dibuat sama: kartu kaca, radius 18px, aksen
   --tp-theme-1. Keduanya tidak pernah tampil bersamaan; templatenya memilih
   satu berdasarkan ada-tidaknya tautan toko.
   ========================================================================== */

.tp-home-footer-appdl {
  display: grid;
  gap: 10px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.07);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
}

.tp-home-footer-appdl-label {
  font-family: var(--tp-ff-body);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.62);
}

.tp-home-footer-appdl-badges {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 9px;
}

.tp-home-footer-appdl-badge {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  min-height: 46px;
  padding: 8px 16px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  color: var(--tp-common-white);
  text-decoration: none;
  transition: border-color 0.3s ease, background 0.3s ease, transform 0.3s ease;
}

.tp-home-footer-appdl-badge:hover,
.tp-home-footer-appdl-badge:focus-visible {
  border-color: rgba(253, 70, 33, 0.72);
  background: rgba(253, 70, 33, 0.12);
  color: var(--tp-common-white);
  transform: translateY(-1px);
}

.tp-home-footer-appdl-badge i {
  font-size: 22px;
  line-height: 1;
  flex: 0 0 auto;
}

.tp-home-footer-appdl-badge span {
  display: grid;
  line-height: 1.2;
  min-width: 0;
}

.tp-home-footer-appdl-badge small {
  font-size: 10px;
  letter-spacing: 0.04em;
  color: rgba(255, 255, 255, 0.62);
}

.tp-home-footer-appdl-badge strong {
  font-family: var(--tp-ff-heading);
  font-size: 15px;
  font-weight: 600;
}

@media (min-width: 576px) {
  .tp-home-footer-appdl-badges {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .tp-home-footer-appdl-badge {
    transition: none;
  }

  .tp-home-footer-appdl-badge:hover,
  .tp-home-footer-appdl-badge:focus-visible {
    transform: none;
  }
}

/* Profil ulasan pihak ketiga (ARA-161).
   Dipisah dari `.tp-home-footer-socials` dengan sengaja: ulasan itu bukti,
   bukan kanal sosial, dan pil bernama terbaca mata sementara ikon polos tidak.
   Sasaran sentuhnya dijaga 40px -- ini blok yang ikut tampil di ponsel. */
.tp-home-footer-reviews {
  margin-top: 18px;
}

.tp-home-footer-reviews-label {
  display: block;
  margin-bottom: 9px;
  color: rgba(255, 255, 255, 0.45);
  font-family: var(--tp-ff-body);
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tp-home-footer-reviews-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tp-home-footer-review {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 999px;
  color: var(--tp-common-white);
  background: rgba(255, 255, 255, 0.07);
  font-family: var(--tp-ff-body);
  font-size: 13px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  transition: border-color 0.25s ease, background-color 0.25s ease, transform 0.25s ease;
}

.tp-home-footer-review:hover,
.tp-home-footer-review:focus-visible {
  border-color: var(--tp-theme-1);
  color: var(--tp-common-white);
  background: var(--tp-theme-1);
  transform: translateY(-2px);
}

/* Lambangnya mengikuti warna pilnya (putih), tanpa lingkaran berwarna.
   Sempat dicoba lingkaran hijau merek Tripadvisor; pemilik repo memilih ini
   supaya kedua lambang menyatu dengan footer dan tidak saling berebut
   perhatian. `fill="currentColor"` pada SVG-nya yang membuat ini bekerja --
   mengganti warnanya cukup dari CSS, tidak perlu menyentuh path-nya.
   Kotaknya dipatok 18px supaya lambang SVG dan ikon font sama lebarnya; tanpa
   itu kedua pil tidak sejajar. */
.tp-home-footer-review-mark {
  display: inline-flex;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  align-items: center;
  justify-content: center;
  color: #ffffff;
  font-size: 14px;
  line-height: 1;
}

/* `main.css:10139` memasang `svg { color: var(--tp-theme-1); }` untuk SELURUH
   situs. Aturan itu menempel langsung pada elemen `svg`, jadi ia menang atas
   warna yang diwarisi dari pembungkusnya -- `fill="currentColor"` pada burung
   hantu Tripadvisor karena itu terbit biru tema, bukan putih.

   Penawarnya kelas sendiri pada `svg`-nya, bukan selektor turunan
   (`.tp-home-footer-review-mark svg`). Dua-duanya cukup mengalahkan `svg`,
   tapi kelas tidak bergantung pada susunan pembungkusnya: memindahkan
   lambangnya ke markup lain tidak membuatnya diam-diam biru lagi.
   (Permintaan pemilik repo: "kasih custom class aja biar aman".)

   Jangan dihapus tanpa memeriksa baris tersebut. */
.tp-home-footer-review-svg {
  color: inherit;
  fill: currentColor;
}

.tp-home-footer-review-external {
  font-size: 10px;
  opacity: 0.6;
}

/* ---------------------------------------------------------------------------
   Latar footer dari editor depan (seksi global `site_footer`). (T-232)

   - `.has-bg-color`: gradasi bawaan tema, dengan warna pemilik situs.
   - `.has-bg-image`: gambar penuh; bagian atasnya memudar ke putih supaya
     menyatu dengan section di atasnya (gambar contoh dari Angga, 30 Sep),
     bagian bawahnya digelapkan supaya teks putih di kolom tautan tetap terbaca.
     Karena atasnya putih, judul ajakan di sana ditulis gelap.
   Warna diabaikan kalau gambar ada -- template hanya memasang salah satu kelas.
   --------------------------------------------------------------------------- */
.tp-home-footer.has-bg-color {
  background: linear-gradient(
    135deg,
    var(--tt1-footer-color) 0%,
    color-mix(in srgb, var(--tt1-footer-color) 90%, white) 58%,
    color-mix(in srgb, var(--tt1-footer-color) 82%, black) 100%
  );
}

.tp-home-footer.has-bg-image {
  padding-top: 140px;
  border-top: 0;
  border-radius: 0;
  box-shadow: none;
  background:
    linear-gradient(
      to bottom,
      #fff 0%,
      rgba(255, 255, 255, 0.82) 14%,
      rgba(255, 255, 255, 0) 34%,
      rgba(7, 21, 22, 0.35) 60%,
      rgba(7, 21, 22, 0.72) 100%
    ),
    var(--tt1-footer-image) center / cover no-repeat;
}

.tp-home-footer.has-bg-image::before {
  display: none;
}

.tp-home-footer.has-bg-image .tp-home-footer-cta h2,
.tp-home-footer.has-bg-image .tp-home-footer-cta span {
  color: var(--tp-common-black, #071516);
}

@media (min-width: 1200px) {
  .tp-home-footer.has-bg-image {
    padding-top: 190px;
  }
}
