/* A bounded catalogue: the illustrations keep the scale of readable UI. */
body[data-design=network] .network-services{width:100%;max-width:1184px;margin-inline:auto;padding:88px 32px 48px}
.network-services .offer-intro{gap:40px;grid-template-columns:1fr 1fr;margin-bottom:32px;padding-top:20px}
.network-services .offer-intro h2{font-size:52px;margin-top:20px;line-height:1.04}
.network-services .offer-intro>p{font-size:17px;line-height:1.5;justify-self:end;color:#596151;padding-bottom:3px}
.network-services .offer-grid{gap:20px;align-items:start}
.network-services .offer-card{padding:25px 25px 0;border:1px solid #dce0d5;background:#f0f1eb;border-radius:8px}
.offer-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.network-services .offer-card h3{font-size:30px;line-height:1.09;letter-spacing:-.045em;margin:0}
.service-index{font:11px PlexMono,monospace;line-height:2;color:#737d67}
.network-services .offer-card>p{font-size:15px;line-height:1.5;color:#58604f;max-width:39ch;margin:14px 0 23px;min-height:3em}
.network-services .offer-card details{margin-top:19px;border-color:#cfd5c5}
.network-services .offer-card summary{min-height:53px;font-size:13px}
.network-services .offer-card details ul{font-size:14px;line-height:1.65;padding-left:18px}
.network-services .offer-card details p{font-size:13px;line-height:1.6}
.network-services .service-visual{height:220px;padding:22px 24px;background:#fcfdf9;border:1px solid #cbd3be;border-radius:5px;color:#34472d;display:flex;flex-direction:column;gap:13px}
.network-services .service-visual::before{display:none}
.service-visual .line-icon{stroke-width:1.8;width:31px;height:31px;color:#435d35}
.visual-call{display:flex;align-items:center;gap:12px;background:#35482e;color:#fff;padding:13px 15px;border-radius:5px;font-size:14px}
.visual-call .line-icon{color:#e5edda;width:25px;height:25px}
.visual-wave{display:flex;align-items:center;justify-content:flex-end;gap:3px;margin-left:auto;height:26px}
.visual-wave i{background:#cbdcb6;width:3px;height:12px;border-radius:2px;animation:voice-level 1s ease-in-out infinite alternate}
.visual-wave i:nth-child(2n){height:22px;animation-delay:-.3s}.visual-wave i:nth-child(3n){height:17px;animation-delay:-.7s}
.visual-brief{display:grid;gap:5px;padding:2px 4px}
.visual-brief strong,.visual-quote strong,.visual-answer strong{font-size:17px;font-weight:500;letter-spacing:-.025em}
.visual-brief>span,.visual-quote div>span,.visual-answer div>span{display:block;font-size:12px;color:#5e6d53;line-height:1.5;margin-top:3px}
.visual-result{display:flex;align-items:center;gap:9px;border-top:1px solid #d5ddcb;padding-top:12px;margin-top:auto;font-size:12px;line-height:1.3;color:#435637}
.visual-check{display:grid;place-items:center;flex-shrink:0;width:21px;height:21px;border-radius:50%;background:#e4ecd9;color:#395129;font-size:12px;transition:background 350ms,color 350ms}
.service-visual[data-phase="3"] .visual-check{background:#435c34;color:#fff}
.visual-quote{display:flex;align-items:center;gap:14px;padding:9px 12px;border:1px solid #cbd6bd;background:white;border-radius:4px;width:83%}
.visual-reply{align-self:flex-end;display:flex;align-items:center;gap:10px;border-radius:5px;padding:11px 13px;background:#e5ecd8;color:#384e2b;font-size:14px;line-height:1.3}
.visual-reply>span{font-size:21px}
.visual-pipeline{display:flex;align-items:center;justify-content:center;gap:9px;padding-top:9px}
.visual-pipeline>div{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;background:#fff;border:1px solid #c9d3bb;border-radius:5px;min-width:0;width:95px;height:95px;font-size:12px}
.visual-pipeline>div:nth-of-type(2){background:#e5edd9;border-color:#9dab8b}
.visual-connector{font-size:21px;color:#78886a;transition:color 350ms}
.service-visual[data-phase="2"] .visual-connector{color:#253e17}
.visual-workspace{display:flex;gap:11px;align-items:center;border-bottom:1px solid #d0d9c4;padding-bottom:13px;font-size:14px;color:#3e5234}
.visual-workspace>span{font-size:20px;letter-spacing:-.1em;font-weight:550}.visual-workspace>b{margin-left:auto;font-weight:400;font-size:20px}
.visual-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-top:3px}
.visual-board>div>span{font-size:12px;color:#627153;display:block;margin-bottom:11px}
.visual-board strong{display:block;min-height:57px;background:#e9efdf;border:1px solid #cad6b9;padding:11px 9px;border-radius:4px;font-size:13px;line-height:1.4;font-weight:450}
.visual-board b{font-weight:400;display:inline-block}
.visual-query{display:flex;justify-content:space-between;gap:12px;align-items:center;background:#eef2e6;border:1px solid #cbd6bc;padding:12px 14px;border-radius:4px;font-size:14px;line-height:1.3}
.visual-query>span{font-size:20px;color:#5a7049}
.visual-answer{display:flex;align-items:center;gap:12px;padding:2px 4px}
.visual-source{display:flex;gap:12px;align-items:center;justify-content:center;font-size:16px;letter-spacing:-.02em}
.visual-branch{display:flex;align-items:center;gap:0;justify-content:center;max-width:64%;width:100%;margin:-6px auto -7px;color:#849576}
.visual-branch i{height:1px;background:#bac8aa;width:50%;display:block}.visual-branch span{padding:0 13px;font-size:22px}
.visual-outputs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.visual-outputs>span{border:1px solid #c5d0b7;background:#eaf0df;padding:13px 4px;border-radius:4px;font-size:13px;text-align:center;white-space:nowrap}
.network-services .website-offer{padding:34px;margin-top:20px;gap:44px;grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:#e5e9dd;border-color:#ced7c2;border-radius:8px}
.website-preview{width:100%;max-width:420px;justify-self:center;display:flex;flex-direction:column;align-items:center}
.network-services .website-window{transform:none;box-shadow:0 5px 15px #25331b08;min-height:0;width:100%;max-width:none;margin:0;border-color:#acbca0;background:#fcfdf9;overflow:hidden}
.website-window .website-browser{height:34px;padding:0 12px;gap:5px;border-bottom:1px solid #d5ddcc;display:flex;align-items:center}
.website-browser>i{width:5px;height:5px;border:0;background:#abb89d;border-radius:50%;flex-shrink:0}
.website-browser>span{margin-left:10px;font-size:11px;color:#5a6b50;letter-spacing:.015em}
.website-window .website-screen{height:auto;display:flex;flex-direction:column;align-items:flex-start;gap:18px;padding:24px;border:0}
.website-screen>strong{font-size:29px;letter-spacing:-.055em;line-height:1.09;font-weight:500;color:#34492b}
.website-sample-button{display:inline-flex;gap:24px;align-items:center;background:#3d5332;color:white;padding:10px 13px;font-size:12px;border-radius:4px}
.website-sample-button>b{font-size:16px;font-weight:400}
.website-connection{display:flex;justify-content:center;align-items:center;gap:15px;padding-top:17px;font-size:13px;color:#415536}
.website-connection>b,.website-connection i{font-style:normal;font-weight:400}.website-connection i{margin-left:7px;color:#466631}
.network-services .website-offer h3{font-size:31px;line-height:1.1;margin:12px 0 16px}
.network-services .website-offer-copy .eyebrow{font-size:10px}
.network-services .website-offer p:not(.eyebrow){font-size:15px;line-height:1.5;color:#526547}
.network-services .website-offer .text-link{font-size:14px;margin-top:15px}
.network-services .offer-disclosure{font-size:11px;line-height:1.5;color:#65725a;padding-top:17px}
@media(max-width:1000px){
 body[data-design=network] .network-services{padding-inline:24px}
 .network-services .offer-card{padding:22px 20px 0}
 .network-services .offer-card h3{font-size:28px}
 .network-services .service-visual{padding:20px 16px}
 .network-services .website-offer{padding:28px;gap:30px}
 .website-screen>strong{font-size:27px}
}
@media(max-width:760px){
 body[data-design=network] .network-services{max-width:580px;padding:64px 20px 38px}
 .network-services .offer-intro{grid-template-columns:1fr;gap:18px;margin-bottom:28px}
 .network-services .offer-intro h2{font-size:43px;margin-top:18px}
 .network-services .offer-intro>p{justify-self:start;font-size:16px}
 .network-services .offer-grid{gap:18px}
 .network-services .offer-card h3{font-size:29px}
 .network-services .offer-card>p{min-height:0;font-size:15px;margin-bottom:21px}
 .network-services .service-visual{height:220px}
 .network-services .website-offer{grid-template-columns:1fr;gap:28px;padding:24px}
 .network-services .website-offer h3{font-size:29px}
 .network-services .website-offer p:not(.eyebrow){font-size:15px}
 .website-window .website-screen{padding:23px 20px}
 .website-screen>strong{font-size:28px}
}
@media(max-width:370px){
 body[data-design=network] .network-services{padding-inline:14px}
 .network-services .offer-card{padding:20px 15px 0}
 .network-services .offer-card h3{font-size:27px}
 .network-services .service-visual{padding:18px 12px}
 .visual-wave{gap:2px}.visual-wave i{width:2px}
 .visual-call{padding:12px 9px;gap:8px;font-size:13px}
 .visual-brief strong,.visual-quote strong,.visual-answer strong{font-size:16px}
 .visual-quote{width:100%;padding:9px;gap:10px}
 .visual-reply{padding:10px 9px;font-size:13px;gap:7px}
 .visual-pipeline{gap:6px}.visual-pipeline>div{height:86px;font-size:11px}.visual-connector{font-size:16px}
 .visual-board{gap:5px}.visual-board strong{font-size:12px;padding:10px 6px}.visual-board>div>span{font-size:11px}
 .visual-outputs{gap:5px}.visual-outputs>span{font-size:12px}
 .visual-result{font-size:11px;gap:6px}
 .network-services .website-offer{padding:18px}
 .website-screen>strong{font-size:26px}.website-connection{font-size:12px;gap:10px}
}
@media(prefers-reduced-motion:reduce){.visual-wave i{animation:none}.visual-check,.visual-connector{transition:none}}
