/* Hermes Agent GWS — shared styles. Dark only. No fonts downloaded. */
:root{
  --bg:#0B1F3A; --bg2:#0F2A4E; --line:rgba(255,255,255,.08);
  --text:#E8EEF7; --muted:#9FB0C8; --teal:#22D3EE; --amber:#F5B54A;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; color:var(--text); min-height:100vh;
  font:16px/1.6 -apple-system,BlinkMacSystemFont,Inter,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:
    radial-gradient(1200px 600px at 72% -10%, rgba(34,211,238,.16), transparent 60%),
    linear-gradient(180deg, var(--bg), var(--bg2));
}
a{color:var(--teal); text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1100px; margin:0 auto; padding:0 24px}
header{display:flex; align-items:center; justify-content:space-between; padding:20px 0}
.brand{display:flex; align-items:center; gap:12px; color:var(--text); font-weight:600}
.brand img{width:36px; height:36px; border-radius:9px}
nav a{color:var(--muted); margin-left:22px; font-size:15px}
nav a:hover{color:var(--text)}
.hero{display:grid; grid-template-columns:1.1fr .9fr; gap:48px; align-items:center; padding:56px 0 40px}
.hero h1{font-size:clamp(36px,5.2vw,56px); line-height:1.08; margin:0 0 18px; letter-spacing:-.02em}
.hero p{font-size:19px; color:var(--muted); margin:0 0 26px; max-width:38ch}
.hero img{width:100%; height:auto; border-radius:18px; border:1px solid var(--line); box-shadow:0 30px 80px rgba(0,0,0,.45)}
.pill{display:inline-block; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--teal);
  border:1px solid rgba(34,211,238,.35); border-radius:999px; padding:4px 12px; margin-bottom:18px}
.cta{display:inline-block; background:var(--teal); color:#062133; font-weight:600; padding:12px 20px; border-radius:10px}
.cta:hover{text-decoration:none; filter:brightness(1.08)}
.cards{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; padding:24px 0 56px}
.card{background:rgba(255,255,255,.03); border:1px solid var(--line); border-radius:16px; padding:22px}
.card h3{margin:0 0 10px; font-size:17px}
.card h3 span{color:var(--amber); margin-right:8px; font-variant-numeric:tabular-nums}
.card p,.card li{color:var(--muted); font-size:15px; margin:0}
.card ul{padding-left:18px; margin:8px 0 0}
.card li{margin:4px 0}
footer{border-top:1px solid var(--line); padding:26px 0 40px; color:var(--muted); font-size:14px;
  display:flex; flex-wrap:wrap; gap:12px 28px; justify-content:space-between}
.doc{max-width:760px; padding:32px 0 64px}
.doc h1{font-size:clamp(30px,4vw,42px); letter-spacing:-.02em; margin:0 0 6px}
.doc .meta{color:var(--muted); margin-bottom:28px}
.doc h2{font-size:20px; margin:34px 0 10px}
.doc p,.doc li{color:var(--muted)}
.doc li{margin:4px 0}
.doc blockquote{margin:16px 0; padding:14px 18px; border-left:3px solid var(--teal);
  background:rgba(34,211,238,.06); border-radius:0 10px 10px 0; color:var(--text)}
@media (max-width:900px){
  .hero{grid-template-columns:1fr; padding-top:32px}
  .cards{grid-template-columns:1fr}
}