/* Original 1.0.0 network foreground, isolated from the other concepts. */

.boc[data-boc=network]{--boc-ink:#103b47;--boc-accent:#60ac33;--boc-foam:#c5e6d8;--boc-gutter:clamp(24px,6vw,104px);position:relative;isolation:isolate;background:#e8eddf;color:var(--boc-ink);font:16px/1.65 BOCManrope,Arial,sans-serif;width:100%;text-align:left}
.boc[data-boc=network] *{box-sizing:border-box}.boc[data-boc=network] [hidden]{display:none!important}.boc[data-boc=network] h1,.boc[data-boc=network] h2,.boc[data-boc=network] p{margin:0;color:inherit;font-family:inherit}.boc[data-boc=network] h1,.boc[data-boc=network] h2{font-weight:500;text-transform:none}.boc[data-boc=network] a{color:inherit;text-decoration:none}.boc[data-boc=network] button{font:inherit;color:inherit;text-transform:none;letter-spacing:normal;box-shadow:none;cursor:pointer}.boc[data-boc=network] a:focus-visible,.boc[data-boc=network] button:focus-visible{outline:3px solid var(--boc-accent);outline-offset:6px}.boc[data-boc=network] button,.boc[data-boc=network] a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.boc[data-boc=network] .boc-journey{position:relative;height:calc(var(--boc-vh,100svh)*2.8)}
.boc[data-boc=network] .boc-stage{position:sticky;top:0;height:var(--boc-vh,100svh);min-height:500px;overflow:hidden;background:#a5c5bd}
.boc[data-boc=network].boc-ready:not(.boc-native) .boc-stage{position:absolute;inset:0 0 auto}
.boc[data-boc=network] .boc-canvas,.boc[data-boc=network] .boc-shade,.boc[data-boc=network] .boc-underlay{position:absolute;inset:0;pointer-events:none}
.boc[data-boc=network] .boc-canvas{background:radial-gradient(ellipse at 75% 32%,#c7daca,transparent 55%),linear-gradient(#dae3d8 35%,#558b8c 36%,#236171 100%)}
.boc[data-boc=network] .boc-canvas canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity .8s ease}.boc[data-boc=network].boc-loaded .boc-canvas canvas{opacity:1}.boc[data-boc=network] .boc-canvas.boc-fallback canvas{opacity:0}
.boc[data-boc=network] .boc-shade{background:linear-gradient(90deg,rgba(235,240,226,.98),rgba(235,240,226,.93) 23%,rgba(235,240,226,.55) 40%,transparent 64%),linear-gradient(0deg,rgba(230,238,224,.52),transparent 20%)}
.boc[data-boc=network] .boc-underlay{opacity:0;background:radial-gradient(ellipse at 65% -25%,rgba(102,168,171,.22),transparent 65%),linear-gradient(0deg,rgba(4,31,43,.75),rgba(5,35,45,.15) 90%)}
.boc[data-boc=network] .boc-intro{position:absolute;z-index:2;inset:0;display:flex;flex-direction:column;justify-content:center;padding:32px var(--boc-gutter) 100px;pointer-events:none;will-change:opacity,transform}
.boc[data-boc=network] .boc-intro>*{max-width:530px;pointer-events:auto}.boc[data-boc=network] .boc-eyebrow{font-size:11px;letter-spacing:.19em;text-transform:uppercase;font-weight:700;display:flex;align-items:center;gap:12px;margin-bottom:25px}.boc[data-boc=network] .boc-eyebrow:before{content:'';height:2px;width:26px;background:var(--boc-accent)}
.boc[data-boc=network] .boc-intro h1{font-size:clamp(48px,5.8vw,98px);line-height:1.025;letter-spacing:-.067em;margin-bottom:28px;max-width:670px}.boc[data-boc=network] .boc-intro h1 em{color:#4a8578;font-style:normal;font-weight:400}
.boc[data-boc=network] .boc-copy{font-size:clamp(15px,1.1vw,18px);line-height:1.75;max-width:365px;color:#395d64}.boc[data-boc=network] .boc-actions{display:flex;gap:23px;align-items:center;margin-top:30px;flex-wrap:wrap}
.boc[data-boc=network] .boc-primary{display:inline-flex;align-items:center;justify-content:space-between;gap:24px;min-height:51px;padding:13px 20px;background:#123f48;border:1px solid #123f48;border-radius:3px;color:#f0f6eb;font-size:13px;font-weight:650;transition:background .2s,transform .2s}
.boc[data-boc=network] .boc-primary:hover{background:#246355;transform:translateY(-2px)}.boc[data-boc=network] .boc-primary svg,.boc[data-boc=network] .boc-secondary svg{width:16px;height:16px;flex:none}.boc[data-boc=network] .boc-secondary{display:inline-flex;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid currentColor;font-size:13px;font-weight:600;transition:color .2s}.boc[data-boc=network] .boc-secondary:hover{color:#44835c}
.boc[data-boc=network] .boc-notes{font-size:12px;margin-top:23px;color:#42696c;min-height:21px}.boc[data-boc=network] .boc-notes p{max-width:365px}
.boc[data-boc=network] .boc-islands{position:absolute;inset:0;z-index:3;pointer-events:none}.boc[data-boc=network] .boc-marker{position:absolute;left:0;top:0;white-space:nowrap;pointer-events:auto;border:0;border-bottom:1px solid rgba(19,66,70,.42);padding:9px 5px;color:#163d42;background:rgba(234,242,223,.87);border-radius:2px;font-size:11px;line-height:1.4;transition:background .2s;will-change:transform}.boc[data-boc=network] .boc-marker small{font:inherit;opacity:.6;margin-right:9px}.boc[data-boc=network] .boc-marker:after{content:'↗';margin-left:12px}.boc[data-boc=network] .boc-marker[aria-pressed=true],.boc[data-boc=network] .boc-marker:hover{background:#f5f7e8;border-color:#60ac33}
.boc[data-boc=network] .boc-choices{display:none}.boc[data-boc=network] .boc-bottom{position:absolute;z-index:4;bottom:27px;left:var(--boc-gutter);right:var(--boc-gutter);display:flex;align-items:center;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:.06em}.boc[data-boc=network] .boc-place{display:flex;align-items:center;gap:13px;text-transform:uppercase}.boc[data-boc=network] .boc-place:before{content:'+';font-size:25px;font-weight:300}.boc[data-boc=network] .boc-place small{display:block;font-size:9px;opacity:.72;margin-top:2px}.boc[data-boc=network] .boc-bottom button{display:inline-flex;align-items:center;gap:10px;font-size:11px;background:transparent;border:0;border-radius:0;padding:10px 0;min-height:40px}.boc[data-boc=network] .boc-bottom svg{width:15px;height:15px}.boc[data-boc=network] .boc-skip{position:absolute;left:50%;transform:translateX(-50%)}.boc[data-boc=network] .boc-skip:before{content:'';height:24px;width:1px;background:currentColor;opacity:.5}.boc[data-boc=network] .boc-progress{position:absolute;bottom:0;left:0;right:0;height:2px;z-index:5;background:rgba(130,171,159,.2)}.boc[data-boc=network] .boc-progress i{display:block;height:100%;background:#6bac7b;transform:scaleX(0);transform-origin:left}
.boc[data-boc=network] .boc-deep{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:30px var(--boc-gutter) 100px;opacity:0;color:#edf4e9;pointer-events:none}.boc[data-boc=network] .boc-deep:not([inert]){pointer-events:auto}.boc[data-boc=network] .boc-deep h2{font-size:clamp(43px,5.2vw,86px);line-height:1.06;letter-spacing:-.055em;max-width:790px;margin:0 0 27px}.boc[data-boc=network] .boc-deep h2 em{font-style:normal;color:#b7d7bf}.boc[data-boc=network] .boc-deep p:not(.boc-eyebrow){font-size:16px;color:#bdd4d0;max-width:490px}.boc[data-boc=network] .boc-deep .boc-secondary{margin-top:30px}.boc[data-boc=network].boc-submerged .boc-bottom{color:#c7dcd6}.boc[data-boc=network] .boc-exit{height:0;outline:none}
/* 02: full-width cinematic composition and a warm distant horizon. */
.boc[data-boc=network][data-boc=horizon]{color:#f0f4e9}.boc[data-boc=network][data-boc=horizon] .boc-shade{background:linear-gradient(0deg,rgba(4,28,37,.78),rgba(6,33,43,.32) 43%,rgba(23,45,53,.15) 100%)}
.boc[data-boc=network][data-boc=horizon] .boc-intro{justify-content:flex-end;padding-bottom:138px}.boc[data-boc=network][data-boc=horizon] .boc-intro h1{font-size:clamp(56px,6.5vw,108px);max-width:900px}.boc[data-boc=network][data-boc=horizon] .boc-intro h1 em{color:#e0dbb9}.boc[data-boc=network][data-boc=horizon] .boc-copy{color:#d3e2dd;max-width:425px}.boc[data-boc=network][data-boc=horizon] .boc-primary{background:#e1e7c7;border-color:#e1e7c7;color:#143f45}.boc[data-boc=network][data-boc=horizon] .boc-primary:hover{background:#f0f2df}.boc[data-boc=network][data-boc=horizon] .boc-marker,.boc[data-boc=network][data-boc=horizon] .boc-notes{display:none}
/* 03: four paths form an interactive, quietly illuminated network. */
.boc[data-boc=network][data-boc=network]{color:#e5efe2}.boc[data-boc=network][data-boc=network] .boc-shade{background:linear-gradient(90deg,rgba(7,33,48,.95),rgba(7,33,48,.8) 25%,rgba(7,33,48,.38) 46%,transparent 71%),linear-gradient(0deg,rgba(5,30,45,.6),transparent 30%)}
.boc[data-boc=network][data-boc=network] .boc-intro h1 em{color:#a9cba9}.boc[data-boc=network][data-boc=network] .boc-copy{color:#b7cfca}.boc[data-boc=network][data-boc=network] .boc-notes{color:#b7cfca}.boc[data-boc=network][data-boc=network] .boc-primary{background:#a2c88e;border-color:#a2c88e;color:#163841}.boc[data-boc=network][data-boc=network] .boc-primary:hover{background:#badba9}.boc[data-boc=network][data-boc=network] .boc-marker{background:rgba(13,51,59,.88);color:#d9ecd7;border-color:#90bba0}.boc[data-boc=network][data-boc=network] .boc-marker[aria-pressed=true]{background:#c5ddbc;color:#183e46}.boc[data-boc=network][data-boc=network] .boc-choices{display:flex;gap:15px;margin-top:30px;flex-wrap:wrap}.boc[data-boc=network] .boc-choice{font-size:11px;background:none;border:0;border-bottom:1px solid rgba(190,217,199,.36);padding:7px 0;color:inherit;border-radius:0}.boc[data-boc=network] .boc-choice small{opacity:.5;margin-right:5px}.boc[data-boc=network] .boc-choice[aria-pressed=true]{border-color:#8bc669;color:#c0e7ac}
.boc[data-boc=network].boc-static .boc-journey{height:var(--boc-vh,100svh);min-height:500px}.boc[data-boc=network].boc-static .boc-stage{position:relative!important;top:0!important;transform:none!important}.boc[data-boc=network].boc-static .boc-deep{display:none}.boc[data-boc=network].boc-static .boc-progress{display:none}
.boc[data-boc=network]:not(.boc-ready) .boc-journey{height:100svh}.boc[data-boc=network]:not(.boc-ready) .boc-marker,.boc[data-boc=network]:not(.boc-ready) .boc-bottom button{display:none}
@media(min-width:1800px){.boc[data-boc=network] .boc-intro>*{margin-left:max(0px,calc((100vw - 1800px)/2))}}
@media(max-width:1024px){.boc[data-boc=network] .boc-intro h1{font-size:64px;max-width:470px}.boc[data-boc=network] .boc-copy{max-width:300px}.boc[data-boc=network] .boc-actions{gap:18px}.boc[data-boc=network] .boc-skip span{display:none}}
@media(max-width:760px){
 .boc[data-boc=network]{--boc-gutter:24px}.boc[data-boc=network] .boc-journey{height:calc(var(--boc-vh,100svh)*2.6)}.boc[data-boc=network] .boc-stage{min-height:620px}.boc[data-boc=network] .boc-intro{justify-content:flex-start;padding-top:54px;padding-bottom:160px}.boc[data-boc=network] .boc-eyebrow{font-size:9px;margin-bottom:20px}.boc[data-boc=network] .boc-intro h1,.boc[data-boc=network][data-boc=horizon] .boc-intro h1{font-size:clamp(42px,10.8vw,72px);max-width:100%;margin-bottom:19px}.boc[data-boc=network] .boc-copy{font-size:14px;line-height:1.65;max-width:300px}.boc[data-boc=network] .boc-actions{gap:18px;margin-top:21px}.boc[data-boc=network] .boc-primary{min-height:46px;font-size:12px;padding:10px 14px;gap:16px}.boc[data-boc=network] .boc-secondary{font-size:12px;gap:9px}.boc[data-boc=network] .boc-notes{display:none}.boc[data-boc=network] .boc-marker{display:none!important}.boc[data-boc=network] .boc-bottom{bottom:17px;align-items:flex-end}.boc[data-boc=network] .boc-bottom button{font-size:10px}.boc[data-boc=network] .boc-place{font-size:8px;gap:6px}.boc[data-boc=network] .boc-place small{font-size:8px}.boc[data-boc=network] .boc-skip{bottom:46px}.boc[data-boc=network] .boc-skip span{display:block}.boc[data-boc=network] .boc-shade{background:linear-gradient(180deg,rgba(235,240,226,.98),rgba(235,240,226,.95) 31%,rgba(235,240,226,.5) 48%,transparent 74%,rgba(221,234,215,.55))}.boc[data-boc=network] .boc-deep{padding-bottom:85px}.boc[data-boc=network] .boc-deep h2{font-size:43px}.boc[data-boc=network] .boc-deep p:not(.boc-eyebrow){font-size:14px}
 .boc[data-boc=network][data-boc=horizon] .boc-intro{justify-content:flex-start;padding-top:62px;padding-bottom:120px}.boc[data-boc=network][data-boc=horizon] .boc-shade{background:linear-gradient(180deg,rgba(14,41,51,.5),rgba(9,39,48,.43) 43%,rgba(7,32,42,.12) 75%,rgba(4,28,37,.7))}.boc[data-boc=network][data-boc=network] .boc-shade{background:linear-gradient(180deg,rgba(7,33,48,.96),rgba(7,33,48,.87) 35%,rgba(7,33,48,.4) 56%,transparent 79%,rgba(5,30,45,.75))}.boc[data-boc=network][data-boc=network] .boc-choices{gap:12px;margin-top:19px}.boc[data-boc=network] .boc-choice{font-size:10px}
 .boc[data-boc=network].boc-static .boc-journey{height:auto;min-height:max(620px,var(--boc-vh,100svh))}
}
@media(max-height:620px) and (min-width:761px){.boc[data-boc=network] .boc-intro{padding-top:20px;padding-bottom:70px}.boc[data-boc=network] .boc-intro h1,.boc[data-boc=network][data-boc=horizon] .boc-intro h1{font-size:53px;margin-bottom:15px}.boc[data-boc=network] .boc-eyebrow{margin-bottom:12px}.boc[data-boc=network] .boc-copy{font-size:14px}.boc[data-boc=network] .boc-actions{margin-top:18px}.boc[data-boc=network] .boc-notes,.boc[data-boc=network][data-boc=network] .boc-choices{display:none}.boc[data-boc=network][data-boc=horizon] .boc-intro{padding-bottom:80px}}
@media(max-width:760px){.boc[data-boc=network][data-boc=sculpture] .boc-choices{display:flex;gap:14px;flex-wrap:wrap;margin-top:20px}.boc[data-boc=network][data-boc=sculpture] .boc-choice{border-color:#8da99b}.boc[data-boc=network][data-boc=sculpture] .boc-choice[aria-pressed=true]{color:#24593f;border-color:#397242}}
@media(prefers-reduced-motion:reduce){.boc[data-boc=network] *{transition:none!important;animation:none!important}}

/* Preserve the same foreground order in narrow editor columns and portrait tablets. */
.boc[data-boc=network].boc-compact{--boc-gutter:24px}
.boc[data-boc=network].boc-compact .boc-intro{justify-content:flex-start;padding-top:54px;padding-bottom:160px}
.boc[data-boc=network].boc-compact .boc-intro h1{font-size:clamp(36px,10.8vw,72px);max-width:100%;margin-bottom:19px}
.boc[data-boc=network].boc-compact .boc-copy{max-width:365px}
.boc[data-boc=network].boc-compact .boc-marker{display:none!important}
.boc[data-boc=network].boc-compact .boc-notes{display:none}
.boc[data-boc=network].boc-compact .boc-shade{background:linear-gradient(180deg,rgba(7,33,48,.96),rgba(7,33,48,.87) 35%,rgba(7,33,48,.4) 56%,transparent 79%,rgba(5,30,45,.75))}

/* 1.2.3: keep pinning mode stable. Scroll may translate the contained stage,
   but it must never switch the stage between flow, absolute and fixed. */
.boc[data-boc] .boc-stage{top:var(--boc-top,0px)}
.boc[data-boc].boc-pin-sticky .boc-stage{position:sticky!important;top:var(--boc-top,0px)!important;inset-inline:0!important;transform:none!important;width:auto!important}
.boc[data-boc].boc-pin-fallback .boc-stage{position:absolute!important;inset:0 0 auto 0!important;top:0!important;left:0!important;right:0!important;width:100%!important}
.boc[data-boc].boc-static .boc-stage{position:relative!important;inset:auto!important;top:0!important;left:auto!important;right:auto!important;transform:none!important;width:auto!important}