@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@300;400;500;600;700&family=Inter:wght@400;500;600;700;800&display=swap');
:root{--bg:#07101e;--panel:#101e33;--text:#f6f9ff;--muted:#9eb0c9;--line:rgba(143,177,219,.16);--cyan:#21c7ff;--blue:#3f7cff;--violet:#785cff;--green:#45e09b;--danger:#ff758d;--shadow:0 24px 70px rgba(0,0,0,.32)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--text);background:radial-gradient(circle at 10% 0%,rgba(46,112,255,.13),transparent 34%),radial-gradient(circle at 90% 4%,rgba(115,62,255,.12),transparent 30%),var(--bg);font-family:"IBM Plex Sans Thai","Inter",sans-serif;line-height:1.65}a{color:inherit;text-decoration:none}.container{width:min(1180px,calc(100% - 40px));margin:auto}.site-header{position:sticky;top:0;z-index:50;background:rgba(7,16,30,.76);border-bottom:1px solid rgba(255,255,255,.06);backdrop-filter:blur(18px)}.nav-wrap{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:inline-flex;align-items:center;font-family:Inter,sans-serif;font-weight:800;letter-spacing:-.03em}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:linear-gradient(135deg,var(--cyan),var(--violet));font-size:14px;box-shadow:0 10px 28px rgba(49,120,255,.35)}.brand-text{margin-left:9px;font-size:20px}.main-nav{display:flex;align-items:center;gap:30px;font-size:14px;color:#c7d4e7}.main-nav a:hover{color:#fff}.nav-cta{border:1px solid rgba(75,143,255,.45);border-radius:999px;padding:9px 16px;background:rgba(46,111,255,.12)}.nav-toggle{display:none;color:#fff;background:none;border:0;font-size:24px}.hero{position:relative;min-height:850px;display:flex;align-items:center;overflow:hidden;padding:90px 0 100px}.hero:before{content:"";position:absolute;inset:0;opacity:.12;background-image:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.08) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.8),transparent 85%)}.hero-orb{position:absolute;border-radius:50%;filter:blur(40px)}.hero-orb-one{width:440px;height:440px;left:-180px;top:90px;background:rgba(25,156,255,.14)}.hero-orb-two{width:400px;height:400px;right:-140px;bottom:80px;background:rgba(117,62,255,.14)}.hero-grid{position:relative;display:grid;grid-template-columns:1.02fr .98fr;gap:70px;align-items:center}.eyebrow{display:inline-flex;align-items:center;gap:10px;color:#8fb8ff;font:700 12px Inter,sans-serif;letter-spacing:.15em;text-transform:uppercase}.eyebrow span{width:28px;height:2px;background:linear-gradient(90deg,var(--cyan),var(--violet))}.hero h1{margin:24px 0 22px;font-size:clamp(54px,6vw,86px);line-height:1.05;letter-spacing:-.045em}.hero h1 strong{background:linear-gradient(90deg,#75ddff,#7c8eff 48%,#a778ff);-webkit-background-clip:text;color:transparent}.hero-lead{max-width:660px;margin:0;color:var(--muted);font-size:20px}.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border-radius:14px;font-weight:700;transition:.25s}.button:hover{transform:translateY(-2px)}.button-primary{background:linear-gradient(135deg,#278cff,#6f5bff);box-shadow:0 14px 35px rgba(55,105,255,.32)}.button-secondary{border:1px solid var(--line);background:rgba(255,255,255,.04)}.trust-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}.trust-row span{padding:7px 11px;border:1px solid var(--line);border-radius:999px;color:#9fb4cf;font-size:12px;background:rgba(255,255,255,.025)}.visual-frame{border:1px solid rgba(112,159,222,.22);border-radius:26px;background:linear-gradient(145deg,rgba(17,32,55,.95),rgba(8,19,35,.97));box-shadow:var(--shadow);overflow:hidden}.visual-topbar{height:56px;display:flex;align-items:center;gap:14px;padding:0 18px;border-bottom:1px solid var(--line);color:#b8c8dd;font:12px Inter}.visual-topbar b{margin-left:auto;color:var(--green);font-size:10px}.window-dots{display:flex;gap:6px}.window-dots i{width:8px;height:8px;border-radius:50%;background:#31445f}.topology{position:relative;aspect-ratio:1.25/1;min-height:430px}.topology-lines{position:absolute;inset:0;width:100%;height:100%}.topology-lines path{fill:none;stroke:url(#lineGradient);stroke-width:2;stroke-dasharray:7 8;opacity:.75;animation:dash 9s linear infinite}@keyframes dash{to{stroke-dashoffset:-120}}.topology-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:150px;height:150px;display:grid;place-items:center}.core-ring{position:absolute;border:1px solid rgba(56,156,255,.24);border-radius:50%}.ring-one{inset:0;animation:pulse 3s ease-in-out infinite}.ring-two{inset:18px;animation:pulse 3s ease-in-out 1s infinite}@keyframes pulse{50%{transform:scale(1.08);opacity:.45}}.core-node{width:90px;height:90px;border-radius:28px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(145deg,#1ea7ff,#6b56ff);box-shadow:0 0 50px rgba(70,104,255,.45)}.core-node span{font:800 22px Inter}.core-node small{font-size:11px;opacity:.8}.site-node{position:absolute;width:122px;padding:14px;border:1px solid var(--line);border-radius:16px;background:rgba(10,22,40,.94);box-shadow:0 12px 30px rgba(0,0,0,.25)}.site-node span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;margin-bottom:8px;background:rgba(60,133,255,.16);color:#8fc1ff;font:800 12px Inter}.site-node small{display:block;color:#dce6f5}.site-node em{display:block;margin-top:4px;color:var(--green);font-size:8px;font-style:normal}.site-one{left:6%;top:7%}.site-two{right:5%;top:7%}.site-three{left:4%;bottom:7%}.site-four{right:3%;bottom:7%}.visual-stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}.visual-stats div{padding:18px;text-align:center;border-right:1px solid var(--line)}.visual-stats div:last-child{border-right:0}.visual-stats strong{display:block;font:20px Inter}.visual-stats span{color:#7f93ae;font-size:10px}.section{padding:120px 0}.section-dark{background:rgba(9,20,36,.78);border-block:1px solid var(--line)}.section-gradient{background:linear-gradient(180deg,rgba(13,26,46,.92),rgba(8,17,31,.95))}.section-heading{max-width:720px;margin-bottom:58px}.section-heading.centered{margin-left:auto;margin-right:auto;text-align:center}.section-heading.centered .eyebrow{justify-content:center}.section-heading h2{margin:18px 0;font-size:clamp(38px,5vw,62px);line-height:1.13;letter-spacing:-.035em}.section-heading p{color:var(--muted);font-size:18px}.comparison{display:grid;grid-template-columns:1fr 80px 1fr;align-items:stretch}.compare-card{border:1px solid var(--line);border-radius:22px;padding:38px;background:rgba(255,255,255,.025)}.compare-old{opacity:.82}.compare-new{background:linear-gradient(145deg,rgba(28,101,255,.14),rgba(103,77,255,.11));border-color:rgba(80,136,255,.34)}.compare-label{color:#93a7c3;font:700 10px Inter;letter-spacing:.15em}.compare-new .compare-label{color:#72c9ff}.compare-card h3{margin:12px 0 20px;font-size:28px}.compare-card ul{list-style:none;padding:0;margin:0}.compare-card li{position:relative;padding:11px 0 11px 30px;color:#afbdd0;border-bottom:1px solid rgba(255,255,255,.06)}.compare-card li:before{position:absolute;left:0;content:"×";color:var(--danger);font-weight:700}.compare-new li:before{content:"✓";color:var(--green)}.compare-arrow{display:grid;place-items:center;color:#6683aa;font-size:30px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card{min-height:270px;padding:30px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.025);transition:.3s}.feature-card:hover{transform:translateY(-6px);border-color:rgba(67,142,255,.42);background:rgba(31,68,121,.12)}.feature-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;margin-bottom:26px;background:linear-gradient(145deg,rgba(38,160,255,.22),rgba(115,80,255,.19));color:#82c9ff;font-size:24px}.feature-card h3{margin:0 0 12px}.feature-card p{margin:0;color:var(--muted)}.architecture-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;align-items:center}.architecture-points{display:grid;gap:13px;margin-top:34px}.architecture-points div{display:flex;align-items:center;gap:16px}.architecture-points b{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;color:#79bcff;background:rgba(50,124,255,.12);font:11px Inter}.architecture-card{padding:34px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,rgba(18,33,55,.94),rgba(8,18,32,.96));box-shadow:var(--shadow)}.arch-layer{text-align:center;padding:25px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}.arch-layer small{display:block;color:#8094b0;letter-spacing:.15em;font:9px Inter}.arch-layer strong{display:block;margin:5px 0;font-size:22px}.arch-layer span{color:#8fa3bd;font-size:13px}.arch-control{border-color:rgba(61,142,255,.36);background:linear-gradient(145deg,rgba(30,108,255,.13),rgba(104,70,255,.09))}.arch-flow{height:72px;display:flex;align-items:center;justify-content:center;gap:10px}.arch-flow i{width:6px;height:6px;border-radius:50%;background:#5e8fff;box-shadow:0 0 18px #5e8fff;animation:flow 1.2s ease-in-out infinite alternate}.arch-flow i:nth-child(2){animation-delay:.25s}.arch-flow i:nth-child(3){animation-delay:.5s}@keyframes flow{to{transform:translateY(14px);opacity:.35}}.arch-sites{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.arch-sites div{padding:20px 10px;border:1px solid var(--line);border-radius:16px;text-align:center}.arch-sites b{display:block;font:13px Inter}.arch-sites span{color:#7f93ae;font-size:10px}.usecase-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.usecase-card{position:relative;min-height:230px;padding:34px;border:1px solid var(--line);border-radius:22px;overflow:hidden;background:rgba(255,255,255,.025)}.usecase-card>span{position:absolute;right:22px;top:12px;color:rgba(255,255,255,.05);font:800 74px Inter}.usecase-card h3{margin:70px 0 10px;font-size:24px}.usecase-card p{color:var(--muted);margin:0}.metrics-section{padding-block:72px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:22px}.metrics div{padding:28px;text-align:center;border-right:1px solid var(--line)}.metrics div:last-child{border-right:0}.metrics strong{display:block;font:28px Inter;background:linear-gradient(90deg,#68d8ff,#8a72ff);-webkit-background-clip:text;color:transparent}.metrics span{color:#8fa3bd;font-size:12px}.cta-section{padding-top:40px}.cta-card{display:flex;align-items:center;justify-content:space-between;gap:50px;padding:56px;border:1px solid rgba(79,139,255,.34);border-radius:28px;background:radial-gradient(circle at 10% 20%,rgba(34,151,255,.18),transparent 40%),linear-gradient(135deg,rgba(31,79,155,.18),rgba(77,47,154,.18));box-shadow:var(--shadow)}.cta-card h2{margin:16px 0;font-size:clamp(36px,4vw,54px);line-height:1.15}.cta-card p{color:var(--muted)}.cta-actions{min-width:230px;display:grid;gap:12px}.site-footer{padding:80px 0 26px;border-top:1px solid var(--line);background:rgba(4,10,19,.65)}.footer-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.2fr;gap:46px}.footer-brand{margin-bottom:18px}.footer-grid p{max-width:320px;color:#7f93ae}.footer-grid h3{margin-top:0}.footer-grid>div:not(:first-child){display:flex;flex-direction:column;gap:10px;color:#8ea2bd;font-size:13px}.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:55px;padding-top:22px;border-top:1px solid var(--line);color:#667a96;font-size:11px}.docs-hero{padding:110px 0 75px;border-bottom:1px solid var(--line);background:radial-gradient(circle at 50% 0%,rgba(54,112,255,.14),transparent 48%)}.docs-hero h1{margin:16px 0 10px;font-size:clamp(48px,7vw,74px)}.docs-hero p{max-width:760px;color:var(--muted);font-size:18px}.docs-layout{display:grid;grid-template-columns:250px 1fr;gap:70px;padding-block:70px 120px}.docs-sidebar{position:sticky;top:110px;align-self:start;display:flex;flex-direction:column;gap:9px;padding:22px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}.docs-sidebar a{color:#8fa3bd;font-size:13px}.docs-section{scroll-margin-top:110px;padding-bottom:70px;margin-bottom:70px;border-bottom:1px solid var(--line)}.docs-kicker{color:#72bfff;font:700 10px Inter;letter-spacing:.16em}.docs-section h2{margin:8px 0 18px;font-size:36px}.docs-section p,.docs-section li{color:#a9b9ce}.docs-note{margin-top:24px;padding:22px;border-left:3px solid var(--blue);background:rgba(48,112,255,.08);border-radius:0 14px 14px 0}.docs-diagram{display:grid;gap:14px;margin-top:28px;padding:28px;border:1px solid var(--line);border-radius:20px;text-align:center}.docs-diagram>div{padding:18px;border:1px solid var(--line);border-radius:14px}.docs-diagram span{display:block;color:#8195b0;font-size:12px}.docs-diagram-row{display:grid!important;grid-template-columns:repeat(3,1fr);gap:10px}.docs-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.docs-cards div{padding:22px;border:1px solid var(--line);border-radius:16px}.docs-cards h3{margin:0 0 8px}.docs-cards p{margin:0}.step-list{list-style:none;padding:0}.step-list li{display:grid;grid-template-columns:180px 1fr;gap:20px;padding:18px 0;border-bottom:1px solid var(--line)}.support-grid{display:flex;flex-wrap:wrap;gap:10px}.support-grid span{padding:10px 15px;border:1px solid var(--line);border-radius:12px;color:#a9bad0}pre{overflow-x:auto;padding:22px;border:1px solid var(--line);border-radius:16px;background:#050b14;color:#8fd0ff}details{padding:18px 0;border-bottom:1px solid var(--line)}summary{cursor:pointer;font-weight:600}.reveal{opacity:0;transform:translateY(24px);transition:.7s}.reveal.is-visible{opacity:1;transform:none}
@media(max-width:980px){.main-nav{display:none;position:absolute;top:70px;left:20px;right:20px;flex-direction:column;align-items:stretch;gap:0;padding:14px;border:1px solid var(--line);border-radius:18px;background:#0c1829}.main-nav.is-open{display:flex}.main-nav a{padding:12px}.nav-toggle{display:block}.hero{min-height:auto}.hero-grid,.architecture-grid{grid-template-columns:1fr}.feature-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:repeat(2,1fr)}.docs-layout{grid-template-columns:1fr}.docs-sidebar{display:none}}
@media(max-width:700px){.container{width:min(100% - 28px,1180px)}.hero{padding-top:65px}.hero h1{font-size:49px}.hero-lead{font-size:17px}.topology{min-height:360px}.site-node{width:98px;padding:10px}.site-node small{font-size:10px}.visual-stats span{display:none}.section{padding:88px 0}.comparison{grid-template-columns:1fr;gap:18px}.compare-arrow{transform:rotate(90deg);height:42px}.feature-grid,.usecase-grid,.metrics,.docs-cards{grid-template-columns:1fr}.metrics div{border-right:0;border-bottom:1px solid var(--line)}.cta-card{padding:32px 24px;flex-direction:column;align-items:stretch}.footer-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column}.docs-diagram-row{grid-template-columns:1fr}.step-list li{grid-template-columns:1fr;gap:6px}}


/* PFCONNECT Website v1.1 - Product imagery and animated six-site overview */
.product-showcase-section{padding-top:90px}.main-infographic{margin:0;padding:14px;border:1px solid rgba(87,151,255,.3);border-radius:26px;background:linear-gradient(145deg,rgba(20,37,61,.92),rgba(6,14,25,.96));box-shadow:0 30px 90px rgba(0,0,0,.38);overflow:hidden}.main-infographic img{display:block;width:100%;height:auto;border-radius:17px;transition:transform .45s ease}.main-infographic a:hover img{transform:scale(1.012)}.main-infographic figcaption{text-align:center;padding:14px 0 2px;color:#7f93ae;font-size:12px}.hardware-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px}.hardware-card{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:330px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(145deg,rgba(18,34,57,.94),rgba(8,18,33,.98));overflow:hidden;box-shadow:0 20px 55px rgba(0,0,0,.18)}.hardware-card-large{grid-row:span 2;grid-template-columns:1fr}.hardware-image{min-height:230px;display:grid;place-items:center;padding:28px;background:radial-gradient(circle,rgba(44,119,255,.16),transparent 65%)}.hardware-card-large .hardware-image{min-height:370px}.hardware-image img{max-width:100%;max-height:330px;object-fit:contain;filter:drop-shadow(0 24px 28px rgba(0,0,0,.45));transition:transform .35s ease}.hardware-card:hover .hardware-image img{transform:translateY(-5px) scale(1.025)}.hardware-copy{padding:30px}.product-badge{display:inline-block;margin-bottom:8px;color:#73c7ff;font:700 10px Inter,sans-serif;letter-spacing:.14em}.hardware-copy h3{margin:0 0 10px;font-size:26px}.hardware-copy p{margin:0;color:var(--muted)}.product-specs{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.product-specs span{padding:7px 10px;border:1px solid var(--line);border-radius:999px;color:#9fb3cd;font-size:11px}.animated-network-section{overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(37,101,255,.13),transparent 44%)}.live-network{position:relative;min-height:680px;border:1px solid rgba(91,149,230,.22);border-radius:30px;background:linear-gradient(180deg,rgba(9,22,40,.95),rgba(5,12,23,.98));box-shadow:var(--shadow);overflow:hidden}.live-network:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(circle at center,#000,transparent 80%)}.network-beams{position:absolute;inset:0;width:100%;height:100%}.network-beams path{fill:none;stroke:url(#beam);stroke-width:2.3;stroke-dasharray:10 12;opacity:.72;animation:networkDash 5s linear infinite;filter:drop-shadow(0 0 8px rgba(40,165,255,.8))}.network-beams .remote-path{stroke-width:3;stroke-dasharray:5 10;opacity:.9}@keyframes networkDash{to{stroke-dashoffset:-160}}.network-center{position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);width:150px;height:150px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 25%,#32c8ff,#315cff 48%,#5c39cf);box-shadow:0 0 0 18px rgba(54,121,255,.08),0 0 0 40px rgba(54,121,255,.04),0 0 65px rgba(53,116,255,.48);z-index:3;animation:centerPulse 3s ease-in-out infinite}@keyframes centerPulse{50%{transform:translate(-50%,-50%) scale(1.035)}}.network-center span{font:800 31px Inter}.network-center b{font-size:13px}.network-center small{opacity:.72}.network-site,.remote-users{position:absolute;z-index:4;width:205px;padding:18px;border:1px solid rgba(72,215,155,.38);border-radius:18px;background:rgba(9,24,39,.94);box-shadow:0 16px 35px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.04)}.network-site:before{content:"";position:absolute;left:16px;top:16px;width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 14px var(--green)}.network-site b,.remote-users b{display:block;padding-left:17px;font-size:15px}.network-site span,.remote-users span{display:block;margin-top:7px;color:#9fb1c7;font-size:12px}.network-site small,.remote-users small{display:block;margin-top:7px;color:#5fb8ff;font:10px Inter}.ns1{left:4%;top:6%}.ns2{left:50%;top:4%;transform:translateX(-50%)}.ns3{right:4%;top:6%}.ns4{left:4%;bottom:6%}.ns5{left:50%;bottom:4%;transform:translateX(-50%)}.ns6{right:4%;bottom:6%}.remote-users{left:2%;top:50%;transform:translateY(-50%);width:175px;border-color:rgba(109,100,255,.48);background:rgba(24,20,62,.88)}.remote-users:before{content:"↔";position:absolute;right:-28px;top:50%;transform:translateY(-50%);color:#6dd8ff;font-size:20px;text-shadow:0 0 12px #47bfff}.packet{position:absolute;z-index:5;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 12px 4px #33c9ff}.p1{animation:packetOne 4.5s linear infinite}.p2{animation:packetTwo 5.4s linear infinite 1s}.p3{animation:packetThree 4.8s linear infinite .5s}.p4{animation:packetFour 5.8s linear infinite 1.8s}@keyframes packetOne{0%{left:50%;top:49%}100%{left:12%;top:14%;opacity:.15}}@keyframes packetTwo{0%{left:50%;top:49%}100%{left:86%;top:14%;opacity:.15}}@keyframes packetThree{0%{left:50%;top:49%}100%{left:12%;top:84%;opacity:.15}}@keyframes packetFour{0%{left:50%;top:49%}100%{left:86%;top:84%;opacity:.15}}.network-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:24px;margin-top:20px;color:#8ea2bd;font-size:12px}.network-legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px}.legend-green{background:var(--green);box-shadow:0 0 8px var(--green)}.legend-blue{background:var(--cyan);box-shadow:0 0 8px var(--cyan)}.legend-purple{background:var(--violet);box-shadow:0 0 8px var(--violet)}
@media(max-width:980px){.hardware-grid{grid-template-columns:1fr}.hardware-card-large{grid-row:auto}.hardware-card-large,.hardware-card{grid-template-columns:1fr 1fr}.live-network{min-height:820px}.network-center{top:50%}.ns1{left:4%;top:5%}.ns2{right:4%;left:auto;top:5%;transform:none}.ns3{left:4%;right:auto;top:27%}.ns4{right:4%;left:auto;top:27%;bottom:auto}.ns5{left:4%;bottom:5%;transform:none}.ns6{right:4%;bottom:5%}.remote-users{left:50%;top:auto;bottom:24%;transform:translateX(-50%)}.network-beams{opacity:.45}}
@media(max-width:700px){.main-infographic{padding:7px;border-radius:18px}.hardware-card-large,.hardware-card{grid-template-columns:1fr}.hardware-card-large .hardware-image,.hardware-image{min-height:230px}.live-network{min-height:1080px;padding:20px}.network-beams,.packet{display:none}.network-center{top:47%;width:125px;height:125px}.network-site,.remote-users{width:calc(100% - 36px);left:18px!important;right:auto!important;transform:none!important}.ns1{top:20px}.ns2{top:145px}.ns3{top:270px}.remote-users{top:610px;bottom:auto}.ns4{top:735px;bottom:auto}.ns5{top:860px;bottom:auto}.ns6{top:985px;bottom:auto}.network-center{top:54%;opacity:.28;z-index:1}.network-site,.remote-users{z-index:3}}