/* LAUNDRINESIA landing — gaya khusus (di luar kelas Tailwind).
   Hasil penggabungan patch V11–V33.5 + CMS V1.4.5; hanya aturan yang benar-benar dipakai. */

* { font-family: Inter, system-ui, sans-serif; }
html { scroll-behavior: smooth; }

/* Komponen dasar */
.section-card { background:#fff; border:1px solid #e2e8f0; border-radius:24px; box-shadow:0 10px 30px rgba(15,23,42,.06); }
.red-section { background:#ed0b0b; color:#fff; }
.red-soft { background:linear-gradient(145deg,#fff5f5,#ffeaea); }
.component-icon { width:44px; height:44px; border-radius:14px; display:flex; align-items:center; justify-content:center; background:#fff1f2; color:#dc2626; font-size:18px; flex:none; }
.location-map { background:#fff; color:#dc2626; }
/* transform ditulis lengkap agar tidak menimpa -translate-x-1/2 (toast tetap di tengah) */
.toast { transform:translate(-50%,20px); opacity:0; pointer-events:none; transition:.25s; }
.toast.show { transform:translate(-50%,0); opacity:1; pointer-events:auto; }
@media (max-width:640px) { .toast { bottom:84px !important; } }
.cms-hidden { display:none !important; }

/* Hero */
.hero-wrap { background:#ed0b0b; }
.hero-copy { text-shadow:0 2px 8px rgba(80,0,0,.18); }
.slot-pill { background:#fff; color:#c20b0b; border:2px solid rgba(255,255,255,.8); box-shadow:0 12px 30px rgba(80,0,0,.2); }
.hero-media-frame { display:flex !important; align-items:flex-end !important; justify-content:center !important; width:100% !important; height:100% !important; overflow:visible !important; }
.hero-full-image { display:block !important; width:auto !important; height:min(88vh,700px) !important; max-width:none !important; max-height:700px !important; object-fit:contain !important; object-position:center bottom !important; }
@media (min-width:1024px) {
  .hero-media-frame { padding:0 24px !important; }
  .hero-full-image { height:680px !important; width:auto !important; max-height:none !important; }
}
@media (max-width:767px) {
  .hero-media-frame { min-height:0 !important; height:auto !important; padding:0 !important; margin:0 !important; align-items:flex-start !important; overflow:hidden !important; }
  .hero-full-image { width:100vw !important; max-width:100vw !important; height:auto !important; max-height:none !important; object-position:center top !important; margin:0 !important; }
}

/* Countdown */
.countdown-box { background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.28); backdrop-filter:blur(6px); }
.countdown-digit { min-width:58px; background:#fff; color:#b91c1c; border-radius:12px; padding:8px 6px; line-height:1; }
.countdown-label { font-size:8px; letter-spacing:.12em; color:#fee2e2; font-weight:800; margin-top:5px; }

/* Ringkasan investasi */
#investor-snapshot, #slot-cta-secondary, #sec-disclaimer { scroll-margin-top:24px; }
#investor-snapshot .grid > div:first-child > .text-2xl { font-size:clamp(32px,2.7vw,42px) !important; line-height:1.08 !important; letter-spacing:-.025em !important; white-space:nowrap !important; display:block !important; }
@media (max-width:1100px) { #investor-snapshot .grid > div:first-child > .text-2xl { font-size:clamp(30px,4vw,38px) !important; } }
@media (max-width:640px)  { #investor-snapshot .grid > div:first-child > .text-2xl { font-size:clamp(24px,7vw,32px) !important; white-space:normal !important; } }

/* Proyeksi */
#sec-proyeksi { overflow:hidden; }
#sec-proyeksi img { max-width:100%; height:auto; display:block; }
.cms-media-error { padding:18px; border-radius:18px; background:#fff1f2; border:1px solid #fecdd3; color:#9f1239; font:700 13px/1.5 system-ui,sans-serif; }

/* Alur investor */
.flow-step { width:42px; height:42px; margin:0 auto; border-radius:14px; background:#dc2626; color:#fff; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:18px; box-shadow:0 8px 20px rgba(220,38,38,.18); }
.flow-status { display:inline-flex; margin-top:12px; border-radius:999px; background:#fef2f2; color:#b91c1c; border:1px solid #fecaca; padding:5px 8px; font-size:9px; font-weight:900; }

/* Status sinkronisasi database */
.sync-status { display:flex; align-items:center; gap:9px; border-radius:14px; padding:10px 12px; font-size:11px; font-weight:800; }
.sync-status.loading { background:#f8fafc; color:#64748b; border:1px solid #e2e8f0; }
.sync-status.ok { background:#ecfdf5; color:#047857; border:1px solid #a7f3d0; }
.sync-status.error { background:#fef2f2; color:#b91c1c; border:1px solid #fecaca; }
.sync-dot { width:8px; height:8px; border-radius:999px; flex:none; background:currentColor; }

/* FAQ */
#sec-faq, #waitlist-box { scroll-margin-top:24px; }
.faq-item { border-radius:18px; padding:0; overflow:hidden; box-shadow:0 4px 14px rgba(15,23,42,.04); }
.faq-item > summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 18px; font-weight:900; font-size:14px; color:#0f172a; }
.faq-item > summary::-webkit-details-marker { display:none; }
.faq-item > summary::after { content:"+"; flex:none; width:26px; height:26px; border-radius:9px; display:flex; align-items:center; justify-content:center; background:#fef2f2; color:#dc2626; font-weight:900; font-size:16px; transition:transform .2s; }
.faq-item[open] > summary::after { content:"–"; }
.faq-item[open] { border-color:#fecaca; }
.faq-body { padding:0 18px 16px; font-size:13px; line-height:1.7; color:#475569; }

/* Tombol WhatsApp mengambang */
.wa-float { box-shadow:0 12px 30px rgba(5,150,105,.35); }
body.overlay-open .wa-float { display:none; }

/* Footer */
#cms-footer-contact { width:100%; justify-content:center !important; align-items:center !important; text-align:center !important; }
#cms-footer-contact .cms-contact-link { color:#fff !important; background:rgba(255,255,255,.05) !important; border-color:rgba(255,255,255,.10) !important; justify-content:center !important; align-items:center !important; }
#cms-footer-contact .cms-contact-link i { color:#fff !important; }
@media (max-width:700px) { #cms-footer-contact .cms-contact-link { width:100%; max-width:320px; min-width:0 !important; } }

/* Form survei & admin */
.survey-heading { font-size:14px; font-weight:900; color:#0f172a; padding-bottom:10px; border-bottom:2px solid #e2e8f0; }
.survey-label { display:block; font-size:11px; font-weight:800; color:#475569; margin-bottom:7px; }
.survey-input { width:100%; border:1px solid #e2e8f0; border-radius:12px; padding:11px 13px; font-size:12px; outline:none; background:#fff; }
.survey-input:focus { border-color:#3b82f6; box-shadow:0 0 0 3px rgba(59,130,246,.08); }
.survey-checks { display:flex; flex-wrap:wrap; gap:8px 16px; }
.survey-checks label { font-size:12px; color:#334155; display:flex; gap:6px; align-items:center; }
.rec-yes,.rec-no,.rec-consider { border:1px solid; border-radius:12px; padding:9px 12px; font-weight:800; }
.rec-yes { color:#15803d !important; border-color:#bbf7d0; background:#f0fdf4; }
.rec-no { color:#b91c1c !important; border-color:#fecaca; background:#fef2f2; }
.rec-consider { color:#a16207 !important; border-color:#fde68a; background:#fffbeb; }
.admin-input { width:100%; border:1px solid #cbd5e1; border-radius:12px; padding:11px 13px; font-size:13px; outline:none; background:#fff; }
.admin-input:focus { border-color:#dc2626; box-shadow:0 0 0 3px rgba(220,38,38,.08); }
.admin-tab { white-space:nowrap; flex:none; }
.survey-tab { background:#fff; border:1px solid #e2e8f0; color:#334155; }
.survey-tab.active { background:#dc2626; border-color:#dc2626; color:#fff; }
.admin-tab.active { background:#dc2626; color:#fff; }

/* Mode surveyor publik (#surveyor) */
.surveyor-mode #adminOverlay { background:#f8fafc !important; backdrop-filter:none !important; }
.surveyor-mode #adminDashboardView { padding:0 !important; }
.surveyor-mode #adminDashboardView > .max-w-7xl { max-width:100% !important; min-height:100vh !important; border-radius:0 !important; box-shadow:none !important; }
.surveyor-mode #adminDashboardView > .max-w-7xl > header,
.surveyor-mode #adminDashboardView > .max-w-7xl > .p-4 > .flex.gap-2.overflow-x-auto { display:none !important; }
.surveyor-mode #adminSurveys { display:block !important; }
.surveyor-mode .admin-cms-notice,
.surveyor-mode #adminSurveys > div > div:first-child,
.surveyor-mode #adminSurveyDataTab,
.surveyor-mode #adminSurveyDataPanel { display:none !important; }
.surveyor-mode #adminSurveyInputPanel { margin-top:0 !important; }
.surveyor-mode #surveyInputPanel { border-radius:0 !important; border-left:0 !important; border-right:0 !important; }