:root {
    --sp-bg: #060907;
    --sp-panel: #0c120e;
    --sp-panel-2: #101a13;
    --sp-border: rgba(34, 197, 94, 0.22);
    --sp-green: #22c55e;
    --sp-green-soft: rgba(34, 197, 94, 0.12);
    --sp-text: #e7ece8;
    --sp-muted: #9aa59c;
    --sp-red: #f87171;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    background: radial-gradient(1200px 400px at 70% -10%, rgba(34, 197, 94, 0.08), transparent), var(--sp-bg);
    color: var(--sp-text);
    font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    line-height: 1.5;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.sp-container { width: 100%; max-width: 1060px; margin: 0 auto; padding: 0 16px; }
.sp-main { flex: 1; padding-top: 28px; padding-bottom: 48px; }

a { color: inherit; text-decoration: none; }
.sp-link { color: var(--sp-green); }
.sp-link:hover { text-decoration: underline; }
.sp-muted { color: var(--sp-muted); }
.sp-small { display: block; font-size: 0.82rem; }
.sp-right { text-align: right; }

/* Header / footer */
.sp-header {
    border-bottom: 1px solid var(--sp-border);
    background: rgba(6, 9, 7, 0.92);
    position: sticky;
    top: 0;
    backdrop-filter: blur(8px);
    z-index: 10;
}
.sp-header-inner { display: flex; align-items: center; justify-content: space-between; height: 60px; gap: 12px; }
.sp-logo { font-weight: 700; font-size: 1.15rem; letter-spacing: 0.02em; }
.sp-logo span { color: var(--sp-green); }
.sp-logo-sm { font-size: 1rem; }
.sp-nav { display: flex; align-items: center; gap: 18px; }
.sp-nav-link { color: var(--sp-muted); font-size: 0.95rem; }
.sp-nav-link:hover { color: var(--sp-text); }
.sp-lang { color: var(--sp-muted); font-size: 0.85rem; display: flex; gap: 5px; }
.sp-lang a.active { color: var(--sp-green); font-weight: 600; }

.sp-footer { border-top: 1px solid var(--sp-border); padding: 20px 0; margin-top: 24px; }
.sp-footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; font-size: 0.85rem; }
.sp-footer nav { display: flex; gap: 16px; }
.sp-footer nav a { color: var(--sp-muted); }
.sp-footer nav a:hover { color: var(--sp-text); }

