body.basic-preview-page { min-height:100vh; background:#f7f9fe; color:#1f2937; }
.basic-preview-page header#site-header { background:rgba(255,255,255,.96); }
.basic-preview-page .logo { color:#0f172a; }
.basic-preview-page .nav-links a { color:#2c2c2c; }
.basic-preview-main { min-height:100vh; padding:132px 20px 96px; background:radial-gradient(circle at 10% 5%,rgba(76,121,238,.1),transparent 28%),radial-gradient(circle at 90% 35%,rgba(113,65,217,.08),transparent 24%),#f7f9fe; }
.basic-preview-shell { width:min(100%,960px); margin:0 auto; }
.basic-preview-breadcrumb { display:flex; align-items:center; gap:9px; margin-bottom:32px; color:#77849a; font-size:14px; }
.basic-preview-breadcrumb a:hover { color:#4c79ee; }
.basic-preview-breadcrumb strong { color:#334155; }
.basic-preview-intro { max-width:760px; margin-bottom:44px; }
.basic-preview-eyebrow { margin:0 0 12px; color:#4c79ee; font-size:15px; font-weight:800; }
.basic-preview-intro h1 { margin:0; color:#16213a; font-size:clamp(32px,5vw,54px); font-weight:800; line-height:1.16; letter-spacing:-.045em; }
.basic-preview-intro > p:last-child { max-width:650px; margin:18px 0 0; color:#61708a; font-size:17px; line-height:1.75; }
.basic-preview-status { display:flex; min-height:360px; padding:56px 24px; border:1px solid #e2e9f6; border-radius:24px; background:#fff; box-shadow:0 24px 70px rgba(50,76,139,.09); flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.basic-preview-spinner { width:44px; height:44px; margin-bottom:22px; border:4px solid #dce6fb; border-top-color:#4c79ee; border-radius:50%; animation:basic-preview-spin .8s linear infinite; }
.basic-preview-status h2 { margin:0; color:#1e293b; font-size:26px; }
.basic-preview-status p { max-width:520px; margin:12px 0 0; color:#64748b; line-height:1.65; }
.basic-preview-status-actions { display:flex; margin-top:26px; gap:10px; flex-wrap:wrap; justify-content:center; }
.basic-preview-status-actions a,
.basic-preview-status-actions button { display:inline-flex; min-height:46px; padding:0 20px; border:1px solid #dce4f2; border-radius:10px; background:#fff; color:#334155; font-weight:800; align-items:center; justify-content:center; }
.basic-preview-status-actions .basic-preview-status-primary { border-color:#4c79ee; background:#4c79ee; color:#fff; }
.basic-preview-result { display:grid; gap:24px; }
.basic-preview-target-card { display:flex; padding:26px 30px; border:1px solid #dce5f5; border-radius:20px; background:#fff; box-shadow:0 14px 44px rgba(52,78,143,.07); align-items:center; justify-content:space-between; gap:24px; }
.basic-preview-chip { display:inline-flex; min-height:26px; padding:0 10px; border-radius:999px; background:#eef4ff; color:#355fcb; font-size:12px; font-weight:800; align-items:center; }
.basic-preview-card-kicker { margin:12px 0 5px; color:#718096; font-size:13px; font-weight:700; }
.basic-preview-target-card h2 { margin:0; color:#172033; font-size:25px; }
.basic-preview-target-card h2 span:last-child { margin-left:5px; color:#53627a; font-weight:600; }
.basic-preview-text-button { min-height:42px; padding:0 15px; border:1px solid #dbe4f2; border-radius:9px; color:#40516d; font-size:13px; font-weight:800; white-space:nowrap; }
.basic-preview-text-button:hover { border-color:#9bb4ed; color:#3159bb; background:#f7faff; }
.basic-preview-priority { display:grid; padding:42px; border-radius:24px; background:linear-gradient(135deg,#24385f,#17243f); color:#fff; box-shadow:0 24px 60px rgba(25,42,77,.18); grid-template-columns:minmax(0,.85fr) minmax(0,1.35fr); gap:40px; align-items:center; }
.basic-preview-priority .basic-preview-card-kicker { color:#aebfe7; }
.basic-preview-priority-copy h2 { margin:0; font-size:clamp(27px,4vw,39px); line-height:1.25; }
.basic-preview-priority-copy h2 strong { color:#8db0ff; }
.basic-preview-priority-copy > p:last-child { margin:16px 0 0; color:#d0daee; line-height:1.7; }
.basic-preview-priority-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.basic-preview-metric { min-height:150px; padding:22px 18px; border:1px solid rgba(255,255,255,.12); border-radius:16px; background:rgba(255,255,255,.07); }
.basic-preview-metric > span { display:block; color:#bfcce4; font-size:12px; font-weight:700; }
.basic-preview-metric strong { display:flex; min-height:52px; margin-top:12px; color:#fff; font-size:23px; line-height:1.25; align-items:center; gap:8px; flex-wrap:wrap; }
.basic-preview-metric strong i { color:#8da1c6; font-size:14px; font-style:normal; }
.basic-preview-metric small { display:block; margin-top:6px; color:#98a9c8; font-size:11px; }
.basic-preview-metric--accent { border-color:rgba(141,176,255,.4); background:rgba(76,121,238,.24); }
.basic-preview-effects,
.basic-preview-combination { padding:38px 40px; border:1px solid #e0e7f3; border-radius:24px; background:#fff; box-shadow:0 18px 50px rgba(50,76,139,.07); }
.basic-preview-section-heading { display:flex; margin-bottom:28px; align-items:flex-end; justify-content:space-between; gap:30px; }
.basic-preview-section-heading h2 { max-width:560px; margin:0; color:#172033; font-size:clamp(24px,3.5vw,34px); line-height:1.28; }
.basic-preview-section-heading > p { max-width:300px; margin:0; color:#728096; font-size:13px; line-height:1.65; text-align:right; }
.basic-preview-effect-list { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:13px; }
.basic-preview-effect-card { min-width:0; padding:20px 17px; border:1px solid #e2e8f2; border-radius:16px; background:#fbfcff; }
.basic-preview-effect-card.is-priority { border-color:#82a5f4; background:#f2f6ff; box-shadow:inset 0 0 0 1px rgba(76,121,238,.12); }
.basic-preview-effect-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; }
.basic-preview-effect-card-head strong { overflow:hidden; color:#334155; font-size:14px; text-overflow:ellipsis; white-space:nowrap; }
.basic-preview-effect-card-head span { padding:3px 7px; border-radius:999px; background:#e8efff; color:#4267c8; font-size:10px; font-weight:800; white-space:nowrap; }
.basic-preview-effect-value { margin:19px 0 13px; color:#1e293b; font-size:27px; font-weight:900; }
.basic-preview-effect-value small { margin-left:3px; color:#718096; font-size:11px; font-weight:700; }
.basic-preview-effect-track { height:7px; overflow:hidden; border-radius:999px; background:#e9eef7; }
.basic-preview-effect-fill { width:var(--effect-width,0%); height:100%; border-radius:inherit; background:linear-gradient(90deg,#4c79ee,#79a1ff); }
.basic-preview-effect-note { min-height:34px; margin:10px 0 0; color:#718096; font-size:11px; line-height:1.45; }
.basic-preview-comparison { display:grid; grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr); gap:16px; align-items:center; }
.basic-preview-comparison-column { padding:22px; border:1px solid #e3e9f3; border-radius:18px; background:#f8fafc; }
.basic-preview-comparison-column--after { border-color:#cbdafa; background:#f1f6ff; }
.basic-preview-comparison-label { display:block; margin-bottom:13px; color:#64748b; font-size:12px; font-weight:800; }
.basic-preview-score-list { display:grid; gap:9px; }
.basic-preview-score-row { display:flex; min-height:40px; padding:0 12px; border-radius:9px; background:#fff; align-items:center; justify-content:space-between; gap:12px; }
.basic-preview-score-row span { overflow:hidden; color:#5d6a7e; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.basic-preview-score-row strong { color:#263247; font-size:15px; }
.basic-preview-score-row.is-changed { background:#dfeaff; }
.basic-preview-score-row.is-changed span,
.basic-preview-score-row.is-changed strong { color:#315bbd; font-weight:800; }
.basic-preview-comparison-arrow { color:#6e8ed8; font-size:28px; font-weight:900; text-align:center; }
.basic-preview-disclaimer { margin:22px 0 0; color:#8490a3; font-size:12px; line-height:1.6; text-align:center; }
.basic-preview-unlock { display:grid; overflow:hidden; border-radius:24px; background:#24385f; color:#fff; box-shadow:0 24px 60px rgba(25,42,77,.18); grid-template-columns:minmax(0,1.2fr) minmax(270px,.8fr); }
.basic-preview-unlock-copy { padding:44px; }
.basic-preview-unlock-badge { display:inline-flex; min-height:28px; padding:0 11px; border-radius:999px; background:#4c79ee; font-size:12px; font-weight:900; align-items:center; }
.basic-preview-unlock h2 { margin:17px 0 12px; font-size:clamp(26px,3.5vw,37px); line-height:1.25; }
.basic-preview-unlock-copy > p { max-width:560px; margin:0; color:#ccd7eb; line-height:1.7; }
.basic-preview-unlock-copy ul { display:grid; margin-top:25px; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px 20px; }
.basic-preview-unlock-copy li { position:relative; padding-left:20px; color:#e4eaf5; font-size:13px; }
.basic-preview-unlock-copy li::before { content:'✓'; position:absolute; left:0; color:#8db0ff; font-weight:900; }
.basic-preview-price-card { display:flex; padding:38px 30px; background:#fff; color:#1f2937; flex-direction:column; justify-content:center; }
.basic-preview-price-card > span { color:#64748b; font-size:13px; font-weight:800; }
.basic-preview-price-card > strong { margin:7px 0 24px; color:#172033; font-size:42px; line-height:1; }
.basic-preview-price-card > strong small { margin-left:4px; font-size:17px; }
.basic-preview-primary-action { display:flex; min-height:52px; padding:0 17px; border-radius:10px; background:#4c79ee; color:#fff; font-size:14px; font-weight:900; align-items:center; justify-content:center; text-align:center; }
.basic-preview-primary-action:hover { background:#3f6ddb; }
.basic-preview-price-card p { margin:11px 0 0; color:#8893a5; font-size:11px; text-align:center; }
.basic-preview-dialog { width:min(calc(100% - 32px),520px); padding:28px; border:0; border-radius:18px; color:#263247; box-shadow:0 30px 90px rgba(15,23,42,.3); }
.basic-preview-dialog::backdrop { background:rgba(15,23,42,.55); }
.basic-preview-dialog-head { display:flex; margin-bottom:20px; align-items:center; justify-content:space-between; }
.basic-preview-dialog-head h2 { margin:0; font-size:24px; }
.basic-preview-dialog-head button { width:40px; height:40px; border-radius:50%; color:#53627a; }
.basic-preview-dialog-head button:hover { background:#eef2f8; }
.basic-preview-dialog ul { display:grid; gap:12px; }
.basic-preview-dialog li { position:relative; padding:12px 14px 12px 38px; border-radius:10px; background:#f6f8fc; color:#53627a; font-size:14px; line-height:1.6; }
.basic-preview-dialog li::before { content:'✓'; position:absolute; left:15px; color:#4c79ee; font-weight:900; }
.basic-preview-page a:focus-visible,
.basic-preview-page button:focus-visible { outline:3px solid rgba(76,121,238,.38); outline-offset:3px; }
@keyframes basic-preview-spin { to { transform:rotate(360deg); } }

@media (max-width:800px) {
.basic-preview-main { padding:108px 18px 72px; }
.basic-preview-priority { padding:32px; grid-template-columns:1fr; gap:26px; }
.basic-preview-effect-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
.basic-preview-unlock { grid-template-columns:1fr; }
.basic-preview-unlock-copy { padding:36px; }
.basic-preview-price-card { padding:30px 36px 36px; }
}

@media (max-width:640px) {
.basic-preview-main { padding:88px 14px 54px; }
.basic-preview-breadcrumb { margin-bottom:23px; font-size:12px; }
.basic-preview-intro { margin-bottom:30px; }
.basic-preview-intro h1 { font-size:34px; }
.basic-preview-intro > p:last-child { font-size:15px; }
.basic-preview-status { min-height:300px; padding:40px 18px; border-radius:18px; }
.basic-preview-status h2 { font-size:22px; }
.basic-preview-target-card { padding:22px; border-radius:17px; align-items:flex-start; flex-direction:column; }
.basic-preview-target-card h2 { font-size:21px; }
.basic-preview-text-button { width:100%; }
.basic-preview-priority { padding:27px 22px; border-radius:18px; }
.basic-preview-priority-metrics { grid-template-columns:1fr; }
.basic-preview-metric { min-height:0; }
.basic-preview-effects,
.basic-preview-combination { padding:28px 20px; border-radius:18px; }
.basic-preview-section-heading { align-items:flex-start; flex-direction:column; gap:12px; }
.basic-preview-section-heading > p { max-width:none; text-align:left; }
.basic-preview-effect-list { grid-template-columns:1fr; }
.basic-preview-effect-card { padding:18px; }
.basic-preview-comparison { grid-template-columns:1fr; }
.basic-preview-comparison-arrow { transform:rotate(90deg); }
.basic-preview-unlock { border-radius:18px; }
.basic-preview-unlock-copy { padding:30px 22px; }
.basic-preview-unlock-copy ul { grid-template-columns:1fr; }
.basic-preview-price-card { padding:28px 22px 30px; }
.basic-preview-primary-action { width:100%; }
}

@media (prefers-reduced-motion:reduce) {
.basic-preview-spinner { animation-duration:1.8s; }
}