/* =======================================================
   FUNNEL — e-book + email di atas lipatan, form brief bisnis, footer proyek lain.
   Hanya memakai token dari base.css.
   ============================================================ */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.hero-chip { margin-bottom: 14px; }

.mini-sub { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; max-width: 460px; }
.mini-sub input[type="email"] {
  flex: 1 1 220px; min-width: 0; height: 46px; padding: 0 16px; border-radius: 999px;
  border: 1.5px solid rgba(15,15,18,.14); background: rgba(255,255,255,.92); font: 500 14.5px 'Inter', sans-serif; color: var(--ink);
}
.mini-sub input[type="email"]:focus { outline: none; border-color: var(--purple-600); box-shadow: 0 0 0 3px rgba(123,47,181,.15); }
.mini-sub .btn { height: 46px; border-radius: 999px; }
.form-msg { flex-basis: 100%; min-height: 1.2em; font-size: 13.5px; color: var(--gray-500); }
.form-msg.is-ok { color: #1f8f55; }
.form-msg.is-error { color: #c0362c; }
.form-msg.is-warn { color: #8a5a00; }

.lead-magnet--email { align-items: flex-start; }
.lead-magnet--email .lm-copy { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.lead-magnet--email .lm-copy p { max-width: 520px; }

/* brief bisnis */
.brief-wrap { max-width: 820px; }
.brief-form { display: flex; flex-direction: column; gap: 16px; padding: 28px; border: 1px solid var(--line); border-radius: var(--radius-lg); background: #fff; }
.brief-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.brief-form label { display: flex; flex-direction: column; gap: 6px; }
.brief-form label > span { font-size: 13px; font-weight: 600; color: var(--ink-soft); }
.brief-form input, .brief-form select, .brief-form textarea {
  width: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--radius-sm);
  font: 400 15px/1.5 'Inter', sans-serif; color: var(--ink); background: #fff;
}
.brief-form input:focus, .brief-form select:focus, .brief-form textarea:focus { outline: none; border-color: var(--purple-600); box-shadow: 0 0 0 3px rgba(123,47,181,.12); }
.brief-foot { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.brief-foot .form-msg { flex: 1; }
@media (max-width: 640px) { .brief-grid { grid-template-columns: 1fr; } .brief-form { padding: 20px; } }

/* footer */
.footer-projects { color: inherit; opacity: .85; }
.footer-projects a { text-decoration: underline; text-underline-offset: 3px; }

/* cover produk berupa gambar (mockup) */
.product-cover--image { padding: 0; background: #fff; border-bottom: 1px solid var(--line); }
.product-cover--image::after { display: none; }
.product-cover--image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 12px; }

/* Untuk Bisnis: langsung ke form (layout dua kolom) */
.bz-intake { position: relative; padding: 150px 0 96px; overflow: hidden; }
.bz-intake-bg { position: absolute; left: 0; right: 0; top: 0; height: 620px; z-index: 0; }
.bz-intake-bg img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bz-intake-bg::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 180px; background: linear-gradient(to bottom, rgba(255,255,255,0), #fff); }
.bz-intake-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.4fr); gap: 56px; align-items: start; }
.bz-intake-side { padding-top: 12px; }
.bz-intake-side h1 { margin: 18px 0 14px; font-size: 50px; font-weight: 800; line-height: 1.05; letter-spacing: -1.6px; }
.bz-intake-side > p { font-size: 17px; line-height: 1.6; color: var(--ink-soft); max-width: 38ch; }
.bz-assure { list-style: none; margin: 28px 0 0; padding: 22px 0 0; border-top: 1px solid rgba(15,15,18,.12); display: flex; flex-direction: column; gap: 14px; font-size: 15px; line-height: 1.5; color: var(--ink-soft); }
.bz-assure li { display: flex; gap: 12px; align-items: center; }
.bz-ic { width: 34px; height: 34px; flex-shrink: 0; display: grid; place-items: center; border-radius: 10px; background: rgba(255,255,255,.85); border: 1px solid rgba(123,47,181,.16); color: var(--purple-700); }
.bz-ic svg { width: 17px; height: 17px; display: block; }
.bz-assure a { font-weight: 600; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.bz-wa { display: inline-flex; align-items: center; gap: 8px; margin-top: 26px; font-size: 14.5px; font-weight: 600; color: var(--ink); }
.bz-wa svg { width: 15px; height: 15px; transition: transform .2s ease; }
.bz-wa:hover svg { transform: translateX(3px); }
.bz-form { display: flex; flex-direction: column; gap: 30px; padding: 36px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: 0 30px 60px -30px rgba(60,20,110,.35); }
.bz-form fieldset { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.bz-form fieldset + fieldset { border-top: 1px solid var(--line); padding-top: 28px; }
.bz-form legend { float: left; width: 100%; padding: 0; margin-bottom: 4px; font-family: 'Geist', sans-serif; font-size: 21px; font-weight: 700; letter-spacing: -.3px; }
.bz-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.bz-form label { display: flex; flex-direction: column; gap: 6px; font-size: 14px; font-weight: 600; color: var(--ink); }
.bz-form label small { font-size: 13px; font-weight: 400; color: var(--gray-500); }
.bz-form input, .bz-form select, .bz-form textarea { width: 100%; box-sizing: border-box; min-height: 48px; padding: 0 14px; border: 1px solid #d9d6e3; border-radius: 12px; background: #fff; color: var(--ink); font: 400 15px 'Inter', sans-serif; }
.bz-form textarea { min-height: 128px; padding: 12px 14px; resize: vertical; }
.bz-form input:focus, .bz-form select:focus, .bz-form textarea:focus { outline: none; border-color: var(--purple-600); box-shadow: 0 0 0 3px rgba(123,47,181,.14); }
.bz-hint { margin: 0; font-size: 14px; color: var(--gray-500); }
.bz-form-foot { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding-top: 24px; border-top: 1px solid var(--line); }
.bz-form-foot .form-msg { flex: 1; min-width: 200px; }
@media (max-width: 900px) {
  .bz-intake { padding-top: 112px; }
  .bz-intake-grid { grid-template-columns: 1fr; gap: 32px; }
  .bz-intake-side h1 { font-size: 36px; letter-spacing: -1px; }
}
@media (max-width: 640px) {
  .bz-form { padding: 22px; gap: 26px; }
  .bz-row { grid-template-columns: 1fr; }
}