:root {
  --ink: #142125;
  --blue: #126c84;
  --sky: #bfe1e6;
  --cream: #f5f1e9;
  --orange: #ff7143;
  --line: rgba(20, 33, 37, .16);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--cream); font: 500 16px/1.55 Manrope, Arial, sans-serif; }
a { color: inherit; text-decoration: none; }
.site-header { height: 84px; display: flex; align-items: center; justify-content: space-between; padding: 0 clamp(24px, 5vw, 84px); border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; gap: 10px; align-items: center; font-size: 20px; font-weight: 800; letter-spacing: -.9px; }
.brand > span:last-child > span { color: var(--blue); }
.brand-mark { width: 26px; height: 20px; position: relative; display: inline-block; transform: skewY(-25deg); }
.brand-mark i { display: block; position: absolute; width: 7px; height: 7px; background: var(--orange); border-radius: 50%; }
.brand-mark i:nth-child(1) { left: 0; top: 7px; }.brand-mark i:nth-child(2) { left: 9px; top: 3px; background: var(--blue); }.brand-mark i:nth-child(3) { left: 18px; top: 0; background: var(--ink); }
nav { display: flex; gap: clamp(18px, 3vw, 46px); font-size: 14px; font-weight: 700; } nav a:hover { color: var(--blue); }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 51px; padding: 0 23px; background: var(--orange); color: #fff; font-weight: 800; font-size: 14px; transition: transform .2s, background .2s; }
.button:hover { transform: translateY(-2px); background: #e85d34; }.button-small { min-height: 40px; padding: 0 17px; }
.hero { min-height: 630px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, .92fr); }
.hero-copy { padding: clamp(70px, 11vw, 158px) clamp(24px, 5vw, 84px); }.eyebrow { color: var(--blue); font: 12px/1.2 "DM Mono", monospace; letter-spacing: 1.4px; margin: 0 0 22px; }
h1,h2,h3,p { margin-top: 0; } h1,h2 { letter-spacing: -3.5px; line-height: .95; font-weight: 800; } h1 { font-size: clamp(56px, 7.2vw, 108px); margin-bottom: 30px; } h1 em,h2 em { color: var(--blue); font-style: normal; }
.hero-text { max-width: 480px; font-size: 18px; }.hero-actions { margin-top: 35px; display: flex; gap: 26px; align-items: center; }.text-link { font-size: 14px; font-weight: 800; }.text-link span { color: var(--orange); font-size: 22px; margin-left: 5px; }
.hero-art { position: relative; overflow: hidden; min-height: 500px; color: #fff; background: #173c49; isolation: isolate; }.sun { position: absolute; inset: 12% 15% auto auto; width: 185px; aspect-ratio: 1; border-radius: 50%; background: var(--orange); box-shadow: 0 0 0 40px rgba(255,113,67,.11); }.horizon { position: absolute; top: 48%; width: 130%; height: 3px; background: var(--sky); transform: rotate(-8deg); opacity: .7; }.grid { position: absolute; inset: 39% -20% -25%; background: repeating-linear-gradient(90deg, transparent 0 70px, rgba(191,225,230,.25) 71px 72px), repeating-linear-gradient(0deg, transparent 0 50px, rgba(191,225,230,.25) 51px 52px); transform: perspective(180px) rotateX(55deg); }.drone { position: absolute; left: 31%; top: 39%; width: 96px; height: 22px; background: var(--cream); border-radius: 50%; transform: rotate(-8deg); box-shadow: 0 10px 20px rgba(0,0,0,.25); }.drone:before,.drone:after { content:""; position:absolute; top: -18px; width: 36px; height: 36px; border: 3px solid var(--cream); border-radius: 50%; }.drone:before { left:-20px; }.drone:after { right:-20px; }.drone span { position:absolute; top:7px; width: 9px; height:9px; border-radius:50%; background:var(--orange); }.drone span:first-child { left:9px; }.drone span:nth-child(2) { right:9px; }.drone b { position:absolute; inset:6px 34px; background:var(--ink); border-radius: 4px; }.coordinates { position: absolute; bottom: 30px; left: 34px; font: 11px "DM Mono", monospace; letter-spacing: 1px; }
.intro { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; padding: clamp(68px, 9vw, 130px) clamp(24px, 15vw, 250px); background: var(--sky); }.section-number { font: 12px "DM Mono", monospace; color: var(--blue); }.intro p:last-child { margin:0; font-size: clamp(24px, 3vw, 39px); line-height: 1.25; font-weight: 700; letter-spacing: -1.3px; }
.services { padding: clamp(74px, 9vw, 140px) clamp(24px, 5vw, 84px); }.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:48px; }.section-heading h2,.process h2,.contact h2 { font-size: clamp(44px, 5vw, 76px); margin:0; }.service-list { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }.service-card { min-height: 410px; padding:32px; position:relative; overflow:hidden; background:#e9e4da; }.service-card:nth-child(2) { background:var(--blue); color:#fff; }.service-card > span { font:12px "DM Mono",monospace; color:var(--orange); }.service-card h3 { margin:54px 0 12px; font-size:30px; line-height:1.1; letter-spacing:-1.2px; }.service-card p { max-width:360px; position:relative; z-index:2; }.card-art { position:absolute; right:-40px; bottom:-35px; width:270px; height:210px; opacity:.9; }.inspection { background:linear-gradient(145deg,transparent 48%,var(--blue) 49% 51%,transparent 52%),repeating-linear-gradient(135deg,transparent 0 25px,rgba(18,108,132,.26) 26px 28px); border:12px solid var(--blue); transform:rotate(-16deg); }.photo { border-radius:50% 50% 0 0; background:radial-gradient(circle at 55% 35%, var(--orange) 0 14%,transparent 15%),repeating-linear-gradient(0deg,transparent 0 25px,rgba(191,225,230,.35) 26px 27px),linear-gradient(150deg,#0b3541 0 55%,var(--sky) 56%); transform:rotate(18deg); }
.process { display:grid; grid-template-columns: .8fr 1.2fr; gap:7vw; padding:clamp(70px,9vw,135px) clamp(24px,12vw,210px); background:var(--ink); color:var(--cream); }.process .eyebrow { color:var(--sky); }.process ol { padding:0; margin:0; list-style:none; }.process li { display:grid; grid-template-columns:55px 1fr; gap:22px; border-top:1px solid rgba(245,241,233,.25); padding:25px 0; }.process li strong { color:var(--orange); font:12px "DM Mono",monospace; }.process li b { display:block; margin-bottom:5px; font-size:19px; }
.contact { display:grid; grid-template-columns:1fr 1fr; gap:70px; padding:clamp(75px,10vw,150px) clamp(24px,12vw,210px); background:var(--orange); }.contact .eyebrow { color:var(--ink); }.contact h2 em { color:var(--cream); }.contact-copy { align-self:end; font-size:18px; }.button-light { background:var(--cream); color:var(--ink); margin:18px 0 22px; }.button-light:hover { background:#fff; }.contact-note { font:12px "DM Mono",monospace; margin:0; }.contact-note span { font-weight:bold; }
footer { display:flex; align-items:center; justify-content:space-between; gap:25px; padding:30px clamp(24px,5vw,84px); font-size:12px; } footer p { margin:0; }
@media (max-width: 720px) { .site-header { height:70px; }.site-header nav,.site-header .button { display:none; }.hero,.intro,.process,.contact { grid-template-columns:1fr; }.hero { min-height:0; }.hero-art { min-height:380px; }.hero-copy { padding-top:80px; }.intro { padding:65px 24px; gap:18px; }.service-list { grid-template-columns:1fr; }.section-heading { display:block; }.section-heading .eyebrow { margin-bottom:18px; }.process,.contact { gap:45px; padding-left:24px; padding-right:24px; } footer { align-items:flex-start; flex-direction:column; } }
