
:root{
  --ink:#101510;
  --ink-2:#192019;
  --olive:#384b32;
  --olive-2:#536847;
  --signal:#b7d34b;
  --signal-soft:#d9e9a2;
  --bone:#efece4;
  --paper:#f9f7f1;
  --line:#d3d0c7;
  --muted:#6f756f;
  --white:#fff;
  --max:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bone);
  color:var(--ink);
  font-family:"Inter",system-ui,sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{text-decoration:none;color:inherit}
.container{width:min(var(--max),calc(100% - 42px));margin:auto}
h1,h2,h3,.footer-brand,.rating,.etherea-letter{
  font-family:"Archivo Black",sans-serif;
}

/* HEADER */
.site-header{
  position:sticky;top:0;z-index:60;
  background:rgba(249,247,241,.96);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(16,21,16,.10);
}
.nav{height:82px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:13px}
.brand-mark{
  width:48px;height:48px;
  display:grid;place-items:center;
  background:var(--ink);
  color:var(--signal);
  font-family:"Archivo Black";
  font-size:1.35rem;
  clip-path:polygon(14% 0,86% 0,100% 14%,100% 86%,86% 100%,14% 100%,0 86%,0 14%);
  position:relative;
}
.brand-mark:after{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(183,211,75,.42);
  clip-path:inherit;
}
.brand-copy{display:flex;flex-direction:column;line-height:.95}
.brand-copy strong{
  font-size:.98rem;
  font-weight:800;
  letter-spacing:.10em;
}
.brand-copy small{
  font-family:"IBM Plex Mono";
  font-size:.55rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#6e766f;
  margin-top:7px;
}
.desktop-nav{display:flex;gap:27px;margin-left:auto}
.desktop-nav a{
  font-size:.73rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.desktop-nav a:hover{color:var(--olive-2)}
.nav-actions{display:flex;align-items:center;gap:15px}
.phone-link{
  font-family:"IBM Plex Mono";
  font-size:.72rem;
  font-weight:600;
}

/* BUTTONS */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:12px 20px;
  border:1.5px solid transparent;
  border-radius:0;
  font-size:.78rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.035em;
  transition:.18s ease;
}
.btn:hover{transform:translateY(-2px)}
.btn-primary{
  background:var(--ink);
  color:#fff;
  border-color:var(--ink);
  box-shadow:5px 5px 0 var(--signal);
}
.btn-outline{
  background:transparent;
  border-color:var(--ink);
}
.btn-light{
  background:#fff;
  color:var(--ink);
  border-color:#fff;
}
.btn-outline-light{
  color:#fff;
  border-color:rgba(255,255,255,.7);
}
.btn-lg{padding:14px 24px}

/* HERO */
.hero{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(16,21,16,.025) 1px,transparent 1px),
    linear-gradient(rgba(16,21,16,.025) 1px,transparent 1px),
    var(--paper);
  background-size:84px 84px,84px 84px,auto;
  padding:92px 0 88px;
}
.hero:before{
  content:"";
  position:absolute;
  right:0;top:0;
  width:330px;height:24px;
  background:repeating-linear-gradient(-45deg,var(--ink) 0 14px,var(--signal) 14px 28px);
}
.hero-orb{position:absolute;pointer-events:none}
.orb-one{
  width:480px;height:480px;
  right:-170px;top:80px;
  border:1px solid rgba(56,75,50,.12);
  border-radius:50%;
  box-shadow:
    0 0 0 50px rgba(56,75,50,.025),
    0 0 0 100px rgba(56,75,50,.018);
}
.orb-two{
  width:260px;height:260px;
  right:105px;bottom:-110px;
  border:1px solid rgba(183,211,75,.28);
  border-radius:50%;
}
.hero-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:78px;
  align-items:center;
  position:relative;
  z-index:2;
}
.eyebrow,.section-kicker{
  font-family:"IBM Plex Mono";
  font-size:.62rem;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:#66705f;
}
.eyebrow:before,.section-kicker:before{
  content:"";
  display:inline-block;
  width:28px;height:3px;
  background:var(--signal);
  margin-right:9px;
  vertical-align:middle;
}
.hero h1{
  font-size:clamp(3.8rem,6.7vw,6.7rem);
  line-height:.89;
  letter-spacing:-.055em;
  text-transform:uppercase;
  margin:22px 0 28px;
  max-width:790px;
}
.hero-lead{
  font-size:1.04rem;
  color:#59605a;
  max-width:620px;
}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin:36px 0}
.hero-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  border-top:1px solid rgba(16,21,16,.13);
  max-width:650px;
  margin-top:46px;
}
.hero-meta>div{padding:19px 22px 0 0}
.hero-meta span,.hero-meta strong{display:block}
.hero-meta span{
  font-family:"IBM Plex Mono";
  font-size:.56rem;
  text-transform:uppercase;
  color:#7c837d;
}
.hero-meta strong{font-size:.92rem;margin-top:6px;font-weight:700}

