/******* Do not edit this file *******
Woody Code Snippets CSS and JS
Saved: Oct 04 2026 | 10:38:48 */
/* =====================================================================
   RKZ LANDING KIT — v1.0.1
   Tampilan bersama untuk landing page layanan RKZ Surabaya.

   CARA PASANG (Woody Snippets):
   - Tipe snippet: CSS
   - Tempel isi file ini APA ADANYA (tanpa tag <style>).
   - Where to execute: Run everywhere (aman: semua aturan hanya berlaku
     di dalam pembungkus .rkz-lp, halaman lain tidak terpengaruh).

   PRASYARAT: Bootstrap 5.3 dan Bootstrap Icons (sudah dimuat tema).

   ATURAN PERAWATAN (penting, karena dipakai banyak halaman):
   1. Jangan mengubah tampilan komponen yang sudah dipakai halaman live.
      Jika perlu gaya baru, tambahkan VARIAN (mis. .rkz-lp-card--flat).
   2. Setiap perubahan: naikkan nomor versi di judul file ini dan catat
      di bagian CHANGELOG paling bawah.
   3. CSS khusus satu halaman ditulis di snippet halaman itu sendiri,
      bukan di sini.
   ===================================================================== */


/* ---------------------------------------------------------------------
   1. TOKENS
   Ubah warna per halaman dengan modifier, mis.:
   <div class="rkz-lp rkz-lp--neuro">  (lihat bagian 18. TEMA)
   --------------------------------------------------------------------- */
.rkz-lp{
  --lp-ink:#0f172a;
  --lp-heading:#17372d;
  --lp-body:#3f4f49;
  --lp-muted:#64748b;
  --lp-line:#e2ebe6;
  --lp-soft:#f5faf7;
  --lp-white:#fff;

  --lp-primary:#0f6a48;
  --lp-primary-dark:#0a4933;
  --lp-accent:#19a66f;
  --lp-lime:#83c341;
  --lp-on-dark:#e3f2ec;
  --lp-on-dark-accent:#9be5a9;

  --lp-danger:#c62828;
  --lp-danger-dark:#9b1c1c;
  --lp-danger-soft:#fdecec;

  --lp-dark-1:#071827;
  --lp-dark-2:#083d32;

  --lp-radius-sm:.85rem;
  --lp-radius:1.15rem;
  --lp-radius-lg:1.4rem;

  --lp-shadow:0 18px 42px rgba(2,44,34,.10);
  --lp-shadow-soft:0 12px 30px rgba(15,23,42,.07);

  color:var(--lp-ink);
  overflow-x:clip;
}


/* ---------------------------------------------------------------------
   2. BASE
   --------------------------------------------------------------------- */
.rkz-lp *,
.rkz-lp *::before,
.rkz-lp *::after{ box-sizing:border-box; }
/* :where() membuat aturan dasar ini kalah dari aturan komponen (hero, avatar, card) */
.rkz-lp :where(img){ max-width:100%; height:auto; }
.rkz-lp [id]{ scroll-margin-top:96px; }
.rkz-lp a:focus-visible,
.rkz-lp button:focus-visible,
.rkz-lp summary:focus-visible{ outline:3px solid rgba(22,117,184,.45); outline-offset:3px; }

