:root {
            --bg: #f6f8fc;
            --white: #ffffff;
            --dark: #101828;
            --muted: #667085;
            --line: #e4e7ec;
            --blue: #2563eb;
            --blue-dark: #1d4ed8;
            --cyan: #06b6d4;
            --green: #16a34a;
            --orange: #f97316;
            --radius: 26px;
            --shadow: 0 24px 70px rgba(16, 24, 40, .12);
        }

        * { box-sizing: border-box; margin: 0; padding: 0; }
        html { scroll-behavior: smooth; }
        body {
            font-family: 'Manrope', Arial, sans-serif;
            background: var(--bg);
            color: var(--dark);
            line-height: 1.65;
        }
        a { color: inherit; text-decoration: none; }
        .container {
            width: min(1350px, calc(100% - 36px));
            margin: 0 auto;
        }

        .topbar {
            background: #f6f8fc;
            color: #0f172a;
            font-size: 14px;
        }
        .topbar .container {
            min-height: 42px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 20px;
        }
        .topbar strong { color: #0f172a; }

        .navbar {
            position: sticky;
            top: 0;
            z-index: 20;
            background: rgba(255,255,255,.82);
            backdrop-filter: blur(18px);
            border-bottom: 1px solid rgba(228,231,236,.85);
        }
        .nav-inner {
            min-height: 82px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 28px;
        }
        .brand {
            display: flex;
            align-items: center;
            gap: 12px;
            font-weight: 700;
            font-size: 24px;
            letter-spacing: -.04em;
        }
        .brand-logo {
            width: 48px;
            height: 48px;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            filter: drop-shadow(0 14px 22px rgba(37,99,235,.22));
        }
        .brand-logo svg {
            width: 48px;
            height: 48px;
            display: block;
        }
        .brand-text {
            background: linear-gradient(135deg, #0f172a, #2563eb);
            -webkit-background-clip: text;
            color: transparent;
        }
        .nav-menu {
            display: flex;
            align-items: center;
            gap: 30px;
            color: var(--muted);
            font-weight: 700;
            font-size: 13px;
        }
        .nav-menu a:hover { color: var(--blue); }
        .nav-actions {
            display: flex;
            align-items: center;
            gap: 12px;
        }
        .mobile-menu-btn {
            display: none;
            width: 42px;
            height: 42px;
            border-radius: 14px;
            border: 1px solid var(--line);
            background: #fff;
            color: #0f172a;
            font-size: 22px;
            cursor: pointer;
            box-shadow: 0 10px 22px rgba(16,24,40,.06);
        }
        .mobile-menu {
            display: none;
            position: absolute;
            left: 18px;
            right: 18px;
            top: 76px;
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 22px;
            padding: 12px;
            box-shadow: 0 24px 70px rgba(16,24,40,.14);
        }
        .mobile-menu a {
            display: block;
            padding: 14px 16px;
            border-radius: 14px;
            color: #0f172a;
            font-weight: 800;
        }
        .mobile-menu a:hover {
            background: #eff6ff;
            color: var(--blue);
        }
        .mobile-menu.open {
            display: block;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            min-height: 42px;
            padding: 0 18px;
            border-radius: 16px;
            font-weight: 800;
            border: 1px solid transparent;
            transition: .2s ease;
        }
        .btn-primary {
            color: #fff;
            background: var(--blue);
            box-shadow: 0 16px 28px rgba(37,99,235,.22);
        }
        .btn-primary:hover { background: var(--blue-dark); transform: translateY(-2px); }
        .btn-light {
            background: #fff;
            border-color: var(--line);
            color: var(--dark);
        }
        .btn-light:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(16,24,40,.08); }

        .hero {
            position: relative;
            padding: 80px 0 70px;
            overflow: hidden;
        }
        .hero::before {
            content: '';
            position: absolute;
            width: 760px;
            height: 760px;
            right: -280px;
            top: -260px;
            border-radius: 50%;
            background: radial-gradient(circle, rgba(37,99,235,.18), transparent 68%);
        }
        .hero-grid {
            position: relative;
            display: grid;
            grid-template-columns: 1fr .88fr;
            gap: 64px;
            align-items: center;
        }
        .pill {
            display: inline-flex;
            align-items: center;
            gap: 9px;
            padding: 9px 14px;
            border-radius: 10px;
            color: var(--blue);
            background: #eff6ff;
            border: 1px solid #bfdbfe;
            font-weight: 800;
            font-size: 14px;
            margin-bottom: 22px;
        }
        h1 {
            font-size: clamp(34px, 4vw, 56px);
            line-height: 1.08;
            letter-spacing: -.045em;
            font-weight: 700;
            max-width:1100px;
        }
        .hero-text {
            margin-top:0;
            max-width:1100px;
            color: var(--muted);
            font-size: 19px;
        }
        .hero-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 14px;
            margin-top: 34px;
        }
        .hero-note {
            margin-top: 20px;
            color: var(--muted);
            font-size: 14px;
        }
        .hero-note strong { color: var(--dark); }

        .dashboard-card {
            position: relative;
            background: var(--white);
            border: 1px solid var(--line);
            border-radius: 34px;
            box-shadow: var(--shadow);
            padding: 22px;
        }
        .dashboard-top {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 10px 8px 20px;
            border-bottom: 1px solid var(--line);
        }
        .dots { display: flex; gap: 8px; }
        .dots span { width: 11px; height: 11px; border-radius: 999px; background: #cbd5e1; }
        .status {
            color: var(--green);
            background: #ecfdf3;
            border: 1px solid #bbf7d0;
            padding: 7px 11px;
            border-radius: 999px;
            font-size: 13px;
            font-weight: 800;
        }
        .server-visual {
            padding: 26px 8px 8px;
        }
        .server-row {
            display: grid;
            grid-template-columns: 52px 1fr auto;
            gap: 15px;
            align-items: center;
            padding: 18px;
            border-radius: 20px;
            background: #f8fafc;
            border: 1px solid var(--line);
            margin-bottom: 14px;
        }
        .server-icon {
            width: 52px;
            height: 52px;
            border-radius: 16px;
            display: grid;
            place-items: center;
            color: #fff;
            background: linear-gradient(135deg, var(--blue), var(--cyan));
            font-size: 24px;
        }
        .server-row h3 { font-size: 14px; margin-bottom: 3px; }
        .server-row p { color: var(--muted); font-size: 12px; }
        .server-row strong { color: var(--blue); }
        .speed-box {
            margin-top: 20px;
            padding: 24px;
            border-radius: 24px;
            color: #ebf4ff;
            background: linear-gradient(135deg, #0f172a, #1e3a8a);
            overflow: hidden;
            position: relative;
        }
        .speed-box::after {
            content: '';
            position: absolute;
            width: 180px;
            height: 180px;
            right: -70px;
            top: -70px;
            background: rgba(255,255,255,.12);
            border-radius: 50%;
        }
        .speed-box small { color: #ebf4ff; font-weight: 700; }
        .speed-box h2 { color: #ebf4ff; font-size: 46px; color: #ebf4ff;  line-height: 1; margin-top: 8px; letter-spacing: -.06em; }


        /* Servere online - card mai clar și mai vizibil */
        .online-server-card {
            overflow: hidden;
            background:
                radial-gradient(circle at top right, rgba(6,182,212,.16), transparent 34%),
                radial-gradient(circle at 8% 0%, rgba(37,99,235,.14), transparent 30%),
                var(--white);
        }
        .server-card-title {
            display: flex;
            align-items: center;
            gap: 12px;
        }
        .server-card-title span:not(.live-dot) {
            display: block;
            color: var(--muted);
            font-size: 12px;
            font-weight: 800;
            text-transform: uppercase;
            letter-spacing: .08em;
            line-height: 1.1;
        }
        .server-card-title strong {
            display: block;
            color: var(--dark);
            font-size: 18px;
            letter-spacing: -.03em;
            line-height: 1.25;
        }
        .live-dot {
            width: 14px;
            height: 14px;
            border-radius: 999px;
            background: var(--green);
            box-shadow: 0 0 0 8px rgba(22,163,74,.12), 0 0 26px rgba(22,163,74,.55);
            flex: 0 0 auto;
        }
        .status-online {
            color: #047857;
            background: linear-gradient(135deg, #dcfce7, #ecfeff);
            border-color: rgba(22,163,74,.28);
            box-shadow: 0 10px 24px rgba(22,163,74,.12);
        }
        .server-summary {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 12px;
            margin-bottom: 16px;
        }
        .server-summary > div {
            padding: 18px;
            border-radius: 22px;
            background: linear-gradient(145deg, #ffffff, #f1f7ff);
            border: 1px solid rgba(37,99,235,.10);
            box-shadow: 0 14px 34px rgba(16,24,40,.06);
        }
        .server-summary small {
            display: block;
            color: var(--muted);
            font-size: 12px;
            font-weight: 800;
            margin-bottom: 4px;
        }
        .server-summary strong {
            color: var(--blue);
            font-size: 30px;
            line-height: 1;
            letter-spacing: -.06em;
        }
        .server-row.enhanced {
            grid-template-columns: 54px 1fr auto;
            background: rgba(255,255,255,.86);
            border-color: rgba(37,99,235,.12);
            box-shadow: 0 16px 36px rgba(16,24,40,.055);
        }
        .server-copy h4 {
            font-size: 15px;
            line-height: 1.2;
            margin-bottom: 3px;
        }
        .server-bar {
            display: block;
            height: 7px;
            margin-top: 10px;
            border-radius: 999px;
            background: #e2e8f0;
            overflow: hidden;
        }
        .server-bar i {
            display: block;
            height: 100%;
            border-radius: inherit;
            background: linear-gradient(90deg, var(--blue), var(--cyan));
        }
        .speed-box-modern {
            background:
                linear-gradient(135deg, rgba(15,23,42,.98), rgba(29,78,216,.96)),
                linear-gradient(135deg, var(--blue), var(--cyan));
        }
        .speed-box-modern p {
            position: relative;
            z-index: 1;
            color: #dbeafe;
            font-size: 13px;
            margin-top: 10px;
            max-width: 300px;
        }



        /* Servere online - variantă mai compactă, cu aceleași elemente */
        .online-server-card {
            border-radius: 28px;
            padding: 18px;
        }
        .online-server-card .dashboard-top {
            padding: 6px 4px 14px;
        }
        .online-server-card .server-card-title {
            gap: 10px;
        }
        .online-server-card .server-card-title strong {
            font-size: 16px;
        }
        .online-server-card .status-online {
            padding: 6px 10px;
            font-size: 12px;
        }
        .online-server-card .live-dot {
            width: 12px;
            height: 12px;
            box-shadow: 0 0 0 6px rgba(22,163,74,.12), 0 0 20px rgba(22,163,74,.48);
        }
        .online-server-card .server-visual {
            padding: 18px 2px 2px;
        }
        .online-server-card .server-summary {
            gap: 10px;
            margin-bottom: 12px;
        }
        .online-server-card .server-summary > div {
            padding: 14px;
            border-radius: 18px;
        }
        .online-server-card .server-summary small {
            font-size: 11px;
        }
        .online-server-card .server-summary strong {
            font-size: 25px;
        }
        .online-server-card .server-row.enhanced {
            grid-template-columns: 46px 1fr auto;
            gap: 12px;
            padding: 13px;
            margin-bottom: 10px;
            border-radius: 17px;
        }
        .online-server-card .server-icon {
            width: 46px;
            height: 46px;
            border-radius: 14px;
            font-size: 21px;
        }
        .online-server-card .server-copy h4 {
            font-size: 14px;
            margin-bottom: 2px;
        }
        .online-server-card .server-copy p {
            font-size: 11.5px;
            line-height: 1.35;
        }
        .online-server-card .server-bar {
            height: 6px;
            margin-top: 8px;
        }
        .online-server-card .server-row.enhanced > strong {
            font-size: 13px;
        }



        .logos {
            background: #ffffff;
            padding: 24px 0 42px;
        }
        .logos-panel {
            display: flex;
            align-items: center;
            gap: 18px;
            padding: 14px;
            border: 1px solid #e5e7eb;
            border-radius: 28px;
            background: #ffffff;
            box-shadow: 0 18px 42px rgba(15, 23, 42, .055);
        }
        .logos-label {
            flex: 0 0 auto;
            min-width: 150px;
            display: grid;
            place-items: center;
            align-self: stretch;
            padding: 16px 18px;
            border-radius: 20px;
            background: #f8fafc;
            border: 1px solid #e5e7eb;
        }
        .logos-label span {
            color: #0f172a;
            font-size: 12px;
            line-height: 1.1;
            font-weight: 900;
            letter-spacing: .08em;
            text-transform: uppercase;
            text-align: center;
        }
        .logos-box {
            flex: 1;
            display: grid;
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 10px;
        }
        .logo-chip {
            min-height: 78px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 10px;
            padding: 12px 14px;
            text-align: center;
            background: #ffffff;
            border: 1px solid transparent;
            border-radius: 18px;
            transition: transform .2s ease, background .2s ease, border-color .2s ease;
        }
        .logo-chip:hover {
            transform: translateY(-2px);
            background: #f8fafc;
            border-color: #e5e7eb;
        }
        .logo-icon {
            width: 100%;
            height: 40px;
            display: grid;
            place-items: center;
            color: #2563eb;
        }
        .logo-icon svg {
            width: min(145px, 100%);
            height: 38px;
            display: block;
        }
        .logo-text {
            display: none;
        }

        @media (max-width: 980px) {
            .logos-panel {
                flex-direction: column;
                align-items: stretch;
            }
            .logos-label {
                min-width: 0;
                align-self: auto;
                padding: 12px 16px;
            }
            .logos-box {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
            .logo-chip {
                min-height: 86px;
            }
        }
        @media (max-width: 560px) {
            .logos {
                padding: 18px 0 32px;
            }
            .logos-panel {
                padding: 10px;
                border-radius: 22px;
                gap: 10px;
            }
            .logos-box {
                grid-template-columns: 1fr;
                gap: 8px;
            }
            .logo-chip {
                min-height: 92px;
                border: 1px solid #e5e7eb;
                border-radius: 16px;
            }
            .logo-icon {
                height: 58px;
            }
            .logo-icon svg {
                width: min(230px, 95%);
                height: 54px;
            }
        }

        section { padding: 76px 0; }
        .section-head {
            max-width:1100px;
            margin: 0 auto 44px;
            text-align: center;
        }
        .section-head h2 {
            font-size: 24px;
            line-height: 1.05;
            letter-spacing: -.06em;
            margin-bottom: 16px;
        }
        .section-head p {
            color: var(--muted);
            font-size: 18px;
        }

        .features-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 22px;
        }
        .feature-card {
            background: #fff;
            border: 1px solid var(--line);
            border-radius: var(--radius);
            padding: 28px;
            box-shadow: 0 16px 38px rgba(16,24,40,.06);
            transition: .2s ease;
        }
        .feature-card:hover {
            transform: translateY(-6px);
            box-shadow: 0 24px 60px rgba(16,24,40,.1);
        }
        .feature-icon {
            width: 54px;
            height: 54px;
            border-radius: 17px;
            display: grid;
            place-items: center;
            color: var(--blue);
            background: #eff6ff;
            font-size: 24px;
            margin-bottom: 20px;
        }
        .feature-card h3 { font-size: 19px; margin-bottom: 10px; letter-spacing: -.02em; }
        .feature-card p { color: var(--muted); font-size: 15px; }

        .plans-section {
            background: #fff;
            border-block: 1px solid var(--line);
        }
        .plans-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 18px;
        }
        .plan-card {
            position: relative;
            padding: 30px;
            border-radius: 30px;
            border: 1px solid var(--line);
            background: #fff;
            box-shadow: 0 16px 40px rgba(16,24,40,.06);
        }
        .plan-card.highlight {
            background: #0f172a;
            color: #fff;
            border-color: #0f172a;
            transform: translateY(-12px);
            box-shadow: 0 30px 80px rgba(15,23,42,.24);
        }
        .tag {
            display: inline-flex;
            padding: 8px 12px;
            border-radius: 999px;
            background: #eff6ff;
            color: var(--blue);
            font-size: 13px;
            font-weight: 800;
            margin-bottom: 20px;
        }
        .highlight .tag {
            background: rgba(255,255,255,.12);
            color: #93c5fd;
        }
        .plan-card h3 { font-size: 24px; letter-spacing: -.04em; }
        .price { margin: 18px 0 24px; }
        .old-price {
            display: block;
            color: var(--muted);
            text-decoration: line-through;
            font-weight: 800;
            margin-bottom: 3px;
        }
        .highlight .old-price { color: #94a3b8; }
        .price strong { font-size: 42px; letter-spacing: -.06em; }
        .price span { color: var(--muted); font-weight: 700; }
        .highlight .price span { color: #cbd5e1; }
        .plan-list {
            list-style: none;
            display: grid;
            gap: 13px;
            margin-bottom: 28px;
        }
        .plan-list li {
            display: flex;
            gap: 10px;
            color: var(--muted);
            font-weight: 600;
        }
        .highlight .plan-list li { color: #e2e8f0; }
        .plan-list li::before {
            content: '✓';
            color: var(--green);
            font-weight: 900;
        }
        .highlight .btn-primary { background: #fff; color: #0f172a; box-shadow: none;
            margin-top: auto; }
        .highlight .btn-primary:hover { background: #e0f2fe; }

        .support-section {
            padding: 90px 0;
            background: #F6F8FC;
            color: #0f172a;
            overflow: hidden;
        }
        .support-box {
            display: grid;
            grid-template-columns: 1fr .9fr;
            gap: 60px;
            align-items: center;
        }
        .support-badge {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 9px 18px;
            border-radius: 10px;
            border: 1px solid #f59e0b;
            color: #0f172a;
            font-size: 13px;
            font-weight: 900;
            text-transform: uppercase;
            margin-bottom: 22px;
        }
        .support-content h2 {
            font-size: clamp(26px, 3vw, 36px);
            line-height: 1.08;
            letter-spacing: -.045em;
            margin-bottom: 22px;
        }
        .support-content p {
            color: #667085;
            font-size: 15px;
            max-width:1100px;
        }
        .support-cards {
            display: grid;
            gap: 14px;
            margin: 34px 0 28px;
            max-width:1100px;
        }
        .support-card {
            display: grid;
            grid-template-columns: 56px 1fr 42px;
            gap: 18px;
            align-items: center;
            padding: 14px 18px;
            border-radius: 12px;
            background: #ffffff;
            border: 1px solid var(--line);
            box-shadow: 0 14px 34px rgba(16,24,40,.06);
        }
        .support-icon {
            width: 56px;
            height: 56px;
            display: grid;
            place-items: center;
            border-radius: 7px;
            background: #eff6ff;
            color: var(--blue);
            font-size: 28px;
        }
        .support-card span {
            display: block;
            color: #667085;
            font-size: 14px;
        }
        .support-card strong {
            display: block;
            color: #0f172a;
            font-size: 18px;
            line-height: 1.2;
        }
        .support-arrow {
            width: 40px;
            height: 40px;
            display: grid;
            place-items: center;
            border-radius: 50%;
            border: 1px solid rgba(255,255,255,.85);
            font-size: 22px;
        }
        .support-ticket {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 14px 24px;
            border-radius: 6px;
            background: #ffffff;
            color: #0f172a;
            font-size: 15px;
            font-weight: 800;
            margin-bottom: 24px;
        }
        .support-note {
            color: #667085;
            font-size: 14px;
        }
        .support-note b {
            color: #fbbf24;
        }
        .support-visual {
            position: relative;
            min-height: 430px;
            display: grid;
            place-items: center;
        }
        .support-shape {
            position: absolute;
            width: 520px;
            height: 310px;
            border-radius: 42% 58% 45% 55% / 46% 35% 65% 54%;
            background: linear-gradient(135deg, #f59e0b, #fb923c);
            transform: rotate(-8deg);
            box-shadow: 0 34px 60px rgba(0,0,0,.18);
        }
        .support-person {
            position: relative;
            z-index: 2;
            width: min(430px, 90%);
            height: 430px;
            border-radius: 45% 55% 42% 58% / 36% 32% 68% 64%;
            background:
                radial-gradient(circle at 62% 38%, rgba(255,255,255,.55), transparent 18%),
                linear-gradient(145deg, #f8fafc, #cbd5e1 45%, #64748b);
            border: 10px solid rgba(255,255,255,.12);
            display: grid;
            place-items: center;
            overflow: hidden;
        }
        .support-person::before {
            content: '👨‍💻';
            font-size: 160px;
            filter: drop-shadow(0 18px 22px rgba(0,0,0,.22));
        }
        .support-plus, .support-ring, .support-line {
            position: absolute;
            z-index: 3;
            color: #fb923c;
            font-weight: 900;
        }
        .support-plus.one { top: 62px; right: 130px; font-size: 40px; }
        .support-plus.two { bottom: 68px; right: 30px; font-size: 38px; }
        .support-ring { right: 66px; top: 170px; width: 42px; height: 42px; border: 11px solid #fb923c; border-radius: 50%; }
        .support-line { left: 42px; top: 118px; width: 130px; height: 28px; border-radius: 999px; background: rgba(255,255,255,.9); transform: rotate(-45deg); }

        .hosting-plans-grid {
            align-items: stretch;
            gap: 28px;
        }

        .hosting-plan {
            position: relative;
            display: flex;
            flex-direction: column;
            border-radius: 12px;
            overflow: hidden;
            background: linear-gradient(180deg, #ffffff, #f8fbff);
            border: 1px solid rgba(37,99,235,.08);
            box-shadow: 0 24px 70px rgba(16,24,40,.08);
            transition: .28s ease;
        }

        .hosting-plan:hover {
            transform: translateY(-10px);
            box-shadow: 0 34px 90px rgba(37,99,235,.14);
            border-color: rgba(37,99,235,.18);
        }

        .hosting-plan.recommended {
            background: linear-gradient(180deg, #0f172a, #172554);
            border-color: rgba(96,165,250,.3);
            box-shadow: 0 34px 90px rgba(15,23,42,.28);
        }

        .recommended-bar {
            position: absolute;
            top: 18px;
            right: 18px;
            padding: 8px 14px;
            border-radius: 999px;
            background: #fbbf24;
            color: #1f1438;
            font-size: 12px;
            font-weight: 900;
            z-index: 3;
        }

        .hosting-plan-inner {
            padding: 34px 28px 28px;
            display: flex;
            flex-direction: column;
            height: 100%;
        }

        .hosting-plan h3 {
            font-size: 55px;
            letter-spacing: -.07em;
            margin-bottom: 16px;
            color: #0f172a;
        }

        .hosting-plan.recommended h3 {
            color: #fff;
        }

        .hosting-plan h3 span {
            font-size: 22px;
            letter-spacing: 0;
            font-weight: 800;
            opacity: .7;
        }

        .discount-badge {
            display: inline-flex;
            align-items: center;
            gap: 7px;
            width: fit-content;
            padding: 8px 12px;
            border-radius: 999px;
            background: #eff6ff;
            color: #1e3a8a;
            font-size: 12px;
            font-weight: 800;
            margin-bottom: 24px;
        }

        .hosting-plan.recommended .discount-badge {
            background: rgba(255,255,255,.12);
            color: #bfdbfe;
        }

        .hosting-price {
            display: flex;
            align-items: flex-end;
            gap: 10px;
            margin-bottom: 28px;
        }

        .hosting-price .old-price {
            color: #94a3b8;
            text-decoration: line-through;
            font-weight: 800;
            font-size: 16px;
            padding-bottom: 8px;
        }

        .price-separator {
            width: 1px;
            height: 42px;
            background: rgba(148,163,184,.45);
        }

        .hosting-price strong {
            font-size: 52px;
            line-height: .9;
            letter-spacing: -.08em;
            color: #0f172a;
        }

        .hosting-plan.recommended .hosting-price strong {
            color: #fff;
        }

        .hosting-price span:last-child {
            font-size: 15px;
            font-weight: 800;
            padding-bottom: 6px;
            color: #64748b;
        }

        .hosting-plan.recommended .hosting-price span:last-child {
            color: #cbd5e1;
        }

        .hosting-desc {
            color: #64748b;
            font-size: 14px;
            line-height: 1.8;
            min-height: 86px;
            margin-bottom: 28px;
        }

        .hosting-plan.recommended .hosting-desc {
            color: #dbeafe;
        }

        .hosting-specs {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 14px;
            margin-bottom: 28px;
        }

        .hosting-specs div {
            padding: 14px;
            border-radius: 12px;
            background: #f8fafc;
            border: 1px solid #e2e8f0;
        }

        .hosting-plan.recommended .hosting-specs div {
            background: rgba(255,255,255,.08);
            border-color: rgba(255,255,255,.08);
        }

        .hosting-specs span {
            display: block;
            color: #64748b;
            font-size: 12px;
            margin-bottom: 6px;
        }

        .hosting-plan.recommended .hosting-specs span {
            color: #cbd5e1;
        }

        .hosting-specs strong {
            display: block;
            color: #0f172a;
            font-size: 16px;
            font-weight: 900;
            line-height: 1.3;
        }

        .hosting-plan.recommended .hosting-specs strong {
            color: #fff;
        }

        .hosting-system {
            padding: 18px 0;
            border-top: 1px solid #e2e8f0;
        }

        .hosting-plan.recommended .hosting-system {
            border-color: rgba(255,255,255,.08);
        }

        .hosting-system strong {
            display: block;
            color: #0f172a;
            font-size: 14px;
            font-weight: 900;
            margin-bottom: 4px;
        }

        .hosting-plan.recommended .hosting-system strong {
            color: #fff;
        }

        .hosting-system small {
            color: #64748b;
            font-size: 12px;
        }

        .hosting-plan.recommended .hosting-system small {
            color: #cbd5e1;
        }

        .hosting-benefits {
            list-style: none;
            display: grid;
            gap: 12px;
            margin: 30px 0;
            min-height: 220px;
        }

        .hosting-benefits li {
            display: flex;
            align-items: center;
            gap: 10px;
            color: #475569;
            font-size: 14px;
            font-weight: 600;
        }

        .hosting-plan.recommended .hosting-benefits li {
            color: #e2e8f0;
        }

        .hosting-benefits .yes,
        .hosting-benefits .no {
            width: 22px;
            height: 22px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            font-size: 12px;
            font-weight: 900;
        }

        .hosting-benefits .yes {
            background: rgba(16,185,129,.12);
            color: #10b981;
        }

        .hosting-benefits .no {
            background: rgba(239,68,68,.12);
            color: #ef4444;
        }

        

        .hosting-order-btn {
            width: 100%;
            min-height: 50px;
            border-radius: 12px;
            background: linear-gradient(135deg, #2563eb, #06b6d4);
            color: #fff;
            font-weight: 900;
            margin-top: auto;
            box-shadow: 0 16px 32px rgba(37,99,235,.22);
        }



        .hosting-order-btn.order-basic {
            background: linear-gradient(135deg, #2563eb, #06b6d4);
        }

        .hosting-order-btn.order-personal {
            background: linear-gradient(135deg, #2563eb, #06b6d4);
        }

        .hosting-order-btn.order-plus {
            background: #fff;
            color: #0f172a;
            box-shadow: none;
        }

        .hosting-order-btn.order-business {
            background: linear-gradient(135deg, #2563eb, #06b6d4);
        }

        .hosting-order-btn:hover {
            transform: translateY(-2px);
        }

        .hosting-plan.recommended .hosting-order-btn {
            background: #fff;
            color: #0f172a;
            box-shadow: none;
        }

        .wp-note {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
            margin-top: 18px;
            color: #64748b;
            font-size: 12px;
            font-weight: 800;
        }

        .hosting-plan.recommended .wp-note {
            color: #cbd5e1;
        }

        .wp-note b {
            width: 18px;
            height: 18px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            background: #2563eb;
            color: #fff;
            font-size: 10px;
        }

        .promo-note {
            text-align: center;
            margin-top: 28px;
            color: #475569;
            font-size: 13px;
        }

        .split {
            display: grid;
            grid-template-columns: .9fr 1.1fr;
            gap: 44px;
            align-items: center;
        }
        .split h2 {
            font-size: clamp(32px, 4vw, 54px);
            line-height: 1.05;
            letter-spacing: -.06em;
            margin-bottom: 18px;
        }
        .split p { color: var(--muted); font-size: 18px; }
        .check-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 16px;
        }
        .check-item {
            background: #fff;
            border: 1px solid var(--line);
            border-radius: 22px;
            padding: 22px;
        }
        .check-item strong { display: block; margin-bottom: 6px; }
        .check-item span { color: var(--muted); font-size: 14px; }

        .faq-showcase {
            position: relative;
            padding: 96px 0;
            background:
                radial-gradient(circle at 15% 15%, rgba(37,99,235,.10), transparent 28%),
                radial-gradient(circle at 85% 75%, rgba(6,182,212,.10), transparent 30%),
                linear-gradient(180deg, #f8fbff 0%, #eef4fb 100%);
            overflow: hidden;
        }

        .faq-showcase::before,
        .faq-showcase::after {
            content: '';
            position: absolute;
            border-radius: 999px;
            pointer-events: none;
        }

        .faq-showcase::before {
            width: 420px;
            height: 420px;
            left: -180px;
            top: 90px;
            background: rgba(37,99,235,.08);
            filter: blur(20px);
        }

        .faq-showcase::after {
            width: 520px;
            height: 520px;
            right: -260px;
            bottom: -260px;
            background: rgba(6,182,212,.10);
            filter: blur(24px);
        }

        .faq-showcase .container {
            position: relative;
            z-index: 2;
        }

        .faq-showcase-head {
            max-width:1100px;
            margin: 0 auto 34px;
            text-align: center;
        }

        .faq-badge {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 34px;
            padding: 0 18px;
            border-radius: 999px;
            background: rgba(239,246,255,.85);
            border: 1px solid #bfdbfe;
            color: #2563eb;
            font-size: 14px;
            font-weight: 800;
            box-shadow: 0 12px 28px rgba(37,99,235,.08);
            margin-bottom: 20px;
        }

        .faq-showcase-head h2 {
            color: #071225;
            font-size: clamp(36px, 5vw, 64px);
            line-height: .98;
            letter-spacing: -.075em;
            font-weight: 900;
            margin-bottom: 18px;
        }

        .faq-title-line {
            display: block;
            width: 100px;
            height: 7px;
            border-radius: 999px;
            margin: 0 auto 22px;
            background: linear-gradient(90deg, #2563eb, #06b6d4);
            box-shadow: 0 12px 24px rgba(37,99,235,.20);
        }

        .faq-showcase-head p {
            color: #475569;
            font-size: 19px;
            line-height: 1.7;
            max-width:1100px;
            margin: 0 auto;
        }

        .faq-benefits {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 18px;
            margin: 34px auto 24px;
            max-width:1100px;
        }

        .faq-benefit-card {
            display: flex;
            align-items: center;
            gap: 18px;
            min-height: 94px;
            padding: 18px 22px;
            border-radius: 18px;
            background: rgba(255,255,255,.78);
            border: 1px solid rgba(203,213,225,.80);
            box-shadow: 0 18px 45px rgba(15,23,42,.06);
            backdrop-filter: blur(16px);
            transition: .25s ease;
        }

        .faq-benefit-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 24px 60px rgba(37,99,235,.12);
            border-color: rgba(37,99,235,.18);
        }

        .faq-benefit-icon {
            flex: 0 0 64px;
            width: 64px;
            height: 64px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            font-size: 28px;
        }

        .faq-benefit-icon.blue {
            color: #2563eb;
            background: linear-gradient(135deg, #dbeafe, #eff6ff);
        }

        .faq-benefit-icon.green {
            color: #10b981;
            background: linear-gradient(135deg, #ccfbf1, #ecfdf5);
        }

        .faq-benefit-icon.purple {
            color: #8b5cf6;
            background: linear-gradient(135deg, #ede9fe, #f5f3ff);
        }

        .faq-benefit-icon.yellow {
            color: #f59e0b;
            background: linear-gradient(135deg, #fef3c7, #fff7ed);
        }

        .faq-benefit-card strong {
            display: block;
            color: #0f172a;
            font-size: 17px;
            line-height: 1.2;
            margin-bottom: 5px;
            font-weight: 900;
        }

        .faq-benefit-card small {
            display: block;
            color: #475569;
            font-size: 14px;
            line-height: 1.4;
        }

        .faq-help-text {
            text-align: center;
            color: #334155;
            font-size: 18px;
            margin: 6px 0 34px;
        }

        .faq-help-text a {
            color: #2563eb;
            font-weight: 800;
            text-decoration: underline;
            text-underline-offset: 4px;
        }

        .faq-accordion {
            max-width:1100px;
            margin: 0 auto;
            display: grid;
            gap: 14px;
        }

        .faq-accordion-item {
            overflow: hidden;
            border-radius: 18px;
            background: rgba(255,255,255,.90);
            border: 1px solid rgba(203,213,225,.80);
            box-shadow: 0 16px 42px rgba(15,23,42,.07);
            transition: .25s ease;
        }

        .faq-accordion-item:hover {
            transform: translateY(-2px);
            box-shadow: 0 22px 60px rgba(15,23,42,.10);
        }

        .faq-accordion-item.active {
            border-color: rgba(37,99,235,.16);
            box-shadow: 0 24px 70px rgba(37,99,235,.12);
        }

        .faq-accordion-question {
            width: 100%;
            min-height: 76px;
            padding: 20px 28px;
            background: transparent;
            border: 0;
            cursor: pointer;
            display: grid;
            grid-template-columns: 52px 1fr 30px;
            align-items: center;
            gap: 18px;
            color: #0f172a;
            text-align: left;
            font-family: inherit;
            font-size: 18px;
            font-weight: 900;
        }

        .faq-question-icon {
            width: 46px;
            height: 46px;
            border-radius: 50%;
            display: grid;
            place-items: center;
            color: #fff;
            font-size: 20px;
            font-weight: 900;
            box-shadow: 0 14px 30px rgba(37,99,235,.22);
        }

        .faq-question-icon.icon-1 {
            background: linear-gradient(135deg, #3b82f6, #2563eb);
        }

        .faq-question-icon.icon-2 {
            background: linear-gradient(135deg, #bbf7d0, #22c55e);
            color: #16a34a;
            box-shadow: 0 14px 30px rgba(34,197,94,.18);
        }

        .faq-question-icon.icon-3 {
            background: linear-gradient(135deg, #ede9fe, #8b5cf6);
            color: #7c3aed;
            box-shadow: 0 14px 30px rgba(139,92,246,.18);
        }

        .faq-question-icon.icon-4 {
            background: linear-gradient(135deg, #fed7aa, #fb6a3a);
            box-shadow: 0 14px 30px rgba(249,115,22,.18);
        }

        .faq-question-icon.icon-5 {
            background: linear-gradient(135deg, #bfdbfe, #0ea5e9);
            box-shadow: 0 14px 30px rgba(14,165,233,.18);
            font-family: Georgia, serif;
        }

        .faq-chevron {
            justify-self: end;
            display: grid;
            place-items: center;
            width: 30px;
            height: 30px;
            color: #020617;
            font-size: 28px;
            line-height: 1;
            transition: .25s ease;
        }

        .faq-accordion-item.active .faq-chevron {
            transform: rotate(180deg);
        }

        .faq-accordion-answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height .38s ease;
        }

        .faq-accordion-answer p {
            margin: 0 14px 14px;
            padding: 30px 34px;
            border-radius: 12px;
            background: linear-gradient(135deg, #f1f5ff, #f8fbff);
            color: #334155;
            font-size: 16px;
            line-height: 1.85;
        }

        .faq-accordion-item.active .faq-accordion-answer {
            max-height: 260px;
        }


        .cta {
            padding: 84px 0;
        }
        .cta-box {
            position: relative;
            overflow: hidden;
            text-align: center;
            border-radius: 38px;
            padding: 68px 24px;
            color: #fff;
            background: linear-gradient(135deg, #2563eb, #0891b2);
            box-shadow: 0 30px 80px rgba(37,99,235,.25);
        }
        .cta-box::before,
        .cta-box::after {
            content: '';
            position: absolute;
            width: 260px;
            height: 260px;
            border-radius: 50%;
            background: rgba(255,255,255,.13);
        }
        .cta-box::before { left: -90px; top: -90px; }
        .cta-box::after { right: -90px; bottom: -90px; }
        .cta-box h2 {
            position: relative;
            font-size: clamp(34px, 5vw, 62px);
            line-height: 1;
            letter-spacing: -.065em;
            margin-bottom: 18px;
        }
        .cta-box p {
            position: relative;
            color: #dff6ff;
            max-width:1100px;
            margin: 0 auto 30px;
            font-size: 18px;
        }
        .cta-box .btn-light { position: relative; color: #0f172a; }

        footer {
            padding: 34px 0;
            border-top: 1px solid var(--line);
            color: var(--muted);
            background: #fff;
        }
        .footer-inner {
            display: flex;
            justify-content: space-between;
            gap: 20px;
            flex-wrap: wrap;
            font-size: 14px;
        }

        @media (max-width:1100px) {
            .hosting-desc,
            .hosting-benefits {
                min-height: auto;
            }
            .hero-grid, .split, .support-box { grid-template-columns: 1fr; }
            .features-grid, .plans-grid, .logos-box, .faq-grid { grid-template-columns: repeat(2, 1fr); }
            .plan-card.highlight { transform: none; }
        }
        @media (max-width:1100px) {

            section {
                padding: 52px 0;
            }
            .nav-inner .btn-primary {
                display: none;
            }
            .mobile-menu-btn {
                display: grid;
                place-items: center;
            }
            .topbar .container { justify-content: center; text-align: center; }
            .topbar span:last-child, .nav-menu { display: none; }
            .nav-inner { min-height: 74px; }
            .hero { padding: 56px 0 46px; }
            .features-grid, .plans-grid, .logos-box, .check-grid, .faq-grid { grid-template-columns: 1fr; }
            .server-row { grid-template-columns: 44px 1fr; }
            .server-row strong { grid-column: 2; }
            .dashboard-card { border-radius: 26px; padding: 16px; }
            .support-section { padding: 64px 0; }
            .support-visual { min-height: 320px; }
            .support-shape { width: 330px; height: 220px; }
            .support-person { width: 290px; height: 290px; }
            .support-person::before { font-size: 110px; }
            .support-card { grid-template-columns: 48px 1fr; }
            .support-arrow { display: none; }
            .support-card strong { font-size: 18px; word-break: break-word; }
            .cta-box { border-radius: 28px; padding: 50px 20px; }
        }


@media (max-width:1100px) {
            .faq-benefits {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        @media (max-width:1100px) {
            .faq-showcase {
                padding: 64px 0;
            }

            .faq-showcase-head h2 {
                font-size: 38px;
            }

            .faq-showcase-head p {
                font-size: 16px;
            }

            .faq-benefits {
                grid-template-columns: 1fr;
            }

            .faq-benefit-card {
                min-height: 86px;
            }

            .faq-accordion-question {
                grid-template-columns: 46px 1fr 24px;
                gap: 14px;
                padding: 18px;
                font-size: 16px;
            }

            .faq-question-icon {
                width: 42px;
                height: 42px;
                font-size: 18px;
            }

            .faq-accordion-answer p {
                margin: 0 10px 10px;
                padding: 22px;
                font-size: 15px;
            }
        }





/* ===== UNIFORM TYPOGRAPHY SYSTEM ===== */

body{
    font-size:16px;
    line-height:1.7;
    font-weight:500;
}

h1{
    font-size:56px !important;
    line-height:1.1 !important;
    font-weight:800 !important;
    letter-spacing:-0.04em;
}

h2{
    font-size:42px !important;
    line-height:1.15 !important;
    font-weight:800 !important;
    letter-spacing:-0.04em;
}

h3{
    font-size:26px !important;
    line-height:1.3 !important;
    font-weight:700 !important;
}

h4{
    font-size:20px !important;
    line-height:1.4 !important;
    font-weight:700 !important;
}

p{
    font-size:17px !important;
    line-height:1.8 !important;
    color:#64748b;
}

.hero-text,
.section-head p,
.hosting-desc,
.check-item span,
.faq-answer p,
.footer-brand p{
    font-size:17px !important;
    line-height:1.9 !important;
}

.btn{
    font-size:15px !important;
    font-weight:800 !important;
}

.nav-menu a,
.footer-links a{
    font-size:15px !important;
    font-weight:700 !important;
}

.hosting-price strong{
    font-size:54px !important;
}

.faq-question{
    font-size:20px !important;
    font-weight:800 !important;
}

@media(max-width:1100px){

    h1{
        font-size:42px !important;
    }

    h2{
        font-size:32px !important;
    }

    h3{
        font-size:22px !important;
    }

    p{
        font-size:16px !important;
    }

}


/* ===== ALL TITLES COLOR ===== */
h1,
h2,
h3,
h4,
h5,
h6,
.section-head h2,
.hero h1,
.plan-card h3,
.hosting-plan h3,
.faq-question,
.footer-brand h3,
.footer-links h4,
.footer-contact h4{
    color:#282B2E !important;
}


/* 14ms alb */
.speed-box h2{
    color:#ffffff !important;
}


/* Plus SSD text alb */
.hosting-plan.recommended h3,
.hosting-plan.recommended h3 span{
    color:#ffffff !important;
}


.brand-wrap{
    display:flex;
    flex-direction:column;
    line-height:1.1;
}

.brand-sub{
    font-size:11px;
    font-weight:700;
    color:#64748b;
    margin-top:2px;
    letter-spacing:.04em;
}


/* Modern Simple FAQ */
.faq-showcase {
    padding: 100px 0;
    background: #f8fafc;
}

.faq-simple-layout {
    max-width:1100px;
}

.faq-showcase-head {
    text-align: center;
    margin-bottom: 40px;
}

.faq-badge {
    display: inline-flex;
    padding: 8px 18px;
    border-radius: 999px;
    background: rgba(59,130,246,.1);
    color: #2563eb;
    font-weight: 600;
    margin-bottom: 16px;
}

.faq-showcase-head h2 {
    font-size: 42px;
    margin-bottom: 12px;
}

.faq-showcase-head p {
    color: #64748b;
    font-size: 17px;
}

.faq-accordion {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.faq-accordion-item {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    overflow: hidden;
    transition: all .25s ease;
}

.faq-accordion-item.active {
    border-color: rgba(59,130,246,.25);
    box-shadow: 0 10px 30px rgba(15,23,42,.06);
}

.faq-accordion-question {
    width: 100%;
    border: none;
    background: transparent;
    padding: 24px 28px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
}

.faq-chevron {
    font-size: 28px;
    color: #2563eb;
    transition: transform .2s ease;
}

.faq-accordion-item.active .faq-chevron {
    transform: rotate(45deg);
}

.faq-accordion-answer {
    padding: 0 28px 24px;
    color: #64748b;
    line-height: 1.7;
}

/* ===== CONTACT PAGE ===== */
.nav-menu a.active-link {
    color: var(--blue);
}

.contact-hero {
    position: relative;
    padding: 90px 0 60px;
    overflow: hidden;
    background: linear-gradient(180deg, #f6f8fc 0%, #ffffff 100%);
}

.contact-hero::before {
    content: '';
    position: absolute;
    width: 620px;
    height: 620px;
    right: -220px;
    top: -220px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(37,99,235,.16), transparent 68%);
}

.contact-hero-grid {
    position: relative;
    display: grid;
    grid-template-columns: 1fr .72fr;
    gap: 24px;
    align-items: center;
}

.contact-status-card {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 34px;
    padding: 34px;
    box-shadow: var(--shadow);
}

.contact-live {
    display: inline-flex;
    padding: 8px 13px;
    border-radius: 999px;
    background: #ecfdf3;
    border: 1px solid #bbf7d0;
    color: var(--green);
    font-size: 13px;
    font-weight: 800;
    margin-bottom: 18px;
}

.contact-status-card h3 {
    margin-bottom: 10px;
}

.contact-mini-list {
    display: grid;
    gap: 12px;
    margin-top: 24px;
}

.contact-mini-list span {
    padding: 14px 16px;
    border-radius: 16px;
    background: #f8fafc;
    color: #0f172a;
    font-weight: 800;
}

.contact-section {
    padding: 50px 0 110px;
    background: #fff;
}

.contact-card-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 34px;
}

.contact-info-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    padding: 26px;
    transition: .2s ease;
}

.contact-info-card:hover {
    transform: translateY(-4px);
    background: #fff;
    box-shadow: 0 18px 40px rgba(15,23,42,.08);
    border-color: rgba(37,99,235,.22);
}

.contact-info-icon {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 17px;
    background: #eff6ff;
    color: var(--blue);
    font-size: 22px;
    margin-bottom: 18px;
}

.contact-info-card span {
    display: block;
    color: var(--muted);
    font-size: 14px;
    font-weight: 800;
    margin-bottom: 4px;
}

.contact-info-card strong {
    display: block;
    color: #0f172a;
    font-size: 20px;
    margin-bottom: 8px;
}

.contact-info-card p {
    margin: 0;
}

.contact-panel {
    display: grid;
    grid-template-columns: 1fr .45fr;
    gap: 28px;
    align-items: stretch;
}

.contact-form-box,
.contact-side-box {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 30px;
    padding: 34px;
}

.contact-form-box h2 {
    margin-bottom: 12px;
}

.modern-contact-form {
    display: grid;
    gap: 18px;
    margin-top: 26px;
}

.form-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 18px;
}

.modern-contact-form label {
    display: grid;
    gap: 9px;
    color: #0f172a;
    font-weight: 800;
}

.modern-contact-form input,
.modern-contact-form textarea {
    width: 100%;
    border: 1px solid #dbe3ef;
    border-radius: 16px;
    background: #fff;
    padding: 15px 16px;
    font: inherit;
    color: #0f172a;
    outline: none;
    transition: .2s ease;
}

.modern-contact-form textarea {
    resize: vertical;
    min-height: 150px;
}

.modern-contact-form input:focus,
.modern-contact-form textarea:focus {
    border-color: rgba(37,99,235,.55);
    box-shadow: 0 0 0 4px rgba(37,99,235,.08);
}

.contact-submit {
    width: fit-content;
    min-width: 190px;
    border: none;
    cursor: pointer;
}

.contact-side-box {
    background: linear-gradient(135deg, #0f172a, #1d4ed8);
    color: #fff;
    overflow: hidden;
    position: relative;
}

.contact-side-box::after {
    content: '';
    position: absolute;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    right: -70px;
    bottom: -70px;
    background: rgba(255,255,255,.12);
}

.contact-side-box h3,
.contact-side-box p {
    color: #fff !important;
    position: relative;
    z-index: 1;
}

.contact-side-box .support-ticket,
.contact-hours {
    position: relative;
    z-index: 1;
}

.contact-hours {
    display: grid;
    gap: 8px;
    margin-top: 26px;
    padding-top:0;
    border-top: 1px solid rgba(255,255,255,.18);
}

.contact-hours span {
    color: rgba(255,255,255,.78);
    font-weight: 700;
}

@media(max-width:1100px) {
    .contact-hero-grid,
    .contact-panel {
        grid-template-columns: 1fr;
    }

    .contact-card-grid {
        grid-template-columns: 1fr;
    }
}

@media(max-width:1100px) {
    .contact-hero {
        padding: 62px 0 56px;
    }

    .contact-section {
        padding: 54px 0 76px;
    }

    .contact-status-card,
    .contact-form-box,
    .contact-side-box,
    .contact-info-card {
        border-radius: 22px;
        padding: 24px;
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    .contact-submit {
        width: 100%;
    }
}

/* ===== MODERN PERFORMANCE SECTION ===== */
.performance-section{
    position:relative;
    overflow:hidden;
    padding:100px 0;
    background:
        radial-gradient(circle at 12% 18%, rgba(37,99,235,.14), transparent 30%),
        radial-gradient(circle at 88% 75%, rgba(6,182,212,.13), transparent 34%),
        linear-gradient(180deg, #ffffff 0%, #f7fbff 100%) !important;
}

.performance-section::before{
    content:'';
    position:absolute;
    inset:28px;
    border:1px solid rgba(37,99,235,.08);
    border-radius:38px;
    pointer-events:none;
}

.performance-layout{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:.88fr 1.12fr;
    gap:56px;
    align-items:center;
}

.performance-content{
    max-width:1100px;
}

.performance-pill{
    box-shadow:0 14px 34px rgba(37,99,235,.10);
}

.performance-content h2{
    font-size:clamp(22px,2.2vw,34px) !important;
    line-height:1.02 !important;
    letter-spacing:-.065em !important;
    margin-bottom:22px;
    color:#071225 !important;
}

.performance-content p{
    max-width:1100px;
    color:#64748b !important;
    font-size:18px !important;
    line-height:1.85 !important;
}

.performance-stats{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
    margin-top:34px;
}

.performance-stats div{
    padding:22px;
    border-radius:24px;
    background:rgba(255,255,255,.78);
    border:1px solid rgba(203,213,225,.8);
    box-shadow:0 20px 50px rgba(15,23,42,.07);
    backdrop-filter:blur(14px);
}

.performance-stats strong{
    display:block;
    font-size:38px;
    line-height:1;
    letter-spacing:-.06em;
    color:#2563eb;
    margin-bottom:8px;
}

.performance-stats span{
    display:block;
    color:#64748b;
    font-size:13px;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.04em;
}

.performance-panel{
    position:relative;
    padding:20px;
    border-radius:34px;
    background:rgba(255,255,255,.72);
    border:1px solid rgba(203,213,225,.82);
    box-shadow:0 30px 80px rgba(15,23,42,.10);
    backdrop-filter:blur(18px);
}

.performance-panel::before{
    content:'';
    position:absolute;
    width:160px;
    height:160px;
    right:-48px;
    top:-48px;
    border-radius:50%;
    background:linear-gradient(135deg, rgba(37,99,235,.18), rgba(6,182,212,.14));
}

.performance-cards-grid{
    position:relative;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:16px;
}

.performance-card{
    position:relative;
    display:flex;
    gap:16px;
    align-items:flex-start;
    min-height:160px;
    padding:22px;
    border-radius:24px;
    background:#ffffff;
    border:1px solid rgba(226,232,240,.95);
    box-shadow:0 16px 42px rgba(15,23,42,.06);
    transition:.25s ease;
}

.performance-card:hover{
    transform:translateY(-6px);
    border-color:rgba(37,99,235,.24);
    box-shadow:0 24px 60px rgba(37,99,235,.12);
}

.performance-card.featured{
    min-height:unset;
    margin-bottom:16px;
    align-items:center;
    color:#fff;
    background:linear-gradient(135deg, #0f172a 0%, #1d4ed8 64%, #06b6d4 100%);
    border-color:rgba(255,255,255,.18);
    box-shadow:0 26px 70px rgba(37,99,235,.22);
}

.performance-icon{
    flex:0 0 52px;
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    border-radius:18px;
    background:linear-gradient(135deg, #2563eb, #06b6d4);
    color:#fff;
    font-size:22px;
    box-shadow:0 14px 28px rgba(37,99,235,.20);
}

.performance-card.featured .performance-icon{
    background:rgba(255,255,255,.16);
    box-shadow:none;
}

.performance-card strong{
    display:block;
    color:#0f172a;
    font-size:18px;
    line-height:1.25;
    letter-spacing:-.03em;
    margin-bottom:8px;
}

.performance-card span{
    display:block;
    color:#64748b;
    font-size:14px;
    line-height:1.7;
}

.performance-card.featured strong,
.performance-card.featured span{
    color:#fff;
}

.performance-card.featured span{
    opacity:.82;
}

@media(max-width:1100px){
    .performance-section{
        padding:76px 0;
    }

    .performance-layout{
        grid-template-columns:1fr;
        gap:34px;
    }

    .performance-content{
        max-width:100%;
        text-align:left;
    }
}

@media(max-width:1100px){
    .performance-section{
        padding:58px 0;
    }

    .performance-section::before{
        inset:14px;
        border-radius:28px;
    }

    .performance-content h2{
        font-size:24px !important;
    }

    .performance-stats,
    .performance-cards-grid{
        grid-template-columns:1fr;
    }

    .performance-panel{
        padding:14px;
        border-radius:26px;
    }

    .performance-card{
        min-height:unset;
        padding:20px;
        border-radius:20px;
    }
}


.footer{
background:#0b1120;
padding:80px 0 30px;
color:#fff;
margin-top:0;
}
.footer-container{
max-width:1250px;
margin:auto;
padding:0 24px;
}
.footer-grid{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:50px;
margin-bottom:50px;
}
.footer-logo{
font-size:34px;
font-weight:800;
margin-bottom:20px;
}
.footer-desc{
color:rgba(255,255,255,.7);
line-height:1.7;
}
.footer-title{
font-size:20px;
margin-bottom:20px;
}
.footer-links{
list-style:none;
padding:0;
}
.footer-links li{
margin-bottom:12px;
}
.footer-links a{
color:rgba(255,255,255,.7);
text-decoration:none;
}
.footer-links a:hover{
color:#fff;
}
.footer-bottom{
border-top:1px solid #e5e7eb !important;
padding-top:20px;
padding-bottom:0px;
display:flex;
justify-content:space-between;
flex-wrap:wrap;
gap:20px;
}
.footer-bottom-links{
display:flex;
gap:20px;
}
@media(max-width:991px){
.footer-grid{
grid-template-columns:1fr 1fr;
}
}
@media(max-width:768px){
.footer-grid{
grid-template-columns:1fr;
}
.footer-bottom{
flex-direction:column;
text-align:center;
}
}


/* White Footer */
.footer{
    background:#ffffff !important;
    color:#111111 !important;
    border-top:1px solid #e5e7eb;
}

.footer *{
    color:#111111 !important;
}

.footer-desc,
.footer-links a,
.footer-bottom,
.footer-bottom-links a{
    color:#333333 !important;
}

.footer-links a:hover,
.footer-bottom-links a:hover{
    color:#000000 !important;
}


.footer-bottom p {
    margin:  20px 0 20px;
}


/* Cookie consent + Cookie policy */
.cookie-consent{
    position:fixed;
    left:0;
    right:0;
    bottom:20px;
    z-index:9999;
    padding:0 18px;
    pointer-events:none;
}
.cookie-consent[hidden],
.cookie-preferences[hidden]{
    display:none !important;
}
.cookie-consent-card{
    pointer-events:auto;
    transform:translateZ(0);
    width:min(1040px,100%);
    margin:0 auto;
    background:rgba(255,255,255,.98);
    color:#0b1220;
    border:1px solid #d7e3f4;
    border-radius:26px;
    box-shadow:none;
    padding:18px;
    display:grid;
    grid-template-columns:56px minmax(0,1fr) auto;
    gap:16px;
    align-items:center;
}
.cookie-consent-icon{
    width:56px;
    height:56px;
    border-radius:18px;
    display:grid;
    place-items:center;
    background:#f0f7ff;
    border:1px solid #cfe1ff;
    font-size:27px;
    line-height:1;
}
.cookie-consent-text{
    min-width:0;
}
.cookie-consent-kicker{
    display:inline-flex;
    align-items:center;
    margin-bottom:5px;
    padding:4px 9px;
    border-radius:999px;
    background:#edf5ff;
    border:1px solid #cfe1ff;
    color:#1d4ed8;
    font-size:12px;
    line-height:1;
    font-weight:900;
    letter-spacing:.04em;
    text-transform:uppercase;
}
.cookie-consent-text strong{
    display:block;
    font-size:22px;
    line-height:1.15;
    margin-bottom:6px;
    color:#0b1220;
    letter-spacing:-.03em;
}
.cookie-consent-text p{
    margin:0 0 7px;
    color:#334155;
    font-size:14.8px;
    line-height:1.55;
    max-width:690px;
}
.cookie-consent-text a,
.policy-card a{
    color:#1d4ed8;
    font-weight:900;
    text-decoration:none;
    border-bottom:1px solid currentColor;
}
.cookie-consent-text a:hover,
.policy-card a:hover{
    color:#0f3ea8;
}
.cookie-consent-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:9px;
    min-width:168px;
}
.cookie-btn,
.cookie-consent-actions .btn,
.cookie-preferences .btn{
    min-height:44px;
    border-radius:14px;
    padding:0 18px;
    box-shadow:none !important;
    transform:none !important;
    font-weight:900 !important;
    border:1px solid transparent;
    letter-spacing:-.01em;
}
.cookie-btn:hover,
.cookie-btn:focus,
.cookie-consent-actions .btn:hover,
.cookie-preferences .btn:hover{
    box-shadow:none !important;
    transform:none !important;
}
.cookie-btn-primary,
.cookie-consent-actions .cookie-btn-primary,
.cookie-preferences .cookie-btn-primary{
    background:#1458f5;
    border-color:#1458f5;
    color:#ffffff;
}
.cookie-btn-primary:hover,
.cookie-consent-actions .cookie-btn-primary:hover,
.cookie-preferences .cookie-btn-primary:hover{
    background:#0f46c7;
    border-color:#0f46c7;
    color:#ffffff;
}
.cookie-btn-outline,
.cookie-consent-actions .cookie-btn-outline{
    background:#ffffff;
    border-color:#b8c9e3;
    color:#0b1220;
}
.cookie-btn-outline:hover,
.cookie-consent-actions .cookie-btn-outline:hover{
    background:#eef6ff;
    border-color:#7aa7f7;
    color:#0f46c7;
}
.cookie-btn-ghost,
.cookie-consent-actions .cookie-btn-ghost{
    background:#f7f9fc;
    border-color:#e2e8f0;
    color:#475569;
}
.cookie-btn-ghost:hover,
.cookie-consent-actions .cookie-btn-ghost:hover{
    background:#f1f5f9;
    border-color:#cbd5e1;
    color:#0b1220;
}
.cookie-preferences{
    grid-column:2 / -1;
    border-top:1px solid #e2e8f0;
    padding-top:14px;
    margin-top:2px;
    display:grid;
    grid-template-columns:repeat(3,minmax(120px,1fr)) auto;
    gap:10px;
    align-items:center;
}
.cookie-preferences label{
    display:flex;
    align-items:center;
    gap:10px;
    min-height:46px;
    padding:0 13px;
    border:1px solid #dbe5f2;
    border-radius:14px;
    background:#f8fbff;
    font-weight:900;
    color:#0b1220;
}
.cookie-preferences input{
    width:17px;
    height:17px;
    accent-color:#1458f5;
}
.policy-hero{
    padding:80px 0 30px;
    background:linear-gradient(180deg,#eff6ff 0%,#ffffff 100%);
}
.policy-container{
    max-width:900px;
}
.policy-hero h1{
    font-size:46px;
    margin:16px 0 10px;
}
.policy-section{
    padding:40px 0 90px;
}
.policy-card{
    background:#ffffff;
    border:1px solid #e5e7eb;
    border-radius:28px;
    box-shadow:0 18px 45px rgba(15,23,42,.08);
    padding:38px;
}
.policy-card h2{
    margin-top:28px;
    margin-bottom:12px;
}
.policy-card h2:first-child{
    margin-top:0;
}
.policy-card h3{
    margin-top:20px;
    margin-bottom:8px;
}
.policy-card p{
    color:#4b5563;
    line-height:1.75;
}
@media(max-width:900px){
    .cookie-consent-card{
        grid-template-columns:48px minmax(0,1fr);
    }
    .cookie-consent-icon{
        width:48px;
        height:48px;
        border-radius:16px;
        font-size:24px;
        align-self:start;
    }
    .cookie-consent-actions{
        grid-column:1 / -1;
        grid-template-columns:1fr 1fr 1fr;
        min-width:0;
    }
    .cookie-preferences{
        grid-column:1 / -1;
        grid-template-columns:1fr 1fr;
    }
    .cookie-preferences .cookie-btn-primary{
        grid-column:1 / -1;
    }
}
@media(max-width:600px){
    .cookie-consent{
        bottom:10px;
        padding:0 10px;
    }
    .cookie-consent-card{
        grid-template-columns:1fr;
        padding:15px;
        gap:12px;
        border-radius:22px;
    }
    .cookie-consent-icon{
        display:none;
    }
    .cookie-consent-kicker{
        font-size:11px;
    }
    .cookie-consent-text strong{
        font-size:20px;
    }
    .cookie-consent-text p{
        font-size:14px;
    }
    .cookie-consent-actions,
    .cookie-preferences{
        grid-template-columns:1fr;
    }
    .cookie-btn,
    .cookie-consent-actions .btn,
    .cookie-preferences .btn{
        width:100%;
        justify-content:center;
        min-height:46px;
    }
    .policy-hero h1{
        font-size:34px;
    }
    .policy-card{
        padding:24px;
    }
}

/* Secure contact form feedback */
.form-alert {
    margin: 18px 0;
    padding: 14px 16px;
    border-radius: 16px;
    font-weight: 700;
    border: 1px solid transparent;
}
.form-alert-success {
    color: #14532d;
    background: #dcfce7;
    border-color: #86efac;
}
.form-alert-error {
    color: #7f1d1d;
    background: #fee2e2;
    border-color: #fecaca;
}
.hp-field {
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}



/* === Global Typography Update === */
p {
    font-size: 16px !important;
    line-height: 1.7;
}

h1 {
    font-size: 38px !important;
}

h2 {
    font-size: 28px !important;
}

h3 {
    font-size: 20px !important;
}

h4 {
    font-size: 18px !important;
}

h5 {
    font-size: 16px !important;
}

h6 {
    font-size: 14px !important;
}



/* === First Container Title/Description Spacing === */
.container h1,
.container h2,
.container h3 {
    margin-bottom: 20px !important;
}




/* Simplified FAQ background */
.faq,
.faq-section,
#faq {
    background: #f6f8fc !important;
    background-image: none !important;
    box-shadow: none !important;
    border: none !important;
}


/* =========================================================
   Pachete gazduire - design modern, simplu si curat
   ========================================================= */

#pachete.plans-section,
.plans-section{
    background: transparent !important;
    background-image: none !important;
    border-block: 0 !important;
}

#pachete.plans-section::before,
#pachete.plans-section::after,
.plans-section::before,
.plans-section::after{
    display: none !important;
    content: none !important;
    background: none !important;
}

#pachete .section-head{
    max-width: 760px;
    margin: 0 auto 42px;
    text-align: center;
}

#pachete .section-head h2{
    font-size: clamp(30px, 4vw, 48px);
    line-height: 1.05;
    letter-spacing: -0.04em;
    color: #0f172a;
    margin-bottom: 12px;
}

#pachete .section-head p{
    color: #64748b;
    font-size: 17px;
    line-height: 1.7;
}

.hosting-plans-grid,
.plans-grid.hosting-plans-grid{
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 20px !important;
    align-items: stretch;
    background: transparent !important;
}

.hosting-plan{
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 24px !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: none !important;
    transition: border-color .22s ease, transform .22s ease, background .22s ease !important;
}

.hosting-plan::before{
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 4px;
    background: linear-gradient(90deg, #2563eb, #06b6d4);
    opacity: .95;
}

.hosting-plan:hover{
    transform: translateY(-6px) !important;
    border-color: #bfdbfe !important;
    box-shadow: none !important;
}

.hosting-plan.recommended{
    background: #0f172a !important;
    border-color: #1d4ed8 !important;
    color: #ffffff;
    transform: none !important;
    box-shadow: none !important;
}

.hosting-plan.recommended:hover{
    transform: translateY(-6px) !important;
    border-color: #38bdf8 !important;
    box-shadow: none !important;
}

.hosting-plan.recommended::before{
    background: linear-gradient(90deg, #60a5fa, #22d3ee);
}

.hosting-plan-inner{
    padding: 28px 24px 24px !important;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.recommended-bar{
    position: absolute !important;
    top: 18px !important;
    right: 18px !important;
    z-index: 4;
    padding: 7px 12px !important;
    border-radius: 999px !important;
    background: #facc15 !important;
    color: #111827 !important;
    font-size: 11px !important;
    line-height: 1;
    font-weight: 900 !important;
    letter-spacing: .02em;
    box-shadow: none !important;
}

.hosting-plan h3{
    margin: 10px 0 16px !important;
    color: #111827 !important;
    font-size: 24px !important;
    line-height: 1.15 !important;
    letter-spacing: -0.03em !important;
}

.hosting-plan.recommended h3{
    color: #ffffff !important;
    padding-right: 120px;
}

.hosting-plan h3 span{
    display: inline-flex;
    align-items: center;
    padding: 4px 9px;
    margin-left: 5px;
    border-radius: 999px;
    background: #eff6ff;
    color: #2563eb;
    font-size: 12px !important;
    letter-spacing: .03em !important;
    font-weight: 900 !important;
    opacity: 1 !important;
    vertical-align: middle;
}

.hosting-plan.recommended h3 span{
    background: rgba(255,255,255,.12);
    color: #bfdbfe;
}

.discount-badge{
    width: fit-content;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    margin-bottom: 22px !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
    color: #1e3a8a !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.hosting-plan.recommended .discount-badge{
    background: rgba(255,255,255,.08) !important;
    border-color: rgba(255,255,255,.12) !important;
    color: #dbeafe !important;
}

.hosting-price{
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
    margin: 0 0 20px !important;
    padding-bottom: 20px;
    border-bottom: 1px solid #e5e7eb;
}

.hosting-plan.recommended .hosting-price{
    border-color: rgba(255,255,255,.12);
}

.hosting-price .old-price{
    order: 1;
    color: #94a3b8 !important;
    text-decoration: line-through;
    font-size: 14px !important;
    font-weight: 700 !important;
    padding-bottom: 0 !important;
}

.price-separator{
    display: none !important;
}

.hosting-price strong{
    order: 2;
    color: #0f172a !important;
    font-size: clamp(38px, 4vw, 48px) !important;
    line-height: .95 !important;
    letter-spacing: -0.06em !important;
    font-weight: 900 !important;
}

.hosting-plan.recommended .hosting-price strong{
    color: #ffffff !important;
}

.hosting-price span:last-child{
    order: 3;
    color: #64748b !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    padding-bottom: 0 !important;
}

.hosting-plan.recommended .hosting-price span:last-child{
    color: #cbd5e1 !important;
}

.hosting-desc{
    min-height: auto !important;
    margin-bottom: 22px !important;
    color: #64748b !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
}

.hosting-plan.recommended .hosting-desc{
    color: #dbeafe !important;
}

.hosting-specs{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px !important;
    margin-bottom: 22px !important;
}

.hosting-specs div{
    padding: 12px !important;
    border-radius: 16px !important;
    background: #f8fafc !important;
    border: 1px solid #e5e7eb !important;
}

.hosting-plan.recommended .hosting-specs div{
    background: rgba(255,255,255,.07) !important;
    border-color: rgba(255,255,255,.10) !important;
}

.hosting-specs span{
    color: #64748b !important;
    font-size: 11px !important;
    margin-bottom: 5px !important;
}

.hosting-plan.recommended .hosting-specs span{
    color: #cbd5e1 !important;
}

.hosting-specs strong{
    color: #111827 !important;
    font-size: 14px !important;
    font-weight: 900 !important;
}

.hosting-plan.recommended .hosting-specs strong{
    color: #ffffff !important;
}

.hosting-system{
    padding: 14px 0 !important;
    border-top: 1px solid #e5e7eb !important;
}

.hosting-plan.recommended .hosting-system{
    border-color: rgba(255,255,255,.12) !important;
}

.hosting-system strong{
    color: #111827 !important;
    font-size: 14px !important;
}

.hosting-plan.recommended .hosting-system strong{
    color: #ffffff !important;
}

.hosting-system small{
    color: #64748b !important;
}

.hosting-plan.recommended .hosting-system small{
    color: #cbd5e1 !important;
}

.hosting-benefits{
    list-style: none !important;
    display: grid !important;
    gap: 10px !important;
    margin: 22px 0 24px !important;
    min-height: 0 !important;
}

.hosting-benefits li{
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    color: #475569 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.hosting-plan.recommended .hosting-benefits li{
    color: #e5e7eb !important;
}

.hosting-benefits .yes,
.hosting-benefits .no{
    width: 20px !important;
    height: 20px !important;
    min-width: 20px !important;
    border-radius: 999px !important;
    display: grid !important;
    place-items: center !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}

.hosting-benefits .yes{
    background: #dcfce7 !important;
    color: #16a34a !important;
}

.hosting-benefits .no{
    background: #fee2e2 !important;
    color: #dc2626 !important;
}

.hosting-plan.recommended .hosting-benefits .yes{
    background: rgba(34,197,94,.16) !important;
    color: #86efac !important;
}

.hosting-plan.recommended .hosting-benefits .no{
    background: rgba(248,113,113,.16) !important;
    color: #fca5a5 !important;
}

.hosting-order-btn,
.hosting-order-btn.order-basic,
.hosting-order-btn.order-personal,
.hosting-order-btn.order-business{
    width: 100% !important;
    min-height: 48px !important;
    border-radius: 14px !important;
    background: #2563eb !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    box-shadow: none !important;
    border: 0 !important;
    transition: background .2s ease, transform .2s ease !important;
}

.hosting-order-btn:hover{
    background: #1d4ed8 !important;
    transform: translateY(-2px) !important;
    box-shadow: none !important;
}

.hosting-plan.recommended .hosting-order-btn,
.hosting-order-btn.order-plus{
    background: #ffffff !important;
    color: #0f172a !important;
    box-shadow: none !important;
}

.hosting-plan.recommended .hosting-order-btn:hover,
.hosting-order-btn.order-plus:hover{
    background: #e0f2fe !important;
    color: #0f172a !important;
    box-shadow: none !important;
}

.wp-note{
    margin-top: 14px !important;
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.hosting-plan.recommended .wp-note{
    color: #cbd5e1 !important;
}

.wp-note b{
    background: #2563eb !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.promo-note{
    margin-top: 26px !important;
    color: #64748b !important;
    font-size: 13px !important;
}

@media (max-width: 1180px){
    .hosting-plans-grid,
    .plans-grid.hosting-plans-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px){
    .hosting-plans-grid,
    .plans-grid.hosting-plans-grid{
        grid-template-columns: 1fr;
        gap: 16px !important;
    }

    .hosting-plan-inner{
        padding: 26px 20px 22px !important;
    }

    .hosting-plan.recommended h3{
        padding-right: 0;
        margin-top: 34px !important;
    }

    .recommended-bar{
        left: 20px !important;
        right: auto !important;
    }

    .hosting-specs{
        grid-template-columns: 1fr !important;
    }
}



/* Ajustari cerute */
.hosting-plan{
    background:#ffffff !important;
}

.hosting-plan.recommended{
    background:#f8fafc !important;
    border:1px solid #cbd5e1 !important;
    color:#111827 !important;
}

.hosting-plan.recommended h3,
.hosting-plan.recommended .hosting-price strong,
.hosting-plan.recommended .hosting-specs strong,
.hosting-plan.recommended .hosting-system strong{
    color:#111827 !important;
}

.hosting-plan.recommended .hosting-desc,
.hosting-plan.recommended .hosting-benefits li,
.hosting-plan.recommended .hosting-system small,
.hosting-plan.recommended .hosting-specs span,
.hosting-plan.recommended .wp-note,
.hosting-plan.recommended .hosting-price span:last-child{
    color:#475569 !important;
}

.hosting-plan.recommended .discount-badge{
    background:#eef2ff !important;
    color:#1e40af !important;
    border-color:#dbeafe !important;
}

.hosting-plan.recommended h3 span{
    background:#dbeafe !important;
    color:#2563eb !important;
}

.hosting-plan.recommended .hosting-specs div{
    background:#ffffff !important;
    border-color:#e5e7eb !important;
}

.hosting-plan.recommended .hosting-system{
    border-color:#e5e7eb !important;
}

.hosting-plan.recommended .hosting-order-btn{
    background:#2563eb !important;
    color:#ffffff !important;
}

.hosting-plan.recommended .hosting-order-btn:hover{
    background:#1d4ed8 !important;
    color:#ffffff !important;
}


/* SECTIUNE PACHETE COMPLET ALBA */
body #pachete,
body .plans-section,
body #pachete .container,
body #pachete .section-head,
body #pachete .hosting-plans-grid{
    background:#ffffff !important;
    background-image:none !important;
}

body #pachete{
    border:none !important;
    box-shadow:none !important;
}

body #pachete:before,
body #pachete:after,
body .plans-section:before,
body .plans-section:after{
    display:none !important;
    content:none !important;
    background:none !important;
}



/* FIX FINAL: sectiunea pachete alb complet, inclusiv zona exterioara containerului */
html body,
body main,
main,
.site-main,
.page-wrapper,
.content-wrapper{
    background-color:#ffffff !important;
    background-image:none !important;
}

body #pachete.plans-section,
body #pachete,
body main #pachete,
body section#pachete{
    position:relative !important;
    isolation:isolate !important;
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:80px 0 !important;
    background:#ffffff !important;
    background-color:#ffffff !important;
    background-image:none !important;
    border-top:1px solid #e5e7eb !important;
    border-bottom:1px solid #e5e7eb !important;
    box-shadow:0 0 0 100vmax #ffffff !important;
    clip-path:inset(0 -100vmax) !important;
}

body #pachete::before,
body #pachete::after,
body #pachete.plans-section::before,
body #pachete.plans-section::after{
    content:none !important;
    display:none !important;
    background:none !important;
    background-image:none !important;
}

body #pachete > .container,
body #pachete .container,
body #pachete .section-head,
body #pachete .plans-grid,
body #pachete .hosting-plans-grid{
    background:#ffffff !important;
    background-color:#ffffff !important;
    background-image:none !important;
    box-shadow:none !important;
}

/* Cardurile raman albe, dar delimitate clar */
body #pachete .hosting-plan,
body #pachete .hosting-plan.recommended{
    background:#ffffff !important;
    background-color:#ffffff !important;
    background-image:none !important;
    color:#111827 !important;
    border:1px solid #e5e7eb !important;
    box-shadow:none !important;
}

body #pachete .hosting-plan.recommended *,
body #pachete .hosting-plan *{
    color:inherit;
}

body #pachete .hosting-plan h3,
body #pachete .hosting-plan .hosting-price strong,
body #pachete .hosting-plan .hosting-specs strong,
body #pachete .hosting-plan .hosting-system strong{
    color:#111827 !important;
}

body #pachete .hosting-desc,
body #pachete .hosting-benefits li,
body #pachete .hosting-system small,
body #pachete .hosting-specs span,
body #pachete .wp-note,
body #pachete .hosting-price span:last-child{
    color:#475569 !important;
}

body #pachete .hosting-order-btn{
    background:#2563eb !important;
    color:#ffffff !important;
}

body #pachete .recommended-bar{
    background:#facc15 !important;
    color:#111827 !important;
}

body #pachete .hosting-benefits .yes{
    color:#16a34a !important;
}

body #pachete .hosting-benefits .no{
    color:#dc2626 !important;
}


/* Prima sectiune (hero) inapoi pe gri */
.hero,
.hero-section,
.hero-showcase,
header + section,
main > section:first-of-type{
    background:#f3f4f6 !important;
    background-image:none !important;
}


/* Text mai mic la descrierile beneficiilor */
.feature-card p{
    font-size:13px !important;
    line-height:1.5 !important;
    color:#64748b !important;
}
