/* „Обувки на едро“ (templates/obuvki-na-edro.php), obuvnazona.bg only; the look of Контакти (.contact-page). */
.wl-page { padding-top: 16px; padding-bottom: 48px; color: #101828; font-family: Arial, sans-serif; line-height: 1.45; }
.wl-page h1, .wl-page h2, .wl-page h3 { font-family: inherit; text-transform: none; letter-spacing: 0; }
.wl-crumbs { display: flex; gap: 8px; margin-bottom: 18px; color: #8a8f99; font-size: 14px; }
.wl-crumbs a { color: inherit; text-decoration: none; }
.wl-crumbs a:hover { color: #101828; }
.wl-crumbs span:last-child { color: #101828; font-weight: 600; }

.wl-hero { display: flex; flex-direction: column; align-items: center; padding: 44px 28px; border-radius: 16px; background: #ffe8ed; text-align: center; }
.wl-badge { display: inline-block; margin-bottom: 12px; padding: 2px 12px; border: 1.5px solid #FF324D; border-radius: 999px; color: #FF324D; font-size: 14px; font-weight: 700; }
.wl-hero h1 { margin: 0 0 12px; font-size: 44px; font-weight: 800; line-height: 1.15; }
.wl-lead { max-width: 680px; margin: 0 0 24px; color: #4a4f59; font-size: 19px; }
.wl-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.wl-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 12px 26px; border: 2px solid transparent; border-radius: 10px; font-size: 17px; font-weight: 700;
    text-decoration: none; transition: background-color .15s, color .15s, border-color .15s; }
.wl-btn:focus-visible { outline: 3px solid rgba(255, 50, 77, .4); outline-offset: 2px; }
.wl-btn-red { background: #FF324D; color: #fff; }
.wl-btn-red:hover { background: #e5203b; color: #fff; }
.wl-btn-line { border-color: #101828; background: #fff; color: #101828; }
.wl-btn-line:hover { background: #101828; color: #fff; }
.wl-btn-white { background: #fff; color: #101828; }
.wl-btn-white:hover { background: #ffe8ed; color: #101828; }
.wl-btn-ghost { border-color: rgba(255, 255, 255, .7); color: #fff; }
.wl-btn-ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .12); color: #fff; }

.wl-section { margin-top: 44px; }
.wl-section > h2 { margin: 0 0 18px; font-size: 30px; font-weight: 800; line-height: 1.2; text-align: center; }
.wl-section h3 { margin: 0 0 4px; font-size: 18px; font-weight: 700; line-height: 1.3; }
.wl-section p { margin: 0; color: #4a4f59; font-size: 16px; }

.wl-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; counter-reset: none; }
.wl-steps li { position: relative; padding: 24px 20px; border: 1px solid #e4e7ec; border-radius: 14px; background: #fff; }
.wl-step-icon { display: flex; align-items: center; justify-content: center; width: 56px; height: 56px; margin-bottom: 14px; border-radius: 50%; background: #ffe8ed; color: #FF324D; }
.wl-step-icon svg, .wl-feature-icon svg { width: 30px; height: 30px; }
.wl-step-no { position: absolute; top: 18px; right: 18px; color: #d0d5dd; font-size: 30px; font-weight: 800; line-height: 1; }

.wl-features { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.wl-features li { display: flex; align-items: flex-start; gap: 16px; padding: 20px; border-radius: 14px; background: #f5f7fa; }
.wl-feature-icon { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 12px; background: #fff; color: #FF324D; }

.wl-faq { max-width: 860px; margin: 0 auto; border-top: 1px solid #e4e7ec; }
.wl-faq details { border-bottom: 1px solid #e4e7ec; }
.wl-faq summary { position: relative; padding: 18px 44px 18px 4px; font-size: 18px; font-weight: 700; list-style: none; cursor: pointer; }
.wl-faq summary::-webkit-details-marker { display: none; }
.wl-faq summary::after { content: "+"; position: absolute; top: 50%; right: 8px; color: #8a8f99; font-size: 26px; font-weight: 400; transform: translateY(-50%); }
.wl-faq details[open] summary::after { content: "−"; }
.wl-faq summary:focus-visible { outline: 3px solid rgba(255, 50, 77, .4); outline-offset: 2px; }
.wl-faq details p { padding: 0 44px 18px 4px; }

.wl-cta { display: flex; flex-direction: column; align-items: center; margin-top: 48px; padding: 36px 24px; border-radius: 16px; background: #2b2d31; color: #fff; text-align: center; }
.wl-cta h2 { margin: 0 0 18px; color: #fff; font-size: 28px; font-weight: 800; line-height: 1.2; }

@media (max-width: 991px) {
    .wl-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .wl-hero { padding: 30px 18px; }
    .wl-hero h1 { font-size: 34px; }
    .wl-lead { font-size: 17px; }
    .wl-actions { flex-direction: column; align-self: stretch; }
    .wl-btn { width: 100%; }
    .wl-section { margin-top: 34px; }
    .wl-section > h2 { font-size: 25px; }
    .wl-steps, .wl-features { grid-template-columns: minmax(0, 1fr); gap: 12px; }
    .wl-steps li { padding: 18px 16px; }
    .wl-faq summary { font-size: 17px; }
    .wl-cta h2 { font-size: 24px; }
}