/* Buttons */
.sp-btn {
    display: inline-block;
    border: 1px solid var(--sp-green);
    border-radius: 999px;
    padding: 10px 22px;
    font-weight: 600;
    font-size: 0.95rem;
    cursor: pointer;
    transition: box-shadow 0.15s, transform 0.15s;
}
.sp-btn-sm { padding: 7px 16px; font-size: 0.85rem; }
.sp-btn-primary { background: var(--sp-green); color: #06130a; }
.sp-btn-primary:hover { box-shadow: 0 0 24px rgba(34, 197, 94, 0.45); transform: translateY(-1px); }

/* Cards */
.sp-card {
    background: linear-gradient(160deg, var(--sp-panel-2), var(--sp-panel));
    border: 1px solid var(--sp-border);
    border-radius: 18px;
    padding: 22px;
}
.sp-profile-grid { display: flex; flex-direction: column; gap: 14px; }

/* Hero */
.sp-hero { display: grid; grid-template-columns: 132px 1fr 300px; gap: 22px; align-items: center; }
.sp-hero-logo img, .sp-logo-placeholder {
    width: 132px; height: 132px;
    border-radius: 16px;
    object-fit: contain;
    background: #0a0f0b;
    border: 1px solid var(--sp-border);
}
.sp-logo-placeholder {
    display: flex; align-items: center; justify-content: center;
    font-size: 3rem; font-weight: 700; color: var(--sp-green);
    background: radial-gradient(circle at 30% 30%, rgba(34, 197, 94, 0.25), #0a0f0b);
}
.sp-hero-body h1 { font-size: 1.7rem; margin: 6px 0 4px; }
.sp-badge {
    display: inline-block;
    background: var(--sp-green-soft);
    color: var(--sp-green);
    border: 1px solid var(--sp-green);
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    padding: 3px 10px;
}
.sp-hero-contacts { display: flex; flex-direction: column; gap: 8px; }
.sp-contact-row {
    display: flex; flex-direction: column;
    background: rgba(10, 15, 11, 0.7);
    border: 1px solid var(--sp-border);
    border-radius: 12px;
    padding: 8px 14px;
    font-size: 0.92rem;
    word-break: break-word;
}
.sp-contact-row:hover { border-color: var(--sp-green); }
.sp-contact-label { color: var(--sp-muted); font-size: 0.78rem; }

/* Accordions */
.sp-accordion {
    background: linear-gradient(160deg, var(--sp-panel-2), var(--sp-panel));
    border: 1px solid var(--sp-border);
    border-radius: 16px;
    overflow: hidden;
}
.sp-accordion summary {
    list-style: none;
    cursor: pointer;
    padding: 16px 22px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    font-size: 0.95rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.sp-accordion summary::-webkit-details-marker { display: none; }
.sp-accordion summary::after { content: '+'; color: var(--sp-green); font-size: 1.3rem; font-weight: 400; }
.sp-accordion[open] summary::after { content: '−'; }
.sp-accordion summary:hover { background: var(--sp-green-soft); }
.sp-accordion-body { padding: 4px 22px 18px; }

/* Prices table */
.sp-prices { width: 100%; border-collapse: collapse; font-size: 0.95rem; }
.sp-prices th {
    text-align: left; color: var(--sp-muted);
    font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.06em;
    padding: 8px 10px; border-bottom: 1px solid var(--sp-border);
}
.sp-prices th.sp-right { text-align: right; }
.sp-prices td { padding: 10px; border-bottom: 1px solid rgba(34, 197, 94, 0.08); vertical-align: top; }
.sp-prices tr:last-child td { border-bottom: 0; }
.sp-price { color: var(--sp-green); font-weight: 600; white-space: nowrap; }
.sp-up { color: var(--sp-green); font-size: 0.75rem; }
.sp-down { color: var(--sp-red); font-size: 0.75rem; }

/* Locked / CTA / empty */
.sp-locked { text-align: center; padding: 40px 22px; }
.sp-locked h2 { margin-bottom: 8px; font-size: 1.2rem; }
.sp-locked .sp-btn { margin-top: 16px; }
.sp-empty { text-align: center; color: var(--sp-muted); }
.sp-cta { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.sp-cta h2 { font-size: 1.15rem; margin-bottom: 4px; }

/* Search page */
.sp-search-page h1 { margin-bottom: 18px; font-size: 1.6rem; }
.sp-search-form { display: flex; gap: 10px; margin-bottom: 24px; }
.sp-search-form input {
    flex: 1;
    background: var(--sp-panel);
    border: 1px solid var(--sp-border);
    border-radius: 999px;
    padding: 11px 20px;
    color: var(--sp-text);
    font-size: 1rem;
    outline: none;
}
.sp-search-form input:focus { border-color: var(--sp-green); box-shadow: 0 0 0 3px var(--sp-green-soft); }
.sp-results { display: flex; flex-direction: column; gap: 10px; }
.sp-result { display: flex; align-items: center; gap: 16px; padding: 14px 18px; }
.sp-result:hover { border-color: var(--sp-green); }
.sp-result strong { display: block; }
.sp-result-logo img, .sp-result .sp-logo-placeholder { width: 52px; height: 52px; border-radius: 10px; font-size: 1.4rem; }

/* Responsive */
.sp-mobile-date { display: none; }

@media (max-width: 860px) {
    .sp-mobile-date { display: block; font-size: 0.78rem; font-weight: 400; white-space: nowrap; }
    .sp-hero { grid-template-columns: 96px 1fr; }
    .sp-hero-logo img, .sp-logo-placeholder { width: 96px; height: 96px; }
    .sp-hero-contacts { grid-column: 1 / -1; }
    .sp-hide-mobile { display: none; }
    .sp-nav-link { display: none; }
}