/* Light theme overrides scoped under .theme-light */

/* Root and base colors */
.theme-light {
  --bg: #050024;
  --bg-2: #050024;
  --text: #ffffff;
  --muted: #6b7280;
  --primary: #ff5d6c; /* rosa */
  --border: #e5e7eb;
  --accent: #2aa7ff; /* azul (antes verde) */
  --infoTone: #c35bff; /* morado/celeste */
}

.theme-light body {
  background-color: var(--bg);
  color: var(--text);
}
/* Ensure default sections also use the new light background */
.theme-light section { background-color: var(--bg); }

/* Navbar (keeping markup .navbar-dark but overriding colors for light mode) */
.theme-light .navbar-dark.navbar-glass {
  /* background: #08d0d4 !important; */
  backdrop-filter: saturate(180%) blur(12px);
}
.theme-light .navbar-dark .navbar-brand,
.theme-light .navbar-dark .nav-link,
.theme-light .navbar-dark .navbar-toggler {
  color: #0a0a0a !important;
}
.theme-light .navbar-dark .nav-link.active,
.theme-light .navbar-dark .nav-link:focus,
.theme-light .navbar-dark .nav-link:hover { color: #000000 !important; }
/* .theme-light .navbar-dark .dropdown-menu {
  background-color: var(--bg-2);
  border-color: var(--border);
} */
.theme-light .navbar-dark .dropdown-item {
  color: #0a0a0a;
}
.theme-light .navbar-dark .dropdown-item:hover {
  background-color: rgba(0,0,0,0.05);
}

/* Cards, modals, surfaces */
.theme-light .card,
.theme-light .modal-content,
.theme-light .offcanvas,
.theme-light .list-group-item {
  background-color: var(--bg-2);
  color: var(--text);
  border-color: var(--border);
}

/* Tables */
.theme-light .table {
  --bs-table-bg: var(--bg-2);
  --bs-table-striped-bg: #f2f4f8;
  --bs-table-striped-color: var(--text);
  --bs-table-hover-bg: #eef2f7;
  --bs-table-hover-color: var(--text);
  color: var(--text);
}

/* Forms */
.theme-light .form-control,
.theme-light .form-select {
  background-color: var(--bg-2);
  color: var(--text);
  border-color: var(--border);
}
.theme-light .form-control:focus,
.theme-light .form-select:focus { border-color: var(--primary); box-shadow: 0 0 0 .2rem rgba(255, 93, 108, .25); }

/* Buttons */
.theme-light .btn-outline-light {
  color: var(--text);
  border-color: var(--border);
}
/* Theme: Light overrides    */
/* ========================= */
/* Dark is the current default. When html has .theme-light, switch to a light palette. */
html.theme-light,
html.theme-light body {
  background-color: #d3d3d8;
  color: #ffffff;
}

html.theme-light body {
  transition: background-color .25s ease, color .25s ease;
}

.theme-light .navbar-glass {
  background: rgba(197,201,237,0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.theme-light .navbar-glass.navbar-opaque {
  background:radial-gradient(800px 420px at 85% 12%, rgba(195,91,255,0.10), transparent 65%),radial-gradient(900px 500px at 12% 20%, rgba(42,167,255,0.12), transparent 60%),linear-gradient(135deg, #7c8dd1 0%, #99a7c9 50%, #a7acbe 100%);
  box-shadow: 0 6px 24px rgba(0,0,0,0.03);
}
.theme-light .navbar .nav-link,
.theme-light .navbar-brand { color: #0a0a0a !important; }
.theme-light .navbar .nav-link.active { color: #000000 !important; }
.theme-light .dropdown-menu { background: #f3eeff; color: #0a0a0a; }
.theme-light .dropdown-item { color: #0a0a0a; }
.theme-light .dropdown-item:hover { background: rgba(0,0,0,0.05); }

/* Hero */
.theme-light #start.hero {
  color: var(--text);
  background: url('../images/bg.svg') center center / cover no-repeat, linear-gradient(180deg, rgba(140, 141, 143, 0.61) 0%, rgba(140, 141, 143, 0.61) 65%, rgba(140, 141, 143, 0.61) 100%);
}
.theme-light #start .hero-overlay {
  background: linear-gradient(180deg, rgba(184, 176, 176, 0.65) 0%, rgba(171, 176, 184, 0.65) 65%, rgba(170, 160, 182, 0.85) 100%);
}
.theme-light #start .hero-title,
.theme-light #start .hero-heading { color: #ffffff; text-shadow: none; }
.theme-light #start .hero-subtitle { color: #ffffff; text-shadow: none; }
.theme-light #home h2 { color: #0e8092 !important; }
.theme-light #plans.plans-section {   background:radial-gradient(800px 420px at 85% 12%, rgba(195,91,255,0.10), transparent 65%),radial-gradient(900px 500px at 12% 20%, rgba(42,167,255,0.12), transparent 60%),linear-gradient(135deg, #717fb8 0%, #99a7c9 50%, #a7acbe 100%); }

/* Cards and panels */
.theme-light .card { background: var(--bg-2); color: #ffffff; }
.theme-light .card .card-body { background:radial-gradient(800px 420px at 85% 12%, rgba(195,91,255,0.10), transparent 65%),radial-gradient(900px 500px at 12% 20%, rgba(42,167,255,0.12), transparent 60%),linear-gradient(135deg, #c0c3ce 0%, #a9b1c5 50%, #8d99c4 100%); }
.theme-light .plan-card { background: var(--bg-2); color: #ffffff; box-shadow: 0 14px 24px rgba(0,0,0,0.08); }
.theme-light .plan-card.plan-basic { background: #ff5d6c; }
.theme-light .plan-card.plan-standard { background: #2aa7ff; }
.theme-light .plan-card.plan-premium { background: #c35bff; }
.theme-light .plan-card.plan-corporate { color: #1b1b1b; background: linear-gradient(135deg, #b8860b 0%, #d4af37 55%, #f1d97a 100%); }
.theme-light .lead { color: #110018; }
.theme-light .py-5 { background-color: #d3d3d8; }

/* Ensure card text is readable */
.theme-light .card .card-title,
.theme-light .card .card-text { color: #ffffff; }
.theme-light .card a { color: #cfe8ff; }

/* Footer */
.theme-light .footer {
  color: #334155;
  background-color: #08d0d4 !important;
}
.theme-light .footer .text-muted { color: #ffffff !important; }
.theme-light .footer a { color: #ffffff !important; }
.theme-light .footer .d-inline-flex.gap-3 a { background: rgba(0,0,0,0.04); border: 1px solid rgba(0,0,0,0.08); }
.theme-light .footer .d-inline-flex.gap-3 a:hover { background: rgba(0,0,0,0.06); box-shadow: 0 8px 22px rgba(0,0,0,0.08), 0 0 0 2px rgba(255,93,108,0.15) inset; }
.theme-light .footer { background:radial-gradient(800px 420px at 85% 12%, rgba(195,91,255,0.10), transparent 65%),radial-gradient(900px 500px at 12% 20%, rgba(42,167,255,0.12), transparent 60%),linear-gradient(135deg, #babcc7 0%, #aab4ce 50%, #6062a7 100%);}

/* About section */
.theme-light #about.about-section { color: #1b1f2a; background-color: #d3d3d8;}
.theme-light .about-title { color: #0f172a; text-shadow: none; }
.theme-light .about-intro { background:radial-gradient(800px 420px at 85% 12%, rgba(195,91,255,0.10), transparent 65%),radial-gradient(900px 500px at 12% 20%, rgba(42,167,255,0.12), transparent 60%),linear-gradient(135deg, #7c8dd1 0%, #99a7c9 50%, #a7acbe 100%); color: #ffffff; border: 1px solid rgba(0,0,0,0.06); box-shadow: 0 8px 20px rgba(0,0,0,0.06); }
.theme-light .about-card {   background:radial-gradient(800px 420px at 85% 12%, rgba(195,91,255,0.10), transparent 65%),radial-gradient(900px 500px at 12% 20%, rgba(42,167,255,0.12), transparent 60%),linear-gradient(135deg, #7c8dd1 0%, #99a7c9 50%, #a7acbe 100%); color: #ffffff; border: 1px solid rgba(0,0,0,0.06); box-shadow: 0 8px 20px rgba(0,0,0,0.06); }
.theme-light .about-card h4, .theme-light .about-intro h4 { color: #ffffff; }
.theme-light .about-card p, .theme-light .about-intro p { color: #ffffff; }

/* Contact form section */
.theme-light #form.form {
  background:radial-gradient(800px 420px at 85% 12%, rgba(195,91,255,0.10), transparent 65%),radial-gradient(900px 500px at 12% 20%, rgba(42,167,255,0.12), transparent 60%),linear-gradient(135deg, #7c8dd1 0%, #99a7c9 50%, #a7acbe 100%); }
.theme-light .contact-card { background: #ffffff; border: 1px solid rgba(0,0,0,0.12); box-shadow: 0 8px 20px rgba(0,0,0,0.06); }
.theme-light .form-glass { background: rgba(255,255,255,0.8); border-color: rgba(0,0,0,0.06); }
/* Contact card text and labels: ensure dark, readable contrast in light mode */
.theme-light .contact-card .form-label { color: #0f172a !important; }
.theme-light .contact-card .text-white-50 { color: #475569 !important; }
/* Inputs and textareas inside contact card */
.theme-light .contact-card .form-control,
.theme-light .contact-card textarea {
  color: #0f172a;
  background-color: #ffffff;
  border-color: #273653;
}
/* Placeholder color for readability */
.theme-light .contact-card ::placeholder { color: #64748b; opacity: 1; }

/* Buttons */
.theme-light .btn.btn-hero-cta { color: #0b0e1a; }
.theme-light .pill-btn { background: #111827; color: #ffffff; }
.theme-light .btn-lg { color: #0a0a0a; }
.theme-light .cancelar { color: #0a0a0a; background-color: #f3eeff !important; }

/* Misc */
.theme-light .ai-summary { background: rgba(0,0,0,0.04); border-color: rgba(0,0,0,0.08); color: #111827; text-shadow: none; }
.theme-light .diagnostic-box { color: #111827; }
.theme-light .traffic-light { border-color: rgba(0,0,0,0.08); box-shadow: inset 0 0 12px rgba(0,0,0,0.08), 0 6px 18px rgba(0,0,0,0.06); }

/* Global elements */
.theme-light a { color: var(--primary); }
.theme-light a:hover { color: #00d9ff; }
.theme-light .text-muted { color: #cbd5e1 !important; }
.theme-light .border { border-color: rgba(0,0,0,0.12) !important; }
.theme-light .bg-light { background-color: var(--bg-2) !important; }

/* Tables */
.theme-light table { color: #ffffff; background: #050024;}
.theme-light .table { color: #ffffff; background: #050024;}
.theme-light .table thead th { color: #ffffff; background: #050024;}
.theme-light .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255,255,255,0.04); }
/* Ensure table body text and links are white */
.theme-light .table tbody td { color: #ffffff; }
.theme-light .table a { color: #d7ecff; }
.theme-light .table a:hover { color: #ffffff; text-decoration: underline; }
/* Improve hover for diagnostic rows */
.theme-light .table-hover tbody tr:hover { background-color: #191438; color: #ffffff; }
.theme-light .table-hover tbody tr:hover > * { background-color: #191438; color: #ffffff; }
.theme-light .table-hover tbody tr:hover a { color: #ffffff; }
.theme-light thead.table-light + tbody tr:hover { background-color: #ffffff; color: #000 !important; }
.theme-light thead.table-light + tbody tr:hover > * { background-color: #ffffff; color: #000 !important; }
.theme-light thead.table-light + tbody tr:hover a { color: #000 !important; }
/* Action buttons (view/edit/export) inside hovered light rows */
.theme-light thead.table-light + tbody tr:hover .btn-outline-primary,
.theme-light thead.table-light + tbody tr:hover .btn-outline-secondary,
.theme-light thead.table-light + tbody tr:hover .btn-outline-success {
  color: #000 !important;
  border-color: rgba(0,0,0,0.5) !important;
  background-color: transparent !important;
}
.theme-light thead.table-light + tbody tr:hover .btn-outline-primary i,
.theme-light thead.table-light + tbody tr:hover .btn-outline-secondary i,
.theme-light thead.table-light + tbody tr:hover .btn-outline-success i { color: #000 !important; }
.theme-light .table-light tr:hover { background-color: #191438; color: #ffffff !important;}

/* Diagnostic */
.theme-light .mb-3 h4 { color: #100036 !important; }
.theme-light .form-control {background-color: #f3eeff !important;}
.theme-light .form-select {background-color: #f3eeff !important;}
.theme-light .form-check-input {background-color: #f3eeff !important;}
.theme-light .form-check-label { color: #0a0a0a !important; }
.theme-light .form-label { color: #0a0a0a !important; }
.theme-light .input-group-text {background-color: #f3eeff !important;}
.theme-light .cancelar { color: #0a0a0a; background-color: #f3eeff !important; }
.theme-light .text-muted { color: #0a0a0a !important; }

/* Reports filters: ensure select text/options readable on light background */
.theme-light .card form .form-select,
.theme-light .card form .form-control {
  color: #0a0a0a !important;
}
.theme-light .card form .form-select option {
  color: #0a0a0a;
  background-color: #f3eeff;
}
.theme-light .card form .form-select option:disabled { color: rgba(0,0,0,.45); }
.theme-light .card form .form-select:focus { color: #0a0a0a; }

/* Forms */
.theme-light .form-control,
.theme-light .form-select,
.theme-light .form-check-input,
.theme-light .input-group-text {
  background-color: var(--bg-2);
  color: #ffffff;
  border-color: #4b5563;
}
.theme-light .form-control:focus,
.theme-light .form-select:focus { border-color: var(--primary); box-shadow: 0 0 0 .25rem rgba(255,93,108,.25); }
.theme-light .form-check-input:checked { background-color: var(--primary); border-color: var(--primary); }

/* Alerts/Badges */
.theme-light .alert { color: #1b1f2a; }
.theme-light .badge.bg-light { background-color: #f1f3f5 !important; color: #1b1f2a; }

/* Buttons utilities */
.theme-light .btn-outline-light { color: #1b1f2a; border-color: #1b1f2a; }
.theme-light .btn-outline-light:hover { background-color: #1b1f2a; color: #ffffff; }
/* Outline buttons in dark-light theme */
.theme-light .btn-outline-primary,
.theme-light .btn-outline-secondary,
.theme-light .btn-outline-success {
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.6) !important;
}
.theme-light .btn-outline-primary i,
.theme-light .btn-outline-secondary i,
.theme-light .btn-outline-success i { color: #ffffff !important; }
.theme-light .btn-outline-primary:hover,
.theme-light .btn-outline-secondary:hover,
.theme-light .btn-outline-success:hover {
  background-color: rgba(255,255,255,0.12) !important;
}

/* Payment */
.theme-light .d-flex .card-title { color: #ffffff !important; }
.theme-light .d-flex .text-muted { color: #ffffff !important; }

@keyframes hero-gradient-animation {
    0% {
        --y-0: 63%;
        --c-0: hsla(191.91176470588252, 64%, 76%, 1);
        --s-start-0: 8.392121895570533%;
        --s-end-0: 38.584065253664996%;
        --x-0: 93%;
        --y-1: -7%;
        --c-1: hsla(222.35294117647067, 51%, 87%, 1);
        --s-start-1: 8.392121895570533%;
        --s-end-1: 22.10878124098502%;
        --x-1: 33%;
        --y-2: 7%;
        --x-2: 84%;
        --s-start-2: 8.392121895570533%;
        --s-end-2: 22.558651527792346%;
        --c-2: hsla(222.3529411764706, 51%, 87%, 1);
        --c-3: hsla(222.3529411764706, 51%, 87%, 1);
        --x-3: 14%;
        --s-start-3: 8.392121895570533%;
        --s-end-3: 22.558651527792346%;
        --y-3: 5%;
        --y-4: 96%;
        --c-4: hsla(222.3529411764706, 51%, 87%, 1);
        --x-4: 7%;
        --s-start-4: 8.392121895570533%;
        --s-end-4: 22.558651527792346%;
        --y-5: 90%;
        --c-5: hsla(222.3529411764706, 51%, 87%, 1);
        --x-5: 93%;
        --s-start-5: 8.392121895570533%;
        --s-end-5: 22.558651527792346%;
        --s-start-6: 8.392121895570533%;
        --s-end-6: 39.67138181429644%;
        --c-6: hsla(187.94117647058826, 65%, 49%, 1);
        --x-6: 3%;
        --y-6: 61%;
        --x-7: 94%;
        --y-7: 59%;
        --s-start-7: 8.392121895570533%;
        --s-end-7: 49.58090142552271%;
        --c-7: hsla(187.77777777777777, 64%, 49%, 1);
        --y-8: 63%;
        --s-start-8: 8.392121895570533%;
        --s-end-8: 34.815367581495366%;
        --x-8: 48%;
        --c-8: hsla(278.1617647058826, 100%, 79%, 1);
        --y-9: 78%;
        --c-9: hsla(281.25, 93%, 83%, 1);
        --x-9: 96%;
        --s-start-9: 8.392121895570533%;
        --s-end-9: 31.77166380372925%;
    }

    50% {
        --y-0: 59%;
        --c-0: hsla(192.3076923076923, 63%, 76%, 1);
        --s-start-0: 12.892043731642234%;
        --s-end-0: 42.94837818044209%;
        --x-0: 2%;
        --y-1: 10%;
        --c-1: hsla(222.3529411764706, 51%, 87%, 1);
        --s-start-1: 8.392121895570533%;
        --s-end-1: 41.69445156991687%;
        --x-1: 42%;
        --y-2: 29%;
        --x-2: 75%;
        --s-start-2: 8.392121895570533%;
        --s-end-2: 20.488815899465003%;
        --c-2: hsla(222.3529411764706, 51%, 87%, 1);
        --c-3: hsla(222.3529411764706, 51%, 87%, 1);
        --x-3: 5%;
        --s-start-3: 8.392121895570533%;
        --s-end-3: 30.099844327777923%;
        --y-3: 16%;
        --y-4: 91%;
        --c-4: hsla(222.3529411764706, 51%, 87%, 1);
        --x-4: 36%;
        --s-start-4: 8.392121895570533%;
        --s-end-4: 24.59566937006635%;
        --y-5: 91%;
        --c-5: hsla(222.3529411764706, 51%, 87%, 1);
        --x-5: 70%;
        --s-start-5: 8.392121895570533%;
        --s-end-5: 24.59566937006635%;
        --s-start-6: 9%;
        --s-end-6: 26.825849058644888%;
        --c-6: hsla(187.77777777777777, 64%, 49%, 1);
        --x-6: 54%;
        --y-6: 73%;
        --x-7: 57%;
        --y-7: 76%;
        --s-start-7: 9%;
        --s-end-7: 49.05074977970796%;
        --c-7: hsla(187.77777777777777, 64%, 49%, 1);
        --y-8: 53%;
        --s-start-8: 9;
        --s-end-8: 26.166345747226664%;
        --x-8: 11%;
        --c-8: hsla(278.13084112149534, 100%, 79%, 1);
        --y-9: 70%;
        --c-9: hsla(281.25, 93%, 83%, 1);
        --x-9: 70%;
        --s-start-9: 9;
        --s-end-9: 22.152460022684956%;
    }

    100% {
        --y-1: -3%;
        --c-1: hsla(222.3529411764706, 51%, 87%, 1);
        --s-start-1: 8.392121895570533%;
        --s-end-1: 59.32232816638693%;
        --x-1: 76%;
        --y-2: 18%;
        --x-2: 97%;
        --s-start-2: 8.392121895570533%;
        --s-end-2: 28.52989037790774%;
        --c-2: hsla(222.3529411764706, 51%, 87%, 1);
        --c-3: hsla(222.3529411764706, 51%, 87%, 1);
        --x-3: 42%;
        --s-start-3: 8.392121895570533%;
        --s-end-3: 28.52989037790774%;
        --y-3: 18%;
        --y-4: 95%;
        --c-4: hsla(222.3529411764706, 51%, 87%, 1);
        --x-4: 66%;
        --s-start-4: 8.392121895570533%;
        --s-end-4: 28.52989037790774%;
        --y-5: 92%;
        --c-5: hsla(222.3529411764706, 51%, 87%, 1);
        --x-5: 46%;
        --s-start-5: 8.392121895570533%;
        --s-end-5: 28.52989037790774%;
        --s-start-6: 24.72064437400016%;
        --s-end-6: 47.490620328604024%;
        --c-6: hsla(187.77777777777777, 64%, 49%, 1);
        --x-6: 102%;
        --y-6: 16%;
        --x-7: 22%;
        --y-7: 52%;
        --s-start-7: 10.200720718860145%;
        --s-end-7: 50.46456494288142%;
        --c-7: hsla(187.77777777777777, 64%, 49%, 1);
        --y-9: 51%;
        --c-9: hsla(281.25, 93%, 83%, 1);
        --x-9: 97%;
        --s-start-9: 6.294132688184733%;
        --s-end-9: 20.79106730744014%;
    }
}

@property --y-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 63%
}

@property --c-0 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(191.91176470588252, 64%, 76%, 1)
}

@property --s-start-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 38.584065253664996%
}

@property --x-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 93%
}

@property --y-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: -7%
}

@property --c-1 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(222.35294117647067, 51%, 87%, 1)
}

@property --s-start-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 22.10878124098502%
}

@property --x-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 33%
}

@property --y-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 7%
}

@property --x-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 84%
}

@property --s-start-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 22.558651527792346%
}

@property --c-2 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(222.3529411764706, 51%, 87%, 1)
}

@property --c-3 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(222.3529411764706, 51%, 87%, 1)
}

@property --x-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 14%
}

@property --s-start-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 22.558651527792346%
}

@property --y-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 5%
}

@property --y-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 96%
}

@property --c-4 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(222.3529411764706, 51%, 87%, 1)
}

@property --x-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 7%
}

@property --s-start-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 22.558651527792346%
}

@property --y-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 90%
}

@property --c-5 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(222.3529411764706, 51%, 87%, 1)
}

@property --x-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 93%
}

@property --s-start-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 22.558651527792346%
}

@property --s-start-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 39.67138181429644%
}

@property --c-6 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(187.94117647058826, 65%, 49%, 1)
}

@property --x-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 3%
}

@property --y-6 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 61%
}

@property --x-7 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 94%
}

@property --y-7 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 59%
}

@property --s-start-7 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-7 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 49.58090142552271%
}

@property --c-7 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(187.77777777777777, 64%, 49%, 1)
}

@property --y-8 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 63%
}

@property --s-start-8 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-8 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 34.815367581495366%
}

@property --x-8 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 48%
}

@property --c-8 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(278.1617647058826, 100%, 79%, 1)
}

@property --y-9 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 78%
}

@property --c-9 {
    syntax: '<color>';
    inherits: false;
    initial-value: hsla(281.25, 93%, 83%, 1)
}

@property --x-9 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 96%
}

@property --s-start-9 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 8.392121895570533%
}

@property --s-end-9 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 31.77166380372925%
}

.your_css_selector_here {
    --y-0: 63%;
    --c-0: hsla(191.91176470588252, 64%, 76%, 1);
    --x-0: 93%;
    --y-1: -7%;
    --c-1: hsla(222.35294117647067, 51%, 87%, 1);
    --x-1: 33%;
    --y-2: 7%;
    --x-2: 84%;
    --c-2: hsla(222.3529411764706, 51%, 87%, 1);
    --c-3: hsla(222.3529411764706, 51%, 87%, 1);
    --x-3: 14%;
    --y-3: 5%;
    --y-4: 96%;
    --c-4: hsla(222.3529411764706, 51%, 87%, 1);
    --x-4: 7%;
    --y-5: 90%;
    --c-5: hsla(222.3529411764706, 51%, 87%, 1);
    --x-5: 93%;
    --c-6: hsla(187.94117647058826, 65%, 49%, 1);
    --x-6: 3%;
    --y-6: 61%;
    --x-7: 94%;
    --y-7: 59%;
    --c-7: hsla(187.77777777777777, 64%, 49%, 1);
    --y-8: 63%;
    --x-8: 48%;
    --c-8: hsla(278.1617647058826, 100%, 79%, 1);
    --y-9: 78%;
    --c-9: hsla(281.25, 93%, 83%, 1);
    --x-9: 96%;
    ;
    background-color: hsla(222.3529411764706, 51%, 87%, 1);
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 1648 1648' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E"), radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0), transparent var(--s-end-0)), radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1), transparent var(--s-end-1)), radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2), transparent var(--s-end-2)), radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3), transparent var(--s-end-3)), radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4), transparent var(--s-end-4)), radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5), transparent var(--s-end-5)), radial-gradient(circle at var(--x-6) var(--y-6), var(--c-6) var(--s-start-6), transparent var(--s-end-6)), radial-gradient(circle at var(--x-7) var(--y-7), var(--c-7) var(--s-start-7), transparent var(--s-end-7)), radial-gradient(circle at var(--x-8) var(--y-8), var(--c-8) var(--s-start-8), transparent var(--s-end-8)), radial-gradient(circle at var(--x-9) var(--y-9), var(--c-9) var(--s-start-9), transparent var(--s-end-9));
    animation: hero-gradient-animation 10s linear infinite alternate;
    background-blend-mode: overlay, normal, normal, normal, normal, normal, normal, normal, normal, normal, normal;
}
@keyframes hero-gradient-animation{0%{--y-0:63%; --c-0:hsla(191.91176470588252,64%,76%,1); --s-start-0:8.392121895570533%; --s-end-0:38.584065253664996%; --x-0:93%; --y-1:-7%; --c-1:hsla(222.35294117647067,51%,87%,1); --s-start-1:8.392121895570533%; --s-end-1:22.10878124098502%; --x-1:33%; --y-2:7%; --x-2:84%; --s-start-2:8.392121895570533%; --s-end-2:22.558651527792346%; --c-2:hsla(222.3529411764706,51%,87%,1); --c-3:hsla(222.3529411764706,51%,87%,1); --x-3:14%; --s-start-3:8.392121895570533%; --s-end-3:22.558651527792346%; --y-3:5%; --y-4:96%; --c-4:hsla(222.3529411764706,51%,87%,1); --x-4:7%; --s-start-4:8.392121895570533%; --s-end-4:22.558651527792346%; --y-5:90%; --c-5:hsla(222.3529411764706,51%,87%,1); --x-5:93%; --s-start-5:8.392121895570533%; --s-end-5:22.558651527792346%; --s-start-6:8.392121895570533%; --s-end-6:39.67138181429644%; --c-6:hsla(187.94117647058826,65%,49%,1); --x-6:3%; --y-6:61%; --x-7:94%; --y-7:59%; --s-start-7:8.392121895570533%; --s-end-7:49.58090142552271%; --c-7:hsla(187.77777777777777,64%,49%,1); --y-8:63%; --s-start-8:8.392121895570533%; --s-end-8:34.815367581495366%; --x-8:48%; --c-8:hsla(278.1617647058826,100%,79%,1); --y-9:78%; --c-9:hsla(281.25,93%,83%,1); --x-9:96%; --s-start-9:8.392121895570533%; --s-end-9:31.77166380372925%;}50%{--y-0:59%; --c-0:hsla(192.3076923076923,63%,76%,1); --s-start-0:12.892043731642234%; --s-end-0:42.94837818044209%; --x-0:2%; --y-1:10%; --c-1:hsla(222.3529411764706,51%,87%,1); --s-start-1:8.392121895570533%; --s-end-1:41.69445156991687%; --x-1:42%; --y-2:29%; --x-2:75%; --s-start-2:8.392121895570533%; --s-end-2:20.488815899465003%; --c-2:hsla(222.3529411764706,51%,87%,1); --c-3:hsla(222.3529411764706,51%,87%,1); --x-3:5%; --s-start-3:8.392121895570533%; --s-end-3:30.099844327777923%; --y-3:16%; --y-4:91%; --c-4:hsla(222.3529411764706,51%,87%,1); --x-4:36%; --s-start-4:8.392121895570533%; --s-end-4:24.59566937006635%; --y-5:91%; --c-5:hsla(222.3529411764706,51%,87%,1); --x-5:70%; --s-start-5:8.392121895570533%; --s-end-5:24.59566937006635%; --s-start-6:9%; --s-end-6:26.825849058644888%; --c-6:hsla(187.77777777777777,64%,49%,1); --x-6:54%; --y-6:73%; --x-7:57%; --y-7:76%; --s-start-7:9%; --s-end-7:49.05074977970796%; --c-7:hsla(187.77777777777777,64%,49%,1); --y-8:53%; --s-start-8:9; --s-end-8:26.166345747226664%; --x-8:11%; --c-8:hsla(278.13084112149534,100%,79%,1); --y-9:70%; --c-9:hsla(281.25,93%,83%,1); --x-9:70%; --s-start-9:9; --s-end-9:22.152460022684956%;}100%{--y-1:-3%; --c-1:hsla(222.3529411764706,51%,87%,1); --s-start-1:8.392121895570533%; --s-end-1:59.32232816638693%; --x-1:76%; --y-2:18%; --x-2:97%; --s-start-2:8.392121895570533%; --s-end-2:28.52989037790774%; --c-2:hsla(222.3529411764706,51%,87%,1); --c-3:hsla(222.3529411764706,51%,87%,1); --x-3:42%; --s-start-3:8.392121895570533%; --s-end-3:28.52989037790774%; --y-3:18%; --y-4:95%; --c-4:hsla(222.3529411764706,51%,87%,1); --x-4:66%; --s-start-4:8.392121895570533%; --s-end-4:28.52989037790774%; --y-5:92%; --c-5:hsla(222.3529411764706,51%,87%,1); --x-5:46%; --s-start-5:8.392121895570533%; --s-end-5:28.52989037790774%; --s-start-6:24.72064437400016%; --s-end-6:47.490620328604024%; --c-6:hsla(187.77777777777777,64%,49%,1); --x-6:102%; --y-6:16%; --x-7:22%; --y-7:52%; --s-start-7:10.200720718860145%; --s-end-7:50.46456494288142%; --c-7:hsla(187.77777777777777,64%,49%,1); --y-9:51%; --c-9:hsla(281.25,93%,83%,1); --x-9:97%; --s-start-9:6.294132688184733%; --s-end-9:20.79106730744014%;}}@property --y-0{syntax:'<percentage>';inherits:false;initial-value:63%}@property --c-0{syntax:'<color>';inherits:false;initial-value:hsla(191.91176470588252,64%,76%,1)}@property --s-start-0{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-0{syntax:'<percentage>';inherits:false;initial-value:38.584065253664996%}@property --x-0{syntax:'<percentage>';inherits:false;initial-value:93%}@property --y-1{syntax:'<percentage>';inherits:false;initial-value:-7%}@property --c-1{syntax:'<color>';inherits:false;initial-value:hsla(222.35294117647067,51%,87%,1)}@property --s-start-1{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-1{syntax:'<percentage>';inherits:false;initial-value:22.10878124098502%}@property --x-1{syntax:'<percentage>';inherits:false;initial-value:33%}@property --y-2{syntax:'<percentage>';inherits:false;initial-value:7%}@property --x-2{syntax:'<percentage>';inherits:false;initial-value:84%}@property --s-start-2{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-2{syntax:'<percentage>';inherits:false;initial-value:22.558651527792346%}@property --c-2{syntax:'<color>';inherits:false;initial-value:hsla(222.3529411764706,51%,87%,1)}@property --c-3{syntax:'<color>';inherits:false;initial-value:hsla(222.3529411764706,51%,87%,1)}@property --x-3{syntax:'<percentage>';inherits:false;initial-value:14%}@property --s-start-3{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-3{syntax:'<percentage>';inherits:false;initial-value:22.558651527792346%}@property --y-3{syntax:'<percentage>';inherits:false;initial-value:5%}@property --y-4{syntax:'<percentage>';inherits:false;initial-value:96%}@property --c-4{syntax:'<color>';inherits:false;initial-value:hsla(222.3529411764706,51%,87%,1)}@property --x-4{syntax:'<percentage>';inherits:false;initial-value:7%}@property --s-start-4{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-4{syntax:'<percentage>';inherits:false;initial-value:22.558651527792346%}@property --y-5{syntax:'<percentage>';inherits:false;initial-value:90%}@property --c-5{syntax:'<color>';inherits:false;initial-value:hsla(222.3529411764706,51%,87%,1)}@property --x-5{syntax:'<percentage>';inherits:false;initial-value:93%}@property --s-start-5{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-5{syntax:'<percentage>';inherits:false;initial-value:22.558651527792346%}@property --s-start-6{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-6{syntax:'<percentage>';inherits:false;initial-value:39.67138181429644%}@property --c-6{syntax:'<color>';inherits:false;initial-value:hsla(187.94117647058826,65%,49%,1)}@property --x-6{syntax:'<percentage>';inherits:false;initial-value:3%}@property --y-6{syntax:'<percentage>';inherits:false;initial-value:61%}@property --x-7{syntax:'<percentage>';inherits:false;initial-value:94%}@property --y-7{syntax:'<percentage>';inherits:false;initial-value:59%}@property --s-start-7{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-7{syntax:'<percentage>';inherits:false;initial-value:49.58090142552271%}@property --c-7{syntax:'<color>';inherits:false;initial-value:hsla(187.77777777777777,64%,49%,1)}@property --y-8{syntax:'<percentage>';inherits:false;initial-value:63%}@property --s-start-8{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-8{syntax:'<percentage>';inherits:false;initial-value:34.815367581495366%}@property --x-8{syntax:'<percentage>';inherits:false;initial-value:48%}@property --c-8{syntax:'<color>';inherits:false;initial-value:hsla(278.1617647058826,100%,79%,1)}@property --y-9{syntax:'<percentage>';inherits:false;initial-value:78%}@property --c-9{syntax:'<color>';inherits:false;initial-value:hsla(281.25,93%,83%,1)}@property --x-9{syntax:'<percentage>';inherits:false;initial-value:96%}@property --s-start-9{syntax:'<percentage>';inherits:false;initial-value:8.392121895570533%}@property --s-end-9{syntax:'<percentage>';inherits:false;initial-value:31.77166380372925%}.your_css_selector_here{--y-0:63%;--c-0:hsla(191.91176470588252,64%,76%,1);--x-0:93%;--y-1:-7%;--c-1:hsla(222.35294117647067,51%,87%,1);--x-1:33%;--y-2:7%;--x-2:84%;--c-2:hsla(222.3529411764706,51%,87%,1);--c-3:hsla(222.3529411764706,51%,87%,1);--x-3:14%;--y-3:5%;--y-4:96%;--c-4:hsla(222.3529411764706,51%,87%,1);--x-4:7%;--y-5:90%;--c-5:hsla(222.3529411764706,51%,87%,1);--x-5:93%;--c-6:hsla(187.94117647058826,65%,49%,1);--x-6:3%;--y-6:61%;--x-7:94%;--y-7:59%;--c-7:hsla(187.77777777777777,64%,49%,1);--y-8:63%;--x-8:48%;--c-8:hsla(278.1617647058826,100%,79%,1);--y-9:78%;--c-9:hsla(281.25,93%,83%,1);--x-9:96%;;background-color:hsla(222.3529411764706,51%,87%,1);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 1648 1648' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E"),radial-gradient(circle at var(--x-0) var(--y-0), var(--c-0) var(--s-start-0),transparent var(--s-end-0)),radial-gradient(circle at var(--x-1) var(--y-1), var(--c-1) var(--s-start-1),transparent var(--s-end-1)),radial-gradient(circle at var(--x-2) var(--y-2), var(--c-2) var(--s-start-2),transparent var(--s-end-2)),radial-gradient(circle at var(--x-3) var(--y-3), var(--c-3) var(--s-start-3),transparent var(--s-end-3)),radial-gradient(circle at var(--x-4) var(--y-4), var(--c-4) var(--s-start-4),transparent var(--s-end-4)),radial-gradient(circle at var(--x-5) var(--y-5), var(--c-5) var(--s-start-5),transparent var(--s-end-5)),radial-gradient(circle at var(--x-6) var(--y-6), var(--c-6) var(--s-start-6),transparent var(--s-end-6)),radial-gradient(circle at var(--x-7) var(--y-7), var(--c-7) var(--s-start-7),transparent var(--s-end-7)),radial-gradient(circle at var(--x-8) var(--y-8), var(--c-8) var(--s-start-8),transparent var(--s-end-8)),radial-gradient(circle at var(--x-9) var(--y-9), var(--c-9) var(--s-start-9),transparent var(--s-end-9));animation:hero-gradient-animation 10s linear infinite alternate;background-blend-mode:overlay,normal,normal,normal,normal,normal,normal,normal,normal,normal,normal;}