:root{
  --black:#070707;--black2:#0e0e0e;--copper:#c57938;--copper2:#e0a064;
  --ivory:#f2ede6;--muted:#aaa49e;--line:rgba(255,255,255,.13);--max:1180px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--ivory);font-family:Inter,sans-serif;font-weight:300;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
button,input{font:inherit}

.site-header{
  position:absolute;z-index:20;top:0;left:0;width:100%;height:112px;
  padding:14px clamp(22px,4.5vw,68px);
  display:flex;align-items:center;justify-content:space-between;
  background:linear-gradient(to bottom,rgba(0,0,0,.8),rgba(0,0,0,.16),transparent)
}
.brand{
  display:flex;align-items:center;width:330px;height:84px;
  text-decoration:none;overflow:visible
}
.brand img{
  width:100%;height:100%;object-fit:contain;object-position:left center;
  filter:drop-shadow(0 3px 8px rgba(0,0,0,.6))
}
.main-nav{display:flex;align-items:center;gap:clamp(20px,2.5vw,38px)}
.main-nav a{
  position:relative;padding:12px 0;text-decoration:none;text-transform:uppercase;
  letter-spacing:.08em;font-size:12px;font-weight:400
}
.main-nav a::after{content:"";position:absolute;left:0;right:100%;bottom:5px;height:1px;background:var(--copper2);transition:right .25s}
.main-nav a:hover::after,.main-nav a.active::after{right:0}
.menu-toggle{display:none;width:42px;height:42px;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.38)}
.menu-toggle span{display:block;width:20px;height:1px;margin:5px auto;background:#fff}

.hero{
  position:relative;
  min-height:780px;
  min-height:100svh;
  display:grid;
  place-items:center;
  overflow:hidden;
  isolation:isolate
}
.hero-photo{
  position:absolute;
  inset:0;
  background:
    linear-gradient(to bottom,rgba(0,0,0,.10),rgba(0,0,0,.30)),
    url("assets/hero-estate.jpg") center 58%/cover no-repeat;
  transform:scale(1.015)
}
.hero-overlay{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 48%,rgba(0,0,0,.20) 0%,rgba(0,0,0,.48) 55%,rgba(0,0,0,.70) 100%),
    linear-gradient(to bottom,rgba(0,0,0,.42) 0%,rgba(0,0,0,.12) 28%,rgba(0,0,0,.25) 68%,rgba(0,0,0,.64) 100%)
}
.hero-content{
  position:relative;
  z-index:3;
  width:min(760px,calc(100% - 48px));
  margin:0 auto;
  padding:132px 0 92px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center
}
.hero-logo{
  width:min(430px,78vw);
  height:auto;
  margin:0 auto 12px;
  object-fit:contain;
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.62))
}
h1,h2,h3{font-family:Cinzel,serif;font-weight:400}
h1{margin:0;font-size:clamp(42px,4.1vw,66px);line-height:1.2;letter-spacing:.01em;text-transform:uppercase}
.accent-line{display:block;width:54px;height:2px;margin:25px 0;background:var(--copper)}
.accent-line.centered{margin-left:auto;margin-right:auto}
.hero-content .accent-line{margin-left:auto;margin-right:auto}
.hero-content>p{
  max-width:610px;
  margin:0 auto 30px;
  color:#d0cbc5;
  font-size:15px;
  line-height:1.78;
  text-shadow:0 2px 10px rgba(0,0,0,.55)
}
.outline-button{
  min-width:170px;padding:16px 22px;display:inline-flex;align-items:center;justify-content:center;gap:22px;
  border:1px solid var(--copper);color:var(--copper2);text-decoration:none;text-transform:uppercase;
  letter-spacing:.07em;font-size:13px;font-weight:400;transition:.25s
}
.outline-button:hover{color:#100b07;background:var(--copper2);transform:translateY(-2px)}
.scroll-cue{position:absolute;z-index:5;left:50%;bottom:25px;width:30px;height:57px;transform:translateX(-50%);text-decoration:none}
.scroll-cue span{display:block;width:21px;height:34px;margin:auto;border:2px solid #fff;border-radius:14px}
.scroll-cue span::after{content:"";display:block;width:2px;height:8px;margin:6px auto;background:#fff;animation:wheel 1.8s infinite}
.scroll-cue i{display:block;width:8px;height:8px;margin:7px auto 0;border-right:1px solid #fff;border-bottom:1px solid #fff;transform:rotate(45deg)}
@keyframes wheel{0%{opacity:0;transform:translateY(0)}45%{opacity:1}100%{opacity:0;transform:translateY(10px)}}

.section-dark{background:radial-gradient(circle at 50% 10%,rgba(255,255,255,.035),transparent 38%),linear-gradient(135deg,#111,#080808)}
.services{padding:62px clamp(24px,5vw,70px) 76px}
.section-heading{max-width:850px;margin:0 auto 42px;text-align:center}
.kicker{margin:0 0 18px;color:var(--copper);text-transform:uppercase;letter-spacing:.08em;font-size:14px;font-weight:400}
.section-heading h2,.about-copy h2{margin:0;text-transform:uppercase;font-size:clamp(28px,3vw,43px);letter-spacing:.025em}
.section-heading>p:last-child{color:var(--muted);line-height:1.7}
.service-grid{width:min(var(--max),100%);margin:auto;display:grid;grid-template-columns:repeat(4,1fr)}
.service-card{min-height:260px;padding:0 clamp(22px,3vw,38px);text-align:center;border-right:1px solid var(--line)}
.service-card:last-child{border-right:0}
.service-card svg{width:75px;height:75px;margin:0 auto 15px;fill:none;stroke:var(--copper);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.service-card h3{margin:0 0 13px;text-transform:uppercase;font-size:19px}
.service-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.7}

.about{min-height:510px;display:grid;grid-template-columns:1fr 1fr;background:#090909}
.about-photo{min-height:510px;background:linear-gradient(90deg,transparent 55%,#090909 100%),url("assets/about-land.jpg") center/cover no-repeat}
.about-copy{max-width:620px;align-self:center;padding:65px clamp(28px,6vw,90px) 65px 65px}
.about-copy>p:not(.kicker){color:var(--muted);font-size:15px;line-height:1.75;margin:0 0 26px}

.signup{padding:48px 24px 64px}
.signup .section-heading{margin-bottom:22px}
.signup-form{width:min(600px,100%);margin:auto;display:grid;grid-template-columns:1fr 140px}
.signup-form input{min-width:0;padding:17px 20px;border:1px solid #414141;border-right:0;outline:none;background:rgba(0,0,0,.32);color:#fff}
.signup-form input:focus{border-color:var(--copper)}
.signup-form button{border:1px solid var(--copper2);background:var(--copper2);color:#16100b;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}

.site-footer{
  position:relative;
  padding:58px clamp(25px,8vw,130px) 0;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-areas:"contact brand" "copy copy";
  column-gap:75px;
  align-items:center;
  background:radial-gradient(circle at 25% 30%,rgba(198,119,54,.06),transparent 30%),#090909;
  border-top:1px solid rgba(198,119,54,.48)
}
.footer-brand{
  grid-area:brand;
  display:flex;
  align-items:center;
  justify-content:flex-end
}
.footer-brand img{
  width:min(132px,100%);
  height:auto;
  object-fit:contain
}
.footer-contact{
  grid-area:contact;
  align-self:center
}
.footer-contact a,.footer-contact p:not(.kicker){
  display:block;
  margin:0 0 15px;
  color:var(--muted);
  text-decoration:none
}
.footer-contact a{
  transition:color .38s ease
}
.footer-contact a:hover,.footer-contact a:focus-visible{
  color:var(--copper2)
}
.copyright{
  grid-area:copy;
  margin:42px calc(-1*clamp(25px,8vw,130px)) 0;
  padding:14px 20px;
  text-align:center;
  color:#777;
  border-top:1px solid rgba(255,255,255,.05);
  font-size:10px
}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s,transform .7s}
.reveal.visible{opacity:1;transform:none}

@media(max-width:920px){
  .site-header{
    height:92px;
    padding:10px 20px;
    background:linear-gradient(to bottom,rgba(0,0,0,.90),rgba(0,0,0,.28),transparent)
  }
  .brand{width:255px;height:70px}
  .menu-toggle{display:block;z-index:22;border-radius:2px}
  .main-nav{
    position:absolute;
    top:82px;
    left:16px;
    right:16px;
    padding:14px;
    display:none;
    flex-direction:column;
    gap:2px;
    align-items:stretch;
    background:rgba(5,5,5,.98);
    border:1px solid rgba(255,255,255,.12);
    box-shadow:0 18px 45px rgba(0,0,0,.55)
  }
  .main-nav.open{display:flex}
  .main-nav a{padding:15px 12px;text-align:center}
  .hero{
    min-height:780px;
    min-height:100svh
  }
  .hero-photo{background-position:center 58%}
  .hero-content{
    width:min(680px,calc(100% - 48px));
    padding:126px 0 86px
  }
  .hero-logo{width:min(390px,68vw)}
  h1{font-size:clamp(42px,7vw,62px)}
  .service-grid{grid-template-columns:repeat(2,1fr)}
  .service-card{padding:28px 24px;border-bottom:1px solid var(--line)}
  .service-card:nth-child(2){border-right:0}
  .service-card:nth-child(3),.service-card:nth-child(4){border-bottom:0}
  .about{grid-template-columns:1fr}
  .about-photo{
    min-height:390px;
    background:
      linear-gradient(0deg,#090909 0%,transparent 42%),
      url("assets/about-land.jpg") center/cover no-repeat
  }
  .about-copy{padding:12px 38px 68px;text-align:center}
  .about-copy .accent-line{margin-left:auto;margin-right:auto}
  .site-footer{column-gap:35px}
}

@media(max-width:600px){
  .site-header{height:82px;padding:8px 14px}
  .brand{width:200px;height:60px}
  .menu-toggle{width:40px;height:40px}
  .main-nav{top:74px;left:12px;right:12px}

  .hero{
    min-height:740px;
    min-height:100svh
  }
  .hero-photo{
    background-position:62% center;
    transform:scale(1.02)
  }
  .hero-overlay{
    background:
      linear-gradient(to bottom,rgba(0,0,0,.54) 0%,rgba(0,0,0,.22) 25%,rgba(0,0,0,.38) 62%,rgba(0,0,0,.76) 100%),
      radial-gradient(circle at 50% 45%,rgba(0,0,0,.16),rgba(0,0,0,.66) 82%)
  }
  .hero-content{
    width:calc(100% - 34px);
    padding:105px 0 76px
  }
  .hero-logo{
    width:min(310px,82vw);
    margin-bottom:14px
  }
  h1{
    font-size:clamp(34px,10vw,46px);
    line-height:1.18;
    letter-spacing:0
  }
  .hero-content>p{
    max-width:360px;
    font-size:14px;
    line-height:1.68;
    margin-bottom:25px
  }
  .hero-content .accent-line{margin-top:20px;margin-bottom:20px}
  .outline-button{
    min-width:176px;
    padding:15px 20px;
    font-size:12px
  }
  .scroll-cue{bottom:18px}

  .services{padding:50px 20px 58px}
  .section-heading{margin-bottom:30px}
  .section-heading h2,.about-copy h2{
    font-size:clamp(27px,8vw,36px);
    line-height:1.25
  }
  .service-grid{grid-template-columns:1fr}
  .service-card{
    min-height:auto;
    padding:28px 10px 32px;
    border-right:0;
    border-bottom:1px solid var(--line)!important
  }
  .service-card:last-child{border-bottom:0!important}
  .service-card p{max-width:340px;margin-inline:auto;font-size:14px}

  .about-photo{min-height:300px}
  .about-copy{padding:8px 22px 54px}
  .about-copy>p:not(.kicker){font-size:14px}

  .signup{padding:46px 18px 56px}
  .signup-form{grid-template-columns:1fr;gap:10px}
  .signup-form input{
    border-right:1px solid #414141;
    min-height:52px;
    border-radius:0;
    font-size:16px
  }
  .signup-form button{
    min-height:50px;
    padding:14px;
    border-radius:0
  }

  .site-footer{
    grid-template-columns:1fr;
    grid-template-areas:"contact" "brand" "copy";
    padding:42px 22px 0;
    row-gap:22px
  }
  .footer-contact{
    padding:0;
    text-align:center;
    border-top:0
  }
  .footer-brand{
    justify-content:center
  }
  .footer-brand img{
    width:min(118px,32vw)
  }
  .copyright{
    margin:14px -22px 0
  }
}

@media(max-width:380px){
  .brand{width:180px}
  .hero-content{width:calc(100% - 24px)}
  .hero-logo{width:275px}
  h1{font-size:32px}
  .hero-content>p{font-size:13.5px}
  .services{padding-inline:16px}
}