﻿:root {
 --forest:#10251e;
 --forest2:#19382d;
 --mint:#b8d7b9;
 --paper:#f4f5ef;
 --ink:#172b23;
 --muted:#718076;
 --line:#dce1d8;
 --sans:"DM Sans",Arial,sans-serif;
 --display:"Manrope",Arial,sans-serif;
 --serif:"Playfair Display",Georgia,serif;
}
* {box-sizing:border-box}
html {scroll-behavior:smooth}
body {margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans)}
a {color:inherit;text-decoration:none}
header {height:82px;padding:0 7%;display:flex;align-items:center;justify-content:space-between}
.brand {display:flex;align-items:center;gap:10px;font:800 21px var(--display);letter-spacing:-1px}
.brand img {width:34px;height:38px}
.light {font-weight:400;color:#79917f}
nav {display:flex;gap:30px;margin-left:auto;margin-right:35px}
nav a {font-size:11px;font-weight:700;color:#58665d}
#language-toggle {border:1px solid var(--line);background:transparent;border-radius:50%;width:36px;height:36px;cursor:pointer}
.menu-toggle {display:none}
.hero {min-height:650px;background:var(--forest);color:white;padding:100px 9% 75px;position:relative;display:grid;grid-template-columns:1fr 1fr;gap:6%;align-items:center;overflow:hidden}
.hero:before {content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:65px 65px}
.hero-content,.hero-visual {position:relative;z-index:1}
.eyebrow,.kicker,.hero-footer,.visual-caption {font-size:9px;letter-spacing:.16em;font-weight:700}
.eyebrow {color:#b8d7b9}
.hero h1 {font:600 clamp(43px,5vw,68px)/1.1 var(--display);letter-spacing:-3px;margin:30px 0}
h1 em,h2 em {font-family:var(--serif);font-weight:500;color:var(--mint)}
.hero-content>p:not(.eyebrow) {font-size:14px;line-height:1.9;color:#bdc9c0;max-width:500px}
.button {display:inline-block;margin-top:25px;padding:16px 22px;background:#c5dda9;color:#183026;font-size:11px;font-weight:700}
.hero-visual {height:400px;border:1px solid #78917a44;border-radius:48% 48% 3px 3px;background:radial-gradient(ellipse at 50% 40%,#41664a,#1b3c2d 60%,#10251e);display:flex;align-items:center;justify-content:center}
.visual-circle {position:absolute;inset:25px;border:1px solid #b6d8ad66;border-radius:50%;transform:rotate(-20deg)}
.visual-tree {font-size:170px;color:#b4cf9e;text-shadow:0 0 35px #a7d69c66;z-index:1}
.visual-data {position:absolute;background:#f0f3e9;color:#1c3327;padding:13px 15px;font-size:8px;letter-spacing:.1em;box-shadow:0 12px 30px #06170e55}
.visual-data strong {display:block;font:700 22px var(--display);margin-top:8px}
.data-one {left:-25px;top:80px}
.data-two {right:-20px;bottom:70px}
.visual-caption {position:absolute;bottom:-35px;color:#94aa98;font-size:8px}
.hero-footer {position:absolute;bottom:25px;left:9%;right:9%;display:flex;justify-content:space-between;color:#83968a;font-size:8px}
.section {padding:100px 10%}
.kicker {color:#718276;margin-bottom:30px}
.two-columns {display:grid;grid-template-columns:1.1fr .9fr;gap:10%;align-items:start}
h2 {font:600 clamp(34px,4vw,52px)/1.16 var(--display);letter-spacing:-2px;margin:0 0 30px}
.section p {font-size:13px;line-height:1.9;color:#69776d}
.principles {border-top:1px solid var(--line);margin-top:55px;padding-top:25px;display:grid;grid-template-columns:repeat(3,1fr);gap:30px}
.principles span,.sector>span {font-size:10px;color:#8da18e}
.principles h3 {font:700 14px var(--display)}
.principles p {font-size:11px}
.pale {background:#e9ede5}
.cards {display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:40px}
.cards article {background:#f8f9f5;padding:27px;min-height:220px}
.cards article span {font-size:8px;letter-spacing:.15em;color:#829385}
.cards h3 {font:700 16px var(--display);margin-top:30px}
.cards p {font-size:11px}
.dark {background:var(--forest);color:white}
.dark .kicker {color:#9caf9e}
.dark p {color:#b7c4b9}
.tech-list>div {border-bottom:1px solid #ffffff25;padding:15px 0}
.tech-list>div:first-child {border-top:1px solid #ffffff25}
.tech-list span {font-size:9px;color:#9caf9e}
.tech-list h3 {font:600 15px var(--display);margin:8px 0}
.tech-list p {font-size:11px;margin:0}
.sector {display:grid;grid-template-columns:40px 1fr 1fr;gap:20px;align-items:center;border-top:1px solid var(--line);padding:22px 0}
.sector h2 {font-size:25px;margin:0}
.sector p {font-size:11px}
.tags {display:flex;gap:10px;flex-wrap:wrap}
.tags span {border:1px solid #c9d4c8;padding:9px 12px;font-size:9px;color:#637367}
.vision {background:#cbdcbe;text-align:center;padding:85px 10%}
.vision p {font:500 clamp(25px,3vw,38px)/1.4 var(--serif);max-width:800px;margin:0 auto 25px;color:#294332}
.vision span {font-size:8px;letter-spacing:.2em;font-weight:700;color:#607b61}
.email {display:inline-block;color:#c5dda9;font:600 21px var(--display);border-bottom:1px solid #6b896d;padding-bottom:8px;margin:15px 0}
footer {background:#0b1c16;color:#84968a;padding:28px 7%;display:flex;justify-content:space-between;align-items:center;font-size:9px}
footer .brand {color:#eaf0e8;font-size:18px}
footer .brand img {width:28px}
@media(max-width:850px) {
 nav {gap:14px}
 .hero {padding-left:7%;padding-right:7%}
 .section {padding:80px 7%}
 .cards {grid-template-columns:repeat(2,1fr)}
}
@media(max-width:650px) {
 header {height:70px;padding:0 6%}
 .menu-toggle {display:block;margin-left:auto;border:0;background:none;font-size:23px}
 nav {display:none;position:absolute;top:70px;left:0;right:0;background:var(--paper);padding:25px 7%;z-index:5;flex-direction:column}
 nav.open {display:flex}
 #language-toggle {margin-left:15px}
 .hero {display:block;padding:70px 7% 90px}
 .hero h1 {font-size:46px}
 .hero-visual {height:300px;margin-top:65px}
 .hero-footer {left:7%;right:7%;font-size:7px}
 .section {padding:70px 7%}
 .two-columns {grid-template-columns:1fr;gap:10px}
 .principles,.cards {grid-template-columns:1fr}
 .sector {grid-template-columns:25px 1fr}
 .sector p {grid-column:2}
 footer {flex-wrap:wrap;gap:15px}
 footer>span {width:100%;order:3}
}
