:root {
  --wine: #781f28;
  --wine-deep: #4b1118;
  --wine-light: #a4343f;
  --green: #0a593b;
  --green-bright: #1b7a55;
  --ink: #17201d;
  --muted: #64716c;
  --paper: #f5f7f6;
  --white: #fff;
}

html { scroll-behavior: smooth; }
body { font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif; color: var(--ink); background: var(--paper); font-size: 1rem; }
.skip-link { position: fixed; z-index: 2000; top: .75rem; left: .75rem; background: white; color: var(--wine); padding: .75rem 1rem; border-radius: .5rem; }

.navbar { background: rgba(56, 12, 18, .95); backdrop-filter: blur(12px); border-bottom: 1px solid rgba(255,255,255,.12); padding: .8rem 0; }
.navbar-brand { font-size: 1.15rem; letter-spacing: -.02em; }
.brand-mark { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: .45rem; background: var(--green-bright); font-size: 1.15rem; }
.brand-dot { color: #bcd9cd; }
.navbar .nav-link { color: rgba(255,255,255,.78); font-weight: 600; font-size: .92rem; }
.navbar .nav-link:hover, .navbar .nav-link:focus { color: white; }
.nav-link-highlight { border: 1px solid rgba(255,255,255,.3); border-radius: .45rem; padding: .45rem .8rem !important; }

.hero { min-height: 760px; display: flex; align-items: center; position: relative; overflow: hidden; padding: 9rem 0 6rem; color: white; background: radial-gradient(circle at 82% 42%, rgba(23,116,79,.5), transparent 30%), linear-gradient(125deg, #3d0c12 0%, var(--wine) 48%, #611a22 100%); }
.hero::after { content: ""; position: absolute; inset: auto -12% -40% auto; width: 48rem; height: 48rem; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; box-shadow: 0 0 0 7rem rgba(255,255,255,.025), 0 0 0 14rem rgba(255,255,255,.02); }
.circuit-grid { position: absolute; inset: 0; opacity: .14; background-image: linear-gradient(rgba(255,255,255,.18) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.18) 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(to right, transparent, black 55%); }
.eyebrow { display: flex; align-items: center; gap: .7rem; text-transform: uppercase; letter-spacing: .14em; font-size: .78rem; font-weight: 750; color: #d5e9df; margin-bottom: 1.5rem; }
.eyebrow span { width: 2.5rem; height: 3px; background: #43a77b; }
.hero h1 { font-size: clamp(3rem, 6vw, 5.3rem); line-height: .98; letter-spacing: -.055em; font-weight: 850; margin-bottom: 1.6rem; }
.hero h1 span { color: #b7ddcc; }
.hero-copy { font-size: 1.18rem; line-height: 1.75; color: rgba(255,255,255,.78); max-width: 42rem; margin-bottom: 2rem; }
.btn { border-radius: .5rem; font-weight: 700; padding: .85rem 1.25rem; }
.btn-primary { --bs-btn-bg: var(--green-bright); --bs-btn-border-color: var(--green-bright); --bs-btn-hover-bg: #146a49; --bs-btn-hover-border-color: #146a49; }
.hero-meta { display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 3rem; color: rgba(255,255,255,.66); font-size: .87rem; }
.hero-meta i { color: #72be9d; margin-right: .4rem; }
.hero-visual { position: relative; min-height: 370px; }
.code-window { position: absolute; width: 100%; top: 25px; right: 0; border: 1px solid rgba(255,255,255,.2); border-radius: .85rem; background: rgba(19,26,23,.82); backdrop-filter: blur(16px); box-shadow: 0 30px 65px rgba(0,0,0,.35); overflow: hidden; transform: rotate(2deg); }
.window-bar { padding: .8rem 1rem; border-bottom: 1px solid rgba(255,255,255,.1); display: flex; gap: .4rem; align-items: center; }
.window-bar span { width: .7rem; height: .7rem; border-radius: 50%; background: #a4343f; }.window-bar span:nth-child(2){background:#c8a23b}.window-bar span:nth-child(3){background:#3d9b70}.window-bar small{margin-left:auto;color:#82928b}
.code-lines { padding: 2rem 1.6rem; font-family: "SFMono-Regular", Consolas, monospace; color: #d7dfdb; font-size: .95rem; }
.code-lines p { margin-bottom: .9rem; }.code-lines b{color:#62706a;font-weight:400;margin-right:.6rem}.code-lines .wine{color:#ee929b}.code-lines .green{color:#76d0a8}
.float-icon { position: absolute; display:grid;place-items:center;width:4rem;height:4rem;border-radius:.8rem;color:white;font-size:1.6rem;box-shadow:0 18px 30px rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.25)}
.icon-code{right:-1rem;top:0;background:var(--wine-light);transform:rotate(8deg)}.icon-cpu{left:-1.2rem;bottom:1rem;background:var(--green-bright);transform:rotate(-8deg)}.icon-terminal{right:3rem;bottom:-1.3rem;background:#24322c;transform:rotate(3deg)}
.icon-code{animation:float-code 5s ease-in-out infinite}.icon-cpu{animation:float-cpu 6s ease-in-out infinite}.icon-terminal{animation:float-terminal 5.5s ease-in-out infinite}
@keyframes float-code{50%{transform:translateY(-10px) rotate(5deg)}}
@keyframes float-cpu{50%{transform:translateY(9px) rotate(-4deg)}}
@keyframes float-terminal{50%{transform:translateY(-7px) rotate(1deg)}}

.systems-section { padding: 6.5rem 0; }
.section-heading { margin-bottom: 2.5rem; }
.section-kicker { color: var(--wine); font-weight: 800; text-transform: uppercase; letter-spacing: .13em; font-size: .75rem; }
.section-heading h2, .about-section h2 { font-size: clamp(2.25rem, 4vw, 3.5rem); font-weight: 820; letter-spacing: -.04em; margin: .4rem 0 0; }
.section-heading p { max-width: 31rem; color: var(--muted); line-height: 1.65; margin: 0 0 .35rem; }
.system-card { display: flex; flex-direction: column; padding: 2rem; border-radius: .85rem; background: white; border: 1px solid #dce3df; box-shadow: 0 10px 30px rgba(25,45,37,.06); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.system-card:hover { transform: translateY(-6px); border-color: rgba(120,31,40,.3); box-shadow: 0 20px 45px rgba(25,45,37,.12); }
.system-icon { display: grid; place-items: center; width: 3.6rem; height: 3.6rem; border-radius: .7rem; background: #f7eaec; color: var(--wine); font-size: 1.65rem; }
.status-badge { color: var(--green); background: #e7f4ee; border-radius: 5rem; padding: .42rem .7rem; font-size: .75rem; font-weight: 750; }.status-badge i{font-size:.45rem;vertical-align:middle;margin-right:.3rem}.status-soon{color:#856817;background:#faf1d3}
.card-body-copy { padding: 2rem 0 1.6rem; }
.system-url { display: block; color: var(--muted); font-family: Consolas, monospace; font-size: .8rem; margin-bottom: .55rem; }
.system-card h3 { font-size: 1.65rem; font-weight: 800; letter-spacing: -.025em; }
.system-card p { color: var(--muted); line-height: 1.65; }
.system-link { margin-top: auto; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #e3e9e6; padding-top: 1.1rem; color: var(--wine); text-decoration: none; font-weight: 750; }
.system-link i { transition: transform .2s ease; }.system-link:hover i{transform:translate(3px,-3px)}
.next-project { border: 1px dashed #b8c3be; background: rgba(255,255,255,.42); padding: 1.4rem 1.6rem; border-radius: .75rem; color: var(--muted); }.next-project strong{display:block;color:var(--ink);font-size:1.05rem}.next-icon{display:grid;place-items:center;width:2.8rem;height:2.8rem;border-radius:.55rem;background:#e5ebe8;color:var(--green);font-size:1.2rem}.next-domain{font-family:Consolas,monospace;font-size:.8rem;background:white;border:1px solid #dce3df;border-radius:.4rem;padding:.55rem .75rem}

.about-section { background: #123b2c; color: white; padding: 6.5rem 0; position: relative; overflow: hidden; }
.about-section::before { content:"";position:absolute;width:32rem;height:32rem;border-radius:50%;background:rgba(255,255,255,.035);right:-10rem;top:-13rem; }
.section-kicker.light { color: #7cc5a6; }.about-section h2{margin-bottom:1.3rem}.about-section p{color:rgba(255,255,255,.72);line-height:1.75;font-size:1.05rem;max-width:45rem}
.values>div{display:flex;flex-direction:column}.values i{font-size:1.5rem;color:#74c09e;margin-bottom:.6rem}.values strong{font-size:1rem}.values span{font-size:.82rem;color:rgba(255,255,255,.55);margin-top:.2rem}
.career-panel { background:white;border-radius:1rem;padding:2.2rem 1.5rem;box-shadow:0 25px 55px rgba(0,0,0,.18);position:relative }.career-logo{width:min(100%,300px);height:auto}.career-panel p{color:var(--wine-deep);font-weight:800;margin:1rem 0 .15rem;font-size:1.05rem}.career-panel span{color:#65736d;font-size:.82rem}

footer { background: #0d1713; color: rgba(255,255,255,.67); padding: 2.2rem 0; font-size: .88rem; }
.footer-logos { display:flex;align-items:center;gap:1rem }.footer-logos img{height:52px;width:auto;max-width:42%;object-fit:contain;background:white;padding:.3rem;border-radius:.3rem}.logo-divider{width:1px;height:38px;background:rgba(255,255,255,.2)}footer p{color:white;font-weight:650}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1)}.reveal.is-visible{opacity:1;transform:none}.reveal-delay-1{transition-delay:.12s}

@media (max-width: 991.98px) { .hero{min-height:auto;padding-top:9.5rem}.navbar-collapse{padding-top:1rem}.nav-link-highlight{display:inline-block;margin-top:.3rem}.footer-logos{justify-content:center}footer{text-align:center}.about-section{text-align:center}.about-section p{margin-inline:auto}.values>div{align-items:center} }
@media (max-width: 575.98px) { .hero{padding-bottom:4.5rem}.hero h1{font-size:3rem}.hero-copy{font-size:1.02rem}.hero-meta{gap:1rem}.systems-section,.about-section{padding:4.5rem 0}.system-card{padding:1.45rem}.next-domain{align-self:flex-start}.footer-logos img{height:42px} }
@media (prefers-reduced-motion: reduce) { html{scroll-behavior:auto}.system-card,.system-link i,.reveal{transition:none}.reveal{opacity:1;transform:none}.float-icon{animation:none} }