/* ==========================================================================
   Solutions Big Card Block
   ========================================================================== */

.solutions-big-card {
    display: grid;
    grid-template-areas: "hero report" "hero quote";
    grid-template-columns: 5fr 2fr;
    gap: 10px;
}



/* --------------------------------------------------------------------------
   Section 1: Hero
   -------------------------------------------------------------------------- */

.solutions-big-card__hero {
    grid-area: hero;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    min-height: 500px;
    display: flex;
    align-items: flex-end;
    padding: 48px;
    background-color: #1a1a2e; /* fallback when no image */
}

/* Background image (positioned absolutely behind content) */
.solutions-big-card__hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
}

/* .solutions-big-card__hero-bg .solutions-big-card__hero-bg-blob--top {
    position: absolute;
    pointer-events: none;
    background: radial-gradient(ellipse at top left, rgba(95, 97, 255, 0.95) 0%, rgba(95, 97, 255, 0.7) 6%, rgba(95, 97, 255, 0.35) 25%, rgba(95, 97, 255, 0) 50%);
    inset: 0;
}

.solutions-big-card__hero-bg .solutions-big-card__hero-bg-blob--bottom-0 {
    position: absolute;
    pointer-events: none;
    background: radial-gradient(ellipse at 10% 94%, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.65) 40%, rgba(0, 0, 0, 0.15) 65%, transparent 100%);
    inset: 0;
}

.solutions-big-card__hero-bg .solutions-big-card__hero-bg-blob--bottom {
    position: absolute;
    pointer-events: none;
    background: radial-gradient(ellipse at 10% 94%, rgba(149, 255, 236, 0.75) 0%, rgba(149, 255, 236, 0.45) 20%, rgba(149, 255, 236, 0.15) 31%, transparent 100%);
    inset: 0;
    opacity: .7;
} */


.solutions-big-card__hero-bg .solutions-big-card__hero-bg-blob--bottom {
    position: absolute;
    pointer-events: none;
    background:
        linear-gradient(208.52deg, rgba(95, 97, 255, 0) 42.16%, rgba(95, 97, 255, 0.5) 65.43%, rgba(149, 255, 236, 0.65) 88.7%), linear-gradient(68.76deg, rgba(26, 24, 37, 0.7) 3.84%, rgba(26, 24, 37, 0) 61.76%);
    inset: 0;
}


.solutions-big-card__hero-bg-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}



/* Content sits above the overlay */
.solutions-big-card__hero-content {
    position: relative;
    z-index: 2;
    color: #ffffff;
    max-width: 350px;
}

.solutions-big-card__title {
    font-weight: 500;
    font-size: clamp(24px, 18.18px + 1.82vw, 40px);
    line-height: 90%;
    letter-spacing: -2%;
}

.solutions-big-card__subtitle {
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    opacity: 0.85;
}

/* --------------------------------------------------------------------------
   Shared button styles
   -------------------------------------------------------------------------- */

.solutions-big-card__btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease, opacity 0.2s ease;
}

.solutions-big-card__btn:hover {
    opacity: 0.88;
}

/* Primary (Load More) */
.solutions-big-card__btn--primary {
    --c-light: #ffffff8c;
	--c-dark: #ffffff24;

	--glass-reflex-dark: 1;
	--glass-reflex-light: 1;
	
	--saturation: 150%;

	background-color: #ffffff08;
	backdrop-filter: blur(8px) saturate(var(--saturation));
	-webkit-backdrop-filter: blur(8px) saturate(var(--saturation));
	box-shadow: inset 0 0 0 1px 
			color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 10%), transparent), inset 1.8px 3px 0px -2px 
			color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 90%), transparent), inset -2px -2px 0px -2px 
			color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 80%), transparent), inset -3px -8px 1px -6px 
			color-mix(in srgb, var(--c-light) calc(var(--glass-reflex-light) * 60%), transparent), inset -0.3px -1px 4px 0px 
			color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 12%), transparent), inset -1.5px 2.5px 0px -2px 
			color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 20%), transparent), inset 0px 3px 4px -2px 
			color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 20%), transparent), inset 2px -6.5px 1px -4px 
			color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 10%), transparent), 0px 1px 5px 0px 
			color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 10%), transparent), 0px 6px 16px 0px 
			color-mix(in srgb, var(--c-dark) calc(var(--glass-reflex-dark) * 8%), transparent);
	transition: background-color 400ms cubic-bezier(1, 0.0, 0.4, 1), box-shadow 400ms cubic-bezier(1, 0.0, 0.4, 1);


    line-height: 100%;
    margin-top: 16px;
    display: inline-block;
    padding: 18px 24px;
    text-decoration: none;
    border-radius: 49px;

    font-weight: 500;
}

.solutions-big-card__btn--primary:hover,
.solutions-big-card__btn--primary:active {
	--c-light: #ffffffa5;
	--c-dark: #ffffff3d;
	background-color: #ffffff35;
}

/* Arrow (Read the Report) */
.solutions-big-card__btn--arrow {
    padding: 0;
    background: none;

    
    font-weight: 600;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: 0%;

    color: #A5A7FF;

}

