/* 
 * Apple-Material Flat Design System 
 * A blend of Apple's clean, rounded aesthetics with Material color tones.
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    /* Apple-like neutrals */
    --am-bg-color: #fbfbfd;
    --am-surface-color: #ffffff;
    --am-text-primary: #1d1d1f;
    --am-text-secondary: #86868b;
    --am-border-color: rgba(0, 0, 0, 0.06);
    
    /* Material Color Tones (Subdued, flat, rich) */
    --am-primary: #007aff; /* Apple Blue */
    --am-teal: #009688; /* Material Teal */
    --am-indigo: #3f51b5;
    --am-purple: #af52de;
    --am-success: #34c759;
    
    /* Shapes & Shadows */
    --am-radius-sm: 8px;
    --am-radius-md: 18px;
    --am-radius-lg: 24px;
    --am-radius-pill: 980px;
    
    --am-shadow-soft: 0 4px 24px rgba(0, 0, 0, 0.04);
    --am-shadow-hover: 0 10px 40px rgba(0, 0, 0, 0.08);
    
    /* Typography */
    --am-font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

body {
    font-family: var(--am-font-family);
    background-color: var(--am-bg-color);
    color: var(--am-text-primary);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Typography Enhancements */
h1, h2, h3, h4, h5, h6, 
.porto-u-main-heading h2,
.porto-sicon-title {
    font-family: var(--am-font-family);
    letter-spacing: -0.015em;
}

.porto-u-sub-heading, .stats-text, p {
    line-height: 1.6;
    font-family: var(--am-font-family);
}

/* Buttons */
.btn, .porto-btn {
    border-radius: var(--am-radius-pill);
    font-family: var(--am-font-family);
    font-weight: 500;
    letter-spacing: -0.01em;
    padding: 12px 28px;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.porto-btn:hover {
    transform: scale(1.03);
    box-shadow: var(--am-shadow-soft) !important;
    opacity: 0.9;
}

/* Info Boxes (Cards) */
.porto-sicon-box {
    background: var(--am-surface-color);
    border-radius: var(--am-radius-md);
    padding: 30px;
    box-shadow: var(--am-shadow-soft);
    border: 1px solid var(--am-border-color);
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

.porto-sicon-box:hover {
    transform: translateY(-5px);
    box-shadow: var(--am-shadow-hover);
}

.porto-just-icon-wrapper {
    background: var(--am-bg-color);
    box-shadow: inset 0 0 0 1px var(--am-border-color);
}

/* Stats Block */
.stats-block {
    background: var(--am-surface-color);
    border-radius: var(--am-radius-md);
    padding: 30px 20px;
    box-shadow: var(--am-shadow-soft);
    border: 1px solid var(--am-border-color);
    transition: all 0.4s ease;
}

.stats-block:hover {
    transform: translateY(-3px);
    box-shadow: var(--am-shadow-hover);
}

.stats-number, .counter_suffix {
    letter-spacing: -0.03em;
}

/* Header Glassmorphism */
#masthead {
    background-color: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: saturate(180%) blur(20px);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    border-bottom: 1px solid var(--am-border-color);
}