:root{--green:#21513B;--green-2:#2c6a4e;--green-tint:#eef3f0;--green-line:#cfded5;--ink:#0a0a0a;--body:#2b2f2d;--muted:#5f6663;--line:#e6e8e7;--bg-soft:#f7f8f7;--max:1160px;--r:14px}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:"DM Sans",system-ui,-apple-system,"Segoe UI",sans-serif;font-weight:400;color:var(--body);background:#fff;font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased}
strong,b{font-weight:400}
a{color:var(--green);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
img{max-width:100%;display:block}
.wrap{max-width:var(--max);margin:0 auto;padding:0 28px}
.draft{background:#111;color:#e9e9e9;font-size:12.5px;letter-spacing:.04em;text-align:center;padding:7px 16px}
.draft span{color:#9fd3b6}
/* header */
.site-h{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line)}
.site-h .wrap{display:flex;align-items:center;gap:28px;height:72px}
.brand img{height:30px;width:auto}
.nav{display:flex;gap:26px;margin-left:auto;align-items:center}
.nav a{color:var(--ink);font-size:15px;letter-spacing:.01em}
.nav a.cur{color:var(--green)}
.nav .login{color:var(--muted);font-size:14px;border-left:1px solid var(--line);padding-left:22px}
.btn{display:inline-flex;align-items:center;gap:8px;background:var(--green);color:#fff !important;border-radius:999px;padding:11px 20px;font-size:15px;letter-spacing:.01em;transition:background .15s,transform .15s;text-decoration:none !important;border:0;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--green-2);transform:translateY(-1px)}
.btn.ghost{background:transparent;color:var(--green) !important;border:1px solid var(--green-line)}
.btn.ghost:hover{background:var(--green-tint)}
.btn .ar{transition:transform .15s}.btn:hover .ar{transform:translateX(3px)}
.menu-t{display:none}
.menu-b{display:none;cursor:pointer;margin-left:auto;padding:8px;border:1px solid var(--line);border-radius:10px;font-size:14px;color:var(--ink)}
/* type */
h1,h2,h3,h4{color:var(--ink);margin:0;font-weight:500;letter-spacing:-.01em}
h1{font-size:clamp(38px,5.4vw,64px);line-height:1.06;letter-spacing:-.025em}
h1.page{font-size:clamp(34px,4.4vw,52px)}
h2{font-size:15px;letter-spacing:.14em;color:var(--green);font-weight:500;margin-bottom:14px}
h3{font-size:22px;line-height:1.3;margin-bottom:10px}
h4{font-size:17px;margin-bottom:6px}
.claim{font-size:clamp(26px,3vw,36px);line-height:1.2;color:var(--ink);letter-spacing:-.015em;margin:0 0 18px;max-width:22ch}
.claim.wide{max-width:32ch}
.lede{font-size:clamp(18px,1.6vw,21px);color:var(--muted);max-width:60ch;margin:22px 0 0}
p{margin:0 0 16px;max-width:68ch}
.muted{color:var(--muted)}
.small{font-size:14px}
/* sections */
section{padding:92px 0}
section.tight{padding:64px 0}
.soft{background:var(--bg-soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.dark{background:#0d1512;color:#c9d3ce}
.dark h2{color:#8fc7a8}.dark .claim,.dark h3,.dark h4{color:#fff}.dark p{color:#c9d3ce}.dark a{color:#9fd3b6}
/* hero */
.hero{position:relative;overflow:hidden;padding:110px 0 96px;border-bottom:1px solid var(--line)}
.hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(ellipse at 78% 30%,#000 0%,transparent 62%);-webkit-mask-image:radial-gradient(ellipse at 78% 30%,#000 0%,transparent 62%);opacity:.8}
.hero:after{content:"";position:absolute;right:-180px;top:-160px;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(33,81,59,.14),rgba(33,81,59,0) 65%)}
.hero .wrap{position:relative;z-index:1}
.eyebrow{display:inline-block;font-size:13px;letter-spacing:.16em;color:var(--green);margin-bottom:22px}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.page-hero{padding:84px 0 64px;border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.page-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(90deg,transparent 40%,#000 100%);-webkit-mask-image:linear-gradient(90deg,transparent 40%,#000 100%);opacity:.55}
.page-hero .wrap{position:relative}
.crumb{font-size:13px;letter-spacing:.12em;color:var(--muted);margin-bottom:18px}
.crumb a{color:var(--muted)}
/* grids and cards */
.grid{display:grid;gap:22px}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
.card{border:1px solid var(--line);border-radius:var(--r);padding:28px;background:#fff;transition:border-color .15s,box-shadow .15s,transform .15s;display:flex;flex-direction:column}
a.card{color:inherit;text-decoration:none}
a.card:hover{border-color:var(--green-line);box-shadow:0 10px 30px -18px rgba(13,40,28,.35);transform:translateY(-2px)}
.card .k{font-size:12.5px;letter-spacing:.14em;color:var(--green);margin-bottom:14px}
.card p{font-size:15.5px;color:var(--muted);margin-bottom:0}
.card .go{margin-top:auto;padding-top:18px;font-size:14.5px;color:var(--green)}
.num{font-size:13px;color:var(--green);font-family:"DM Mono",ui-monospace,monospace;margin-bottom:12px;letter-spacing:.06em}
.split{display:grid;grid-template-columns:1fr 1.25fr;gap:64px;align-items:start}
.split.even{grid-template-columns:1fr 1fr}
.list{list-style:none;padding:0;margin:0}
.list li{padding:14px 0 14px 26px;border-top:1px solid var(--line);position:relative;margin-bottom:4px}
.list li:last-child{border-bottom:1px solid var(--line)}
.list li:before{content:"";position:absolute;left:2px;top:24px;width:9px;height:9px;border:1.5px solid var(--green);border-radius:2px;transform:rotate(45deg)}
.steps{counter-reset:s;display:grid;gap:0}
.steps .st{display:grid;grid-template-columns:70px 1fr;gap:18px;padding:24px 0;border-top:1px solid var(--line)}
.steps .st:last-child{border-bottom:1px solid var(--line)}
.steps .st .n{font-family:"DM Mono",monospace;color:var(--green);font-size:14px;padding-top:4px}
.dark .steps .st{border-color:#24332c}
.proof{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#fff}
.proof>div{padding:26px;border-right:1px solid var(--line)}
.proof>div:last-child{border-right:0}
.proof .v{font-size:30px;color:var(--ink);letter-spacing:-.02em;line-height:1.1;margin-bottom:8px}
.proof .l{font-size:14px;color:var(--muted)}
.tag{display:inline-block;font-size:12px;letter-spacing:.1em;border:1px solid var(--green-line);color:var(--green);border-radius:999px;padding:3px 10px;margin:0 6px 6px 0;background:var(--green-tint)}
.tag.dev{border-color:#e5d3a4;color:#7a5b12;background:#fbf5e4}
.ph{background:#fff4c2;color:#5b4700;border-radius:4px;padding:0 5px;font-size:.92em}
.note{border:1px dashed #d8c27a;background:#fffbea;border-radius:10px;padding:14px 16px;font-size:14px;color:#5b4700;margin:18px 0}
.quote{border:1px solid var(--line);border-radius:var(--r);padding:30px;background:#fff;position:relative}
.quote .ex{position:absolute;top:16px;right:16px}
.quote blockquote{margin:0 0 18px;font-size:19px;line-height:1.5;color:var(--ink)}
.quote .who{font-size:14px;color:var(--muted)}
.band{border-radius:22px;background:linear-gradient(135deg,#123a2a,#21513B 60%,#2c6a4e);color:#dfe9e3;padding:56px;display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:center}
.band .claim{color:#fff;margin:0}
.band p{color:#cfe0d6;margin:12px 0 0}
.band .btn{background:#fff;color:var(--green) !important}
.band .btn:hover{background:#eef3f0}
.band .side{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.band .side .ph2{font-size:15px;color:#cfe0d6}
.portrait{border-radius:18px;overflow:hidden;border:1px solid var(--line)}
.kv{display:grid;grid-template-columns:180px 1fr;gap:10px 24px;font-size:15.5px}
.kv div:nth-child(odd){color:var(--muted)}
form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:block;font-size:14px;color:var(--muted);margin:0 0 6px}
input,textarea,select{width:100%;font-family:inherit;font-size:16px;padding:12px 14px;border:1px solid #d7dbd9;border-radius:10px;background:#fff;color:var(--ink);margin-bottom:16px}
textarea{min-height:130px;resize:vertical}
input:focus,textarea:focus{outline:2px solid var(--green-line);border-color:var(--green)}
button[disabled]{opacity:.55;cursor:not-allowed}
/* footer */
.site-f{border-top:1px solid var(--line);padding:64px 0 36px;background:#fff;font-size:14.5px}
.site-f .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.site-f h5{font-size:12.5px;letter-spacing:.14em;color:var(--ink);font-weight:500;margin:0 0 14px}
.site-f ul{list-style:none;padding:0;margin:0}.site-f li{margin-bottom:8px}
.site-f a{color:var(--muted)}.site-f a:hover{color:var(--green)}
.site-f .legal{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:48px;padding-top:22px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
.site-f .brand img{height:34px;margin-bottom:16px}
/* responsive */
@media (max-width:1020px){.g4{grid-template-columns:repeat(2,1fr)}.proof{grid-template-columns:repeat(2,1fr)}.proof>div:nth-child(2){border-right:0}.proof>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.site-f .cols{grid-template-columns:1fr 1fr}.nav{gap:18px}.nav a{font-size:14px}}
@media (max-width:880px){
 .menu-b{display:block}
 .nav{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;flex-direction:column;align-items:flex-start;gap:0;padding:8px 28px 22px;border-bottom:1px solid var(--line);box-shadow:0 18px 30px -20px rgba(0,0,0,.25)}
 .nav a{padding:12px 0;width:100%;border-bottom:1px solid var(--line);font-size:16px}
 .nav .login{border-left:0;padding-left:0}
 .nav .btn{margin-top:14px;width:auto;border-bottom:0}
 .menu-t:checked ~ .nav{display:flex}
 .g2,.g3,.split,.split.even,.band{grid-template-columns:1fr}
 .split{gap:36px}
 section{padding:68px 0}.hero{padding:76px 0 64px}
 .band{padding:36px}
}
@media (max-width:560px){body{font-size:16px}.wrap{padding:0 20px}.g4,.proof{grid-template-columns:1fr}.proof>div{border-right:0;border-bottom:1px solid var(--line)}.proof>div:last-child{border-bottom:0}form .row{grid-template-columns:1fr}.kv{grid-template-columns:1fr;gap:2px}.kv div:nth-child(even){margin-bottom:10px}.site-f .cols{grid-template-columns:1fr}.steps .st{grid-template-columns:44px 1fr}.card{padding:22px}}

/* industries dropdown */
.dd{position:relative;display:inline-flex}
.dd-m{display:none;position:absolute;top:100%;left:-18px;padding-top:14px;z-index:60}
.dd-m>div{background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px -18px rgba(16,40,28,.25);padding:10px 0;min-width:290px}
.dd-m a{display:block;padding:9px 18px;font-size:14.5px}
.dd:hover .dd-m,.dd:focus-within .dd-m{display:block}
@media (max-width:880px){.dd{display:block;width:100%}.dd-m{display:block;position:static;padding:0}.dd-m>div{border:0;box-shadow:none;padding:0 0 0 14px;min-width:0}}

/* photography accents */
.has-photo{position:relative}
.has-photo .wrap{position:relative;z-index:1}
.hero-photo{position:absolute;top:0;right:0;bottom:0;width:46%;background-size:cover;background-position:center 40%;opacity:.34;filter:grayscale(1) contrast(.92);-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 30%,#000 75%),linear-gradient(0deg,transparent 0%,#000 30%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 30%,#000 75%);pointer-events:none}
.hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,rgba(255,255,255,.4) 40%,rgba(255,255,255,0) 70%),linear-gradient(0deg,rgba(255,255,255,.85),rgba(255,255,255,0) 35%)}
.hero-photo.arch{width:44%;opacity:.6;background-position:center 30%}
.has-photo.page-hero:before{display:none}
.band{background:linear-gradient(135deg,rgba(18,58,42,.97),rgba(33,81,59,.93) 60%,rgba(44,106,78,.9)),url(/assets/img/photo/folio-detail.webp) center 60%/cover}
.portrait.mono img{filter:grayscale(1);width:100%;height:auto}
@media (max-width:880px){.hero-photo{width:100%;opacity:.16}.hero-photo.arch{width:100%;opacity:.2}}
/* two-column eyebrow alignment: eyebrow sits above both columns; statement and body top-align */
@media (min-width:881px){
.split>div:first-child>h2:first-child{line-height:21px;white-space:nowrap}
.split:not([style*="align-items:center"]):has(>div:first-child>h2:first-child+*)>div:nth-child(2){padding-top:35px}
.split:not([style*="align-items:center"]):has(>div:first-child>h2:first-child+*)>div:nth-child(2)>:first-child{margin-top:0}
}