*, *::before, *::after{animation:none !important;transition:none !important;animation-duration:0s !important;transition-duration:0s !important} .tutorial-card{background:rgba(16, 61, 95, 1) !important;border-radius:16px !important;overflow:hidden;box-shadow:0 10px 30px rgba(0, 0, 0, 0.3);transition:all 0.35s ease;display:flex;flex-direction:column;height:100%} .tutorial-card:hover{transform:translateY(-12px);box-shadow:0 25px 50px rgba(0, 0, 0, 0.5)} .card-image{width:100%;height:200px;object-fit:cover;transition:transform 0.4s ease} .tutorial-card:hover .card-image{transform:scale(1.05)} .card-content{padding:1.5rem;flex-grow:1;display:flex;flex-direction:column;color:rgb(254, 254, 254)} .card-tag{display:inline-block;background:#00d4ff;color:#000;font-size:0.75rem;font-weight:700;padding:0.35rem 0.75rem;border-radius:50px;margin-bottom:0.75rem;align-self:flex-start} .card-title{font-size:1.75rem !important;font-weight:700 !important;margin:0 0 0.75rem 0 !important;line-height:1.2;color:rgb(254, 254, 254) !important} .card-description{font-size:1.1rem !important;line-height:1.65;opacity:0.95;margin:0 0 1rem 0;flex-grow:1;color:rgb(254, 254, 254)} .card-date{font-size:0.9rem;opacity:0.7;margin-top:auto;color:rgb(254, 254, 254)} .cards-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(340px, 1fr));gap:2rem;padding:0 1rem} .card-link{text-decoration:none;color:inherit} @media (max-width:480px){.card-title{font-size:1.5rem !important} .card-content{padding:1.25rem} } .cards-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:24px;margin-top:2rem} .tutorial-card{background:rgb(43, 61, 83);border-radius:8px;box-shadow:0 2px 4px rgba(0,0,0,0.1);overflow:hidden;transition:transform 0.2s, box-shadow 0.2s} .tutorial-card:hover{transform:translateY(-4px);box-shadow:0 4px 8px rgba(0,0,0,0.15)} .card-link{color:inherit;text-decoration:none;display:block} .card-image-wrapper{width:100%;height:0;padding-bottom:56.25%;position:relative} .card-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover} .card-content{padding:16px} .card-tag{display:inline-block;font-size:0.8rem;text-transform:uppercase;color:#294172;margin-bottom:8px} .card-title{font-size:1.4rem;margin:4px 0 12px} .card-description{font-size:0.95rem;color:#a5effc;margin-bottom:12px} .card-date{font-size:0.85rem;color:#f7f7f7} .card{background-color:var(--bg-secondary);border:1px solid var(--border-light);border-radius:12px;padding:2rem;transition:all 0.3s ease;position:relative;overflow:hidden} .card:hover{transform:translateY(-4px);border-color:var(--fedora-accent);box-shadow:var(--shadow-md)} .card::before{content:'';position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(to right, var(--fedora-blue), var(--fedora-accent));opacity:0;transition:opacity 0.3s ease} .card:hover::before{opacity:1} .grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:2rem;margin:2rem 0} .badge{display:inline-block;padding:0.25rem 0.75rem;border-radius:16px;font-size:0.875rem;font-weight:500;background-color:var(--bg-elevated);color:var(--text-secondary);border:1px solid var(--border-light)} .badge.primary{background-color:var(--fedora-blue);color:var(--text-primary);border-color:transparent} .badge.accent{background-color:var(--fedora-accent);color:var(--text-primary);border-color:transparent} .alert{padding:1rem 1.5rem;border-radius:8px;margin:1rem 0;border-left:4px solid transparent} .alert.info{background-color:var(--info);background-color:color-mix(in srgb, var(--info) 10%, transparent);border-left-color:var(--info)} .alert.success{background-color:color-mix(in srgb, var(--success) 10%, transparent);border-left-color:var(--success)} .alert.warning{background-color:color-mix(in srgb, var(--warning) 10%, transparent);border-left-color:var(--warning)} .alert.error{background-color:color-mix(in srgb, var(--error) 10%, transparent);border-left-color:var(--error)} .input{background-color:var(--bg-elevated);border:1px solid var(--border-light);border-radius:8px;padding:0.75rem 1rem;color:var(--text-primary);transition:all 0.2s ease;width:100%} .input:focus{outline:none;border-color:var(--fedora-accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--fedora-accent) 25%, transparent)} .code-block{background-color:var(--bg-elevated);border-radius:8px;padding:1.5rem;margin:1.5rem 0;border:1px solid var(--border-light);font-family:'JetBrains Mono', monospace;font-size:0.9rem;line-height:1.5;overflow-x:auto} .code-block pre{margin:0} .spinner{width:24px;height:24px;border:3px solid var(--border-light);border-radius:50%;border-top-color:var(--fedora-accent);animation:none} .tooltip{position:relative;display:inline-block} .tooltip:hover::after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translateX(-50%);padding:0.5rem 1rem;background-color:var(--bg-elevated);color:var(--text-primary);border-radius:4px;font-size:0.875rem;white-space:nowrap;z-index:10;box-shadow:var(--shadow-md)} .hero-box{display:flex;gap:2rem;align-items:center;justify-content:center;max-width:1100px;margin:0 auto 1.5rem;padding:1rem;border-radius:12px;border:1px solid var(--border-light);background:linear-gradient(180deg, rgba(255,255,255,0.01), transparent)} .hero-left{flex:0 0 auto;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:2rem} .hero-right{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem} .hero-logo{width:300px;max-width:100%;height:auto;object-fit:contain} .hero-techy{width:180px;max-width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2));transition:transform 0.3s ease} .hero-techy:hover{transform:scale(1.05)} .hero-techy-large{width:auto;max-width:100%;height:auto;max-height:400px;border-radius:8px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2));transition:transform 0.3s ease} .hero-techy-large:hover{transform:scale(1.05)} .hero-sub{color:var(--text-secondary);margin-top:1rem;text-align:center;max-width:800px;margin-left:auto;margin-right:auto} @media (max-width:860px){.hero-box{flex-direction:column;gap:1rem} .hero-left{flex-direction:column;gap:1rem} .hero-logo{max-height:140px} .hero-techy{width:120px;max-height:150px} .hero-techy-large{max-height:250px;width:auto} } .hero-wrapper{display:grid;grid-template-columns:300px 1fr 300px;gap:2rem;max-width:1600px;margin:0 auto;width:100%;align-items:start} .hero-rss-left, .hero-rss-right{position:relative;z-index:2} .rss-feed-container{background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:12px;padding:1.5rem;max-height:500px;overflow-y:auto;box-shadow:var(--shadow-md)} .rss-title{color:var(--text-primary);font-size:1.5rem;font-weight:600;margin:0 0 1.5rem 0;padding-bottom:1rem;border-bottom:2px solid var(--border-light)} .rss-feed{display:flex;flex-direction:column;gap:1rem} .rss-item{background:var(--bg-elevated);border:1px solid var(--border-light);border-radius:8px;padding:1rem;transition:all 0.3s ease} .rss-item:hover{border-color:var(--fedora-accent);transform:translateX(4px);box-shadow:var(--shadow-sm)} .rss-item-link{text-decoration:none;color:inherit;display:block} .rss-item-title{color:var(--text-primary);font-size:1rem;font-weight:600;margin:0 0 0.5rem 0;line-height:1.4;transition:color 0.2s ease} .rss-item:hover .rss-item-title{color:var(--fedora-accent)} .rss-item-description{color:var(--text-secondary);font-size:0.875rem;line-height:1.5;margin:0 0 0.5rem 0} .rss-item-date{color:var(--text-muted);font-size:0.75rem;display:block;margin-top:0.5rem} .rss-loading, .rss-error{text-align:center;padding:2rem;color:var(--text-secondary)} .rss-error{color:var(--warning)} .rss-feed-container::-webkit-scrollbar{width:8px} .rss-feed-container::-webkit-scrollbar-track{background:var(--bg-elevated);border-radius:4px} .rss-feed-container::-webkit-scrollbar-thumb{background:var(--border-medium);border-radius:4px} .rss-feed-container::-webkit-scrollbar-thumb:hover{background:var(--fedora-accent)} @media (max-width:1200px){.hero-wrapper{grid-template-columns:1fr;gap:2rem} .hero-rss-left{order:-1} .hero-rss-right{order:1} .rss-feed-container{max-height:350px} } @media (max-width:860px){.hero-wrapper{padding:0 1rem} .rss-feed-container{padding:1rem} .rss-title{font-size:1.25rem} } @media (max-width:768px){.project-card{margin-bottom:1.5rem} .card-image-wrapper{height:200px} .card-image{object-fit:cover} .card-footer{flex-direction:column;align-items:flex-start;gap:0.75rem} .card-tech{font-size:0.85rem} .card-link-text{font-size:0.9rem} .download-item{padding:1rem;margin-bottom:1rem} .download-item h3{font-size:1.1rem} .download-item p{font-size:0.9rem} .category-tabs{flex-wrap:wrap;gap:0.5rem;padding:0.5rem} .category-tab{padding:0.5rem 1rem;font-size:0.9rem} .stats-grid{grid-template-columns:repeat(2, 1fr);gap:1rem} .stat-card{padding:1rem} .stat-value{font-size:1.5rem} .stat-label{font-size:0.85rem} .stats-table{font-size:0.85rem} .stats-table th, .stats-table td{padding:0.5rem} .os-card{padding:1rem} .os-card h3{font-size:1.25rem} .os-card p{font-size:0.9rem} .search-container{padding:0.75rem} .search-container input{font-size:1rem;padding:0.75rem} .tabs{flex-wrap:wrap;gap:0.5rem} .tab{padding:0.75rem 1rem;font-size:0.9rem} .admin-form{padding:1rem} .admin-form input, .admin-form textarea, .admin-form select{font-size:1rem;padding:0.75rem} .btn{padding:0.75rem 1.5rem;font-size:0.9rem;width:100%} .rss-feed{font-size:0.9rem} .rss-item{padding:0.75rem;margin-bottom:0.75rem} .rss-item-title{font-size:0.95rem} } @media (max-width:480px){.cards-grid{grid-template-columns:1fr;gap:1rem} .stats-grid{grid-template-columns:1fr} .category-tabs{flex-direction:column} .category-tab{width:100%;text-align:center} .card-image-wrapper{height:180px} .os-card{padding:0.875rem} .download-item{padding:0.875rem} } @media (min-width:769px) and (max-width:1024px){.cards-grid{grid-template-columns:repeat(2, 1fr)} .stats-grid{grid-template-columns:repeat(2, 1fr)} } @media (min-width:1025px){@media (max-width:1440px){.cards-grid{grid-template-columns:repeat(3, 1fr);gap:2rem} .stats-grid{grid-template-columns:repeat(4, 1fr)} .project-card{margin-bottom:2rem} } @media (min-width:1441px) and (max-width:1920px){.cards-grid{grid-template-columns:repeat(3, 1fr);gap:2.5rem} .stats-grid{grid-template-columns:repeat(4, 1fr)} .card-content{padding:1.75rem} .card-title{font-size:1.6rem} .card-description{font-size:1.05rem} } @media (min-width:1921px){.cards-grid{grid-template-columns:repeat(4, 1fr);gap:3rem} .stats-grid{grid-template-columns:repeat(4, 1fr);gap:2rem} .card-content{padding:2rem} .card-title{font-size:1.75rem} .card-description{font-size:1.1rem} .project-card{margin-bottom:2.5rem} .download-item{padding:1.5rem} .download-item h3{font-size:1.5rem} .os-card{padding:1.5rem} .os-card h3{font-size:1.5rem} } }