@charset "UTF-8";
:root{color-scheme:dark;--background:#101e2a;--foreground:#eef5f8;--secondary:#a9bdcb;--line:#304656;--page-gutter:clamp(24px,5.5vw,100px);--safe-gutter-left:max(var(--page-gutter),env(safe-area-inset-left,0px));--safe-gutter-right:max(var(--page-gutter),env(safe-area-inset-right,0px));font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-synthesis:none;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;color:var(--foreground);background:var(--background)}
a{color:inherit;text-decoration:none}
button{font:inherit}
a:focus-visible,button:focus-visible{outline:2px solid #bce8ff;outline-offset:6px}
::selection{background:#a3d7f2;color:#101e2a}
.skip-link{position:fixed;left:16px;top:12px;z-index:30;padding:14px 20px;background:#eef5f8;color:#101e2a;transform:translateY(-180%)}
.skip-link:focus{transform:none}
.page-width{max-width:1460px;margin-inline:auto;padding-inline:var(--safe-gutter-left) var(--safe-gutter-right)}
.header{position:sticky;top:0;z-index:10;min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:10px var(--safe-gutter-right) 10px var(--safe-gutter-left);background:#101e2af2;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:15px}
.header nav{display:flex;align-items:center;gap:50px}
.header a{display:flex;align-items:center;min-height:44px}
.header .work-link{color:var(--secondary)}
.header .telephone{font-variant-numeric:tabular-nums;letter-spacing:.015em}
a:hover{color:#fff}
.hero{position:relative;display:grid;isolation:isolate}
.hero-copy{grid-area:1/1;align-self:start;padding:108px var(--safe-gutter-right) 0 var(--safe-gutter-left);z-index:2;pointer-events:none}
h1{font-size:clamp(66px,7.6vw,118px);font-weight:500;line-height:1.035;letter-spacing:-.055em;margin:0;max-width:800px}
.hero-copy p{font-size:18px;line-height:1.5;color:var(--secondary);margin:29px 0 0}
.water-scene{grid-area:1/1;width:100%;height:690px;position:relative;isolation:isolate}
.services{position:relative;padding-top:68px;padding-bottom:110px;display:grid;grid-template-columns:1fr 3fr;gap:40px}
h2{margin:0;font-size:22px;line-height:1.4;letter-spacing:-.02em;font-weight:400}
.services ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:39px 50px}
.services h3{font-size:18px;line-height:1.4;font-weight:400;margin:0 0 7px;letter-spacing:-.01em}
.services p{font-size:14px;line-height:1.5;margin:0;color:var(--secondary)}
.work{padding-bottom:118px}
.work h2{margin-bottom:34px}
.photographs{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);align-items:start;gap:40px}
.photograph{margin:0;min-width:0}
.photograph-secondary{margin-top:0}
.wet-photo{position:relative;isolation:isolate;overflow:hidden;background:#1a3042;aspect-ratio:1.33}
.photograph-secondary .wet-photo{aspect-ratio:.85}
.wet-photo img{display:block;object-fit:cover;object-position:center;width:100%;height:100%}
.wet-photo canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:pan-y pinch-zoom}
.photo-wipe{position:absolute;right:12px;bottom:12px;z-index:2;display:grid;place-items:center;width:44px;height:44px;border:1px solid #c5e4fa42;border-radius:50%;color:#eef5f8;background:#101e2abd;cursor:pointer}
.photo-wipe:hover{background:#101e2a}
.photo-wipe:focus-visible{outline-offset:-5px}
.photograph figcaption{font-size:13px;line-height:1.5;color:var(--secondary);margin-top:15px}
.contact{display:grid;grid-template-columns:1fr 1.3fr;gap:40px;padding-top:55px;padding-bottom:45px;position:relative}
.contact::before{content:"";position:absolute;top:0;left:var(--safe-gutter-left);right:var(--safe-gutter-right);height:1px;background:var(--line)}
.contact-person p{font-size:14px;color:var(--secondary);line-height:1.7;margin:14px 0 0}
.contact-details{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.contact-details a{display:flex;align-items:center;min-height:44px}
.contact-phone{font-size:clamp(32px,3.5vw,51px);font-weight:400;letter-spacing:-.035em;line-height:1.2}
.contact-email{font-size:17px;line-height:1.6;overflow-wrap:anywhere}
.contact small{grid-column:1/-1;font-size:11px;color:var(--secondary);margin-top:28px}
@media(min-width:1700px){.hero-copy{padding-left:max(var(--page-gutter),calc((100vw - 1460px)/2 + var(--page-gutter)))}.water-scene{height:760px}}
@media(max-width:1000px) and (min-width:701px){.hero-copy{padding-top:65px}h1{font-size:7.7vw}.hero-copy p{font-size:16px;max-width:230px}.water-scene{height:590px}.services{grid-template-columns:1fr 2.7fr;gap:24px}.services ul{column-gap:26px}.photographs{gap:25px}.photograph-secondary{margin-top:0}}
@media(max-width:700px){
  :root{--page-gutter:24px}
  html{scroll-padding-top:90px}
  .header{min-height:66px;padding-top:max(7px,env(safe-area-inset-top));font-size:14px;gap:16px}
  .header nav{gap:0}.header .work-link{display:none}.header .telephone{font-size:14px;letter-spacing:0}
  .hero{display:flex;flex-direction:column}
  .hero-copy{padding:45px var(--safe-gutter-right) 0 var(--safe-gutter-left)}
  h1{font-size:clamp(46px,12.9vw,80px);font-weight:500;line-height:1.04;letter-spacing:-.045em}
  .hero-copy p{font-size:15px;margin-top:24px;line-height:1.5}
  .water-scene{height:420px;margin-top:13px}
  .services{display:block;padding-top:44px;padding-bottom:69px}
  h2{font-size:20px}
  .services h2{margin-bottom:30px}
  .services ul{display:grid;grid-template-columns:1fr;gap:25px}
  .services li{display:grid;grid-template-columns:1.2fr 1fr;align-items:baseline;gap:18px}
  .services h3{font-size:15px;line-height:1.5;margin:0}
  .services p{font-size:14px;line-height:1.6}
  .work{padding-bottom:72px}
  .work h2{margin-bottom:27px}
  .photographs{display:flex;flex-direction:column;gap:35px}
  .photograph{width:100%}.photograph-secondary{margin-top:0;width:100%}
  .wet-photo{aspect-ratio:1}.photograph-secondary .wet-photo{aspect-ratio:.9}
  .photograph figcaption{font-size:14px;margin-top:12px}
  .contact{display:block;padding-top:35px;padding-bottom:calc(25px + env(safe-area-inset-bottom))}
  .contact-person p{margin-top:10px}
  .contact-details{gap:19px;margin-top:31px}
  .contact-phone{font-size:37px}
  .contact-email{font-size:14px}
  .contact small{display:block;margin-top:49px}
}
@media(max-width:350px){:root{--page-gutter:20px}.header{font-size:12px}.header .telephone{font-size:13px}.hero-copy{padding-top:34px}.hero-copy p{font-size:14px}.water-scene{height:385px}.services li{grid-template-columns:1fr;gap:4px}.contact-phone{font-size:32px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.photo-wipe[aria-pressed="true"] svg path:last-child{display:none}
