:root {
  --navy:#071827;
  --navy-2:#0b2438;
  --navy-3:#10334a;
  --cyan:#00b7d4;
  --cyan-2:#22d3ee;
  --silver:#cbd5df;
  --silver-2:#eef3f7;
  --ink:#0d1d2a;
  --muted:#607181;
  --line:#dce5eb;
  --surface:#f5f8fa;
  --white:#fff;
  --shadow:0 18px 50px rgba(7,24,39,.10);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font-family:Montserrat,Arial,Helvetica,sans-serif;line-height:1.65;background:#fff}
a{text-decoration:none;color:inherit}
.container{width:min(1180px,calc(100% - 44px));margin:auto}

.top{background:#04121e;color:#b9c9d5;font-size:12px;border-bottom:1px solid rgba(255,255,255,.06)}
.top .container{display:flex;justify-content:flex-end;gap:24px;padding:8px 0}
.top a:hover{color:#fff}

header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);border-bottom:1px solid rgba(220,229,235,.9)}
.navwrap{height:84px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.brand{display:flex;align-items:center;gap:12px;min-width:max-content}
.brand b{font-size:19px;letter-spacing:1.8px;color:var(--navy)}
.brand small{display:block;font-size:8px;letter-spacing:2.4px;color:#718292}
.sl-mark{width:52px;height:52px;display:block;flex:none;object-fit:contain}
.nav{display:flex;align-items:center;gap:26px;font-size:13px;font-weight:700;color:#243746}
.nav a{position:relative;padding:8px 0}
.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--cyan);transition:right .2s ease}
.nav a:hover:after,.nav .active:after{right:0}
.nav a:hover,.nav .active{color:var(--navy)}
.cta{padding:12px 18px;background:var(--navy);color:#fff;border-radius:7px;box-shadow:0 8px 20px rgba(7,24,39,.16)}
.cta:hover{background:var(--navy-2);transform:translateY(-1px)}

.hero{min-height:700px;position:relative;overflow:hidden;background:radial-gradient(circle at 78% 28%,rgba(0,183,212,.20),transparent 28%),linear-gradient(120deg,#051421 0%,#09263b 55%,#0c3048 100%);color:#fff}
.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,13,22,.22),transparent 60%),repeating-linear-gradient(90deg,rgba(255,255,255,.025) 0 1px,transparent 1px 80px);opacity:.7}
.hero:after{content:"";position:absolute;width:680px;height:680px;border:1px solid rgba(0,183,212,.20);border-radius:50%;right:-190px;top:35px;box-shadow:0 0 0 80px rgba(0,183,212,.025),0 0 0 160px rgba(255,255,255,.018)}
.hero .container{position:relative;z-index:2;min-height:700px;display:flex;align-items:center}
.hero-copy{max-width:690px;position:relative;z-index:3}
.eyebrow{font-size:11px;letter-spacing:2.8px;text-transform:uppercase;color:#7de8f5;font-weight:800}
.hero h1{font-size:clamp(50px,7vw,86px);line-height:.98;margin:17px 0 22px;letter-spacing:-2.5px}
.hero h1 em{color:var(--cyan-2);font-style:normal}
.hero p{max-width:680px;font-size:19px;color:#cbd9e3;margin:0}
.actions{display:flex;gap:12px;margin-top:31px;flex-wrap:wrap}
.button{display:inline-block;padding:14px 22px;border-radius:7px;background:var(--cyan);color:#03202b;font-weight:800;font-size:13px;box-shadow:0 10px 26px rgba(0,183,212,.18);transition:.2s ease}
.button:hover{transform:translateY(-2px);box-shadow:0 14px 30px rgba(0,183,212,.25)}
.button.outline{background:rgba(255,255,255,.03);color:#fff;border:1px solid rgba(255,255,255,.30);box-shadow:none}
.button.outline:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.55)}
.hero-logo{position:absolute;right:4%;top:50%;transform:translateY(-50%);z-index:2;width:min(470px,38vw);display:grid;place-items:center;padding:24px 0;background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none}
.hero-logo img{width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 18px 30px rgba(0,0,0,.22))}
.hero-bottom{position:absolute;bottom:25px;left:0;right:0;z-index:3}
.hero-bottom .container{min-height:0;display:flex;gap:35px;color:#aebfcb;font-size:11px;text-transform:uppercase;letter-spacing:1.5px}
.dot{width:6px;height:6px;background:var(--cyan);display:inline-block;border-radius:50%;margin-right:9px;box-shadow:0 0 12px rgba(0,183,212,.7)}

.section{padding:96px 0}.surface{background:var(--surface)}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:75px;align-items:center}
.kicker{font-size:11px;letter-spacing:2.4px;text-transform:uppercase;color:#078ba3;font-weight:800}
.section h2{font-size:44px;line-height:1.1;letter-spacing:-1.2px;margin:11px 0 21px}
.section p{color:var(--muted)}
.lead{font-size:18px}
.feature{background:#fff;border:1px solid var(--line);padding:38px;position:relative;box-shadow:var(--shadow);border-radius:12px}
.feature:before{content:"";position:absolute;top:0;left:0;width:70px;height:3px;background:var(--cyan);border-radius:12px 0 0 0}
.feature h3{font-size:23px;margin:0 0 12px}.feature ul{padding:0;margin:20px 0 0;list-style:none;display:grid;gap:11px}.feature li:before{content:"✓";color:var(--cyan);font-weight:900;margin-right:10px}

.values{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:38px}.value{padding:30px;border:1px solid var(--line);background:#fff;border-radius:10px;transition:.2s ease}.value:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#c5d8e3}.value .num{font-size:11px;color:#078ba3;font-weight:800;letter-spacing:2px}.value h3{font-size:21px;margin:12px 0 6px}.value p{font-size:14px}

.servicehead{display:flex;justify-content:space-between;gap:30px;align-items:end}.servicehead p{max-width:510px}.services{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#24465b;margin-top:42px;border:1px solid #24465b;border-radius:12px;overflow:hidden;box-shadow:var(--shadow)}
.service{background:var(--navy);padding:30px;color:#fff;min-height:205px;transition:.2s ease;position:relative}.service:after{content:"";position:absolute;inset:auto 30px 0 30px;height:2px;background:linear-gradient(90deg,var(--cyan),transparent);transform:scaleX(0);transform-origin:left;transition:.25s}.service:hover{background:#0a2940}.service:hover:after{transform:scaleX(1)}
.service .icon{font-size:12px;color:var(--cyan-2);letter-spacing:2px}.service h3{font-size:19px;margin:14px 0 8px}.service p{color:#b8cbd7;font-size:14px;margin:0}

.banner{background:linear-gradient(105deg,var(--navy),#0c344d);color:#fff;padding:58px 0;position:relative;overflow:hidden}.banner:after{content:"";position:absolute;width:360px;height:360px;border:1px solid rgba(0,183,212,.16);border-radius:50%;right:-130px;top:-130px}.banner .container{display:flex;align-items:center;justify-content:space-between;gap:30px;position:relative;z-index:1}.banner h2{font-size:34px;margin:0}.banner p{color:#b9cad5;margin:5px 0 0}

.contact{background:#eef4f7}.contactgrid{display:grid;grid-template-columns:1fr 1fr;gap:50px}.contactbox{background:var(--navy);color:#fff;padding:42px;border-radius:12px;box-shadow:var(--shadow);position:relative;overflow:hidden}.contactbox:after{content:"";position:absolute;width:220px;height:220px;border:1px solid rgba(0,183,212,.16);border-radius:50%;right:-100px;bottom:-110px}.contactbox h3{font-size:25px;margin-top:0}.contactline{padding:15px 0;border-top:1px solid #29485b;position:relative;z-index:1}.contactline strong{display:block;font-size:10px;letter-spacing:2px;color:var(--cyan-2)}.contactline a{font-size:17px}.contactline a:hover{color:var(--cyan-2)}
footer{background:#03111c;color:#91a6b4;padding:25px 0;font-size:12px}.foot{display:flex;justify-content:space-between;gap:20px}.foot strong{color:#d9e4ea}

.galleryhero{padding:105px 0;background:radial-gradient(circle at 80% 30%,rgba(0,183,212,.18),transparent 30%),var(--navy);color:#fff;position:relative;overflow:hidden}.galleryhero h1{font-size:56px;line-height:1.05;margin:12px 0}.galleryhero p{color:#c7d6df;font-size:18px}
.clients{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.client{border:1px solid var(--line);background:#fff;overflow:hidden;border-radius:12px;box-shadow:0 10px 35px rgba(7,24,39,.06);transition:.2s}.client:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.clientvisual{height:300px;background:linear-gradient(135deg,#e8f1f5,#9eb6c4);position:relative;display:flex;align-items:center;justify-content:center}.clientvisual:after{content:"SILVERLINE";font-size:10px;letter-spacing:3px;color:rgba(7,24,39,.45);position:absolute;bottom:17px;left:18px}.clientletter{font-size:80px;font-weight:800;color:rgba(7,24,39,.18)}.clientbody{padding:27px}.clientbody .location{font-size:10px;text-transform:uppercase;letter-spacing:2px;color:#078ba3;font-weight:800}.clientbody h2{font-size:23px;line-height:1.2;margin:9px 0}.clientbody p{font-size:14px;color:var(--muted)}.photos{margin-top:15px;display:flex;gap:7px;flex-wrap:wrap}.photos span{font-size:11px;border:1px solid var(--line);padding:5px 8px;color:#667987;border-radius:20px;background:#f8fbfc}

.navtoggle{display:none}.navburger{display:none;width:44px;height:44px;border-radius:8px;background:var(--navy);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}.navburger i{display:block;width:20px;height:2px;background:var(--cyan);transition:transform .2s}.navtoggle:checked~.navburger i:nth-child(1){transform:translateY(7px) rotate(45deg)}.navtoggle:checked~.navburger i:nth-child(2){opacity:0}.navtoggle:checked~.navburger i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.navtoggle:checked~.nav{display:flex}

@media(max-width:1000px){.hero-logo{right:-80px;opacity:.72}.nav{gap:17px}.navwrap{gap:18px}}
@media(max-width:850px){.top{display:none}.nav{display:none}.cta{display:none}.split,.contactgrid{grid-template-columns:1fr}.values,.services,.clients{grid-template-columns:1fr 1fr}.servicehead{display:block}.banner .container{display:block}.banner .button{margin-top:22px}.hero{min-height:640px}.hero .container{min-height:640px}.hero-logo{right:-130px;width:430px;opacity:.34}.navburger{display:flex}.nav{position:absolute;top:100%;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 18px 32px rgba(7,24,39,.10);flex-direction:column;align-items:stretch;gap:0;padding:6px 0}.nav a{padding:14px 22px;border-top:1px solid var(--line)}}
@media(max-width:560px){.container{width:min(100% - 30px,1180px)}.section{padding:70px 0}.values,.services,.clients{grid-template-columns:1fr}.hero h1{font-size:49px}.hero p{font-size:17px}.hero-bottom{display:none}.section h2{font-size:36px}.galleryhero{padding:75px 0}.galleryhero h1{font-size:42px}.foot{display:block}.foot span{display:block;margin-top:8px}.sl-name small{display:none}.sl-mark{width:43px;height:43px}.hero-logo{right:-190px;opacity:.20}.feature,.contactbox{padding:28px}}

/* === Silverline Motion Layer v3 === */
html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
.motion-ready .reveal { opacity: 0; transform: translate3d(0, 28px, 0); transition: opacity .75s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms), transform .75s cubic-bezier(.22,1,.36,1) var(--reveal-delay,0ms); }
.motion-ready .reveal.is-visible { opacity: 1; transform: translate3d(0,0,0); }

.pointer-glow { position: fixed; width: 220px; height: 220px; border-radius: 50%; pointer-events: none; z-index: 0; background: radial-gradient(circle, rgba(0,183,212,.12), rgba(0,183,212,0) 68%); mix-blend-mode: multiply; will-change: transform; }

.hero:after { animation: orbitPulse 7s ease-in-out infinite; }
.hero-logo { transform: translateY(calc(-50% + var(--parallax, 0px))); transition: transform .15s linear; animation: heroFloat 5s ease-in-out infinite; }
.hero-logo:hover { filter: brightness(1.03); }
.hero-logo img { animation: logoBreath 4s ease-in-out infinite; }

.value, .service, .client, .feature { transform: perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)); transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease, border-color .35s ease, background .35s ease; will-change: transform; }
.value.tilting, .service.tilting, .client.tilting, .feature.tilting { transition: transform .08s linear, box-shadow .25s ease; }
.value:hover, .client:hover, .feature:hover { box-shadow: 0 24px 55px rgba(7,24,39,.12); }
.service:hover { box-shadow: inset 0 0 60px rgba(0,183,212,.045), 0 22px 45px rgba(0,0,0,.16); }

.service .icon { display:inline-flex; align-items:center; gap:8px; transition: transform .3s ease, letter-spacing .3s ease; }
.service .icon:before { content:'✦'; font-size:9px; opacity:.65; transform:rotate(0deg); transition:transform .4s ease, opacity .3s ease; }
.service:hover .icon { transform:translateX(4px); letter-spacing:3px; }
.service:hover .icon:before { transform:rotate(180deg) scale(1.2); opacity:1; }

.nav a { transition: color .25s ease, transform .25s ease; }
.nav a:hover { transform: translateY(-1px); }
.cta, .button { position:relative; overflow:hidden; transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s ease, background .25s ease; }
.cta:hover { box-shadow:0 12px 28px rgba(7,24,39,.24); }
.ripple { position:absolute; width:8px; height:8px; border-radius:50%; background:rgba(255,255,255,.45); transform:translate(-50%,-50%); pointer-events:none; animation:ripple .6s ease-out forwards; }

.hero { background-position: center calc(50% + var(--hero-shift, 0px)); }
.hero .eyebrow { animation: fadeUp .8s .1s both; }
.hero h1 { animation: fadeUp .8s .2s both; }
.hero-copy > p { animation: fadeUp .8s .32s both; }
.hero-copy .actions { animation: fadeUp .8s .44s both; }

@keyframes fadeUp { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
@keyframes heroFloat { 0%,100% { margin-top:0; } 50% { margin-top:-10px; } }
@keyframes logoBreath { 0%,100% { transform:scale(1); } 50% { transform:scale(1.025); } }
@keyframes orbitPulse { 0%,100% { opacity:.75; transform:scale(1); } 50% { opacity:1; transform:scale(1.025); } }
@keyframes ripple { from { width:8px; height:8px; opacity:.7; } to { width:240px; height:240px; opacity:0; } }

@media (max-width:850px) {
  .pointer-glow { display:none; }
  .hero-logo { animation:none; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

/* === Projects Gallery === */
.project-gallery{background:linear-gradient(180deg,#fff 0%,#f5f8fa 100%)}
.gallery-intro{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:42px}.gallery-intro h2{margin-bottom:0}.gallery-intro>p{max-width:470px;margin:0}
.project-card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 16px 50px rgba(7,24,39,.07);padding:30px;margin-bottom:30px;overflow:hidden}
.project-heading{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:24px}.client-brand{display:flex;align-items:center;gap:20px}.client-brand img{width:92px;height:92px;object-fit:contain;border:1px solid var(--line);border-radius:12px;padding:9px;background:#fff}.client-brand h2{margin:7px 0 8px;font-size:30px}.client-brand p{margin:0;font-size:14px}.project-count{white-space:nowrap;border:1px solid #b9dce5;color:#078ba3;background:#f0fbfd;border-radius:999px;padding:8px 12px;font-size:10px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase}
.project-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:180px;gap:12px}.project-photo{position:relative;display:block;padding:0;border:0;border-radius:12px;overflow:hidden;background:#dfeaf0;cursor:pointer;min-width:0}.project-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.22,1,.36,1),filter .35s ease}.project-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(3,17,28,.72));opacity:.8}.project-photo span{position:absolute;bottom:12px;left:14px;right:10px;color:#fff;font-size:11px;font-weight:800;letter-spacing:.5px;text-align:left;z-index:1}.project-photo:hover img{transform:scale(1.06);filter:saturate(1.08)}.project-photo:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}.photo-wide{grid-column:span 2;grid-row:span 2}.project-grid-small{grid-template-columns:repeat(2,1fr);grid-auto-rows:260px}
.lightbox{position:fixed;inset:0;background:rgba(2,12,20,.94);z-index:100;display:none;align-items:center;justify-content:center;padding:40px}.lightbox.open{display:flex}.lightbox figure{margin:0;max-width:min(1100px,88vw);max-height:90vh;text-align:center}.lightbox figure img{max-width:100%;max-height:78vh;object-fit:contain;border-radius:10px;box-shadow:0 25px 90px rgba(0,0,0,.45)}.lightbox figcaption{color:#d8e7ee;font-size:13px;margin-top:13px}.lightbox button{position:absolute;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;border-radius:50%;width:48px;height:48px;font-size:34px;line-height:1;cursor:pointer}.lightbox button:hover{background:rgba(0,183,212,.25);border-color:var(--cyan)}.lightbox-close{top:24px;right:28px}.lightbox-prev{left:28px;top:50%;transform:translateY(-50%)}.lightbox-next{right:28px;top:50%;transform:translateY(-50%)}.modal-open{overflow:hidden}
@media(max-width:850px){.gallery-intro{display:block}.gallery-intro>p{margin-top:15px}.project-heading{align-items:flex-start;flex-direction:column}.project-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px}.photo-wide{grid-column:span 2}.project-grid-small{grid-template-columns:1fr;grid-auto-rows:250px}.project-count{align-self:flex-start}}
@media(max-width:560px){.project-card{padding:18px}.client-brand{align-items:flex-start;gap:12px}.client-brand img{width:66px;height:66px}.client-brand h2{font-size:22px}.project-grid{gap:8px;grid-auto-rows:155px}.lightbox{padding:20px}.lightbox-prev{left:10px}.lightbox-next{right:10px}.lightbox-close{right:12px;top:12px}}

/* === Contact enquiry form === */
.form-intro{color:#b8cbd7;font-size:14px;margin:-8px 0 24px}.contact-form{position:relative;z-index:1}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.contact-form label{display:block;color:#dce8ee;font-size:11px;font-weight:800;letter-spacing:.7px;margin-bottom:14px}.contact-form input,.contact-form select,.contact-form textarea{display:block;width:100%;margin-top:7px;border:1px solid #355568;border-radius:7px;background:#102f42;color:#fff;padding:13px 12px;font:inherit;font-size:14px;outline:none;box-sizing:border-box}.contact-form input::placeholder,.contact-form textarea::placeholder{color:#91aab8}.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(0,183,212,.12)}.contact-form select{color:#dce8ee}.contact-form textarea{resize:vertical;min-height:120px}.form-submit{border:0;cursor:pointer;width:100%;margin-top:3px;text-align:center}.contact-details{position:relative;z-index:1;margin-top:28px}.contact-details .contactline:first-child{border-top:1px solid #29485b}@media(max-width:560px){.form-row{grid-template-columns:1fr}}