/* ============================================================
   FORGE — SHARED STYLES v2
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&family=Orbitron:wght@400;600;700;900&family=Share+Tech+Mono&display=swap');

:root {
  --black:#050608;--dark:#0a0d12;--panel:#0f1319;--border:#1e2530;
  --muted:#2a3445;--text-dim:#5a7090;--text:#b8ccd8;--text-hi:#e8f4ff;
  --accent:#00e5ff;--accent2:#ff3c5a;--accent3:#ffd600;--green:#00ff88;--purple:#9945ff;
  --font-hd:'Orbitron',monospace;--font-body:'Rajdhani',sans-serif;--font-mono:'Share Tech Mono',monospace;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--black);color:var(--text);font-family:var(--font-body);font-size:16px;line-height:1.6;overflow-x:hidden;}
body::before{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");pointer-events:none;z-index:9999;opacity:0.4;}

/* NAV */
nav{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(5,6,8,0.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--border);padding:0 4%;display:flex;align-items:center;justify-content:space-between;height:68px;}
.nav-logo{text-decoration:none;display:flex;align-items:center;gap:10px;}
.forge-wordmark{font-family:var(--font-hd);font-size:1.5rem;font-weight:900;color:var(--text-hi);letter-spacing:0.05em;display:flex;align-items:center;gap:0;}
.forge-wordmark .fw-f{color:var(--text-hi);}
.forge-wordmark .fw-icon{display:inline-flex;align-items:center;margin:0 1px;}
.forge-wordmark .fw-rge{color:var(--text-hi);}
.logo-sub{font-family:var(--font-mono);font-size:0.48rem;color:var(--text-dim);letter-spacing:0.15em;border-left:1px solid var(--border);padding-left:9px;margin-left:7px;line-height:1.4;}
.nav-links{display:flex;list-style:none;gap:0.15rem;align-items:center;}
.nav-links a{color:var(--text-dim);text-decoration:none;font-family:var(--font-body);font-weight:600;font-size:0.8rem;letter-spacing:0.1em;text-transform:uppercase;padding:6px 11px;border-radius:2px;transition:color 0.2s,background 0.2s;}
.nav-links a:hover,.nav-links a.active{color:var(--accent);background:rgba(0,229,255,0.06);}
.nav-dropdown{position:relative;}
.nav-dropdown>a::after{content:' ▾';font-size:0.6rem;opacity:0.6;}
.dropdown-menu{display:none;position:absolute;top:calc(100% + 6px);left:0;background:rgba(8,10,15,0.98);border:1px solid var(--border);border-radius:4px;min-width:210px;padding:0.4rem 0;backdrop-filter:blur(16px);z-index:200;}
.nav-dropdown:hover .dropdown-menu{display:block;}
.dropdown-menu a{display:block;padding:8px 16px;font-size:0.78rem;border-radius:0;border-bottom:1px solid rgba(30,37,48,0.5);}
.dropdown-menu a:last-child{border-bottom:none;}
.nav-cta{background:var(--accent)!important;color:var(--black)!important;padding:7px 18px!important;font-weight:700!important;}
.nav-cta:hover{background:#00c8e0!important;}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;}
.hamburger span{display:block;width:24px;height:2px;background:var(--text);transition:all 0.3s;}

/* LAYOUT */
section{padding:100px 4%;position:relative;}
.container{max-width:1240px;margin:0 auto;}
h1,h2,h3,h4{font-family:var(--font-hd);font-weight:700;color:var(--text-hi);line-height:1.2;}
.label{font-family:var(--font-mono);font-size:0.7rem;color:var(--accent);letter-spacing:0.25em;text-transform:uppercase;margin-bottom:10px;display:block;}
.label-red{color:var(--accent2);}.label-yellow{color:var(--accent3);}.label-purple{color:var(--purple);}
.section-title{font-size:clamp(1.8rem,4vw,3rem);margin-bottom:1rem;}
.section-sub{color:var(--text-dim);font-size:1rem;max-width:600px;margin-bottom:3rem;}

/* CARDS */
.card{background:var(--panel);border:1px solid var(--border);border-radius:4px;padding:2rem;position:relative;transition:border-color 0.3s,transform 0.3s;}
.card:hover{border-color:var(--accent);transform:translateY(-3px);}
.card::before{content:'';position:absolute;top:0;left:0;width:3px;height:40%;background:var(--accent);border-radius:0 0 2px 2px;}
.card-red::before{background:var(--accent2);}.card-red:hover{border-color:var(--accent2);}
.card-yellow::before{background:var(--accent3);}.card-yellow:hover{border-color:var(--accent3);}
.card-purple::before{background:var(--purple);}.card-purple:hover{border-color:var(--purple);}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 28px;font-family:var(--font-hd);font-size:0.75rem;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;text-decoration:none;border:none;border-radius:2px;cursor:pointer;transition:all 0.2s;}
.btn-primary{background:var(--accent);color:var(--black);}
.btn-primary:hover{background:#00c8e0;transform:translateY(-2px);}
.btn-outline{background:transparent;color:var(--accent);border:1px solid var(--accent);}
.btn-outline:hover{background:rgba(0,229,255,0.08);}
.btn-red{background:var(--accent2);color:white;}.btn-red:hover{background:#e02040;}
.btn-yellow{background:var(--accent3);color:var(--black);}.btn-yellow:hover{background:#e6c200;}
.btn-ghost{background:transparent;color:var(--text);border:1px solid var(--border);}.btn-ghost:hover{border-color:var(--text);color:var(--text-hi);}

/* TAGS */
.tag{display:inline-block;padding:3px 9px;background:rgba(0,229,255,0.08);border:1px solid rgba(0,229,255,0.2);border-radius:2px;font-family:var(--font-mono);font-size:0.65rem;color:var(--accent);letter-spacing:0.08em;margin:2px;}
.tag-red{background:rgba(255,60,90,0.08);border-color:rgba(255,60,90,0.2);color:var(--accent2);}
.tag-yellow{background:rgba(255,214,0,0.08);border-color:rgba(255,214,0,0.2);color:var(--accent3);}
.tag-green{background:rgba(0,255,136,0.08);border-color:rgba(0,255,136,0.2);color:var(--green);}
.tag-purple{background:rgba(153,69,255,0.08);border-color:rgba(153,69,255,0.2);color:var(--purple);}

/* GRIDS */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;}

/* SPEC TABLE */
.spec-table{width:100%;border-collapse:collapse;}
.spec-table tr{border-bottom:1px solid rgba(30,37,48,0.5);}
.spec-table tr:last-child{border-bottom:none;}
.spec-table td{padding:0.7rem 0.75rem;font-size:0.85rem;}
.spec-table td:first-child{font-family:var(--font-mono);font-size:0.62rem;color:var(--accent);letter-spacing:0.12em;text-transform:uppercase;width:42%;vertical-align:top;padding-top:0.85rem;}
.spec-table td:last-child{color:var(--text-hi);font-weight:500;}

/* MARQUEE */
.marquee-wrap{background:var(--accent);overflow:hidden;padding:11px 0;}
.marquee-track{display:flex;gap:3rem;animation:marquee 30s linear infinite;white-space:nowrap;}
.marquee-track span{font-family:var(--font-hd);font-size:0.65rem;font-weight:700;letter-spacing:0.2em;color:var(--black);text-transform:uppercase;}
.marquee-track .dot{color:rgba(0,0,0,0.3);}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* FORMS */
.form-group{margin-bottom:1.5rem;}
.form-label{display:block;font-family:var(--font-mono);font-size:0.65rem;color:var(--accent);letter-spacing:0.15em;text-transform:uppercase;margin-bottom:8px;}
.form-select,.form-input{width:100%;background:var(--dark);border:1px solid var(--border);border-radius:3px;padding:10px 14px;color:var(--text-hi);font-family:var(--font-body);font-size:0.9rem;outline:none;transition:border-color 0.2s;appearance:none;}
.form-select:focus,.form-input:focus{border-color:var(--accent);}
.select-wrap{position:relative;}
.select-wrap::after{content:'▾';position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--accent);pointer-events:none;}
.range-wrap{display:flex;align-items:center;gap:12px;}
.range-input{flex:1;-webkit-appearance:none;height:3px;background:var(--border);border-radius:2px;outline:none;}
.range-input::-webkit-slider-thumb{-webkit-appearance:none;width:16px;height:16px;border-radius:50%;background:var(--accent);cursor:pointer;border:2px solid var(--dark);box-shadow:0 0 8px rgba(0,229,255,0.4);}
.range-val{font-family:var(--font-hd);font-size:1rem;color:var(--accent);min-width:48px;text-align:right;}

/* FOOTER */
footer{background:var(--dark);border-top:1px solid var(--border);padding:60px 4% 30px;}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem;}
.footer-brand{font-family:var(--font-hd);font-size:1.1rem;color:var(--text-hi);margin-bottom:0.75rem;}
.footer-tagline{font-size:0.82rem;color:var(--text-dim);line-height:1.6;}
.footer-col h4{font-size:0.65rem;letter-spacing:0.2em;color:var(--text-dim);margin-bottom:1rem;font-family:var(--font-mono);text-transform:uppercase;}
.footer-col a{display:block;color:var(--text);text-decoration:none;font-size:0.85rem;margin-bottom:0.5rem;transition:color 0.2s;}
.footer-col a:hover{color:var(--accent);}
.footer-bottom{border-top:1px solid var(--border);padding-top:1.5rem;display:flex;justify-content:space-between;align-items:center;font-size:0.72rem;color:var(--text-dim);font-family:var(--font-mono);}

