.security-boundary__wall { position:absolute; inset:20px 75px 70px 20px; border:2px solid rgba(22,136,255,.35); border-radius:28px; background:radial-gradient(circle at 30% 30%,rgba(22,136,255,.17),transparent 50%),var(--panel); box-shadow:var(--shadow); }.security-boundary__wall > span { position:absolute; top:16px; left:20px; color:var(--accent-2); font-size:.56rem; font-weight:850; letter-spacing:.12em; text-transform:uppercase; }.security-boundary__wall i { position:absolute; width:5px; height:5px; border-radius:50%; background:var(--accent-2); box-shadow:0 0 10px var(--accent-2); }.security-boundary__wall i:nth-of-type(1) { top:15px; right:18px; }.security-boundary__wall i:nth-of-type(2) { right:17px; bottom:18px; }.security-boundary__wall i:nth-of-type(3) { bottom:17px; left:18px; }
.security-boundary__inside { position:absolute; z-index:2; inset:85px 135px 125px 65px; display:grid; grid-template-columns:1fr 1fr; gap:10px; }.security-boundary__inside span { display:grid; place-items:center; gap:7px; padding:12px; border:1px solid var(--border); border-radius:13px; background:var(--panel-solid); color:var(--text-soft); font-size:.63rem; font-weight:750; text-align:center; }.security-boundary__inside .icon { color:var(--accent-2); }.security-boundary__outside { position:absolute; z-index:3; right:0; bottom:22px; display:flex; align-items:center; gap:8px; max-width:180px; padding:14px; border:1px solid var(--border-strong); border-radius:13px; background:var(--panel-solid); box-shadow:var(--shadow-soft); color:var(--text-soft); font-size:.64rem; font-weight:750; }.security-boundary__outside .icon { color:var(--success); }

