:root {
  --navy: #071b2b;
  --navy-2: #0d2c42;
  --blue: #1168a9;
  --cyan: #34b6d8;
  --sky: #eaf7fb;
  --paper: #f6f8f9;
  --white: #fff;
  --ink: #13242f;
  --muted: #60727e;
  --line: #d9e2e7;
  --shadow: 0 20px 55px rgba(7, 27, 43, .12);
  --radius: 22px;
  --container: min(1160px, calc(100% - 40px));
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; font-family: "Source Sans 3", sans-serif; color: var(--ink); background: var(--white); font-size: 18px; line-height: 1.6; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
img, svg { display: block; max-width: 100%; }
.container { width: var(--container); margin-inline: auto; }
.section { padding: 105px 0; }
.section-soft { background: var(--paper); }
.section-dark { background: var(--navy); color: var(--white); }
.skip-link { position: fixed; left: 12px; top: -60px; z-index: 1000; padding: 10px 15px; background: white; color: black; }
.skip-link:focus { top: 12px; }
.eyebrow { margin: 0 0 16px; color: var(--blue); font: 800 .77rem/1.2 "Manrope", sans-serif; letter-spacing: .14em; text-transform: uppercase; }
h1, h2, h3 { font-family: "Manrope", sans-serif; line-height: 1.12; letter-spacing: -.03em; }
h1 { margin: 0 0 24px; font-size: clamp(2.9rem, 6vw, 5.35rem); max-width: 850px; }
h2 { margin: 0 0 22px; font-size: clamp(2.1rem, 4vw, 3.6rem); }
h3 { margin: 0 0 12px; font-size: 1.34rem; }
p { margin-top: 0; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 0 25px; border: 1px solid var(--cyan); border-radius: 9px; background: var(--cyan); color: var(--navy); font: 800 .86rem "Manrope", sans-serif; transition: .25s ease; }
.button:hover { transform: translateY(-2px); box-shadow: 0 10px 28px rgba(52,182,216,.25); }
.button-small { min-height: 42px; padding-inline: 18px; }
.button-ghost { background: transparent; color: white; border-color: rgba(255,255,255,.28); }
.button-dark { background: var(--navy); color: white; border-color: var(--navy); }
.button-light { background: white; color: var(--navy); border-color: white; }
.text-link, .service-card > a { color: var(--blue); font: 800 .87rem "Manrope", sans-serif; }
.text-link span, .service-card > a span { display: inline-block; transition: transform .2s; }
.text-link:hover span, .service-card > a:hover span { transform: translateX(5px); }

.site-header { position: sticky; top: 0; z-index: 100; background: rgba(7,27,43,.95); backdrop-filter: blur(15px); border-bottom: 1px solid rgba(255,255,255,.08); }
.nav-wrap { min-height: 78px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: white; }
.brand-mark { width: 47px; height: 47px; display: grid; place-items: center; border-radius: 50%; background: rgba(52,182,216,.1); }
.brand-mark svg { width: 39px; fill: var(--cyan); }
.brand-text { display: flex; flex-direction: column; line-height: 1; }
.brand-text strong { font: 800 1.15rem "Manrope", sans-serif; letter-spacing: -.03em; }
.brand-text small { margin-top: 5px; font: 700 .54rem "Manrope", sans-serif; letter-spacing: .21em; color: #a7bac5; }
.primary-nav { display: flex; align-items: center; gap: 28px; color: #d9e7ed; font: 700 .78rem "Manrope", sans-serif; }
.primary-nav > a:not(.button):hover { color: var(--cyan); }
.nav-toggle { display: none; background: none; border: 0; padding: 8px; }
.nav-toggle span { display: block; width: 27px; height: 2px; margin: 5px; background: white; }

.hero { min-height: 820px; display: grid; align-items: center; overflow: hidden; position: relative; }
.hero::before { content:""; position:absolute; inset:0; background: radial-gradient(circle at 75% 42%, rgba(32,149,190,.2), transparent 28%), linear-gradient(115deg, transparent 52%, rgba(255,255,255,.025) 52%); }
.hero-grid { position: relative; display: grid; grid-template-columns: 1.08fr .92fr; gap: 65px; align-items: center; padding-block: 85px 105px; }
.hero .eyebrow { color: var(--cyan); }
.hero h1 span { color: var(--cyan); }
.hero-lead { max-width: 700px; color: #bad0db; font-size: 1.22rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 13px; margin: 35px 0 48px; }
.trust-row { display: grid; grid-template-columns: repeat(3,1fr); max-width: 700px; gap: 24px; padding-top: 27px; border-top: 1px solid rgba(255,255,255,.13); }
.trust-row div { display: grid; gap: 4px; }
.trust-row strong { font: 800 1.5rem "Manrope", sans-serif; color: white; }
.trust-row span { color: #8da5b2; font-size: .82rem; line-height: 1.35; }
.hero-visual { min-height: 540px; position: relative; display: grid; place-items: center; }
.visual-glow { position: absolute; width: 420px; height: 420px; border-radius: 50%; background: rgba(52,182,216,.13); filter: blur(30px); }
.network-card { position: relative; z-index: 2; width: min(100%, 510px); border: 1px solid rgba(255,255,255,.15); border-radius: 26px; background: rgba(14,45,66,.78); backdrop-filter: blur(10px); box-shadow: 0 30px 80px rgba(0,0,0,.35); overflow: hidden; }
.card-topline { padding: 18px 22px; border-bottom: 1px solid rgba(255,255,255,.1); color: #bdced6; font-size: .82rem; }
.status-dot { width: 8px; height: 8px; margin-right: 8px; display: inline-block; background: #62df9a; border-radius: 50%; box-shadow: 0 0 0 5px rgba(98,223,154,.1); }
.metrics { display: grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,.1); }
.metrics div { padding: 17px; text-align:center; border-right:1px solid rgba(255,255,255,.1); }.metrics div:last-child{border:0}
.metrics span { display:block; color:#7893a1; font-size:.7rem; }.metrics strong{display:block; margin-top:2px; font:700 .88rem "Manrope";}
.browser-mock { margin: 26px; border-radius: 14px; overflow: hidden; background: #f4f8fa; box-shadow: 0 14px 34px rgba(0,0,0,.28); }
.browser-bar { display:flex; align-items:center; gap:6px; padding:10px 14px; background:#dfe8ed; }
.browser-bar i { width:9px; height:9px; border-radius:50%; background:#b5c4cc; }
.browser-bar span { flex:1; margin-left:10px; padding:3px 12px; border-radius:20px; background:white; color:var(--muted); font:600 .66rem "Manrope", sans-serif; }
.browser-page { padding:16px 18px 20px; }
.mock-nav { display:flex; align-items:center; gap:8px; margin-bottom:18px; }
.mock-nav b { width:60px; height:12px; margin-right:auto; border-radius:4px; background:var(--navy); }
.mock-nav span { width:34px; height:7px; border-radius:4px; background:#c6d4db; }
.mock-hero { padding:22px 18px; border-radius:10px; background:linear-gradient(130deg,var(--navy-2),var(--blue)); }
.mock-hero b { display:block; width:72%; height:12px; margin-bottom:9px; border-radius:4px; background:rgba(255,255,255,.85); }
.mock-hero b + b { width:48%; }
.mock-hero span { display:block; width:82px; height:20px; margin-top:16px; border-radius:6px; background:var(--cyan); }
.mock-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:12px; }
.mock-cards span { height:52px; border-radius:8px; background:white; border:1px solid var(--line); }
.floating-card { position:absolute; z-index:3; padding:12px 16px; border-radius:12px; background:white; color:var(--ink); font:700 .74rem "Manrope"; box-shadow:var(--shadow); }
.floating-card span{color:#16a66a;margin-right:6px}.float-one{top:10%;right:-4%}.float-two{bottom:10%;left:-4%}
.logo-strip { background:#0b2538; color:#8ea7b4; border-top:1px solid rgba(255,255,255,.06); }
.logo-list { min-height:80px; display:flex; align-items:center; justify-content:space-between; gap:18px; font:800 .69rem "Manrope"; letter-spacing:.15em; }
.logo-list i { width:4px;height:4px;border-radius:50%;background:var(--cyan); }

.section-heading { max-width: 710px; margin-bottom: 50px; }
.section-heading.centered { text-align:center; margin-inline:auto; }
.section-heading > p:last-child, .faq-intro > p { color:var(--muted); }
.access-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.lead-muted { color:var(--muted); }
.access-card { padding:38px; border:1px solid #cce8f0; border-radius:var(--radius); background:var(--sky); }
.access-card label { display:block; margin-bottom:10px; font:700 .78rem "Manrope", sans-serif; }
.access-row { display:flex; gap:12px; }
.access-row input { flex:1; min-width:0; min-height:54px; padding:0 16px; border:1px solid #cbd8df; border-radius:9px; background:white; color:var(--ink); outline:none; }
.access-row input:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(17,104,169,.1); }
.access-note { margin:14px 0 0; color:var(--muted); font-size:.9rem; }
.service-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:22px; }
.service-card { grid-column:span 2; min-height:330px; padding:33px; border:1px solid var(--line); border-radius:var(--radius); display:flex; flex-direction:column; background:white; transition:.28s; }
.service-card:hover { transform:translateY(-6px); box-shadow:var(--shadow); border-color:#bed3de; }
.service-card.featured { grid-column:span 4; background:var(--sky); border-color:#cce8f0; }
.service-card p { color:var(--muted); }
.service-card > a { margin-top:auto; }
.icon-box { width:47px;height:47px;display:grid;place-items:center;margin-bottom:26px;border-radius:12px;background:var(--navy);color:white;font:800 .8rem "Manrope"; }
.featured .icon-box { background:var(--blue); }
.check-list { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0;margin:5px 0 25px;list-style:none;font-size:.84rem;color:#36515f; }
.check-list li::before { content:"✓";color:var(--blue);font-weight:bold;margin-right:7px; }
.work-section { background:linear-gradient(145deg,var(--navy),#0b3049); }
.section-heading.light p { color:#a8c0cb; }.section-heading.light .eyebrow{color:var(--cyan)}
.project-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:22px; }
.project-card { overflow:hidden;border:1px solid rgba(255,255,255,.12);border-radius:var(--radius);background:rgba(255,255,255,.05); }
.project-image { height:230px;display:grid;place-items:center;position:relative;overflow:hidden;font:800 3.2rem "Manrope";letter-spacing:.1em;color:rgba(255,255,255,.76); }
.project-image::before,.project-image::after{content:"";position:absolute;border:1px solid rgba(255,255,255,.18);border-radius:50%}.project-image::before{width:240px;height:240px}.project-image::after{width:150px;height:150px}.project-image span{z-index:2}
.project-network{background:linear-gradient(140deg,#1168a9,#09273b)}.project-web{background:linear-gradient(140deg,#177988,#09273b)}.project-av{background:linear-gradient(140deg,#4b5e9a,#09273b)}
.project-content { padding:27px; }.project-content .tag{color:var(--cyan);font:800 .67rem "Manrope";letter-spacing:.12em;text-transform:uppercase}.project-content h3{color:white}.project-content>p:last-child{color:#a9c0ca;font-size:.92rem}
.process-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:30px;position:relative; }.process-grid::before{content:"";position:absolute;left:8%;right:8%;top:27px;height:1px;background:var(--line)}
.process-step { position:relative;text-align:center; }.process-step span{position:relative;z-index:2;width:55px;height:55px;display:grid;place-items:center;margin:0 auto 25px;border-radius:50%;background:white;border:2px solid var(--blue);color:var(--blue);font:800 .9rem "Manrope"}.process-step p{color:var(--muted);font-size:.9rem}
.faq-layout { display:grid;grid-template-columns:.75fr 1.25fr;gap:90px; }.faq-intro .button{margin-top:15px}
.faq-item { border-bottom:1px solid var(--line); }.faq-item button{width:100%;padding:22px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;border:0;background:transparent;text-align:left;color:var(--ink);font:700 1rem "Manrope"}.faq-item b{font-size:1.4rem;color:var(--blue)}
.faq-answer { display:grid;grid-template-rows:0fr;transition:.3s ease; }.faq-answer>p{overflow:hidden;margin:0;color:var(--muted)}.faq-item.open .faq-answer{grid-template-rows:1fr}.faq-item.open .faq-answer>p{padding-bottom:22px}
.cta-section { padding:0 0 105px;background:var(--paper); }.cta-box{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:55px;border-radius:26px;background:linear-gradient(110deg,var(--blue),#1487ae);color:white;box-shadow:var(--shadow)}.cta-box .eyebrow{color:#c7f1fb}.cta-box h2{margin-bottom:12px}.cta-box p:last-child{margin:0;max-width:700px;color:#d4eef5}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:85px}.contact-details{display:grid;gap:20px;margin-top:35px}.contact-details>div{padding-top:18px;border-top:1px solid var(--line)}.contact-details span{display:block;color:var(--blue);font:800 .68rem "Manrope";letter-spacing:.1em;text-transform:uppercase}.contact-details p{margin:4px 0;color:var(--muted)}.contact-details a{font-weight:700}
.contact-form{padding:35px;border:1px solid var(--line);border-radius:var(--radius);background:var(--paper)}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.contact-form label{display:grid;gap:7px;margin-bottom:16px;font:700 .78rem "Manrope"}.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #cbd8df;border-radius:8px;background:white;padding:12px 14px;color:var(--ink);outline:none}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(17,104,169,.1)}.form-status{margin:12px 0 0;color:#168252;font-weight:700}
.site-footer{padding:70px 0 25px;background:#061723;color:#9db2bd}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:55px}.footer-brand{margin-bottom:20px}.footer-grid>div:first-child p{max-width:400px}.footer-grid h3{font-size:.87rem;color:white}.footer-grid a{display:block;margin:7px 0;font-size:.9rem}.footer-grid a:hover{color:var(--cyan)}.footer-grid p{font-size:.9rem}.footer-bottom{display:flex;justify-content:space-between;gap:20px;margin-top:50px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);font-size:.78rem}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s,transform .65s}.reveal.visible{opacity:1;transform:none}

@media (max-width: 960px){
  .nav-toggle{display:block}.primary-nav{display:none;position:absolute;left:0;right:0;top:78px;padding:22px 20px 28px;flex-direction:column;align-items:stretch;background:var(--navy);border-top:1px solid rgba(255,255,255,.1)}.primary-nav.open{display:flex}.primary-nav .button{width:100%}
  .hero-grid,.faq-layout,.contact-grid,.access-grid{grid-template-columns:1fr}.access-grid{gap:35px}.hero{min-height:auto}.hero-grid{padding-block:70px}.hero-visual{min-height:500px}.service-card,.service-card.featured{grid-column:span 3}.project-grid{grid-template-columns:1fr 1fr}.project-card:last-child{grid-column:1/-1}.process-grid{grid-template-columns:1fr 1fr}.process-grid::before{display:none}.faq-layout,.contact-grid{gap:45px}.footer-grid{grid-template-columns:2fr 1fr 1fr}.footer-grid>div:last-child{grid-column:2/-1}
}
@media (max-width: 640px){
  body{font-size:17px}.container{width:min(100% - 28px,1160px)}.section{padding:75px 0}.brand-text strong{font-size:1rem}.brand-mark{width:42px;height:42px}.hero-grid{padding-top:55px}.hero-lead{font-size:1.06rem}.trust-row{grid-template-columns:1fr;gap:14px}.hero-visual{min-height:410px}.metrics span{font-size:.58rem}.metrics strong{font-size:.72rem}.browser-mock{margin:18px}.access-card{padding:23px}.access-row{flex-direction:column}.floating-card{display:none}.logo-list{justify-content:center;flex-wrap:wrap;padding:18px 0}.service-grid{display:block}.service-card{margin-bottom:16px;min-height:auto}.check-list{grid-template-columns:1fr}.project-grid{grid-template-columns:1fr}.project-card:last-child{grid-column:auto}.process-grid{grid-template-columns:1fr}.cta-box{padding:35px;align-items:flex-start;flex-direction:column}.field-row{grid-template-columns:1fr}.contact-form{padding:23px}.footer-grid{grid-template-columns:1fr}.footer-grid>div:last-child{grid-column:auto}.footer-bottom{flex-direction:column}
}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;transition:none}*{animation:none!important;transition:none!important}}
