@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700&display=swap');

:root {
  --ink: #07100f;
  --ink-soft: #18211f;
  --paper: #f4f2ed;
  --paper-deep: #e7e4dc;
  --signal: #d8ff3e;
  --aqua: #73e5cf;
  --line: rgba(7, 16, 15, 0.16);
  --muted: #5d6663;
  --max: 1240px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "Manrope", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
.skip-link {
  position: fixed; left: 1rem; top: -5rem; z-index: 100;
  padding: .75rem 1rem; background: var(--signal); color: var(--ink);
}
.skip-link:focus { top: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.section-shell { width: min(calc(100% - 48px), var(--max)); margin-inline: auto; }
.section-pad { padding-block: 8rem; }

.site-header {
  position: fixed; z-index: 50; top: 0; left: 0; right: 0;
  height: 84px; display: flex; align-items: center;
  padding-inline: max(24px, calc((100vw - var(--max)) / 2));
  color: #fff; transition: background .25s, border-color .25s;
  border-bottom: 1px solid transparent;
}
.site-header.scrolled { background: rgba(7,16,15,.92); backdrop-filter: blur(16px); border-color: rgba(255,255,255,.12); }
.brand { display: flex; align-items: center; gap: .7rem; text-decoration: none; font-size: 1.45rem; font-weight: 700; letter-spacing: -.04em; }
.brand-mark { width: 28px; color: var(--signal); display: grid; place-items: center; }
.brand-mark svg { width: 100%; }
.brand-dot { color: var(--signal); }
.site-nav { margin-left: auto; display: flex; align-items: center; gap: 2rem; }
.site-nav a { text-decoration: none; font-size: .9rem; font-weight: 600; }
.site-nav a:not(.nav-cta) { color: rgba(255,255,255,.74); transition: color .2s; }
.site-nav a:not(.nav-cta):hover { color: #fff; }
.nav-cta { padding: .7rem 1rem; border: 1px solid rgba(255,255,255,.35); border-radius: 2px; }
.nav-cta:hover { background: var(--signal); color: var(--ink); border-color: var(--signal); }
.menu-toggle { display: none; }

.hero {
  width: 100%; max-width: none; min-height: 760px; padding: 11rem max(24px, calc((100vw - var(--max)) / 2)) 6rem;
  background: var(--ink); color: #fff; display: grid; grid-template-columns: 1.2fr .8fr; gap: 5vw; align-items: center; overflow: hidden; position: relative;
}
.hero::before { content:""; position: absolute; inset: 0; opacity:.22; background-image: linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px); background-size: 56px 56px; mask-image: linear-gradient(to right,black,transparent 78%); }
.hero-copy, .signal-panel { position: relative; z-index: 1; }
.eyebrow, .section-index { font-family:"DM Mono", monospace; font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; }
.eyebrow { display:flex; align-items:center; gap:.65rem; color:rgba(255,255,255,.62); margin-bottom:2rem; }
.eyebrow span { width:7px; height:7px; border-radius:50%; background:var(--signal); box-shadow:0 0 0 5px rgba(216,255,62,.12); }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(3.75rem, 7vw, 7.2rem); max-width: 850px; line-height: .96; letter-spacing: -.065em; margin-bottom: 2rem; font-weight: 600; }
h1 em { color: var(--signal); font-style: normal; }
.hero-lead { max-width: 660px; color: rgba(255,255,255,.7); font-size: clamp(1.08rem,1.7vw,1.3rem); line-height:1.65; }
.hero-actions { display:flex; gap:2rem; align-items:center; margin-top:2.8rem; }
.button { display:inline-flex; align-items:center; justify-content:space-between; gap:2rem; min-width:220px; padding:1rem 1.2rem; text-decoration:none; font-weight:700; font-size:.9rem; border-radius:2px; transition:transform .2s,background .2s; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--signal); color:var(--ink); }
.button-light { background:#fff; color:var(--ink); }
.text-link { text-decoration:none; color:rgba(255,255,255,.7); font-size:.9rem; border-bottom:1px solid rgba(255,255,255,.2); padding-bottom:.2rem; }

.signal-panel { border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.035); padding:1.2rem; backdrop-filter:blur(6px); }
.panel-head,.panel-foot { font-family:"DM Mono",monospace; text-transform:uppercase; letter-spacing:.08em; font-size:.68rem; display:flex; justify-content:space-between; color:rgba(255,255,255,.55); }
.status { display:flex; align-items:center; gap:.5rem; color:var(--aqua); }
.status i { width:6px;height:6px;border-radius:50%;background:var(--aqua);box-shadow:0 0 12px var(--aqua); }
.radar { width:min(100%,440px); aspect-ratio:1; margin:1rem auto; position:relative; border-radius:50%; border:1px solid rgba(115,229,207,.22); overflow:hidden; background:radial-gradient(circle,rgba(115,229,207,.08),transparent 63%); }
.radar::before,.radar::after { content:"";position:absolute;background:rgba(115,229,207,.12); }
.radar::before {width:1px;height:100%;left:50%;}.radar::after {height:1px;width:100%;top:50%;}
.radar-ring { position:absolute;border:1px solid rgba(115,229,207,.17);border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%); }
.ring-1{width:75%;height:75%}.ring-2{width:48%;height:48%}.ring-3{width:22%;height:22%}
.radar-line{position:absolute;width:1px;height:100%;left:50%;background:rgba(115,229,207,.08)}.line-a{transform:rotate(45deg)}.line-b{transform:rotate(-45deg)}
.radar-sweep{position:absolute;width:50%;height:50%;left:50%;top:0;transform-origin:0 100%;background:linear-gradient(135deg,rgba(216,255,62,.24),transparent 60%);animation:sweep 8s linear infinite;}
@keyframes sweep{to{transform:rotate(360deg)}}
.radar-center{position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);display:grid;text-align:center;background:var(--ink);border:1px solid var(--signal);padding:.7rem 1rem;color:var(--signal);font-family:"DM Mono",monospace}.radar-center span{font-size:.95rem;font-weight:500}.radar-center small{font-size:.5rem;letter-spacing:.18em;color:rgba(255,255,255,.5)}
.blip{position:absolute;width:7px;height:7px;border:1px solid var(--signal);border-radius:50%;box-shadow:0 0 0 4px rgba(216,255,62,.08)}.blip-1{left:28%;top:34%}.blip-2{right:21%;top:52%}.blip-3{left:47%;bottom:18%}
.panel-foot{padding-top:1rem;border-top:1px solid rgba(255,255,255,.12);gap:.5rem}.panel-foot div{display:grid;gap:.25rem}.panel-foot small{color:var(--signal)}.panel-foot span{color:rgba(255,255,255,.72)}

