html {
    scroll-behavior: smooth;
}

:root {
    --violet-1: #c084fc;
    --violet-2: #a855f7;
    --violet-3: #7c3aed;
    --violet-4: #5b21b6;
    --bg-900: #0b0614;
    --bg-800: #12081f;
    --bg-700: #1a0f2e;
    --text-100: #ffffff;
    --text-200: #d4c7ff;
    --muted: #9a8fd1;
    --card-bg: rgba(255, 255, 255, 0.04);
    --card-border: rgba(255, 255, 255, 0.08);
    --glow: 124, 58, 237;
}

.boldhighlight {
    color: var(--violet-1) !important;
}

.pink {
    color: var(--violet-1);
}

body {
    background: var(--bg-900);
    color: var(--text-100);
    font-family: Inter;
    overflow-x: hidden;
}

.media-image img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 12px;
    margin-bottom: 25px;
}

.media-card {
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    padding: 20px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}

.linkscta {
    text-decoration: none;
    color: var(--violet-1);
}

.linkscta:hover {
    text-decoration: underline !important;
    font-weight: bold;
    transition: transform 25s ease;
    color: var(--violet-3);
}

body {
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(white 1px, transparent 1px);
    background-size: 3px 3px;
    opacity: .05;
    z-index: -3;
}

.navbar {
    background: rgba(0, 0, 0, .4);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, .06);
}

.navbar-brand {
    font-weight: 700;
    color: var(--violet-1) !important;
    outline: none !important;
    border: none !important;
}

.nav-link {
    color: #ccc !important;
    font-size: 14px;
    margin-right: 10px;
}

.nav-link:hover {
    color: var(--violet-1) !important;
}

.dropdown-menu {
    background: #0b0c0d;
    border: 1px solid rgba(255, 255, 255, .08);
}

.dropdown-item {
    color: #bbb;
}

.dropdown-item:hover {
    background: #0f1112;
    color: var(--violet-1);
}

.navbar.scrolled {
    background: rgba(10, 6, 20, .78);
    border-bottom-color: rgba(255, 255, 255, .12);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
}

.nav-social {
    display: flex;
    align-items: center;
    justify-content: center;
}

.nav-linkedin {
    width: 34px;
    text-decoration: none !important;
    height: 34px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    box-shadow: 0 10px 30px rgba(var(--glow), .25);
    background: var(--violet-3);
    color: #fff;
    font-size: 13px;
    backdrop-filter: blur(6px);
    border: 1px solid var(--violet-2);
    transition: background .25s ease,
        border-color .25s ease,
        box-shadow .25s ease,
        transform .25s ease,
        color .25s ease;
}

.nav-linkedin i {
    display: inline-block;
    transition: transform .25s ease;
}

.nav-linkedin:hover {
    border-color: var(--violet-1);
    transform: translateY(-2px);
    color: #fff;
    background: var(--violet-2);
    box-shadow: 0 14px 36px rgba(var(--glow), .65);
}

.nav-linkedin:hover i {
    animation: navLinkedinWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

@keyframes navLinkedinWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

.nav-linkedin:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(155, 107, 255, .35);
}

.hero {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    padding-top: 80px;
}

@media (max-width:768px) {
    .hero {
        height: auto;
        padding: 120px 0;
    }
}

.orb1 {
    position: absolute;
    width: 700px;
    height: 700px;
    background: radial-gradient(circle, var(--violet-2), transparent 60%);
    filter: blur(160px);
    opacity: .35;
    top: 120px;
    left: 40%;
    animation: float1 14s ease-in-out infinite alternate;
    z-index: -1;
}

.orb2 {
    position: absolute;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--violet-3), transparent 60%);
    filter: blur(150px);
    opacity: .25;
    top: 200px;
    left: 60%;
    animation: float2 12s ease-in-out infinite alternate;
    z-index: -1;
}

@keyframes float1 {
    0% {
        transform: translateX(-50px) scale(1)
    }

    100% {
        transform: translateX(40px) scale(1.2)
    }
}

@keyframes float2 {
    0% {
        transform: translateY(-20px)
    }

    100% {
        transform: translateY(60px)
    }
}

.hero h1 {
    font-size: 70px;
    font-weight: 700;
}

.hero span {
    color: var(--violet-1);
}

.hero p {
    margin-top: 20px;
    opacity: .8;
    color: var(--muted);
    font-size: 18px;
    max-width: 650px;
    margin-left: auto;
    margin-right: auto;
}

.hero-buttons {
    margin-top: 35px;
}

.hero-buttons .btn {
    padding: 14px 28px;
    border-radius: 30px;
    margin: 8px;
}

.btn-ai {
    background: var(--violet-2);
    color: #0f0a1a;
    font-weight: 600;
    border: none;
    box-shadow: 0 10px 30px rgba(var(--glow), .25);
}

.btn-ai:hover {
    background: var(--violet-3);
    box-shadow: 0 14px 36px rgba(var(--glow), .35);
}

.hero-content {
    max-width: 900px;
    margin: auto;
}

.hero-badge {
    display: inline-block;
    padding: 6px 14px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 20px;
    font-size: 13px;
    letter-spacing: .5px;
    margin-bottom: 25px;
    color: var(--text-200);
}

.hero-title {
    font-size: 72px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -1px;
}

.hero-title span {
    background: linear-gradient(90deg, var(--violet-2), var(--violet-1));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.hero-subtitle {
    margin-top: 24px;
    font-size: 19px;
    opacity: .8;
    color: var(--muted);
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}

.hero-buttons {
    margin-top: 40px;
}

.hero-buttons .btn {
    padding: 15px 30px;
    border-radius: 30px;
    font-size: 15px;
    transition: .3s;
}

.hero-buttons .btn-outline-light {
    border: 1px solid rgba(255, 255, 255, .22);
}

.hero-buttons .btn-outline-light:hover {
    background: white;
    color: black;
}

@media (max-width:768px) {
    .hero-title {
        font-size: 44px;
    }

    .hero-subtitle {
        font-size: 16px;
    }
}

.scroll-indicator {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    opacity: .6;
    font-size: 14px;
    animation: scrollFloat 2s ease-in-out infinite;
}

@keyframes scrollFloat {
    0% {
        transform: translate(-50%, 0)
    }

    50% {
        transform: translate(-50%, 8px)
    }

    100% {
        transform: translate(-50%, 0)
    }
}

.section {
    padding: 120px 0;
}

:root {
    --mint: var(--violet-2);
    --mint-2: var(--violet-3);
    --accent: var(--violet-1);
}

.about-section {
    position: relative;
    padding-top: 160px;
}

.about-section .container {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 70px;
}

@media (max-width: 1200px) {
    .about-section .container {
        padding-left: 20px;
    }
}

@media (max-width: 992px) {
    .about-section .container {
        max-width: 100%;
        padding-left: 60px;
        padding-right: 60px;
    }
}

@media (max-width: 768px) {
    .about-section .container {
        padding-left: 20px;
        padding-right: 20px;
    }
}

.about-headline {
    position: absolute;
    top: 0;
    left: 0;
    font-weight: 800;
    letter-spacing: 2px;
    font-size: min(16vw, 130px);
    line-height: .9;
    color: transparent;
    -webkit-text-stroke: 1.5px rgba(var(--glow), 0.18);
    text-transform: uppercase;
    pointer-events: none;
    user-select: none;
}

.about-stroke {
    font: 800 160px/1 "Inter";
    letter-spacing: .04em;
    fill: transparent;
    stroke: rgba(var(--glow), 0.18);
    stroke-width: 2;
    stroke-linejoin: round;
    stroke-miterlimit: 2;
    paint-order: stroke fill;
}

.about-kicker {
    font-weight: 800;
    color: var(--accent);
    letter-spacing: .6px;
    margin-bottom: 14px;
}

.about-copy {
    opacity: .85;
    color: var(--text-200);
}

.about-cta .btn {
    border-radius: 999px;
    padding: 12px 22px;
}

.about-cta .btn-cta,
.about-cta a.btn-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 22px;
    border-radius: 999px;
    text-decoration: none;
    background: linear-gradient(90deg, var(--violet-2), var(--violet-1));
    color: #0f0a1a;
    font-weight: 700;
    letter-spacing: .2px;
    box-shadow: 0 10px 30px rgba(var(--glow), .22);
    transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}