/* TECHNICAL VISUAL */
.hero-visual{min-height:500px;display:grid;place-items:center}
.etherea-card{
  width:min(100%,450px);
  height:500px;
  background:var(--ink);
  color:#fff;
  padding:30px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  border-radius:0;
  box-shadow:16px 16px 0 var(--signal);
  clip-path:polygon(0 0,93% 0,100% 7%,100% 100%,7% 100%,0 93%);
  position:relative;
  overflow:hidden;
}
.etherea-card:before{
  content:"";
  position:absolute;
  width:310px;height:310px;
  border:1px solid rgba(183,211,75,.18);
  border-radius:50%;
  right:-115px;top:90px;
  box-shadow:
    0 0 0 42px rgba(183,211,75,.025),
    0 0 0 84px rgba(183,211,75,.015);
}
.etherea-card:after{
  content:"";
  position:absolute;
  left:30px;right:30px;bottom:56px;
  height:5px;
  background:var(--signal);
}
.card-top,.card-bottom{
  display:flex;justify-content:space-between;gap:12px;
  font-family:"IBM Plex Mono";
  font-size:.55rem;
  letter-spacing:.12em;
  color:#aab0aa;
  position:relative;z-index:2;
}
.card-center{position:relative;z-index:2}
.etherea-letter{
  display:block;
  font-size:7rem;
  line-height:.8;
  color:var(--signal);
}
.card-line{
  width:118px;height:3px;
  background:#fff;
  margin:25px 0 22px;
}
.card-center strong{
  display:block;
  font-family:"IBM Plex Mono";
  font-size:.64rem;
  line-height:1.8;
  letter-spacing:.14em;
  color:#dfe3df;
}

