* { scroll-behavior: smooth; }
        body { font-family: 'Inter', sans-serif; background-color: #10002F; }

        /* Navbar blur */
        .navbar-blur {
            background: rgba(16, 0, 47, 0.90);
            backdrop-filter: blur(14px);
            -webkit-backdrop-filter: blur(14px);
        }

        /* Gradient utilities */
        .gradient-text {
            background: linear-gradient(135deg, #E12AFB 0%, #CB6379 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }
        .gradient-line {
            height: 1px;
            background: linear-gradient(90deg, transparent, #E12AFB, #CB6379, transparent);
        }

        /* Primary button */
        .btn-primary {
            background: linear-gradient(135deg, #E12AFB 0%, #CB6379 100%);
            transition: opacity 0.2s ease;
        }
        .btn-primary:hover { opacity: 0.85; }

        /* Card component */
        .card {
            background: rgba(255, 255, 255, 0.04);
            border: 1px solid rgba(255, 255, 255, 0.09);
            border-radius: 1rem;
            transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
        }
        @media (hover: hover) and (pointer: fine) {
            .card:hover {
                transform: translateY(-6px);
                border-color: rgba(225, 42, 251, 0.35);
                box-shadow: 0 16px 36px rgba(16, 0, 47, 0.16);
            }
        }
        .problem-card {
            background: rgba(255, 255, 255, 0.96);
            border-color: rgba(16, 0, 47, 0.12);
        }
        @media (hover: hover) and (pointer: fine) {
            .problem-card:hover {
                border-color: rgba(225, 42, 251, 0.45);
                box-shadow: 0 16px 34px rgba(16, 0, 47, 0.12);
            }
        }

        /* Step circles */
        .step-circle {
            width: 5rem; height: 5rem;
            border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            font-family: 'Orbitron', sans-serif;
            font-weight: 900; font-size: 1.1rem;
            color: white;
        }

        /* Form fields */
        input[type="text"],
        input[type="email"],
        textarea,
        select {
            background: rgba(255, 255, 255, 0.05);
            border: 1px solid rgba(255, 255, 255, 0.18);
            border-radius: 0.75rem;
            color: white;
            width: 100%;
            padding: 0.75rem 1rem;
            outline: none;
            transition: border-color 0.2s ease;
            font-family: 'Inter', sans-serif;
            font-size: 0.9rem;
        }
        input::placeholder,
        textarea::placeholder { color: rgba(255, 255, 255, 0.28); }
        input:focus,
        textarea:focus,
        select:focus { border-color: rgba(225, 42, 251, 0.55); }
        select { appearance: none; background-color: #1a0050; cursor: pointer; }
        select option { background-color: #1a0050; color: white; }

        /* Hero background + grana */
        .hero-bg {
            position: relative;
            background:
                radial-gradient(ellipse at 75% 45%, rgba(225, 42, 251, 0.10) 0%, transparent 55%),
                radial-gradient(ellipse at 25% 80%, rgba(203, 99, 121, 0.08) 0%, transparent 50%),
                #10002F;
        }
        .hero-bg::after {
            content: '';
            position: absolute;
            inset: 0;
            pointer-events: none;
            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.08'/%3E%3C/svg%3E");
            background-size: 200px 200px;
            opacity: 0.35;
            mix-blend-mode: overlay;
            z-index: 0;
        }
        .hero-bg > * { position: relative; z-index: 1; }
        .hero-bg.hero-bg-light {
            background:
                radial-gradient(ellipse at 75% 45%, rgba(225, 42, 251, 0.10) 0%, transparent 55%),
                radial-gradient(ellipse at 25% 80%, rgba(203, 99, 121, 0.08) 0%, transparent 50%),
                #F6F3FF;
        }
        .hero-bg.hero-bg-light::after {
            display: none;
        }
        .hero-bg.hero-bg-light h1 .text-white { color: #14053A !important; }
        .hero-bg.hero-bg-light > .max-w-7xl > div:first-child > p.text-xl { color: #4F4370 !important; }
        .hero-bg.hero-bg-light > .max-w-7xl > div:first-child > p.text-xl strong { color: #1C0A4B !important; }
        .hero-bg.hero-bg-light a[href="#come-funziona"] {
            color: #241356 !important;
            border-color: rgba(16, 0, 47, 0.25) !important;
        }
        .hero-bg.hero-bg-light a[href="#come-funziona"]:hover {
            color: #10002F !important;
            border-color: rgba(16, 0, 47, 0.45) !important;
        }
        .hero-bg.hero-bg-light .text-brand-gray { color: #6C618C !important; }

        /* Testimonial avatar */
        .testimonial-avatar {
            width: 3rem; height: 3rem;
            border-radius: 50%;
            background: linear-gradient(135deg, #E12AFB, #CB6379);
            display: flex; align-items: center; justify-content: center;
            font-family: 'Orbitron', sans-serif;
            font-weight: 700; font-size: 0.75rem;
            color: white; flex-shrink: 0;
        }

        /* Comparison table alternating rows */
        .compare-table tr:nth-child(even) td {
            background: rgba(255, 255, 255, 0.02);
        }

        /* Section alt background */
        .section-alt { background: rgba(255, 255, 255, 0.06); }
        .hero-follow-dark { background: #10002F; }
        .comparator-section { background: #ffffff; }
        .comparator-kicker { color: #7B6EA0; }
        .comparator-title { color: #10002F; }
        .comparator-subtitle { color: #4F4370; }
        .comparator-panel {
            background: #F8F5FF;
            border: 1px solid rgba(225, 42, 251, 0.25);
            border-radius: 1rem;
        }
        .comparator-label { color: #786B98; }
        .comparator-text { color: #8A7DAA; }
        .widget-controls {
            position: relative;
            z-index: 2;
        }
        .widget-mode-btn {
            border: 1px solid rgba(16, 0, 47, 0.18);
            background: #ffffff;
            color: #3D3061;
            border-radius: 9999px;
            padding: 0.75rem 1.25rem;
            font-size: 0.92rem;
            font-weight: 700;
            line-height: 1;
            transition: all 0.18s ease;
        }
        .widget-mode-btn:hover {
            border-color: rgba(225, 42, 251, 0.45);
            color: #10002F;
        }
        .widget-mode-btn[aria-pressed="true"] {
            background: linear-gradient(135deg, #E12AFB 0%, #CB6379 100%);
            border-color: transparent;
            color: #ffffff;
            box-shadow: 0 10px 24px rgba(203, 99, 121, 0.22);
        }
        .widget-shell {
            position: relative;
            border: 1px solid rgba(225, 42, 251, 0.18);
            border-radius: 1rem;
            background: linear-gradient(180deg, #F8F5FF 0%, #FFFFFF 100%);
            box-shadow: 0 14px 36px rgba(16, 0, 47, 0.12);
            padding: 1rem;
            overflow: hidden;
        }
        #telco-widget-root {
            min-height: 540px;
        }
        #telco-widget-root iframe {
            width: 100%;
            border: 0;
            border-radius: 0.85rem;
            background: #ffffff;
            display: block;
        }
        .testimonials-scroll {
            overflow-x: auto;
            scrollbar-width: none;
            -ms-overflow-style: none;
            cursor: grab;
            touch-action: pan-y;
            -webkit-overflow-scrolling: touch;
            user-select: none;
        }
        .testimonials-scroll::-webkit-scrollbar { display: none; }
        .testimonials-scroll.is-dragging { cursor: grabbing; }
        .testimonial-card {
            width: min(430px, calc(100vw - 4rem));
        }
        @media (min-width: 640px) {
            .testimonial-card {
                width: 430px;
            }
        }
        .testimonials-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            z-index: 10;
            width: 2.5rem;
            height: 2.5rem;
            border-radius: 9999px;
            border: 1px solid rgba(225, 42, 251, 0.35);
            background: rgba(16, 0, 47, 0.85);
            color: #E12AFB;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: all 0.2s ease;
            backdrop-filter: blur(4px);
            -webkit-backdrop-filter: blur(4px);
        }
        .testimonials-nav:hover {
            background: rgba(225, 42, 251, 0.14);
            border-color: rgba(225, 42, 251, 0.55);
        }
        .testimonials-nav:disabled {
            opacity: 0.35;
            cursor: not-allowed;
        }
        .testimonials-nav.left { left: -0.75rem; }
        .testimonials-nav.right { right: -0.75rem; }
        @media (max-width: 768px) {
            .testimonials-nav {
                width: 2.25rem;
                height: 2.25rem;
            }
            .testimonials-nav.left { left: -0.35rem; }
            .testimonials-nav.right { right: -0.35rem; }
        }
        .form-light input[type="text"],
        .form-light input[type="email"],
        .form-light textarea,
        .form-light select {
            background: #ffffff;
            border: 1px solid rgba(16, 0, 47, 0.18);
            color: #10002F;
        }
        .form-light input::placeholder,
        .form-light textarea::placeholder { color: rgba(16, 0, 47, 0.38); }
        .form-light input:focus,
        .form-light textarea:focus,
        .form-light select:focus { border-color: rgba(225, 42, 251, 0.55); }
        .form-light select { background-color: #ffffff; }
        .form-light select option { background-color: #ffffff; color: #10002F; }

        /* Category pills hero */
        .category-pill:hover {
            border-color: rgba(225, 42, 251, 0.5) !important;
            background: rgba(255,255,255,1) !important;
            box-shadow: 0 4px 24px rgba(225, 42, 251, 0.15);
        }
        .category-pill:hover .category-icon {
            transform: scale(1.08);
            transition: transform 0.2s ease;
        }
        .category-icon {
            transition: transform 0.2s ease;
        }
        .category-pill-square {
            display: flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: flex-start;
            aspect-ratio: 1 / 1;
            min-height: 180px;
            overflow: hidden;
        }
        .category-pill-square p:last-child {
            line-height: 1.35;
            overflow-wrap: anywhere;
        }
        @media (max-width: 767px) {
            .category-pill-square {
                aspect-ratio: auto;
                min-height: 0;
            }
        }
        .hero-wave-divider {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            line-height: 0;
            background: #10002F;
            z-index: 2;
        }
        .hero-wave-divider svg {
            display: block;
            width: 100%;
            height: 88px;
        }
        .hero-wave-divider path {
            fill: #F6F3FF;
        }

        /* Section reveal: fade + up */
        .reveal-on-scroll {
            opacity: 0;
            transform: translateY(18px);
            transition: opacity 0.65s ease, transform 0.65s ease;
            will-change: opacity, transform;
        }
        .reveal-on-scroll.is-visible {
            opacity: 1;
            transform: translateY(0);
        }
        @media (prefers-reduced-motion: reduce) {
            .reveal-on-scroll {
                opacity: 1 !important;
                transform: none !important;
                transition: none !important;
            }
        }
