:root{--navy:#0c223b;--ink:#142b43;--muted:#5d6b7b;--cyan:#56d4d5;--pale:#f2f6f8;--line:#dee6ec}*{box-sizing:border-box}body{font-family:Arial,Helvetica,sans-serif;color:var(--ink);font-size:16px;line-height:1.7;margin:0}a{color:inherit;text-decoration:none}a:hover{color:#087c86}a:focus-visible,button:focus-visible{outline:3px solid #159da5;outline-offset:4px}.container{max-width:1200px;padding-left:24px;padding-right:24px}.skip-link{position:absolute;left:16px;top:-70px;z-index:1100;background:white;padding:10px}.skip-link:focus{top:8px}#site-header{background:#fff;border-bottom:1px solid var(--line)}.navbar{min-height:94px}.brand{display:flex;align-items:center;gap:12px;font-size:19px;font-weight:800;letter-spacing:2px}.brand small{display:block;font-size:8px;letter-spacing:2.1px;color:var(--muted);margin-top:4px}.brand-mark{font-size:37px;line-height:48px;letter-spacing:-5px;width:49px;height:49px;background:var(--navy);color:#fff;text-align:center;border-radius:10px;padding-right:4px}.brand-mark span{color:var(--cyan)}.navbar-nav{gap:16px}.nav-link{font-size:14px;font-weight:600;padding-top:12px;padding-bottom:12px}.nav-link.active{color:#087b84!important}.dropdown-menu{border-color:var(--line);border-radius:8px;padding:8px}.dropdown-item{padding:12px 18px;font-size:14px}.btn{border-radius:5px;padding:13px 22px;font-weight:600;font-size:14px;min-height:46px}.btn-primary{background:var(--navy);border-color:var(--navy)}.btn-primary:hover{background:#184365;border-color:#184365}.btn-cyan{background:var(--cyan);color:var(--navy);border:1px solid var(--cyan)}.btn-cyan:hover{background:#82e1e1}.btn-outline{border:1px solid #b1c3ce;color:var(--ink)}.nav-cta{padding:11px 20px}.eyebrow{text-transform:uppercase;letter-spacing:2px;font-size:11px;font-weight:700;color:#16828b;margin-bottom:22px;display:flex;align-items:center;gap:10px}.eyebrow:before{content:'';width:24px;height:2px;background:currentColor}.hero{background:var(--pale);padding:86px 0 82px;overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:76px;align-items:center}h1{font-size:clamp(38px,4.7vw,62px);line-height:1.1;letter-spacing:-2px;font-weight:700;max-width:770px}h1 em{font-style:normal;color:#15838b}.lead-copy{font-size:18px;color:var(--muted);max-width:550px;margin:24px 0 30px}.button-row{display:flex;flex-wrap:wrap;gap:12px}.hero-note{font-size:12px;color:var(--muted);margin-top:24px}.hero-note span{color:#15838b;margin-right:8px}.network-art{position:relative;min-height:365px;background:var(--navy);border-radius:16px;color:white;padding:32px;box-shadow:18px 18px 0 #e2edef;background-image:radial-gradient(#29445d 1px,transparent 1px);background-size:20px 20px}.art-label{font-size:10px;letter-spacing:2px;color:#acc5d5}.art-hub{position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);width:124px;height:124px;border:1px solid #5fcdd266;border-radius:26px;display:grid;place-content:center;text-align:center;background:#14324d;box-shadow:0 0 0 24px #57d2d509,0 0 0 48px #57d2d506}.art-hub strong{font-size:27px;letter-spacing:-1px}.art-hub small{color:var(--cyan);font-size:10px;letter-spacing:2px}.art-node{position:absolute;background:#fff;color:var(--ink);border:1px solid #dae9ee;padding:12px 15px;border-radius:8px;font-size:12px;font-weight:600;box-shadow:0 5px 22px #0001}.node-one{top:75px;left:22px}.node-two{right:16px;top:95px}.node-three{left:24px;bottom:80px}.node-four{right:20px;bottom:65px}.art-node span{color:#168b93;margin-right:7px}.art-bottom{position:absolute;bottom:22px;left:32px;right:32px;border-top:1px solid #ffffff20;padding-top:16px;display:flex;justify-content:space-between;font-size:10px;color:#acc5d5}.intro-strip{border-bottom:1px solid var(--line);padding:26px 0}.intro-strip .container{display:flex;justify-content:space-between;gap:20px;align-items:center}.intro-strip p{margin:0;font-size:14px;color:var(--muted)}.intro-strip strong{color:var(--ink)}.section{padding:85px 0}.section-heading{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:35px}.section-heading h2,h2{font-size:clamp(28px,3vw,38px);font-weight:700;letter-spacing:-1px;line-height:1.2}.section-heading p{max-width:380px;color:var(--muted);font-size:15px;margin:0}.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.service-card{display:flex;flex-direction:column;border:1px solid var(--line);padding:25px;border-radius:8px;background:#fff;transition:transform .2s,border-color .2s}.service-card:hover{transform:translateY(-4px);border-color:#168b93;color:var(--ink)}.card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:32px;color:#4c697c}.service-number{display:grid;place-items:center;background:#edf6f7;width:42px;height:42px;border-radius:7px;color:#14838a;font-weight:700;font-size:13px}.service-card h3{font-size:19px;letter-spacing:-.3px;line-height:1.35;font-weight:700}.service-card p{font-size:14px;color:var(--muted);margin-top:8px}.card-link{margin-top:auto;padding-top:20px;font-size:12px;font-weight:700}.card-link span{float:right}.products-section{background:var(--pale)}.product-placeholder{display:grid;grid-template-columns:1fr 1.2fr;gap:55px;align-items:center;border:1px solid var(--line);background:white;padding:45px;border-radius:10px}.product-visual{background:#eaf3f6;padding:30px;border-radius:8px}.mini-window{background:white;border:1px solid #cbdce5;border-radius:7px;overflow:hidden;box-shadow:0 12px 22px #17384c0c}.window-bar{background:#f6f8fa;border-bottom:1px solid var(--line);padding:10px;color:#a9bbc6;letter-spacing:3px;font-size:10px}.window-content{display:flex;gap:15px;padding:22px;height:135px}.window-sidebar{width:22%;background:#e9f0f3;border-radius:3px}.window-main{flex:1;display:flex;flex-direction:column;gap:12px}.window-main i{display:block;height:12px;background:#e3ecef;border-radius:3px}.window-main i:nth-child(2){width:65%;background:#b3e7e7}.window-main i:last-child{height:45px}.badge-soft{display:inline-block;background:#eaf6f5;color:#137c82;padding:5px 10px;font-size:10px;font-weight:700;letter-spacing:1px;border-radius:4px;margin-bottom:18px}.product-placeholder h3{font-size:28px;font-weight:700;letter-spacing:-.7px}.product-placeholder p{color:var(--muted);font-size:15px}.text-link{color:#137c82;font-weight:700;font-size:14px;display:inline-block;min-height:44px;padding-top:10px}.why-grid{display:grid;grid-template-columns:1fr 1.3fr;gap:80px}.why-grid>div>p{color:var(--muted);margin-top:22px}.reason{display:grid;grid-template-columns:38px 1fr;gap:15px;padding:22px 0;border-bottom:1px solid var(--line)}.reason:first-child{padding-top:0}.reason>span{font-size:12px;color:#15838b;padding-top:4px}.reason h3{font-size:18px;font-weight:700}.reason p{font-size:14px;color:var(--muted);margin:0}.cta-section{padding:0 0 80px}.cta-box{background:var(--navy);color:white;padding:48px 52px;border-radius:10px;display:flex;align-items:center;justify-content:space-between;gap:30px}.cta-box h2{font-size:32px;max-width:620px}.cta-box p{color:#b8cbd9;margin:14px 0 0;font-size:15px}.cta-box .btn{flex-shrink:0}footer{background:#f5f7f9;border-top:1px solid var(--line);padding:55px 0 20px}.footer-top{display:grid;grid-template-columns:1.2fr .7fr 1fr 1fr;gap:35px}.footer-brand{font-weight:800;font-size:23px;letter-spacing:1px}.cyan{color:#14838b}.footer-top p{font-size:13px;color:var(--muted);margin-top:15px}.footer-top h2{font-size:12px;letter-spacing:0;margin:5px 0 18px}.footer-top>div>a:not(.footer-brand){display:block;font-size:12px;margin-bottom:10px;min-height:28px}.footer-bottom{border-top:1px solid var(--line);margin-top:35px;padding-top:22px;display:flex;justify-content:space-between;gap:15px;font-size:11px;color:var(--muted)}.page-hero{padding:65px 0;background:var(--pale)}.breadcrumb-line{font-size:12px;color:var(--muted);margin-bottom:35px}.breadcrumb-line a{text-decoration:underline;text-underline-offset:4px}.page-hero h1{font-size:clamp(36px,4.3vw,54px)}.page-hero .lead-copy{max-width:700px}.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px}.content-grid p,.prose p,.prose li{color:var(--muted)}.feature-list{list-style:none;padding:0;margin:25px 0 0}.feature-list li{padding:17px 0;border-bottom:1px solid var(--line)}.feature-list strong{display:block;color:var(--ink);margin-bottom:5px}.feature-list li:before{content:'↗';color:#14838b;float:right}.info-panel{background:var(--pale);padding:35px;border-left:3px solid #16838b;border-radius:5px;margin-top:30px}.info-panel h3{font-size:19px;font-weight:700}.info-panel p{margin:10px 0 0;font-size:14px;color:var(--muted)}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin-top:35px}.step{border-top:1px solid var(--line);padding-top:22px}.step span{font-size:12px;color:#14838b}.step h3{font-size:20px;font-weight:700;margin:15px 0}.step p{color:var(--muted);font-size:15px}.prose{max-width:800px}.prose h2{font-size:25px;margin-top:35px}.contact-line{padding:22px 0;border-bottom:1px solid var(--line)}.contact-line span{display:block;font-size:10px;color:var(--muted);letter-spacing:1.4px;margin-bottom:10px}.contact-line a{font-size:23px;font-weight:600;overflow-wrap:anywhere}.contact-line p{margin:0}.contact-panel{padding:38px;background:var(--navy);color:white;border-radius:10px}.contact-panel p{color:#b8cbd9}.contact-panel h2{font-size:30px}.contact-panel .btn{margin:15px 0}.small-note{font-size:12px!important}.product-grid:empty{display:none}@media(min-width:992px){.navbar-collapse{display:flex!important}}@media(max-width:991px){.navbar{min-height:80px}.navbar-nav{padding:20px 0;gap:3px;align-items:stretch}.nav-link{min-height:44px}.navbar-collapse{padding-top:5px}.hero{padding:55px 0}.hero-grid{gap:35px;grid-template-columns:1fr}.hero h1{max-width:650px}.network-art{min-height:340px;max-width:550px;width:100%}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section{padding:60px 0}.why-grid{gap:40px}.footer-top{grid-template-columns:1fr 1fr}.cta-box{padding:35px;align-items:start;flex-direction:column}.product-placeholder{gap:30px;padding:30px}.content-grid{gap:35px}.section-heading{align-items:start}}@media(max-width:575px){.container{padding-left:20px;padding-right:20px}.brand{font-size:16px}.brand small{font-size:7px}.brand-mark{width:43px;height:43px;line-height:42px}.hero{padding:42px 0}h1{letter-spacing:-1.4px}.lead-copy{font-size:16px}.network-art{min-height:315px;padding:24px}.art-hub{width:105px;height:105px}.art-node{font-size:10px;padding:10px}.node-one{left:12px;top:65px}.node-two{right:10px;top:82px}.node-three{left:12px;bottom:78px}.node-four{right:10px;bottom:65px}.art-bottom{left:24px;right:24px;font-size:9px}.intro-strip .container{align-items:start;flex-direction:column;gap:7px}.section-heading,.why-grid,.content-grid{display:block}.section-heading p{margin-top:18px}.service-grid{grid-template-columns:1fr}.service-card{padding:25px}.card-top{margin-bottom:22px}.product-placeholder{grid-template-columns:1fr;padding:23px}.why-grid>div:first-child{margin-bottom:35px}.cta-box{padding:30px 25px}.cta-box h2{font-size:28px}.cta-section{padding-bottom:55px}.footer-top{gap:25px;grid-template-columns:1fr 1fr}.footer-top>div:first-child,.footer-top>div:last-child{grid-column:1/-1}.footer-bottom{flex-direction:column}.page-hero{padding:40px 0}.content-grid>div+div{margin-top:35px}.steps{grid-template-columns:1fr;gap:20px}.contact-panel{padding:28px}.btn{white-space:normal}.breadcrumb-line{margin-bottom:25px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.product-grid>.prose{grid-column:1/-1}.footer-top>div>a:not(.footer-brand){min-height:44px;display:flex;align-items:center}.footer-bottom a{min-height:44px;display:inline-flex;align-items:center}

/* Locally hosted decorative photography; sources are recorded in docs/image-credits.md. */
.hero {
  background-color: #071b32;
  color: #fff;
  background-image: linear-gradient(90deg, rgba(7,27,50,.98) 0%, rgba(7,27,50,.88) 42%, rgba(7,27,50,.40) 100%), url('/assets/images/software-workspace.jpg');
  background-size: cover;
  background-position: center;
}
.network-art {
  background-image: linear-gradient(135deg, rgba(12,34,59,.48), rgba(12,34,59,.25)), url('/assets/images/server-room.jpg');
  background-size: cover;
  background-position: center;
  border: 1px solid #ffffff40;
  box-shadow: 18px 18px 0 #56d4d512, 0 24px 65px #0003;
}
.hero .eyebrow, .hero h1 em, .hero-note span { color: #72eeee; }
.hero .lead-copy, .hero .hero-note { color: #e1edf5; }
.hero .btn-primary { background: var(--cyan); border-color: var(--cyan); color: var(--navy); }
.hero .btn-primary:hover { background: #82e1e1; border-color: #82e1e1; }
.hero .btn-outline { color: #fff; border-color: #b1c3ce; background: #0c223b70; }
.hero .btn-outline:hover { background: #ffffff18; border-color: #fff; }
.art-label, .art-bottom { color: #fff; text-shadow: 0 1px 4px #071b32; }
.art-label { display: inline-block; background: #071b32b8; padding: 6px 10px; border-radius: 4px; }
.art-bottom { background: #071b32cf; padding: 12px; border-radius: 4px; }
.photo-hero {
  background-color: var(--navy);
  background-image: linear-gradient(90deg, rgba(7,27,50,.98) 0%, rgba(7,27,50,.94) 45%, rgba(7,27,50,.58) 70%, rgba(7,27,50,.18) 100%), var(--hero-photo);
  background-size: cover;
  background-position: center;
  color: #fff;
  border-bottom: 4px solid var(--cyan);
}
.photo-hero--infrastructure { --hero-photo: url('/assets/images/server-room.jpg'); }
.photo-hero--software { --hero-photo: url('/assets/images/software-workspace.jpg'); }
.photo-hero .eyebrow { color: var(--cyan); }
.photo-hero .lead-copy, .photo-hero .breadcrumb-line { color: #e1edf5; }
.photo-hero .btn-primary { background: var(--cyan); border-color: var(--cyan); color: var(--navy); }
.photo-hero .btn-primary:hover { background: #82e1e1; border-color: #82e1e1; }
.cta-box, .contact-panel {
  background-image: linear-gradient(110deg, rgba(7,27,50,.97) 0%, rgba(7,27,50,.88) 65%, rgba(7,27,50,.50) 100%), url('/assets/images/software-workspace.jpg');
  background-size: cover;
  background-position: center;
}
.cta-box p, .contact-panel p { color: #e1edf5; }
.service-card { border-top: 3px solid #20aab3; box-shadow: 0 8px 24px #0c223b08; }
.service-number { background: #d8f7f5; color: #08666e; }
.products-section { background: linear-gradient(125deg, #e8f7f8, #f2f6f8 65%); }
@media (max-width: 575px) {
  .hero { background-image: linear-gradient(rgba(7,27,50,.88), rgba(7,27,50,.80)), url('/assets/images/software-workspace.jpg'); }
  .photo-hero { background-image: linear-gradient(rgba(7,27,50,.82), rgba(7,27,50,.87)), var(--hero-photo); background-position: 60% center; }
}

/* Homepage services: a restrained icon system and one featured service. */
#services { background: #f6f8fa; padding: 68px 0; }
#services .section-heading { margin-bottom: 32px; align-items: center; }
#services .service-grid { gap: 20px; }
#services .service-card { padding: 28px 25px 22px; border: 1px solid #dce4eb; border-radius: 12px; box-shadow: 0 4px 16px #0c223b04; }
#services .card-top { margin-bottom: 22px; align-items: center; }
#services .card-top>span:last-child { color: #8191a0; font-size: 12px; font-weight: 600; letter-spacing: 1px; }
#services .service-number { width: 56px; height: 56px; border-radius: 12px; background: #edf5f6; color: #17546a; }
#services .service-number svg { width: 32px; height: 32px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#services .service-card h3 { font-size: 20px; margin-bottom: 12px; }
#services .service-card p { margin: 0 0 24px; line-height: 1.75; }
#services .card-link { border-top: 1px solid #e1e8ed; padding-top: 16px; color: #146374; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
#services .card-link span { float: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: #edf5f6; font-size: 16px; }
#services .service-card { background: #d9e5ef; border-color: #c3d5e3; color: #142b43; }
#services .service-card:nth-child(even) { background: #d2e9e7; border-color: #b6d7d3; }
#services .service-card p { color: #3d5569; }
#services .service-number { background: #ffffff80; color: #17546a; }
#services .card-top>span:last-child { color: #526c7c; }
#services .card-link { color: #174f63; border-color: #142b4326; }
#services .card-link span { background: #ffffff80; color: #17546a; }
#services .service-card:hover { border-color: #168b93; box-shadow: 0 12px 28px #0c223b0d; }
@media (max-width: 575px) {
  #services { padding: 48px 0; }
  #services .card-top { margin-bottom: 22px; }
}

/* Homepage company approach: soft panels and decorative line icons. */
#why-right-link .why-grid { align-items: center; gap: 64px; }
#why-right-link h2 { font-size: clamp(28px, 2.8vw, 34px); max-width: 430px; line-height: 1.2; }
#why-right-link .why-grid>div>p { max-width: 440px; font-size: 15px; }
#why-right-link .text-link { margin-top: 8px; }
#why-right-link .text-link span { margin-left: 12px; }
#why-right-link .reason-list { display: grid; gap: 14px; }
#why-right-link .reason { grid-template-columns: 48px minmax(0, 1fr); align-items: start; gap: 18px; padding: 24px; border: 1px solid #d5e2ec; border-radius: 10px; background: #e7eff6; }
#why-right-link .reason:nth-child(even) { background: #e1f0ed; border-color: #cce2dd; }
#why-right-link .reason-icon { display: grid; place-items: center; width: 48px; height: 48px; padding: 0; background: #ffffffb3; border-radius: 10px; color: #17546a; }
#why-right-link .reason-icon svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
#why-right-link .reason h3 { margin-bottom: 7px; font-size: 17px; line-height: 1.4; }
#why-right-link .reason p { color: #3d5569; line-height: 1.65; }
@media (max-width: 991px) {
  #why-right-link .why-grid { gap: 32px; }
}
@media (max-width: 575px) {
  #why-right-link .reason { padding: 20px 16px; gap: 14px; grid-template-columns: 42px minmax(0, 1fr); }
  #why-right-link .reason-icon { width: 42px; height: 42px; }
}

/* Reuse service cards for one-time IT jobs and keep enquiry actions clear on phones. */
.it-service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.it-service-grid .text-link { margin-top: auto; }
@media (max-width: 991px) {
  .it-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
  .it-service-grid { grid-template-columns: 1fr; }
  .hero .button-row .btn, .page-hero .btn, .cta-box .btn { width: 100%; }
}

/* Shared navy palette across every page; cyan is reserved for small accents. */
:root { --pale: #f0f3f7; --line: #d6dfe9; }
#site-header, footer, .page-hero, .products-section,
.service-card, #services .service-card,
#why-right-link .reason, .info-panel {
  background: var(--navy);
  color: #fff;
  border-color: #29445d;
}
#services .service-card:nth-child(even),
#why-right-link .reason:nth-child(even) {
  background: var(--navy);
  border-color: #29445d;
}
#site-header .brand small, #site-header .nav-link,
footer .footer-top p, footer .footer-bottom,
.page-hero .lead-copy, .page-hero .breadcrumb-line,
.products-section .step p, .products-section .prose p,
.service-card p, #services .service-card p,
#why-right-link .reason p, .info-panel p {
  color: #d7e2ee;
}
#site-header .nav-link:hover, #site-header .nav-link.active,
footer a:hover, .service-card a:hover, .info-panel a:hover {
  color: #8ce1e3 !important;
}
#site-header .navbar-toggler {
  border-color: #71869c;
  --bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
#site-header .dropdown-menu {
  --bs-dropdown-bg: #0c223b;
  --bs-dropdown-color: #fff;
  --bs-dropdown-link-color: #fff;
  --bs-dropdown-link-hover-color: #fff;
  --bs-dropdown-link-hover-bg: #203e5b;
  --bs-dropdown-link-active-bg: #203e5b;
  border-color: #456079;
}
#site-header .nav-cta {
  background: #fff;
  border-color: #fff;
  color: var(--navy);
}
#site-header .nav-cta:hover { background: #e1e9f2; border-color: #e1e9f2; }
.page-hero .eyebrow, .products-section .eyebrow,
.products-section .step span, .info-panel .eyebrow,
footer .cyan, .service-card .text-link, .info-panel .text-link,
#services .card-link { color: #8ce1e3; }
.service-card:hover, #services .service-card:hover {
  color: #fff;
  border-color: #71869c;
}
.service-number, #services .service-number,
#services .card-link span, #why-right-link .reason-icon {
  background: #203e5b;
  color: #b7e9ed;
}
#services .card-top>span:last-child { color: #b9cbdc; }
#services .card-link, footer .footer-bottom, .products-section .step {
  border-color: #456079;
}
.products-section .text-link { color: #8ce1e3; }
.products-section .btn-outline { border-color: #a8bcd0; color: #fff; }
.products-section .btn-primary { background: #203e5b; border-color: #71869c; }