/* Deployment */
.page-hero--deployment { background: radial-gradient(circle at 77% 45%, rgba(22,136,255,.1), transparent 31rem); }
.deployment-hero-visual { position:relative; min-height:500px; }.deployment-boundary { position:absolute; inset:25px 55px 90px 5px; border:2px solid rgba(22,136,255,.32); border-radius:28px; background:radial-gradient(circle at 45% 40%,rgba(22,136,255,.17),transparent 55%),var(--panel); box-shadow:var(--shadow); }.deployment-boundary > span { position:absolute; top:18px; left:22px; color:var(--accent-2); font-size:.54rem; font-weight:850; letter-spacing:.13em; }.deployment-boundary__users,.deployment-boundary__data { position:absolute; z-index:2; display:flex; align-items:center; gap:8px; min-width:135px; padding:12px; border:1px solid var(--border); border-radius:12px; background:var(--panel-solid); box-shadow:var(--shadow-soft); color:var(--text-soft); font-size:.64rem; font-weight:750; }.deployment-boundary__users { top:80px; left:35px; }.deployment-boundary__data { right:35px; bottom:55px; }.deployment-boundary__users .icon,.deployment-boundary__data .icon { color:var(--accent-2); }.deployment-boundary__app { position:absolute; z-index:3; top:50%; left:50%; display:grid; place-items:center; width:168px; height:168px; border:1px solid var(--border-strong); border-radius:50%; background:var(--panel-solid); box-shadow:var(--shadow),var(--glow); transform:translate(-50%,-50%); }.deployment-boundary__app img { width:67px; }.deployment-boundary__app strong { margin-top:-14px; }.deployment-boundary__app small { color:var(--muted); font-size:.54rem; }.deployment-boundary__line { position:absolute; height:1px; background:linear-gradient(90deg,var(--accent),var(--accent-2)); opacity:.7; }.deployment-boundary__line--one { top:127px; left:160px; width:115px; transform:rotate(21deg); }.deployment-boundary__line--two { right:158px; bottom:108px; width:115px; transform:rotate(20deg); }
.deployment-endpoints { position:absolute; z-index:4; right:0; bottom:8px; display:flex; gap:8px; }.deployment-endpoints span { display:grid; place-items:center; gap:5px; min-width:105px; min-height:78px; padding:10px; border:1px solid var(--border); border-radius:12px; background:var(--panel-solid); box-shadow:var(--shadow-soft); color:var(--text-soft); font-size:.56rem; font-weight:750; text-align:center; }.deployment-endpoints .icon { color:var(--success); }.deployment-exchange { position:absolute; z-index:1; right:130px; bottom:82px; width:1px; height:82px; background:linear-gradient(var(--accent-2),var(--success)); }
.section--deployment-principles { padding:0 0 112px; margin-top:-45px; }.principle-grid { position:relative; z-index:5; display:grid; grid-template-columns:repeat(3,1fr); gap:15px; }.principle-grid article { min-height:230px; padding:26px; border:1px solid var(--border); border-radius:19px; background:var(--panel-solid); box-shadow:var(--shadow-soft); }.principle-grid article > span { display:grid; place-items:center; width:44px; height:44px; margin-bottom:37px; border-radius:12px; background:var(--accent-soft); color:var(--accent-2); }.principle-grid h2 { margin-bottom:11px; font-size:1.35rem; }.principle-grid p { margin:0; color:var(--muted); font-size:.8rem; }
.deployment-stack { max-width:900px; margin-inline:auto; }.deployment-stack__layer { position:relative; display:grid; grid-template-columns:42px 48px 1fr; align-items:center; gap:18px; min-height:140px; padding:24px 28px; border:1px solid var(--border); border-radius:18px; background:var(--panel); box-shadow:var(--shadow-soft); }.deployment-stack__layer + .deployment-stack__layer { margin-top:22px; }.deployment-stack__layer > span { color:var(--muted-2); font-family:var(--font-mono); font-size:.66rem; }.deployment-stack__layer > i { display:grid; place-items:center; width:46px; height:46px; border-radius:13px; background:var(--accent-soft); color:var(--accent-2); font-style:normal; }.deployment-stack__layer h3 { margin-bottom:7px; }.deployment-stack__layer p { margin:0; color:var(--muted); font-size:.8rem; }.deployment-stack__layer > b { position:absolute; z-index:2; bottom:-23px; left:67px; width:1px; height:23px; background:linear-gradient(var(--accent),var(--accent-2)); }
.section--security-controls { padding:130px 0; background:rgba(3,11,21,.34); }.security-controls-grid { display:grid; grid-template-columns:.95fr 1.05fr; align-items:center; gap:85px; }.security-controls-copy > p { color:var(--muted); }.security-controls-copy .check-list { margin:25px 0; font-size:.82rem; }
:root[data-theme="light"] .section--security-controls { background:rgba(225,238,248,.58); }
.security-control-panel { overflow:hidden; border:1px solid var(--border-strong); border-radius:21px; background:var(--panel-solid); box-shadow:var(--shadow); }.security-control-panel__header { display:flex; justify-content:space-between; align-items:center; min-height:57px; padding:0 18px; border-bottom:1px solid var(--border); color:var(--muted); font-size:.59rem; }.security-control-panel__header span { display:inline-flex; align-items:center; gap:7px; color:var(--text-soft); font-weight:850; letter-spacing:.08em; }.security-control-panel__header b { color:var(--success); font-size:.55rem; text-transform:uppercase; }.security-control-panel > div:not(.security-control-panel__header) { display:flex; align-items:center; justify-content:space-between; gap:15px; min-height:65px; padding:0 18px; border-bottom:1px solid rgba(130,173,220,.11); }.security-control-panel > div:last-child { border:0; }.security-control-panel > div span { display:inline-flex; align-items:center; gap:9px; font-size:.73rem; font-weight:750; }.security-control-panel > div .icon { color:var(--accent-2); }.security-control-panel em { color:var(--muted); font-size:.63rem; font-style:normal; }
.section--responsibility { padding:130px 0; }.responsibility-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }.responsibility-card { min-height:390px; padding:32px; border:1px solid var(--border); border-radius:22px; background:var(--panel); }.responsibility-card:first-child { box-shadow:inset 4px 0 0 var(--accent); }.responsibility-card:last-child { box-shadow:inset 4px 0 0 var(--accent-2); }.responsibility-card h3 { margin-bottom:30px; font-size:1.55rem; }.responsibility-card .check-list { font-size:.84rem; }
.section--implementation { padding:130px 0; background:rgba(3,11,21,.34); }.implementation-grid { display:grid; grid-template-columns:.75fr 1.25fr; align-items:start; gap:95px; }.implementation-copy { position:sticky; top:120px; }.implementation-copy > p { color:var(--muted); }
:root[data-theme="light"] .section--implementation { background:rgba(225,238,248,.58); }
.implementation-steps { display:grid; gap:13px; margin:0; padding:0; list-style:none; }.implementation-steps li { display:grid; grid-template-columns:55px 1fr; gap:18px; padding:24px; border:1px solid var(--border); border-radius:17px; background:var(--panel); }.implementation-steps li > span { color:var(--accent-2); font-family:var(--font-mono); font-size:.68rem; }.implementation-steps b { display:block; margin-bottom:7px; font-size:1.05rem; }.implementation-steps p { margin:0; color:var(--muted); font-size:.8rem; }