:root{--ink:#19231f;--line:#dce7df;--green:#21664d;--deep:#123c31;--paper:#f8faf7;--mint:#c7ebbd}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif}.shell{width:min(1180px,calc(100% - 48px));margin:auto}header{height:82px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid var(--line);font-size:12px;font-weight:700}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;color:var(--ink)}.brand b{display:grid;place-items:center;width:28px;height:28px;background:var(--deep);color:#fff;border-radius:8px;letter-spacing:-2px}.brand b span{color:var(--mint)}header small{font:500 10px 'DM Mono',monospace;letter-spacing:.13em;color:#617067}.back{justify-self:end;text-decoration:none;color:var(--green);border:1px solid #cddbd0;padding:9px 12px;border-radius:999px}.hero{min-height:435px;padding:62px 0 36px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(360px,.8fr);align-items:center;gap:54px}.eyebrow{font:500 10px 'DM Mono',monospace;letter-spacing:.12em;color:var(--green)}h1{font-size:clamp(42px,5.25vw,70px);line-height:1.04;letter-spacing:-.065em;margin:0;max-width:680px}h1 em{display:block;color:var(--green);font-weight:500}.intro{font-size:15px;line-height:1.65;max-width:590px;color:#506057}.hint{font-size:12px;color:#819087}.visual{position:relative;height:325px;border:1px solid #d2e2d5;border-radius:28px;overflow:hidden;background:linear-gradient(145deg,#f0f8ef,#dcefdc 60%,#c5e5c1);box-shadow:0 20px 42px #1a55391f}.visual:before{content:"";position:absolute;inset:15px;border:1px solid #23634722;border-radius:18px}.kicker{position:absolute;top:28px;left:30px;color:#347357;font:500 10px 'DM Mono',monospace;letter-spacing:.1em}.screen{position:absolute;left:32px;top:74px;width:160px;height:118px;padding:17px;border-radius:14px;background:#fff;box-shadow:0 14px 25px #1b543a24;transform:rotate(-4deg)}.screen i{display:block;width:72px;height:5px;margin:8px 0;border-radius:99px;background:#d9e7dc}.screen i:first-child{width:52px;height:7px;margin-bottom:16px;background:#174c39}.screen b{display:block;margin-top:14px;width:76px;padding:6px 0;border-radius:99px;background:#287153;color:white;text-align:center;font:500 7px 'DM Mono',monospace}.node{position:absolute;z-index:2;padding:9px 12px;border:1px solid #1e5d3f28;border-radius:999px;background:#ffffffd8;box-shadow:0 9px 18px #1b543a19;color:#255c45;font-size:10px;font-weight:700}.one{left:185px;top:60px}.two{right:32px;top:117px}.three{left:112px;bottom:46px}.four{right:42px;bottom:42px;background:#1b5941;color:white}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:16px 0 28px}.card{min-height:220px;position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:18px;border-radius:18px;overflow:hidden;text-decoration:none;color:white;background:linear-gradient(90deg,#063e2ddd,#063e2d70),var(--card-image) center/cover;box-shadow:0 12px 28px #10433135;transition:.22s}.card:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#063e2dea 0%,transparent 65%);z-index:0}.card>*{position:relative;z-index:1}.card:hover{transform:translateY(-6px);box-shadow:0 20px 35px #1043314a}.pill{align-self:flex-end;font:500 9px 'DM Mono',monospace;letter-spacing:.05em;color:#d9ffc8;border:1px solid #cbefbe40;padding:7px 8px;border-radius:99px;background:#0d523a99}.pill:before{content:"•";margin-right:4px;color:#b8ff9e}.card strong{display:block;font-size:18px;letter-spacing:-.03em}.card small{display:block;color:#d9f2df;font-size:12px;margin-top:4px}.card:after{content:"↗";position:absolute;right:18px;bottom:16px;color:var(--mint);font-size:21px;z-index:2}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:18px 0 26px;color:#8a968d;font:400 10px 'DM Mono',monospace}@media(max-width:840px){.hero{grid-template-columns:1fr;gap:30px;padding-top:50px}.visual{width:100%;max-width:520px}.gallery{grid-template-columns:repeat(2,1fr)}}@media(max-width:520px){.shell{width:calc(100% - 32px)}header{height:68px;grid-template-columns:1fr auto}header small{display:none}.hero{min-height:0;padding:46px 0 20px}.visual{height:270px}.two{right:16px}.four{right:20px}.three{left:68px}.gallery{grid-template-columns:1fr}.card{min-height:190px}footer{gap:14px}}
