/* Auto-extracted dari Elementor (ORION'S BELT). Sumber kebenaran = file ini. */

/* ===== (style) ===== */
/* Hide Hello theme footer chrome — we own the layout */
footer#colophon, footer#colophon .elementor-section,
footer#colophon .elementor-container, footer#colophon .elementor-column-wrap {
  background: transparent !important;
  padding: 0 !important; margin: 0 !important;
}

#cosmic-foot {
  background: #0d0f0f;
  border-top: 1px solid #4d4635;
  padding: 56px 64px 32px;
}
/* container-fluid — match header */
#cosmic-foot .cf-inner { width: 100%; margin: 0; }
#cosmic-foot .cf-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1.1fr 1.1fr;
  gap: 48px;
  padding-bottom: 32px;
  border-bottom: 1px solid #4d4635;
}
#cosmic-foot h5 {
  font-family: 'Sora', sans-serif;
  font-size: 12px; font-weight: 700;
  letter-spacing: .22em; text-transform: uppercase;
  color: #f2ca50; margin: 0 0 18px;
}

/* Brand column */
/* `flex-wrap: wrap` = JARING PENGAMAN, bukan pilihan tata letak. Di semua lebar
   yang diuji baris ini tetap satu baris, jadi efek visualnya NOL — terukur:
   tinggi .cf-brand-row 56px dengan maupun tanpa aturan ini di 1024 dan 1200.
   Gunanya baru terlihat kalau isinya suatu saat melebihi kolomnya lagi.

   KENAPA PERLU: grid TIDAK melindungi kolom ini seperti yang terlihat. Track
   `1.6fr` berarti `minmax(auto, 1.6fr)`, jadi mestinya kolom tidak pernah lebih
   sempit daripada min-content isinya. Tapi min-content .cf-col-brand terukur
   cuma 213px sementara barisnya benar-benar butuh 340px — selisih 127px, persis
   selebar <img>-nya. Sebabnya logo dipasang `height: 72px; width: auto`, dan
   Chrome menghitung sumbangan min-content elemen replaced seperti itu sebagai
   NOL. Jadi grid mengira 251px sudah cukup, lalu saat layout sebenarnya gambar
   tidak mau menyusut dan teks ber-`white-space: nowrap` juga tidak — barisnya
   meluber 89px MENIMPA kolom "Quick Links" (dilaporkan user 2026-08-11).

   Diuji: satu-satunya cara membuat min-content jujur adalah memberi <img>
   `width` eksplisit DAN `flex: none` sekaligus (213 -> 311px); `flex: none`
   saja, `aspect-ratio` saja, atau `width` saja semuanya tetap 213. Itu berarti
   mengunci rasio logo di CSS — kalau file logonya diganti, gambarnya penyet.
   `flex-wrap` mencapai tujuan yang sama tanpa angka ajaib: kelebihan lebar
   turun jadi baris baru, bukan menimpa tetangga. Diverifikasi dengan sengaja
   memakai ukuran lama yang kelewat besar: overlap 41px berubah jadi wrap
   (tinggi 72 -> 123px, clearance -100px). */
#cosmic-foot .cf-brand-row { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-bottom: 16px; }
#cosmic-foot .cf-brand-row img { height: 72px; width: auto; }
/* Brandtext stacks wordmark + tagline centered, same pattern as header */
#cosmic-foot .cf-brandtext {
  display: inline-flex; flex-direction: column;
  align-items: center;
  gap: 6px;
}
#cosmic-foot .cf-brand-row .cf-wm {
  font-family: 'Bodoni Moda', serif;
  font-size: 22px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase;
  color: #f2ca50; line-height: 1;
  white-space: nowrap;
  text-align: center;
}
#cosmic-foot .cf-brand-row .cf-tagline {
  font-family: 'Sora', sans-serif;
  font-size: 9px; font-weight: 500; line-height: 1;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: #8a7f64;
  text-align: center;
  white-space: nowrap;
}
#cosmic-foot .cf-tag {
  font-family: 'Sora', sans-serif;
  font-size: 14px; line-height: 1.65; color: #d0c5af;
  max-width: 320px; margin: 0 0 18px;
}
#cosmic-foot .cf-ig {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'Sora', sans-serif;
  font-size: 14px; color: #d0c5af; text-decoration: none;
  transition: color .2s ease;
}
#cosmic-foot .cf-ig svg { flex: none; }
#cosmic-foot .cf-ig:hover { color: #f2ca50; }

/* Links column */
#cosmic-foot .cf-links { display: flex; flex-direction: column; gap: 10px; }
#cosmic-foot .cf-links a,
#cosmic-foot .cf-links span {
  font-family: 'Sora', sans-serif;
  font-size: 14px; line-height: 1.5; color: #d0c5af;
  text-decoration: none;
  transition: color .2s ease;
}
#cosmic-foot .cf-links a:hover { color: #f2ca50; }

/* Stellar Group column logo */
#cosmic-foot .cf-group-logo {
  height: 38px; width: auto; display: block; margin: 0 0 18px;
}
/* Address block (Stellar Group office) */
#cosmic-foot .cf-addr {
  font-family: 'Sora', sans-serif;
  font-size: 14px; line-height: 1.7; color: #d0c5af;
  font-style: normal; margin: 0; max-width: 280px;
}

