/* Shared primitives for concepts 04–05. Each concept keeps its own layout language. */
.cx-logo { display:block; width:166px; flex:none; }
.cx-logo img { width:100%; }
.cx-action { display:inline-flex; align-items:center; justify-content:center; gap:18px; min-height:50px; padding:0 24px; background:var(--violet); color:#fff; font-weight:700; border-radius:2px; }
.cx-action svg, .nx-text-link svg, .mf-page button svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.cx-kicker { font:600 12px/1.4 "IBM Plex Mono",monospace; letter-spacing:.08em; }
.cx-footer { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; padding:56px max(5vw,32px); border-top:1px solid #dfe2e8; font-size:12px; }
.cx-footer>div { display:flex; align-items:center; gap:24px; }
.cx-footer button { background:none; }

/* 04 — VOSINTA connected ecosystem */
.nx-page { --nx-highlight:#59c7e5; --nx-secondary:#5f58c8; color:#fff; background:#10163e; }
.nx-header { height:86px; padding:0 max(5.5vw,32px); display:flex; align-items:center; gap:55px; border-bottom:1px solid #ffffff1c; }
.nx-header nav { margin-left:auto; display:flex; gap:34px; font-size:13px; }
.nx-header .cx-action { min-height:43px; }
.nx-page .is-accent { background:var(--nx-highlight); color:#111833; border-radius:999px; }
.nx-hero { min-height:720px; display:grid; grid-template-columns:1.05fr .95fr; grid-template-rows:1fr auto; padding:80px max(5.5vw,32px) 0; position:relative; overflow:hidden; }
.nx-copy { padding:55px 0 80px; position:relative; z-index:1; }
.nx-copy .cx-kicker { color:var(--nx-highlight); }
.nx-copy h1 { margin:25px 0 30px; font-size:74px; line-height:.98; max-width:760px; }
.nx-copy h1 em { color:var(--nx-secondary); font-style:normal; }
.nx-lead { max-width:560px; font-size:19px; line-height:1.65; color:#c9cde5; }
.nx-actions { display:flex; align-items:center; gap:28px; margin-top:38px; }
.nx-text-link { display:flex; align-items:center; gap:10px; background:none; color:#fff; font-weight:700; }
.nx-stage { min-height:560px; position:relative; display:flex; align-items:center; justify-content:center; }
.nx-halo { position:absolute; width:540px; height:540px; border-radius:50%; background:radial-gradient(circle at 40% 40%,#626bd8,#303787 62%,transparent 63%); }
.nx-device { position:relative; z-index:1; width:620px; max-width:110%; filter:drop-shadow(0 35px 35px #06092266); }
.nx-float { position:absolute; z-index:2; min-width:170px; padding:17px 20px; border:1px solid #ffffff40; border-radius:14px; background:#20275fd9; backdrop-filter:blur(12px); box-shadow:0 18px 35px #07091e55; }
.nx-float b { display:block; color:var(--nx-highlight); font-size:20px; }
.nx-float span { display:block; margin-top:4px; font-size:12px; color:#cfd3ea; }
.nx-float-a { top:92px; right:3%; }.nx-float-b { bottom:110px; left:-1%; }
.nx-proof { grid-column:1/-1; display:grid; grid-template-columns:auto 1fr auto 1fr auto 1fr; align-items:center; gap:16px; min-height:106px; border-top:1px solid #ffffff1c; }
.nx-proof b { font-size:25px; color:var(--nx-highlight); }.nx-proof span { max-width:160px; color:#abb1d0; font-size:11px; line-height:1.45; }
.nx-flow { background:#f4f5fb; color:#11162f; padding:120px max(5.5vw,32px); display:grid; grid-template-columns:.8fr 1.2fr; gap:8vw; }
.nx-flow-head .cx-kicker { color:var(--violet); }.nx-flow h2 { margin-top:20px; font-size:56px; }
.nx-flow ol { list-style:none; margin:0; padding:0; counter-reset:x; }
.nx-flow li { display:grid; grid-template-columns:70px 1fr; gap:25px; padding:28px 0; border-top:1px solid #cfd3df; }
.nx-flow li:last-child { border-bottom:1px solid #cfd3df; }.nx-flow li>span { font:600 13px "IBM Plex Mono",monospace; color:var(--violet); }
.nx-flow li b { font-size:24px; }.nx-flow li p { margin-top:8px; color:#60677b; }
.nx-system { padding:110px max(5.5vw,32px); display:grid; grid-template-columns:.85fr 1.15fr; gap:10vw; align-items:center; }
.nx-system-copy .cx-kicker { color:var(--nx-highlight); }.nx-system-copy h2 { font-size:55px; margin:20px 0; }.nx-system-copy>p:not(.cx-kicker) { max-width:510px; color:#bfc4de; line-height:1.7; }.nx-system-copy .cx-action { margin-top:30px; }
.nx-dashboard { background:#fff; color:#131830; border-radius:20px; padding:30px; box-shadow:0 35px 80px #06092288; }
.nx-dash-top { display:flex; justify-content:space-between; border-bottom:1px solid #e4e7ef; padding-bottom:18px; }.nx-dash-top b { color:#14956d; font-size:12px; }
.nx-bars { height:190px; display:flex; align-items:flex-end; gap:13px; padding:25px 0; border-bottom:1px solid #e4e7ef; background:repeating-linear-gradient(#fff,#fff 44px,#eceef4 45px); }.nx-bars i { flex:1; height:var(--h); background:linear-gradient(var(--blue),var(--violet)); border-radius:4px 4px 0 0; }
.nx-dash-row { display:flex; justify-content:space-between; padding:17px 0; border-bottom:1px solid #eceef3; }.nx-dash-row span { color:#70768a; }.nx-dash-row i { display:inline-block; width:7px; height:7px; background:#24b98b; border-radius:50%; margin-right:7px; }
.nx-hardware { background:#fff; color:#11162f; display:grid; grid-template-columns:.75fr 1fr 1fr; padding:110px max(5.5vw,32px); gap:24px; }.nx-hardware>div { padding:25px 25px 0 0; }.nx-hardware h2 { margin-top:18px; font-size:49px; }
.nx-hardware article { border:1px solid #e1e3eb; border-radius:12px; overflow:hidden; }.nx-hardware article>img { width:100%; aspect-ratio:4/3; object-fit:cover; }.nx-hardware article>div { padding:24px; }.nx-hardware article span { font:600 11px "IBM Plex Mono"; color:var(--violet); }.nx-hardware article h3 { font-size:32px; margin:10px 0 5px; }.nx-hardware article p { color:#747a8c; }.nx-hardware .cx-action { padding:0; min-height:30px; margin-top:20px; background:none; color:var(--violet); }
.nx-close { padding:90px 5.5vw; background:var(--nx-highlight); color:#10152e; display:flex; justify-content:space-between; align-items:center; }.nx-close h2 { font-size:54px; }.nx-close .cx-action { background:#10152e; color:#fff; }
.nx-footer { background:#10163e; border-color:#ffffff1a; color:#b9bfdc; }.nx-footer button { color:#fff; }

/* 05 — manufacturer profile, company decisions before hardware */
.mf-page { --mf-orange:#ff5b38; --mf-paper:#e9e7df; background:#111; color:#fff; }
.mf-header { height:84px; display:flex; align-items:center; padding:0 4.5vw; gap:30px; border-bottom:1px solid #ffffff2b; }.mf-header>span { color:#8d8d8d; font:9px "IBM Plex Mono"; }.mf-header nav { display:flex; gap:28px; margin-left:auto; font-size:12px; }.mf-header>button { padding:12px 18px; background:var(--mf-orange); color:#fff; }
.mf-hero { min-height:760px; display:grid; grid-template-columns:1.35fr .65fr; grid-template-rows:1fr 210px; padding:70px 4.5vw 0; position:relative; overflow:hidden; }.mf-title>span { color:var(--mf-orange); font:10px "IBM Plex Mono"; }.mf-title h1 { margin-top:45px; font-size:102px; line-height:.88; text-transform:uppercase; }.mf-title h1 i { color:var(--mf-orange); font-style:normal; }.mf-manifest { align-self:start; padding:45px 0 0 55px; border-left:1px solid #424242; }.mf-manifest p { max-width:390px; color:#adadaf; font-size:18px; line-height:1.65; }.mf-manifest p+p { margin-top:25px; }.mf-scale { grid-column:1; display:flex; align-items:end; gap:25px; padding:35px 0; border-top:1px solid #424242; }.mf-scale small { color:#858589; font:10px "IBM Plex Mono"; align-self:center; }.mf-scale strong { font-size:72px; line-height:.85; }.mf-scale span { color:#929295; max-width:140px; }.mf-stamp { grid-column:2; grid-row:2; display:flex; align-items:center; justify-content:center; background:var(--mf-orange); color:#111; font:800 23px/1.05 "IBM Plex Mono"; transform:rotate(-3deg); }
.mf-profile { padding:120px 5vw; background:var(--mf-paper); color:#141414; display:grid; grid-template-columns:.35fr 1fr .8fr; gap:6vw; }.mf-profile>aside { color:#77746e; font:10px "IBM Plex Mono"; }.mf-profile h2 { font-size:55px; }.mf-profile>div>p { margin-top:30px; color:#5d5c58; font-size:17px; line-height:1.7; }.mf-profile dl { margin:0; border-top:2px solid #111; }.mf-profile dl>div { padding:18px 0; border-bottom:1px solid #a9a69e; }.mf-profile dt { color:#74716b; font-size:10px; }.mf-profile dd { margin:7px 0 0; font-weight:700; }
.mf-method { padding:120px 5vw; }.mf-method-head { display:grid; grid-template-columns:.6fr 1.4fr; align-items:start; padding-bottom:70px; }.mf-method-head span { color:var(--mf-orange); font:10px "IBM Plex Mono"; }.mf-method-head h2 { font-size:60px; }.mf-method ol { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid #444; }.mf-method li { min-height:320px; padding:28px; border-right:1px solid #444; }.mf-method li:first-child { border-left:1px solid #444; }.mf-method li>b { color:var(--mf-orange); font:11px "IBM Plex Mono"; }.mf-method li>div { margin-top:80px; }.mf-method h3 { font-size:25px; }.mf-method li p { margin-top:15px; color:#99999e; line-height:1.65; }
.mf-ledger { padding:110px 5vw; background:var(--mf-orange); color:#111; display:grid; grid-template-columns:.8fr 1.2fr; gap:8vw; }.mf-ledger-title span { font:700 10px "IBM Plex Mono"; }.mf-ledger-title h2 { margin-top:22px; font-size:56px; }.mf-ledger-grid { display:grid; grid-template-columns:repeat(2,1fr); border-top:2px solid #111; }.mf-ledger-grid>div { padding:22px 0; border-bottom:1px solid #1118; }.mf-ledger-grid>div:nth-child(odd) { border-right:1px solid #1118; }.mf-ledger-grid>div:nth-child(even) { padding-left:25px; }.mf-ledger-grid small,.mf-ledger-grid b { display:block; }.mf-ledger-grid small { font:9px "IBM Plex Mono"; }.mf-ledger-grid b { margin-top:12px; font-size:27px; }
.mf-output { min-height:700px; display:grid; grid-template-columns:1.2fr .8fr; background:#fff; color:#111; }.mf-output-photo { display:flex; align-items:center; background:#f3f2ef; }.mf-output-photo img { width:100%; }.mf-output-copy { padding:110px 7vw; }.mf-output-copy>span { color:var(--mf-orange); font:700 10px "IBM Plex Mono"; }.mf-output-copy h2 { margin:25px 0; font-size:57px; }.mf-output-copy>p { color:#65645f; line-height:1.7; }.mf-output-copy>div { margin-top:40px; border-top:1px solid #bbb; }.mf-output-copy button { width:100%; display:flex; justify-content:space-between; padding:18px 0; border-bottom:1px solid #bbb; background:none; font-weight:700; }.mf-output-copy svg { width:18px; fill:none; stroke:currentColor; }
.mf-principles { display:grid; grid-template-columns:repeat(3,1fr); padding:0 5vw; background:var(--mf-paper); color:#111; }.mf-principles>div { padding:60px 35px; border-right:1px solid #aaa79f; }.mf-principles>div:first-child { border-left:1px solid #aaa79f; }.mf-principles span { color:var(--mf-orange); font:700 10px "IBM Plex Mono"; }.mf-principles h3 { margin:35px 0 12px; }.mf-principles p { color:#65645f; }.mf-close { padding:110px 5vw; }.mf-close p { color:var(--mf-orange); font:10px "IBM Plex Mono"; }.mf-close h2 { margin:25px 0 40px; font-size:66px; }.mf-action { background:var(--mf-orange); border-radius:0; }.mf-footer { background:#111; color:#888; border-color:#ffffff29; }.mf-footer button { color:#fff; }

/* The review palette switch stays useful without erasing each reference's character. */
:root[data-palette="cobalt"] .nx-page { --nx-highlight:#55c4e8; --nx-secondary:#356fdb; }
:root[data-palette="lagoon"] .nx-page { --nx-highlight:#5ed8d0; --nx-secondary:#007c83; }
:root[data-palette="coral"] .nx-page { --nx-highlight:#f1a36f; --nx-secondary:#c64d4a; }
:root[data-palette="lime"] .nx-page { --nx-highlight:#b7d957; --nx-secondary:#557219; }
:root[data-palette="cobalt"] .mf-page { --mf-orange:#3980f6; }
:root[data-palette="lagoon"] .mf-page { --mf-orange:#00a2a9; }
:root[data-palette="coral"] .mf-page { --mf-orange:#e05f4d; }
:root[data-palette="lime"] .mf-page { --mf-orange:#8dad35; }

@media (max-width: 1000px) {
  .nx-copy h1 { font-size:62px; }
  .nx-header nav,.mf-header nav { display:none; }
  .nx-header .cx-action { margin-left:auto; }
  .nx-hero { grid-template-columns:1fr 1fr; }
  .nx-hardware { grid-template-columns:1fr 1fr; }.nx-hardware>div { grid-column:1/-1; }
  .mf-title h1 { font-size:76px; }.mf-profile { grid-template-columns:.35fr 1fr; }.mf-profile dl { grid-column:2; }.mf-method ol { grid-template-columns:1fr 1fr; }
}

@media (max-width: 700px) {
  .cx-logo { width:142px; }.cx-footer { padding:42px 20px 82px; display:block; }.cx-footer>div { justify-content:space-between; }.cx-footer>div+div { margin-top:25px; }.cx-footer>div span { display:none; }
  .nx-header,.mf-header { height:68px; padding:0 20px; }.nx-header .cx-action { padding:0 15px; min-height:38px; }.mf-header>span { display:none; }
  .nx-hero { display:block; padding:55px 20px 0; }.nx-copy { padding:0; }.nx-copy h1 { font-size:46px; margin:20px 0; }.nx-lead { font-size:16px; }.nx-actions { display:block; }.nx-text-link { margin-top:22px; }.nx-stage { min-height:390px; }.nx-halo { width:360px; height:360px; }.nx-device { width:430px; }.nx-float { min-width:135px; padding:12px; }.nx-float-a { top:40px; right:0; }.nx-float-b { bottom:45px; left:0; }.nx-proof { grid-template-columns:auto 1fr; padding:24px 0; }.nx-flow,.nx-system { display:block; padding:75px 20px; }.nx-flow h2,.nx-system-copy h2 { font-size:39px; }.nx-flow ol { margin-top:50px; }.nx-dashboard { margin-top:50px; padding:20px; }.nx-hardware { display:block; padding:75px 20px; }.nx-hardware>div { padding:0 0 35px; }.nx-hardware h2 { font-size:39px; }.nx-hardware article+article { margin-top:18px; }.nx-close { display:block; padding:65px 20px; }.nx-close h2 { font-size:42px; margin-bottom:30px; }
  .mf-header>button { margin-left:auto; padding:10px 12px; }.mf-hero { display:block; min-height:760px; padding:60px 20px 0; }.mf-title h1 { font-size:55px; }.mf-manifest { margin-top:50px; padding:25px 0 0; border-left:0; border-top:1px solid #424242; }.mf-manifest p { font-size:16px; }.mf-scale { margin-top:60px; display:grid; grid-template-columns:1fr 1fr; }.mf-scale strong { font-size:52px; }.mf-stamp { width:170px; height:130px; margin:25px 0 0 auto; font-size:18px; }.mf-profile { display:block; padding:75px 20px; }.mf-profile h2 { font-size:42px; margin-top:30px; }.mf-profile dl { margin-top:45px; }.mf-method { padding:75px 20px; }.mf-method-head { display:block; padding-bottom:45px; }.mf-method-head h2 { font-size:44px; margin-top:25px; }.mf-method ol { display:block; }.mf-method li { min-height:0; padding:30px 0; border-right:0; border-bottom:1px solid #444; }.mf-method li:first-child { border-left:0; }.mf-method li>div { margin-top:30px; }.mf-ledger { display:block; padding:75px 20px; }.mf-ledger-title h2 { font-size:43px; }.mf-ledger-grid { margin-top:45px; }.mf-output { display:block; min-height:0; }.mf-output-copy { padding:70px 20px; }.mf-output-copy h2 { font-size:44px; }.mf-principles { display:block; padding:0 20px; }.mf-principles>div,.mf-principles>div:first-child { padding:45px 0; border-left:0; border-right:0; border-bottom:1px solid #aaa79f; }.mf-close { padding:75px 20px; }.mf-close h2 { font-size:46px; }
}