.about-cta .btn-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 36px rgba(var(--glow), .30);
}

.about-visual {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: radial-gradient(140% 120% at 20% 10%, rgba(255, 255, 255, .06), rgba(0, 0, 0, .0) 60%);
    border: 1px solid rgba(255, 255, 255, .06);
    min-height: 340px;
    box-shadow:
        0 0 40px rgba(0, 0, 0, .35),
        inset 0 0 40px rgba(var(--glow), .10);
}

.about-visual .accent-block {
    position: absolute;
    width: 160px;
    height: 24px;
    background: linear-gradient(90deg, var(--violet-3), var(--violet-2));
    bottom: -12px;
    left: -18px;
    border-radius: 4px;
    filter: blur(0.2px);
}

.about-visual .blobs {
    position: absolute;
    inset: 0;
}

.blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(2px);
    opacity: .88;
    animation: blobFloat 10s ease-in-out infinite alternate;
}

.blob.b1 {
    width: 340px;
    height: 240px;
    left: -40px;
    bottom: -40px;
    background: radial-gradient(closest-side, #fff8 0, rgba(192, 132, 252, .9) 10%, rgba(168, 85, 247, .75) 60%, transparent 70%);
    animation-duration: 12s;
}

.blob.b2 {
    width: 280px;
    height: 280px;
    right: -30px;
    bottom: 10px;
    background: radial-gradient(closest-side, rgba(0, 0, 0, 0) 0, rgba(124, 58, 237, .85) 35%, rgba(124, 58, 237, .55) 65%, transparent 75%);
    animation-duration: 11s;
}

.blob.b3 {
    width: 300px;
    height: 220px;
    left: 110px;
    top: 20px;
    background: radial-gradient(closest-side, rgba(0, 0, 0, 0) 0, rgba(168, 85, 247, .75) 35%, rgba(168, 85, 247, .5) 65%, transparent 75%);
    animation-duration: 13s;
}

@keyframes blobFloat {
    0% {
        transform: translateY(0) translateX(0) scale(1);
    }

    100% {
        transform: translateY(16px) translateX(8px) scale(1.03);
    }
}

.collage-frame {
    position: relative;
    border-radius: 14px;
    overflow: hidden;
    min-height: 340px;
    background: radial-gradient(120% 120% at 100% 0%, rgba(var(--glow), .16), rgba(0, 0, 0, 0) 60%);
}

.shot {
    position: absolute;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .35);
    background-size: cover;
    background-position: center;
}

.shot.s1 {
    left: 6%;
    top: 10%;
    width: 48%;
    height: 58%;
    transform: rotate(-3deg);
}

.shot.s2 {
    right: 6%;
    top: 6%;
    width: 46%;
    height: 52%;
    transform: rotate(2deg);
}

.shot.s3 {
    left: 22%;
    bottom: 8%;
    width: 56%;
    height: 50%;
    transform: rotate(1deg);
}

.accent-bar {
    position: absolute;
    bottom: -10px;
    left: 18px;
    width: 150px;
    height: 10px;
    background: linear-gradient(90deg, var(--violet-3), var(--violet-2));
    border-radius: 10px;
}

@media (max-width: 992px) {
    .about-section {
        padding-top: 120px;
    }

    .about-headline {
        font-size: 22vw;
    }
}

@media (max-width: 768px) {
    .about-section {
        padding-top: 90px;
    }

    .about-headline {
        font-size: 26vw;
        left: 10px;
    }

    .about-visual {
        margin-top: 30px;
        min-height: 260px;
    }

    .collage-frame {
        min-height: 260px;
    }

    .shot {
        border-radius: 10px;
    }
}

.about-stroke {
    font-size: 240px;
}

.about-headline {
    height: 240px;
}

.process-card {
    position: relative;
    padding: 40px;
    border-radius: 16px;
    background: linear-gradient(180deg, rgba(var(--glow), .12), rgba(0, 0, 0, .5));
    border: 1px solid rgba(255, 255, 255, .07);
    transition: .4s;
    overflow: hidden;
    box-shadow: 0 0 40px rgba(var(--glow), .08), inset 0 0 40px rgba(var(--glow), .04);
}

.process-card:hover {
    transform: translateY(-8px);
    border-color: var(--violet-2);
    box-shadow: 0 0 60px rgba(var(--glow), .22);
}

.big-number {
    position: absolute;
    right: 15px;
    bottom: -40px;
    font-size: 180px;
    font-weight: 700;
    color: var(--violet-2);
    opacity: .07;
}

.faq-card {
    background: linear-gradient(180deg, rgba(var(--glow), .10), rgba(0, 0, 0, .55));
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 14px;
    margin-bottom: 18px;
    overflow: hidden;
    transition: .35s;
    box-shadow: 0 0 30px rgba(var(--glow), .08), inset 0 0 20px rgba(var(--glow), .04);
}

.faq-card.active {
    border-color: var(--violet-2);
    box-shadow: 0 0 45px rgba(var(--glow), .22), inset 0 0 22px rgba(var(--glow), .07);
}

.faq-question {
    padding: 22px 26px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-weight: 600;
    transition: background-color .2s ease, color .2s ease;
}

.faq-question:hover {
    background: rgba(var(--glow), .07);
}

.faq-question i {
    transition: .3s;
    color: var(--violet-2);
}

.faq-card.active i {
    transform: rotate(180deg);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    padding: 0 26px;
    opacity: .75;
    transition: max-height .45s ease, padding .35s ease;
}

.faq-card.active .faq-answer {
    max-height: 200px;
    padding: 0 26px 24px 26px;
}

.faq-section {
    position: relative;
    overflow: hidden;
}

.faq-bg-text {
    position: absolute;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 220px;
    font-weight: 800;
    letter-spacing: -6px;
    color: rgba(255, 255, 255, 0.03);
    pointer-events: none;
    user-select: none;
    z-index: 0;
}

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

.faq-label {
    font-size: 14px;
    color: var(--violet-2);
    font-weight: 600;
}

.faq-intro h2 {
    font-size: 42px;
    font-weight: 700;
    margin: 14px 0;
}

.faq-intro h2 span {
    color: var(--violet-2);
}

.faq-intro p {
    opacity: .7;
    max-width: 420px;
    color: var(--text-200);
}

.col-lg-7 .faq-card {
    margin-bottom: 16px;
}

@media (max-width: 991px) {
    .faq-bg-text {
        font-size: 120px;
        top: -10px;
    }

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

.faq-bg-text {
    position: absolute;
    top: -40px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 220px;
    font-weight: 800;
    letter-spacing: -6px;
    color: rgba(255, 255, 255, 0.03);
    pointer-events: none;
    user-select: none;
    z-index: 0;
    transition: transform .1s linear;
}

.faq-card {
    position: relative;
    backdrop-filter: blur(14px);
    background: linear-gradient(145deg,
            rgba(255, 255, 255, 0.04),
            rgba(0, 0, 0, 0.5));
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    margin-bottom: 18px;
    overflow: hidden;
    transition:
        transform .35s ease,
        box-shadow .35s ease,
        border .35s ease;
    box-shadow:
        0 0 25px rgba(var(--glow), .08),
        inset 0 0 25px rgba(var(--glow), .03);
}

.faq-card:hover {
    transform: translateY(-6px);
    border-color: var(--violet-2);
    box-shadow: 0 0 45px rgba(var(--glow), .22);
}

.faq-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(90deg,
            transparent,
            rgba(var(--glow), .8),
            transparent);
    opacity: .5;
}

.faq-question i {
    transition: transform .35s ease;
}

.faq-card.active i {
    transform: rotate(180deg) scale(1.1);
}

.faq-bg-text {
    position: absolute;
    top: -60px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 240px;
    font-weight: 900;
    letter-spacing: -6px;
    color: rgba(255, 255, 255, 0.28);
    pointer-events: none;
    user-select: none;
    z-index: 0;
    -webkit-mask-image: linear-gradient(to bottom,
            transparent 0%,
            white 40%,
            white 70%,
            transparent 100%);
    mask-image: linear-gradient(to bottom,
            transparent 0%,
            white 40%,
            white 70%,
            transparent 100%);
    filter: blur(5px);
    transform: translateX(-50%) scaleX(1.05);
}

