/* GLOBAL OVERRIDES */

:root {
    --accent-color: #25C8FF;
    --accent-color-translucent: #25C8FF20;
}

/* HEADER */

header .nav-link {
    color: #000;
    text-shadow: 0 0 4px #25C8FF;
}

header .nav-link:hover {
    color: #000;
}

header .nav-link:visited {
    color: #000;
}

.navbar-toggler .menu-icon {
    color: #000;
    fill: #000;
    stroke: #000;
    filter: drop-shadow(0 0 4px #25C8FF);
}

/* HERO */

.hero-bolt-bg {
    position: absolute;
    top: 0;
    right: 0;
    width: auto;
    height: var(--hero-bolt-height, auto);
    max-width: none;
    z-index: -1;
    pointer-events: none;
    object-fit: contain;
}

#hero {
    position: relative;
    z-index: 1;
}

.hero-content {
    position: relative;
}

.hero-content-base {
    position: relative;
    z-index: 1;
}

.hero-content-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    color: #000;
    pointer-events: none;
    display: none;
}

.hero-content-mask * {
    color: #000 !important;
}

@supports ((-webkit-mask-image: none) or (mask-image: none)) {
    .hero-content-mask {
        display: block;
        --mask-url: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPScxLjInIHhtbG5zPSdodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2Zycgdmlld0JveD0nMCAwIDEwMjQgMTAyNCcgd2lkdGg9JzUxMicgaGVpZ2h0PSc1MTInPjxzdHlsZT48L3N0eWxlPjxwYXRoICBkPSdtODc4IDk3LjFjLTIuNSAwLjUtNy4yIDIuMi0xMC41IDMuNi0zLjMgMS41LTYuMiAzLTYuNSAzLjMtMC4zIDAuNC0xLjQgMS0yLjUgMS41LTEuMSAwLjQtMi4yIDAuOS0yLjUgMS0wLjMgMC4xLTIuMiAxLTQuMyAyLjEtMiAxLTMuNyAyLjItMy43IDIuNyAwIDAuNC0wLjUgMC41LTEgMC4yLTAuNS0wLjMtMS41IDAuMi0yIDEtMC41IDAuOC0xLjMgMS4zLTEuOCAxLjEtMC40LTAuMy0yLjEgMC42LTMuNyAyLTEuNiAxLjQtNC4yIDIuOS01LjggMy4yLTEuNSAwLjQtMi43IDEtMi43IDEuNSAwIDAuNC0wLjkgMC43LTIgMC43LTEuMSAwLTIuMiAwLjMtMi40IDAuOC0wLjIgMC40LTMuMiAyLjItNi43IDQtMy41IDEuOC04IDQuMi05LjkgNS4zLTEuOSAxLjEtNC40IDIuNS01LjUgMy4yLTEuMSAwLjYtMi40IDEuMS0yLjggMS4yLTAuNCAwLTEuMSAwLjUtMS41IDEuMS0wLjQgMC41LTIuMyAxLjYtNC4yIDIuNC0xLjkgMC43LTQuMiAxLjktNSAyLjYtMC44IDAuNy0yLjEgMS40LTIuOSAxLjYtMC44IDAuMi0zLjkgMS43LTcgMy41LTMuMSAxLjctOSA0LjktMTMuMSA3LTQuMSAyLjEtNy43IDQuMS04IDQuNS0wLjMgMC41LTEuMiAwLjktMi4xIDEuMS0wLjkgMC4xLTIuMiAwLjctMyAxLjMtMC44IDAuNi0yLjUgMS41LTMuOSAxLjktMS40IDAuNS0zLjEgMS40LTMuOCAyLjItMC43IDAuNy0yIDEuMy0yLjggMS4zLTAuOCAwLTEuNCAwLjMtMS40IDAuOCAwIDAuNC0yLjMgMS44LTUuMiAzLjItMi45IDEuNC01LjUgMi43LTUuOCAzLTAuMyAwLjMtMi41IDEuNi01IDIuOC0yLjUgMS4zLTUuNiAzLTcgMy43LTEuNCAwLjctMy45IDEuOS01LjUgMi42LTEuNiAwLjgtNC44IDIuNi03IDQuMS0yLjIgMS40LTUuOSAzLjMtOC4zIDQuMi0yLjMgMC45LTQuMiAyLTQuMiAyLjYgMCAwLjYtMS43IDEuNy0zLjcgMi42LTIuMSAwLjgtNi45IDMuMi0xMC44IDUuMy0zLjkgMi0xMC4xIDUuNS0xNCA3LjYtMy45IDIuMS0xMC44IDYtMTUuNSA4LjctNC43IDIuNy0xMS45IDYuNS0xNiA4LjYtNC4xIDItNy43IDQtOCA0LjQtMC4zIDAuNC0zIDIuMS02IDMuOC0zIDEuNi02LjQgMy40LTcuNSAzLjktMS4xIDAuNS00LjQgMy03LjQgNS43LTIuOSAyLjctNi4yIDYuOC03LjIgOS4yLTEuMSAyLjMtMS45IDUuNC0xLjkgNyAwIDEuNSAwLjkgNC41IDEuOSA2LjcgMS40IDIuOCA0IDUuNCA4LjggOC42IDMuNyAyLjYgMTMuOCA4LjMgMjIuMyAxMi43IDEyLjkgNi43IDE1LjggOC42IDE3LjIgMTEuNCAwLjkgMS44IDEuNyA0LjQgMS44IDUuOCAwIDEuNi0zLjQgNy42LTkgMTYtNSA3LjQtMTEuOSAxNy4zLTE1LjMgMjItMy40IDQuNy0xMy43IDE4LjQtMjIuOCAzMC41LTkuMiAxMi4xLTIxLjEgMjcuOS0yNi42IDM1LTUuNCA3LjEtMTguOCAyNC43LTI5LjggMzktMTAuOSAxNC4zLTIyLjMgMjkuMS0yNS4zIDMzLTMgMy45LTEzLjcgMTcuOC0yMy44IDMxLTEwLjEgMTMuMi0yMi43IDI5LjYtMjguMSAzNi41LTUuNCA2LjktMTAuNiAxMi42LTExLjYgMTIuOC0wLjkgMC4xLTMuNy0xLjUtNi4yLTMuNS0yLjUtMi4xLTguOS04LjEtMTQuMy0xMy4zLTUuMy01LjItMTQuNC0xMy44LTIwLjItMTkuMS01LjgtNS4zLTEyLjMtMTEuMS0xNC41LTEzLTIuMi0xLjktNC41LTMuOC01LjEtNC40LTAuNi0wLjYtNS43LTUuMy0xMS41LTEwLjUtNS43LTUuMi0xMi0xMS4xLTEzLjktMTMtMS45LTEuOS05LjEtOC41LTE1LjktMTQuNS02LjgtNi4xLTE0LjUtMTIuNi0xNy0xNC41LTIuNS0yLTYuMy00LjUtOC4zLTUuOC0yLjEtMS4yLTcuNS0yLjktMTItMy43LTQuNi0wLjgtMTAuOC0xLjUtMTMuOC0xLjUtMyAwLTguMiAwLjktMTEuNSAyLTMuNyAxLjMtNy41IDMuNS05LjggNS44LTIuMSAyLTcuMSA4LTExLjEgMTMuMi00IDUuMi0xMC43IDE0LjYtMTQuOSAyMC44LTQuMiA2LjEtNy43IDExLjUtNy43IDEyIDAgMC40LTQuMSA2LjgtOS4yIDE0LjItNSA3LjQtMjAgMjkuMi0zMy4yIDQ4LjMtMTMuMyAxOS4xLTI3LjkgNDAuMy0zMi41IDQ3LTQuNiA2LjctMTQuMyAyMC43LTIxLjUgMzEuMi03LjEgMTAuNS0xNy43IDI2LTIzLjUgMzQuNS01LjkgOC42LTE3LjEgMjUuMS0yNS4xIDM2LjgtOCAxMS43LTE5LjIgMjguMS0yNC45IDM2LjUtNS43IDguMy0xNC45IDIyLTIwLjQgMzAuMi01LjYgOC4zLTEzLjIgMTguOC0xNi45IDIzLjUtMy44IDQuNy04LjEgMTEtOS42IDE0LTEuNSAzLTIuNyA3LjEtMi42IDkgMCAxLjkgMC45IDUuMyAyIDcuNCAxIDIuMiAzLjkgNiA2LjQgOC41IDIuNSAyLjYgMTQuNCAxNC4yIDI2LjUgMjUuOCAxMi4xIDExLjcgMjQuNyAyMy4zIDI4IDI1LjggMy4zIDIuNSA3LjggNSAxMCA1LjcgMi4yIDAuNiA4LjMgMS4yIDEzLjUgMS4yIDcgMCAxMS4zLTAuNiAxNi41LTIuMiAzLjktMS4xIDktMy40IDExLjUtNSAyLjUtMS41IDYuOS01LjMgOS44LTguMyAyLjktMi45IDEwLTEyLjEgMTUuOS0yMC40IDUuOS04LjIgMTMtMTguMSAxNS44LTIyIDIuOS0zLjkgNi45LTkuNSA5LjEtMTIuNSAyLjEtMyA1LjQtNy44IDcuNC0xMC42IDEuOS0yLjggMTIuNy0xOC4xIDIzLjktMzQgMTEuMi0xNS45IDIyLjctMzIuMSAyNS41LTM2LjEgMi44LTQgOC44LTEyLjUgMTMuNC0xOSA0LjYtNi41IDEzLjgtMTkuNCAyMC40LTI4LjggNi42LTkuNCAxNC43LTIwLjggMTcuOS0yNS41IDMuMy00LjcgOC4xLTExLjYgMTAuOC0xNS41IDIuNy0zLjkgNS40LTcuNiA2LTguMiAwLjYtMC43IDEuMS0xLjggMS4xLTIuMyAwLTAuNSAwLjQtMSAxLTEgMC42IDAgMS4yLTAuOCAxLjUtMS43IDAuMy0xIDIuNS00IDQuOS02LjhsNC40LTVjOC45IDcuOCAxMy4xIDExLjQgMTUuMSAxMyAyLjEgMS42IDYuOSA1LjcgMTAuNyA5LjEgMy44IDMuNCAxNC45IDEzIDI0LjggMjEuNSA5LjggOC41IDE5LjUgMTYuOCAyMS41IDE4LjQgMiAxLjYgMTMuMSAxMS4xIDI0LjYgMjEgMTEuNSA5LjkgMjMuNyAyMC4yIDI3IDIyLjggMy4zIDIuNyA4LjcgNi40IDEyIDguMiAzLjMgMS44IDguNyA0LjEgMTIgNSA0LjMgMS4yIDguNiAxLjYgMTUuMSAxLjQgOC4zLTAuNCA5LjktMC44IDE3LTQuNCA3LTMuNSA4LjktNS4yIDE2LjktMTQuNiA0LjktNS44IDEwLjctMTIuOCAxMi43LTE1LjUgMi4xLTIuNyAxNC43LTE5LjEgMjgtMzYuNCAxMy4zLTE3LjMgMzIuMy00Mi4xIDQyLjItNTUgOS45LTEyLjkgMjIuOC0yOS42IDI4LjYtMzcuMSA1LjgtNy41IDE2LjEtMjEgMjMtMzAgNi45LTkgMTcuNy0yMy4xIDI0LTMxLjQgNi4zLTguMiAxNi43LTIyIDIzLjItMzAuNSA2LjUtOC41IDE2LTIwLjkgMjEtMjcuNSA1LjEtNi42IDE0LjEtMTguNSAyMC4xLTI2LjUgNi4xLTggMTYuNy0yMS45IDIzLjYtMzEgNi45LTkgMTQuNC0xOC4zIDE2LjYtMjAuNyAyLjItMi4zIDQuNy00LjMgNS41LTQuMyAwLjggMCA2LjUgMy4zIDEyLjUgNy4zIDYgNC4xIDE0LjQgOS43IDE4LjUgMTIuNSA0LjEgMi44IDkuOCA2LjEgMTIuNSA3LjMgMy4zIDEuNSA2LjggMi4zIDEwLjUgMi4zIDMtMC4xIDYuNS0wLjYgNy44LTEuMiAxLjItMC43IDIuMi0xLjggMi4yLTIuNCAwLTAuNyAxLjEtMi41IDIuNS00IDEuNC0xLjYgMi4zLTIuOCAyLTIuOC0wLjMgMCAwLTEgMC43LTIuMiAwLjctMS4zIDEuMy0yLjUgMS40LTIuOCAwLTAuMyAwLjMtMS4yIDAuNy0yIDAuMy0wLjggMS4xLTQgMS43LTcgMC41LTMgMS4yLTcuNyAxLjUtMTAuNSAwLjMtMi43IDEuMS04LjQgMS45LTEyLjUgMC44LTQuMSA0LjUtMjUuOSA4LjEtNDguNSAzLjYtMjIuNSA3LTQzLjcgNy41LTQ3IDAuNi0zLjMgMS4yLTcuNiAxLjUtOS41IDAuMi0xLjkgMS40LTguNyAyLjUtMTUgMS4xLTYuMyAyLjUtMTQuNiAzLTE4LjUgMC41LTMuOCAyLjEtMTMuNyAzLjUtMjIgMS40LTguMiAzLjItMTkgMy45LTI0IDAuOC00LjkgMy4xLTE4LjcgNS4xLTMwLjUgMi44LTE2LjMgMy42LTIzLjQgMy4zLTI5LjUtMC4zLTQuNi0xLjEtOS4zLTItMTEtMC45LTEuNi0zLjYtNS02LTcuNS0yLjUtMi41LTUuMS01LTUuOS01LjYtMC44LTAuNi0yLjktMS44LTQuNi0yLjctMS44LTAuOS01LjItMS45LTcuNS0yLjEtMi40LTAuMy02LjMgMC04LjggMC41eicvPjwvc3ZnPg==');

        -webkit-mask-image: var(--mask-url);
        mask-image: var(--mask-url);

        -webkit-mask-repeat: no-repeat;
        mask-repeat: no-repeat;

        -webkit-mask-size: auto var(--hero-bolt-height, 0px);
        mask-size: auto var(--hero-bolt-height, 0px);

        /* Adjusted mask-position syntax for better compatibility */
        -webkit-mask-position: 100% calc(0px - var(--hero-mask-offset, 0px));
        mask-position: 100% calc(0px - var(--hero-mask-offset, 0px));

        /* Ensure mask mode handles the SVG content properly */
        -webkit-mask-mode: alpha;
        mask-mode: alpha;
    }
}

