.smp-page {
  --smp-purple:       #7c3aed;
  --smp-purple-dark:  #6d28d9;
  --smp-purple-light: #a78bfa;
  --smp-ink:          #101424;
  --smp-line:         #e9e8ef;
  --smp-wa:           #25d366;
  --smp-wa-dark:      #1ebe5d;
  --smp-amber:        #f59e0b;
  --smp-green:        #22c55e;
  --smp-red:          #ef4444;
  color: var(--smp-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, sans-serif;
}

/* ── SHARED ── */
.smp-eyebrow { display: inline-block; margin-bottom: 14px; color: var(--smp-purple); font-size: 11px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.smp-section-title { margin: 0; color: var(--smp-ink); font-size: clamp(28px, 2.8vw, 42px); font-weight: 800; line-height: 1.06; letter-spacing: -.04em; }
.smp-section-text { margin: 14px 0 0; color: #6f7584; font-size: 14px; line-height: 1.75; }
.smp-prose { color: #454d5e; font-size: 14.5px; line-height: 1.78; }
.smp-prose p { margin: 0 0 14px; }
.smp-prose p:last-child { margin-bottom: 0; }
.smp-prose strong { color: var(--smp-ink); font-weight: 800; }

/* ── BUTTONS ── */
.smp-btn-primary { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 26px; color: #fff !important; border: 0; border-radius: 10px; background: linear-gradient(135deg, var(--smp-purple-dark), var(--smp-purple) 55%, #9333ea); box-shadow: 0 10px 26px rgba(124,58,237,.22); font-size: 14px; font-weight: 700; text-decoration: none !important; transition: transform .2s, box-shadow .2s; }
.smp-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(124,58,237,.3); }
.smp-btn-outline { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 26px; color: #1a2030 !important; border: 1.5px solid #c4b8f7; border-radius: 10px; background: #fff; font-size: 14px; font-weight: 700; text-decoration: none !important; transition: transform .2s, border-color .2s; }
.smp-btn-outline:hover { border-color: var(--smp-purple); transform: translateY(-2px); }
.smp-wa-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 56px; padding: 0 32px; color: #fff !important; border: 0; border-radius: 12px; background: var(--smp-wa); box-shadow: 0 12px 30px rgba(37,211,102,.28); font-size: 15px; font-weight: 700; text-decoration: none !important; transition: background .2s, transform .2s, box-shadow .2s; }
.smp-wa-btn:hover { background: var(--smp-wa-dark); transform: translateY(-2px); }
.smp-outline-dark { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 24px; color: rgba(255,255,255,.86) !important; border: 1.5px solid rgba(255,255,255,.2); border-radius: 10px; background: rgba(255,255,255,.06); font-size: 13.5px; font-weight: 700; text-decoration: none !important; transition: background .2s, border-color .2s, transform .2s; }
.smp-outline-dark:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.38); transform: translateY(-2px); }
.smp-text-link { color: var(--smp-purple); font-weight: 700; font-size: 12.5px; text-decoration: none; }
.smp-text-link:hover { color: var(--smp-purple-dark); text-decoration: underline; }

/* ── HERO ── */
.smp-hero { position: relative; overflow: hidden; background: #fff; isolation: isolate; }
.smp-hero-bg { position: absolute; inset: 0; z-index: -2; background: url("/wp-content/uploads/2026/09/iptv-smarters-pro-uk.webp") center right / cover no-repeat; }
.smp-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255,.99) 28%, rgba(255,255,255,.94) 42%, rgba(255,255,255,.54) 56%, rgba(255,255,255,.07) 70%, rgba(255,255,255,0) 82%); pointer-events: none; }
.smp-hero-title { margin: 0; color: var(--smp-ink); font-size: clamp(42px, 4.6vw, 64px); font-weight: 800; line-height: .98; letter-spacing: -.05em; }
.smp-hero-title span { display: block; margin-top: 8px; font-size: .62em; font-weight: 700; line-height: 1.06; letter-spacing: -.04em; color: #3a4258; }
.smp-hero-desc { max-width: 560px; margin: 20px 0 0; color: #596174; font-size: 16px; line-height: 1.65; }
.smp-hero-answer { max-width: 580px; margin: 22px 0 0; padding: 16px 20px; border-left: 4px solid var(--smp-purple); border-radius: 0 10px 10px 0; background: linear-gradient(90deg, #faf8ff, #fff); }
.smp-hero-answer p { margin: 0; color: #3a3f52; font-size: 13.5px; font-weight: 600; line-height: 1.6; }
.smp-trust-div { width: 1px; height: 18px; background: #d4d6df; }

/* ── NAV TABS ── */
.smp-device-tabs { display: flex; flex-wrap: nowrap; gap: 5px; padding: 5px; border: 1px solid #e8e5f0; border-radius: 14px; background: #f4f2f8; overflow-x: auto; scrollbar-width: none; }
.smp-device-tabs::-webkit-scrollbar { display: none; }
.smp-device-tab { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 18px; border: 0; border-radius: 9px; background: transparent; font-size: 13px; font-weight: 700; color: #676d7b; cursor: pointer; white-space: nowrap; font-family: inherit; transition: color .2s, background .2s, box-shadow .2s; }
.smp-device-tab:hover { color: var(--smp-purple-dark); }
.smp-device-tab.active { color: #fff; background: linear-gradient(135deg, var(--smp-purple-dark), var(--smp-purple) 55%, #9333ea); box-shadow: 0 6px 18px rgba(124,58,237,.22); }
.smp-panel { display: none; }
.smp-panel.active { display: block; }

/* ── SETUP STEPS ── */
.smp-step { display: grid; grid-template-columns: 46px 1fr; gap: 0 20px; padding-bottom: 30px; position: relative; }
.smp-step:not(:last-child)::after { content: ""; position: absolute; left: 22px; top: 46px; bottom: 0; width: 2px; background: linear-gradient(180deg, rgba(124,58,237,.25), rgba(124,58,237,.04)); }
.smp-step-num { width: 46px; height: 46px; flex: 0 0 46px; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 16px; font-weight: 900; color: #fff; background: linear-gradient(135deg, var(--smp-purple-dark), var(--smp-purple)); box-shadow: 0 6px 18px rgba(124,58,237,.22); position: relative; z-index: 1; align-self: flex-start; }
.smp-step-body { padding-top: 8px; }
.smp-step-body h3 { margin: 0 0 8px; color: var(--smp-ink); font-size: 16px; font-weight: 800; line-height: 1.25; letter-spacing: -.025em; }
.smp-step-body p { margin: 0; color: #6f7584; font-size: 13.5px; line-height: 1.7; }
.smp-step-body p + p { margin-top: 8px; }
.smp-path { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 4px; margin-top: 10px; padding: 8px 12px; border: 1px solid #e4e2ef; border-radius: 8px; background: #faf8ff; font-size: 11.5px; }
.smp-path-s { color: var(--smp-purple-dark); font-weight: 800; white-space: nowrap; }
.smp-path-a { color: #a0a6b8; font-size: 10px; }
.smp-code-inline { display: inline-block; padding: 2px 8px; border-radius: 5px; background: #0f0c1d; color: var(--smp-purple-light); font-family: monospace; font-size: 13px; font-weight: 800; letter-spacing: .03em; }
.smp-note { display: flex; align-items: flex-start; gap: 10px; margin-top: 12px; padding: 11px 14px; border-left: 3px solid var(--smp-amber); border-radius: 0 8px 8px 0; background: #fffbeb; }
.smp-note-icon { color: var(--smp-amber); font-size: 15px; flex: 0 0 18px; margin-top: 1px; }
.smp-note p { margin: 0; color: #78350f; font-size: 12px; font-weight: 600; line-height: 1.55; }
.smp-tip { display: flex; align-items: flex-start; gap: 10px; margin-top: 12px; padding: 11px 14px; border-left: 3px solid var(--smp-purple); border-radius: 0 8px 8px 0; background: #faf8ff; }
.smp-tip-icon { color: var(--smp-purple); font-size: 15px; flex: 0 0 18px; margin-top: 1px; }
.smp-tip p { margin: 0; color: #3d3560; font-size: 12px; font-weight: 600; line-height: 1.55; }

/* ── FEATURES ── */
.smp-feature-card { padding: 20px 18px; border: 1px solid var(--smp-line); border-radius: 13px; background: #fff; box-shadow: 0 5px 16px rgba(18,23,38,.04); height: 100%; transition: transform .22s, border-color .22s; }
.smp-feature-card:hover { transform: translateY(-3px); border-color: rgba(124,58,237,.18); }
.smp-feature-icon { font-size: 24px; margin-bottom: 12px; display: block; }
.smp-feature-card h3 { margin: 0 0 7px; color: var(--smp-ink); font-size: 14px; font-weight: 800; line-height: 1.28; }
.smp-feature-card p { margin: 0; color: #757b89; font-size: 12.5px; line-height: 1.6; }

/* ── DEVICE COMPAT ── */
.smp-compat-row { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border: 1px solid #e8e7ef; border-radius: 12px; background: #fff; }
.smp-compat-icon { font-size: 22px; flex: 0 0 32px; text-align: center; }
.smp-compat-name { font-size: 13.5px; font-weight: 800; color: var(--smp-ink); min-width: 160px; }
.smp-compat-app { font-size: 12px; font-weight: 700; color: #6f7584; }
.smp-badge-free { display: inline-block; padding: 2px 8px; border-radius: 20px; background: #f0fdf6; color: #15803d; border: 1px solid #bbf7d0; font-size: 10px; font-weight: 800; margin-left: 6px; }
.smp-badge-store { display: inline-block; padding: 2px 8px; border-radius: 20px; background: #f5f4fb; color: #4b5563; border: 1px solid #e5e7eb; font-size: 10px; font-weight: 700; margin-left: 6px; }
.smp-badge-warn { display: inline-block; padding: 2px 8px; border-radius: 20px; background: #fffbeb; color: #92400e; border: 1px solid #fcd34d; font-size: 10px; font-weight: 800; margin-left: 6px; }

/* ── SMARTERS vs TIVIMATE ── */
.smp-vs-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12.5px; border: 1px solid var(--smp-line); border-radius: 14px; overflow: hidden; box-shadow: 0 6px 20px rgba(18,23,38,.045); }
.smp-vs-table th, .smp-vs-table td { padding: 12px 16px; border-bottom: 1px solid #eeedf4; vertical-align: middle; }
.smp-vs-table tr:last-child td { border-bottom: 0; }
.smp-vs-table thead th { font-size: 11px; font-weight: 800; text-align: center; }
.smp-vs-table thead th:first-child { text-align: left; background: #f5f4fb; color: #6b7280; }
.smp-vs-th-smp { background: #f0fdf6; color: #15803d; }
.smp-vs-th-tiv { background: linear-gradient(135deg,#faf7ff,#f3eeff); color: var(--smp-purple-dark); }
.smp-vs-table td:first-child { font-weight: 700; color: #363d52; font-size: 12px; }
.smp-vs-table td:not(:first-child) { text-align: center; }
.smp-vs-table tbody tr:nth-child(odd) td { background: #faf9ff; }
.smp-vs-table tbody tr:nth-child(odd) td:first-child { background: #f7f6fc; }
.smp-vs-table tbody tr:nth-child(even) td { background: #fff; }
.smp-win { color: var(--smp-green); font-size: 16px; }
.smp-tie { color: var(--smp-amber); font-size: 11px; font-weight: 700; }
.smp-lose { color: #9ca3af; font-size: 16px; }
.smp-win-badge { display: inline-block; padding: 2px 8px; border-radius: 20px; background: linear-gradient(135deg,var(--smp-purple-dark),#8b5cf6); color: #fff; font-size: 9px; font-weight: 800; letter-spacing:.05em; text-transform:uppercase; }
.smp-win-badge-g { background: linear-gradient(135deg,#15803d,#22c55e); }

/* ── FIX CARDS ── */
.smp-fix-card { display: flex; align-items: flex-start; gap: 14px; padding: 18px 18px; border: 1px solid #e8e7ef; border-radius: 12px; background: #fff; box-shadow: 0 4px 14px rgba(18,23,38,.035); height: 100%; transition: border-color .2s, transform .2s; }
.smp-fix-card:hover { border-color: rgba(124,58,237,.16); transform: translateY(-2px); }
.smp-fix-icon { flex: 0 0 36px; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; border-radius: 9px; font-size: 17px; background: #faf8ff; border: 1px solid rgba(124,58,237,.1); }
.smp-fix-card h3 { margin: 0 0 5px; color: var(--smp-ink); font-size: 13.5px; font-weight: 800; line-height: 1.28; }
.smp-fix-card p { margin: 0; color: #757b89; font-size: 12.5px; line-height: 1.58; }
.smp-error-badge { display: inline-block; padding: 2px 8px; margin-bottom: 7px; border-radius: 5px; background: #fef2f2; color: #dc2626; border: 1px solid #fecaca; font-size: 10.5px; font-weight: 800; font-family: monospace; }

/* ── FAQ ── */
.smp-faq { background: linear-gradient(180deg,#fbfaff,#fff); }
.smp-faq-accordion .accordion-item { overflow: hidden; border: 1px solid #e8e7ef !important; border-radius: 11px !important; background: #fff; box-shadow: 0 5px 16px rgba(18,23,38,.03); }
.smp-faq-accordion .accordion-button { min-height: 62px; padding: 16px 18px; color: #1b1f2d; background: #fff; box-shadow: none !important; font-size: 12.5px; font-weight: 700; line-height: 1.4; }
.smp-faq-accordion .accordion-button:not(.collapsed) { color: var(--smp-purple-dark); background: #fbf9ff; }
.smp-faq-accordion .accordion-button:hover { color: var(--smp-purple-dark); }
.smp-faq-accordion .accordion-button::after { width: 25px; height: 25px; flex: 0 0 25px; margin-left: 14px; display: flex; align-items: center; justify-content: center; content: "+"; color: #343947; border-radius: 50%; background: #f5f4f8; background-image: none !important; font-size: 17px; font-weight: 500; transform: none !important; }
.smp-faq-accordion .accordion-button:not(.collapsed)::after { content: "\2212"; color: #fff; background: var(--smp-purple); }
.smp-faq-accordion .accordion-body { padding: 0 18px 19px; color: #6f7583; background: #fbf9ff; font-size: 12.5px; line-height: 1.72; }
.smp-faq-accordion .accordion-body p { margin: 0; }
.smp-faq-accordion .accordion-body p + p { margin-top: 8px; }
.smp-faq-accordion .accordion-body a { display: inline-flex; margin-top: 10px; color: var(--smp-purple); font-size: 11.5px; font-weight: 700; text-decoration: none; }
.smp-faq-accordion .accordion-body a:hover { color: #5b21b6; text-decoration: underline; }

/* ── FINAL CTA ── */
.smp-final { background: linear-gradient(135deg,#0d0b1a,#1a0e35 48%,#0f1324); position: relative; overflow: hidden; isolation: isolate; }
.smp-final::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 55% 65% at 78% 50%,rgba(124,58,237,.2),transparent 68%), radial-gradient(ellipse 38% 48% at 18% 60%,rgba(37,211,102,.07),transparent 64%); }
.smp-final-eyebrow { display: inline-block; margin-bottom: 16px; color: var(--smp-purple-light); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.smp-final-title { margin: 0; color: #fff; font-size: clamp(32px,3.6vw,50px); font-weight: 800; line-height: 1.04; letter-spacing: -.045em; }
.smp-final-text { max-width: 560px; margin: 18px auto 0; color: rgba(255,255,255,.7); font-size: 15px; line-height: 1.68; }
.smp-final-note { margin-top: 16px; color: rgba(255,255,255,.42); font-size: 11.5px; font-weight: 600; }

/* ── RESPONSIVE ── */
@media (max-width:991.98px) {
  .smp-hero-bg, .smp-hero::before { display:none; }
  .smp-step { grid-template-columns: 40px 1fr; gap: 0 16px; }
  .smp-step-num { width:40px; height:40px; font-size:15px; }
  .smp-step:not(:last-child)::after { left:19px; }
}
@media (max-width:767.98px) {
  .smp-hero-title { font-size: clamp(38px,10vw,54px); }
  .smp-device-tab { padding: 0 14px; font-size: 12px; }
  .smp-compat-name { min-width: auto; }
}
@media (max-width:575.98px) {
  .smp-faq-accordion .accordion-button { min-height: 56px; padding: 14px 15px; font-size: 12px; }
  .smp-faq-accordion .accordion-body { padding: 0 15px 17px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .smp-page *, .smp-page *::before, .smp-page *::after { transition-duration:.01ms !important; animation-duration:.01ms !important; }
}