.faq-section {
    position: relative;
    padding: 140px 0;
}

.faq-intro,
.faq-card {
    position: relative;
    z-index: 2;
}

.faq-btn {
    display: inline-block;
    margin-top: 25px;
    padding: 15px 30px;
    border-radius: 30px;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, .22);
    color: white;
    font-weight: 600;
    text-decoration: none;
    transition: all .3s ease;
    box-shadow:
        0 0 20px rgba(var(--glow), .3);
}

.faq-btn:hover {
    transform: translateY(-2px);
    background: white;
    color: #000;
    box-shadow:
        0 10px 25px rgba(var(--glow), .5);
}

.faq-section::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 900px;
    height: 500px;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle,
            rgba(var(--glow), 0.15),
            transparent 70%);
    filter: blur(80px);
    z-index: 0;
}

.faq-btn i {
    display: inline-block;
    transition: transform .25s ease;
}

.faq-btn:hover i {
    animation: faqIconWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

@keyframes faqIconWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

.hero .btn.btn-ai {
    color: #fff;
}

.hero .btn.btn-ai i {
    display: inline-block;
    transition: transform .25s ease;
}

.hero .btn.btn-ai:hover i {
    animation: heroIconWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

@keyframes heroIconWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

.hero .btn.btn-ai:hover {
    border-color: var(--violet-1, #9b6bff);
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(140, 80, 255, .35);
}

.hero .btn.btn-ai:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(155, 107, 255, .35);
}

.hero .btn.btn-outline-light i {
    display: inline-block;
    transition: transform .25s ease;
}

.hero .btn.btn-outline-light:hover i {
    animation: heroCtaWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

@keyframes heroCtaWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

.about-cta-link i {
    display: inline-block;
    transition: transform .25s ease;
}

.about-cta-link:hover i {
    animation: aboutCtaWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

@keyframes aboutCtaWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

footer {
    background: #020202;
    padding: 60px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.068);
    box-shadow: 0 0 20px rgba(var(--glow), .1);

}

.footer-logo {
    font-size: 24px;
    font-weight: 700;
    color: var(--violet-2);
}

.footer-links a {
    color: #aaa;
    text-decoration: none;
    margin: 0 12px;
    font-size: 14px;
}

.footer-links a:hover {
    color: var(--violet-2);
}

.footer-social i {
    margin: 0 10px;
    color: #aaa;
    cursor: pointer;
}

.footer-social i:hover {
    color: var(--violet-2);
}


/* ===========================================
   FOOTER — VIOLET + EU BLOCK (image layout)
=========================================== */

.logoandeuflag {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 60px;
    padding: 10px 0;
    flex-wrap: wrap;
    text-align: left;
}

/* LEFT — VIOLET LOGO */
.logoandeuflag .footer-logo img {
    max-width: 180px;
    height: auto;
    display: block;
}

/* RIGHT — EU FLAG + DISCLAIMER */
.logoandeuflag>div img {
    display: block;
    margin-bottom: 12px;
}

/* EU Disclaimer text */
.logoandeuflag p {
    font-size: 10px;
    line-height: 1.55;
    max-width: 460px;
    opacity: 0.85;
    margin: 0;
    text-align: justify;
}

/* Prevent stretching */
.logoandeuflag>div:nth-child(2) {
    max-width: 520px;
}

/* FOOTER — animated VIOLET logo */
.footer-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    animation: footerFloat 6s ease-in-out infinite;
    padding: 10px;
    border-radius: 20px;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.footer-logo img {
    display: block;
    max-width: 150px;
    height: auto;
    filter: drop-shadow(0 0 18px rgba(140, 80, 255, .32));
    transition: transform .25s ease, filter .25s ease;
}

/* Hover: same glow behaviour */
.footer-logo:hover {
    transform: translateY(-4px);
}

.footer-logo:hover img {
    transform: translateY(-2px);
    filter: drop-shadow(0 0 26px rgba(140, 80, 255, .45));
}

/* Floating animation */
@keyframes footerFloat {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-8px);
    }

    100% {
        transform: translateY(0);
    }
}

/* Responsive adjustments */
@media (max-width: 992px) {
    .footer-logo img {
        max-width: 130px;
    }
}

@media (max-width: 480px) {
    .footer-logo img {
        max-width: 110px;
    }
}



/* ===========================================
   RESPONSIVE
=========================================== */

/* Tablet */
@media (max-width: 992px) {
    .logoandeuflag {
        flex-direction: column;
        align-items: center;
        text-align: center;
        gap: 30px;
    }

    .logoandeuflag>div:nth-child(2) p {
        text-align: center;
    }
}

/* Small mobile */
@media (max-width: 480px) {
    .logoandeuflag .footer-logo img {
        max-width: 150px;
    }

    .logoandeuflag>div img {
        max-width: 160px;
    }

    .logoandeuflag p {
        font-size: 12px;
    }
}



.copyright {
    opacity: .5;
    font-size: 13px;
    margin-top: 18px;
}

@media (prefers-reduced-motion: reduce) {
    * {
        animation: none !important;
        transition: none !important;
    }
}

.cursor-glow {
    position: fixed;
    width: 320px;
    height: 320px;
    pointer-events: none;
    border-radius: 50%;
    background: radial-gradient(closest-side,
            rgba(var(--glow), 0.18),
            rgba(var(--glow), 0.08) 40%,
            rgba(var(--glow), 0) 70%);
    filter: blur(12px);
    mix-blend-mode: screen;
    z-index: 0;
    transform: translate3d(-9999px, -9999px, 0);
}

#scrollIndicator {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    opacity: .8;
    font-size: 14px;
    cursor: pointer;
    user-select: none;
    transition: opacity .25s ease, transform .25s ease;
}

#scrollIndicator::after {
    content: "";
    display: block;
    margin: 6px auto 0;
    height: 2px;
    width: 0;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--violet-3), var(--violet-1));
    box-shadow: 0 0 12px rgba(var(--glow), .35);
    transition: width .35s ease;
}

#scrollIndicator:hover {
    opacity: 1;
    transform: translateX(-50%) translateY(-1px);
    color: var(--violet-1);
}

#scrollIndicator:hover::after {
    width: 58px;
}

#scrollIndicator {
    animation: scrollFloat 2s ease-in-out infinite;
}

.hero-title {
    font-size: 74px;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -1.5px;
    margin-bottom: 10px;
}

.hero-title span {
    background: linear-gradient(90deg,
            var(--violet-1) 0%,
            var(--violet-2) 35%,
            #ffffff 50%,
            var(--violet-2) 65%,
            var(--violet-1) 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: gradientShift 8s linear infinite;
}

@keyframes gradientShift {
    to {
        background-position: 200% center;
    }
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 16px;
    background: linear-gradient(120deg,
            rgba(255, 255, 255, .08),
            rgba(var(--glow), .12));
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 30px;
    font-size: 13px;
    letter-spacing: .4px;
    backdrop-filter: blur(10px);
    box-shadow:
        0 0 20px rgba(var(--glow), .15),
        inset 0 0 12px rgba(var(--glow), .08);
}

.nav-link {
    position: relative;
    color: #ccc !important;
    font-size: 14px;
    margin-right: 10px;
    padding-bottom: 6px;
}

.nav-link::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, var(--violet-3), var(--violet-1));
    box-shadow: 0 0 10px rgba(var(--glow), .4);
    transition: width .35s ease;
}

.nav-link:hover {
    color: var(--violet-1) !important;
}

.nav-link:hover::after {
    width: 100%;
}

.nav-link:hover {
    color: var(--violet-1) !important;
    text-shadow: 0 0 10px rgba(var(--glow), .35);
}

.nav-link,
.navbar .dropdown-toggle {
    position: relative;
    display: inline-block;
    color: #ccc !important;
    font-size: 14px;
    padding-bottom: 6px;
    transition: .25s;
}

.navbar .nav-link::after,
.navbar .dropdown-toggle::before {
    content: "";
    position: absolute;
    bottom: -4px;
    height: 2px;
    width: 0;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 2px;
    background: linear-gradient(90deg, var(--violet-3), var(--violet-1));
    box-shadow: 0 0 8px rgba(var(--glow), .35), 0 0 16px rgba(var(--glow), .25);
    transition: width .35s ease;
    z-index: 2;
}