.trust-strip { border-bottom:1px solid var(--line); }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.trust-grid p { padding:1.5rem 1.2rem; margin:0; font-family:"DM Mono",monospace; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; border-right:1px solid var(--line); }
.trust-grid p:first-child{border-left:1px solid var(--line)}
.trust-grid p::before{content:"+";color:#5b8700;margin-right:.6rem}

.section-heading { display:grid; grid-template-columns:1.4fr .6fr; gap:4rem; align-items:end; margin-bottom:4.5rem; }
.section-index { display:block; color:var(--muted); margin-bottom:1.2rem; }
.section-heading h2,.about h2,.contact-copy h2 { font-size:clamp(2.5rem,5vw,5rem);line-height:1.04;letter-spacing:-.055em;font-weight:600;margin:0; }
.section-heading>p { color:var(--muted);font-size:1.08rem;margin:0; }
.service-grid { display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--ink);border-left:1px solid var(--line); }
.service-card { min-height:480px;padding:2rem;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;position:relative;transition:background .25s,transform .25s; }
.service-card:hover { background:#fff;transform:translateY(-4px); }
.card-no { font-family:"DM Mono",monospace;font-size:.7rem;color:var(--muted); }
.card-icon { width:54px;height:54px;margin:3rem 0 2rem;fill:none;stroke:currentColor;stroke-width:1.5; }
.service-card h3{font-size:1.8rem;letter-spacing:-.035em;margin-bottom:1rem}.service-card p{color:var(--muted);max-width:500px}.service-card ul{list-style:none;padding:1.5rem 0 0;margin:auto 0 0;border-top:1px solid var(--line);display:grid;gap:.55rem;font-size:.86rem}.service-card li::before{content:"→";color:#6c9200;margin-right:.55rem}

.method-section { background:#10201e;color:#fff;position:relative;overflow:hidden; }
.method-section::after{content:"";position:absolute;width:650px;height:650px;border-radius:50%;border:1px solid rgba(216,255,62,.1);right:-250px;top:-280px;box-shadow:0 0 0 90px rgba(216,255,62,.025),0 0 0 180px rgba(216,255,62,.018)}
.section-heading.light { position:relative;z-index:1 }.section-heading.light .section-index,.section-heading.light>p{color:rgba(255,255,255,.58)}
.steps { list-style:none;padding:0;margin:0;position:relative;z-index:1;border-top:1px solid rgba(255,255,255,.2); }
.steps li { display:grid;grid-template-columns:110px 1fr;padding:1.8rem 0;border-bottom:1px solid rgba(255,255,255,.14);transition:padding-left .25s; }
.steps li:hover { padding-left:1rem; }
.steps>li>span { font-family:"DM Mono",monospace;color:var(--signal);font-size:.76rem; }
.steps div{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.steps h3{font-size:1.5rem;margin:0}.steps p{color:rgba(255,255,255,.58);margin:0;max-width:450px}

.about { display:grid;grid-template-columns:.72fr 1.28fr;gap:7vw;align-items:start; }
.about-number { font-size:clamp(10rem,24vw,22rem);line-height:.75;letter-spacing:-.1em;color:transparent;-webkit-text-stroke:1px rgba(7,16,15,.2);position:sticky;top:150px; }
.about h2{margin-bottom:2.5rem}.large-copy{font-size:1.3rem;line-height:1.6;color:var(--ink-soft)}.about-copy>p:not(.large-copy){color:var(--muted);max-width:700px}
.about-facts{margin-top:3rem;border-top:1px solid var(--ink);display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding-top:1.4rem}.about-facts div{display:grid;gap:.4rem}.about-facts small,.contact-details small{font-family:"DM Mono",monospace;font-size:.65rem;letter-spacing:.1em;color:var(--muted)}.about-facts strong{font-size:.82rem}

.contact-section { background:var(--signal);padding-block:7rem; }
.contact-grid { display:grid;grid-template-columns:1.4fr .6fr;gap:7vw;align-items:end; }
.contact-copy h2{max-width:850px;margin-bottom:2rem}.contact-copy>p{max-width:650px;font-size:1.08rem;margin-bottom:2.5rem}.contact-copy .section-index{color:rgba(7,16,15,.65)}
.contact-details { border-top:1px solid var(--ink); }
.contact-details>div { padding:1.5rem 0;border-bottom:1px solid rgba(7,16,15,.25); }.contact-details small{color:rgba(7,16,15,.6)}.contact-details p{margin:.55rem 0 0;font-weight:600}
.site-footer{background:var(--ink);color:#fff;padding-block:2rem}.footer-grid{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center}.footer-brand{justify-self:start}.site-footer p{margin:0;color:rgba(255,255,255,.5);font-size:.78rem}.copyright{text-align:right}

.reveal { opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}.radar-sweep{animation:none}}

@media (max-width: 900px) {
  .section-shell{width:min(calc(100% - 32px),var(--max))}.section-pad{padding-block:5.5rem}
  .site-header{height:72px;padding-inline:16px}.menu-toggle{display:grid;width:42px;height:42px;margin-left:auto;border:1px solid rgba(255,255,255,.25);background:transparent;place-content:center;gap:6px}.menu-toggle span:not(.sr-only){display:block;width:18px;height:1px;background:#fff;transition:transform .2s}.menu-toggle[aria-expanded="true"] span:nth-of-type(2){transform:translateY(3.5px) rotate(45deg)}.menu-toggle[aria-expanded="true"] span:nth-of-type(3){transform:translateY(-3.5px) rotate(-45deg)}
  .site-nav{display:none;position:absolute;left:0;right:0;top:72px;background:var(--ink);padding:1rem 16px 1.5rem;flex-direction:column;align-items:stretch;gap:0;border-top:1px solid rgba(255,255,255,.12)}.site-nav.open{display:flex}.site-nav a{padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.1)}.site-nav .nav-cta{margin-top:.8rem;padding:1rem;border:1px solid rgba(255,255,255,.3)}
  .hero{min-height:auto;padding:9rem 16px 4rem;grid-template-columns:1fr;gap:4rem}.hero::before{mask-image:linear-gradient(to bottom,black,transparent 80%)}h1{font-size:clamp(3.2rem,15vw,5.8rem)}.signal-panel{max-width:620px;width:100%;margin-inline:auto}.radar{max-width:390px}
  .trust-grid{grid-template-columns:repeat(2,1fr)}.trust-grid p:nth-child(3){border-left:1px solid var(--line)}.trust-grid p:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .section-heading,.contact-grid{grid-template-columns:1fr;gap:2rem}.service-card{min-height:440px}.about{grid-template-columns:1fr}.about-number{display:none}.about-facts{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr;gap:1rem}.copyright{text-align:left}
}
@media (max-width: 620px) {
  .hero-actions{align-items:stretch;flex-direction:column;gap:1.2rem}.button{width:100%}.text-link{align-self:flex-start}.service-grid{grid-template-columns:1fr}.service-card{min-height:420px}.steps li{grid-template-columns:48px 1fr}.steps div{grid-template-columns:1fr;gap:.5rem}.panel-foot span{font-size:.57rem}.trust-grid{grid-template-columns:1fr}.trust-grid p{border-left:1px solid var(--line);border-bottom:1px solid var(--line)}.section-heading h2,.about h2,.contact-copy h2{font-size:2.7rem}
}
