/* ==========================================================
   DInvite — Halaman promosi per acara (acara.php)
   Warna aksen per acara: .lp--gold | teal | navy | pink | dark | terra
   ========================================================== */
.lp { --lp-1: #ecd6b4; --lp-2: #f0d4d0; --lp-ink: #b8935a; }
.lp--teal  { --lp-1: #bfe6dc; --lp-2: #f6dcae; --lp-ink: #2f8f83; }
.lp--navy  { --lp-1: #c9d3f5; --lp-2: #f6e3b0; --lp-ink: #3a4590; }
.lp--pink  { --lp-1: #ffc9d9; --lp-2: #bfe8ee; --lp-ink: #e0507c; }
.lp--dark  { --lp-1: #ead7a4; --lp-2: #e9d0c4; --lp-ink: #a8832a; }
.lp--terra { --lp-1: #f2cdb8; --lp-2: #cfe3c3; --lp-ink: #c8553d; }
.lp .orb--1 { background: radial-gradient(circle, var(--lp-1), transparent 70%); }
.lp .orb--2 { background: radial-gradient(circle, var(--lp-2), transparent 70%); }
.lp .eyebrow .dot { background: var(--lp-ink); }

/* Hero */
.lp-hero { padding-top: 118px; }
.lp-crumb { display: flex; gap: .5rem; align-items: center; margin-bottom: 1.6rem; font-size: .8rem; color: var(--muted); }
.lp-crumb a { color: var(--muted); } .lp-crumb a:hover { color: var(--ink); }
.lp-crumb span:last-child { color: var(--ink-2); font-weight: 500; }
.lp-points { list-style: none; padding: 0; margin: 0 0 2rem; display: grid; gap: .55rem; }
.lp-points li { display: flex; align-items: center; gap: .6rem; font-size: .95rem; color: var(--ink-2); }
.lp-points .ic { flex: none; width: 20px; height: 20px; padding: 3px; border-radius: 50%; background: var(--gold-soft); color: var(--gold); stroke-width: 3; }
.lp .hero__lead { margin-bottom: 1.4rem; }

/* Mockup HP + kartu tema kedua */
.lp-hv .hv-phone { right: 40px; }
.lp-screen { background: #f4efe8; }
.lp-screen img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.lp-card { position: absolute; left: 0; top: 96px; z-index: 1; width: 205px; aspect-ratio: 390 / 500; border-radius: 18px; overflow: hidden; background: #fff; transform: rotate(-7deg);
    box-shadow: 0 0 0 6px #fff, 0 30px 50px -24px rgba(28,25,23,.45); animation: lpFloat 7s ease-in-out infinite; }
.lp-card img { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.lp-chip--1 { left: -12px; top: 22px; }
.lp-chip--2 { right: -26px; bottom: 96px; animation-delay: -3s; }
.lp-chip .hv-chip__ic { background: var(--gold-soft); color: var(--lp-ink); }
.lp-chip .hv-chip__ic .ic { fill: none; stroke: currentColor; }
.lp-chip .hv-chip__ic .ic[data-fill], .lp--pink .lp-chip--2 .hv-chip__ic { color: var(--lp-ink); }
@keyframes lpFloat { 50% { transform: rotate(-5deg) translateY(-10px); } }

/* Kenapa */
.lp-why { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
.lp-why__item { position: relative; padding: 1.6rem 1.4rem 1.5rem; border-radius: var(--radius); background: var(--card); border: 1px solid var(--line); }
.lp-why__n { display: block; font-family: var(--serif); font-size: 2.4rem; line-height: 1; color: var(--lp-ink); opacity: .55; margin-bottom: .8rem; }
.lp-why__item h3 { font-family: var(--serif); font-size: 1.35rem; font-weight: 600; margin: 0 0 .45rem; line-height: 1.2; }
.lp-why__item p { margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.65; }
.lp .features { grid-template-columns: repeat(3, 1fr); }

/* Tema */
.lp-themes { margin-top: .5rem; }

/* Contoh kata-kata */
.lp-texts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; align-items: start; }
.lp-text { margin: 0; display: flex; flex-direction: column; padding: 1.5rem 1.4rem 1.2rem; border-radius: var(--radius); background: var(--card); border: 1px solid var(--line); box-shadow: var(--shadow); height: 100%; }
.lp-text figcaption { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 600; color: var(--lp-ink); margin-bottom: .8rem; }
.lp-text blockquote { margin: 0 0 1rem; flex: 1; font-family: var(--serif); font-size: 1.12rem; line-height: 1.6; color: var(--ink-2); }
.lp-text__copy { align-self: flex-start; display: inline-flex; align-items: center; gap: .4rem; padding: .5rem .95rem; border-radius: 999px; border: 1px solid var(--line); background: var(--ivory); font: 600 .8rem/1 var(--sans); color: var(--ink); cursor: pointer; transition: all .2s; }
.lp-text__copy:hover { border-color: var(--ink); }
.lp-text__copy.is-done { background: #e7f4ea; border-color: #9fd3ac; color: #1f6d36; }

/* Panduan */
.lp-guide { display: grid; grid-template-columns: .8fr 1.2fr; gap: 4rem; align-items: start; }
.lp-guide__list { display: grid; gap: 1rem; }
.lp-guide__list article { padding: 1.3rem 1.4rem; border-radius: var(--radius-sm); background: var(--card); border: 1px solid var(--line); border-left: 4px solid var(--lp-ink); }
.lp-guide__list h3 { margin: 0 0 .4rem; font-family: var(--serif); font-size: 1.3rem; font-weight: 600; }
.lp-guide__list p { margin: 0; color: var(--ink-2); font-size: .95rem; line-height: 1.7; }

@media (max-width: 1080px) {
    .lp-why { grid-template-columns: repeat(2, 1fr); }
    .lp .features { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
    .lp-hero { padding-top: 104px; }
    .lp-crumb { justify-content: center; }
    .lp-points { justify-content: center; width: max-content; max-width: 100%; margin-inline: auto; text-align: left; }
    .lp-texts { grid-template-columns: 1fr; }
    .lp-guide { grid-template-columns: 1fr; gap: 1.5rem; }
    .lp-hv .hv-phone { right: 22px; }
}
@media (max-width: 600px) {
    .lp-why { grid-template-columns: 1fr; }
    .lp .features { grid-template-columns: 1fr; }
    .lp-card { width: 140px; top: 90px; left: -4px; }
    .lp-chip--1 { left: -6px; top: 6px; }
    .lp-chip--2 { right: -6px; bottom: 70px; }
    .lp-hv .hv-phone { right: 6px; }
}
@media (prefers-reduced-motion: reduce) { .lp-card { animation: none; } }

/* ---------- Skala huruf halaman acara: lebih proporsional ---------- */
.lp .hero__title { font-size: clamp(2rem, 3.5vw, 3.05rem); line-height: 1.08; margin: 1.1rem 0 1rem; max-width: 15em; }
.lp .hero__lead { font-size: 1.02rem; line-height: 1.7; max-width: 33rem; }
.lp .lp-points li { font-size: .9rem; }
.lp .hero__cta { margin: 1.7rem 0 0; }
.lp .hero__cta .btn--lg { padding: .9rem 1.5rem; font-size: .95rem; }
.lp .eyebrow { font-size: .76rem; }
.lp .section { padding: 92px 0; }
.lp .section__head { max-width: 620px; margin-bottom: 2.8rem; }
.lp .section__head--left { margin-bottom: 0; }
.lp .section__title { font-size: clamp(1.75rem, 2.8vw, 2.4rem); line-height: 1.15; margin: .7rem 0 .8rem; }
.lp .section__sub { font-size: .96rem; line-height: 1.7; }
.lp .kicker { font-size: .7rem; }
.lp .feature h3 { font-size: .98rem; }
.lp .feature p, .lp .step p { font-size: .88rem; line-height: 1.65; }
.lp .step h3 { font-size: 1rem; }
.lp .lp-why__n { font-size: 1.8rem; margin-bottom: .6rem; }
.lp .lp-why__item { padding: 1.35rem 1.25rem 1.3rem; }
.lp .lp-why__item h3 { font-size: 1.16rem; }
.lp .lp-why__item p { font-size: .88rem; }
.lp .lp-text blockquote { font-size: 1rem; line-height: 1.65; }
.lp .lp-guide__list h3 { font-size: 1.14rem; }
.lp .lp-guide__list p { font-size: .9rem; }
.lp .faq__item summary { font-size: .95rem; }
.lp .faq__item p { font-size: .9rem; }
.lp .plan__name { font-size: 1.45rem; }
.lp .plan__price strong { font-size: 2.1rem; }
.lp .cta { padding-bottom: 84px; }
.lp .cta__script { font-size: clamp(1.7rem, 3.4vw, 2.5rem); }
.lp .cta h2 { font-size: clamp(1.8rem, 3.6vw, 2.75rem); }
@media (max-width: 900px) {
    .lp .hero__title { margin-inline: auto; }
    .lp .hero__cta { justify-content: center; }
}
@media (max-width: 600px) {
    .lp .hero__title { font-size: clamp(1.85rem, 7.6vw, 2.2rem); }
    .lp .hero__lead { font-size: .95rem; }
    .lp .section { padding: 68px 0; }
    .lp .section__head { margin-bottom: 2.1rem; }
    .lp .section__title { font-size: clamp(1.55rem, 6.4vw, 1.85rem); }
    .lp .section__sub { font-size: .9rem; }
    .lp .cta h2 { font-size: 1.7rem; }
}