.navbar .nav-link:hover::after,
.navbar .dropdown-toggle:hover::before {
    width: 100%;
    left: 0;
    transform: translateX(0);
}

.navbar .dropdown-toggle::after {
    display: none !important;
}

.navbar .nav-link,
.navbar .dropdown-toggle {
    position: relative;
    z-index: 2;
}

.dropdown-menu {
    z-index: 1;
}

.navbar .nav-link:hover,
.navbar .dropdown-toggle:hover {
    color: var(--violet-1) !important;
}

.about-v2 .about-headline {
    z-index: 0;
}

.about-eyebrow {
    font-weight: 800;
    font-size: 12px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--accent);
    opacity: .9;
    margin-bottom: 10px;
}

.about-title {
    font-size: clamp(28px, 4vw, 44px);
    font-weight: 800;
    letter-spacing: -.5px;
    line-height: 1.15;
    margin: 0 0 10px 0;
}

.about-title span {
    background: linear-gradient(90deg, var(--violet-1), var(--violet-2));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.about-lead {
    color: var(--text-200);
    opacity: .9;
    font-size: 1.05rem;
    max-width: 860px;
}

.about-cta-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    font-weight: 700;
    color: var(--violet-1);
    text-decoration: none;
    transition: .25s ease;
}

.about-cta-link:hover {
    color: var(--violet-3);
    text-shadow: 0 0 12px rgba(var(--glow), .25);
}

.about-cta-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    font-weight: 700;
    color: var(--violet-1);
    text-decoration: none;
    position: relative;
    transition: .25s ease;
}

.about-cta-link::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 70%;
    height: 2px;
    background: linear-gradient(90deg, var(--violet-3), var(--violet-1));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .25s ease;
}

.about-cta-link:hover {
    color: var(--violet-3);
    text-shadow: 0 0 12px rgba(var(--glow), .25);
}

.about-cta-link:hover::after {
    transform: scaleX(1);
}

.about-kpis .kpi-card {
    background: linear-gradient(180deg, rgba(var(--glow), .12), rgba(0, 0, 0, .45));
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 14px;
    padding: 18px 16px;
    height: 100%;
    box-shadow:
        0 0 30px rgba(var(--glow), .08),
        inset 0 0 18px rgba(var(--glow), .05);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.about-kpis .kpi-card:hover {
    transform: translateY(-4px);
    border-color: var(--violet-2);
    box-shadow: 0 0 45px rgba(var(--glow), .22);
}

.kpi-number {
    font-size: clamp(22px, 3.6vw, 32px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -.5px;
    transition: 0.3s ease;
}

.kpi-label {
    font-size: 13px;
    color: var(--text-200);
    opacity: .9;
}

.about-hero-imgwrap {
    margin-top: 50px !important;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .07);
    background:
        radial-gradient(140% 120% at 20% 10%, rgba(255, 255, 255, .06), rgba(0, 0, 0, 0) 60%),
        linear-gradient(180deg, rgba(var(--glow), .10), rgba(0, 0, 0, .5));
    box-shadow:
        0 16px 40px rgba(0, 0, 0, .35),
        inset 0 0 28px rgba(var(--glow), .08);
}

.about-hero-img {
    display: block;
    width: 100%;
    height: auto;
}

.about-hero-img {
    width: 100%;
    height: 380px;
    object-fit: cover;
    object-position: center;
    border-radius: 18px;
}

.about-image-parallax {
    width: 100%;
    height: 350px;
    border-radius: 18px;
    background-image: url("../imgs/about-img5.jpeg");
    /* background-size: cover;
    */
    background-size: 130% auto;
    background-position: center;
    /*background-attachment: fixed;*/
    background-repeat: no-repeat;
    border: 1px solid rgba(255, 255, 255, .07);
    box-shadow: 0 8px 25px rgba(0, 0, 0, .25);
}


@media (max-width: 950px) {

    .about-image-parallax {
        background-size: 180% auto;
    }

    .kpi-number {
        font-size: 24px;
    }
}


@media (max-width: 768px) {
    .about-hero-img {
        height: 260px;
    }

    .about-image-parallax {
        background-size: cover !important;
        background-position: center !important;
    }

}

.fade-up {
    opacity: 0;
    transform: translateY(12px);
    transition: .6s ease;
}

.fade-up.show {
    opacity: 1;
    transform: none;
}

@media (max-width: 992px) {
    .about-cta-link {
        margin-top: 6px;
    }
}

@media (max-width: 576px) {
    .about-kpis .kpi-card {
        padding: 16px 14px;
    }
}

#process .row.g-4 {
    --bs-gutter-x: 2.75rem;
    --bs-gutter-y: 2rem;
}

#process .row.g-4>[class*="col-"] {
    display: flex;
    justify-content: center;
}

.process-card.process-card--print {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    display: block;
    width: 100%;
    max-width: 380px;
    min-height: 430px;
    padding: 0;
    isolation: isolate;
    background:
        var(--card-bg) center/cover no-repeat,
        linear-gradient(180deg, rgba(var(--glow), .12), rgba(0, 0, 0, .5));
    background-clip: padding-box;
    outline: 1px solid transparent;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
    transition: transform .3s ease;
}

.process-card.process-card--print::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(to bottom,
            rgba(124, 58, 237, 0.00) 0%,
            rgba(124, 58, 237, 0.20) 35%,
            rgba(91, 33, 182, 1) 65%,
            rgba(11, 6, 20, 1) 100%);
    z-index: 0;
    pointer-events: none;
}


.process-card.process-card--print:hover {
    transform: translateY(-6px);
    border-color: var(--violet-2);
    box-shadow: 0 0 45px rgba(var(--glow), .22);
}

.process-card--print .process-icon {
    position: absolute;
    top: 18px;
    left: 18px;
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1.5px solid rgba(255, 255, 255, 0.35);
    color: var(--violet-1);
    font-size: 20px;
    box-shadow:
        0 0 12px rgba(0, 0, 0, 0.45),
        0 0 6px rgba(124, 58, 237, 0.5);
    z-index: 2;
}

.process-card--print .process-content {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 24px;
    z-index: 2;
}

.process-card--print .process-title {
    margin: 0 0 10px 0;
    font-weight: 700;
}

.process-card--print .process-list {
    margin: 0;
    padding-left: 18px;
}

.process-card--print .process-list li {
    font-size: 14px;
    line-height: 1.55;
    margin-bottom: 8px;
    opacity: .95;
}

@media (min-width: 1400px) {
    #process .process-card.process-card--print {
        max-width: 380px;
    }
}

@media (max-width: 991.98px) {
    #process .row.g-4>[class*="col-"] {
        flex: 0 0 100%;
        max-width: 100%;
        justify-content: center;
    }

    #process .row.g-4 {
        --bs-gutter-x: 1rem;
        --bs-gutter-y: 1.5rem;
    }

    #process .process-card.process-card--print {
        max-width: 640px;
        min-height: 380px;
    }
}

@media (max-width: 575.98px) {
    #process .process-card.process-card--print {
        max-width: 100%;
        min-height: 320px;
    }

    .process-card.process-card--print::after {
        background: linear-gradient(to bottom, rgb(124 58 237 / 64%) 0%, rgba(124, 58, 237, 0.20) 35%, rgb(91 33 182 / 42%) 65%, rgb(11 6 20 / 39%) 100%) !important
    }


    .process-card--print .process-content {
        position: static;
        margin: 16px;
    }

    .process-card--print .process-icon {
        position: static;
        margin: 16px 16px 0;
    }
}

.process-card {
    transition: .25s ease;
    position: relative;
}

.process-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 0 38px rgba(var(--glow), .25);
    border-color: rgba(160, 90, 255, .35);
}

.process-icon i {
    display: inline-block;
    transition: transform .25s ease;
}

.process-card:hover .process-icon i {
    animation: processIconWiggle .6s ease-in-out 1;
    transform: translateX(4px);
}

@keyframes processIconWiggle {
    0% {
        transform: translateX(4px) rotate(0deg);
    }

    25% {
        transform: translateX(6px) rotate(6deg);
    }

    50% {
        transform: translateX(5px) rotate(-6deg);
    }

    75% {
        transform: translateX(6px) rotate(4deg);
    }

    100% {
        transform: translateX(4px) rotate(0deg);
    }
}