/* Bottom strip */
#cosmic-foot .cf-strip {
  display: flex; justify-content: center; align-items: center;
  gap: 16px; padding-top: 24px;
}
#cosmic-foot .cf-copy {
  font-family: 'Sora', sans-serif;
  font-size: 12px; color: #99907c; margin: 0;
  letter-spacing: .03em;
  text-align: center;
}

/* Narrow desktop (1024-1365) — blok merek footer dikecilkan + gap grid
   dirapatkan, supaya baris merek muat di kolomnya dan berhenti menimpa
   "Quick Links". Ini pasangan dari jaring pengaman `flex-wrap` di atas: wrap
   mencegah TABRAKAN, pita ini yang membuat isinya benar-benar MUAT.

   Kenapa 1365 batas atasnya: lebar kolom merek = (vw - 272) / 3. Dengan ukuran
   desktop penuh baris merek butuh 340px, jadi kolomnya baru longgar (slack >=
   20px) di vw >= 1352. Terukur: 1366 -> kolom 365, slack 25 (aman, tak perlu
   pita ini); 1280 -> kolom 336, slack -4; 1024 -> kolom 251, slack -89.

   Kenapa gap grid 48 -> 32 dan BUKAN cuma mengecilkan logo: merapatkan gap
   mengembalikan 48px ke baris kolom, dan 1,6/4,8 dari itu jatuh ke kolom merek
   (251 -> 267px @1024). Tanpa itu logo harus turun sampai 46-52px baru muat;
   dengan itu 56px sudah cukup. Terukur @1024, lebar yang dibutuhkan baris
   merek:

       gap grid   logo/wm/tagline      butuh   kolom   slack
         48        72 / 22   / 9        340     251     -89   <- rusak (sekarang)
         32        64 / 18   / 7,5      279     267     -12
         32        60 / 18   / 7,5      272     267      -5
         32        58 / 17,5 / 7,6      267     267       0   <- nol, ditolak
         32        56 / 17   / 7        256     267      11   <- DIPAKAI
         48        52 / 16   / 6,5      241     251      10

   Varian 58/17,5/7,6 sengaja DITOLAK walau lebarnya pas: slack 0px tidak
   menyisakan ruang untuk selisih rendering font antar-mesin. 56/17/7 memberi
   11px @1024 dan makin longgar ke atas (69px @1200, 125px @1366). */
@media (min-width: 1024px) and (max-width: 1365px) {
  #cosmic-foot .cf-grid { gap: 32px; }
  #cosmic-foot .cf-brand-row { gap: 12px; }
  #cosmic-foot .cf-brand-row img { height: 56px; }
  #cosmic-foot .cf-brand-row .cf-wm { font-size: 17px; letter-spacing: .12em; }
  #cosmic-foot .cf-brand-row .cf-tagline { font-size: 7px; letter-spacing: .02em; }
}

@media (max-width: 1023px) {
  #cosmic-foot { padding: 48px 32px 28px; }
  #cosmic-foot .cf-grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  #cosmic-foot .cf-col-brand { grid-column: 1 / -1; }
  /* Wordmark + tagline DISAMAKAN dengan pita 1024-1365 di atas (permintaan user
     2026-08-11: "dibawah 1024, font size sesuaikan sama diatas 1024").

     Sebelumnya di sini tidak ada override sama sekali, jadi teksnya jatuh ke
     nilai dasar desktop — wordmark 22px / tagline 9px. Akibatnya ukuran teks
     BERBALIK arah di ambang 1024: layar 1023px menampilkan judul LEBIH BESAR
     (22px) daripada layar 1024px (17px). Ini kelas anomali yang sama dengan
     yang sudah diperbaiki di header pada pita 1024-1159.

     Muat dengan aman: di bawah 1024 .cf-col-brand span penuh (grid-column
     1 / -1), jadi kolomnya jauh lebih lebar daripada isi barisnya — terukur
     slack 364px @768 dan 619px @1023. Jadi ini murni soal konsistensi ukuran,
     bukan soal ruang. */
  #cosmic-foot .cf-brand-row .cf-wm { font-size: 17px; letter-spacing: .12em; }
  #cosmic-foot .cf-brand-row .cf-tagline { font-size: 7px; letter-spacing: .02em; }
}
@media (max-width: 767px) {
  #cosmic-foot { padding: 40px 16px 24px; }
  #cosmic-foot .cf-grid { grid-template-columns: 1fr; gap: 28px; padding-bottom: 24px; }
  #cosmic-foot .cf-strip { flex-direction: column-reverse; align-items: flex-start; gap: 14px; padding-top: 20px; }
  /* `.cf-wm { font-size: 18px }` DICABUT 2026-08-11. Nilai itu ikut membuat
     tangga ukuran berbalik arah: 17px di 1000px, tapi justru NAIK ke 18px di
     700px. Karena pita <=1023 sekarang menetapkan 17px dan aturan ini berada
     di bawahnya dengan spesifisitas sama, membiarkannya akan menang di <=767
     dan langsung melanggar permintaan "dibawah 1024 sama dengan diatas 1024".
     Tanpa override, HP mewarisi 17px yang sama. */
}
