/* ========================================
   LIQUID GLASS EFFECT - CONTROL VARIABLES
   ======================================== */

:root {
    /* ========================================
       INNER SHADOW CONTROL
       ======================================== */

    /* Offset pozicija inner shadow-a (0 = centrirano) */
    --shadow-offset: 0;

    /* Blur intenzitet inner shadow-a (0-50px) */
    --shadow-blur: 15px;

    /* Spread inner shadow-a (-10px do 10px, negativno = unutra) */
    --shadow-spread: -3px;

    /* Boja inner shadow-a (RGBA format) */
    --shadow-color: rgba(255, 255, 255, 0.1);


    /* ========================================
       GLASS TINT CONTROL
       ======================================== */

    /* RGB vrednosti za tint boju (bez alpha) */
    --tint-color: 0, 0, 0;

    /* Transparentnost tint-a (0-1, gde 0 = potpuno providno) */
    --tint-opacity: 0.05;


    /* ========================================
       FROST BLUR CONTROL
       ======================================== */

    /* Intenzitet backdrop blur efekta (0-30px) */
    --frost-blur: 5px;


    /* ========================================
       SVG NOISE/DISTORTION CONTROL
       ======================================== */

    /* Frekvencija noise pattern-a (0-0.02, veće = više detalja) */
    --noise-frequency: 0.012;

    /* Jačina distorzije (0-200, veće = više distorzije) */
    --distortion-strength: 0;


    /* ========================================
       OUTER SHADOW CONTROL
       ======================================== */

    /* Blur intenzitet spoljašnje senke (0-50px) */
    --outer-shadow-blur: 16px;

    /* Boja spoljašnje senke */
    --outer-shadow-color: rgba(0, 0, 0, 0.15);


    /* ========================================
       BORDER RADIUS CONTROL
       ======================================== */

    /* Zaobljenost uglova (px) */
    --glass-border-radius: 16px;


    /* ========================================
       POSITIONING CONTROL
       ======================================== */

    /* Unutrašnji razmak (padding) */
    --glass-padding: 24px;

    /* Z-index nivo */
    --glass-z-index: 2;
}

/* ========================================
     LIQUID GLASS EFFECT IMPLEMENTATION
     ======================================== */

.home-header_bottom {
    z-index: var(--glass-z-index);
    grid-column-gap: var(--fixed--2rem);
    grid-row-gap: var(--fixed--2rem);
    justify-content: space-between;
    align-items: flex-end;
    width: 100%;
    display: flex;
    position: relative;

    /* Liquid Glass Effect - Real Implementation */
    border-radius: var(--glass-border-radius);
    isolation: isolate;

    padding: var(--glass-padding);
}

.home-header_bottom::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: var(--glass-border-radius);
    box-shadow: inset var(--shadow-offset) var(--shadow-offset) var(--shadow-blur) var(--shadow-spread) var(--shadow-color);
    background-color: rgba(var(--tint-color), var(--tint-opacity));
}

.home-header_bottom::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: var(--glass-border-radius);
    backdrop-filter: blur(var(--frost-blur));
    filter: url(#glass-distortion);
    isolation: isolate;
    -webkit-backdrop-filter: blur(var(--frost-blur));
    -webkit-filter: url("#glass-distortion");
}

/* ========================================
     PRESET CONFIGURATIONS
     ======================================== */

/* Subtle Glass Effect */
.liquid-glass-subtle {
    --shadow-blur: 10px;
    --shadow-spread: -2px;
    --tint-opacity: 0.1;
    --frost-blur: 1px;
    --distortion-strength: 30;
    --outer-shadow-blur: 12px;
}

/* Strong Glass Effect */
.liquid-glass-strong {
    --shadow-blur: 30px;
    --shadow-spread: -8px;
    --tint-opacity: 0.6;
    --frost-blur: 5px;
    --distortion-strength: 120;
    --outer-shadow-blur: 40px;
}

/* Colored Glass Effect */
.liquid-glass-colored {
    --tint-color: 100, 200, 255;
    /* Plava nijansa */
    --tint-opacity: 0.3;
    --shadow-color: rgba(100, 200, 255, 0.5);
}

/* Frosted Glass Effect */
.liquid-glass-frosted {
    --frost-blur: 15px;
    --tint-opacity: 0.1;
    --shadow-blur: 5px;
    --distortion-strength: 20;
}

/* Team Section Liquid Glass Effect */
.team-glass-wrapper {
    z-index: var(--glass-z-index);
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: relative;

    /* Liquid Glass Effect - Real Implementation */
    border-radius: var(--glass-border-radius);
    isolation: isolate;
    padding: var(--glass-padding);
}

.team-glass-wrapper::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    border-radius: var(--glass-border-radius);
    box-shadow: inset var(--shadow-offset) var(--shadow-offset) var(--shadow-blur) var(--shadow-spread) var(--shadow-color);
    background-color: rgba(var(--tint-color), var(--tint-opacity));
}

.team-glass-wrapper::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: var(--glass-border-radius);
    backdrop-filter: blur(var(--frost-blur));
    filter: url(#glass-distortion);
    isolation: isolate;
    -webkit-backdrop-filter: blur(var(--frost-blur));
    -webkit-filter: url("#glass-distortion");
}