/* PAGE HERO */
.page-hero{min-height:52vh;display:flex;align-items:center;padding:120px 4% 60px;position:relative;overflow:hidden;}
.page-hero-bg{position:absolute;inset:0;background:linear-gradient(180deg,var(--black) 0%,var(--dark) 100%);}
.page-hero-grid{position:absolute;inset:0;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:44px 44px;opacity:0.18;}

/* ANIMATIONS */
@keyframes fadeUp{from{opacity:0;transform:translateY(30px);}to{opacity:1;transform:translateY(0);}}
@keyframes scanline{0%{transform:translateY(-100%);}100%{transform:translateY(100vh);}}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.3;}}
@keyframes spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
.fade-up{animation:fadeUp 0.7s ease forwards;}

/* RESPONSIVE */
@media(max-width:960px){
  .grid-3,.grid-4{grid-template-columns:1fr 1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .nav-links{display:none;}
  .hamburger{display:flex;}
  nav.open .nav-links{display:flex;flex-direction:column;position:fixed;top:68px;left:0;right:0;background:rgba(5,6,8,0.99);padding:1.5rem 4%;gap:0.5rem;border-bottom:1px solid var(--border);z-index:999;max-height:calc(100vh - 68px);overflow-y:auto;}
  nav.open .dropdown-menu{display:block;position:static;border:none;background:rgba(0,229,255,0.03);border-radius:0;margin-top:0.25rem;padding:0;}
}
@media(max-width:600px){
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  section{padding:80px 4%;}
  .footer-bottom{flex-direction:column;gap:0.5rem;text-align:center;}
}
