*{margin:0;padding:0;box-sizing:border-box}:root{--bg-color: #f8fafc;--card-bg: #ffffff;--text-primary: #1a202c;--text-secondary: #4a5568;--shadow-light: rgba(0, 0, 0, .1);--shadow-medium: rgba(0, 0, 0, .15);--border-color: #e2e8f0}[data-theme=dark]{--bg-color: #1a202c;--card-bg: #2d3748;--text-primary: #f7fafc;--text-secondary: #cbd5e0;--shadow-light: rgba(0, 0, 0, .3);--shadow-medium: rgba(0, 0, 0, .5);--border-color: #4a5568}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg-color);color:var(--text-primary);line-height:1.6;padding:2rem;transition:background-color .3s ease,color .3s ease}.header{text-align:center;margin-bottom:3rem}.theme-toggle{position:fixed;top:2rem;right:2rem;background:var(--card-bg);border:2px solid var(--border-color);color:var(--text-primary);padding:.5rem 1rem;border-radius:50px;cursor:pointer;font-size:.9rem;font-weight:500;transition:all .3s ease;z-index:1000}.theme-toggle:hover{transform:scale(1.05);box-shadow:0 4px 12px var(--shadow-light)}.container{max-width:1200px;margin:0 auto}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem;margin-top:2rem}.card{background:var(--card-bg);border-radius:6px;overflow:hidden;box-shadow:0 4px 20px var(--shadow-light);transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;height:400px;cursor:pointer}.card:hover{transform:translateY(-8px);box-shadow:0 12px 40px var(--shadow-medium)}.card-image{width:100%;height:220px;overflow:hidden;position:absolute;top:0;left:0;transition:transform .5s cubic-bezier(.4,0,.2,1)}.card:hover .card-image{transform:translateY(-100%)}.card-image img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:8px 8px 0 0;filter:blur(.5px);transition:transform .3s ease}.card:hover .card-image img{transform:scale(1.05)}.card-content{padding:1.5rem;height:100%;display:flex;flex-direction:column;justify-content:flex-start;position:relative;padding-top:240px;transition:padding-top .5s cubic-bezier(.4,0,.2,1)}.card-content .overlay-image{position:absolute;left:0;width:100%;height:100%;opacity:.6;filter:blur(100px);pointer-events:none}.card:hover .card-content{padding-top:1.5rem}.card-title{font-size:1.5rem;font-weight:700;margin-bottom:.5rem;color:var(--text-primary);transition:all .3s ease}.card-description{color:var(--text-secondary);opacity:1;transition:all .3s ease;font:caption;font-weight:700}.card:hover .card-description{opacity:1}.card-expanded{opacity:0;transform:translateY(10px);transition:all .5s cubic-bezier(.4,0,.2,1);margin-top:1rem}.card-expanded img{max-width:-webkit-fill-available;max-width:-moz-available}.card:hover .card-expanded{opacity:1;transform:translateY(0)}.card-meta{display:flex;gap:1rem;margin-bottom:1rem;font-size:.85rem;color:var(--text-secondary)}.card-tag{background:var(--bg-color);padding:.25rem .75rem;border-radius:20px;font-size:.8rem;font-weight:500;z-index:1}@media (max-width: 768px){.grid{grid-template-columns:1fr;gap:1.5rem}body{padding:1rem}.nav-arrow{position:relative;z-index:1}.nav-arrow.prev{left:1rem}.nav-arrow.next{right:1rem}.theme-toggle{position:absolute;top:1rem;right:1rem}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;backdrop-filter:blur(10px);z-index:1000;display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:all .3s ease;padding:1rem}.modal-overlay.active{opacity:1;visibility:visible}.modal-content{background:var(--card-bg);border-radius:16px;box-shadow:0 20px 60px #0000004d;position:relative;max-height:90vh;overflow-y:auto;transform:scale(.9) translateY(20px);transition:all .3s cubic-bezier(.4,0,.2,1);width:40vw;max-width:90vw;min-width:50vw}.modal-overlay.active .modal-content{transform:scale(1) translateY(0)}.modal-header{position:relative;height:250px;overflow:hidden;border-radius:16px 16px 0 0}.modal-header img{width:100%;height:100%;object-fit:cover;object-position:center}.modal-close{position:absolute;top:1rem;right:1rem;background:#ffffffe6;border:none;border-radius:50%;width:40px;height:40px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.2rem;transition:all .3s ease;z-index:10;min-height:44px;min-width:44px}.modal-link{text-decoration:none!important;position:absolute;top:1rem;right:4.5rem;background:#ffffffe6;border:none;border-radius:50%;width:40px;height:40px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.2rem;transition:all .3s ease;z-index:10;min-height:44px;min-width:44px}.modal-link:hover,.modal-close:hover{background:#fff;transform:scale(1.1)}[data-theme=dark] .modal-close,[data-theme=dark] .modal-link{background:#2d3748e6;color:var(--text-primary)}[data-theme=dark] .modal-close:hover,[data-theme=dark] .modal-link:hover{background:var(--card-bg)}.modal-body{padding:2rem}.modal-overlay-image{position:absolute;left:0;z-index:-1;width:100%;height:100%;opacity:.3;filter:blur(60px);pointer-events:none}.modal-title{font-size:x-large;font-weight:800;margin-bottom:1rem;color:var(--text-primary)}.modal-description{color:var(--text-secondary);margin-bottom:2rem;font:caption;font-weight:700}.modal-content-text{font-size:1.2rem;color:var(--text-primary);margin-bottom:2rem}.modal-content-text p{margin-bottom:1.5rem}.modal-content-text img{max-width:-webkit-fill-available;max-width:-moz-available;width:100%}.modal-meta{display:flex;gap:1rem;margin-bottom:2rem;flex-wrap:wrap}.modal-tag{background:var(--bg-color);padding:.5rem 1rem;border-radius:25px;font-size:.9rem;font-weight:600}.navigation-arrows{position:absolute;top:50%;transform:translateY(-50%);display:flex;gap:1rem}.nav-arrow{background:#ffffffe6;box-shadow:0 4px 20px #0003;border:none;border-radius:50%;width:50px;height:50px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.5rem;transition:all .3s ease;margin:.5vw;position:initial;top:50%;transform:translateY(-50%);z-index:1001;min-height:44px;min-width:44px}.nav-arrow.prev{left:1rem}.nav-arrow.next{right:1rem}.nav-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.1)}.nav-arrow.disabled{opacity:.6}.nav-arrow.disabled:hover{transform:translateY(-50%)}[data-theme=dark] .nav-arrow{background:#2d3748e6;color:var(--text-primary)}[data-theme=dark] .nav-arrow:hover{background:var(--card-bg)}@media (max-width: 768px){.modal-overlay{padding:2rem .5rem .5rem;align-items:flex-start}.modal-content{width:95vw;max-width:none;min-width:unset;margin:0;max-height:85vh;border-radius:12px;min-width:fit-content}.modal-header{height:200px;border-radius:12px 12px 0 0}.modal-body{padding:1.5rem}.modal-close,.modal-link{width:36px;height:36px;min-width:44px;min-height:44px;font-size:1rem;top:.75rem}.modal-close{right:.75rem}.modal-link{right:3.5rem}.modal-title{font-size:1.5rem}.modal-content-text{font-size:1rem}.modal-meta{gap:.5rem}.modal-tag{padding:.375rem .75rem;font-size:.8rem}.nav-arrow{width:44px;height:44px;font-size:icon;margin:0;position:relative}.nav-arrow.prev{left:2.5rem}.nav-arrow.next{right:2.5rem}.modal-content{-webkit-overflow-scrolling:touch}.modal-description{font-size:.9rem;line-height:1.5}.modal-content-text img{height:auto;border-radius:8px;margin:1rem 0}}@media (max-width: 480px){.modal-overlay{padding:1rem .25rem .25rem}.modal-content{width:98vw;max-height:90vh;border-radius:8px}.modal-header{height:180px;border-radius:8px 8px 0 0}.modal-body{padding:1rem}.modal-close,.modal-link{width:32px;height:32px;top:.5rem;font-size:.9rem}.modal-close{right:.5rem}.modal-link{right:3rem}.modal-title{font-size:1.25rem;margin-bottom:.75rem}.nav-arrow{width:40px;height:40px;font-size:icon;position:relative}.nav-arrow.prev{left:3.25rem}.nav-arrow.next{right:3.25rem}}.pagination{text-align:center;margin-top:20px}.pagination button{margin:0 5px;padding:10px 15px;border:none;background-color:#007bff;color:#fff;cursor:pointer;border-radius:5px;transition:background-color .3s}.pagination button:disabled{background-color:#ccc}.pagination button:hover:not(:disabled){background-color:#0056b3}.pagination span{margin:0 5px;font-weight:700;font-size:x-large;color:var(--text-primary)}