/* Hyper‑Personalization Engine — revenue‑focused layout */
:root {
  --hpe-accent: var(--primary);
  --hpe-ink:#0f172a;
  --hpe-muted:#4b5563;
  --hpe-border:#e5e7eb;
  --hpe-soft:#f8fafc;
}
.hpe-hero{position:relative;background:
  conic-gradient(from 180deg at 12% 8%, rgba(99,102,241,.10), transparent 35%, rgba(16,185,129,.10) 70%, transparent 92%),
  linear-gradient(120deg, rgba(99,102,241,.06), rgba(17,17,17,.02));
  padding:86px 0 40px; overflow:hidden}
.hpe-hero__inner{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center}
@media (max-width: 992px){.hpe-hero__inner{grid-template-columns:1fr}}
.hpe-hero__kicker{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:18px}
.hpe-hero__eyebrow{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#64748b;font-weight:800;display:inline-flex;align-items:center;gap:10px}
.hpe-hero__eyebrow::before{content:"";width:28px;height:2px;border-radius:999px;background:linear-gradient(90deg,var(--primary),rgba(225,92,2,.2))}
.hpe-hero__kpis{display:flex;gap:8px;flex-wrap:wrap}
.hpe-hero__kpis span{background:#fff;border:1px solid var(--hpe-border);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:800;color:#111;box-shadow:0 10px 24px rgba(0,0,0,.04)}
.hpe-hero__title{font-size: clamp(32px, 4.8vw, 54px);line-height:1.02;margin:0 0 12px;color:var(--hpe-ink)}
.hpe-hero__subtitle{font-size: clamp(16px, 2.2vw, 20px);color:var(--hpe-muted);max-width: 60ch;margin:0}
.hpe-hero__ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:22px}
.hpe-hero__panel{background:#fff;border:1px solid var(--hpe-border);border-radius:18px;padding:18px 18px 16px;box-shadow:0 18px 40px rgba(0,0,0,.10);display:grid;gap:14px}
.hpe-panel__head{display:flex;align-items:center;justify-content:space-between}
.hpe-panel__kicker{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#64748b;font-weight:800}
.hpe-panel__badge{background:var(--hpe-accent);color:#fff;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:800}
.hpe-panel__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.hpe-panel__chip{background:var(--hpe-soft);border:1px solid #e2e8f0;border-radius:12px;padding:10px 12px;font-weight:700;color:#0f172a}
.hpe-panel__foot{font-size:12px;color:#6b7280;font-weight:600}

.hpe-divider{height:1px;background:linear-gradient(90deg, transparent, rgba(148,163,184,.6), transparent);margin:clamp(22px, 5vw, 60px) 0}

.hpe-section__head{max-width:760px;margin-bottom:clamp(18px, 3vw, 30px);display:flex;flex-direction:column;gap:6px}
.hpe-section__eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;font-weight:800;color:#64748b}
.hpe-section__eyebrow::before{content:"";width:28px;height:2px;border-radius:999px;background:linear-gradient(90deg,rgba(225,92,2,.9),rgba(225,92,2,.2))}
.hpe-section__head h2{margin:0;font-size:clamp(22px, 3vw, 34px);line-height:1.15;color:var(--hpe-ink)}
.hpe-section__head .lead{margin:0;color:var(--hpe-muted);font-size:clamp(15px, 2vw, 19px);line-height:1.65;max-width:62ch}

.hpe-signals{padding:clamp(44px, 6vw, 88px) 0}
.hpe-signal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}
@media (max-width: 992px){.hpe-signal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 640px){.hpe-signal-grid{grid-template-columns:1fr}}
.sig{background:#fff;border:1px solid #eee;border-radius:14px;padding:16px;box-shadow:0 12px 26px rgba(0,0,0,.05);min-height:140px}
.sig h3{margin:0 0 6px;font-size:16px}
.sig p{margin:0;color:#475569}

.hpe-modes{padding:clamp(44px, 6vw, 88px) 0}
.modes-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width: 1024px){.modes-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 640px){.modes-grid{grid-template-columns:1fr}}
.mode-card{background:#fff;border:1px solid #eee;border-radius:14px;padding:16px;box-shadow:0 12px 26px rgba(0,0,0,.05);display:flex;flex-direction:column;gap:8px;min-height:170px}
.mode-card h3{margin:0;font-size:17px}
.mode-card p{margin:0;color:#475569}
.mode-tag{margin-top:auto;display:inline-flex;align-items:center;background:#111;color:#fff;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;width:max-content}

.hpe-compare{padding:clamp(44px, 6vw, 88px) 0}
.compare-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:14px}
@media (max-width: 1200px){.compare-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 640px){.compare-grid{grid-template-columns:1fr}}
.cmp{background:#fff;border:1px solid #eee;border-radius:14px;padding:16px;box-shadow:0 12px 26px rgba(0,0,0,.05)}
.cmp h3{margin:8px 0 6px}
.cmp p{margin:0;color:#475569}
.cmp-tag{display:inline-flex;align-items:center;background:#f1f5f9;border:1px solid #e2e8f0;color:#0f172a;border-radius:999px;padding:4px 10px;font-size:11px;font-weight:700}

.hpe-arch{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center;padding:clamp(44px, 6vw, 88px) 0}
@media (max-width: 992px){.hpe-arch{grid-template-columns:1fr}}
.hpe-arch__copy{max-width:62ch}
.hpe-arch__diagram{position:relative;border-radius:18px;border:1px solid var(--hpe-border);background:var(--hpe-soft);padding:20px}
.hpe-flow{display:flex;gap:18px;list-style:none;margin:0;padding:0;overflow-x:auto;scrollbar-width:thin}
.hpe-step{position:relative;background:#fff;border:1px solid var(--hpe-border);border-radius:12px;padding:12px 14px;min-width:150px;box-shadow:0 10px 24px rgba(0,0,0,.05)}
.hpe-step__title{display:block;font-weight:800;color:#111}
.hpe-step__hint{display:block;margin-top:6px;font-size:12px;color:#6b7280}
.hpe-step::after{content:"";position:absolute;right:-16px;top:50%;width:14px;height:2px;background:#c7d2fe}
.hpe-step::before{content:"";position:absolute;right:-19px;top:calc(50% - 4px);border:4px solid transparent;border-left-color:#c7d2fe}
.hpe-step:last-child::after,.hpe-step:last-child::before{display:none}

.hpe-cta{padding:clamp(40px, 6vw, 88px) 0 84px}
.hpe-cta .panel{background:linear-gradient(135deg, rgba(99,102,241,.10), rgba(16,185,129,.10)); border:1px solid #e5e7eb;border-radius:20px;padding:28px 30px;box-shadow:0 16px 36px rgba(0,0,0,.06);display:grid;gap:12px}
.hpe-cta .panel h2{margin:0}
.hpe-cta .panel p{margin:0;color:#475569;max-width:70ch}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;background:var(--primary);color:#fff;text-decoration:none;padding:14px 22px;border-radius:12px;font-weight:800;box-shadow:0 14px 26px rgba(99,102,241,.24);transition:transform .2s ease, box-shadow .2s ease}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 18px 30px rgba(99,102,241,.28)}
.btn-secondary{display:inline-flex;align-items:center;justify-content:center;background:#fff;color:#111;text-decoration:none;padding:12px 18px;border-radius:12px;font-weight:700;border:1px solid #111;transition:background .2s ease, transform .2s ease}
.btn-secondary:hover{transform:translateY(-1px);background:#f8fafc}