*, *::before, *::after{animation:none !important;transition:none !important;animation-duration:0s !important;transition-duration:0s !important} .site-header .main-nav ul li a,.site-header .dropdown-menu,.site-header .dropdown-menu a,.site-header .hamburger span{transition-duration:0.2s !important;transition-timing-function:ease-in-out !important;transition-property:all !important} .site-header .main-nav ul{transition:right 0.3s ease !important} .site-header .hamburger span{transition:all 0.3s ease !important} :root{--fedora-blue:#294172;--fedora-accent:#51A2DA;--fedora-light:#729FCF;--bg-primary:#0C1218;--bg-secondary:#1C242C;--bg-elevated:#2A333D;--text-primary:#FFFFFF;--text-secondary:#B2C1D1;--text-muted:#8494A4;--hover-bg:#3A434D;--active-bg:#51A2DA20;--gitlab-color:#FC6D26;--success:#4AD15F;--warning:#FFB86B;--error:#FF5C5C;--info:#51A2DA;--border-light:#2A333D;--border-medium:#3A434D;--shadow-sm:0 2px 4px rgba(0,0,0,0.1);--shadow-md:0 4px 8px rgba(0,0,0,0.12);--shadow-lg:0 8px 16px rgba(0,0,0,0.14)} .header-actions{display:flex;align-items:center;gap:1rem;margin-left:auto} .header-actions a{display:flex;align-items:center;padding:0.5rem;color:var(--text-primary);text-decoration:none;border-radius:4px;transition:background-color 0.2s, transform 0.2s} .header-actions a:hover{background-color:var(--hover-bg);transform:translateY(-1px)} .header-actions .github::before{content:'';display:block;width:24px;height:24px;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23fff"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>') no-repeat center} .header-actions .gitlab::before{content:'';display:block;width:24px;height:24px;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FC6D26"><path d="M23.955 13.587l-1.342-4.135-2.664-8.189a.455.455 0 00-.867 0L16.418 9.45H7.582L4.918 1.263a.455.455 0 00-.867 0L1.386 9.45.045 13.587a.924.924 0 00.331 1.023L12 23.054l11.624-8.443a.924.924 0 00.331-1.024"/></svg>') no-repeat center} .header-actions .kofi::before{content:'';display:block;width:24px;height:24px;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23FF5E5B"><path d="M23.881 8.948c-.773-4.085-4.859-4.593-4.859-4.593H.723c-.604 0-.679.798-.679.798s-.082 7.324-.022 11.822c.164 2.424 2.191 2.234 2.191 2.234s8.267.023 11.966-.013c2.438-.022 2.766-1.313 2.766-1.313s.433-2.891.433-5.743c0-2.411-.433-5.743-.433-5.743s-.14-1.34-2.063-1.385c-1.921-.045-5.965.005-5.965.005s-.248-.039-.372.261c-.124.301-.016 1.115-.016 1.115s1.004 2.562 1.193 3.055c.189.493.713 1.002 1.234.998 1.207-.009 2.006-.284 2.006-.284s.271 1.519.271 2.801c0 1.282-.271 2.801-.271 2.801s-.799.275-2.006.284c-.521.004-1.045-.505-1.234-.998-.189-.493-1.193-3.055-1.193-3.055s-.108-.814.016-1.115c.124-.3.372-.261.372-.261s4.044-.05 5.965-.005c1.923.045 2.063 1.385 2.063 1.385s.433 3.332.433 5.743c0 2.852-.433 5.743-.433 5.743s-.328 1.291-2.766 1.313c-3.699.036-11.966.013-11.966.013s-2.027.19-2.191-2.234c-.06-4.498.022-11.822.022-11.822s.075-.798.679-.798h18.299s4.086.508 4.859 4.593z"/></svg>') no-repeat center;background-size:contain} .tutorials-list{padding:3rem 1rem;max-width:1400px;margin:0 auto} .page-title{text-align:center;font-size:2.5rem;margin-bottom:3rem;color:rgb(254, 254, 254)} .card-image-wrapper{width:100%;height:300px;overflow:hidden;position:relative;border-bottom:1px solid #eee} body{background-color:var(--bg-primary);color:var(--text-primary);font-family:"Inter", -apple-system, "Segoe UI", Roboto, sans-serif;margin:0;padding:0;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;opacity:1 !important;transition:none !important} body.home-page,body.articles,body.projects,body.downloads,body.tutorials,body.about,body.os-downloads{background-image:linear-gradient(rgba(12, 18, 24, 0.5), rgba(12, 18, 24, 0.5)), url('/assets/images/background.avif') !important;background-size:cover !important;background-position:center !important;background-repeat:no-repeat !important;background-attachment:fixed !important} body.home-page{background-image:url('/assets/images/overlay.avif'), url('/assets/images/background.avif') !important} body.fade-in{opacity:1 !important} body.fade-out{opacity:1 !important} .site-header{background-color:var(--bg-secondary);-webkit-backdrop-filter:blur(8px) saturate(120%);backdrop-filter:blur(8px) saturate(120%);position:sticky;top:0;z-index:100;border-bottom:none;will-change:transform;transform:translateZ(0);-webkit-transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden;isolation:isolate} .header-container{max-width:1400px;margin:0 auto;padding:0 2rem;height:72px;display:flex;justify-content:space-between;align-items:center} .logo-container{display:flex;align-items:center} .logo-link{display:flex;align-items:center;text-decoration:none;transition:opacity 0.2s ease-in-out} .logo-link:hover{opacity:0.9} .logo-link:after{display:none} .logo-link img{height:64px;width:auto;object-fit:contain} .main-nav{margin:0 2rem} .main-nav ul{list-style:none;display:flex;margin:0;padding:0;gap:0.5rem} .main-nav ul li{position:relative} .main-nav ul li a{color:var(--text-secondary);text-decoration:none;font-weight:500;transition:all 0.2s ease-in-out;padding:0.625rem 1rem;border-radius:6px;display:flex;align-items:center;gap:0.5rem} .main-nav ul li a:hover, .main-nav ul li a.active{color:var(--text-primary);background-color:var(--hover-bg)} .dropdown{position:relative} .content h1{position:relative;display:inline-block;color:var(--text-primary);font-size:2.5rem;margin-bottom:2rem;padding-bottom:1rem} .content h1::after{content:'';position:absolute;left:50%;bottom:-10px;height:4px;width:60%;background:linear-gradient(90deg, rgba(81,162,218,0.95), rgba(41,65,114,0.95));border-radius:3px;transform:translateX(-50%);animation:none} .main-nav ul li a:focus{outline:none;box-shadow:0 0 0 3px rgba(81,162,218,0.12);border-radius:6px} .dropdown-toggle::after{content:'';border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid currentColor;margin-left:0.5rem} .dropdown-menu{position:absolute;top:100%;left:0;background-color:var(--bg-elevated);border:1px solid var(--border-light);border-radius:8px;padding:0.5rem;min-width:200px;box-shadow:var(--shadow-md);opacity:0;visibility:hidden;transform:translateY(10px);transition:all 0.2s ease-in-out} .dropdown:hover .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)} .dropdown-menu li{margin:0} .dropdown-menu a{padding:0.75rem 1rem;display:block;border-radius:4px} .sr-only{position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);white-space:nowrap} .cta-logo{width:20px;height:auto;margin-right:0.5rem} .icon{width:16px;height:16px} .cta .cta-content .button{display:inline-flex;align-items:center;gap:0.5rem} .nux-hint{padding:2rem 0;background:transparent;margin-top:0;border-top:none} .nux-hint .container{max-width:1100px;margin:0 auto;padding:0 2rem} .nux-title{margin:0 0 0.5rem 0;color:var(--text-secondary);font-weight:600} .nux-code{background:var(--bg-elevated);color:var(--text-primary);padding:1rem;border-radius:8px;font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, 'Courier New', monospace;font-size:0.95rem;white-space:pre-wrap;word-break:break-word;box-shadow:0 2px 6px rgba(0,0,0,0.3);margin-bottom:0.5rem} .nux-meta{display:flex;justify-content:flex-end;color:var(--text-muted)} .hero{min-height:calc(90vh - 72px);background:var(--bg-primary);display:flex;align-items:center;justify-content:center;text-align:center;position:relative;padding:5rem 2rem;overflow:hidden} .hero-wrapper{width:100%;max-width:1400px} .hero::before{display:none} .hero-content{position:relative;z-index:2;max-width:100%;animation:none} .hero-content h1{font-size:4rem;margin-bottom:1.5rem;font-weight:800;background:linear-gradient(135deg, var(--fedora-blue), var(--fedora-accent));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;line-height:1.2} .hero-content p{font-size:1.25rem;font-weight:400;color:var(--text-secondary);max-width:600px;margin:0 auto 2rem;line-height:1.8} .hero-actions{display:flex;gap:1rem;justify-content:center;align-items:center} .features{padding:6rem 0;background-color:var(--bg-secondary);position:relative} .features::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg, transparent 0%, var(--border-medium) 15%, var(--border-medium) 85%, transparent 100% )} .section-title{text-align:center;margin-bottom:4rem;font-size:2.5rem;color:var(--text-primary);position:relative} .section-title::after{content:'';position:absolute;bottom:-1rem;left:50%;transform:translateX(-50%);width:60px;height:4px;background:linear-gradient(90deg, rgba(81,162,218,0.95), rgba(41,65,114,0.95));border-radius:2px;animation:none} .container{max-width:1200px;margin:0 auto;padding:0 2rem} .cta{padding:6rem 0;background-color:var(--bg-primary);text-align:center} .cta-content{max-width:1200px;margin:0 auto;text-align:center} .cta-content h2{font-size:2.5rem;margin-bottom:1.5rem;color:var(--text-primary);position:relative;display:inline-block} .cta-content h2::after{content:'';position:absolute;left:50%;bottom:-0.5rem;height:4px;width:60%;background:linear-gradient(90deg, rgba(81,162,218,0.95), rgba(41,65,114,0.95));border-radius:3px;transform:translateX(-50%);animation:none} .cta-content p{color:var(--text-secondary);margin-bottom:2rem;font-size:1.2rem} .cta-buttons{display:grid;grid-template-columns:repeat(5, 1fr);gap:0.5rem;margin:1.5rem auto 0;width:100%;max-width:100%;padding:0 0.25rem;box-sizing:border-box} .cta-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0.6rem 0.35rem;background:var(--bg-secondary);border:1px solid var(--border-light);border-radius:8px;text-decoration:none;color:var(--text-primary);transition:all 0.3s ease;min-height:0;box-sizing:border-box} .cta-card:hover{transform:translateY(-8px);border-color:var(--fedora-accent);box-shadow:var(--shadow-lg);background:var(--bg-elevated)} .cta-card-icon{font-size:1.35rem;margin-bottom:0.25rem;line-height:1;filter:drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));display:flex;align-items:center;justify-content:center} .cta-card-icon img{width:24px;height:24px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2))} .cta-card-text{font-size:0.75rem;font-weight:600;text-align:center;color:var(--text-primary);word-wrap:break-word;overflow-wrap:break-word;line-height:1.2} .cta-card:hover .cta-card-text{color:var(--fedora-accent)} @media (max-width:1024px){.cta-buttons{grid-template-columns:repeat(3, 1fr);gap:0.5rem} .cta-card{padding:0.75rem 0.4rem} .cta-card-icon{font-size:1.5rem} .cta-card-icon img{width:28px;height:28px} .cta-card-text{font-size:0.8rem} } @media (max-width:768px){.cta-buttons{grid-template-columns:repeat(2, 1fr);gap:0.5rem} .cta-card{padding:0.85rem 0.5rem} .cta-card-icon{font-size:1.5rem} .cta-card-text{font-size:0.8rem} } @media (max-width:480px){.cta-buttons{grid-template-columns:1fr;gap:0.5rem} .cta-card{padding:0.75rem 1rem} .cta-card-icon{font-size:1.5rem} .cta-card-text{font-size:0.85rem} } .coming-soon{opacity:0.6;cursor:not-allowed} .coming-soon:hover{background-color:transparent !important;transform:none !important} .content{padding:5rem 2rem;max-width:1000px;margin:0 auto} .about-content-wrapper{display:flex;gap:2rem;align-items:flex-start;margin-top:2rem} .about-character{flex-shrink:0} .about-character picture{display:block;max-width:100px;line-height:0} .techy-character{width:100px;height:133px;max-width:100px;max-height:133px;object-fit:cover;border-radius:12px;display:block;margin:0 auto} .about-text{flex:1} @media (max-width:768px){.about-content-wrapper{flex-direction:column;align-items:center} .about-character picture{max-width:100px} .techy-character{max-width:100px;max-height:133px} .about-text{text-align:center} } .content h2, .content h3{color:var(--text-primary);margin-top:2rem;margin-bottom:1rem} .content h2{font-size:2rem} .content h3{font-size:1.5rem;color:var(--text-secondary)} .content p{color:var(--text-secondary);margin-bottom:1.5rem;line-height:1.8} .content ul{color:var(--text-secondary);padding-left:1.5rem;margin-bottom:1.5rem} .content ul li{margin-bottom:0.5rem} .content a{color:var(--fedora-accent);text-decoration:none;transition:all 0.2s ease-in-out;position:relative;display:inline-block} .content a:hover{color:var(--fedora-light);transform:translateY(-1px)} body.about, body.foldermaker, body.projects{background-color:var(--bg-primary);min-height:100vh} footer{background-color:var(--bg-elevated);color:var(--text-secondary);padding:2rem 0 1rem;border-top:1px solid var(--border-light)} .footer-content{max-width:1200px;margin:0 auto;padding:0 1rem} .footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem;margin-bottom:1.5rem} @media (max-width:1024px){footer{padding:1.5rem 0 0.75rem} .footer-grid{grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:1rem} .footer-section:first-child{grid-column:1 / -1} } @media (max-width:768px){footer{padding:1.25rem 0 0.5rem} .footer-content{padding:0 1rem} .footer-grid{grid-template-columns:1fr;gap:1rem;margin-bottom:0.75rem} .footer-section:first-child{grid-column:1;text-align:center} .footer-section{text-align:center} .footer-section p{max-width:100%;margin-left:auto;margin-right:auto} } .footer-section h3{color:var(--text-primary);font-size:1.15rem;margin-bottom:0.5rem} .footer-section h4{color:var(--text-primary);font-size:1rem;margin-bottom:0.5rem} .footer-section p{color:var(--text-secondary);margin-bottom:0.75rem;max-width:300px;font-size:0.9rem} .footer-section ul{list-style:none;padding:0;margin:0} .footer-section ul li{margin-bottom:0.35rem} .footer-section ul li a{color:var(--text-secondary);text-decoration:none;transition:all 0.2s ease;font-size:0.9rem} .footer-section ul li a:hover{color:var(--fedora-accent)} .footer-bottom{text-align:center;padding-top:1rem;border-top:1px solid var(--border-medium);color:var(--text-muted);font-size:0.8rem} @media (prefers-reduced-motion:reduce){.content h1::after, .section-title::after, .cta-content h2::after{animation:none;opacity:0.6} } *{margin:0;padding:0;box-sizing:border-box}:root{--max-width:1920px;--container-padding:clamp(1rem, 5vw, 3rem)} body{font-size:clamp(14px, 1vw, 18px);line-height:1.6;overflow-x:hidden} .container{width:100%;max-width:var(--max-width);margin:0 auto;padding:0 var(--container-padding)} nav{width:100%;padding:clamp(0.5rem, 2vh, 1.5rem) var(--container-padding);display:flex;justify-content:space-between;align-items:center;position:relative} nav ul{display:flex;list-style:none;gap:clamp(1rem, 3vw, 3rem);align-items:center} nav a{font-size:clamp(0.9rem, 1.2vw, 1.1rem);text-decoration:none;transition:all 0.3s ease} .hamburger{display:none;flex-direction:column;cursor:pointer;gap:4px} .hamburger span{width:25px;height:3px;background:currentColor;transition:all 0.3s ease} @media (max-width:768px){nav ul{position:fixed;top:0;right:0;height:100vh;width:70%;max-width:300px;flex-direction:column;background:#fff;padding:4rem 2rem;opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease;box-shadow:-2px 0 10px rgba(0,0,0,0.1);z-index:999} nav ul.active{opacity:1;visibility:visible} .hamburger{display:flex;z-index:1000} } @media (min-width:769px) and (max-width:1024px){nav ul{gap:clamp(1rem, 2vw, 2rem)} } @media (min-width:1025px) and (max-width:1440px){.container{padding:0 clamp(2rem, 4vw, 3rem);max-width:1400px} .header-container{max-width:1400px;padding:0 2rem} .content{max-width:1200px;padding:4rem 2rem} .hero-wrapper{max-width:1400px} .cards-grid{grid-template-columns:repeat(3, 1fr);gap:2rem} } @media (min-width:1441px) and (max-width:1920px){.container{padding:0 clamp(2rem, 5vw, 4rem);max-width:1600px} .header-container{max-width:1600px;padding:0 2.5rem} .content{max-width:1400px;padding:5rem 2.5rem} .hero-wrapper{max-width:1600px} .cards-grid{grid-template-columns:repeat(3, 1fr);gap:2.5rem} .hero-content h1{font-size:4.5rem} .hero-content p{font-size:1.35rem} } @media (min-width:1921px){body{font-size:18px;line-height:1.7} .container{max-width:2560px;padding:0 clamp(3rem, 8vw, 8rem)} .header-container{max-width:2400px;padding:0 4rem;height:80px} .logo-link img{height:72px} .main-nav ul{gap:1rem} .main-nav ul li a{font-size:1.1rem;padding:0.75rem 1.25rem} .content{max-width:2000px;padding:6rem 4rem} .content h1{font-size:3.5rem} .content h2{font-size:2.5rem} .content h3{font-size:2rem} .content p{font-size:1.15rem;line-height:1.9} .hero-wrapper{max-width:2400px} .hero-content h1{font-size:5rem} .hero-content p{font-size:1.5rem} .hero-actions .button{padding:1.25rem 2.5rem;font-size:1.15rem} .cards-grid{grid-template-columns:repeat(4, 1fr);gap:3rem} .page-title{font-size:3rem} .card-content{padding:2rem} .card-title{font-size:1.75rem} .card-description{font-size:1.1rem} .header-actions a{padding:0.6rem} .header-actions .github::before, .header-actions .gitlab::before, .header-actions .kofi::before{width:28px;height:28px} } @media (min-width:2560px){.container{max-width:2800px} .header-container{max-width:2600px} .content{max-width:2200px} .hero-wrapper{max-width:2600px} .cards-grid{grid-template-columns:repeat(4, 1fr);gap:3.5rem} } img{max-width:100%;height:auto;display:block} .grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(min(300px, 100%), 1fr));gap:clamp(1rem, 3vw, 2rem)} h1{font-size:clamp(1.8rem, 5vw, 3.5rem)} h2{font-size:clamp(1.5rem, 4vw, 2.5rem)} h3{font-size:clamp(1.2rem, 3vw, 2rem)} p{font-size:clamp(0.9rem, 1.5vw, 1.1rem)} .hamburger{display:none;flex-direction:column;cursor:pointer;gap:5px;padding:0.5rem;z-index:1001;background:transparent;border:none;color:var(--text-primary)} .hamburger span{width:25px;height:3px;background:currentColor;border-radius:2px;transition:all 0.3s ease} .hamburger.active span:nth-child(1){transform:rotate(45deg) translate(6px, 6px)} .hamburger.active span:nth-child(2){opacity:0} .hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(6px, -6px)} @media (max-width:768px){.header-container{padding:0 1rem;height:60px} .logo-link img{height:48px} .hamburger{display:flex} .main-nav{margin:0} .main-nav ul{position:fixed;top:0;right:-100%;height:100vh;width:280px;max-width:80vw;flex-direction:column;background:var(--bg-secondary);padding:5rem 2rem 2rem;gap:0.5rem;box-shadow:-4px 0 20px rgba(0, 0, 0, 0.5);transition:right 0.3s ease;z-index:1000;overflow-y:auto} .main-nav ul.active{right:0} .main-nav ul li{width:100%} .main-nav ul li a{width:100%;padding:1rem;justify-content:flex-start;font-size:1.1rem} .header-actions{gap:0.5rem;margin-left:auto} .header-actions a{padding:0.4rem} .header-actions .github::before, .header-actions .gitlab::before, .header-actions .kofi::before{width:20px;height:20px} .content{padding:3rem 1rem} .content h1{font-size:2rem;margin-bottom:1.5rem} .content h2{font-size:1.5rem} .content h3{font-size:1.25rem} .hero{padding:3rem 1rem;min-height:auto} .hero-content h1{font-size:2.5rem;margin-bottom:1rem} .hero-content p{font-size:1rem;margin-bottom:1.5rem} .hero-actions{flex-direction:column;gap:1rem;width:100%} .hero-actions .button{width:100%;justify-content:center} .hero-box{margin-bottom:2rem} .hero-techy-large{max-width:200px;height:auto} .hero-logo{max-width:180px;height:auto} .page-title{font-size:2rem;margin-bottom:2rem} .nux-hint .container{padding:0 1rem} .nux-code{font-size:0.85rem;padding:0.75rem} .cards-grid{grid-template-columns:1fr;gap:1.5rem;padding:0} .tutorial-card{margin-bottom:1rem} .card-content{padding:1rem} .card-title{font-size:1.25rem} .card-description{font-size:0.9rem} .project-card{margin-bottom:1.5rem} .button{padding:0.875rem 1.5rem;font-size:1rem;width:100%;max-width:100%} table{display:block;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch} input[type="text"], input[type="email"], input[type="password"], textarea, select{width:100%;padding:0.875rem;font-size:1rem} footer{padding:2rem 1rem} .footer-content{text-align:center} } @media (min-width:769px) and (max-width:1024px){.header-container{padding:0 1.5rem} .content{padding:4rem 1.5rem} .cards-grid{grid-template-columns:repeat(2, 1fr);gap:1.5rem} .hero-content h1{font-size:3rem} .hero-actions{flex-wrap:wrap} .hero-actions .button{flex:1;min-width:200px} } @media (max-width:480px){.header-container{padding:0 0.75rem;height:56px} .logo-link img{height:40px} .content{padding:2rem 0.75rem} .content h1{font-size:1.75rem} .hero{padding:2rem 0.75rem} .hero-content h1{font-size:2rem} .hero-content p{font-size:0.9rem} .page-title{font-size:1.75rem} .card-content{padding:0.875rem} .card-title{font-size:1.1rem} .main-nav ul{width:260px;padding:4rem 1.5rem 2rem} .main-nav ul li a{font-size:1rem;padding:0.875rem} } @media (max-width:768px) and (orientation:landscape){.hero{min-height:auto;padding:2rem 1rem} .hero-content h1{font-size:2rem} .main-nav ul{height:100vh;overflow-y:auto} } @media (hover:none) and (pointer:coarse){.button, .main-nav ul li a, .header-actions a{min-height:44px;min-width:44px} .button:hover, .main-nav ul li a:hover, .header-actions a:hover{transform:none} }
body.fade-in,body.fade-out{opacity:1 !important;transition:none !important;animation:none !important;background-color:var(--bg-primary) !important}