:root{
  --fern:#006b54;--teal:#0c6e7d;--navy:#13202b;--ink:#10202b;
  --silver:#d7dee2;--mist:#f5f7f8;--white:#fff;--line:#dce3e6;
  --max:1180px;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Inter,system-ui,sans-serif;line-height:1.6;background:#fff}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}.container{width:min(calc(100% - 40px),var(--max));margin-inline:auto}
h1,h2,h3{font-family:"Space Grotesk",Inter,sans-serif;line-height:1.08;margin:0}h2{font-size:clamp(2rem,4vw,3.3rem)}p{margin:0}.eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;font-weight:700;color:var(--fern);margin-bottom:18px}.eyebrow.light{color:#83d8c2}
.hero{min-height:760px;color:#fff;background:linear-gradient(90deg,rgba(3,18,23,.94) 0%,rgba(4,21,26,.78) 38%,rgba(2,17,20,.35) 72%,rgba(2,12,15,.7) 100%),url("assets/hero-loch.png") center/cover no-repeat;position:relative;overflow:hidden}.hero:after{content:"";position:absolute;inset:auto 0 0;height:170px;background:linear-gradient(transparent,rgba(2,14,18,.5))}
.nav{height:112px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:5}.brand{display:flex;align-items:center;gap:14px}.brand-icon{height:52px;width:auto;color:#fff}.brand-text{font-family:"Space Grotesk",Inter,sans-serif;font-weight:600;font-size:1.15rem;letter-spacing:.14em;text-transform:uppercase;color:#fff;line-height:1.15}.brand-text small{display:block;font-size:.55rem;font-weight:500;letter-spacing:.32em;color:#83d8c2}.nav-links{display:flex;gap:42px;align-items:center;text-transform:uppercase;font-size:.78rem;font-weight:600;letter-spacing:.08em}.nav-links a{opacity:.9}.nav-links a:hover{color:#61cbb0}.nav-cta{border:1px solid rgba(67,194,161,.55);padding:13px 24px;border-radius:4px}.menu-button{display:none}
.hero-inner{min-height:620px;display:flex;align-items:center;position:relative;z-index:2}.hero-copy{max-width:620px}.hero h1{font-size:clamp(3.4rem,6.8vw,6.4rem);letter-spacing:-.05em}.hero h1 span{color:#17a982}.hero-copy>p:not(.eyebrow){font-size:1.14rem;max-width:500px;margin:28px 0 34px;color:#e3ecee}.button{display:inline-flex;align-items:center;gap:22px;background:linear-gradient(135deg,#00826a,#006b54);color:#fff;padding:15px 24px;border-radius:4px;text-transform:uppercase;font-weight:700;font-size:.77rem;letter-spacing:.05em;box-shadow:0 10px 30px rgba(0,82,67,.28)}.button:hover{transform:translateY(-2px)}
.section{padding:100px 0}.section-heading{margin-bottom:54px}.centered{text-align:center}.service-grid,.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.service-grid{grid-template-columns:repeat(2,1fr);max-width:760px;margin-inline:auto}.service-card{border:1px solid var(--line);padding:30px;min-height:260px;background:#fff;transition:.25s}.service-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px rgba(19,32,43,.08)}.service-card img{width:44px;color:var(--fern);margin-bottom:24px}.service-card h3{font-size:1.16rem;margin-bottom:12px}.service-card p{font-size:.92rem;color:#52626b}
.dark{background:#071b22;color:#fff}.work{position:relative;overflow:hidden}.contours{position:absolute;inset:0;opacity:.08;background:repeating-radial-gradient(ellipse at 15% 70%,transparent 0 18px,#36c4a1 19px 20px,transparent 21px 38px)}.split-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:42px;position:relative}.text-link{color:#0cb48c;text-transform:uppercase;font-size:.77rem;font-weight:700;letter-spacing:.06em}.project-grid{grid-template-columns:repeat(2,1fr);position:relative}.project-card img.img-left{object-position:left top}.project-card{background:#0a222a;border:1px solid rgba(255,255,255,.06);overflow:hidden}.project-card>img{aspect-ratio:16/9;object-fit:cover;width:100%}.project-card>div{padding:22px}.project-card span{font-size:.64rem;text-transform:uppercase;border:1px solid rgba(255,255,255,.2);padding:4px 7px}.project-card h3{margin:14px 0 8px}.project-card p{color:#c8d2d5;font-size:.9rem;margin-bottom:16px}.project-card a{color:#18b78f;font-size:.82rem}
.about{background:#f2f5f7;position:relative;overflow:hidden}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.about-grid p:not(.eyebrow){color:#52626b;margin-bottom:25px}.about-fern{position:absolute;left:-120px;top:-250px;width:420px;color:#9cafb5;opacity:.18;transform:rotate(-35deg)}
footer{position:relative;background:#06181e url("assets/tartan-texture.jpg") center/cover;color:#fff;padding:80px 0 24px;overflow:hidden}.footer-overlay{position:absolute;inset:0;background:rgba(2,17,21,.86)}.footer-grid,.footer-bottom{position:relative}.footer-grid{display:grid;grid-template-columns:1.1fr .8fr 1.2fr;gap:70px}.footer-logo{width:190px;color:#fff;margin-bottom:18px}.footer-grid h3{margin-bottom:18px}.footer-grid a:not(.button){display:block;color:#d5e0e2;margin:6px 0;font-size:.9rem}.footer-grid p{color:#c6d1d4;margin-bottom:24px}.footer-bottom{border-top:1px solid rgba(255,255,255,.13);margin-top:62px;padding-top:22px;display:flex;justify-content:space-between;color:#9fb0b5;font-size:.78rem}
@media(max-width:900px){.service-grid{grid-template-columns:repeat(2,1fr)}.about-grid{gap:40px}.nav-links{position:absolute;top:86px;left:20px;right:20px;display:none;flex-direction:column;background:#081b22;padding:24px}.nav-links.open{display:flex}.menu-button{display:block;background:none;border:1px solid rgba(255,255,255,.35);color:#fff;padding:9px 13px}.project-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:last-child{grid-column:1/-1}}
@media(max-width:620px){.container{width:min(calc(100% - 28px),var(--max))}.hero{min-height:680px}.nav{height:88px}.brand-icon{height:40px}.brand-text{font-size:.92rem}.hero-inner{min-height:570px}.hero h1{font-size:3.15rem}.section{padding:72px 0}.service-grid,.about-grid,.footer-grid{grid-template-columns:1fr}.service-card{min-height:0}.split-heading{align-items:start;gap:25px;flex-direction:column}.about-grid{gap:30px}.footer-grid>div:last-child{grid-column:auto}.footer-bottom{flex-direction:column;gap:8px}}