.rkz-lp-section{ padding:3rem 0; }
.rkz-lp-section--soft{
  background:
    radial-gradient(680px 310px at 100% 0%,rgba(15,118,110,.08),transparent 70%),
    var(--lp-soft);
}
.rkz-lp-section--fade{ background:linear-gradient(180deg,#fff,var(--lp-soft)); }
.rkz-lp-section--light{ background:#f8f9fa; }


/* ---------------------------------------------------------------------
   3. TYPOGRAPHY
   --------------------------------------------------------------------- */
.rkz-lp-eyebrow{
  display:inline-flex; align-items:center; gap:.45rem; margin:0 0 .6rem;
  color:var(--lp-primary); font-size:.8rem; font-weight:800;
  letter-spacing:.1em; text-transform:uppercase;
}
.rkz-lp-title{ margin:0; color:var(--lp-heading); font-weight:800; line-height:1.2; }
.rkz-lp-subtitle{ margin:.35rem 0 0; color:var(--lp-primary); font-weight:700; font-size:1.1rem; }
.rkz-lp-text{ max-width:900px; color:var(--lp-body); line-height:1.75; }
.rkz-lp-text p{ margin:0 0 1rem; }
.rkz-lp-text p:last-child{ margin-bottom:0; }
.rkz-lp-muted{ color:var(--lp-muted); }
.rkz-lp-divider{
  width:120px; height:6px; border-radius:999px;
  background:linear-gradient(90deg,var(--lp-primary),var(--lp-lime));
}
.rkz-lp-disclaimer{ color:var(--lp-muted); font-size:.88rem; font-style:italic; line-height:1.6; }


/* ---------------------------------------------------------------------
   4. HERO
   H1 halaman berasal dari judul halaman WordPress; judul hero pakai H2.
   --------------------------------------------------------------------- */
.rkz-lp-hero{
  position:relative; overflow:hidden; border-radius:0 0 var(--lp-radius-lg) var(--lp-radius-lg);
  background:
    radial-gradient(720px 360px at 90% 20%,rgba(131,195,65,.22),transparent 70%),
    linear-gradient(135deg,var(--lp-dark-1),var(--lp-primary) 70%,#0f766e);
}
.rkz-lp-hero-holder{ position:relative; min-height:min(60vh,640px); display:flex; align-items:center; }
.rkz-lp-hero-image{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center;
}
.rkz-lp-hero-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(700px 360px at 86% 22%,rgba(131,195,65,.22),transparent 70%),
    linear-gradient(90deg,rgba(3,17,27,.96),rgba(5,49,42,.86) 50%,rgba(0,0,0,.30));
}
.rkz-lp-hero-content{ position:relative; z-index:2; width:100%; color:#fff; }
.rkz-lp-hero-title{ max-width:920px; color:#fff; font-weight:800; line-height:1.1; }
.rkz-lp-hero-subtitle{ max-width:860px; color:var(--lp-on-dark-accent); font-size:1.2rem; font-weight:700; line-height:1.5; }
.rkz-lp-hero-lead{ max-width:860px; color:#edf7f2; font-size:1.06rem; line-height:1.72; }
.rkz-lp-tagline{
  display:inline-flex; align-items:center; gap:.5rem; padding:.5rem 1rem; margin:0 0 1rem;
  border:1px solid rgba(155,229,169,.45); border-radius:999px;
  background:rgba(131,195,65,.16); color:#c8f2cf;
  font-size:1rem; font-weight:800; letter-spacing:.04em;
}


/* ---------------------------------------------------------------------
   5. BUTTONS
   Pakai bersama class Bootstrap .btn, mis.:
   <a class="btn rkz-lp-btn px-4 py-2">
   --------------------------------------------------------------------- */
.rkz-lp-btn,
.rkz-lp-btn--outline,
.rkz-lp-btn--light,
.rkz-lp-btn--danger{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  border-radius:1rem; font-weight:700; transition:.2s ease;
}
.rkz-lp-btn{
  border:0; color:#fff; background:linear-gradient(135deg,var(--lp-primary),var(--lp-primary-dark));
}
.rkz-lp-btn:hover{ color:#fff; filter:brightness(1.07); transform:translateY(-1px); }
.rkz-lp-btn--outline{ border:1px solid rgba(255,255,255,.62); color:#fff; background:rgba(255,255,255,.05); }
.rkz-lp-btn--outline:hover{ color:var(--lp-ink); background:#fff; }
.rkz-lp-btn--light{ border:1px solid var(--lp-line); color:var(--lp-primary); background:#fff; }
.rkz-lp-btn--light:hover{ color:#fff; background:var(--lp-primary); }
.rkz-lp-btn--danger{ border:0; color:#fff; background:linear-gradient(135deg,var(--lp-danger),var(--lp-danger-dark)); }
.rkz-lp-btn--danger:hover{ color:#fff; filter:brightness(1.08); transform:translateY(-1px); }


/* ---------------------------------------------------------------------
   6. ICONS
   <span class="rkz-lp-icon"><i class="bi bi-heart-pulse"></i></span>
   --------------------------------------------------------------------- */
.rkz-lp-icon{
  width:3rem; height:3rem; display:grid; place-items:center; flex:0 0 auto;
  border-radius:1rem; color:#fff; font-size:1.25rem;
  background:linear-gradient(135deg,var(--lp-primary),var(--lp-accent));
  box-shadow:0 10px 24px rgba(15,106,72,.22);
}
.rkz-lp-icon--sm{ width:2.5rem; height:2.5rem; font-size:1.05rem; border-radius:.85rem; }
.rkz-lp-icon--lg{ width:3.75rem; height:3.75rem; font-size:1.6rem; border-radius:1.15rem; }
.rkz-lp-icon--round{ border-radius:999px; }
.rkz-lp-icon--danger{ background:linear-gradient(135deg,var(--lp-danger),var(--lp-danger-dark)); box-shadow:0 10px 24px rgba(198,40,40,.25); }
.rkz-lp-icon--soft{ color:var(--lp-primary); background:rgba(15,106,72,.10); box-shadow:none; }


/* ---------------------------------------------------------------------
   7. LISTS & PILLS
   --------------------------------------------------------------------- */
.rkz-lp-checklist{ padding:0; margin:0; list-style:none; }
.rkz-lp-checklist li{
  display:flex; align-items:flex-start; gap:.65rem; margin:.5rem 0; line-height:1.55; color:var(--lp-body);
}
.rkz-lp-checklist i{ margin-top:.18rem; color:var(--lp-primary); }

.rkz-lp-pills{ display:flex; flex-wrap:wrap; gap:.5rem; padding:0; margin:0; list-style:none; }
.rkz-lp-pill{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.5rem .95rem; border:1px solid rgba(15,106,72,.2); border-radius:999px;
  color:var(--lp-primary); background:rgba(15,106,72,.07); font-weight:800; font-size:.92rem;
}


/* ---------------------------------------------------------------------
   8. CARDS
   Kartu layanan / alasan / info. Bisa dengan foto (.rkz-lp-card-media).
   --------------------------------------------------------------------- */
.rkz-lp-card{
  height:100%; overflow:hidden; display:flex; flex-direction:column;
  border:1px solid var(--lp-line); border-radius:var(--lp-radius); background:#fff;
  box-shadow:var(--lp-shadow-soft);
}
.rkz-lp-card-media{ aspect-ratio:4/3; overflow:hidden; background:var(--lp-soft); }
.rkz-lp-card-media img{ width:100%; height:100%; object-fit:cover; }
.rkz-lp-card-body{ padding:1.5rem; flex:1 1 auto; }
.rkz-lp-card-body > :last-child{ margin-bottom:0; }
.rkz-lp-card h3{ margin:0 0 .5rem; color:var(--lp-heading); font-size:1.15rem; font-weight:800; }
.rkz-lp-card p{ color:var(--lp-body); line-height:1.65; }
.rkz-lp-card--link{ color:inherit; text-decoration:none; transition:.2s ease; }
.rkz-lp-card--link:hover{ color:inherit; transform:translateY(-2px); box-shadow:0 18px 36px rgba(2,44,34,.12); }

/* Baris ringkas: ikon + judul (daftar layanan bernomor) */
.rkz-lp-link-row{
  display:flex; align-items:center; gap:.85rem; height:100%; padding:1rem 1.1rem;
  border:1px solid var(--lp-line); border-radius:1.1rem; background:#fff;
  color:var(--lp-heading); font-weight:800; text-decoration:none;
  box-shadow:var(--lp-shadow-soft); transition:.2s ease;
}
.rkz-lp-link-row:hover{ transform:translateY(-2px); color:var(--lp-primary); box-shadow:0 18px 36px rgba(2,44,34,.12); }
.rkz-lp-link-row-num{ color:var(--lp-muted); font-weight:800; min-width:1.4rem; }


/* ---------------------------------------------------------------------
   9. ICON GRID
   Daftar butir berikon (faktor risiko, gejala, komplikasi, dll.).
   <div class="rkz-lp-grid rkz-lp-grid--3"> <div class="rkz-lp-item">…
   --------------------------------------------------------------------- */
.rkz-lp-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
.rkz-lp-grid--3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.rkz-lp-grid--4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.rkz-lp-item{
  display:flex; align-items:flex-start; gap:.75rem; padding:.95rem 1rem;
  border:1px solid var(--lp-line); border-radius:1rem; background:#fff;
  box-shadow:0 8px 22px rgba(2,44,34,.05); line-height:1.5; color:var(--lp-body);
}
.rkz-lp-item strong{ display:block; color:var(--lp-heading); }
.rkz-lp-item--stack{ flex-direction:column; align-items:center; text-align:center; }


/* ---------------------------------------------------------------------
   10. NOTE (catatan / penjelasan — BUKAN layanan)
   Sama dengan pola booklet: kotak hijau muda + ikon bulat di kiri.
   --------------------------------------------------------------------- */
.rkz-lp-note{
  display:flex; align-items:flex-start; gap:1rem; padding:1.25rem 1.4rem;
  border:1px solid rgba(65,152,106,.55); border-radius:var(--lp-radius); background:#e8f3ec;
}
.rkz-lp-note .rkz-lp-icon{ border-radius:999px; box-shadow:none; }
.rkz-lp-note p{ margin:0; color:var(--lp-body); line-height:1.65; }
.rkz-lp-note .rkz-lp-note-title{ margin:0 0 .25rem; color:var(--lp-heading); font-size:1.05rem; font-weight:800; }
.rkz-lp-note--danger{ border-color:rgba(198,40,40,.35); background:var(--lp-danger-soft); }
.rkz-lp-note--danger .rkz-lp-note-title{ color:var(--lp-danger-dark); }


/* ---------------------------------------------------------------------
   11. EMERGENCY (ambulans / IGD)
   --------------------------------------------------------------------- */
.rkz-lp-emergency{
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem;
  padding:1.25rem 1.5rem; border-radius:var(--lp-radius-lg); color:#fff;
  background:linear-gradient(135deg,var(--lp-danger),var(--lp-danger-dark));
  box-shadow:0 18px 40px rgba(155,28,28,.25);
}
.rkz-lp-emergency-label{ margin:0; color:#ffdede; font-size:.85rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.rkz-lp-emergency-number{ margin:0; color:#fff; font-size:1.6rem; font-weight:800; line-height:1.2; }
.rkz-lp-emergency .btn{ color:var(--lp-danger-dark); background:#fff; border:0; border-radius:1rem; font-weight:800; }
.rkz-lp-emergency .btn:hover{ color:var(--lp-danger-dark); background:#ffeaea; }


/* ---------------------------------------------------------------------
   12. STEPS (alur / perjalanan pasien)
   Horizontal di desktop, vertikal di HP.
   <ol class="rkz-lp-steps"> <li class="rkz-lp-step">…
   --------------------------------------------------------------------- */
.rkz-lp-steps{
  counter-reset:lp-step; display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr);
  gap:1rem; padding:0; margin:0; list-style:none; position:relative;
}
.rkz-lp-steps::before{
  content:''; position:absolute; top:1.75rem; left:8%; right:8%; height:3px;
  background:linear-gradient(90deg,var(--lp-primary),var(--lp-lime)); border-radius:999px;
}
.rkz-lp-step{ position:relative; text-align:center; }
.rkz-lp-step .rkz-lp-icon{ margin:0 auto .75rem; width:3.5rem; height:3.5rem; border-radius:999px; border:4px solid #fff; }
.rkz-lp-step-title{ display:block; color:var(--lp-heading); font-weight:800; line-height:1.3; }
.rkz-lp-step-text{ display:block; margin-top:.3rem; color:var(--lp-body); font-size:.92rem; line-height:1.5; }


/* ---------------------------------------------------------------------
   13. ACRONYM (mis. BE-FAST): huruf besar + penjelasan
   --------------------------------------------------------------------- */
.rkz-lp-acronym{ display:grid; gap:.65rem; padding:0; margin:0; list-style:none; }
.rkz-lp-acronym li{
  display:flex; align-items:center; gap:1rem; padding:.8rem 1rem;
  border:1px solid var(--lp-line); border-radius:1rem; background:#fff;
}
.rkz-lp-letter{
  width:3rem; height:3rem; display:grid; place-items:center; flex:0 0 auto;
  border-radius:999px; color:#fff; background:var(--lp-primary-dark);
  font-size:1.4rem; font-weight:900;
}
.rkz-lp-acronym-body strong{ display:block; color:var(--lp-heading); }
.rkz-lp-acronym-body span{ color:var(--lp-body); }


/* ---------------------------------------------------------------------
   14. DARK PANEL (sorotan / unggulan)
   --------------------------------------------------------------------- */
.rkz-lp-panel{
  overflow:hidden; color:#fff; border-radius:var(--lp-radius-lg);
  background:
    radial-gradient(520px 240px at 100% 0%,rgba(131,195,65,.23),transparent 70%),
    linear-gradient(135deg,var(--lp-dark-2),var(--lp-primary) 66%,#0f766e);
  box-shadow:0 24px 54px rgba(2,44,34,.18);
}
.rkz-lp-panel .rkz-lp-title{ color:#fff; }
.rkz-lp-panel .rkz-lp-subtitle,
.rkz-lp-panel .rkz-lp-eyebrow{ color:var(--lp-on-dark-accent); }
.rkz-lp-panel .rkz-lp-text,
.rkz-lp-panel p{ color:var(--lp-on-dark); }
.rkz-lp-panel-tile{
  height:100%; padding:1rem 1.1rem; border:1px solid rgba(255,255,255,.18);
  border-radius:1rem; background:rgba(255,255,255,.08);
}
.rkz-lp-panel-tile strong{ display:block; color:#fff; font-size:1.05rem; }
.rkz-lp-panel-tile p{ margin:.3rem 0 0; line-height:1.6; }
.rkz-lp-panel-photo{ position:relative; height:100%; min-height:320px; }
.rkz-lp-panel-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }


/* ---------------------------------------------------------------------
   15. TEAM (foto bulat)
   --------------------------------------------------------------------- */
.rkz-lp-team{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1.25rem; }
.rkz-lp-member{ text-align:center; }
.rkz-lp-avatar{
  width:7rem; height:7rem; margin:0 auto .75rem; overflow:hidden; display:grid; place-items:center;
  border-radius:999px; border:4px solid #fff; background:var(--lp-soft);
  box-shadow:0 0 0 3px var(--lp-accent), var(--lp-shadow-soft);
  color:var(--lp-primary); font-size:2rem;
}
.rkz-lp-avatar img{ width:100%; height:100%; object-fit:cover; }
.rkz-lp-member strong{ display:block; color:var(--lp-heading); font-size:.98rem; line-height:1.3; }
.rkz-lp-member span{ display:block; margin-top:.25rem; color:var(--lp-muted); font-size:.88rem; line-height:1.4; }


/* ---------------------------------------------------------------------
   16. DOCTORS & CONTACT
   --------------------------------------------------------------------- */
.rkz-lp-doctor{
  display:flex; align-items:center; gap:1rem; height:100%; padding:1.25rem;
  border:1px solid var(--lp-line); border-radius:var(--lp-radius); background:#fff; box-shadow:var(--lp-shadow-soft);
}
.rkz-lp-doctor h3{ margin:0 0 .2rem; color:var(--lp-heading); font-size:1.02rem; font-weight:800; }
.rkz-lp-doctor p{ margin:0; color:var(--lp-muted); font-size:.9rem; }

.rkz-lp-contact{
  height:100%; padding:2rem; border:1px solid var(--lp-line); border-radius:1.3rem;
  background:radial-gradient(400px 190px at 100% 0%,rgba(131,195,65,.12),transparent 68%),#fff;
  box-shadow:var(--lp-shadow);
}
.rkz-lp-contact-row{ padding:1rem; margin-bottom:1rem; border-radius:1rem; background:var(--lp-soft); }
.rkz-lp-contact-label{ margin:0 0 .2rem; color:var(--lp-muted); font-size:.8rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }
.rkz-lp-contact-value{ margin:0; color:var(--lp-primary); font-size:1.2rem; font-weight:800; }
.rkz-lp-hours{ display:grid; }
.rkz-lp-hours-row{ display:flex; justify-content:space-between; gap:1rem; padding:.72rem 0; border-bottom:1px solid var(--lp-line); }
.rkz-lp-hours-row:last-child{ border-bottom:0; }


/* ---------------------------------------------------------------------
   17. FAQ (<details>, tanpa JavaScript)
   --------------------------------------------------------------------- */
.rkz-lp-faq{ padding:1.5rem; border:1px solid var(--lp-line); border-radius:1.25rem; background:#fff; box-shadow:var(--lp-shadow); }
.rkz-lp-faq details{ overflow:hidden; margin-bottom:.85rem; border:1px solid var(--lp-line); border-radius:1rem; background:#fff; }
.rkz-lp-faq details:last-of-type{ margin-bottom:0; }
.rkz-lp-faq summary{
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:1rem 1.15rem; color:var(--lp-heading); font-weight:800; cursor:pointer; list-style:none;
}
.rkz-lp-faq summary::-webkit-details-marker{ display:none; }
.rkz-lp-faq summary::after{
  content:'+'; width:2rem; height:2rem; display:grid; place-items:center; flex:0 0 auto;
  border-radius:999px; color:var(--lp-primary); background:rgba(15,106,72,.09); font-size:1.25rem;
}
.rkz-lp-faq details[open] summary{ background:rgba(15,106,72,.06); }
.rkz-lp-faq details[open] summary::after{ content:'−'; color:#fff; background:var(--lp-primary); }
.rkz-lp-faq-answer{ padding:1rem 1.15rem; color:var(--lp-body); line-height:1.65; }


/* ---------------------------------------------------------------------
   18. STICKY CTA (HP saja): bar tombol tetap di bawah layar
   --------------------------------------------------------------------- */
.rkz-lp-sticky{ display:none; }


/* ---------------------------------------------------------------------
   19. TEMA per layanan (hanya mengganti token warna)
   --------------------------------------------------------------------- */
.rkz-lp--neuro{
  --lp-primary:#1e6b3a;
  --lp-primary-dark:#005000;
  --lp-accent:#41986a;
}


/* ---------------------------------------------------------------------
   20. RESPONSIVE & MOTION
   --------------------------------------------------------------------- */
@media (max-width:991.98px){
  .rkz-lp-hero-holder{ min-height:auto; }
  .rkz-lp-hero-overlay{ background:linear-gradient(180deg,rgba(3,17,27,.72),rgba(3,17,27,.95)); }
  .rkz-lp-grid--3,
  .rkz-lp-grid--4{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rkz-lp-team{ grid-template-columns:repeat(3,minmax(0,1fr)); }
  .rkz-lp-steps{ grid-auto-flow:row; grid-auto-columns:auto; gap:0; }
  .rkz-lp-steps::before{ top:0; bottom:0; left:1.75rem; right:auto; width:3px; height:auto; }
  .rkz-lp-step{ display:grid; grid-template-columns:3.5rem 1fr; column-gap:1rem; align-items:start; padding-bottom:1.25rem; text-align:left; }
  .rkz-lp-step .rkz-lp-icon{ grid-row:span 2; margin:0; }
  .rkz-lp-step-text{ margin-top:.15rem; }
}
@media (max-width:767.98px){
  .rkz-lp-section{ padding:2.25rem 0; }
  .rkz-lp-hero{ border-radius:0 0 1.1rem 1.1rem; }
  .rkz-lp-hero-image{ object-position:62% center; }
  .rkz-lp-hero-title{ font-size:1.9rem; line-height:1.2; }
  .rkz-lp-hero-subtitle{ font-size:1.05rem; }
  .rkz-lp-hero-lead{ font-size:1rem; line-height:1.65; }
  .rkz-lp-tagline{ font-size:.9rem; }
  .rkz-lp-grid,
  .rkz-lp-grid--3,
  .rkz-lp-grid--4{ grid-template-columns:1fr; }
  .rkz-lp-team{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .rkz-lp-avatar{ width:5.75rem; height:5.75rem; }
  .rkz-lp-card-body,
  .rkz-lp-contact,
  .rkz-lp-faq{ padding:1.25rem; }
  .rkz-lp-emergency-number{ font-size:1.35rem; }
  .rkz-lp-panel-photo{ min-height:240px; }

  .rkz-lp-sticky{
    position:fixed; left:0; right:0; bottom:0; z-index:1030;
    display:flex; gap:.5rem; padding:.6rem .75rem calc(.6rem + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.97); box-shadow:0 -8px 24px rgba(15,23,42,.12);
  }
  .rkz-lp-sticky .btn{ flex:1 1 0; padding:.65rem .5rem; font-size:.92rem; }
  .rkz-lp--has-sticky{ padding-bottom:4.5rem; }
}
@media (prefers-reduced-motion:reduce){
  .rkz-lp *,
  .rkz-lp *::before,
  .rkz-lp *::after{ transition:none !important; }
}

/* =====================================================================
   CHANGELOG
   1.0.1 (2026-10-04) Perbaikan: gambar hero/avatar/card tidak mengisi penuh
         karena aturan dasar img{height:auto} lebih kuat. Kini memakai :where().
   1.0.0 (2026-10-04) Versi awal. Diturunkan dari halaman Rehabilitasi
         Medis; ditambah note, emergency, steps, acronym, team, sticky.
   ===================================================================== */