hr.space {
    border: none;
    height: 40px;
}

.pdtnone {
    padding-top: 0px;
}

.pbshort {
    padding-bottom: 70px;
}

.navbar {
    background: transparent !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: none !important;
}

.navbar.scrolled {
    background: rgba(10, 6, 20, 0.35);
    border-bottom-color: rgba(255, 255, 255, 0.12);
}

@media (min-width: 992px) {
    #impact .about-kpis {
        margin-top: 6px;
    }
}

.violet-logo-float {
    position: relative;
    width: 260px;
    height: auto;
    animation: violetFloat 4s ease-in-out infinite;
    filter: drop-shadow(0 0 25px rgba(165, 90, 255, 0.45));
    transition: transform .4s ease, filter .4s ease;
}

.violet-logo-float img {
    width: 100%;
    height: auto;
}

.violet-logo-float:hover {
    transform: scale(1.05);
    filter: drop-shadow(0 0 32px rgba(165, 90, 255, 0.7));
}

@keyframes violetFloat {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-12px);
    }

    100% {
        transform: translateY(0);
    }
}

.violet-btn-cta {
    background: linear-gradient(90deg, var(--violet-3), var(--violet-1));
    border: none;
    padding: 12px 22px;
    font-weight: 600;
    border-radius: 8px;
    transition: .25s ease;
}

.violet-btn-cta:hover {
    transform: translateY(-3px);
    filter: drop-shadow(0 0 12px rgba(165, 90, 255, 0.55));
}

.violet-logo-float.big {
    width: 390px;
    max-width: 420px;
    position: relative;
    animation: violetFloat 4s ease-in-out infinite;
    filter: drop-shadow(0 0 32px rgba(165, 90, 255, 0.55));
    transition: transform .4s ease, filter .4s ease;
}

.violet-logo-float.bigv2 {
    width: 300px;
}

.druby {
    display: ruby;
}

.violet-logo-float.big img {
    width: 100%;
    height: auto;
}

.violet-logo-float.big:hover {
    transform: scale(1.05);
    filter: drop-shadow(0 0 40px rgba(165, 90, 255, 0.75));
}

@keyframes violetFloat {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-14px);
    }

    100% {
        transform: translateY(0);
    }
}

#objectives .col-lg-5 {
    display: flex;
    align-items: center;
    justify-content: center;
}

.violet-btn-outline {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 26px;
    font-weight: 600;
    text-decoration: none;
    color: #fff;
    border: 2px solid rgba(255, 255, 255, 0.45);
    border-radius: 8px;
    transition: all .25s ease;
    backdrop-filter: blur(4px);
}

.violet-btn-outline i {
    transition: transform .25s ease;
}

.violet-btn-outline:hover {
    color: #fff;
    border-color: rgba(255, 255, 255, 0.8);
    box-shadow: 0 0 18px rgba(165, 90, 255, 0.55);
    transform: translateY(-2px);
}

.violet-btn-outline:hover i {
    transform: translateX(4px);
}

.violet-pill-btn {
    border-radius: 50px !important;
    padding: 12px 32px;
    font-weight: 600;
    transition: all .25s ease;
    margin-top: 30px !important;
}

.violet-pill-btn:hover i {
    transform: translateX(4px);
    transition: transform .25s ease;
}

.violet-pill-btn {
    border-radius: 50px !important;
    padding: 12px 32px;
    font-weight: 600;
    transition: all .25s ease;
}

.violet-pill-btn i {
    display: inline-block;
    transition: transform .25s ease;
}

.violet-pill-btn:hover i {
    animation: arrowWiggle .6s ease-in-out 1;
    transform: translateX(4px);
}

.violet-pill-btn:focus i {
    transform: translateX(4px);
}

@keyframes arrowWiggle {
    0% {
        transform: translateX(4px) rotate(0deg);
    }

    25% {
        transform: translateX(6px) rotate(6deg);
    }

    50% {
        transform: translateX(5px) rotate(-5deg);
    }

    75% {
        transform: translateX(6px) rotate(4deg);
    }

    100% {
        transform: translateX(4px) rotate(0deg);
    }
}

@media (prefers-reduced-motion: reduce) {

    .violet-pill-btn:hover i,
    .violet-pill-btn:focus i {
        animation: none !important;
        transform: translateX(4px);
    }
}

#innovation .col-lg-6 .faq-card {
    width: 100%;
    margin-bottom: 16px;
}

#innovation .col-lg-6:first-child {
    padding-right: 20px;
}

#innovation .faq-question {
    font-weight: 700;
}

.navbar .nav-link.active,
.navbar .dropdown-toggle.active {
    font-weight: 500;
    color: var(--violet-1) !important;
}

.navbar .nav-link.active::after,
.navbar .dropdown-toggle.active::before {
    width: 0 !important;
    opacity: 0 !important;
}

.violet-wp-flow {
    position: relative;
    padding: 40px 0 20px 0;
    display: flex;
    align-items: center;
    gap: 20px;
}

.violet-wp-flow .wp-line {
    flex: 1;
    height: 3px;
    background: linear-gradient(90deg, rgba(140, 80, 255, .4), rgba(140, 80, 255, .8));
    box-shadow: 0 0 12px rgba(162, 96, 255, .5);
}

.wp-node {
    width: 58px;
    height: 58px;
    background: #0e0c23;
    border: 2px solid rgba(255, 255, 255, .15);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: #fff;
    box-shadow: 0 0 18px rgba(162, 96, 255, .4);
}

.wp-cards {
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 25px;
    flex-wrap: nowrap;
}

.wp-card {
    width: 160px;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 14px;
    padding: 18px 12px;
    text-align: center;
    box-shadow: 0 0 18px rgba(162, 96, 255, .15);
    backdrop-filter: blur(6px);
    transition: .25s ease;
    cursor: pointer;
}

.wp-card:hover {
    border-color: var(--violet-2);
    box-shadow: 0 0 45px rgba(var(--glow), .22);
}

.wp-icon {
    font-size: 26px;
    color: #c79cff;
    margin-bottom: 10px;
}

.wp-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 6px;
    color: #fff;
}

.wp-card p {
    font-size: 14px;
    opacity: .8;
    margin: 0;
}

@media (max-width: 768px) {
    .violet-wp-flow {
        flex-direction: column;
    }

    .violet-wp-flow .wp-line {
        display: none;
    }

    .wp-cards {
        overflow-x: auto;
        padding-bottom: 10px;
        scrollbar-width: thin;
    }

    .wp-card {
        flex: 0 0 170px;
    }

    .wp-node {
        margin: 8px 0;
    }
}

@media (max-width: 992px) {

    .wp-node,
    .wp-line {
        display: none !important;
    }

    .wp-cards {
        flex-direction: column;
        gap: 16px;
        width: 100%;
        padding: 0;
    }

    .wp-card {
        width: 100%;
        max-width: 100%;
    }

    .wp-tooltip {
        display: none !important;
    }
}

@media (max-width: 992px) {

    .wp-node,
    .wp-line {
        display: none !important;
    }

    .wp-cards {
        flex-direction: column !important;
        gap: 20px;
        width: 100%;
        padding: 0;
        align-items: center;
    }

    .wp-card {
        width: 75% !important;
        max-width: 600px;
        padding: 24px 22px;
        border-radius: 18px;
    }

    .wp-card::after {
        content: attr(data-desc);
        display: block;
        margin-top: 12px;
        font-size: 14px;
        color: rgba(255, 255, 255, 0.85);
        line-height: 1.5;
        text-align: center;
    }

    .wp-tooltip {
        display: none !important;
    }
}

.wp-tooltip {
    position: absolute;
    min-width: 280px;
    max-width: 310px;
    padding: 16px 20px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 14px;
    backdrop-filter: blur(10px);
    box-shadow: 0 0 22px rgba(150, 90, 255, 0.35);
    color: #fff;
    z-index: 9999;
    margin-top: 5px;
    opacity: 0;
    pointer-events: none;
    transform: translate(-50%, -6px);
    transition: opacity .18s ease, transform .18s ease;
}

.wp-tooltip.show {
    opacity: 1;
    transform: translate(-50%, 0);
}

.wp-tooltip h4 {
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 6px 0;
}

