:root{--color-primary: #5b4e8c;--color-primary-light: #7b6eac;--color-primary-dark: #3b2e6c;--primary-50: #f5f3f7;--primary-100: #ebe7f0;--primary-200: #d7cfe1;--primary-300: #c3b7d2;--primary-400: #9f8fbc;--primary-500: #7b6eac;--primary-600: #5b4e8c;--primary-700: #4a3e7c;--primary-800: #3b2e6c;--primary-900: #2c1e5c;--color-accent: #e8b04b;--color-accent-light: #f0c66b;--color-accent-dark: #c89a3b;--accent-50: #fff9e6;--accent-100: #fff3cd;--accent-200: #ffe79b;--accent-300: #ffdb69;--accent-400: #f0c66b;--accent-500: #e8b04b;--accent-600: #c89a3b;--accent-700: #a8842b;--accent-800: #886e1b;--accent-900: #68580b;--color-secondary: #4a8b8c;--color-secondary-light: #6aaaac;--color-secondary-dark: #2a6b6c;--secondary-50: #e6f7f7;--secondary-100: #cdeff0;--secondary-200: #9bdfe0;--secondary-300: #6aaaac;--secondary-400: #5a9a9c;--secondary-500: #4a8b8c;--secondary-600: #3a7b7c;--secondary-700: #2a6b6c;--secondary-800: #1a5b5c;--secondary-900: #0a4b4c;--color-dark: #1a1625;--color-dark-soft: #2d2838;--color-gray-900: #3f3a4b;--color-gray-800: #4f495b;--color-gray-700: #5e5869;--color-gray-600: #6b6574;--color-gray-500: #8e8896;--color-gray-400: #aea8b6;--color-gray-300: #c4bfc9;--color-gray-200: #d8d4dd;--color-gray-100: #f0eef2;--color-gray-50: #f7f6f9;--color-white: #ffffff;--color-off-white: #faf9fb;--color-success: #52c41a;--color-success-light: #73d13d;--color-warning: #faad14;--color-warning-light: #ffc53d;--color-error: #f5222d;--color-error-light: #ff4d4f;--color-info: #1890ff;--color-info-light: #40a9ff;--filter-active-bg: var(--color-primary);--filter-active-color: var(--color-white);--filter-active-border: var(--color-primary);--filter-hover-bg: var(--primary-50);--filter-hover-color: var(--primary-700);--filter-hover-border: var(--primary-300);--all-lang-inactive-bg: linear-gradient(135deg, var(--primary-50), var(--accent-50));--all-lang-inactive-border: var(--color-gray-200);--all-lang-inactive-color: var(--color-gray-700);--all-lang-active-bg: var(--color-primary);--all-lang-active-border: var(--color-primary);--all-lang-active-color: var(--color-white);--font-display: "Crimson Text", serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-system: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--fs-hero: clamp(2.5rem, 5vw + 1rem, 4.5rem);--fs-h1: clamp(2rem, 4vw + 1rem, 3.5rem);--fs-h2: clamp(1.75rem, 3vw + .5rem, 2.5rem);--fs-h3: clamp(1.25rem, 2vw + .5rem, 1.75rem);--fs-h4: clamp(1.125rem, 1.5vw + .5rem, 1.5rem);--fs-body: clamp(1rem, 1vw + .75rem, 1.125rem);--fs-small: .875rem;--fs-tiny: .75rem;--fw-light: 300;--fw-normal: 400;--fw-medium: 500;--fw-semibold: 600;--fw-bold: 700;--lh-tight: 1.2;--lh-normal: 1.6;--lh-relaxed: 1.8;--ls-tight: -.02em;--ls-normal: 0;--ls-wide: .025em;--ls-wider: .05em;--space-xs: .5rem;--space-sm: 1rem;--space-md: 1.5rem;--space-lg: 2rem;--space-xl: 3rem;--space-2xl: 4.5rem;--space-3xl: 6rem;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--spacing-2xl: 48px;--spacing-3xl: 64px;--container-max: 1200px;--container-padding: clamp(1rem, 5vw, 2rem);--container-wide: 1600px;--radius-sm: .375rem;--radius-md: .625rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--radius-full: 9999px;--shadow-sm: 0 2px 4px rgba(26, 22, 37, .08);--shadow-md: 0 4px 12px rgba(26, 22, 37, .12);--shadow-lg: 0 8px 24px rgba(26, 22, 37, .16);--shadow-xl: 0 16px 48px rgba(26, 22, 37, .24);--shadow-primary: 0 4px 12px rgba(91, 78, 140, .25);--shadow-accent: 0 4px 12px rgba(232, 176, 75, .25);--shadow-secondary: 0 4px 12px rgba(74, 139, 140, .25);--transition-base: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .6s cubic-bezier(.4, 0, .2, 1);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s ease;--z-base: 0;--z-dropdown: 100;--z-sticky: 200;--z-overlay: 300;--z-modal: 400;--z-toast: 500;--z-tooltip: 600;--breakpoint-sm: 480px;--breakpoint-md: 768px;--breakpoint-lg: 1024px;--breakpoint-xl: 1280px;--breakpoint-2xl: 1536px}.resources-hero{background:linear-gradient(135deg,var(--primary-50) 0%,var(--accent-50) 100%);padding:80px 0 60px;border-bottom:1px solid var(--gray-100)}.hero-title{font-family:Crimson Text,serif;font-size:3rem;font-weight:600;color:var(--gray-900);margin-bottom:12px;text-align:center}.hero-subtitle{font-size:1.15rem;color:var(--gray-600);text-align:center;max-width:600px;margin:0 auto 40px}.stats-bar{display:flex;justify-content:center;gap:60px;padding:30px;background:#fff;border-radius:12px;box-shadow:0 2px 12px #0000000f}.stat{text-align:center}.stat-number{display:block;font-size:2rem;font-weight:700;color:var(--primary-600);margin-bottom:4px}.stat-label{font-size:.85rem;color:var(--gray-500);text-transform:uppercase;letter-spacing:.5px}.filter-section{padding:30px 0;background:#fff;border-bottom:1px solid var(--gray-100);position:sticky;top:0;z-index:100;box-shadow:0 2px 8px #0000000a}.filter-section .container{display:flex;flex-direction:column;gap:20px}.filter-row{display:flex;justify-content:space-between;align-items:center}.filter-group{display:flex;align-items:center;gap:16px}.filter-label{font-size:.9rem;color:var(--gray-700);font-weight:600;text-transform:uppercase;letter-spacing:.5px}.lang-filter{padding:8px 16px;background:#fff;border:1px solid var(--gray-200);border-radius:24px;font-size:.9rem;font-weight:500;color:var(--gray-700);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:6px}.lang-filter:hover{border-color:var(--primary-400);background:var(--primary-50);color:var(--primary-700)}.filter-section .language-filters .lang-filter.active{background-color:var(--filter-active-bg);border-color:var(--filter-active-border);color:var(--filter-active-color)}.filter-section .language-filters .lang-filter.active span{color:var(--filter-active-color);opacity:1}.filter-icon{font-size:1.1rem}.type-filters{display:flex;gap:8px;flex-wrap:wrap}.type-filter{padding:10px 16px;background:#fff;border:2px solid var(--gray-200);border-radius:8px;font-size:.9rem;font-weight:600;color:var(--gray-700);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:8px;position:relative}.type-filter:hover{border-color:var(--primary-400);background:var(--primary-50);transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.filter-section .type-filters .type-filter.active{background-color:var(--filter-active-bg);border-color:var(--filter-active-border);color:var(--filter-active-color);box-shadow:0 4px 16px #5b4e8c40}.filter-section .type-filters .type-filter.active span{color:var(--filter-active-color);opacity:1}.type-filter-icon{font-size:1.1rem;display:inline-block}.type-filter-label{font-size:.9rem;font-weight:600}.filter-section button.lang-filter.active,.filter-section button.type-filter.active{background-color:var(--filter-active-bg);color:var(--filter-active-color);border-color:var(--filter-active-border)}.filter-section button.lang-filter.active *,.filter-section button.type-filter.active *{color:var(--filter-active-color);opacity:1}.view-toggle{display:flex;gap:4px;background:var(--gray-100);padding:4px;border-radius:8px}.view-btn{padding:6px 10px;background:transparent;border:none;border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;color:var(--gray-600)}.view-btn:hover{background:#fff;color:var(--gray-900)}.view-btn.active{background:#fff;color:var(--primary-600);box-shadow:0 1px 3px #0000001a}.resources-by-type{padding:60px 0;background:#fafafa}.type-section{margin-bottom:60px}.type-header{display:flex;align-items:center;gap:12px;padding-bottom:20px;margin-bottom:24px;border-bottom:2px solid var(--gray-100);cursor:pointer;user-select:none;transition:all .2s ease}.type-header:hover{padding-left:8px}.type-icon{font-size:1.5rem}.type-title{font-size:1.75rem;font-weight:600;color:var(--gray-900);margin:0}.type-count{background:var(--gray-100);color:var(--gray-600);padding:4px 12px;border-radius:12px;font-size:.85rem;font-weight:500;margin-left:auto}.type-toggle{margin-left:12px;font-size:.9rem;color:var(--gray-400);transition:transform .3s ease}.type-header.collapsed .type-toggle{transform:rotate(-90deg)}.type-header.collapsed{margin-bottom:0;padding-bottom:20px}.type-header.collapsed+.resources-grid{max-height:0;overflow:hidden;opacity:0;margin:0;transition:all .4s cubic-bezier(.4,0,.2,1)}.resources-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;opacity:1;transition:opacity .3s ease}.resources-grid.list-view{grid-template-columns:1fr}.resource-card{background:#fff;border:1px solid var(--gray-100);border-radius:8px;padding:20px;transition:all .2s ease;position:relative;display:flex;flex-direction:column;overflow:hidden}.resource-card:hover{border-color:var(--gray-200);box-shadow:0 4px 12px #00000014;transform:translateY(-2px)}.language-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;background:var(--primary-50);border:1px solid var(--primary-200);border-radius:12px;font-size:.7rem;font-weight:600;color:var(--primary-700);margin-bottom:8px;float:right;clear:right}.language-badge.dutch{background:#fff4e6;border-color:#ffcc80;color:#e65100}.language-badge.danish{background:#e8f5e9;border-color:#a5d6a7;color:#2e7d32}.language-badge.portuguese{background:#fce4ec;border-color:#f8bbd0;color:#c2185b}.language-badge.italian{background:#e3f2fd;border-color:#90caf9;color:#1565c0}.language-badge.indonesian{background:#fff3e0;border-color:#ffcc80;color:#e65100}.language-badge.korean{background:#f3e5f5;border-color:#ce93d8;color:#7b1fa2}.language-badge.hindi{background:#fff8e1;border-color:#ffe082;color:#f57c00}.language-badge.swahili{background:#e0f2f1;border-color:#80cbc4;color:#00695c}.language-badge.japanese{background:#fce4ec;border-color:#f8bbd0;color:#c2185b}.language-badge.swedish{background:#e1f5fe;border-color:#81d4fa;color:#0277bd}.language-badge.finnish{background:#e8eaf6;border-color:#9fa8da;color:#3949ab}.language-badge.polish{background:#ffebee;border-color:#ef9a9a;color:#c62828}.language-badge.vietnamese{background:#fff9c4;border-color:#fff176;color:#f57f17}.card-header{margin-bottom:12px;display:flex;flex-direction:column;gap:4px}.resource-title{font-size:1.1rem;font-weight:600;color:var(--primary-600);text-decoration:none;display:block;margin-bottom:4px;margin-right:10px;transition:color .2s ease;clear:left;line-height:1.4}.resource-title:hover{color:var(--primary-700);text-decoration:underline}.resource-description{color:var(--gray-600);font-size:.9rem;line-height:1.5;margin-bottom:12px;flex-grow:1}.resource-features{margin-bottom:12px;color:var(--gray-500);font-size:.85rem}.feature-item{display:inline-block;margin-right:12px}.feature-item:before{content:"•";margin-right:4px;color:var(--accent-500)}.resource-meta{display:flex;gap:8px;flex-wrap:wrap;padding-top:12px;border-top:1px solid var(--gray-100)}.meta-badge{padding:3px 10px;border-radius:4px;font-size:.75rem;font-weight:600}.meta-badge.free{background:var(--accent-100);color:var(--accent-700)}.meta-badge.paid{background:var(--gray-100);color:var(--gray-600)}.meta-badge.level{background:var(--primary-50);color:var(--primary-700)}.resources-grid.list-view .resource-card{flex-direction:row;align-items:flex-start;gap:20px}.resources-grid.list-view .language-badge{position:absolute;top:10px;right:15px;margin-bottom:0;float:none}.resources-grid.list-view .card-header{flex:1;margin-bottom:0}.resources-grid.list-view .resource-description{margin-bottom:4px}.empty-state{text-align:center;padding:60px 20px;color:var(--gray-500)}.empty-icon{font-size:3rem;opacity:.3;margin-bottom:16px}.empty-message{font-size:1.1rem;margin-bottom:8px}.empty-hint{font-size:.9rem;color:var(--gray-400)}.loading-card{background:#fff;border:1px solid var(--gray-100);border-radius:8px;padding:20px;animation:pulse 1.5s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.loading-line{height:12px;background:var(--gray-100);border-radius:4px;margin-bottom:8px}.loading-line.title{width:60%;height:16px}.loading-line.description{width:100%}.loading-line.description:last-child{width:80%}@media(max-width:900px){.filter-row{flex-direction:column;gap:15px;align-items:stretch}.filter-group{flex-direction:column;gap:10px}.type-filters{justify-content:flex-start}.view-toggle{align-self:center}}@media(max-width:768px){.hero-title{font-size:2rem}.stats-bar{gap:30px;padding:20px}.stat-number{font-size:1.5rem}.filter-section .container{flex-direction:column;gap:20px}.resources-grid{grid-template-columns:1fr}.type-header{flex-wrap:wrap}.type-title{font-size:1.25rem}}@media(max-width:480px){.stats-bar{flex-wrap:wrap;gap:20px}.stat{width:45%}}.filter-section .lang-filter.active,.filter-section .type-filter.active,.filter-section button.lang-filter.active,.filter-section button.type-filter.active{background:var(--filter-active-bg);background-color:var(--filter-active-bg);color:var(--filter-active-color);border:2px solid #4a3f79}.filter-section .lang-filter.active span,.filter-section .type-filter.active span,.filter-section button.lang-filter.active span,.filter-section button.type-filter.active span,.filter-section .lang-filter.active *,.filter-section .type-filter.active *,.filter-section button.lang-filter.active *,.filter-section button.type-filter.active *{color:var(--filter-active-color);opacity:1}.filter-section .lang-filter.active:hover,.filter-section .type-filter.active:hover,.filter-section button.lang-filter.active:hover,.filter-section button.type-filter.active:hover{background:#6b5e9c;background-color:#6b5e9c;border-color:var(--filter-active-border)}
