.wpf{max-width:1100px;margin:0 auto;padding:24px 16px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#000}
.wpf *{box-sizing:border-box}
.wpf__header{display:flex;flex-direction:column;gap:12px;margin-bottom:18px}
.wpf__title{font-size:44px;line-height:1.1;text-align:center;font-weight:700}
.wpf__progress{height:8px;background:#eee;border-radius:999px;overflow:hidden}
.wpf__progressBar{height:100%;width:0%;background:#c2185b;border-radius:999px;transition:width .25s ease}

.wpf__body{background:#fff;border:1px solid #eee;border-radius:16px;box-shadow:0 10px 30px rgba(0,0,0,.06);padding:28px}
.wpf__step h3{font-size:34px;margin:0 0 18px 0;text-align:left}

.wpf__h3WithInfo{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.wpf__info{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:999px;border:2px solid #c2185b;color:#c2185b;font-weight:900;font-size:14px;cursor:pointer;position:relative;user-select:none}
.wpf__info:focus{outline:none;box-shadow:0 0 0 4px rgba(194,24,91,.15)}
.wpf__info[data-tooltip]:hover::after,
.wpf__info[data-tooltip]:focus::after{content:attr(data-tooltip);position:absolute;left:50%;top:calc(100% + 10px);transform:translateX(-50%);background:#fff;color:#111;border:1px solid #e5e5e5;border-radius:12px;padding:14px 14px;min-width:280px;max-width:420px;box-shadow:0 16px 40px rgba(0,0,0,.18);z-index:50;white-space:normal;line-height:1.3}
.wpf__info[data-tooltip]:hover::before,
.wpf__info[data-tooltip]:focus::before{content:'';position:absolute;left:50%;top:calc(100% + 4px);transform:translateX(-50%);border:8px solid transparent;border-bottom-color:#fff;filter:drop-shadow(0 -1px 0 #e5e5e5);z-index:51}

.wpf__cards{display:grid;gap:18px}
.wpf__cards--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.wpf__cards--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.wpf__cards--5{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1000px){.wpf__cards--5{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.wpf__cards--5{grid-template-columns:1fr}}
@media (max-width:900px){.wpf__cards--2,.wpf__cards--3{grid-template-columns:1fr}.wpf__title{font-size:34px}.wpf__step h3{font-size:26px}}

.wpf__card{display:flex;align-items:center;gap:14px;border:1px solid #e7e7e7;background:#fff;border-radius:14px;padding:18px;cursor:pointer;text-align:left;color:#000;transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease}
.wpf__card:hover{transform:translateY(-1px);box-shadow:0 10px 26px rgba(0,0,0,.08)}
.wpf__card.is-selected{background:#0b57d0;border-color:#0b57d0;box-shadow:0 12px 28px rgba(11,87,208,.25)}
.wpf__card.is-selected .wpf__cardTitle,.wpf__card.is-selected .wpf__cardSub{color:#fff}
.wpf__cardMedia{width:78px;height:78px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;font-size:34px;box-shadow:0 10px 26px rgba(0,0,0,.08)}
.wpf__card.is-selected .wpf__cardMedia{box-shadow:none}
.wpf__cardText{display:flex;flex-direction:column;gap:6px}
.wpf__cardTitle{font-size:18px;font-weight:700;color:#000}
.wpf__cardSub{font-size:14px;color:#333}

.wpf__slider{margin-top:18px;border:1px solid #eee;border-radius:14px;padding:16px}
.wpf__sliderRow{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.wpf__hint{color:#777;font-size:13px}
.wpf input[type=range]{width:100%}

.wpf__radio{display:flex;flex-direction:column;gap:12px}
.wpf__radioRow{display:flex;align-items:center;gap:12px;border:1px solid #eee;border-radius:12px;padding:12px 14px}
.wpf__radioRow input{transform:scale(1.1)}
.wpf__pill{margin-left:auto;font-size:12px;padding:6px 10px;border-radius:999px;background:#f2f2f2;color:#333;font-weight:700}
.wpf__pill--info{background:#e8f0fe;color:#0b57d0}
.wpf__pill--warn{background:#ffebee;color:#c62828}
.wpf__note{margin-top:10px;color:#444;font-size:14px}

.wpf__summary{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
@media (max-width:900px){.wpf__summary{grid-template-columns:1fr}}

.wpf__included{margin:10px 0 0 20px;font-size:18px;line-height:1.6}

.wpf__summaryCol--right{border-left:1px solid #eee;padding-left:18px}
@media (max-width:900px){.wpf__summaryCol--right{border-left:none;padding-left:0;border-top:1px solid #eee;padding-top:18px}}

.wpf__summaryHeader{font-size:18px;margin-bottom:10px}

.wpf__table{width:100%;border-collapse:collapse;font-size:16px}
.wpf__table td,.wpf__table th{padding:10px 0;border-bottom:1px solid #f0f0f0;vertical-align:top}
.wpf__table tfoot th{border-bottom:none}
.wpf__table tfoot th:last-child{font-size:34px;white-space:nowrap}

/* red X when no SEO in summary */
.wpf__table td.is-no-seo{color:#c62828;font-weight:800}

.wpf__centerTitle{text-align:center;font-size:40px;margin-bottom:10px}

.wpf__form{max-width:560px;margin:0 auto}
.wpf__gender{display:flex;gap:18px;justify-content:center;margin-bottom:14px}
.wpf__gender label{display:flex;align-items:center;gap:8px;font-size:16px}
.wpf__gender span{font-weight:700}

.wpf__privacy{margin:14px 0 0;font-size:14px;color:#444;line-height:1.35}

.wpf__field{display:flex;flex-direction:column;gap:8px;margin:14px 0}
.wpf__field span{font-weight:700}
.wpf__field input{border:1px solid #ddd;border-radius:10px;padding:14px 14px;font-size:16px;outline:none}
.wpf__field input:focus{border-color:#0b57d0;box-shadow:0 0 0 4px rgba(11,87,208,.15)}

.wpf__checkbox{display:flex;gap:10px;align-items:flex-start;margin:16px 0;font-size:14px;color:#333}
.wpf__checkbox input{margin-top:3px;transform:scale(1.1)}
.wpf__checkbox--big{justify-content:center}

.wpf__actions{display:flex;align-items:center;gap:12px;margin-top:12px}
.wpf__actions--center{justify-content:center;flex-direction:column}
.wpf__status{min-height:20px;color:#444}

.wpf__btn{border:1px solid #ddd;background:#fff;color:#000;border-radius:12px;padding:12px 18px;font-weight:700;cursor:pointer}
.wpf__btn:disabled{opacity:.45;cursor:not-allowed}
.wpf__btn--primary{background:#0b57d0;border-color:#0b57d0;color:#fff}
.wpf__btn--wide{width:100%;max-width:520px;border-radius:10px;padding:14px 18px;font-size:16px}

.wpf__footer{display:flex;justify-content:space-between;gap:12px;margin-top:16px}


/* Mobile fixes: prevent clipping / allow wrapping */
.wpf__table th,.wpf__table td{overflow-wrap:anywhere;word-break:break-word;}
@media (max-width:600px){
  .wpf__title{font-size:34px;}
  .wpf__table tfoot th:last-child{font-size:28px;white-space:normal;}
}

.wpf__step--thankyou{padding:24px 0;}
.wpf__thankyouText{font-size:18px;line-height:1.5;text-align:center;margin:10px 0 0;}

.wpf__nettoNote{margin-top:10px;font-size:13px;color:#666;text-align:right;}

.wpf__table--annual{margin-top:16px;}
.wpf__subtotal th{background:#f8f9fa;font-size:15px;}