.wp-tooltip p {
    font-size: 14px;
    opacity: .85;
    margin: 0;
    line-height: 1.45;
}

.wp-card .wp-icon i {
    display: inline-block;
    transition: transform .25s ease;
}

.wp-card:hover .wp-icon i {
    animation: wpIconWiggle .6s ease-in-out 1;
    transform: translateX(4px);
}

@keyframes wpIconWiggle {
    0% {
        transform: translateX(4px) rotate(0deg);
    }

    25% {
        transform: translateX(6px) rotate(6deg);
    }

    50% {
        transform: translateX(5px) rotate(-5deg);
    }

    75% {
        transform: translateX(6px) rotate(4deg);
    }

    100% {
        transform: translateX(4px) rotate(0deg);
    }
}

#implementation .about-eyebrow,
#implementation .about-title {
    text-align: center;
}

#implementation .implementation-intro {
    max-width: 780px;
    margin: 0 auto;
    opacity: .85;
}

#impact {
    margin-top: 80px;
    margin-bottom: 60px;
}

#impact .impact-header-row {
    display: flex;
    align-items: flex-start;
    margin-bottom: 36px;
}

#impact .impact-header-row .about-eyebrow,
#impact .impact-header-row .about-title,
#impact .impact-header-row .impact-intro-text {
    text-align: left;
}

.impact-intro-text {
    color: var(--text-200);
    opacity: .9;
    font-size: 1.05rem;
    line-height: 1.6;
    margin: 0;
}

#impact .impact-header-row .impact-intro-text {
    margin-top: 38px;
}

#impact .about-kpis {
    margin-top: 10px;
    margin-bottom: 36px;
}

.impact-services-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 28px;
    margin-top: 0;
}

.impact-service-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    padding: 26px 22px;
    text-align: left;
    backdrop-filter: blur(12px);
    box-shadow: 0 0 20px rgba(140, 80, 255, 0.18);
    transition: .25s ease;
    position: relative;
}

.impact-service-card:hover {
    transform: translateY(-6px);
    border-color: var(--violet-2);
    box-shadow: 0 0 45px rgba(var(--glow), .22);
}

.impact-service-icon {
    width: 54px;
    height: 54px;
    border-radius: 12px;
    background: rgba(140, 80, 255, 0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 14px;
    color: var(--violet-1);
    font-size: 24px;
}

.impact-service-icon i {
    display: inline-block;
    transition: transform .25s ease;
}

.impact-service-card:hover .impact-service-icon i {
    animation: impactIconWiggle .6s ease-in-out 1;
    transform: translateX(4px);
}

@keyframes impactIconWiggle {
    0% {
        transform: translateX(4px) rotate(0deg);
    }

    25% {
        transform: translateX(6px) rotate(6deg);
    }

    50% {
        transform: translateX(5px) rotate(-6deg);
    }

    75% {
        transform: translateX(6px) rotate(4deg);
    }

    100% {
        transform: translateX(4px) rotate(0deg);
    }
}

.impact-service-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #fff;
}

.impact-service-card p {
    opacity: .85;
    line-height: 1.45;
    font-size: 14.5px;
    margin: 0;
}

@media (max-width: 992px) {
    .impact-services-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 450px) {
    .hero h1 {
        font-size: 40px !important;
    }

    .hero-badge {
        display: none !important;
    }

    .hero {
        padding: 170px 0px !important;
    }
}

@media (max-width: 768px) {
    #impact .impact-header-row {
        display: block;
        margin-bottom: 28px;
    }

    .impact-intro-text {
        margin-top: 12px;
    }
}

@media (max-width: 600px) {
    .impact-services-grid {
        grid-template-columns: 1fr;
    }
}

html,
body {
    height: 100%;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main {
    flex: 1 0 auto;
}

footer {
    flex-shrink: 0;
}

.consortium-grid {
    margin-top: 8px;
    row-gap: 30px;
}

.partner-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 16px;
    box-shadow: 0 0 22px rgba(140, 80, 255, 0.18);
    backdrop-filter: blur(10px);
    transition: .25s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 18px;
    padding: 28px 26px;
    height: 100%;
}

.partner-card:hover {
    transform: translateY(-6px);
    border-color: var(--violet-2);
    box-shadow: 0 0 45px rgba(var(--glow), .22);
}

.partner-logo {
    width: 100%;
    height: 70px;
    display: flex;
    justify-content: center;
    margin-bottom: 8px;
}

.partner-logo img {
    max-height: 65px;
    max-width: 250px;
    width: auto;
    height: auto;
    filter: drop-shadow(0 0 14px rgba(160, 90, 255, .35));
}

.partner-name {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    margin: 0 0 6px 0;
}

.partner-desc {
    font-size: 14.5px;
    line-height: 1.55;
    opacity: .9;
    margin: 0;
    color: var(--text-200);
}

.partner-meta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin-top: 6px;
}

.partner-meta .badge {
    text-align: center;
}

.partner-website.btn {
    border-radius: 50px;
    padding: 15px 30px;
    font-weight: 600;
    font-size: 15px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 60%;
    margin-top: 10px;
    background: transparent;
    color: #fff;
    border: 1px solid #fff;
    box-shadow: 0 0 20px rgba(var(--glow), .3);
    transition: .25s ease;
}

.partner-website.btn:hover {
    transform: translateY(-2px);
    background: #fff !important;
    color: #000;
    box-shadow: 0 10px 25px rgba(var(--glow), .5);
}

.partner-website i {
    display: inline-block;
    transition: transform .25s ease;
}

.partner-website:hover i {
    animation: partnerCtaWiggle .6s ease-in-out 1;
    transform: translateX(4px);
}

@keyframes partnerCtaWiggle {
    0% {
        transform: translateX(4px) rotate(0deg);
    }

    25% {
        transform: translateX(6px) rotate(6deg);
    }

    50% {
        transform: translateX(5px) rotate(-6deg);
    }

    75% {
        transform: translateX(6px) rotate(4deg);
    }

    100% {
        transform: translateX(4px) rotate(0deg);
    }
}

.partner-card:hover .partner-logo img {
    animation: partnerLogoWiggle .6s ease-in-out 1;
}

.partner-card:hover .partner-website.btn,
.partner-website.btn:hover {
    background: #fff;
    color: #000;
    border-color: 1px solid #fff;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(var(--glow), .45);
}

.partner-website.btn:hover {
    border-color: var(--violet-3) !important;
    transform: translateY(-2px);
    color: #fff !important;
    background: var(--violet-2) !important;
}

.partner-card:hover .partner-website.btn i,
.partner-website.btn:hover i {
    animation: partnerCtaWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

@keyframes partnerCtaWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

@keyframes partnerLogoWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(3px) rotate(4deg);
    }

    50% {
        transform: translateX(2px) rotate(-4deg);
    }

    75% {
        transform: translateX(3px) rotate(3deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

@media (max-width: 992px) {
    .partner-logo {
        height: 64px;
    }

    .partner-logo img {
        max-height: 54px;
        max-width: 160px;
    }
}

@media (max-width: 576px) {
    .partner-card {
        padding: 22px 18px;
        gap: 14px;
    }

    .partner-website.btn {
        width: 80%;
        padding: 12px 26px;
    }
}

.partner-website.btn {
    width: auto;
    margin-top: 10px;
}

#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(10, 10, 18, 0.75);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
    transition: opacity .6s ease, visibility .6s ease;
}

#preloader.fade-out {
    opacity: 0;
    visibility: hidden;
}

#preloader .loader i {
    font-size: 44px;
    color: var(--violet-1);
    animation: spin 1.2s linear infinite, glowPulse 1.8s ease-in-out infinite;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

@keyframes glowPulse {
    0% {
        text-shadow: 0 0 8px rgba(140, 80, 255, .4);
    }

    50% {
        text-shadow: 0 0 20px rgba(140, 80, 255, .75);
    }

    100% {
        text-shadow: 0 0 8px rgba(140, 80, 255, .4);
    }
}

#preloader {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    background: rgba(10, 10, 18, 0.75);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999999;
    transition: opacity .6s ease, visibility .6s ease;
}

#preloader.fade-out {
    opacity: 0;
    visibility: hidden;
}




