.lp-body { background: var(--porcelain); color: var(--espresso); font-family: var(--sans); }
.lp-wrap { width: 100%; max-width: var(--max-w); margin-inline: auto; padding-inline: var(--gutter); }
.lp-main { overflow-x: clip; } .lp-btn {
display: inline-flex; align-items: center; justify-content: center; gap: 0.5em;
font-family: var(--sans); font-size: 1rem; font-weight: 600; letter-spacing: 0.01em;
padding: 0.85em 1.5em; border-radius: 999px; text-decoration: none; cursor: pointer;
transition: transform 0.25s var(--ease-out), background 0.25s, box-shadow 0.25s; border: 1px solid transparent;
}
.lp-btn--solid { background: var(--laurel); color: var(--ivory); }
.lp-btn--solid:hover { background: var(--ink); transform: translateY(-2px); }
.lp-btn--bronze { background: var(--aqua); color: var(--laurel-deep); font-weight: 650; }
.lp-btn--bronze:hover { background: var(--aqua-bright); transform: translateY(-2px); }
.lp-btn--line { background: transparent; border-color: var(--stone); color: var(--laurel); }
.lp-btn--line:hover { border-color: var(--laurel); }
.lp-btn--line-light { background: transparent; border-color: rgba(251,253,253,0.4); color: var(--ivory); }
.lp-btn--line-light:hover { border-color: var(--aqua); color: var(--aqua); }
.lp-btn--wa { background: #25D366; color: var(--laurel-deep); font-weight: 650; }
.lp-btn--wa:hover { background: #1fb857; transform: translateY(-2px); } .lp-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 300; background: transparent; pointer-events: none; }
.lp-progress span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--laurel-mist), var(--aqua)); transition: width 0.1s linear; } .lp-topbar { background: linear-gradient(120deg, var(--laurel-deep), var(--laurel)); color: var(--porcelain); font-size: 0.82rem; text-align: center; padding: 0.5rem 0; }
.lp-topbar strong { color: var(--aqua); }
.lp-topbar__in { display: flex; justify-content: center; align-items: center; gap: 0.1rem; flex-wrap: wrap; }
.lp-topbar a { color: inherit; text-decoration: none; }
.lp-topbar a:hover { color: var(--aqua); }
.lp-topbar__sep { margin: 0 0.5rem; opacity: 0.5; } .lp-nav { position: sticky; top: 0; z-index: 200; background: rgba(251,253,253,0.92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: var(--hairline); }
.lp-nav__in { display: flex; align-items: center; gap: 1.5rem; padding-block: 0.7rem; }
.lp-nav__brand { display: flex; align-items: center; gap: 0.7rem; text-decoration: none; color: var(--laurel); }
.lp-nav__mark { width: 38px; height: 38px; border-radius: 999px; background: var(--laurel); color: var(--ivory); display: inline-flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 1rem; letter-spacing: 0.02em; }
.lp-nav__id { display: flex; flex-direction: column; line-height: 1.15; }
.lp-nav__id strong { font-size: 0.9rem; color: var(--ink); }
.lp-nav__id small { font-size: 0.72rem; color: var(--smoke); letter-spacing: 0.02em; }
.lp-nav__anchors { display: flex; gap: 1.3rem; margin-left: auto; }
.lp-nav__anchors a { font-size: 0.82rem; font-weight: 550; color: var(--espresso); text-decoration: none; letter-spacing: 0.02em; transition: color 0.2s; }
.lp-nav__anchors a:hover { color: var(--bronze); }
.lp-nav__cta { display: flex; align-items: center; gap: 0.7rem; margin-left: auto; }
.lp-nav__anchors + .lp-nav__cta { margin-left: 1.3rem; }
.lp-nav__tel { display: inline-flex; align-items: center; gap: 0.45rem; color: var(--laurel); text-decoration: none; font-size: 1rem; font-weight: 600; }
.lp-nav__tel:hover { color: var(--bronze); }
.lp-nav__cta .lp-btn { padding: 0.55em 1.2em; font-size: 0.85rem; }
@media (max-width: 1080px) { .lp-nav__anchors { display: none; } }
@media (max-width: 640px) { .lp-nav__tel span, .lp-nav__id small { display: none; } .lp-nav__cta .lp-btn--wa { display: none; } .lp-nav__in { gap: 0.8rem; } } .lp-section { padding-block: var(--space-section); position: relative; }
.lp-section--tight { padding-block: var(--space-block); }
.lp-section--dark { background: var(--ink); color: rgba(251,253,253,0.86); }
.lp-section--deep { background: linear-gradient(135deg, var(--laurel-deep), var(--laurel)); color: var(--ivory); }
.lp-section--soft { background: var(--paper); }
.lp-kicker { display: inline-flex; align-items: center; gap: 0.7rem; font-size: 1rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--bronze); margin-bottom: 1rem; }
.lp-kicker::before { content: ""; width: 2.2rem; height: 1px; background: var(--aqua); }
.lp-section--dark .lp-kicker, .lp-section--deep .lp-kicker { color: var(--aqua); }
.lp-h { font-family: var(--serif); font-size: var(--text-2xl); line-height: 1.08; color: var(--ink); margin: 0; font-weight: 400; }
.lp-section--dark .lp-h, .lp-section--deep .lp-h { color: var(--ivory); }
.lp-h em { font-style: italic; color: var(--bronze); }
.lp-section--dark .lp-h em, .lp-section--deep .lp-h em { color: var(--aqua); }
.lp-lead { font-size: var(--text-lg); line-height: 1.6; color: var(--smoke); max-width: var(--max-prose); margin-top: 1.1rem; }
.lp-section--dark .lp-lead, .lp-section--deep .lp-lead { color: rgba(251,253,253,0.78); }
.lp-head { max-width: 46rem; margin-bottom: 3rem; }
.lp-head--center { margin-inline: auto; text-align: center; }
.lp-head--center .lp-kicker { justify-content: center; } .lp-reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out); }
.lp-reveal.visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .lp-reveal { opacity: 1; transform: none; transition: none; } } .lp-hero { background: radial-gradient(120% 90% at 85% 0%, var(--bronze-wash), transparent 55%), var(--porcelain); padding-block: clamp(3rem, 3rem + 3vw, 5.5rem) var(--space-section); }
.lp-hero__grid { display: grid; grid-template-columns: 1.15fr 0.85fr; gap: clamp(2rem, 4vw, 4rem); align-items: center; }
.lp-hero__crumbs { font-size: 1rem; color: var(--smoke); margin-bottom: 1.2rem; }
.lp-hero__crumbs a { color: var(--smoke); text-decoration: none; } .lp-hero__crumbs a:hover { color: var(--bronze); }
.lp-hero__crumbs .sep { margin-inline: 0.4rem; opacity: 0.5; }
.lp-pill { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 1rem; font-weight: 600; color: var(--laurel); background: var(--bronze-wash); border: 1px solid var(--stone-soft); padding: 0.4rem 0.85rem; border-radius: 999px; margin-bottom: 1.3rem; }
.lp-pill::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: var(--aqua); box-shadow: 0 0 0 0 rgba(95,198,206,0.6); animation: lp-pulse 2s infinite; }
@keyframes lp-pulse { 0% { box-shadow: 0 0 0 0 rgba(95,198,206,0.5); } 70% { box-shadow: 0 0 0 8px rgba(95,198,206,0); } 100% { box-shadow: 0 0 0 0 rgba(95,198,206,0); } }
.lp-hero h1 { font-family: var(--serif); font-size: var(--text-3xl); line-height: 1.05; color: var(--ink); font-weight: 400; margin: 0; }
.lp-hero h1 em { font-style: italic; color: var(--bronze); }
.lp-hero__accent { width: 44px; height: 3px; background: linear-gradient(90deg, var(--laurel-mist), var(--aqua)); margin: 1.4rem 0; border-radius: 2px; }
.lp-hero__sub { font-size: var(--text-lg); line-height: 1.6; color: var(--smoke); max-width: 34em; }
.lp-hero__sub strong { color: var(--espresso); }
.lp-hero__benefits { list-style: none; margin: 1.8rem 0 0; padding: 0; display: grid; gap: 0.75rem; }
.lp-hero__benefits li { display: flex; gap: 0.7rem; align-items: flex-start; font-size: 1rem; }
.lp-hero__benefits svg { flex: none; color: var(--aqua); margin-top: 0.15rem; }
.lp-hero__benefits b { color: var(--ink); }
.lp-hero__actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 2rem; }
.lp-hero__micro { display: flex; flex-wrap: wrap; gap: 0.5rem 1.2rem; margin-top: 1.6rem; }
.lp-hero__micro span { display: inline-flex; align-items: center; gap: 0.4rem; font-size: 1rem; color: var(--smoke); }
.lp-hero__micro svg { color: var(--aqua); }
.lp-hero__visual { position: relative; }
.lp-hero__card { border-radius: 1.4rem; overflow: hidden; background: linear-gradient(150deg, var(--bronze-wash), var(--paper)); border: var(--hairline); min-height: 440px; box-shadow: 0 40px 80px -40px rgba(8,30,38,0.4); position: relative; display: flex; align-items: flex-end; }
.lp-hero__card img { width: 100%; height: 100%; object-fit: cover; position: absolute; inset: 0; }
.lp-hero__stats { position: relative; width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(11,21,25,0.08); margin: 1.1rem; border-radius: 1rem; overflow: hidden; }
.lp-hero__stat { background: rgba(251,253,253,0.92); padding: 1.1rem 1.2rem; -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.lp-hero__stat b { display: block; font-family: var(--serif); font-size: 1.9rem; color: var(--laurel); line-height: 1; }
.lp-hero__stat.is-aqua b { color: var(--bronze); }
.lp-hero__stat span { font-size: 1rem; color: var(--smoke); }
.lp-hero__badge { position: absolute; top: -14px; right: -10px; background: var(--ink); color: var(--ivory); border-radius: 1rem; padding: 0.8rem 1rem; box-shadow: 0 20px 40px -18px rgba(8,30,38,0.6); text-align: center; }
.lp-hero__badge .lp-stars { color: var(--aqua); font-size: 1rem; letter-spacing: 0.1em; }
.lp-hero__badge b { display: block; font-family: var(--serif); font-size: 1.3rem; }
.lp-hero__badge small { font-size: 1rem; opacity: 0.7; }
@media (max-width: 920px) { .lp-hero__grid { grid-template-columns: 1fr; } .lp-hero__visual { display: none; } } .lp-cards { display: grid; gap: 1.2rem; grid-template-columns: repeat(var(--lp-cols, 3), 1fr); }
.lp-card { border-radius: 1.1rem; padding: 1.7rem 1.6rem; background: var(--ivory); border: var(--hairline); transition: transform 0.3s var(--ease-out), box-shadow 0.3s; }
.lp-card:hover { transform: translateY(-3px); box-shadow: 0 26px 50px -30px rgba(8,30,38,0.35); }
.lp-card__icon { width: 44px; height: 44px; border-radius: 0.8rem; background: var(--bronze-wash); color: var(--bronze); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 1.1rem; }
.lp-card__avatar { width: 46px; height: 46px; border-radius: 999px; background: var(--laurel); color: var(--ivory); display: inline-flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 1.1rem; margin-bottom: 1rem; }
.lp-card h3 { font-family: var(--serif); font-size: 1.2rem; color: var(--ink); margin: 0 0 0.5rem; font-weight: 400; }
.lp-card__role { display: block; font-size: 1rem; color: var(--bronze); font-weight: 600; margin-bottom: 0.6rem; }
.lp-card p { font-size: 1rem; line-height: 1.6; color: var(--smoke); margin: 0; }
.lp-section--dark .lp-card { background: rgba(251,253,253,0.05); border-color: rgba(251,253,253,0.12); }
.lp-section--dark .lp-card h3 { color: var(--ivory); }
.lp-section--dark .lp-card p { color: rgba(251,253,253,0.72); }
.lp-section--dark .lp-card__icon { background: rgba(95,198,206,0.14); color: var(--aqua); }
.lp-card--accent { background: var(--laurel); border-color: var(--laurel); }
.lp-card--accent h3 { color: var(--ivory); } .lp-card--accent p { color: rgba(251,253,253,0.78); } .lp-card--accent .lp-card__icon { background: rgba(95,198,206,0.18); color: var(--aqua); }
.lp-card--top { border-top: 3px solid var(--bronze); }
.lp-bridge { margin-top: 2rem; background: rgba(95,198,206,0.1); border: 1px solid rgba(95,198,206,0.3); border-radius: 1rem; padding: 1.4rem 1.6rem; font-size: 1rem; line-height: 1.6; }
.lp-bridge strong { color: var(--ivory); }
@media (max-width: 860px) { .lp-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .lp-cards { grid-template-columns: 1fr; } } .lp-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }
.lp-compare__col { border-radius: 1.1rem; overflow: hidden; border: var(--hairline); background: var(--ivory); }
.lp-compare__head { padding: 1rem 1.4rem; font-size: 1rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; display: flex; align-items: center; gap: 0.6rem; }
.lp-compare__col--before .lp-compare__head { background: var(--paper); color: var(--smoke); }
.lp-compare__col--after .lp-compare__head { background: var(--laurel); color: var(--ivory); }
.lp-compare__head .dot { width: 9px; height: 9px; border-radius: 999px; background: currentColor; opacity: 0.6; }
.lp-compare ul { list-style: none; margin: 0; padding: 1.2rem 1.4rem; display: grid; gap: 0.9rem; }
.lp-compare li { display: flex; gap: 0.7rem; font-size: 1rem; line-height: 1.5; color: var(--espresso); }
.lp-compare__col--after li { color: var(--espresso); }
.lp-compare li .ic { flex: none; margin-top: 0.1rem; }
.lp-compare__col--after li b { color: var(--ink); }
.lp-compare__disc { grid-column: 1 / -1; margin-top: 1rem; border-left: 3px solid var(--aqua); background: var(--bronze-wash); padding: 1rem 1.3rem; font-size: 1rem; color: var(--smoke); border-radius: 0 0.6rem 0.6rem 0; }
@media (max-width: 720px) { .lp-compare { grid-template-columns: 1fr; } } .lp-steps { display: grid; gap: 1.6rem; max-width: 46rem; }
.lp-step { display: grid; grid-template-columns: auto 1fr; gap: 1.2rem; align-items: start; position: relative; }
.lp-step__n { width: 46px; height: 46px; border-radius: 999px; background: var(--laurel); color: var(--ivory); display: inline-flex; align-items: center; justify-content: center; font-family: var(--serif); font-size: 1.1rem; flex: none; position: relative; z-index: 1; }
.lp-step:nth-child(even) .lp-step__n { background: var(--bronze); }
.lp-step:not(:last-child)::before { content: ""; position: absolute; left: 22px; top: 46px; bottom: -1.6rem; width: 2px; background: linear-gradient(var(--aqua), transparent); }
.lp-step h3 { font-family: var(--serif); font-size: 1.2rem; color: var(--ink); margin: 0.4rem 0 0.4rem; font-weight: 400; }
.lp-step__badge { display: inline-block; font-size: 1rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--bronze); background: var(--bronze-wash); padding: 0.2rem 0.6rem; border-radius: 999px; margin-left: 0.6rem; vertical-align: middle; }
.lp-step p { font-size: 1rem; line-height: 1.6; color: var(--smoke); margin: 0; }
.lp-steps--side { max-width: none; background: var(--laurel); color: var(--ivory); border-radius: 1.2rem; padding: 2rem 1.8rem; }
.lp-steps--side .lp-step h3 { color: var(--ivory); } .lp-steps--side .lp-step p { color: rgba(251,253,253,0.75); }
.lp-steps--side .lp-step__n { background: rgba(95,198,206,0.16); color: var(--aqua); }
.lp-steps--side .lp-step:not(:last-child)::before { background: linear-gradient(rgba(95,198,206,0.4), transparent); }
.lp-two { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 4vw, 3.5rem); align-items: center; }
@media (max-width: 860px) { .lp-two { grid-template-columns: 1fr; } } .lp-offer__box { background: rgba(251,253,253,0.08); border: 1px solid rgba(251,253,253,0.2); border-radius: 1.4rem; padding: 1.8rem 2rem; margin-top: 1.8rem; }
.lp-offer__box h3 { font-family: var(--sans); font-size: 1rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--aqua); margin: 0 0 1.1rem; }
.lp-offer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.85rem; }
.lp-offer__list li { display: flex; gap: 0.7rem; font-size: 1rem; line-height: 1.5; color: var(--ivory); }
.lp-offer__list svg { flex: none; color: var(--aqua); margin-top: 0.15rem; }
.lp-offer__sedi { margin-top: 1.3rem; padding-top: 1.1rem; border-top: 1px solid rgba(251,253,253,0.18); font-size: 1rem; color: rgba(251,253,253,0.7); }
.lp-offer__actions { display: flex; flex-wrap: wrap; gap: 0.8rem; margin-top: 1.8rem; } .lp-reviews .pc-reviews { padding: 0; } .lp-form__grid { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(2rem, 4vw, 3.5rem); align-items: start; }
.lp-form__aside .lp-wa-cta { display: flex; align-items: center; justify-content: center; gap: 0.6rem; width: 100%; margin-top: 1.4rem; }
.lp-form__disc { margin-top: 1.4rem; border-left: 3px solid var(--aqua); background: var(--bronze-wash); padding: 1rem 1.3rem; font-size: 1rem; color: var(--smoke); border-radius: 0 0.6rem 0.6rem 0; }
.lp-form__box .lead-form { margin: 0; }
@media (max-width: 860px) { .lp-form__grid { grid-template-columns: 1fr; } } .lp-footer { background: #050810; color: rgba(251,253,253,0.66); padding-block: 2.4rem; }
.lp-footer__in { display: flex; flex-direction: column; gap: 1rem; }
.lp-footer__links { display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem 1.4rem; font-size: 1rem; }
.lp-footer__links a { color: rgba(251,253,253,0.78); text-decoration: none; } .lp-footer__links a:hover { color: var(--aqua); }
.lp-footer__legal { font-size: 0.72rem; line-height: 1.6; color: rgba(251,253,253,0.62); max-width: 60em; } .lp-floatbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 190; display: none; align-items: center; justify-content: center; gap: 0.6rem; padding: 0.7rem var(--gutter) calc(0.7rem + env(safe-area-inset-bottom)); background: rgba(251,253,253,0.96); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-top: var(--hairline); transform: translateY(110%); transition: transform 0.35s var(--ease-out); }
.lp-floatbar.is-visible { transform: none; }
.lp-floatbar a { flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: 0.5em; font-weight: 650; font-size: 0.95rem; letter-spacing: 0.04em; text-transform: uppercase; line-height: 1; padding: 0.85em 0.6em; border-radius: 999px; text-decoration: none; white-space: nowrap; }
.lp-floatbar__call { background: var(--laurel); color: var(--ivory); }
.lp-floatbar__call:active { background: var(--laurel-deep); }
.lp-floatbar__wa { background: #25D366; color: #fff; }
.lp-floatbar__wa:active { background: #1fb857; }
.lp-floatbar svg { flex: none; }
@media (max-width: 900px) { .lp-floatbar { display: flex; } .lp-body { padding-bottom: 4.5rem; } } .lp-body .pc-skip-link {
position: absolute; left: -9999px; top: 0; z-index: 400;
background: var(--laurel); color: var(--ivory);
padding: 0.7rem 1.2rem; border-radius: 0 0 0.5rem 0;
font-size: 1rem; text-decoration: none;
}
.lp-body .pc-skip-link:focus { left: 0; } .lp-card__icon svg, .lp-hero__benefits svg, .lp-offer__list svg, .lp-compare li .ic { stroke-width: 1.7; }