/* Systemstatus: page-local palette, responsive layout and decorative SVG. */
.ss-page { --ss-ink:#142238; --ss-muted:#54657c; --ss-line:#dbe4ef; --ss-panel:#fff; --ss-blue:#1d4ed8; color:var(--ss-ink); background:#f5f8fc; }
.dark .ss-page { --ss-ink:#e8eff9; --ss-muted:#a1b0c4; --ss-line:#29394f; --ss-panel:#101d30; --ss-blue:#93c5fd; background:#080f1e; }
.ss-page * { min-width:0; }
.ss-wrap { width:100%; max-width:1200px; margin-inline:auto; padding-inline:32px; }
.ss-hero { position:relative; overflow:hidden; color:#f1f5f9; background:radial-gradient(ellipse at 88% 22%,#172e50,transparent 65%),linear-gradient(120deg,#081324,#0d1b30); border-bottom:1px solid #2a4260; }
/* The shared page rhythm is 40px. The status hero already reaches the navigation
   edge via .vs-band-top, so use a compact 16px inset here instead of adding a
   second large top cushion before the first status signal. */
.ss-hero.vs-band-top { padding-top:16px; }
.ss-hero-grid { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); align-items:center; gap:42px; padding-block:24px 54px; }
.ss-eyebrow { margin:0 0 10px; color:var(--ss-blue); font-size:.66rem; font-weight:800; letter-spacing:.15em; text-transform:uppercase; }
.ss-hero .ss-eyebrow { color:#93c5fd; }
.ss-hero h1 { margin:0; font-size:clamp(2rem,3.8vw,3.15rem); line-height:1.12; letter-spacing:-.05em; font-weight:850; }
.ss-hero h1 span { color:#b4cff1; }
.ss-lead { max-width:34rem; margin:22px 0 26px; color:#b0bfd2; font-size:.95rem; line-height:1.85; }
.ss-hero-actions { display:flex; flex-wrap:wrap; gap:10px; }
.ss-button { min-height:46px; display:inline-flex; justify-content:center; align-items:center; gap:18px; padding:11px 18px; border-radius:12px; font-size:.8rem; font-weight:750; text-decoration:none; transition:background .2s,box-shadow .2s; }
.ss-primary { color:#fff; background:linear-gradient(135deg,#2563eb,#1d4ed8); border:1px solid #3974ed; box-shadow:0 8px 20px -12px #2563eb,inset 0 1px #ffffff24; }
.ss-primary:hover { background:#1d4ed8; box-shadow:0 8px 24px -9px #2563eb; }
.ss-ghost { color:#d6e4f4; border:1px solid #3d506a; background:#ffffff05; }
.ss-ghost:hover { background:#ffffff0c; }
.ss-art { margin:0; padding:15px; border:1px solid #8db1dc20; border-radius:24px; background:linear-gradient(145deg,#ffffff04,#ffffff00); box-shadow:inset 0 1px #ffffff05; }
.ss-art svg { width:100%; height:auto; display:block; }
.ss-art figcaption { display:flex; justify-content:space-between; flex-wrap:wrap; gap:6px; padding:12px 5px 2px; border-top:1px solid #8db1dc20; color:#c3d3e6; font-size:.66rem; }
.ss-art figcaption span { color:#9eafc5; }
.ss-orbit { transform-origin:240px 150px; animation:ss-orbit 32s linear infinite; }
.ss-flow { animation:ss-flow 10s linear infinite; }
@keyframes ss-orbit { to { transform:rotate(360deg); } }
@keyframes ss-flow { to { stroke-dashoffset:-218; } }
.ss-content { padding-top:32px; }
.ss-summary { display:flex; align-items:center; gap:20px; padding:26px; border:1px solid var(--ss-line); border-left:3px solid #10b981; border-radius:18px; background:var(--ss-panel); box-shadow:0 12px 40px -30px #162b5055; }
.ss-summary-icon { display:grid; place-items:center; flex:0 0 48px; height:48px; border:1px solid #10b98145; border-radius:15px; color:#047857; background:#10b9810c; }
.dark .ss-summary-icon { color:#6ee7b7; }
.ss-summary-copy { flex:1; }
.ss-summary-copy .ss-eyebrow { color:var(--ss-muted); font-size:.6rem; }
.ss-summary h2 { margin:0 0 7px; font-size:1.05rem; font-weight:800; letter-spacing:-.02em; }
.ss-summary p:last-child { margin:0; color:var(--ss-muted); font-size:.76rem; line-height:1.7; max-width:35rem; }
.ss-timestamp { display:flex; align-items:flex-start; gap:10px; border-left:1px solid var(--ss-line); padding-left:22px; color:var(--ss-muted); }
.ss-timestamp > svg { width:18px; height:18px; flex-shrink:0; }
.ss-timestamp div { display:flex; flex-direction:column; }
.ss-timestamp span { font-size:.62rem; }
.ss-timestamp time { color:var(--ss-ink); font-size:.75rem; font-weight:750; font-variant-numeric:tabular-nums; margin-top:5px; }
.ss-timestamp a { display:inline-flex; align-items:center; gap:9px; min-height:44px; color:var(--ss-blue); font-size:.72rem; font-weight:700; }
.ss-services { margin-top:48px; scroll-margin-top:100px; }
.ss-section-head { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:22px; }
.ss-page h2 { letter-spacing:-.03em; }
.ss-section-head h2,.ss-panel h2 { margin:0; font-size:1.6rem; font-weight:800; line-height:1.25; }
.ss-section-head > p { max-width:22rem; color:var(--ss-muted); font-size:.78rem; line-height:1.65; margin:0; }
.ss-service-list { overflow:hidden; border:1px solid var(--ss-line); border-radius:20px; background:var(--ss-panel); }
.ss-service { display:flex; gap:20px; align-items:flex-start; padding:26px; }
.ss-service + .ss-service { border-top:1px solid var(--ss-line); }
.ss-icon { display:inline-grid; flex:0 0 46px; width:46px; height:46px; place-items:center; color:var(--ss-blue); border:1px solid var(--ss-line); border-radius:14px; background:linear-gradient(145deg,#3b82f610,#3b82f603); box-shadow:inset 0 1px #ffffff15; }
.ss-service-copy { flex:1; }
.ss-service h3 { margin:2px 0 6px; font-size:.91rem; font-weight:800; }
.ss-service p { margin:0; max-width:40rem; color:var(--ss-muted); font-size:.8rem; line-height:1.75; }
.ss-service a { display:inline-flex; align-items:center; gap:10px; min-height:44px; color:var(--ss-blue); font-size:.73rem; font-weight:750; }
.ss-badge { display:inline-flex; align-items:center; gap:7px; flex-shrink:0; color:var(--ss-muted); border:1px solid var(--ss-line); border-radius:8px; background:#64748b07; padding:7px 10px; font-size:.66rem; font-weight:700; margin-top:3px; }
.ss-confirmed { color:#047857; background:#10b9810c; border-color:#10b98135; }
.dark .ss-confirmed { color:#6ee7b7; }
.ss-note { display:flex; align-items:center; gap:10px; color:var(--ss-muted); font-size:.73rem; line-height:1.7; margin:17px 3px 0; }
.ss-note svg { flex:0 0 17px; }
.ss-bottom-grid { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:42px; }
.ss-panel { border:1px solid var(--ss-line); border-radius:22px; padding:30px; background:var(--ss-panel); }
.ss-customer { background:radial-gradient(ellipse at 100% 0%,#3b82f612,transparent 70%),var(--ss-panel); }
.ss-customer > .ss-icon { margin-bottom:22px; }
.ss-panel > p:not(.ss-eyebrow) { color:var(--ss-muted); font-size:.83rem; line-height:1.85; margin:18px 0; }
.ss-metrics { display:flex; flex-wrap:wrap; gap:9px; }
.ss-metrics span { border:1px solid var(--ss-line); border-radius:7px; padding:6px 10px; font-size:.7rem; color:var(--ss-blue); }
.ss-path { display:flex; flex-direction:column; gap:4px; padding:14px 16px; border:1px solid var(--ss-line); border-radius:12px; background:#64748b05; }
.ss-path span { font-size:.65rem; }
.ss-path code { color:var(--ss-ink); font-size:.85rem; overflow-wrap:anywhere; }
.ss-panel .ss-small { font-size:.74rem !important; }
.ss-panel details { border-bottom:1px solid var(--ss-line); }
.ss-panel details:first-of-type { margin-top:20px; }
.ss-panel summary { cursor:pointer; padding:18px 20px 18px 0; font-size:.82rem; font-weight:750; line-height:1.6; }
.ss-panel details p { margin:0 0 18px; color:var(--ss-muted); font-size:.78rem; line-height:1.85; }
.ss-panel details a { display:inline-flex; align-items:center; min-height:44px; color:var(--ss-blue); font-size:.76rem; padding-bottom:10px; }
.ss-support { display:flex; align-items:center; gap:13px; margin-top:26px; padding:18px; border:1px solid var(--ss-line); border-radius:14px; color:var(--ss-blue); background:#3b82f607; }
.ss-support > span:nth-child(2) { flex:1; }
.ss-support strong,.ss-support small { display:block; }
.ss-support strong { color:var(--ss-ink); font-size:.81rem; }
.ss-support small { color:var(--ss-muted); font-size:.69rem; margin-top:3px; }
.ss-page a:focus-visible,.ss-page summary:focus-visible { outline:3px solid #60a5fa; outline-offset:4px; border-radius:6px; }
@media(max-width:1000px) {
 .ss-hero-grid { gap:24px; }
 .ss-summary { flex-wrap:wrap; }
 .ss-timestamp { flex-basis:100%; margin-left:68px; padding:15px 0 0; border-left:0; border-top:1px solid var(--ss-line); }
 .ss-service { flex-wrap:wrap; }
 .ss-badge { margin-left:66px; }
 .ss-service-copy { flex-basis:calc(100% - 66px); }
}
@media(max-width:760px) {
 .ss-wrap { padding-inline:20px; }
 .ss-hero-grid,.ss-bottom-grid { grid-template-columns:minmax(0,1fr); }
 .ss-hero.vs-band-top { padding-top:10px; }
 .ss-hero-grid { padding-block:18px 34px; }
 .ss-hero h1 { font-size:clamp(2rem,6vw,2.8rem); }
 .ss-art { max-width:460px; width:100%; justify-self:center; }
 .ss-section-head { display:block; }
 .ss-section-head > p { margin-top:12px; }
 .ss-summary { padding:20px; gap:14px; }
 .ss-summary-copy { flex-basis:calc(100% - 62px); }
 .ss-timestamp { margin-left:0; }
 .ss-service { padding:20px; gap:12px; }
 .ss-service-copy { flex-basis:calc(100% - 58px); }
 .ss-badge { margin-left:58px; }
 .ss-panel { padding:24px; }
}
@media(max-width:380px) {
 .ss-wrap { padding-inline:16px; }
 .ss-hero h1 { font-size:1.95rem; }
 .ss-button { width:100%; }
 .ss-summary-copy { flex-basis:100%; }
 .ss-service-copy { flex-basis:100%; }
 .ss-badge { margin-left:0; }
 .ss-panel { padding:20px; }
}
@media(prefers-reduced-motion:reduce) {
 .ss-page .ss-orbit,.ss-page .ss-flow { animation:none; }
 .ss-page .ss-button { transition:none; }
}