/* =======================================
   NEWSFEED
======================================= */
.news-list {
    display: grid;
    gap: 16px;
}

.news-item {
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 16px;
    backdrop-filter: blur(8px);
    box-shadow: 0 0 18px rgba(140, 80, 255, .18);
    transition: .25s ease;
    padding: 18px;
}

.news-item:hover {
    transform: translateY(-4px);
    border-color: var(--violet-2, #b191ff);
    box-shadow: 0 0 28px rgba(160, 90, 255, .32);
}


.news-row {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 18px;
    align-items: start;
}

@media (max-width: 768px) {
    .news-row {
        grid-template-columns: 1fr;
        gap: 10px;
    }
}

.news-meta {
    font-size: 14px;
    opacity: .9;
}

.news-meta .badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid rgba(255, 255, 255, .15);
}

.news-meta span {
    display: block;
    margin-top: 8px;
    opacity: .85;
    font-weight: bold;
}

.news-content h3 {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 6px 0;
}

.news-excerpt {
    font-size: 14.5px;
    opacity: .92;
    line-height: 1.55;
    margin: 0 0 10px 0;
}

.news-readmore.btn {
    border-radius: 999px;
    padding: 10px 16px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: .25s ease;
}

.news-readmore.btn i {
    display: inline-block;
    transition: transform .25s ease;
}

/* wiggle */
.news-readmore.btn:hover i {
    animation: newsCtaWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

@keyframes newsCtaWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

.news-item:hover .news-readmore.btn {
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(140, 80, 255, .25);
}

.news-item:hover .news-readmore.btn i {
    animation: newsCtaWiggle .55s ease-in-out 1;
}

@keyframes aWig {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

.news-thumb {
    width: 100%;
    margin-bottom: 12px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .10);
    box-shadow: 0 0 14px rgba(140, 80, 255, .16);
}

.news-thumb img {
    display: block;
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.news-thumb img {
    transition: height .35s ease;
}

.news-item.expanded .news-thumb img {
    height: 380px;
    object-position: 50% -120px;
    transition: .60s ease;
}



@media (max-width: 768px) {
    .news-thumb img {
        height: 180px;
    }
}

.news-accordion {
    display: grid;
    gap: 14px;
}

.news-acc-header {
    width: 100%;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 16px;
    backdrop-filter: blur(8px);
    box-shadow: 0 0 18px rgba(140, 80, 255, .18);
    transition: .25s ease;

    display: grid;
    grid-template-columns: 1fr auto 46px;
    /* left/meta+title | thumb | chevron */
    gap: 14px;
    align-items: center;

    padding: 16px;
    text-align: left;
    color: #fff;
}

.news-acc-header:hover {
    transform: translateY(-2px);
    border-color: var(--violet-2, #b191ff);
    box-shadow: 0 0 28px rgba(160, 90, 255, .32);
}

.news-acc-left {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    opacity: .9;
    margin-bottom: 6px;
}

.news-acc-date {
    opacity: .9;
}

.news-acc-location {
    opacity: .85;
}

.news-acc-title {
    grid-column: 1 / 2;
    margin: 0;
    font-size: 18px;
    font-weight: 700;
}

.news-acc-thumb {
    width: 120px;
    height: 68px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .10);
    box-shadow: 0 0 12px rgba(140, 80, 255, .16);
}

.news-acc-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-acc-chevron {
    font-size: 16px;
    opacity: .85;
    transition: transform .25s ease;
}

.news-acc-body {
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 14px;
    padding: 18px;
    margin-top: 10px;
    line-height: 1.6;
    opacity: .95;
}

.news-acc-body .btn i {
    display: inline-block;
    transition: transform .25s ease;
}

.news-acc-body .btn:hover i {
    animation: newsCtaWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

.news-acc-item .collapse.show~.news-acc-chevron,
.news-acc-header[aria-expanded="true"] .news-acc-chevron {
    transform: rotate(180deg);
}

@media (max-width: 992px) {
    .news-acc-header {
        grid-template-columns: 1fr 38px;
    }

    .news-acc-thumb {
        display: none;
    }
}

.news-more {
    border-top: 1px dashed rgba(255, 255, 255, .15);
    padding-top: 12px;
}

.news-more-body {
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 14px;
    padding: 14px 16px;
    line-height: 1.6;
    opacity: .95;
}

.news-readmore i {
    display: inline-block;
    transition: transform .25s ease;
}

.news-readmore:hover i {
    animation: newsCtaWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

.news-readmore[aria-expanded="true"] i {
    transform: rotate(90deg);
}

.news-thumb {
    width: 100%;
    margin-bottom: 12px;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .10);
    box-shadow: 0 0 14px rgba(140, 80, 255, .16);
}

.news-thumb img {
    display: block;
    width: 100%;
    /*height: 200px;*/
    height: 250px;
    object-fit: cover;
    object-position: 50% -166px;
}

@media (max-width: 768px) {
    .news-thumb img {
        height: 180px;
    }
}

.news-more-btn {
    margin-top: 12px;
    background: transparent;
    padding: 10px 12px;
    border-radius: 999px;
    color: #fff;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: .25s ease;
    border: 1px solid rgba(255, 255, 255, .22);
    box-shadow: 0 0 20px rgba(var(--glow), .3);
    font-weight: 600;
    width: 70%;
    justify-content: center;
}

.news-more-btn:hover {
    background: #fff;
    border-color: #fff;
    color: #000 !important;
    transform: translateY(-1px);
}

.news-more-btn[aria-expanded="true"] i {
    transform: rotate(180deg);
}

.news-more-btn i {
    transition: transform .25s ease;
}

.news-more-area {
    border-top: 1px dashed rgba(255, 255, 255, .25);
    margin-top: 14px;
}

.news-more-body {
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(255, 255, 255, .10);
    border-radius: 14px;
    padding: 16px 18px;
    line-height: 1.65;
    opacity: .95;
}

.news-more-btn i {
    display: inline-block;
    transition: transform .25s ease;
}

.news-more-btn:hover i {
    animation: newsCtaWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

.news-more-btn[aria-expanded="true"] i {
    transform: rotate(180deg);
}

.news-more-btn i {
    display: inline-block;
    transition: transform .25s ease;
}

.news-more-btn:hover i {
    animation: newsMoreBtnWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

@keyframes newsMoreBtnWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

.news-more-btn[aria-expanded="true"] i {
    transform: rotate(180deg);
}

.media-card {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.10);
    border-radius: 16px;
    padding: 24px 22px;
    text-align: center;
    backdrop-filter: blur(10px);
    box-shadow: 0 0 22px rgba(140, 80, 255, 0.18);
    transition: .25s ease;
    height: 100%;
}

.media-card:hover {
    transform: translateY(-6px);
    border-color: var(--violet-2);
    box-shadow: 0 0 45px rgba(var(--glow), .22);
}

.media-icon {
    font-size: 42px;
    color: var(--violet-1);
    margin-bottom: 12px;
}

.media-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 8px;
    color: #fff;
}

.media-desc {
    font-size: 14.5px;
    opacity: .88;
    line-height: 1.55;
    margin-bottom: 18px;
    color: var(--muted);
}

.coming-soon-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    border-radius: 30px;
    font-weight: 600;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, .22);
    box-shadow: 0 0 20px rgba(var(--glow), .3);
    opacity: .9;
}

.media-card:hover .media-icon i {
    animation: mediaIconWiggle .55s ease-in-out 1;
    transform: translateX(3px);
}

@keyframes mediaIconWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}

.coming-soon-badge {
    animation: comingSoonPulse 1.5s ease-in-out infinite;
}

.coming-soon-badge i {
    display: inline-block;
    animation: hourglassSpin 1.2s ease-in-out infinite;
}

@keyframes comingSoonPulse {
    0% {
        opacity: .8;
        transform: scale(1);
    }

    50% {
        opacity: 1;
        transform: scale(1.04);
    }

    100% {
        opacity: .8;
        transform: scale(1);
    }
}

