/* ============================================
   Logo palette — Data Phone REPAIR
   Navy #140E3D · Orange #ef7f1b · White #ffffff
   Loads after futuristic.css on every page
   ============================================ */

:root {
    /* Logo core */
    --logo-navy: #140e3d;
    --logo-navy-light: #1c1850;
    --logo-navy-mid: #221c5c;
    --logo-orange: #ef7f1b;
    --logo-orange-light: #f5a04d;
    --logo-orange-dark: #c45f0f;
    --logo-white: #ffffff;

    /* Surfaces (from logo background) */
    --bg-primary: var(--logo-navy);
    --bg-secondary: var(--logo-navy-light);
    --bg-tertiary: var(--logo-navy-mid);
    --surface: #1a1648;

    /* Accents (from logo circuitry) */
    --accent: var(--logo-orange);
    --accent-2: var(--logo-orange-light);
    --accent-3: var(--logo-orange-dark);
    --accent-hover: #f59b3d;
    --accent-light: rgba(239, 127, 27, 0.14);
    --accent-muted: #e8a86a;
    --card-hover: rgba(239, 127, 27, 0.35);
    --shadow-lg: 0 16px 40px rgba(20, 14, 61, 0.45);

    /* Gradients — orange only, no purple/cyan */
    --grad-aurora: linear-gradient(135deg, var(--logo-orange) 0%, var(--logo-orange-light) 50%, var(--logo-orange-dark) 100%);
    --grad-cool: linear-gradient(135deg, var(--logo-orange) 0%, var(--logo-orange-light) 100%);
    --grad-warm: linear-gradient(135deg, var(--logo-orange-dark) 0%, var(--logo-orange) 100%);

    --primary: var(--logo-orange);
    --secondary: #d96f12;
    --accent-color: var(--logo-orange);

    /* Text on navy */
    --text-primary: var(--logo-white);
    --text-secondary: #c8c4d9;
    --text-tertiary: #9490a8;

    --card-bg: rgba(26, 22, 72, 0.85);
    --card-border: rgba(255, 255, 255, 0.1);
    --header-bg: rgba(20, 14, 61, 0.92);
    --footer-bg: var(--logo-navy);
}

body {
    background-color: var(--logo-navy) !important;
    color: var(--text-primary);
}

body::before {
    background:
        radial-gradient(ellipse 70% 45% at 50% -15%, rgba(239, 127, 27, 0.14) 0%, transparent 55%),
        linear-gradient(180deg, var(--logo-navy) 0%, var(--logo-navy-light) 100%) !important;
}

/* Site chrome — same on all pages including [data-brand] */
.phone-btn,
.btn-primary,
[data-brand] .phone-btn,
[data-brand] .btn-primary,
[data-brand] .brand-cta .btn-primary {
    background: var(--logo-orange) !important;
    background-image: none !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
    color: var(--logo-white) !important;
}

.phone-btn:hover,
.btn-primary:hover,
[data-brand] .phone-btn:hover,
[data-brand] .btn-primary:hover,
[data-brand] .brand-cta .btn-primary:hover {
    background: var(--accent-hover) !important;
    color: var(--logo-white) !important;
}

[data-brand] .stat-number,
.stat-number {
    color: var(--logo-orange) !important;
    -webkit-text-fill-color: var(--logo-orange) !important;
}

[data-brand] .live-dot,
.live-dot {
    background: var(--logo-orange) !important;
    box-shadow: 0 0 10px rgba(239, 127, 27, 0.65) !important;
}

[data-brand] .step-number {
    background: var(--grad-cool) !important;
}

[data-brand] .brand-cta .footer-cta {
    background: var(--logo-navy-light) !important;
    border: 1px solid var(--card-border);
}

[data-brand] .brand-cta .footer-cta h2,
[data-brand] .brand-cta .footer-cta p {
    color: var(--logo-white) !important;
}

.phone-btn { box-shadow: 0 4px 14px rgba(20, 14, 61, 0.4); }
.phone-btn:hover { box-shadow: 0 6px 20px rgba(239, 127, 27, 0.35); }

.hero-eyebrow {
    background: rgba(239, 127, 27, 0.1);
    border-color: rgba(239, 127, 27, 0.28);
    color: var(--accent-muted);
    box-shadow: none;
}

