
:root{
  --bg:#081017;
  --bg2:#0b141b;
  --panel:#0d171e;
  --line:#26313a;
  --text:#f4f5f3;
  --muted:#aab0b3;
  --sage:#a4bd3c;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:Sora,Arial,sans-serif;font-weight:300}
a{color:inherit;text-decoration:none}
.site-header{height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 3.2vw;background:#070b0e;border-bottom:1px solid #151c21;position:sticky;top:0;z-index:50}
.header-brand{display:flex;align-items:center;height:42px}
.header-brand img{display:block;width:190px;max-height:38px;object-fit:contain}
.nav{display:flex;align-items:center;gap:38px;font-size:11px}
.nav a{padding:26px 0 20px;border-bottom:1px solid transparent}
.nav a:hover{color:var(--sage);border-color:var(--sage)}
.nav-contact{border:1px solid var(--sage)!important;border-radius:20px;padding:8px 18px!important}
.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:22px}

.hero{min-height:520px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:linear-gradient(#1a252e,#081017)}
.sky{position:absolute;inset:0;background:
radial-gradient(circle at 18% 22%,rgba(155,171,184,.12),transparent 22%),
radial-gradient(circle at 72% 16%,rgba(170,180,190,.10),transparent 24%),
linear-gradient(#222e38 0,#172129 35%,#0d1419 75%,#091016 100%)}
.mountain{position:absolute;bottom:10%;background:linear-gradient(145deg,#1d2830,#05090c 74%);filter:drop-shadow(0 -3px 8px rgba(255,255,255,.02))}
.back-left{left:-9%;width:52%;height:76%;clip-path:polygon(0 100%,12% 77%,26% 32%,36% 45%,49% 17%,63% 58%,77% 34%,100% 100%);opacity:.95}
.back-mid{left:24%;width:50%;height:67%;clip-path:polygon(0 100%,20% 65%,32% 39%,45% 60%,57% 29%,74% 69%,100% 100%);opacity:.88}
.back-right{right:-8%;width:46%;height:56%;clip-path:polygon(0 100%,20% 67%,35% 42%,48% 61%,67% 35%,100% 100%);opacity:.83}
.fore-left{left:-12%;bottom:0;width:58%;height:39%;clip-path:polygon(0 100%,0 38%,21% 66%,42% 39%,63% 72%,83% 51%,100% 100%);background:#05090c}
.fore-right{right:-10%;bottom:0;width:55%;height:39%;clip-path:polygon(0 100%,0 100%,19% 61%,41% 73%,62% 36%,100% 62%,100% 100%);background:#05090c}
.lake{position:absolute;left:0;right:0;bottom:0;height:22%;background:
linear-gradient(rgba(10,16,21,.25),rgba(6,11,14,.95)),
repeating-linear-gradient(180deg,rgba(164,189,60,.035) 0 1px,transparent 1px 10px)}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(4,7,9,.06),rgba(4,7,9,.12) 55%,rgba(3,7,9,.5) 78%,rgba(5,9,12,.9) 100%)}
.hero-content{position:relative;z-index:3;text-align:center}
.hero-logo{display:block;width:min(520px,68vw);margin:0 auto}
.accent-line{width:76px;height:1px;background:var(--sage);margin:20px auto 24px}
.hero h1{font-size:25px;font-weight:400;color:var(--sage);margin:0 0 20px}
.hero p{margin:0;color:#fff;font-size:15px;line-height:1.65}
.outline-btn{display:inline-flex;justify-content:space-between;align-items:center;min-width:182px;border:1px solid var(--sage);color:var(--sage);padding:13px 20px;margin-top:24px;font-size:11px;letter-spacing:.05em}
.scroll-cue{display:flex;width:28px;height:28px;border:1px solid #d9ddda;border-radius:50%;align-items:center;justify-content:center;margin:26px auto 0;font-size:18px}

.section{padding:66px 7vw;border-top:1px solid #161e24}
.eyebrow{text-align:center;color:var(--sage);font-size:10px;letter-spacing:.08em;margin-bottom:14px}
.eyebrow.left{text-align:left}
.section h2{margin:0 auto 42px;text-align:center;font-size:24px;line-height:1.48;font-weight:300}
.section h2 span{color:var(--sage)}
.values-grid{display:grid;grid-template-columns:repeat(4,1fr);max-width:1200px;margin:auto}
.values-grid article{text-align:center;padding:5px 28px;border-right:1px solid var(--line)}
.values-grid article:last-child{border-right:0}
.value-icon,.project-icon{width:50px;height:50px;fill:none;stroke:var(--sage);stroke-width:1.4;margin-bottom:8px}
.values-grid h3,.project h3{font-size:11px;color:var(--sage);font-weight:400;letter-spacing:.05em}
.values-grid p,.project p{font-size:12px;line-height:1.65;color:#e1e3e3}

.work{background:linear-gradient(90deg,#0b1116,#10181f,#0b1116)}
.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);max-width:820px;margin:auto}
.project{text-align:center;min-height:120px;padding:10px 35px;border-right:1px solid var(--line)}
.project:last-child{border-right:0}
.project-icon{stroke:#fff}
.madio-word{font-size:48px;color:#9fc136;line-height:1;display:inline-block;position:relative}
.madio-word span{position:absolute;font-size:24px;right:-3px;top:-10px}
.madio p{color:#fff;margin-top:12px}

.services-grid{max-width:950px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
.services-grid>div{background:var(--bg);padding:32px}
.services-grid strong{color:var(--sage);font-size:12px;letter-spacing:.08em}
.services-grid h3{font-weight:400}
.services-grid p{font-size:13px;color:var(--muted);line-height:1.7}

.about{max-width:920px;margin:auto}
.about p{max-width:660px;margin:auto;text-align:center;font-size:14px;color:var(--muted);line-height:1.8}

.contact-section{padding:12px 7vw 14px;background:
radial-gradient(circle at 4% 100%,rgba(28,43,53,.42),transparent 32%),
linear-gradient(#081017,#09131a)}
.contact-panel{max-width:1180px;margin:auto;border:1px solid #1e2a32;border-radius:14px;padding:32px 42px;display:grid;grid-template-columns:.7fr 1.25fr;gap:75px;background:rgba(8,16,23,.72);box-shadow:0 18px 70px rgba(0,0,0,.2)}
.contact-copy h2{font-weight:300;font-size:29px;line-height:1.35;margin:0 0 18px}
.contact-copy p{font-size:13px;color:var(--muted);line-height:1.8}
.direct-mail{display:inline-flex;align-items:center;gap:10px;color:var(--sage);font-size:13px;margin-top:15px}
.mail-icon{font-size:21px}
.contact-form{display:flex;flex-direction:column;gap:8px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
input,textarea,button{font:inherit;font-size:11px;color:#fff;background:#0d151b;border:1px solid #39464e;padding:11px 12px}
input::placeholder,textarea::placeholder{color:#d3d5d5}
input:focus,textarea:focus{outline:1px solid var(--sage);border-color:var(--sage)}
textarea{height:92px;resize:vertical}
button{background:var(--sage);color:#0b1116;border-color:var(--sage);font-weight:600;cursor:pointer}
button span{float:right}
.honeypot{position:absolute;left:-10000px}
.form-status{margin:4px 0 0;min-height:16px;font-size:11px;color:var(--sage)}

footer{min-height:78px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 7vw;font-size:10px}
.footer-left{display:flex;align-items:center;gap:24px}
.footer-logo{width:150px;display:block}
.divider{width:1px;height:32px;background:#52606a}
.footer-tagline,footer a{color:var(--sage)}

@media(max-width:780px){
  .site-header{padding:0 18px}.header-brand img{width:160px}.menu-toggle{display:block}.nav{display:none;position:absolute;top:68px;right:0;left:0;background:#070b0e;padding:18px;flex-direction:column;gap:12px;border-top:1px solid var(--line)}.nav.open{display:flex}.nav a{padding:8px 0}.nav-contact{border-radius:0!important;border:0!important}
  .hero{min-height:500px}.hero-logo{width:82vw}.hero h1{font-size:19px}.hero p{font-size:13px}
  .section{padding:54px 24px}.section h2{font-size:21px}.values-grid,.projects-grid,.services-grid{grid-template-columns:1fr}
  .values-grid article,.project{border-right:0;border-bottom:1px solid var(--line);padding:28px 8px}.values-grid article:last-child,.project:last-child{border-bottom:0}
  .contact-section{padding:12px 14px}.contact-panel{grid-template-columns:1fr;gap:34px;padding:28px 22px}.two{grid-template-columns:1fr}
  footer{padding:25px 22px;align-items:flex-start;gap:14px;flex-direction:column}.footer-left{flex-wrap:wrap}.footer-logo{width:135px}
}