/* PROOF */
.proof-strip{background:var(--olive);color:#fff}
.proof-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.proof-grid>div{
  padding:25px 24px;
  border-right:1px solid rgba(255,255,255,.12);
  position:relative;
}
.proof-grid>div:before{
  content:"";
  position:absolute;
  left:24px;top:0;
  width:30px;height:4px;
  background:var(--signal);
}
.proof-grid>div:last-child{border-right:0}
.proof-grid strong,.proof-grid span{display:block}
.proof-grid strong{font-size:.91rem;font-weight:800}
.proof-grid span{font-size:.66rem;color:#cad2c7;margin-top:4px}

/* SECTIONS */
.section{padding:102px 0}
.section-heading{max-width:810px;margin-bottom:52px}
.section h2{
  font-size:clamp(2.9rem,5vw,5rem);
  line-height:.92;
  letter-spacing:-.05em;
  text-transform:uppercase;
  margin:14px 0 18px;
}
.section p{color:var(--muted)}

/* SERVICES */
.services-section{background:var(--bone)}
.services-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  border-top:1px solid var(--line);
  border-left:1px solid var(--line);
}
.service-card{
  min-height:285px;
  background:var(--paper);
  border:0;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  border-radius:0;
  padding:28px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  position:relative;
  transition:.18s ease;
}
.service-card:hover{
  background:#f0eee6;
  box-shadow:inset 0 -6px 0 var(--signal);
}
.service-dark{
  background:var(--ink);
  color:#fff;
}
.service-accent{
  background:#dfe6ca;
}
.service-number{
  position:absolute;
  left:28px;top:22px;
  font-family:"IBM Plex Mono";
  font-size:.57rem;
  color:#8e958e;
}
.service-dark .service-number{color:#c1c7c1}
.service-card h3{
  font-size:1.34rem;
  line-height:1.04;
  margin:0 0 10px;
  text-transform:uppercase;
}
.service-card p{font-size:.86rem;margin:0}
.service-dark p{color:#b9c0ba}
.service-accent p{color:#5d6759}

/* COMPANY */
.company-section{
  background:var(--ink);
  color:#fff;
  position:relative;
  overflow:hidden;
}
.company-section:after{
  content:"06";
  position:absolute;
  right:-15px;
  bottom:-92px;
  font-family:"Archivo Black";
  font-size:14rem;
  color:rgba(255,255,255,.025);
}
.company-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:80px;
  align-items:center;
  position:relative;
  z-index:2;
}
.company-section p{color:#abb3ac}
.section-kicker.light{color:#c8d2c3}
.company-points{
  margin-top:30px;
  border-top:1px solid rgba(255,255,255,.14);
}
.company-points>div{
  display:grid;
  grid-template-columns:125px 1fr;
  gap:22px;
  padding:15px 0;
  border-bottom:1px solid rgba(255,255,255,.14);
}
.company-points span{
  font-family:"IBM Plex Mono";
  font-size:.56rem;
  text-transform:uppercase;
  color:#919a91;
}
.company-points strong{font-size:.9rem}
.company-panel{
  background:var(--signal);
  color:var(--ink);
  border-radius:0;
  padding:36px;
  box-shadow:12px 12px 0 #050706;
  clip-path:polygon(0 0,94% 0,100% 6%,100% 100%,6% 100%,0 94%);
}
.panel-kicker{
  font-family:"IBM Plex Mono";
  font-size:.58rem;
  text-transform:uppercase;
  letter-spacing:.10em;
  color:#43513c;
}
.rating{
  display:block;
  font-size:5.5rem;
  line-height:.9;
  margin-top:24px;
}
.stars{
  letter-spacing:.15em;
  color:#2d3728;
  margin:16px 0 8px;
}
.company-panel p{color:#43513e}
.company-panel .btn{margin-top:14px}

/* CONTACT */
.contact-section{background:var(--paper)}
.contact-grid{
  display:grid;
  grid-template-columns:.72fr 1.28fr;
  gap:78px;
  align-items:start;
}
.contact-direct{
  margin-top:32px;
  border-top:2px solid var(--ink);
}
.contact-direct>a,.contact-direct>div{
  padding:17px 0;
  border-bottom:1px solid #d4d1c8;
}
.contact-direct span,.contact-direct strong{display:block}
.contact-direct span{
  font-family:"IBM Plex Mono";
  font-size:.56rem;
  text-transform:uppercase;
  color:#7a817a;
}
.contact-direct strong{font-size:.94rem;margin-top:5px}
.contact-card{
  background:var(--bone);
  border:1px solid var(--line);
  border-top:7px solid var(--signal);
  border-radius:0;
  padding:32px;
}
.form-kicker{
  font-family:"IBM Plex Mono";
  font-size:.57rem;
  text-transform:uppercase;
  letter-spacing:.10em;
  color:#687161;
}
.contact-card h3{
  font-size:1.8rem;
  margin:9px 0 26px;
  text-transform:uppercase;
}
form{display:grid;gap:14px}
form label{
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:.76rem;
  font-weight:700;
}
.form-two{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
input,select,textarea{
  width:100%;
  padding:13px 14px;
  border:1px solid #bdbab2;
  border-radius:0;
  background:#fff;
  font:inherit;
}
input:focus,select:focus,textarea:focus{
  outline:2px solid var(--signal);
  outline-offset:1px;
}
textarea{resize:vertical}
.full-btn{width:100%;margin-top:5px}
.form-note{
  font-size:.72rem!important;
  margin:0!important;
  color:#777e77!important;
}

/* CTA */
.final-cta{
  background:var(--olive);
  color:#fff;
  padding:78px 0;
  position:relative;
  overflow:hidden;
}
.final-cta:after{
  content:"E";
  position:absolute;
  right:18px;
  bottom:-70px;
  font-family:"Archivo Black";
  font-size:12rem;
  color:rgba(255,255,255,.05);
}
.final-cta-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
  position:relative;
  z-index:2;
}
.final-cta h2{
  font-size:clamp(2.9rem,5vw,4.8rem);
  line-height:.9;
  margin:10px 0;
  text-transform:uppercase;
}
.final-actions{display:flex;gap:10px;flex-wrap:wrap}

/* FOOTER */
.footer{
  background:#0a0f0a;
  color:#d7ddd7;
  padding:64px 0 110px;
}
.footer-grid{
  display:grid;
  grid-template-columns:1.45fr 1fr 1fr 1fr;
  gap:44px;
}
.footer-brand{
  font-size:1.05rem;
  text-transform:uppercase;
}
.footer p{color:#747d75;max-width:360px}
.footer h3{
  font-family:"IBM Plex Mono";
  font-size:.57rem;
  text-transform:uppercase;
  letter-spacing:.09em;
  color:#fff;
}
.footer a,.footer span{
  display:block;
  color:#8d978e;
  font-size:.8rem;
  margin:8px 0;
}
.footer a:hover{color:#fff}
.mobile-bar{display:none}

/* RESPONSIVE */
@media(max-width:1000px){
  .services-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:900px){
  .desktop-nav{display:none}
  .hero-grid,.company-grid,.contact-grid{grid-template-columns:1fr}
  .hero-visual{min-height:auto;margin-top:22px}
  .proof-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .container{width:min(var(--max),calc(100% - 28px))}
  .nav{height:72px}
  .brand-copy small{display:none}
  .nav-actions .btn,.phone-link{display:none}
  .hero{padding:58px 0 54px}
  .hero h1{font-size:3.35rem}
  .hero-meta{grid-template-columns:1fr}
  .etherea-card{
    height:auto;
    aspect-ratio:4/4.6;
    box-shadow:10px 10px 0 var(--signal);
  }
  .proof-grid{grid-template-columns:1fr 1fr}
  .proof-grid>div{padding:18px 12px}
  .section{padding:76px 0}
  .services-grid,.form-two,.footer-grid{grid-template-columns:1fr}
  .company-points>div{grid-template-columns:1fr;gap:5px}
  .final-cta-inner{align-items:flex-start;flex-direction:column}
  .mobile-bar{
    position:fixed;
    left:10px;right:10px;bottom:10px;
    z-index:80;
    display:grid;
    grid-template-columns:1fr 1fr;
    background:#0a0f0a;
    padding:6px;
    box-shadow:0 14px 36px rgba(0,0,0,.28);
  }
  .mobile-bar a{
    text-align:center;
    padding:12px;
    color:#fff;
    font-size:.8rem;
    font-weight:800;
    text-transform:uppercase;
  }
  .mobile-bar a:last-child{
    background:var(--olive-2);
  }
}
