
:root{
  --bg:#FFFFFF; --surface:#F4F7FB; --ink:#0A1220; --sub:#4B5565;
  --accent:#0E56D0; --line:#E6ECF8; --shadow:0 6px 16px rgba(14,86,208,.06);
  --radius:14px; --maxw:1120px;
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:var(--bg)}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px}

/* Header */
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.85);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand-title{font-weight:600;font-size:1.125rem;letter-spacing:.01em;color:var(--ink)}
.nav{display:flex;align-items:center;gap:28px}
.nav a{color:#2B3340;text-decoration:none;font-size:.9875rem;padding:8px 2px;position:relative}
.nav a::after{content:"";position:absolute;left:0;bottom:4px;height:2px;width:0;background:var(--accent);transition:width .35s ease}
.nav a:hover{color:var(--ink)} .nav a:hover::after{width:100%}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--ink);font-weight:600;text-decoration:none;box-shadow:var(--shadow)}
.btn.primary{background:var(--accent);color:#fff;border-color:transparent}
.menu-toggle{display:none;border:1px solid var(--line);background:transparent;padding:8px 10px;border-radius:10px}

/* Hero */
.hero{border-bottom:1px solid var(--line);background:radial-gradient(1200px 600px at 80% -20%, #EAF1FF 0%, #FFFFFF 48%)}
.hero .container{display:grid;grid-template-columns:1.1fr .9fr;gap:32px;padding:72px 24px 24px}
.hero-title{font-size:clamp(2.4rem,4vw,4rem);line-height:1.06;margin:0 0 10px}
.hero-sub{font-size:1.125rem;color:var(--sub);margin:0 0 24px;max-width:56ch}
.hero-copy{font-size:1.02rem;color:#2E3747;margin:0 0 20px;max-width:70ch}
.hero-abstract{position:relative;display:flex;align-items:center;justify-content:center;padding:24px}
.hero-abstract svg,.hero-abstract img{width:100%;max-width:420px;height:auto;opacity:.95}

/* Cards */
.cards{padding:28px 0 8px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:18px;box-shadow:var(--shadow);min-height:140px}
.card h3{margin:10px 0 6px;font-size:1.08rem} .card p{margin:0;color:#394255;line-height:1.45;font-size:.987rem}
.card .icon{width:28px;height:28px;display:inline-block}

/* Sections */
.section{padding:36px 0} .section h4{margin:0 0 12px;font-size:1.05rem;color:#3A4255}
.snapshot ul{margin:0 0 18px 16px;padding:0} .snapshot li{margin:8px 0;color:#2b3240}
.snapshot a{color:var(--accent);text-decoration:none} .snapshot a:hover{text-decoration:underline}
.hr{height:1px;background:var(--line);border:0;margin:24px 0}
.current{padding:36px 0 28px;border-top:1px solid #E6ECF8;background:#F9FBFF;} .current h4{font-weight:800;font-size:18px;letter-spacing:.01em;color:#0A1220;margin:0 0 8px}

/* Footer */
.footer{border-top:1px solid var(--line);background:#fff}
.footer .container{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 24px;flex-wrap:wrap}
.footer small{color:#5B6678} .footer a{color:#3B6FD7;text-decoration:none}

/* Mobile */
@media (max-width:920px){
  .hero .container{grid-template-columns:1fr;padding-top:48px}
  .hero-abstract{order:-1}
  .cards{grid-template-columns:1fr}
  .nav{display:none;position:absolute;top:68px;right:16px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);border-radius:12px;padding:10px 12px}
  .nav.open{display:flex;flex-direction:column;gap:6px}
  .menu-toggle{display:inline-flex}
}

/* Matrix overlay (HTML/CSS, browser-proof) */
.hero-abstract .auric-wrap{position:relative;width:100%;max-width:420px;aspect-ratio:1/1}
/* removed .matrix-layer (using outside overlay) */
@keyframes matrixScroll{to{transform:translateY(50%);}}
@keyframes matrixFadeOut{to{opacity:0;}}
@media (prefers-reduced-motion: reduce){
  /* removed .matrix-layer (using outside overlay) */
}

/* Numeric rain overlay OUTSIDE the circle */
.matrix-layer-outside{
  position:absolute; inset:-14% -6%; pointer-events:none; z-index:1;
  opacity:.22;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'>  <path d='M4 5 L8 5 L8 20 L5 20 L5 10 L3 11 L3 8 Z' fill='%236C8EEA' fill-opacity='.55'/>  <path d='M14 5 C10.8 5 9 7.6 9 12 C9 16.4 10.8 19 14 19 C17.2 19 19 16.4 19 12 C19 7.6 17.2 5 14 5 Z M14 7.8 C15.9 7.8 17 9.2 17 12 C17 14.8 15.9 16.2 14 16.2 C12.1 16.2 11 14.8 11 12 C11 9.2 12.1 7.8 14 7.8 Z' fill='%236C8EEA' fill-opacity='.55'/>  <path d='M21 9.5 C19.6 9.5 18.4 10.3 17.6 11.4 C16.8 10.3 15.6 9.5 14.1 9.5 C12.4 9.5 11.2 10.8 11.2 12.5 C11.2 14.2 12.4 15.5 14.1 15.5 C15.6 15.5 16.8 14.7 17.6 13.6 C18.4 14.7 19.6 15.5 21.1 15.5 C22.8 15.5 24 14.2 24 12.5 C24 10.8 22.8 9.5 21 9.5 Z' fill='%236C8EEA' fill-opacity='.55'/></svg>");
  background-size:20px 20px;
  background-repeat:repeat;
  transform:translateY(-50%);
  animation:matrixScroll 10s linear 2, matrixFadeOut .8s ease forwards 20s;
}
@keyframes matrixScroll{to{transform:translateY(50%);}}
@keyframes matrixFadeOut{to{opacity:0;}}
@media (prefers-reduced-motion: reduce){ .matrix-layer-outside{animation:none} }

/* Brand mark circle with 'N' */
.brand { display:flex; align-items:center; gap:10px; }

.brand-mark {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:#FFFFFF;
  border:2px solid #0E56D0;
  box-shadow:0 1px 0 rgba(14,86,208,.08);
}

.brand-mark svg{width:26px;height:26px;display:block;}
.brand-mark .n{font:700 16px/1 Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; fill:#0A1220; }
@media (prefers-reduced-motion:no-preference){
  
.brand-mark {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:#FFFFFF;
  border:2px solid #0E56D0;
  box-shadow:0 1px 0 rgba(14,86,208,.08);
}

  .brand-mark:hover{transform:translateY(-1px);}
}

/* ===== Beyond Systems (Riske.AI • CryReport • Identity & Language) ===== */
.beyond-systems{background:#F9FBFF;padding:56px 0; margin-top:24px}
.beyond-systems{border-top:1px solid #E6ECF8;}
.beyond-systems .wrap{max-width:1100px;margin:0 auto;padding:0 20px}
.beyond-systems h2{font-weight:800;font-size:28px;letter-spacing:.01em;margin:0 0 10px;color:#0A1220}
.beyond-systems .lede{max-width:720px;color:#0A1220CC;font-size:16px;line-height:1.6;margin:0 auto 28px}
.beyond-systems .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:18px}
.bs-card{background:#fff;border:1px solid #E8EEF8;border-radius:14px;box-shadow:0 1px 4px rgba(0,0,0,.04);padding:18px 18px 16px;display:flex;flex-direction:column;min-height:180px}
.bs-card .accent{height:2px;background:#0E56D0;border-radius:2px;margin:-18px -18px 16px -18px;opacity:.9}
.bs-card .icon{width:36px;height:36px;border-radius:8px;background:#EDF4FF;display:inline-flex;align-items:center;justify-content:center;margin-bottom:10px}
.bs-card .icon svg{width:22px;height:22px;display:block}
.bs-card h3{font-size:18px;font-weight:700;margin:0 0 6px;color:#0A1220}
.bs-card p{font-size:14px;line-height:1.5;color:#0A1220CC;margin:0 0 12px}
.bs-card a.inline{font-weight:600;color:#0E56D0;text-decoration:none;border-bottom:1px solid rgba(14,86,208,.25);padding-bottom:2px}
.bs-card a.inline:hover{border-color:#0E56D0}
@media (hover:hover){
  .bs-card{transition:transform .2s ease, box-shadow .2s ease}
  .bs-card:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(14,86,208,.06)}
  .bs-card .icon{transition:transform .8s ease-in-out}
  .bs-card:hover .icon{transform:scale(1.04)}
}
@media (max-width: 980px){ .beyond-systems .grid{grid-template-columns:1fr;gap:14px} .beyond-systems{padding:56px 0} }

.current .wrap{max-width:1100px;margin:0 auto;padding:0 20px;text-align:center}

.current p{max-width:720px;margin:0 auto;color:#0A1220CC;line-height:1.6}

/* Tighten spacing between Ecosystem and Beyond Systems */
section + .beyond-systems {
  margin-top: 24px !important;
}

/* Adjust The Nozaro Current text alignment */
.current h4 {
  text-align: center !important;
}
.current p {
  text-align: left !important;
  max-width: 720px;
  margin: 8px auto 0;
  color: #0A1220CC;
  line-height: 1.6;
}


/* === Fine-tune vertical gap between Explore Ecosystem and Beyond Systems === */
section:has(.ecosystem-snapshot) {
  padding-bottom: 24px !important;
}
.beyond-systems {
  margin-top: 8px !important;
}


/* ===== Nexus page ===== */
.nexus .hero{padding:48px 0 18px}
.nexus .wrap{max-width:1100px;margin:0 auto;padding:0 20px}
.nexus .hero h1{font-weight:800;font-size:32px;margin:0 0 8px;color:#0A1220}
.nexus .hero .subline{color:#0A1220CC;margin:0 0 16px}
.network{background:#F9FBFF;border:1px solid #E8EEF8;border-radius:16px;padding:8px;overflow:hidden}
.netsvg{width:100%;height:auto;display:block}
.netsvg .ntitle{font:700 13px/1 Inter, system-ui, sans-serif; fill:#0A1220}
.netsvg .nsub{font:500 11px/1 Inter, system-ui, sans-serif; fill:#0A1220CC}
.netsvg .sig{animation: sigPulse 3.2s ease-in-out infinite}
@keyframes sigPulse{0%{r:3;opacity:.7} 50%{r:5;opacity:1} 100%{r:3;opacity:.7}}

.nexus .overview{padding:18px 0 10px}
.nexus .overview .wrap p{color:#0A1220CC;line-height:1.7;margin:0 0 12px}

.nexus .nodes{padding:18px 0 56px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{background:#fff;border:1px solid #E8EEF8;border-radius:14px;box-shadow:0 1px 4px rgba(0,0,0,.04);padding:16px}
.card h2{font-size:18px;margin:0 0 6px;color:#0A1220}
.card .tagline{font-weight:600;color:#0A1220;opacity:.8;margin:0 0 6px}
.card p{color:#0A1220CC;margin:0 0 10px}
.card .cta{display:inline-block;text-decoration:none;border-bottom:1px solid rgba(14,86,208,.3);color:#0E56D0;font-weight:600}
.card .cta:hover{border-color:#0E56D0}
.align{display:flex;justify-content:center;margin-top:16px}
.cta.primary{background:#0E56D0;color:#fff;border-radius:10px;padding:10px 14px;text-decoration:none;font-weight:700}

@media (max-width:980px){
  .grid3{grid-template-columns:1fr;gap:12px}
}


/* Nexus banner */
.nexus .nexus-banner{margin:12px 0 18px}
.nexus .nexus-banner img{
  display:block;
  width:100%;
  height:auto;
  border-radius:14px;
  border:1px solid #E8EEF8;
  box-shadow:0 8px 24px rgba(14,86,208,.06);
}
@media (min-width:1200px){
  .nexus .nexus-banner{margin:16px 0 22px}
}


/* Node icons next to titles */
.node-icon{display:inline-flex;vertical-align:middle;width:20px;height:20px;margin-right:8px;transform:translateY(-1px)}
.node-icon svg{width:20px;height:20px;display:block}
@media (hover:hover){
  .node-icon{transition:filter .25s ease, transform .2s ease}
  h2:hover .node-icon{filter:drop-shadow(0 0 6px rgba(14,86,208,.25)); transform:translateY(-1px) scale(1.02)}
}


/* Ensure breathing room above 'Discuss Alignment' button */
.nodes .wrap.align { margin-top: 16px !important; }



/* ===== Identity & Language ===== */
.identity .wrap{max-width:1100px;margin:0 auto;padding:0 20px}
.identity .hero{padding:48px 0 18px}
.identity .hero .subline{color:#0A1220CC;margin:0 0 14px}
.identity .identity-banner img{width:100%;height:auto;display:block;border-radius:14px;border:1px solid #E8EEF8;box-shadow:0 8px 24px rgba(14,86,208,.05)}

.grid2{display:grid;grid-template-columns:1.2fr .8fr;gap:16px}
.identity h2{font-size:28px;margin:0 0 6px;color:#0A1220;font-weight:800}
.identity h3{font-size:20px;margin:0 0 4px;color:#0A1220;font-weight:800}
.identity .lede{color:#0A1220CC;margin:0 0 10px}
.identity .bullets{margin:6px 0 10px 18px;color:#0A1220CC}
.identity .bullets li{margin:2px 0 4px}

.cn-card{background:#fff;border:1px solid #E6ECF8;border-radius:16px;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:220px;position:relative;overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.04)}
.cn-card .ring{position:absolute;inset:0;background:radial-gradient(closest-side, #DFF0FF, transparent 70%);opacity:.7}
.cn-card .title{position:relative;font-weight:800;color:#0A1220;font-size:18px}
.cn-card .tag{position:relative;color:#0A1220B3;margin-top:6px}

.na-tile{background:#fff;border:1px solid #E6ECF8;border-radius:16px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;justify-items:center;align-items:center;min-height:120px;padding:10px}
.na-tile .glyph{font-weight:800;color:#0E56D0;opacity:.8}

.identity .cta.primary{background:#0E56D0;color:#fff;border-radius:10px;padding:10px 14px;text-decoration:none;font-weight:700}
.identity .cta{border-bottom:1px solid rgba(14,86,208,.3);color:#0E56D0;font-weight:600;text-decoration:none}

@media (max-width:980px){
  .grid2{grid-template-columns:1fr;gap:12px}
}


/* Identity hero aligned to Nexus */
}


/* Nexus banner */
.identity .identity-banner{margin:12px 0 18px}
.identity .identity-banner img{display:block;
  width:100%;
  height:auto;
  border-radius:14px;
  border:1px solid #E8EEF8;
  box-shadow:0 8px 24px rgba(14,86,208,.06);}
.identity .hero{padding:48px 0 18px}

.identity .nexus-banner img{
  display:block;width:100%;height:auto;border-radius:14px;
  border:1px solid #E8EEF8;box-shadow:0 8px 24px rgba(14,86,208,.05);
}
.identity .nexus-banner{margin:12px 0 8px}


.identity .hero{padding-top:24px;padding-bottom:24px}

.identity .hero h1{margin:0 0 12px}

.identity .hero p.subline{margin:0 0 18px;color:#4A5B73}

.identity .hero figure img{display:block;width:100%;height:auto;aspect-ratio:1600/456;border-radius:14px;border:1px solid #E8EEF8;box-shadow:0 8px 24px rgba(14,86,208,.05)}

/* ---- Services content (isolated) ---- */
.svc-overview .lede{color:var(--muted-700);max-width:48rem;margin-top:.5rem}
.svc-offers{margin-top:1rem}
.svc-grid{display:grid;gap:1rem}
@media (min-width: 992px){.svc-grid{grid-template-columns:repeat(3,1fr);gap:1.25rem}}
.svc-card{background:var(--surface-50,#fff);border:1px solid var(--surface-100,#e9eef7);border-radius:16px;padding:1rem 1.25rem;box-shadow:0 8px 28px rgba(12,34,67,.06)}
.svc-card header{display:flex;align-items:center;gap:.5rem;margin-bottom:.35rem}
.svc-card h2{margin:0;font-size:1.06rem}
.svc-ico{width:20px;height:20px;color:#0E56D0}
.svc-model{margin-top:1.25rem}
.svc-list{margin:.5rem 0 .75rem;padding-left:1.1rem}
.svc-list li{margin:.35rem 0}
.svc-ctas{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:.25rem}

/* bottom-gap-final */
.page-content > :last-child,
.content-section > :last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* -------------------------------------------------------------------
 * Global bottom spacing fix (Services)
 *
 * Harmonises spacing below content across the Services page. By
 * limiting bottom padding on the page and constraining the final
 * element’s margin, the footer appears closer to the end of the
 * content while retaining a comfortable breathing room. CTA wrappers
 * are also given a consistent bottom margin.
 * ------------------------------------------------------------------- */
main {
  padding-bottom: 32px !important;
}
footer {
  margin-top: 32px !important;
}
main > section:last-of-type,
main > div:last-of-type,
main > form:last-of-type,
.page-content > *:last-child,
.content-section > *:last-child,
.services-content > *:last-child,
.contact-form > *:last-child,
.identity-section:last-of-type,
.svc-model:last-of-type {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
.identity-cta,
.svc-ctas,
.wrap.align,
.contact-actions,
.services-cta,
.cta-row,
.actions {
  margin-bottom: 24px !important;
}
