.elementor-kit-5{--e-global-color-primary:#0F2E40;--e-global-color-secondary:#0A2B55;--e-global-color-text:#16232C;--e-global-color-accent:#EDAF33;--e-global-color-alm_blue:#4185C0;--e-global-color-alm_bluea:#00548E;--e-global-color-alm_gsoft:#F6D58A;--e-global-color-alm_orang:#C96628;--e-global-color-alm_orgd:#A9511C;--e-global-color-alm_muted:#5B6B76;--e-global-color-alm_line:#DCE4EA;--e-global-color-alm_mist:#F2F6F9;--e-global-color-alm_wa:#1FAF5A;--e-global-typography-primary-font-family:"Plus Jakarta Sans";--e-global-typography-primary-font-size:40px;--e-global-typography-primary-font-weight:800;--e-global-typography-primary-line-height:1.35em;--e-global-typography-secondary-font-family:"Plus Jakarta Sans";--e-global-typography-secondary-font-size:22px;--e-global-typography-secondary-font-weight:700;--e-global-typography-secondary-line-height:1.35em;--e-global-typography-text-font-family:"Plus Jakarta Sans";--e-global-typography-text-font-size:17px;--e-global-typography-text-font-weight:400;--e-global-typography-text-line-height:1.35em;--e-global-typography-accent-font-family:"Plus Jakarta Sans";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:600;--e-global-typography-accent-line-height:1.35em;color:#16232C;font-family:"Plus Jakarta Sans", Sans-serif;font-size:17px;line-height:1.65em;}.elementor-kit-5 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1180px;}.e-con{--container-max-width:1180px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* AWAL FONT ALMIRA */ @font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:200 800;font-display:swap;src:url('https://www.almiratravel.co.id/wp-content/uploads/fonts/plus-jakarta-sans-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;} @font-face{font-family:'Plus Jakarta Sans';font-style:normal;font-weight:200 800;font-display:swap;src:url('https://www.almiratravel.co.id/wp-content/uploads/fonts/plus-jakarta-sans-latin.woff2') format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;} /* AKHIR FONT ALMIRA */ /* AWAL FONT FRAUNCES */ @font-face{font-family:'Fraunces';font-style:normal;font-weight:100 900;font-display:swap;src:url('https://www.almiratravel.co.id/wp-content/uploads/fonts/fraunces-latin-wght-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;} @font-face{font-family:'Fraunces';font-style:normal;font-weight:100 900;font-display:swap;src:url('https://www.almiratravel.co.id/wp-content/uploads/fonts/fraunces-latin-ext-wght-normal.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;} @font-face{font-family:'Fraunces';font-style:italic;font-weight:100 900;font-display:swap;src:url('https://www.almiratravel.co.id/wp-content/uploads/fonts/fraunces-latin-wght-italic.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;} /* AKHIR FONT FRAUNCES */ /* ===== Almira: gaya header & footer global (dipakai template 21206 / 21207 + homepage) ===== */ .alm-brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#16232C} .alm-brand img{border-radius:10px;flex:0 0 auto} .alm-brand span{display:flex;flex-direction:column;line-height:1.15} .alm-brand b{font-size:16px;font-weight:800} .alm-brand small{font-size:11px;color:#5B6B76} .alm-fbrand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff} .alm-fbrand img{border-radius:10px} .alm-fbrand span{display:flex;flex-direction:column;line-height:1.15} .alm-fbrand b{font-size:17px;font-weight:800} .alm-fbrand small{font-size:11px;color:rgba(255,255,255,.6)} .alm-lic{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px} .alm-lic span{font-size:11.5px;font-weight:700;color:#EDAF33; border:1px solid rgba(237,175,51,.35);border-radius:999px;padding:5px 11px} .alm-branches{display:flex;flex-wrap:wrap;gap:8px} .alm-branches a{font-size:13px;font-weight:600;color:rgba(255,255,255,.82);text-decoration:none; background:rgba(255,255,255,.08);border-radius:999px;padding:6px 13px;transition:.2s} .alm-branches a:hover{background:#EDAF33;color:#0F2E40} .alm-wa-float{position:fixed;right:18px;bottom:18px;z-index:9999;display:inline-flex;align-items:center; gap:9px;background:#1FAF5A;color:#fff;text-decoration:none;font-weight:700;font-size:14px; padding:12px 18px;border-radius:999px;box-shadow:0 12px 30px -10px rgba(31,175,90,.7)} .alm-wa-float:hover{background:#189B4C;color:#fff} @media(max-width:600px){.alm-wa-float span{display:none} .alm-wa-float{padding:14px;right:14px;bottom:14px}} /* AWAL PATCH POSTINFO */ /* widget post-info mode inline memakai margin negatif -8px yang membuat halaman meluber 8px di layar sempit; dinetralkan tanpa mengubah jarak antar item */ .elementor-widget-post-info ul.elementor-inline-items{margin-left:0!important;margin-right:0!important} .elementor-widget-post-info ul.elementor-inline-items > li.elementor-inline-item:first-child{padding-left:0!important} /* AKHIR PATCH POSTINFO */ /* AWAL FOOTER V2 */ /** * Footer global (template 21207) — versi 2. * * Footer lama adalah kotak navy #0F2E40 yang datar dan berhenti mendadak di * bawah #masa-tunggu (#0A2134). Dua biru yang berdekatan tapi tidak sama * membuat batasnya terbaca sebagai "blok baru menempel", bukan penutup. * Versi ini menyamakan latar ke #0A2134 dan memakai token yang sama persis * dengan #masa-tunggu (emas, jarak huruf, bobot) sehingga footer terbaca * sebagai dasar dari ruang gelap yang sama. * * SEMUA .elementor-kit-5 di sini di-scope ke #alm-foot-lockup / #alm-footer / * #alm-foot-base. Custom CSS Kit berlaku untuk SELURUH situs, jadi .elementor-kit-5 * tanpa ID akan bocor ke halaman lain. * * Scope ID juga dipakai untuk menang spesifisitas atas CSS bawaan Elementor: * Elementor menulis `.elementor-element.elementor-element-xxx .foo` (0,3,0), * sedangkan `#alm-footer .kelas .foo` bernilai (1,2,0) dan selalu menang. * Karena itu tidak ada satu pun !important di bawah ini. */ /* ============ 1. LOCKUP BRAND ============ */ /* Sorot tipis di tepi atas: mengulang kerucut cahaya #masa-tunggu dengan intensitas jauh lebih rendah, cukup untuk menandai "jahitan" antar section tanpa menciptakan sumber cahaya kedua yang bersaing. */ #alm-foot-lockup{position:relative;overflow:hidden;background:#0a2134} #alm-foot-lockup:before{content:"";position:absolute;inset:0;pointer-events:none; background:radial-gradient(58% 100% at 50% 0%,rgba(237,175,51,.10),transparent 72%)} /* Hairline emas sebagai garis jahit ke section di atasnya. */ #alm-foot-lockup:after{content:"";position:absolute;left:50%;top:0;height:1px; width:min(760px,86%);transform:translateX(-50%); background:linear-gradient(90deg,transparent,rgba(237,175,51,.5),transparent)} #alm-foot-lockup .alm-flock{position:relative;z-index:1;max-width:1180px;margin:0 auto; padding:54px 24px 6px;text-align:center;font-family:"Plus Jakarta Sans",sans-serif} /* Token identik dengan .alm-masa__brand-nama di #masa-tunggu. padding-left mengimbangi letter-spacing yang menambah spasi di huruf terakhir, supaya teks benar-benar optis di tengah. */ #alm-foot-lockup .alm-flock__nama{margin:0;font-size:13.5px;font-weight:800; letter-spacing:.32em;text-transform:uppercase;color:#f2d79a;padding-left:.32em} /* Separator lewat :not(:last-child):after, bukan diketik manual, agar jumlah pilar bisa berubah tanpa menyisakan bullet menggantung di ujung. */ #alm-foot-lockup .alm-flock__pilar{list-style:none;display:flex;flex-wrap:wrap; align-items:center;justify-content:center;margin:12px 0 0;padding:0; font-size:12.5px;font-weight:500;letter-spacing:1.5px;color:#93a8b9} /* Karakter ditulis literal, bukan sebagai escape CSS "2022". Custom CSS Kit disimpan lewat update_post_meta, yang menjalankan stripslashes_deep pada nilainya; backslash-nya hilang saat simpan dan yang tampil di halaman adalah teks "2022". Karakter literal kebal terhadap perlakuan itu. */ #alm-foot-lockup .alm-flock__pilar li:not(:last-child):after{content:"•"; margin:0 10px;color:rgba(237,175,51,.7)} /* ============ 2. BADAN FOOTER ============ */ #alm-footer{position:relative;background:#0a2134} /* ============ 3. EYEBROW JUDUL KOLOM ============ */ /* Tiga judul kolom sebelumnya h4 putih tebal 16px — sama beratnya dengan isi, jadi mata tidak punya pegangan. Diubah jadi eyebrow emas kecil ber-tracking lebar: kontras ukuran menggantikan kontras bobot. */ #alm-footer .alm-feyebrow .elementor-heading-title{display:flex;align-items:center;gap:11px; font-size:11.5px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#f2d79a} /* Garis emas pendek sebagai penanda awal kolom. flex:none supaya tidak ikut menyusut ketika judul membungkus ke dua baris. */ #alm-footer .alm-feyebrow .elementor-heading-title:before{content:"";flex:none; width:18px;height:1px;background:linear-gradient(90deg,rgba(237,175,51,.9),rgba(237,175,51,.15))} /* ============ 4. BRAND FOOTER ============ */ #alm-footer .alm-fbrand b{letter-spacing:-.2px} #alm-footer .alm-fbrand img{border-radius:12px;box-shadow:0 6px 18px -8px rgba(0,0,0,.7)} /* ============ 5. BADGE LISENSI ============ */ /* Legalitas adalah konten paling bernilai di footer travel umroh, jadi badge-nya dinaikkan dari teks ber-border menjadi chip dengan ikon perisai. */ #alm-footer .alm-lic{gap:9px;margin-bottom:28px} #alm-footer .alm-lic span{display:inline-flex;align-items:center;gap:7px; padding:7px 14px;font-size:11.5px;font-weight:700;color:#f6d886; background:rgba(237,175,51,.07);border:1px solid rgba(237,175,51,.32);border-radius:999px} #alm-footer .alm-lic svg{width:13px;height:13px;flex:none;fill:currentColor} /* ============ 6. IKON SOSIAL ============ */ /* Lingkaran outline, bukan bulatan abu solid: di latar gelap, isian solid membuat lima ikon jadi lima titik berat yang menarik mata lebih dulu daripada alamat kantor. */ #alm-footer .alm-fsocial .elementor-social-icon{background-color:transparent; border:1px solid rgba(255,255,255,.16); transition:transform .25s ease,border-color .25s ease,background-color .25s ease,color .25s ease} #alm-footer .alm-fsocial .elementor-social-icon:hover{background-color:#edaf33; border-color:#edaf33;transform:translateY(-2px)} #alm-footer .alm-fsocial .elementor-social-icon:hover i, #alm-footer .alm-fsocial .elementor-social-icon:hover svg{color:#0a2134;fill:#0a2134} /* ============ 7. TOMBOL GOOGLE MAPS ============ */ #alm-footer .alm-fmaps .elementor-button{display:inline-flex;align-items:center;gap:8px; font-size:13.5px;letter-spacing:.01em;transition:gap .25s ease,color .25s ease} #alm-footer .alm-fmaps .elementor-button:after{content:"↗";font-size:14px;line-height:1} #alm-footer .alm-fmaps .elementor-button:hover{color:#f6d886;gap:11px} /* ============ 8. PILL KOTA CABANG ============ */ /* Hover lama mengganti seluruh pill jadi blok emas penuh — 13 blok emas yang berkedip saat kursor lewat terasa kasar. Diganti glass tipis dengan hover yang hanya menegaskan tepi dan mengangkat 2px. */ #alm-footer .alm-branches{gap:9px} #alm-footer .alm-branches a{padding:7px 14px;font-size:12.5px;font-weight:600; color:rgba(255,255,255,.86);background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.09);border-radius:999px; transition:transform .22s ease,border-color .22s ease,background .22s ease,color .22s ease} #alm-footer .alm-branches a:hover{transform:translateY(-2px);color:#f6d886; background:rgba(237,175,51,.10);border-color:rgba(237,175,51,.55)} /* ============ 9. BARIS DASAR / COPYRIGHT ============ */ #alm-foot-base{background:#0a2134} /* ============ 10. AKSESIBILITAS ============ */ #alm-foot-lockup a:focus-visible, #alm-footer a:focus-visible{outline:2px solid #f6d886;outline-offset:3px} @media (prefers-reduced-motion:reduce){ #alm-footer .alm-branches a, #alm-footer .alm-fsocial .elementor-social-icon, #alm-footer .alm-fmaps .elementor-button{transition:none} #alm-footer .alm-branches a:hover, #alm-footer .alm-fsocial .elementor-social-icon:hover{transform:none} } /* ============ 11. RESPONSIF ============ */ /** * Section footer memakai elementor-column-gap-no, yang menolkan padding di * container maupun kolom. Lebar boxed-nya 1180px, jadi begitu viewport lebih * sempit dari itu konten menyentuh tepi layar (terukur: left = 0px) — terlihat * baik di tablet maupun ponsel. Ambangnya dipasang di 1219px, sedikit di atas * 1180px, supaya masih tersisa ruang napas tepat sebelum konten mepet. * Padding dipasang di section, bukan di kolom, supaya latarnya tetap penuh. */ @media (max-width:1219px){ #alm-footer, #alm-foot-base{padding-left:24px;padding-right:24px} } @media (max-width:1024px){ #alm-foot-lockup .alm-flock{padding:44px 24px 4px} } @media (max-width:767px){ #alm-foot-lockup .alm-flock{padding:38px 20px 2px} #alm-foot-lockup .alm-flock__nama{letter-spacing:.22em;padding-left:.22em;font-size:12.5px} #alm-foot-lockup .alm-flock__pilar{font-size:11.5px;letter-spacing:1px} #alm-foot-lockup .alm-flock__pilar li:not(:last-child):after{margin:0 7px} #alm-footer .alm-branches a{font-size:12px;padding:6px 12px} /* Tanpa ini ketiga kolom yang menumpuk saling menempel, sehingga "Link Google Maps" langsung bersambung ke judul kolom berikutnya. */ #alm-footer > .elementor-container > .elementor-column + .elementor-column{margin-top:34px} } /* ============ 12. TOMBOL WA GANDA ============ */ /** * .alm-wa-float dirender dua kali di homepage: sekali dari section #alm-float * milik halaman, sekali lagi dari footer global ini. Keduanya position:fixed * di koordinat sama sehingga tampak satu tombol, tapi pembaca layar * mengumumkannya dua kali dan ada dua target klik bertumpuk. * * Yang disembunyikan adalah milik footer, HANYA ketika halaman memang punya * #alm-float. Di halaman lain (artikel, kategori) footer tetap satu-satunya * pembawa tombol, jadi tombol tidak pernah hilang total. */ body:has(#alm-float) #alm-footer-wa .alm-wa-float{display:none} /* AKHIR FOOTER V2 */ /* AWAL HEADER V2 */ /* Semua aturan di-scope ke #alm-header atau #alm-offcanvas. ID memberi bobot spesifisitas yang cukup untuk menang atas aturan tema landingpress tanpa perlu !important, mengikuti pola yang sudah dipakai blok FOOTER V2. */ #alm-header{ --alm-hd-navy:#0F2E40; --alm-hd-emas:#EDAF33; --alm-hd-tinta:#16232C; --alm-hd-redup:#5B6B76; --alm-hd-kabut:#F2F6F9; --alm-hd-garis:#DCE4EA; --alm-hd-top-h:32px; z-index:999; } /* --- Lapis 1: topbar legalitas --- */ #alm-hd-top{ overflow:hidden; /* Transisi pada max-height, bukan display, supaya perubahannya halus dan tetap bisa dianimasikan browser tanpa JavaScript. */ max-height:var(--alm-hd-top-h); transition:max-height .28s ease, opacity .22s ease, padding .28s ease; } #alm-hd-izin .elementor-icon-list-items, #alm-hd-jam .elementor-icon-list-items{margin:0;padding:0;flex-wrap:nowrap} #alm-hd-izin .elementor-icon-list-item, #alm-hd-jam .elementor-icon-list-item{margin:0;white-space:nowrap} /* Jarak antar butir legalitas diatur di sini. Kontrol space_between pada icon-list mode inline hanya memberi jarak sangat rapat sehingga ikon butir berikutnya seolah menempel pada teks butir sebelumnya. */ #alm-hd-izin .elementor-icon-list-items{gap:0 24px} #alm-hd-izin .elementor-icon-list-icon, #alm-hd-jam .elementor-icon-list-icon{margin-right:6px} /* Saat Elementor menandai header sudah menempel, topbar digulung habis sehingga hanya bar utama yang tersisa. Kelas .elementor-sticky--effects dipasang oleh sticky bawaan Elementor, jadi tidak ada listener scroll tambahan yang perlu dijalankan. */ #alm-header.elementor-sticky--effects #alm-hd-top{ max-height:0; opacity:0; padding-top:0; padding-bottom:0; } #alm-header.elementor-sticky--effects{ box-shadow:0 10px 30px -18px rgba(15,46,64,.5); } #alm-header.elementor-sticky--effects #alm-hd-bar{ padding-top:6px; padding-bottom:6px; } #alm-hd-bar{transition:padding .28s ease} /* --- Lockup merek --- */ #alm-hd-logo img{display:block;width:52px;height:auto} #alm-hd-nama a,#alm-hd-nama{color:var(--alm-hd-tinta);text-decoration:none} #alm-hd-lockup-teks{gap:0} /* Baris badan hukum ditahan satu baris; kalau dibiarkan membungkus, tinggi lockup bertambah dan logo tidak lagi sejajar dengan nama merek. */ #alm-hd-badan .elementor-heading-title{white-space:nowrap} /* --- Garis emas di dasar header --- */ #alm-hd-garis{width:100%} #alm-hd-garis .elementor-divider{padding:0} #alm-hd-garis .elementor-divider-separator{ /* Divider Elementor hanya menyediakan warna solid; gradien dipasang di sini agar garis meredup di kedua ujung dan tidak terbaca sebagai garis pembatas biasa. */ border:0;height:2px; background:linear-gradient(90deg,transparent 0%,rgba(237,175,51,.15) 12%,var(--alm-hd-emas) 50%,rgba(237,175,51,.15) 88%,transparent 100%); } /* --- Kolom pencarian --- */ /* Kontrol gaya widget search-form sudah dikosongkan pada Elementor Pro 4.2.3, jadi seluruh tampilannya ditulis di sini. Bentuk normalnya bulat sempit selebar ikon saja. Dengan enam butir menu, lockup merek, dan tombol WhatsApp, kotak pencarian yang selalu terbentang membuat butir menu terakhir tertimpa. Kolom baru melebar saat difokus, yaitu satu-satunya saat lebar itu benar-benar dibutuhkan. */ /* Kolom dijaga tetap selebar 38px pada aliran tata letak, lalu saat difokus ia melebar sebagai lapisan di atas header dengan menumbuhkan diri ke kiri (right:0 pada posisi absolut). Kalau lebarnya ditambah secara biasa, pertumbuhannya mendorong ke kanan dan menimpa butir menu terakhir. */ #alm-hd-cari{position:relative;width:38px;flex:0 0 38px} #alm-hd-cari .elementor-search-form{position:static} #alm-hd-cari .elementor-search-form__container{ background:var(--alm-hd-kabut);border-radius:999px; border:1px solid transparent; transition:border-color .2s ease,background .2s ease,width .28s ease; min-height:38px;width:38px;padding:0;overflow:hidden; position:absolute;right:0;top:50%;transform:translateY(-50%); } #alm-hd-cari .elementor-search-form__container:hover{background:#E7EEF3} #alm-hd-cari .elementor-search-form__container:focus-within{ background:#fff;border-color:var(--alm-hd-garis); width:230px;padding:0 6px 0 4px; box-shadow:0 10px 26px -14px rgba(15,46,64,.45); } #alm-hd-cari .elementor-search-form__input{ font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;color:var(--alm-hd-tinta); background:transparent;padding:0;width:0;transition:width .28s ease; } #alm-hd-cari .elementor-search-form__container:focus-within .elementor-search-form__input{ width:auto;flex:1; } #alm-hd-cari .elementor-search-form__input::placeholder{color:var(--alm-hd-redup);opacity:1} #alm-hd-cari .elementor-search-form__icon{ color:var(--alm-hd-navy);min-width:38px;justify-content:center; } /* --- Mega menu --- */ #alm-hd-nav .e-n-menu-title{font-family:'Plus Jakarta Sans',sans-serif} /* Daftar item dipaksa satu baris. Tanpa ini flex-wrap bawaan membuat "Company Profile" jatuh ke baris kedua dan tinggi header melonjak, padahal lebar total ketiga zona masih muat di dalam 1180px. */ #alm-hd-nav .e-n-menu-heading{gap:2px;flex-wrap:nowrap} #alm-hd-nav .e-n-menu-title{white-space:nowrap} /* Zona menu boleh melebar sesuai isinya, tidak dijepit lebar tetap. */ #alm-hd-nav{flex:0 1 auto} /* Container isi dropdown tidak bisa diberi id maupun kelas sendiri: id yang diisi lewat _element_id akan digabung dengan id bawaan Elementor menjadi satu atribut berisi spasi, sedangkan _css_classes tidak diterapkan sama sekali pada elemen ini. Karena itu panel disasar lewat kelas bawaannya. */ #alm-hd-nav .e-n-menu-content > .e-con{margin-top:0} /* Tombol hamburger bawaan mega-menu disembunyikan: navigasi layar sempit ditangani panel off-canvas yang isinya bisa kita atur penuh. Widget tetap dipasang breakpoint tablet supaya daftar horizontalnya berhenti dirender di lebar yang tidak muat. */ #alm-hd-nav .e-n-menu-toggle{display:none} @media(max-width:1024px){ #alm-hd-nav{display:none} } /* --- Tombol aksi --- */ #alm-cta-header .elementor-button{ font-family:'Plus Jakarta Sans',sans-serif;white-space:nowrap; } #alm-hd-burger .elementor-button{ line-height:1;display:inline-flex;align-items:center;justify-content:center; } #alm-hd-burger .elementor-button-icon{margin:0} #alm-hd-burger .elementor-button-text{display:none} /* Fokus keyboard: tema tidak menyediakan penanda yang cukup terlihat di atas latar putih, jadi ditegaskan di sini agar navigasi tab tetap jelas. */ #alm-header a:focus-visible, #alm-header button:focus-visible, #alm-header input:focus-visible{ outline:2px solid var(--alm-hd-emas);outline-offset:2px;border-radius:6px; } /* --- Penyesuaian layar --- */ @media(max-width:767px){ /* Topbar disembunyikan di ponsel: tiga baris legalitas akan membungkus dan memakan tinggi layar yang justru dibutuhkan konten. Informasi yang sama diulang di dalam panel off-canvas. */ #alm-hd-top{display:none} /* Ketiga zona ditahan dalam satu baris. Container bar memakai flex-wrap bawaan Elementor; di lebar ponsel lockup merek yang panjang membuat zona kanan terlempar ke baris kedua sehingga tinggi header hampir berlipat. */ #alm-hd-bar{padding-left:14px;padding-right:14px} #alm-hd-bar > .e-con-inner{flex-wrap:nowrap;gap:10px} #alm-hd-lockup{gap:9px;flex-wrap:nowrap;min-width:0;flex:1 1 auto} #alm-hd-lockup-teks{min-width:0} #alm-hd-logo img{width:40px} #alm-hd-nama{font-size:15px} #alm-hd-nama .elementor-heading-title{white-space:nowrap} /* Baris badan hukum boleh terpotong, bukan membungkus: memaksanya tetap satu baris utuh akan melebarkan lockup melewati lebar layar. */ #alm-hd-badan{font-size:8.5px;letter-spacing:1.2px;min-width:0} #alm-hd-badan .elementor-heading-title{ white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block; } /* Label tombol WhatsApp diringkas jadi ikon saja supaya lockup merek tidak terdesak. Tombolnya sendiri tetap tampil - pada header lama seluruh kolom ini diberi hidden-mobile sehingga ajakan utama justru hilang di perangkat yang paling banyak dipakai. */ #alm-cta-header .elementor-button-text{display:none} #alm-cta-header .elementor-button{padding:11px 13px;border-radius:999px} #alm-cta-header .elementor-button-icon{margin:0;font-size:16px} } @media(max-width:420px){ #alm-hd-badan{display:none} } /* --- Panel off-canvas --- */ /* Jarak dan padding diatur pada container isi (#alm-oc-isi), bukan di sini, supaya nilainya tetap terbaca di panel editor Elementor. */ #alm-offcanvas .e-off-canvas__content{display:block} #alm-oc-sapaan{font-family:'Fraunces',Georgia,serif} #alm-offcanvas img{max-width:120px;height:auto} /* Panel memakai daftar tegak penuh; tombol burger bawaan nav-menu tidak pernah dipakai di sini. */ #alm-oc-menu .elementor-menu-toggle{display:none} #alm-oc-menu .elementor-nav-menu--main .elementor-item{ padding-left:0;padding-right:0; } #alm-oc-menu .elementor-nav-menu--main > ul > li{ border-bottom:1px solid rgba(255,255,255,.09); } #alm-oc-menu .elementor-nav-menu--dropdown{background:transparent} #alm-oc-menu .elementor-nav-menu .sub-menu .elementor-sub-item{ color:rgba(255,255,255,.72);font-size:14px;font-weight:600; } #alm-oc-izin .elementor-icon-list-item{align-items:flex-start} #alm-offcanvas a:focus-visible{outline:2px solid var(--alm-hd-emas,#EDAF33);outline-offset:2px} /* Panel hanya relevan selama tombol hamburger tampil; di desktop tombolnya disembunyikan sehingga panel tidak akan pernah terbuka. */ @media(min-width:1025px){ #alm-offcanvas{display:none} } /* AKHIR HEADER V2 */ /* AWAL HEADER V3 */ /* ============================================================ VARIAN HEADER V3 — "Tone Footer" Nada warna mengikuti footer global: dasar navy #0A2134, aksen emas #EDAF33 / krim #F2D79A, teks putih. Seluruh .elementor-kit-5 di-scope ke #alm-header3 / #alm-oc3. Custom CSS Kit berlaku untuk SELURUH situs, jadi .elementor-kit-5 tanpa ID akan bocor ke halaman lain — termasuk ke header v2 yang masih tayang. Tipografi memakai dua keluarga yang @font-face-nya sudah dimuat global di blok FONT ALMIRA / FONT FRAUNCES di atas berkas ini: - Plus Jakarta Sans : antarmuka, menu, tombol (geometris, modern) - Fraunces : aksen display (serif kontras tinggi) Keduanya di-host lokal dengan font-display:swap, jadi tidak ada permintaan ke Google Fonts dan tidak ada teks tak terlihat. ============================================================ */ #alm-header3{ --alm3-navy:#0A2134; /* dasar, identik dengan #alm-footer */ --alm3-navy-naik:#0F2E40; /* permukaan satu tingkat di atas dasar */ --alm3-emas:#EDAF33; --alm3-krim:#F2D79A; /* emas pucat, token eyebrow footer */ --alm3-teks:#FFFFFF; --alm3-redup:#93A8B9; /* abu kebiruan, token pilar footer */ --alm3-garis:rgba(237,175,51,.18); --alm3-top-h:32px; z-index:999; position:relative; } /* Kerucut cahaya emas tipis dari tepi atas, mengulang motif #alm-foot-lockup supaya header dan footer terbaca sebagai dua ujung dari ruang gelap yang sama. pointer-events:none wajib, kalau tidak lapisan ini akan memakan klik menu di bawahnya. */ #alm-header3:before{ content:"";position:absolute;inset:0;pointer-events:none;z-index:0; background:radial-gradient(70% 130% at 50% 0%,rgba(237,175,51,.10),transparent 70%); } #alm-header3 > *{position:relative;z-index:1} /* --- Lapis 1: topbar legalitas --- */ #alm-header3 #alm-hd3-top{ overflow:hidden; max-height:var(--alm3-top-h); transition:max-height .28s ease, opacity .22s ease, padding .28s ease; border-bottom:1px solid rgba(255,255,255,.06); } #alm-header3 #alm-hd3-izin .elementor-icon-list-items, #alm-header3 #alm-hd3-jam .elementor-icon-list-items{margin:0;padding:0;flex-wrap:nowrap} #alm-header3 #alm-hd3-izin .elementor-icon-list-item, #alm-header3 #alm-hd3-jam .elementor-icon-list-item{margin:0;white-space:nowrap} #alm-header3 #alm-hd3-izin .elementor-icon-list-items{gap:0 24px} #alm-header3 #alm-hd3-izin .elementor-icon-list-icon, #alm-header3 #alm-hd3-jam .elementor-icon-list-icon{margin-right:6px} #alm-header3 #alm-hd3-izin .elementor-icon-list-text, #alm-header3 #alm-hd3-jam .elementor-icon-list-text{ font-family:'Plus Jakarta Sans',sans-serif; font-size:11.5px;font-weight:600;letter-spacing:.04em; } /* Saat menempel, topbar digulung habis. Kelas .elementor-sticky--effects dipasang oleh sticky bawaan Elementor. */ #alm-header3.elementor-sticky--effects #alm-hd3-top{ max-height:0;opacity:0;padding-top:0;padding-bottom:0; } #alm-header3.elementor-sticky--effects{ box-shadow:0 14px 34px -20px rgba(0,0,0,.75); } #alm-header3.elementor-sticky--effects #alm-hd3-bar{padding-top:6px;padding-bottom:6px} #alm-header3 #alm-hd3-bar{transition:padding .28s ease} /* --- Celah putih di bawah header --- */ /* Ada DUA sebab berbeda, masing-masing dengan penawarnya sendiri. (1) Pita putih berkedip saat gulir balik ke puncak. Elementor mencopot kelas .elementor-sticky--effects begitu ambang lewat, tetapi tinggi header baru pulih 79px -> 96px setelah transisi .28s selesai. Sepanjang jeda itu header lebih pendek daripada .elementor-sticky__spacer yang menahan ruang setinggi 96px. Spacer itu diberi visibility:hidden oleh Elementor, jadi latarnya tidak pernah dicat, dan yang tersingkap adalah .site-inner milik tema yang berlatar putih. Ditawar dengan mengecat pembungkus
memakai navy yang sama: berapa pun tinggi header saat transisi, yang terlihat tetap navy. Warnanya ditulis harfiah, bukan var(--alm3-navy), karena variabel itu dideklarasikan pada #alm-header3 yang merupakan ANAK dari pembungkus ini sehingga tidak diwariskan ke atas. Kelas .elementor-21327 dipakai (bukan .elementor-location-header) supaya tidak bocor ke header v2 yang masih disimpan untuk rollback. (2) Garis putih tetap setinggi 1px di keadaan diam, hanya di Beranda. Section #alm-config adalah penampung pixel Facebook yang isinya cuma