:root{
  --black:#050707;
  --ink:#0b1111;
  --deep:#111616;
  --tiffany:#6edee0;
  --white:#ffffff;
  --muted:#cfd6d6;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--black);
  color:var(--white);
  font-family:Arial, Helvetica, sans-serif;
  line-height:1.55;
}
h1,h2,.logo-word{
  font-family:Georgia, "Times New Roman", serif;
  font-weight:500;
}
a{color:inherit}
.nav{
  position:sticky;
  top:0;
  z-index:10;
  background:rgba(5,7,7,.92);
  backdrop-filter: blur(10px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 7%;
  border-bottom:1px solid rgba(110,222,224,.18);
}
.nav nav{
  display:flex;
  gap:34px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:13px;
}
.nav nav a{text-decoration:none}
.phone,.cta{
  background:linear-gradient(135deg,#55c8cb,#80e7e8);
  color:#041010;
  padding:13px 18px;
  text-decoration:none;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.logo{text-decoration:none}
.arch-logo{
  width:172px;
  height:220px;
  border:2px solid var(--tiffany);
  border-radius:86px 86px 4px 4px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  padding:18px 12px 12px;
  position:relative;
  color:var(--tiffany);
}
.arch-logo.small{
  transform:scale(.58);
  transform-origin:left center;
  margin-right:-70px;
}
.arch-logo:before{
  content:"";
  position:absolute;
  inset:8px 13px 13px;
  border:1px solid var(--tiffany);
  border-radius:75px 75px 2px 2px;
  opacity:.8;
}
.arch-icon{
  position:absolute;
  top:34px;
  width:110px;
  height:70px;
}
.arch-icon:before{
  content:"";
  position:absolute;
  left:10px;
  bottom:0;
  width:90px;
  height:1.5px;
  background:var(--tiffany);
}
.lamp{
  position:absolute;
  left:28px; top:2px;
  width:1.5px; height:38px;
  background:var(--tiffany);
}
.lamp:after{
  content:"";
  position:absolute;
  left:-9px; top:36px;
  width:20px; height:14px;
  border:2px solid var(--tiffany);
  border-top-left-radius:12px;
  border-top-right-radius:12px;
}
.chair{
  position:absolute;
  left:16px; bottom:3px;
  width:32px; height:28px;
  border:2px solid var(--tiffany);
  border-radius:18px 18px 8px 8px;
  transform:skew(-8deg);
}
.chair:before,.chair:after{
  content:"";
  position:absolute;
  bottom:-18px;
  width:2px; height:18px;
  background:var(--tiffany);
}
.chair:before{left:8px; transform:rotate(18deg)}
.chair:after{right:7px; transform:rotate(-18deg)}
.plant{
  position:absolute;
  right:15px; bottom:2px;
  width:18px; height:34px;
  border:2px solid var(--tiffany);
}
.plant:before{
  content:"";
  position:absolute;
  left:7px; bottom:31px;
  width:2px; height:40px;
  background:var(--tiffany);
}
.plant:after{
  content:"";
  position:absolute;
  left:-6px; bottom:48px;
  width:34px; height:34px;
  background:
    radial-gradient(ellipse at 25% 30%, transparent 45%, var(--tiffany) 48%, var(--tiffany) 52%, transparent 55%),
    radial-gradient(ellipse at 80% 40%, transparent 45%, var(--tiffany) 48%, var(--tiffany) 52%, transparent 55%),
    radial-gradient(ellipse at 20% 80%, transparent 45%, var(--tiffany) 48%, var(--tiffany) 52%, transparent 55%);
}
.logo-word{
  color:white;
  font-size:32px;
  letter-spacing:.14em;
  z-index:1;
}
.logo-sub{
  font-size:14px;
  letter-spacing:.32em;
  color:var(--tiffany);
  z-index:1;
}
.logo-line{
  width:86px;
  height:1px;
  background:var(--tiffany);
  margin:7px 0;
  z-index:1;
}
.logo-tag{
  font-size:9px;
  letter-spacing:.13em;
  color:white;
  z-index:1;
}
.hero{
  min-height:660px;
  background:
    linear-gradient(rgba(0,0,0,.58), rgba(0,0,0,.62)),
    url("https://images.unsplash.com/photo-1600210492486-724fe5c67fb0?auto=format&fit=crop&w=1800&q=80") center/cover;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:80px 20px;
}
.hero h1{
  font-size:68px;
  margin:0 0 16px;
}
.hero p{
  font-size:19px;
  text-transform:uppercase;
  letter-spacing:.16em;
  margin-bottom:34px;
}
.stats{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  background:#071010;
  padding:42px 6%;
  text-align:center;
}
.stats > div{
  padding:0 28px;
  border-right:1px solid rgba(110,222,224,.4);
}
.stats > div:last-child{border-right:0}
.icon,.service-icon{
  color:var(--tiffany);
  font-size:42px;
  line-height:1;
}
.stats h3,.service-grid h3,.eyebrow{
  color:var(--tiffany);
  text-transform:uppercase;
  letter-spacing:.14em;
  font-size:14px;
}
.stats p,.service-grid p,.copy p,.contact p{
  color:#e3e3e3;
}
.split{
  display:grid;
  grid-template-columns:1fr 1fr;
  min-height:560px;
}
.copy{
  padding:78px 7%;
  background:linear-gradient(135deg,#091212,#050707);
}
.copy h2,.services h2,.contact h2{
  font-size:44px;
  line-height:1.05;
  margin:10px 0 24px;
}
.rule{
  width:160px;
  height:2px;
  background:var(--tiffany);
  margin:0 0 28px;
}
.outline-btn{
  display:inline-block;
  margin-top:18px;
  padding:13px 20px;
  border:1px solid var(--tiffany);
  color:var(--tiffany);
  text-decoration:none;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:13px;
}
.image-card{
  background:
    linear-gradient(rgba(0,0,0,.08),rgba(0,0,0,.08)),
    url("https://images.unsplash.com/photo-1556909114-f6e7ad7d3136?auto=format&fit=crop&w=1200&q=80") center/cover;
}
.services{
  padding:70px 5%;
  text-align:center;
  background:#060b0b;
}
.center{text-align:center}
.center-rule{margin:0 auto 42px}
.service-grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:0;
}
.service-grid article{
  padding:0 22px;
  border-right:1px solid rgba(110,222,224,.36);
}
.service-grid article:last-child{border-right:0}
.gallery{
  padding:40px 5% 68px;
  background:#071010;
}
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.beforeafter{
  height:190px;
  background:
    linear-gradient(90deg,rgba(30,30,30,.6) 49%, rgba(255,255,255,.1) 50%),
    url("https://images.unsplash.com/photo-1600607687920-4e2a09cf159d?auto=format&fit=crop&w=900&q=80") center/cover;
  position:relative;
  border:1px solid rgba(110,222,224,.35);
}
.beforeafter.bedroom{background-image:linear-gradient(90deg,rgba(30,30,30,.6) 49%, rgba(255,255,255,.1) 50%),url("https://images.unsplash.com/photo-1616594039964-ae9021a400a0?auto=format&fit=crop&w=900&q=80")}
.beforeafter.kitchen2{background-image:linear-gradient(90deg,rgba(30,30,30,.6) 49%, rgba(255,255,255,.1) 50%),url("https://images.unsplash.com/photo-1556911220-bff31c812dba?auto=format&fit=crop&w=900&q=80")}
.beforeafter span,.beforeafter strong{
  position:absolute;
  top:12px;
  background:#111;
  padding:5px 10px;
  text-transform:uppercase;
  font-size:12px;
}
.beforeafter span{left:12px}
.beforeafter strong{left:52%}
.contact{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:55px;
  align-items:center;
  padding:60px 8%;
  background:#050707;
  border-top:1px solid rgba(110,222,224,.3);
}
.footer-logo{transform:scale(.78); transform-origin:left center}
.contact-row{
  display:flex;
  flex-wrap:wrap;
  gap:24px;
  margin:22px 0;
}
.contact-row a{
  text-decoration:none;
  color:var(--tiffany);
}
.small{font-size:14px}
footer{
  text-align:center;
  padding:20px;
  color:#999;
  background:#020303;
}
@media(max-width:950px){
  .nav nav{display:none}
  .hero h1{font-size:42px}
  .stats,.split,.service-grid,.gallery-grid,.contact{grid-template-columns:1fr}
  .stats > div,.service-grid article{border-right:0;border-bottom:1px solid rgba(110,222,224,.25);padding:24px}
  .split{min-height:auto}
  .image-card{min-height:300px}
}