/* Force text color in mask layer to black for the overlap effect */
.hero-content-mask .hero-title,
.hero-content-mask .hero-subtitle {
    color: #000 !important;
    text-shadow: none !important;
}

.hero-subtitle {
    color: #C05CFF;
}

/* BANNER */

.banner-full-width {
    background-image: url('../images/banner-bg.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
}

.banner-icon img {
    filter: drop-shadow(0 0 15px rgba(0, 0, 0, 0.5));
}

/* FULL-WIDTH IMAGE */

.image-full-width {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

.image-full-width img {
    display: block;
    width: 100%;
    height: auto;
}

/* CARD GRID */

.feature-card {
    overflow: hidden;
    display: flex;
    width: 100%;
    height: 100%;
    position: relative;
}

.feature-card img {
    margin-bottom: auto;
    /* Push image to top if container is flex */
}

.feature-card-text {
    position: absolute;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    text-align: center;
    font-family: 'Inter', sans-serif;
    /* Or project font */
    font-weight: 900;
    font-size: 3rem;
    line-height: 1;
    /* text-transform: uppercase; REMOVED */
    color: #000;
    /* Round, thick outline using SVG filter */
    filter: url(#sticker-outline);
    z-index: 2;
    /* Adding text-shadow to smooth out edges potentially, though stroke is main effect */
}

/* HIGHLIGHT */

.highlight {
    width: 100%;
    background: var(--accent-color);
    background: linear-gradient(to top right, var(--accent-color), #A5F8FF);
    /* A lighter turquoise for gradient end */
    padding: 12rem 8rem;
}

.highlight-text {
    font-weight: 900;
    font-size: 7.5rem;
    color: #000;
    line-height: 1.2;
    text-transform: uppercase;
    margin: 0;
}

@media (max-width: 992px) {
    .highlight-text {
        font-size: 6rem;
    }
}

@media (max-width: 768px) {
    .highlight-text {
        font-size: 4.5rem;
    }

    .highlight {
        padding: 8rem 4rem;
    }
}

@media (max-width: 576px) {
    .highlight-text {
        font-size: 3rem;
    }

    .highlight {
        padding: 6rem 2rem;
    }
}

/* FAST STEPS */

.feature-step-image {
    width: 100%;
    max-width: 340px;
    height: auto;
    margin: 0 auto;
}

@media (max-width: 992px) {
    .feature-step-image {
        max-width: 300px;
    }
}

@media (max-width: 768px) {
    .feature-step-image {
        max-width: 260px;
    }
}

@media (max-width: 576px) {
    .feature-step-image {
        max-width: 220px;
    }
}

.phone-mockup {
    border-radius: 40px;
    border: 12px solid #23202F;
    overflow: hidden;
    background-color: #23202F;
}

/* CTA BUTTON */

.cta-btn {
    background: var(--accent-color);
}

.cta-btn:hover {
    box-shadow: 0px 10px 60px var(--accent-color-translucent);
}

/* VIRALITY BANNER (Replaces banner-virality.svg) */

.virality-banner {
    position: relative;
    width: 100vw;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    overflow: hidden;
    min-height: 400px;
    /* Adjust based on desired aspect ratio approx 1440x780 would be taller, but responsive */
    display: flex;
    align-items: center;
}

.virality-banner-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    z-index: 0;
}

.virality-banner-band {
    flex: 1;
    height: 100%;
}

.band-yellow {
    background-color: #6A5BFF;
}

.band-green {
    background-color: #C05CFF;
}

.band-orange {
    background-color: #25C8FF;
}

.virality-banner-content {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 4rem 2rem;
}

.virality-text {
    font-size: clamp(2rem, 5vw, 4.5rem);
    font-weight: 900;
    color: #000;
    text-transform: uppercase;
    line-height: 1.1;
    margin: 0;
}

@media (min-width: 992px) {
    .virality-banner {
        min-height: 600px;
    }
}