.btn-primary {
    box-shadow: 0 4px 14px rgba(20, 14, 61, 0.35);
}

.btn-primary:hover {
    box-shadow: 0 6px 20px rgba(239, 127, 27, 0.35);
}

.btn-link { color: var(--accent-muted); }
.hero-image img { box-shadow: 0 12px 40px rgba(20, 14, 61, 0.5); }

.stat-item:hover {
    border-color: rgba(239, 127, 27, 0.35);
    box-shadow: none;
}

.feature-item::before,
.service-card::before,
.case-card::before,
.pricing-card::before,
.why-us-item::before,
.contact-card::before {
    background: radial-gradient(600px circle at var(--mx, 50%) var(--my, 50%),
                rgba(239, 127, 27, 0.12), transparent 40%);
}

.feature-item:hover,
.service-card:hover,
.case-card:hover,
.testimonial-card:hover,
.pricing-card:hover,
.why-us-item:hover,
.contact-card:hover,
.brand-card:hover {
    border-color: rgba(239, 127, 27, 0.3);
    box-shadow: 0 8px 24px rgba(20, 14, 61, 0.35);
}

.btn-outline:hover {
    background: rgba(239, 127, 27, 0.08);
    border-color: rgba(239, 127, 27, 0.4);
}

a { color: var(--logo-orange); }
a:hover { color: var(--logo-orange-light); }

.feature-icon,
.service-icon {
    background: rgba(239, 127, 27, 0.1);
    border-color: rgba(239, 127, 27, 0.25);
    box-shadow: none;
}

.feature-icon svg,
.service-icon svg,
.guarantee-icon svg { color: var(--accent-muted); }

.step-number { box-shadow: 0 4px 12px rgba(20, 14, 61, 0.4); }

.pricing-card-featured {
    background: rgba(239, 127, 27, 0.06);
    border-color: rgba(239, 127, 27, 0.35);
    box-shadow: none;
}

.pricing-badge { box-shadow: 0 2px 8px rgba(239, 127, 27, 0.4); }

.service-card-featured {
    background: rgba(239, 127, 27, 0.06);
    border-color: rgba(239, 127, 27, 0.35);
}

.service-badge {
    background: var(--logo-orange) !important;
    background-image: none !important;
    box-shadow: none;
}

.tech-card:hover { border-color: rgba(239, 127, 27, 0.3); }

.blog-card:hover {
    border-color: rgba(239, 127, 27, 0.3);
    box-shadow: 0 8px 24px rgba(20, 14, 61, 0.35);
}

.blog-category {
    color: var(--accent-muted);
    background: rgba(239, 127, 27, 0.1);
}

.blog-read { color: var(--logo-orange-light); }

.form-field select:focus,
.form-field input:focus,
.form-field textarea:focus {
    border-color: var(--logo-orange);
    box-shadow: 0 0 0 3px rgba(239, 127, 27, 0.15);
}

.file-label:hover { background: rgba(239, 127, 27, 0.05); }

.faq-item summary:hover,
.faq-item[open] summary { color: var(--accent-muted); }

::-webkit-scrollbar-thumb { background: rgba(239, 127, 27, 0.35); }
::-webkit-scrollbar-thumb:hover { background: rgba(239, 127, 27, 0.55); }

.logo-text {
    background: none !important;
    -webkit-text-fill-color: var(--logo-white) !important;
    color: var(--logo-white) !important;
}

@media (max-width: 900px) {
    .logo-text { display: none; }
    .header-actions .phone-btn--secondary { display: none; }
}

.sticky-call-bar {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 900;
    padding: 10px 12px;
    background: rgba(20, 14, 61, 0.96);
    border-top: 1px solid var(--card-border);
    backdrop-filter: blur(16px);
    gap: 8px;
}

.sticky-call-bar a {
    flex: 1;
    text-align: center;
    padding: 12px;
    border-radius: 980px;
    font-weight: 600;
    font-size: 14px;
}

.sticky-call-bar .btn-primary { display: block; }

@media (max-width: 768px) {
    .sticky-call-bar { display: flex; }
    body { padding-bottom: 72px; }
}

.form-status {
    font-size: 14px;
    color: var(--logo-orange);
    margin-top: 8px;
    text-align: center;
}