:root {
      --black: #050505;
      --black-soft: #0a0909;
      --panel: rgba(20, 18, 16, 0.78);
      --panel-deep: rgba(11, 10, 10, 0.94);
      --gold: #d4aa58;
      --gold-bright: #f5d98f;
      --gold-soft: #b3863f;
      --red: #8f0712;
      --red-bright: #be1723;
      --cream: #f4eee2;
      --muted: #b6ada0;
      --line: rgba(212, 170, 88, 0.18);
      --line-strong: rgba(212, 170, 88, 0.42);
      --shadow: 0 24px 80px rgba(0, 0, 0, 0.34);
      --radius: 18px;
      --max: 1180px;
    }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { position: relative; margin: 0; overflow-x: hidden; color: var(--cream); background: radial-gradient(circle at 76% 8%, rgba(143, 7, 18, 0.035), transparent 29rem), radial-gradient(circle at 10% 24%, rgba(212, 170, 88, 0.025), transparent 30rem), #040404; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.6; }
body::before { position: fixed; inset: 0; z-index: 1; pointer-events: none; content: ""; opacity: 0.075; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); }
.circuit-board { position: fixed; inset: 0; pointer-events: none; z-index: 1; opacity: 0.48; background-image: url("data:image/svg+xml,%3Csvg width='620' height='460' viewBox='0 0 620 460' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23d4aa58' stroke-width='1.15' stroke-linecap='round' stroke-linejoin='round' opacity='.52'%3E%3Cpath d='M0 68h82l18 18h76l18-18h64'/%3E%3Cpath d='M42 0v46l22 22v68l30 30v72'/%3E%3Cpath d='M0 284h72l24-24h96l22 22h88l26-26h90l24 24h178'/%3E%3Cpath d='M154 460v-66l-24-24v-64l34-34'/%3E%3Cpath d='M620 118h-82l-26 26h-60l-28-28h-84l-18 18h-58'/%3E%3Cpath d='M494 0v52l-24 24v70l30 30v62'/%3E%3Cpath d='M620 380h-70l-26-26h-78l-20 20h-72l-26-26h-74'/%3E%3Cpath d='M368 460v-52l26-26v-58l-28-28v-50'/%3E%3Cpath d='M236 0v34l20 20v72l-20 20v66'/%3E%3Cpath d='M0 196h86l20 20h66l24-24h58'/%3E%3C/g%3E%3Cg fill='%23d4aa58' opacity='.76'%3E%3Ccircle cx='82' cy='68' r='3'/%3E%3Ccircle cx='176' cy='86' r='3'/%3E%3Ccircle cx='96' cy='260' r='3'/%3E%3Ccircle cx='302' cy='282' r='3'/%3E%3Ccircle cx='418' cy='256' r='3'/%3E%3Ccircle cx='512' cy='144' r='3'/%3E%3Ccircle cx='424' cy='116' r='3'/%3E%3Ccircle cx='446' cy='354' r='3'/%3E%3Ccircle cx='254' cy='348' r='3'/%3E%3Ccircle cx='106' cy='216' r='3'/%3E%3C/g%3E%3Cg fill='%238f0712' stroke='%23be1723' stroke-width='1' opacity='.9'%3E%3Ccircle cx='194' cy='68' r='4'/%3E%3Ccircle cx='328' cy='256' r='4'/%3E%3Ccircle cx='470' cy='76' r='4'/%3E%3Ccircle cx='394' cy='382' r='4'/%3E%3C/g%3E%3Cg fill='none' stroke='%23d4aa58' stroke-width='1' opacity='.62'%3E%3Crect x='276' y='88' width='64' height='50' rx='5'/%3E%3Cpath d='M286 88V74m12 14V74m12 14V74m12 14V74m-36 64v14m12-14v14m12-14v14m12-14v14m-46-54h-14m14 12h-14m14 12h-14m78-24h14m-14 12h14m-14 12h14'/%3E%3Crect x='86' y='318' width='52' height='42' rx='4'/%3E%3Cpath d='M96 318v-11m12 11v-11m12 11v-11m-24 53v11m12-11v11m12-11v11'/%3E%3Crect x='498' y='304' width='48' height='38' rx='4'/%3E%3Cpath d='M508 304v-10m12 10v-10m12 10v-10m-24 48v10m12-10v10m12-10v10'/%3E%3C/g%3E%3C/svg%3E"); background-position: center top; background-size: 620px 460px; mask-image: radial-gradient(ellipse at center, #000 0%, rgba(0, 0, 0, 0.92) 45%, transparent 100%); }
.circuit-board::before { position: absolute; inset: 0; content: ""; background-image: radial-gradient(circle at 18% 22%, rgba(212, 170, 88, 0.14), transparent 18rem), radial-gradient(circle at 82% 64%, rgba(143, 7, 18, 0.11), transparent 20rem); }
.scroll-progress { position: fixed; top: 0; left: 0; z-index: 40; width: 100%; height: 2px; pointer-events: none; background: linear-gradient(90deg, var(--red-bright), var(--gold-bright)); box-shadow: 0 0 14px rgba(212, 170, 88, 0.58); transform: scaleX(0); transform-origin: left; }
main, footer { position: relative; z-index: 3; }
a { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.shell { width: min(calc(100% - 42px), var(--max)); margin-inline: auto; }
.site-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid rgba(212, 170, 88, 0.12); background: rgba(5, 5, 5, 0.82); backdrop-filter: blur(18px); }
.nav { display: flex; min-height: 72px; align-items: center; justify-content: space-between; gap: 24px; }
.logo { display: inline-flex; align-items: baseline; color: var(--gold); font-family: Georgia, "Times New Roman", serif; font-size: 1.55rem; font-weight: 800; letter-spacing: 0.12em; line-height: 1; text-decoration: none; text-shadow: 0 0 22px rgba(212, 170, 88, 0.16); }
.logo .gold, .hero-logo .gold { background: linear-gradient(112deg, #8c692f 0%, #f6de9d 34%, #bd8737 58%, #f5d98f 78%, #8c692f 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.logo .four, .hero-logo .four { color: var(--red); text-shadow: 0 0 18px rgba(190, 23, 35, 0.34); }
.nav-links { display: flex; align-items: center; gap: 26px; color: var(--muted); font-size: 0.84rem; font-weight: 650; letter-spacing: 0.08em; text-transform: uppercase; }
.nav-links a { text-decoration: none; transition: color 180ms ease; }
.nav-links a:hover, .nav-links a:focus-visible { color: var(--gold-bright); }
.button { position: relative; overflow: hidden; display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 9px; padding: 0 20px; border: 1px solid transparent; border-radius: 999px; font-size: 0.84rem; font-weight: 800; letter-spacing: 0.04em; line-height: 1.1; text-align: center; text-decoration: none; text-transform: uppercase; transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease; }
.button:hover, .button:focus-visible { transform: translateY(-4px) scale(1.025); }
.button::after { position: absolute; inset: -70%; content: ""; opacity: 0; background: linear-gradient(110deg, transparent 40%, rgba(255, 255, 255, 0.54) 50%, transparent 60%); transform: translateX(-38%) rotate(8deg); transition: opacity 220ms ease, transform 600ms ease; }
.button:hover::after, .button:focus-visible::after { opacity: 0.72; transform: translateX(38%) rotate(8deg); }
.button-gold { color: #130f09; background: linear-gradient(135deg, #f0d78f, #b78235 65%, #e7c46f); box-shadow: 0 12px 34px rgba(212, 170, 88, 0.18); }
.button-gold:hover, .button-gold:focus-visible { box-shadow: 0 15px 40px rgba(212, 170, 88, 0.3); }
.button-dark { border-color: var(--line-strong); color: var(--gold-bright); background: rgba(212, 170, 88, 0.04); }
.button-dark:hover, .button-dark:focus-visible { border-color: rgba(245, 217, 143, 0.72); background: rgba(212, 170, 88, 0.09); }
.button-small { min-height: 39px; padding-inline: 15px; font-size: 0.7rem; }
.hero { position: relative; display: grid; min-height: 770px; align-items: center; padding: 94px 0 78px; }
.hero::after { position: absolute; right: -12%; bottom: 12%; width: 36rem; height: 36rem; border: 1px solid rgba(212, 170, 88, 0.08); border-radius: 50%; content: ""; box-shadow: 0 0 0 80px rgba(212, 170, 88, 0.018), 0 0 0 160px rgba(143, 7, 18, 0.018); }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) 360px; align-items: center; gap: 70px; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 20px; color: var(--gold); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.19em; line-height: 1.25; text-transform: uppercase; }