.solutions-big-card__btn--arrow svg {
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.solutions-big-card__btn--arrow:hover {
    opacity: 1;
}

.solutions-big-card__btn--arrow:hover svg {
    transform: translateX(4px);
}

/* --------------------------------------------------------------------------
   Section 2: Report
   -------------------------------------------------------------------------- */

.solutions-big-card__report {
    grid-area: report;
    border-radius: 20px;
    padding: 25px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
    background-color: #191919;
    color: #ffffff;

    position: relative;
    overflow: hidden;
}

.solutions-big-card__report-label {
    display: block;

    font-weight: 500;
    font-size: 12px;
    line-height: 20px;
    letter-spacing: 2%;
    text-transform: uppercase;

    opacity: .85;

}

.solutions-big-card__report-title.solutions-big-card__report-title {
    margin: 0;

    font-weight: 500;
    font-size: 24px;
    line-height: 120%;
}

.solutions-big-card__report-title a {
    color: inherit;
    text-decoration: none;
}

.solutions-big-card__report-title a:hover {
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Section 3: Quote
   -------------------------------------------------------------------------- */

.solutions-big-card__quote {
    grid-area: quote;
    border-radius: 20px;
    padding: 25px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
}

.solutions-big-card__quote-blockquote {
    margin: 0;
    padding: 0;
    border: none;
}

.solutions-big-card__quote-blockquote::before {
    content: url('data:image/svg+xml,<svg width="21" height="19" viewBox="0 0 21 19" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.0676 0.0879188C9.28116 -0.0683805 9.46802 -0.0162818 9.62818 0.244215C9.84174 0.504712 9.84174 0.68706 9.62818 0.791261C7.75958 2.45844 6.29139 4.15167 5.22361 5.87095C4.15583 7.59023 3.48847 9.43976 3.22153 11.4195C3.00797 12.722 3.00797 13.6859 3.22153 14.3111C3.43508 14.9362 3.75542 15.3791 4.18253 15.6396L2.02028 16.1866C1.96689 15.3009 2.20714 14.6237 2.74103 14.1548C3.27492 13.6859 3.94228 13.4514 4.74311 13.4514C5.65072 13.4514 6.34477 13.7119 6.82527 14.2329C7.35916 14.7018 7.6261 15.353 7.6261 16.1866C7.6261 17.0723 7.30577 17.7757 6.66511 18.2967C6.07783 18.7656 5.22361 19 4.10244 19C2.71434 19 1.61986 18.453 0.819033 17.3589C0.0182008 16.2648 -0.195354 14.6237 0.178367 12.4355C0.605478 9.93471 1.59317 7.72048 3.14145 5.7928C4.74311 3.86513 6.7185 1.9635 9.0676 0.0879188ZM20.2792 0.0879188C20.4928 -0.0683805 20.6797 -0.0162818 20.8398 0.244215C21.0534 0.504712 21.0534 0.68706 20.8398 0.791261C18.9712 2.45844 17.503 4.15167 16.4353 5.87095C15.3675 7.59023 14.7001 9.43976 14.4332 11.4195C14.2196 12.722 14.2196 13.6859 14.4332 14.3111C14.6467 14.9362 14.9671 15.3791 15.3942 15.6396L13.2319 16.1866C13.1785 15.3009 13.4188 14.6237 13.9527 14.1548C14.4866 13.6859 15.1539 13.4514 15.9548 13.4514C16.8624 13.4514 17.5564 13.7119 18.0369 14.2329C18.5708 14.7018 18.8378 15.353 18.8378 16.1866C18.8378 17.0723 18.5174 17.7757 17.8768 18.2967C17.2895 18.7656 16.4353 19 15.3141 19C13.926 19 12.8315 18.453 12.0307 17.3589C11.2298 16.2648 11.0163 14.6237 11.39 12.4355C11.8171 9.93471 12.8048 7.72048 14.3531 5.7928C15.9548 3.86513 17.9301 1.9635 20.2792 0.0879188Z" fill="%231A1825"/></svg>');
    display: block;
    pointer-events: none;
}

.solutions-big-card__quote-blockquote p {
    font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    opacity: 0.85;
    
    
    margin: 0;

    text-wrap-style: balance;
}

.solutions-big-card__quote-footer {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.solutions-big-card__quote-author {
    font-family: "degular-variable", sans-serif;
    /* font-weight: 500; */
    font-size: 20px;
    line-height: 120%;
    font-style: normal;
}

.solutions-big-card__quote-position {
    font-family: "degular-variable", sans-serif;
    /* font-weight: 500; */
    font-size: 16px;
    line-height: 120%;
}

/* --------------------------------------------------------------------------
   Editor placeholder
   -------------------------------------------------------------------------- */

.solutions-big-card--placeholder {
    padding: 48px;
    background-color: #f5f5f5;
    text-align: center;
    border: 2px dashed #cccccc;
    border-radius: 12px;
    box-shadow: none;
}

.solutions-big-card--placeholder p {
    margin: 0;
    color: #999999;
    font-size: 16px;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 992px) {
}

@media (max-width: 768px) {
    .solutions-big-card {
        grid-template-areas: "hero";
        grid-template-columns: 1fr
    }    

    .solutions-big-card__report,
    .solutions-big-card__quote {
        display: none;
    }
    .solutions-big-card__hero {
        min-height: 468px;
        padding: 25px;
        margin-top: 10px;
    }

    .solutions-big-card__subtitle {
        font-size: 12px;
    }

    .solutions-big-card__hero-bg-img {
        height: calc(100% - 100px);
    }

    /* Gradient overlay for text readability */
    .solutions-big-card__hero-bg::before {
        content: "";
        position: absolute;
        inset: 0;
        /* z-index: 1; */
        pointer-events: none;
        background: linear-gradient(
            to top,
            rgba(0, 0, 0, 0.75) 0%,
            rgba(0, 0, 0, 0.30) 50%,
            transparent 100%
        );
    }

    .solutions-big-card__btn--primary {
        font-size: 16px;
        padding: 18px 24px;
    }

    
    .solutions-big-card__hero-bg .solutions-big-card__hero-bg-blob--bottom {
        background: radial-gradient(ellipse at 0% 109%, rgba(149, 255, 236, 0.75) 0%, rgba(149, 255, 236, 0.45) 15%, rgba(149, 255, 236, 0.15) 33%, transparent 100%);
        opacity: .75;
    }
}