@keyframes hourglassSpin {
    0% {
        transform: rotate(0);
    }

    50% {
        transform: rotate(180deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* ============================================
   CONTACT PAGE — Titles & Text
============================================ */

.contact-title {
    font-size: 42px;
    font-weight: 800;
    margin: 0;
    color: #fff;
}

.contact-subtext {
    opacity: .85;
    font-size: 15px;
    line-height: 1.55;
    margin-bottom: 20px;
    color: var(--muted);
}


/* ============================================
   CONTACT PAGE — Form Inputs (Dark-Glass)
============================================ */

.contact-input {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #fff;
    border-radius: 12px;
    padding: 10px 14px;
    width: 100%;
    resize: none !important;
}

.contact-input:focus {
    border-color: var(--violet-2);
    background: rgba(255, 255, 255, 0.15);
    box-shadow: 0 0 14px rgba(var(--glow), .3);
}


/* ============================================
   CONTACT PAGE — Submit Button (wiggle icon)
============================================ */

.contact-submit i {
    display: inline-block;
    transition: transform .25s ease;
}

.contact-submit:hover i {
    animation: contactWiggle .55s ease-in-out 1;
    transform: translateX(4px);
}

@keyframes contactWiggle {
    0% {
        transform: translateX(2px) rotate(0);
    }

    25% {
        transform: translateX(4px) rotate(6deg);
    }

    50% {
        transform: translateX(3px) rotate(-6deg);
    }

    75% {
        transform: translateX(4px) rotate(4deg);
    }

    100% {
        transform: translateX(2px) rotate(0);
    }
}


/* ============================================
   CONTACT PAGE — Right Side Image
============================================ */

.contact-image-wrapper {
    border-radius: 22px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 0 22px rgba(140, 80, 255, .18);
}

.contact-image-wrapper img {
    width: 100%;
    height: 450px;
    object-fit: cover;
}


/* ============================================
   CONTACT PAGE 
============================================ */

.contact-icon i {
    font-size: 34px;
    margin-bottom: 12px;
    display: inline-block;

    background: linear-gradient(90deg,
            var(--violet-1),
            var(--violet-2),
            #ffffff,
            var(--violet-2),
            var(--violet-1));
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;

    animation: gradientShift 8s linear infinite;
}


/* ============================================
   Gradient Animation 
============================================ */

@keyframes gradientShift {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}


/* ============================================
   Media Queries
============================================ */

@media (max-width: 768px) {
    .contact-image-wrapper img {
        height: 300px;
    }
}

/* ================================
   CONTACT PAGE — Right column logo
================================ */


.contact-form .contact-input.no-label {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    color: #d7d1f3 !important;
    caret-color: #fff;
    border-radius: 16px;
    padding: 14px 16px;
    width: 100%;
    outline: none;
    transition: border-color .25s ease, background .25s ease, box-shadow .25s ease;
}

.contact-form .contact-input.no-label:focus {
    border-color: var(--violet-2);
    background: rgba(255, 255, 255, 0.14);
    box-shadow: 0 0 14px rgba(var(--glow), .28);
}

.contact-form .contact-input.no-label::placeholder {
    color: rgba(255, 255, 255, .85);
    opacity: 1;
}

.contact-form .contact-input.no-label:-webkit-autofill,
.contact-form .contact-input.no-label:-webkit-autofill:hover,
.contact-form .contact-input.no-label:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff !important;
    caret-color: #fff;
    transition: background-color 9999s ease-in-out 0s;
}

.contact-form textarea.contact-input.no-label {
    min-height: 180px;
    resize: vertical;
}

.contact-submit i {
    display: inline-block;
    transition: transform .25s ease;
}

.contact-submit:hover i {
    animation: contactWiggle .55s ease-in-out 1;
    transform: translateX(4px);
}

@keyframes contactWiggle {
    0% {
        transform: translateX(2px) rotate(0)
    }

    25% {
        transform: translateX(4px) rotate(6deg)
    }

    50% {
        transform: translateX(3px) rotate(-6deg)
    }

    75% {
        transform: translateX(4px) rotate(4deg)
    }

    100% {
        transform: translateX(2px) rotate(0)
    }
}


/* (Opcional) mensagem de erro do captcha */
.captcha-error {
    color: var(--violet-1) !important;
    font-size: 14px;
}


/* Hide the right-column floating logo on screens <= 992px */
@media (max-width: 992px) {
    .violet-logo-float.big {
        display: none !important;
    }
}

/* Tablet */
@media (max-width: 992px) {
    .about-headline {
        max-width: 800px;
    }

    .nav-linkedin {
        width: 10%;
        border-radius: 10px;
    }

    .nav-social {
        justify-content: flex-start;
        margin-left: 0px !important;
        margin-bottom: 16px;
        margin-top: 10px;
    }
}

/* Mobile */
@media (max-width: 768px) {
    .about-headline {
        max-width: 520px;
    }
}

/* Small mobile */
@media (max-width: 480px) {
    .about-headline {
        max-width: 360px;
    }
}

/* Evita overflow horizontal apenas em larguras críticas */
@media (max-width: 1400px) {

    .hero,
    .about,
    .faq,
    .section {
        overflow-x: clip;
    }
}

.orb,
.bg-decor,
.svg-bg {
    pointer-events: none;
    user-select: none;
}

/* =============================
   CUSTOM HAMBURGER ANIMATION
   ============================= */

/* Remove default Bootstrap icon */
.navbar-toggler .navbar-toggler-icon {
    background-image: none !important;
}

/* Set up the 3 animated bars */
.navbar-toggler {
    width: 38px;
    height: 32px;
    border: none;
    position: relative;
    outline: none !important;
    box-shadow: none !important;
}

/* Bars */
.navbar-toggler::before,
.navbar-toggler::after,
.navbar-toggler span.bar {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg,
            var(--violet-1),
            var(--violet-2),
            #fff,
            var(--violet-2),
            var(--violet-1));
    background-size: 200% auto;
    animation: gradientShift 8s linear infinite;

    border-radius: 2px;
    transition: transform .35s ease, opacity .25s ease;
}

/* Create middle bar */
.navbar-toggler span.bar {
    top: 50%;
    transform: translateY(-50%);
}

/* Top + bottom bars */
.navbar-toggler::before {
    top: 6px;
}

.navbar-toggler::after {
    bottom: 6px;
}

/* Hover animation (wiggle-like) */
.navbar-toggler:hover::before,
.navbar-toggler:hover::after,
.navbar-toggler:hover span.bar {
    animation: navWiggle .55s ease-in-out 1, gradientShift 8s linear infinite;
}

@keyframes navWiggle {
    0% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(3px);
    }

    50% {
        transform: translateX(-2px);
    }

    75% {
        transform: translateX(2px);
    }

    100% {
        transform: translateX(0);
    }
}

/* When NAV is open → turn hamburger into X */
.navbar-toggler[aria-expanded="true"]::before {
    transform: translateY(10px) rotate(45deg);
}

.navbar-toggler[aria-expanded="true"]::after {
    transform: translateY(-10px) rotate(-45deg);
}

.navbar-toggler[aria-expanded="true"] span.bar {
    opacity: 0;
}

/* Ease the transform of the container */
.navbar-toggler {
    transition: transform .35s ease;
}

/* Optional: small tap animation */
.navbar-toggler:active {
    transform: scale(0.92);
}


/* ===== FORM WRAPPER CARD ===== */
.form-wrapper {
    max-width: 1100px;
    margin: 0 auto;
    border-radius: 18px;
    background: rgba(20, 16, 40, 0.85);
    backdrop-filter: blur(12px);
    box-shadow:
        0 0 0 1px rgba(180, 140, 255, 0.15),
        0 20px 60px rgba(0, 0, 0, 0.6),
        0 0 80px rgba(140, 90, 255, 0.2);
    overflow: hidden;
}

/* ===== HEADER BAR ===== */
.form-header {
    padding: 18px 24px;
    text-align: center;
    font-weight: 600;
    letter-spacing: 0.3px;
    color: #ffffff;
    background: linear-gradient(90deg,
            rgba(120, 80, 255, 0.35),
            rgba(180, 120, 255, 0.35));
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* ===== FORM BODY FIX ===== */
.form-body {
    height: 560px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.02);
}

.form-body iframe {
    width: 100%;
    height: 100%;
    border: 0;
    overflow: auto;
    position: relative;
    top: -16px;
}

/* Mobile */
@media (max-width: 768px) {
    .form-body {
        height: 720px;
    }
}

.pb0 {
    padding-bottom: 0px !important;
}

.forms-card {
    padding: 40px !important;
}