/* Devanturas: Comprehensive Styles for Flask Templates */

/* Reset and Base */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  line-height: 1.6;
  color: #ddd;
  background: #0a0a0a;
  overflow-x: hidden;
}
a { color: #00d4ff; text-decoration: none; }
a:hover { color: #66e6ff; }
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* Navbar */
.navbar { position: fixed; top: 0; width: 100%; background: rgba(10,10,10,0.95); backdrop-filter: blur(10px); z-index: 1000; padding: 1rem 0; transition: all 0.3s ease; border-bottom: 1px solid #1f1f1f; }
.nav-container { max-width: 1200px; margin: 0 auto; padding: 0 20px; display: flex; justify-content: space-between; align-items: center; }
.nav-logo a { display: inline-block; }
.nav-logo h2 { color: #fff; font-size: 1.5rem; font-weight: 700; line-height: 1; }
.nav-logo span { color: #00d4ff; font-size: 0.9rem; font-weight: 300; }
.nav-links { display: flex; list-style: none; gap: 2rem; }
.nav-links a { color: #fff; font-weight: 500; position: relative; transition: color 0.3s ease; }
.nav-links a::before { content: ''; position: absolute; bottom: -6px; left: 0; width: 0; height: 2px; background: linear-gradient(90deg,#00d4ff,#0099cc); transition: width 0.3s ease; }
.nav-links a:hover { color: #00d4ff; }
.nav-links a:hover::before, .nav-links a.active::before { width: 100%; }
.nav-links a.active { color: #00d4ff; }
.hamburger { display: none; flex-direction: column; cursor: pointer; }
.hamburger span { width: 25px; height: 3px; background: #fff; margin: 3px 0; transition: 0.3s; }

/* Hero */
.hero { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg,#0a0a0a 0%, #1a1a2e 50%, #16213e 100%); position: relative; overflow: hidden; padding-top: 60px; }
.hero-content { text-align: center; z-index: 2; max-width: 900px; padding: 0 20px; }
.hero h1 { font-size: 4rem; font-weight: 800; margin-bottom: .5rem; background: linear-gradient(135deg,#fff,#00d4ff); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: fadeInUp 1s ease; }
.hero h2 { font-size: 2rem; color: #bbb; margin-bottom: 1rem; animation: fadeInUp 1s ease .2s both; }
.hero p { font-size: 1.2rem; color: #aaa; margin-bottom: 2rem; animation: fadeInUp 1s ease .4s both; }
.highlight { color: #00d4ff; font-weight: 700; }
.hero-buttons { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; animation: fadeInUp 1s ease .6s both; }
.btn { padding: 12px 24px; border: none; border-radius: 50px; font-size: 1rem; font-weight: 600; display: inline-flex; align-items: center; gap: .5rem; cursor: pointer; transition: all .3s ease; }
.btn-primary { background: linear-gradient(135deg,#00d4ff,#0099cc); color:#fff; box-shadow: 0 4px 15px rgba(0,212,255,.3); }
.btn-primary:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,212,255,.4); }
.btn-secondary { background: transparent; color:#fff; border: 2px solid #333; }
.btn-secondary:hover { background:#333; transform: translateY(-2px); }

.hero-background { position:absolute; inset:0; z-index:1; }
.floating-icons { position:absolute; width:100%; height:100%; }
.floating-icons i { position:absolute; color: rgba(0,212,255,0.08); font-size: 3rem; animation: float 6s ease-in-out infinite; }
.floating-icons i:nth-child(1){ top:20%; left:10%; animation-delay:0s; }
.floating-icons i:nth-child(2){ top:60%; left:80%; animation-delay:1s; }
.floating-icons i:nth-child(3){ top:30%; right:20%; animation-delay:2s; }
.floating-icons i:nth-child(4){ bottom:30%; left:20%; animation-delay:3s; }
.floating-icons i:nth-child(5){ bottom:20%; right:10%; animation-delay:4s; }

/* Shared Sections */
section { scroll-margin-top: 80px; }
.section-subtitle { text-align:center; color:#aaa; font-size:1.05rem; margin: .5rem 0 2rem; }

/* Featured Projects on Home */
.featured-projects { padding: 80px 0; background:#111; }
.featured-projects h2 { text-align:center; color:#fff; font-size:2.5rem; margin-bottom:.5rem; }
.projects-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 2rem; margin-bottom: 2.5rem; }
.project-card { background: linear-gradient(145deg,#161616,#1e1e1e); border:1px solid #2a2a2a; border-radius: 16px; padding: 1.5rem; transition: all .3s ease; position: relative; overflow: hidden; }
.project-card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background: linear-gradient(90deg,#00d4ff,#0099cc); opacity: 0; transition: .3s; }
.project-card:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0,212,255,.08); }
.project-card:hover::before { opacity: 1; }
.project-header { display:flex; align-items:center; gap:1rem; margin-bottom: .75rem; }
.project-icon { width:52px; height:52px; border-radius: 12px; display:flex; align-items:center; justify-content:center; color:#fff; font-size: 1.6rem; }
.minecraft .project-icon { background: linear-gradient(135deg,#8b4513,#5a341b); }
.discord .project-icon { background: linear-gradient(135deg,#7289da,#5865f2); }
.coming-soon .project-icon { background: linear-gradient(135deg,#666,#444); }
.project-meta h3 { color:#fff; font-size:1.25rem; font-weight:700; margin-bottom:.2rem; }
.project-type { color:#00d4ff; font-size:.9rem; font-weight:500; }
.project-card p { color:#cfcfcf; margin: .5rem 0 1.25rem; }
.project-features { display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom: 1.25rem; }
.feature-tag, .tech-tag { background: rgba(0,212,255,.1); color:#00d4ff; padding:.32rem .8rem; border-radius: 999px; font-size: .82rem; border:1px solid rgba(0,212,255,.2); }
.project-links { display:flex; gap: 1rem; }
.project-link { color:#00d4ff; font-weight:600; }
.project-link:hover { color:#fff; }
.view-all-projects { display:flex; justify-content:center; }

/* Skills Overview on Home */
.skills-overview { padding: 80px 0; background:#0a0a0a; }
.skills-overview h2 { text-align:center; color:#fff; font-size:2.2rem; margin-bottom: 1.5rem; }
.skills-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.5rem; }
.skill-card { background:#121212; border:1px solid #232323; border-radius: 14px; padding: 1.25rem; transition:.3s; }
.skill-card:hover { transform: translateY(-4px); border-color:#2f2f2f; box-shadow: 0 10px 24px rgba(0,0,0,.25); }
.skill-icon { width:48px; height:48px; border-radius: 10px; background: rgba(0,212,255,.1); color:#00d4ff; display:flex; align-items:center; justify-content:center; font-size:1.4rem; margin-bottom:.75rem; }
.skill-card h3 { color:#fff; margin-bottom:.5rem; }
.skill-card p { color:#bdbdbd; margin-bottom:.75rem; }
.skill-card ul { padding-left: 1.1rem; }
.skill-card li { color:#bdbdbd; margin:.25rem 0; }

/* Stats & CTA on Home */
.stats { padding: 60px 0; background:#111; }
.stats-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap:1rem; }
.stat-item { background:#141414; border:1px solid #222; border-radius:12px; padding: 1.25rem; text-align:center; }
.stat-number { font-size:1.4rem; color:#00d4ff; font-weight:800; }
.stat-label { color:#a7a7a7; font-size:.9rem; }
.cta { padding: 80px 0; background: linear-gradient(135deg,#0c0c0c,#121a24); }
.cta-content { text-align:center; }
.cta h2 { color:#fff; font-size:2rem; margin-bottom:.5rem; }
.cta p { color:#bdbdbd; margin-bottom:1.25rem; }
.cta-buttons { display:flex; gap: 1rem; justify-content:center; flex-wrap: wrap; }

/* Projects page */
.page-header { padding: 100px 0 40px; background:#0f0f0f; border-bottom:1px solid #1f1f1f; margin-top: 60px; }
.page-header h1 { color:#fff; font-size:2.2rem; }
.page-header p { color:#a8a8a8; }
.projects-section { padding: 60px 0; background:#0a0a0a; }
.projects-filter { display:flex; gap:.75rem; flex-wrap:wrap; margin-bottom:1.25rem; }
.filter-btn { background:#141414; color:#dcdcdc; border:1px solid #242424; padding:.5rem 1rem; border-radius:999px; cursor:pointer; transition:.2s; }
.filter-btn:hover { border-color:#2e2e2e; }
.filter-btn.active { background: rgba(0,212,255,.1); color:#00d4ff; border-color: rgba(0,212,255,.3); }
.project-description { color:#cfcfcf; }
.project-technologies { display:flex; flex-wrap:wrap; gap:.5rem; margin: .75rem 0; }
.project-stats { display:flex; gap:1.25rem; margin: .5rem 0 .75rem; }
.stat .stat-label { color:#9a9a9a; font-size:.78rem; }
.stat .stat-value { color:#eaeaea; font-weight:700; }
.project-actions { display:flex; gap:.6rem; flex-wrap:wrap; margin-top:.5rem; }
.btn-small { padding: .4rem .7rem; border-radius: 10px; font-size:.88rem; }

/* Project Detail */
.project-hero { padding: 110px 0 40px; background:#0f0f0f; border-bottom:1px solid #1f1f1f; }
.project-hero-content { display:grid; grid-template-columns: 1.4fr .6fr; gap: 2rem; align-items:center; }
.project-breadcrumb { color:#9aa; margin-bottom:.5rem; font-size:.92rem; }
.project-hero-text h1 { color:#fff; font-size:2.2rem; }
.project-tagline { color:#aeb; margin:.25rem 0 .5rem; }
.project-description { color:#cfcfcf; }
.project-hero-stats { display:flex; gap:1rem; margin: 1rem 0; }
.hero-stat { background:#141414; border:1px solid #242424; border-radius:10px; padding:.6rem .8rem; }
.hero-stat .stat-label { color:#9a9a9a; font-size:.8rem; }
.hero-stat .stat-value { color:#fff; font-weight:700; }
.project-hero-actions { display:flex; gap:.6rem; flex-wrap:wrap; }
.project-hero-visual { display:flex; justify-content:center; }
.project-icon-large { width:120px; height:120px; border-radius:24px; background: linear-gradient(135deg,#1d2a31,#0d1a21); color:#00d4ff; display:flex; align-items:center; justify-content:center; font-size:3rem; border:1px solid #1e2a33; }

.project-nav { position: sticky; top:60px; background:#0f0f0f; border-bottom:1px solid #1f1f1f; z-index: 900; }
.project-nav-links { display:flex; gap:1rem; padding:.75rem 0; list-style:none; }
.project-nav-links a { color:#cfd; padding:.4rem .8rem; border-radius: 10px; }
.project-nav-links a.active, .project-nav-links a:hover { background: rgba(0,212,255,.1); color:#00d4ff; }

.project-section { padding: 50px 0; background:#0a0a0a; }
.project-content { display:grid; grid-template-columns: 1.5fr .5fr; gap: 2rem; }
.content-main h2 { color:#fff; margin-bottom: .75rem; }
.project-overview p { color:#cfcfcf; }
.project-tech-stack { margin-top: 1rem; }
.project-tech-stack h3 { color:#fff; margin-bottom:.5rem; }
.tech-tags { display:flex; gap:.5rem; flex-wrap:wrap; }
.compatibility-info h3 { color:#fff; margin: 1rem 0 .5rem; }
.compatibility-grid { display:flex; gap:.6rem; flex-wrap:wrap; }
.compatibility-item { display:flex; align-items:center; gap:.4rem; background:#141414; border:1px solid #242424; color:#cfe; padding:.4rem .7rem; border-radius: 10px; }

.content-sidebar { display:flex; flex-direction:column; gap:1rem; }
.sidebar-card { background:#121212; border:1px solid #232323; border-radius: 12px; padding: 1rem; }
.sidebar-card h3 { color:#fff; margin-bottom:.5rem; }
.quick-links { display:flex; flex-direction:column; gap:.5rem; }
.quick-link { color:#cfe; display:flex; align-items:center; gap:.5rem; padding:.45rem .6rem; border-radius: 8px; transition:.2s; }
.quick-link:hover { background:#151515; color:#00d4ff; }
.highlight-list { padding-left: 1.1rem; color:#cfcfcf; }
.highlight-list li { margin:.3rem 0; }

/* Features */
.features-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 1rem; }
.feature-item { background:#121212; border:1px solid #222; border-radius: 12px; padding: .9rem 1rem; display:flex; gap:.6rem; }
.feature-icon { color:#00d4ff; }
.feature-text p { color:#d8d8d8; }

/* Commands Table */
.commands-table table { width:100%; border-collapse: collapse; background:#111; border:1px solid #222; border-radius: 12px; overflow:hidden; }
.commands-table th, .commands-table td { text-align:left; padding: .75rem 1rem; border-bottom:1px solid #1e1e1e; }
.commands-table thead th { background:#151515; color:#eaeaea; font-weight:700; }
.commands-table tbody tr:hover { background:#131313; }
.commands-table code { background:#1a1f24; color:#aef; padding:.1rem .35rem; border-radius: 6px; }

/* Installation */
.installation-steps ol { padding-left: 1.4rem; color:#cfcfcf; }
.installation-steps li { margin:.4rem 0; }

/* Resources */
.resources-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.resource-card { background:#121212; border:1px solid #232323; border-radius:12px; padding:1rem; transition:.3s; }
.resource-card:hover { transform: translateY(-4px); border-color:#2b2b2b; }
.resource-icon { color:#00d4ff; font-size:1.6rem; margin-bottom:.4rem; }
.resource-card h3 { color:#fff; margin-bottom:.25rem; }
.resource-card p { color:#bdbdbd; margin-bottom:.5rem; }
.resource-link { color:#9feaff; font-weight:600; }

/* Related */
.related-projects { padding: 50px 0 70px; background:#0a0a0a; text-align:center; }
.related-projects h2 { color:#fff; margin-bottom:.5rem; }
.related-actions { display:flex; justify-content:center; gap: .8rem; margin-top: .5rem; }

/* Minecraft Page */
.minecraft-hero { padding: 110px 0 40px; background:#0f0f0f; border-bottom:1px solid #1f1f1f; text-align:center; }
.minecraft-hero h1 { color:#fff; font-size:2.2rem; margin-top:.5rem; }
.minecraft-hero p { color:#bdbdbd; }
.minecraft-icon { width:80px; height:80px; border-radius:20px; background: linear-gradient(135deg,#1d2a31,#0d1a21); color:#00d4ff; display:flex; align-items:center; justify-content:center; font-size:2rem; margin: 0 auto; border:1px solid #1e2a33; }
.minecraft-stats { display:flex; gap:1rem; justify-content:center; margin-top:1rem; }
.minecraft-stats .stat { background:#141414; border:1px solid #242424; border-radius:10px; padding:.6rem .8rem; text-align:center; }
.minecraft-stats .stat-number { color:#00d4ff; font-weight:800; }
.minecraft-stats .stat-label { color:#9a9a9a; font-size:.85rem; }

.minecraft-projects { padding: 60px 0; }
.minecraft-projects h2 { color:#fff; text-align:center; margin-bottom:1rem; }
.minecraft-project-card { background:#121212; border:1px solid #232323; border-radius:14px; padding:1rem 1.2rem; }
.minecraft-project-card .project-header { align-items:flex-start; }
.minecraft-project-card .project-info h3 { color:#fff; }
.minecraft-project-card .project-info p { color:#cfcfcf; }
.detail-row { display:flex; gap:.5rem; margin:.25rem 0; }
.detail-label { color:#9a9a9a; width:120px; }
.detail-value { color:#eaeaea; }
.status-active { color:#00ffa6; }

.minecraft-services { padding: 60px 0; }
.services-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.service-card { background:#121212; border:1px solid #232323; border-radius:14px; padding:1rem; }
.service-icon { width:44px; height:44px; border-radius:10px; background: rgba(0,212,255,.1); color:#00d4ff; display:flex; align-items:center; justify-content:center; margin-bottom:.6rem; }
.service-card h3 { color:#fff; margin-bottom:.25rem; }
.service-card p { color:#bdbdbd; margin-bottom:.4rem; }
.service-card ul { padding-left: 1.1rem; color:#cfcfcf; }

.minecraft-expertise { padding: 60px 0; }
.expertise-content { display:grid; grid-template-columns: 1.4fr .6fr; gap: 1.5rem; }
.specialties-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap:.6rem; }
.specialty-item { background:#141414; border:1px solid #242424; border-radius:10px; padding:.6rem .8rem; display:flex; gap:.5rem; align-items:center; color:#dfe; }
.platforms-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(180px,1fr)); gap:.8rem; margin-top:.6rem; }
.platform-card { background:#121212; border:1px solid #232323; border-radius:10px; padding: .8rem; text-align:center; }
.platform-icon { color:#00d4ff; font-size:1.4rem; margin-bottom:.3rem; }
.api-knowledge ul { list-style:none; padding-left:0; }
.api-knowledge li { display:flex; gap:.5rem; align-items:center; color:#cfcfcf; margin:.3rem 0; }
.version-range { display:flex; flex-direction:column; gap:.4rem; }
.version-item { display:flex; justify-content:space-between; background:#141414; border:1px solid #242424; border-radius:10px; padding:.5rem .7rem; }
.version-label { color:#9a9a9a; }
.version-value { color:#eaeaea; }

.development-process { padding: 60px 0; }
.process-steps { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 1rem; }
.process-step { background:#121212; border:1px solid #232323; border-radius:12px; padding: 1rem; display:flex; gap:.8rem; }
.step-number { width:34px; height:34px; border-radius:50%; background:#00d4ff; color:#002733; font-weight:800; display:flex; align-items:center; justify-content:center; }
.step-content h3 { color:#fff; margin-bottom:.25rem; }
.step-content p { color:#bdbdbd; }

.minecraft-resources { padding: 60px 0; }
.minecraft-cta { padding: 60px 0; background: linear-gradient(135deg,#0c0c0c,#121a24); }
.minecraft-cta .cta-content { display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.minecraft-cta h2 { color:#fff; }
.minecraft-cta p { color:#bdbdbd; }

/* About Page */
.about-hero { padding: 110px 0 40px; background:#0f0f0f; border-bottom:1px solid #1f1f1f; }
.about-hero-content { display:grid; grid-template-columns: 1.2fr .8fr; gap: 1.5rem; align-items:center; }
.about-text h1 { color:#fff; font-size:2.2rem; }
.about-subtitle { color:#a9b; margin:.25rem 0 .75rem; }
.code-showcase { background:#1a1a1a; border:1px solid #252525; border-radius: 12px; overflow:hidden; }
.code-header { background:#2d2d2d; padding:.6rem .8rem; display:flex; justify-content:space-between; align-items:center; }
.code-title { color:#fff; font-size:.9rem; }
.code-buttons { display:flex; gap:.4rem; }
.code-buttons span { width:12px; height:12px; border-radius:50%; background:#555; }
.code-buttons span:nth-child(1){ background:#ff5f56; }
.code-buttons span:nth-child(2){ background:#ffbd2e; }
.code-buttons span:nth-child(3){ background:#27ca3f; }
.code-content { padding: .8rem; }
.code-content pre { color:#ccc; font-family: 'Courier New', monospace; font-size:.85rem; line-height:1.45; overflow:auto; }

.skills-section { padding: 60px 0; }
.skills-section h2 { color:#fff; text-align:center; margin-bottom: 1rem; }
.skills-section .skills-grid { display:grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 1rem; }
.skill-category { background:#121212; border:1px solid #232323; border-radius:12px; padding:1rem; }
.skill-category h3 { color:#fff; margin-bottom:.5rem; }
.skills-list { display:flex; flex-direction:column; gap:.35rem; }
.skill-item { display:flex; gap:.5rem; color:#cfcfcf; }
.skill-item i { color:#00d4ff; }

.experience-section { padding: 60px 0; }
.timeline { display:flex; flex-direction:column; gap:1rem; }
.timeline-item { display:flex; gap:.8rem; }
.timeline-marker { width:12px; height:12px; border-radius:50%; background:#00d4ff; margin-top:.4rem; }
.timeline-content { background:#121212; border:1px solid #232323; border-radius:12px; padding:.8rem 1rem; flex:1; }
.timeline-content h3 { color:#fff; margin-bottom:.25rem; }
.timeline-content p { color:#bdbdbd; }
.timeline-date { color:#9a9a9a; font-size:.85rem; }

.achievements-section { padding: 60px 0; }
.achievements-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap: 1rem; }
.achievement-card { background:#121212; border:1px solid #232323; border-radius:12px; padding: 1rem; text-align:center; }
.achievement-icon { color:#00d4ff; font-size:1.6rem; margin-bottom:.4rem; }
.achievement-card h3 { color:#fff; }
.achievement-card p { color:#bdbdbd; }

.philosophy-section { padding: 60px 0; }
.philosophy-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap:1rem; }
.philosophy-item { background:#121212; border:1px solid #232323; border-radius:12px; padding:1rem; text-align:center; }
.philosophy-icon { color:#00d4ff; font-size:1.6rem; margin-bottom:.4rem; }

.interests-section { padding: 60px 0; }
.interests-list { display:grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap:.8rem; margin-top:.6rem; }
.interest-item { background:#121212; border:1px solid #232323; border-radius:12px; padding:.8rem; display:flex; gap:.6rem; align-items:center; }

.about-cta { padding: 60px 0; text-align:center; background: linear-gradient(135deg,#0c0c0c,#121a24); }
.about-cta h2 { color:#fff; }
.about-cta p { color:#bdbdbd; margin-bottom:1rem; }

/* Contact Page */
.contact-hero { padding: 110px 0 40px; background:#0f0f0f; border-bottom:1px solid #1f1f1f; text-align:center; }
.contact-hero h1 { color:#fff; font-size:2.2rem; }
.contact-hero p { color:#bdbdbd; }

.contact-methods { padding: 60px 0; }
.contact-methods h2 { color:#fff; text-align:center; margin-bottom:1rem; }
.contact-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; }
.contact-card { background: linear-gradient(145deg,#161616,#1e1e1e); border:1px solid #2a2a2a; border-radius: 16px; padding: 1.25rem; position: relative; overflow:hidden; transition:.3s; text-align:center; color:#dcdcdc; }
.contact-card:hover { transform: translateY(-6px); box-shadow: 0 12px 30px rgba(0,212,255,.08); }
.contact-icon { color:#00d4ff; font-size:2rem; margin-bottom:.5rem; }
.contact-card h3 { color:#fff; margin-bottom:.25rem; }
.contact-card p { color:#cfcfcf; }
.contact-action { margin-top:.5rem; font-weight:600; }

.project-inquiry { padding: 60px 0; }
.inquiry-content { display:grid; grid-template-columns: 1.2fr .8fr; gap: 1.5rem; }
.inquiry-text h2 { color:#fff; margin-bottom:.25rem; }
.inquiry-text p { color:#bdbdbd; }
.inquiry-types h3 { color:#fff; margin: .75rem 0 .5rem; }
.inquiry-list { display:flex; flex-direction:column; gap:.6rem; }
.inquiry-item { display:flex; gap:.6rem; background:#121212; border:1px solid #232323; border-radius:12px; padding:.7rem; align-items:center; }
.response-time, .availability { background:#121212; border:1px solid #232323; border-radius:12px; padding:1rem; }
.response-time h3, .availability h3 { color:#fff; margin-bottom:.5rem; }
.response-item { display:flex; gap:.6rem; align-items:center; color:#cfcfcf; }
.availability-item { display:flex; gap:.5rem; align-items:center; color:#cfcfcf; }
.status.available { width:10px; height:10px; border-radius:50%; background:#00ffa6; display:inline-block; }

.faq-section { padding: 60px 0; }
.faq-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(260px,1fr)); gap: 1rem; }
.faq-item { background:#121212; border:1px solid #232323; border-radius:12px; padding: 1rem; }
.faq-item h3 { color:#fff; margin-bottom:.25rem; }
.faq-item p { color:#bdbdbd; }

.community-section { padding: 60px 0; }
.community-content { display:grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items:center; }
.community-link { background:#121212; border:1px solid #232323; border-radius:12px; padding:.8rem; display:flex; gap:.6rem; align-items:center; color:#cfcfcf; }
.community-link i { color:#00d4ff; font-size:1.4rem; }
.final-cta { padding: 60px 0; text-align:center; background: linear-gradient(135deg,#0c0c0c,#121a24); }
.btn-large { padding: 14px 28px; font-size:1.05rem; }

/* Footer */
.footer { background:#0a0a0a; padding: 2rem 0; border-top:1px solid #1f1f1f; }
.footer-content { display:flex; justify-content:space-between; align-items:center; margin-bottom: 1rem; gap: 1rem; }
.footer-text h3 { color:#fff; margin-bottom:.25rem; }
.footer-text p { color:#aaa; font-size:.92rem; }
.footer-links { display:flex; gap: .8rem; }
.footer-links a { color:#aaa; font-size:1.4rem; }
.footer-links a:hover { color:#00d4ff; }
.footer-bottom { text-align:center; border-top:1px solid #1f1f1f; padding-top: .8rem; }
.footer-bottom p { color:#666; font-size:.9rem; }

/* Animations */
@keyframes fadeInUp { from { opacity:0; transform: translateY(26px);} to { opacity:1; transform: translateY(0);} }
@keyframes float { 0%,100% { transform: translateY(0);} 50% { transform: translateY(-18px);} }

/* Responsive */
@media (max-width: 992px) {
  .project-hero-content, .expertise-content, .inquiry-content, .community-content { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .hamburger { display:flex; }
  .nav-links { position: fixed; top: 64px; right: -110%; width: 100%; height: calc(100vh - 64px); background: rgba(10,10,10,0.98); flex-direction: column; justify-content: flex-start; align-items: center; padding-top: 2rem; transition: right .3s ease; gap: 1.2rem; }
  .nav-links.active { right: 0; }
  .hamburger.active span:nth-child(1) { transform: rotate(-45deg) translate(-5px, 6px); }
  .hamburger.active span:nth-child(2) { opacity: 0; }
  .hamburger.active span:nth-child(3) { transform: rotate(45deg) translate(-5px, -6px); }
  .hero h1 { font-size: 2.6rem; }
  .hero h2 { font-size: 1.5rem; }
  .stats-grid, .skills-grid, .projects-grid { grid-template-columns: 1fr; }
  .project-content { grid-template-columns: 1fr; }
  .minecraft-cta .cta-content { flex-direction: column; align-items:center; text-align:center; }
}
@media (max-width: 480px) {
  .container { padding: 0 14px; }
  .btn, .btn-small { font-size:.95rem; }
}
/* This file mirrors the root styles.css for Flask static serving */
/* Reset and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #0a0a0a;
    overflow-x: hidden;
}

html {
    scroll-behavior: smooth;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Navigation */
.navbar {
    position: fixed;
    top: 0;
    width: 100%;
    background: rgba(10, 10, 10, 0.95);
    backdrop-filter: blur(10px);
    z-index: 1000;
    padding: 1rem 0;
    transition: all 0.3s ease;
}

.nav-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.nav-logo h2 {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 700;
}

.nav-logo span {
    color: #00d4ff;
    font-size: 0.9rem;
    font-weight: 300;
}

.nav-links {
    display: flex;
    list-style: none;
    gap: 2rem;
}

.nav-links a {
    color: #fff;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s ease;
    position: relative;
}

.nav-links a::before {
    content: '';
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 0;
    height: 2px;
    background: linear-gradient(90deg, #00d4ff, #0099cc);
    transition: width 0.3s ease;
}

.nav-links a:hover::before {
    width: 100%;
}

.nav-links a:hover {
    color: #00d4ff;
}

.hamburger {
    display: none;
    flex-direction: column;
    cursor: pointer;
}

.hamburger span {
    width: 25px;
    height: 3px;
    background: #fff;
    margin: 3px 0;
    transition: 0.3s;
}

/* Hero Section */
.hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 50%, #16213e 100%);
    position: relative;
    overflow: hidden;
}

.hero-content {
    text-align: center;
    z-index: 2;
    max-width: 800px;
    padding: 0 20px;
}

.hero h1 {
    font-size: 4rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.5rem;
    background: linear-gradient(135deg, #fff, #00d4ff);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: fadeInUp 1s ease;
}

.hero h2 {
    font-size: 2rem;
    color: #ccc;
    margin-bottom: 1rem;
    animation: fadeInUp 1s ease 0.2s both;
}

.highlight {
    color: #00d4ff;
    font-weight: 700;
}

.hero p {
    font-size: 1.2rem;
    color: #aaa;
    margin-bottom: 2rem;
    animation: fadeInUp 1s ease 0.4s both;
}

.hero-buttons {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
    animation: fadeInUp 1s ease 0.6s both;
}

.btn {
    padding: 12px 24px;
    border: none;
    border-radius: 50px;
    font-size: 1rem;
    font-weight: 600;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.3s ease;
    cursor: pointer;
}

.btn-primary {
    background: linear-gradient(135deg, #00d4ff, #0099cc);
    color: #fff;
    box-shadow: 0 4px 15px rgba(0, 212, 255, 0.3);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 212, 255, 0.4);
}

.btn-secondary {
    background: transparent;
    color: #fff;
    border: 2px solid #333;
}

.btn-secondary:hover {
    background: #333;
    transform: translateY(-2px);
}

.hero-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.floating-icons {
    position: absolute;
    width: 100%;
    height: 100%;
}

.floating-icons i {
    position: absolute;
    color: rgba(0, 212, 255, 0.1);
    font-size: 3rem;
    animation: float 6s ease-in-out infinite;
}

.floating-icons i:nth-child(1) { top: 20%; left: 10%; animation-delay: 0s; }
.floating-icons i:nth-child(2) { top: 60%; left: 80%; animation-delay: 1s; }
.floating-icons i:nth-child(3) { top: 30%; right: 20%; animation-delay: 2s; }
.floating-icons i:nth-child(4) { bottom: 30%; left: 20%; animation-delay: 3s; }
.floating-icons i:nth-child(5) { bottom: 20%; right: 10%; animation-delay: 4s; }

/* Sections used across templates */
.featured-projects, .skills-overview, .stats, .cta, .page-header, .projects-section,
.tech-stack-section, .projects-cta, .project-hero, .project-section, .related-projects,
.minecraft-hero, .minecraft-projects, .minecraft-services, .minecraft-expertise, .development-process,
.minecraft-resources, .minecraft-cta, .about-hero, .skills-section, .experience-section,
.achievements-section, .philosophy-section, .interests-section, .about-cta, .contact-hero,
.contact-methods, .project-inquiry, .faq-section, .community-section, .final-cta {
    padding: 80px 0;
}

/* Reuse card/grid styles from original file where applicable ... */
/* (Keeping it concise here; the original file contains full styling and will be sufficient) */

/* Footer, animations, responsiveness remain same as original root CSS */
@keyframes fadeInUp { from { opacity: 0; transform: translateY(30px);} to { opacity: 1; transform: translateY(0);} }
@keyframes float { 0%,100% { transform: translateY(0);} 50% { transform: translateY(-20px);} }

@media (max-width: 768px) {
    .hamburger { display: flex; }
    .nav-links { display: none; }
}