@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#020501;--panel:#081006;--line:rgba(157,255,39,.38);--text:#eaffd9;--muted:#a4c984;--acid:#9dff27;--blue:#43b8ff;--gold:#ffc729}*{box-sizing:border-box}body{margin:0;background-color:var(--bg);background-image:linear-gradient(rgba(157,255,39,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(157,255,39,.05) 1px,transparent 1px),radial-gradient(circle at 56% 35%,rgba(91,169,20,.16),transparent 26%);background-size:25px 25px,25px 25px,auto;color:var(--text);font-family:'Space Grotesk',Arial,sans-serif}.relation-header{min-height:70px;border-bottom:1px solid var(--line);padding:0 clamp(18px,4vw,58px);display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(2,5,1,.88)}.relation-brand{color:var(--acid);font-family:'DM Mono',monospace;letter-spacing:.12em;font-size:14px;text-decoration:none}.relation-brand span{color:var(--muted)}.relation-header nav{display:flex;gap:20px}.relation-header nav a{color:var(--muted);font-size:13px;text-decoration:none}.relation-header nav a:hover{color:var(--acid)}.relation-page{max-width:1450px;margin:auto;padding:clamp(30px,5vw,72px) clamp(18px,4vw,58px) 70px}.relation-hero{max-width:720px;margin-bottom:46px}.eyebrow{font-family:'DM Mono',monospace;color:var(--acid);font-size:11px;letter-spacing:.13em;margin:0 0 14px}.relation-hero h1{font-size:clamp(42px,7vw,86px);line-height:.94;letter-spacing:-.06em;margin:0}.relation-hero h1 em{color:var(--acid);font-style:normal}.relation-hero>p:last-child{max-width:600px;color:var(--muted);font-size:17px;line-height:1.5;margin:22px 0 0}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:0 0 14px}.section-heading h2{margin:0;font-size:16px;text-transform:uppercase;letter-spacing:.1em}.section-heading span{font:10px 'DM Mono',monospace;color:var(--acid);border:1px solid var(--line);padding:5px 8px}.map-key{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:14px;color:var(--muted);font:11px 'DM Mono',monospace}.map-key i{display:inline-block;width:8px;height:8px;margin-right:6px;background:var(--acid)}.map-key .key-audience{background:var(--blue)}.map-key .key-commerce{background:var(--gold)}.ecosystem-map{display:grid;grid-template-columns:1fr 1.05fr 1fr;grid-template-areas:'tech core web3' 'media core commerce' 'growth creative commerce' 'finance creative commerce';gap:14px;position:relative}.cluster,.core-node{border:1px solid var(--line);background:linear-gradient(135deg,rgba(13,26,8,.95),rgba(3,8,2,.98));padding:18px;position:relative;overflow:hidden}.cluster:before,.core-node:before{content:'';position:absolute;inset:5px;border:1px solid rgba(157,255,39,.1);pointer-events:none}.cluster-label{color:var(--muted);font:11px 'DM Mono',monospace;letter-spacing:.06em;margin-bottom:14px;position:relative}.nodes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;position:relative}.nodes a{min-height:69px;padding:11px;color:var(--text);border:1px solid rgba(157,255,39,.23);background:rgba(157,255,39,.045);text-decoration:none;font-size:14px;font-weight:600;transition:.18s ease}.nodes a:hover{border-color:var(--acid);transform:translateY(-2px);color:var(--acid)}.nodes small{display:block;color:var(--muted);font:10px 'DM Mono',monospace;margin-top:6px;line-height:1.2}.cluster--tech{grid-area:tech}.cluster--web3{grid-area:web3}.cluster--media{grid-area:media}.cluster--commerce{grid-area:commerce}.cluster--creative{grid-area:creative}.cluster--growth{grid-area:growth}.cluster--finance{grid-area:finance}.core-node{grid-area:core;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:350px;border-color:rgba(157,255,39,.72);box-shadow:0 0 45px rgba(157,255,39,.1)}.core-node span{color:var(--muted);font:11px 'DM Mono',monospace;text-transform:uppercase;letter-spacing:.12em;position:relative}.core-node strong{color:var(--acid);font-size:clamp(38px,5vw,62px);letter-spacing:-.05em;position:relative;margin-top:10px}.core-node p{color:var(--text);max-width:260px;line-height:1.45;margin:12px 0 20px;position:relative}.core-node a{position:relative;border:1px solid var(--line);padding:9px 12px;text-decoration:none;color:var(--acid);font:11px 'DM Mono',monospace}.flows{margin-top:48px}.flow-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.flow-grid article{border-top:2px solid var(--acid);padding:16px 3px 8px}.flow-grid b{font:11px 'DM Mono',monospace;color:var(--acid)}.flow-grid h3{margin:9px 0 8px;font-size:20px}.flow-grid p{margin:0;color:var(--muted);font-size:13px;line-height:1.45}@media(max-width:1050px){.ecosystem-map{grid-template-columns:1fr 1fr;grid-template-areas:'core core' 'tech web3' 'media commerce' 'growth finance' 'creative creative'}.core-node{min-height:235px}.flow-grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:650px){.relation-header{min-height:60px}.relation-brand{font-size:11px}.relation-header nav{gap:11px}.relation-header nav a{font-size:11px}.relation-page{padding-top:36px}.relation-hero>p:last-child{font-size:15px}.ecosystem-map{grid-template-columns:1fr;grid-template-areas:'core' 'tech' 'web3' 'media' 'commerce' 'finance' 'growth' 'creative'}.nodes{grid-template-columns:1fr 1fr}.core-node{min-height:210px}.flow-grid{grid-template-columns:1fr 1fr}.flow-grid article:last-child{grid-column:1/-1}}@media(max-width:390px){.nodes{grid-template-columns:1fr}.flow-grid{grid-template-columns:1fr}}
/* Mobile layout: use the complete viewport width and keep cards readable. */
@media (max-width: 650px) {
  html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
  .relation-header { width: 100%; padding: 12px 14px; min-height: auto; flex-wrap: wrap; align-items: center; }
  .relation-header nav { margin-left: auto; gap: 14px; }
  .relation-page { width: 100%; max-width: none; min-width: 0; margin: 0; padding: 28px 14px 50px; }
  .relation-hero { margin-bottom: 30px; }
  .relation-hero h1 { font-size: clamp(36px, 12vw, 52px); }
  .section-heading { align-items: flex-start; }
  .section-heading h2 { font-size: 13px; line-height: 1.35; }
  .ecosystem-map, .map-section { width: 100%; min-width: 0; }
  .ecosystem-map { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .cluster, .core-node { width: 100%; min-width: 0; padding: 16px; }
  .core-node { min-height: 230px; }
  .core-node strong { max-width: 100%; font-size: clamp(36px, 13vw, 52px); overflow-wrap: anywhere; }
  .core-node p { max-width: 280px; }
  .nodes { grid-template-columns: minmax(0, 1fr); gap: 9px; }
  .nodes a { min-height: 64px; font-size: 15px; }
  .flows { margin-top: 34px; }
  .flow-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .flow-grid article:last-child { grid-column: auto; }
}

/* Balanced desktop composition for the ecosystem map. */
@media (min-width: 1051px) {
  .ecosystem-map {
    grid-template-areas:
      'tech core web3'
      'media core commerce'
      'finance growth creative';
    align-items: start;
  }
  .cluster { align-self: start; }
  .core-node { min-height: 330px; }
  .cluster--finance .nodes { grid-template-columns: minmax(0, 1fr); }
}

/* Keep the map visible near the top of the page. */
.relation-hero { max-width: none; margin-bottom: 22px; }
.relation-hero h1 { font-size: clamp(34px, 4.6vw, 58px); line-height: .98; }
.relation-hero h1 br { display: none; }
.relation-hero > p:last-child { display: none; }
.eyebrow { margin-bottom: 8px; }
@media (max-width: 650px) {
  .relation-page { padding-top: 22px; }
  .relation-hero { margin-bottom: 18px; }
  .relation-hero h1 { font-size: clamp(32px, 10.5vw, 46px); }
  .map-key { display: none; }
}

/* Minimal top identity. */
.relation-hero .eyebrow { display: none; }
.relation-page { padding-top: 16px; }
.relation-hero h1 { margin-top: 0; }
@media (max-width: 650px) { .relation-page { padding-top: 14px; } }

/* Public positioning and clear calls to action. */
.relation-hero .eyebrow{display:block}.relation-hero .hero-copy{display:block;max-width:720px}.hero-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.hero-actions a{border:1px solid var(--line);padding:10px 12px;color:var(--acid);font:11px "DM Mono",monospace;text-decoration:none}.hero-actions a:hover{background:rgba(157,255,39,.1)}
@media(max-width:650px){.relation-header nav{gap:10px}.hero-actions{margin-top:18px}.hero-actions a{font-size:10px;padding:9px 10px}}

/* Blue badge: website redesign completed. */
.nodes a.is-redesigned{position:relative;padding-right:34px}.nodes a.is-redesigned::after{content:"\2713";position:absolute;right:8px;bottom:8px;width:18px;height:18px;display:grid;place-items:center;border-radius:50%;background:#2498ff;color:#fff;font:700 12px/1 Arial,sans-serif;box-shadow:0 0 0 2px rgba(2,5,1,.72)}
.core-node.is-redesigned::after{content:"\2713";position:absolute;right:14px;bottom:14px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#2498ff;color:#fff;font:700 14px/1 Arial,sans-serif;box-shadow:0 0 0 2px rgba(2,5,1,.72)}
