/* ==========================================================================
   Local Font Definitions - Poppins & Inter
   ========================================================================== */

/* Poppins - Light (300) */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('../fonts/poppins-300.woff2') format('woff2');
}

/* Poppins - Regular (400) */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/poppins-400.woff2') format('woff2');
}

/* Poppins - Medium (500) */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/poppins-500.woff2') format('woff2');
}

/* Poppins - SemiBold (600) */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/poppins-600.woff2') format('woff2');
}

/* Poppins - Bold (700) */
@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/poppins-700.woff2') format('woff2');
}

/* Inter - Regular (400) */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/inter-400.woff2') format('woff2');
}

/* Inter - Medium (500) */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/inter-500.woff2') format('woff2');
}

/* Inter - SemiBold (600) */
@font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/inter-600.woff2') format('woff2');
}

/* Playfair Display - SemiBold Italic (600) - For accent text */
@font-face {
    font-family: 'Playfair Display';
    font-style: italic;
    font-weight: 600;
    font-display: swap;
    src: url('../fonts/playfair-600i.woff2') format('woff2');
}

/* Accent text class for gradient highlighted words */
.text-accent {
    font-family: 'Playfair Display', Georgia, serif;
    font-style: italic;
    font-weight: 600;
    background: linear-gradient(135deg, #00BFFF 0%, #1E90FF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* White accent text for dark backgrounds */
.text-accent-white {
    font-family: 'Playfair Display', Georgia, serif;
    font-style: italic;
    font-weight: 600;
    color: white;
}

/* ==========================================================================
   Stats Card with Corner Cutout for Circle Icon
   ========================================================================== */

.stat-card-cutout {
    --r: 12px; /* border radius of the card */
    --s: 24px; /* size of the inner curve */
    
    position: relative;
    border-radius: var(--r);
    background: white;
    
    /* CSS mask to create the curved cutout at top-right corner */
    --_m:/calc(2*var(--r)) calc(2*var(--r)) radial-gradient(#000 70%,#0000 72%) no-repeat;
    mask:
        right calc(var(--s) + var(--r)) top 0 var(--_m),
        right calc(var(--s) + var(--r)) var(--_m),
        radial-gradient(var(--s) at 100% 0,#0000 99%,#000 calc(100% + 1px))
          calc(-1*var(--r)) var(--r) no-repeat,
        conic-gradient(at calc(100% - var(--s) - 2*var(--r)) calc(var(--s) + 2*var(--r)),
         #0000 25%,#000 0);
    -webkit-mask:
        right calc(var(--s) + var(--r)) top 0 var(--_m),
        right calc(var(--s) + var(--r)) var(--_m),
        radial-gradient(var(--s) at 100% 0,#0000 99%,#000 calc(100% + 1px))
          calc(-1*var(--r)) var(--r) no-repeat,
        conic-gradient(at calc(100% - var(--s) - 2*var(--r)) calc(var(--s) + 2*var(--r)),
         #0000 25%,#000 0);
}
