.ukl-p { font-family: Inter, system-ui, sans-serif; max-width: 72rem; margin: 0 auto; padding: var(--ukl-pad-top, 100px) 1.25rem 4rem; color: #0f172a; }
.ukl-p *, .ukl-p *::before, .ukl-p *::after { box-sizing: border-box; }
.ukl-p a { color: inherit; }
.ukl-p__intro h1, .ukl-p__hero h1 { margin: 0 0 .75rem; font-size: clamp(1.75rem, 4vw, 2.5rem); }
.ukl-p__intro p, .ukl-p__hero p { margin: 0; color: #475569; font-size: 1.05rem; line-height: 1.6; }
.ukl-p__div { margin: 2.5rem 0 1rem; font-size: 1rem; letter-spacing: .04em; text-transform: uppercase; color: #334155; }
.ukl-p__grid { display: grid; gap: 1rem; }
@media (min-width: 768px) { .ukl-p__grid { grid-template-columns: 1fr 1fr 1fr; } }
.ukl-p__card { display: block; padding: 1.25rem; background: #fff; border: 1px solid #e2e8f0; border-radius: 1rem; text-decoration: none; box-shadow: 0 1px 2px rgb(15 23 42 / .06); }
.ukl-p__card h3 { margin: 0 0 .5rem; font-size: 1.1rem; }
.ukl-p__card p { margin: 0 0 1rem; font-size: .9rem; color: #64748b; line-height: 1.5; }
.ukl-p__card span { font-size: .85rem; font-weight: 600; color: #0e7490; }
.ukl-p__hero { background: linear-gradient(135deg, #0f172a, #334155); color: #fff; padding: 2.5rem 1.5rem; border-radius: 1rem; margin-bottom: 2rem; }
.ukl-p__hero p { color: rgba(255,255,255,.8); }
.ukl-p__crumb { margin-bottom: .75rem !important; font-size: .875rem !important; }
.ukl-p__crumb a { color: #a5f3fc; }
.ukl-p__badge { display: inline-block; margin-bottom: .75rem; padding: .25rem .6rem; background: rgba(255,255,255,.15); border-radius: 999px; font-size: .75rem; }
.ukl-p__layout { display: grid; gap: 2rem; }
@media (min-width: 1024px) { .ukl-p__layout { grid-template-columns: 1.6fr 1fr; align-items: start; } }
.ukl-p__box { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 1rem; padding: 1.25rem 1.5rem; margin-bottom: 1rem; }
.ukl-p__box h3 { margin: 0 0 .75rem; font-size: 1.05rem; }
.ukl-p__chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.ukl-p__chip { display: inline-block; padding: .35rem .75rem; background: #e2e8f0; color: #334155; border-radius: 999px; font-size: .8rem; text-decoration: none; }
.ukl-p__chip.is-on { background: #0e7490; color: #fff; }
.ukl-p__back { display: inline-block; margin-top: 1rem; padding: .5rem 1rem; border: 1px solid #e2e8f0; border-radius: .75rem; text-decoration: none; font-size: .9rem; }
.ukl-p__form { position: sticky; top: 1.5rem; background: linear-gradient(#f0f9ff, #fff); border: 1px solid #bae6fd; border-radius: 1rem; padding: 1.5rem; }
.ukl-p__form h3 { margin: 0 0 .5rem; }
.ukl-p__form p { margin: 0 0 1rem; font-size: .9rem; color: #475569; }
.ukl-p__form label { display: block; font-size: .8rem; font-weight: 600; margin-bottom: .75rem; }
.ukl-p__form input[type=text], .ukl-p__form input[type=email], .ukl-p__form select {
  display: block; width: 100%; margin-top: .3rem; padding: .55rem .7rem; border: 1px solid #cbd5e1; border-radius: .5rem; font: inherit;
}
.ukl-p__row { display: grid; gap: .75rem; }
@media (min-width: 640px) { .ukl-p__row { grid-template-columns: 1fr 1fr; } }
.ukl-p__hint { font-size: .8rem; font-weight: 600; margin: .5rem 0 !important; }
.ukl-p__checks { display: grid; grid-template-columns: 1fr 1fr; gap: .35rem .75rem; margin-bottom: 1rem; max-height: 8rem; overflow: auto; padding: .5rem; border: 1px solid #e2e8f0; border-radius: .5rem; background: #fff; }
.ukl-p__checks label { font-weight: 400; font-size: .75rem; margin: 0; display: flex; gap: .35rem; align-items: center; }
.ukl-p__form button { width: 100%; padding: .85rem; border: 0; border-radius: .6rem; background: #1d4ed8; color: #fff; font-weight: 700; cursor: pointer; }
.ukl-p__form button:hover { background: #1e40af; }
.ukl-p__ok { color: #166534; background: #dcfce7; padding: .75rem; border-radius: .5rem; }
.ukl-p__err { color: #991b1b; background: #fee2e2; padding: .75rem; border-radius: .5rem; }