:root { --green:#315a40; --green-dark:#1f3d2b; --dark:#171c18; --muted:#687269; --paper:#f4f6f1; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { min-height:100vh; margin:0; background:radial-gradient(circle at 12% 7%,#e4eee1 0,transparent 28%),var(--paper); color:var(--dark); font-family:Inter,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; }
.landing-header { width:min(1120px,calc(100% - 40px)); min-height:90px; display:flex; align-items:center; justify-content:space-between; gap:20px; margin:auto; }
.landing-brand { display:flex; align-items:center; gap:12px; color:var(--dark); text-decoration:none; font-size:22px; font-weight:800; letter-spacing:-.045em; }
.landing-brand i,.landing-footer i { width:8px; height:8px; display:inline-block; border-radius:50%; background:var(--green); box-shadow:0 0 0 6px rgba(49,90,64,.08); }
.landing-header-action,.landing-primary,.landing-secondary { display:inline-flex; align-items:center; justify-content:center; border-radius:999px; text-decoration:none; font-weight:750; }
.landing-header-action { min-height:46px; padding:0 20px; background:rgba(255,255,255,.82); color:var(--green); border:1px solid rgba(49,90,64,.1); box-shadow:0 8px 24px rgba(35,62,43,.05); font-size:11px; }
main { width:min(1120px,calc(100% - 40px)); margin:0 auto; }
.landing-hero { display:grid; grid-template-columns:minmax(0,1.28fr) minmax(300px,.72fr); gap:28px; align-items:stretch; padding:28px; border:1px solid rgba(49,90,64,.08); border-radius:36px; background:rgba(255,255,255,.63); box-shadow:0 26px 76px rgba(35,62,43,.07); }
.landing-hero-copy { min-height:470px; display:flex; flex-direction:column; justify-content:center; padding:44px 42px; border-radius:29px; background:linear-gradient(145deg,#fff,rgba(239,244,236,.9)); position:relative; overflow:hidden; }
.landing-hero-copy::after { content:""; position:absolute; width:340px; height:340px; right:-180px; top:-170px; border-radius:50%; border:70px solid rgba(49,90,64,.035); }
.landing-label,.landing-about>span { display:block; margin-bottom:17px; color:var(--green); font-size:9px; font-weight:800; letter-spacing:.19em; }
.landing-hero h1 { max-width:630px; margin:0; font-size:clamp(46px,6vw,70px); line-height:.98; letter-spacing:-.065em; position:relative; z-index:1; }
.landing-hero-copy>p { max-width:590px; margin:24px 0 0; color:var(--muted); font-size:15px; line-height:1.7; position:relative; z-index:1; }
.landing-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:30px; position:relative; z-index:1; }
.landing-primary,.landing-secondary { min-height:54px; padding:0 24px; font-size:11px; }
.landing-primary { gap:22px; background:var(--green); color:#fff; box-shadow:0 14px 28px rgba(49,90,64,.16); }
.landing-primary b { font-size:16px; }
.landing-secondary { border:1px solid rgba(49,90,64,.1); background:rgba(255,255,255,.8); color:var(--green); }
.landing-city-card { min-height:470px; display:flex; flex-direction:column; justify-content:flex-end; padding:36px; border-radius:29px; background:linear-gradient(155deg,#315a40 0%,#1e3c2a 100%); color:#fff; box-shadow:0 20px 42px rgba(35,67,48,.16); position:relative; overflow:hidden; }
.landing-city-card::before { content:""; position:absolute; width:240px; height:240px; right:-90px; top:-70px; border:1px solid rgba(255,255,255,.13); border-radius:50%; box-shadow:0 0 0 38px rgba(255,255,255,.025),0 0 0 76px rgba(255,255,255,.018); }
.landing-city-card::after { content:"↘"; width:48px; height:48px; display:grid; place-items:center; position:absolute; right:30px; top:30px; border:1px solid rgba(255,255,255,.16); border-radius:50%; background:rgba(255,255,255,.07); font-size:19px; }
.landing-city-card small,.landing-city-card strong,.landing-city-card span { position:relative; z-index:1; }
.landing-city-card small { font-size:8px; font-weight:800; letter-spacing:.19em; opacity:.64; }
.landing-city-card strong { margin-top:12px; font-size:48px; line-height:1; letter-spacing:-.06em; }
.landing-city-card span { width:max-content; max-width:100%; margin-top:20px; padding:10px 13px; border:1px solid rgba(255,255,255,.1); border-radius:999px; background:rgba(255,255,255,.055); font-size:9px; line-height:1.3; opacity:.77; }
.landing-benefits { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:14px 0; }
.landing-benefits article { min-height:190px; padding:26px; border:1px solid rgba(49,90,64,.08); border-radius:25px; background:rgba(255,255,255,.76); }
.landing-benefits article>span { display:grid; width:34px; height:34px; place-items:center; border-radius:50%; background:#e8efe5; color:var(--green); font-size:9px; font-weight:800; }
.landing-benefits h2 { margin:25px 0 8px; font-size:17px; letter-spacing:-.035em; }
.landing-benefits p { margin:0; color:var(--muted); font-size:11px; line-height:1.65; }
.landing-about { margin:14px 0; padding:48px; border-radius:30px; background:rgba(255,255,255,.84); border:1px solid rgba(49,90,64,.08); }
.landing-about h2 { max-width:760px; margin:0; font-size:clamp(30px,4vw,46px); line-height:1.05; letter-spacing:-.055em; }
.landing-about p { max-width:770px; margin:18px 0 0; color:var(--muted); font-size:13px; line-height:1.75; }
.landing-about a { display:inline-flex; gap:18px; margin-top:23px; color:var(--green); text-decoration:none; font-size:11px; font-weight:800; }
.landing-footer { width:min(1120px,calc(100% - 40px)); min-height:190px; display:grid; grid-template-columns:1fr auto auto; gap:42px; align-items:center; margin:14px auto 24px; padding:34px 38px; border-radius:28px; background:var(--green-dark); color:#fff; box-shadow:0 20px 54px rgba(31,61,43,.13); }
.landing-footer>div>a { display:inline-flex; align-items:center; gap:11px; color:#fff; text-decoration:none; font-size:23px; font-weight:800; letter-spacing:-.045em; }
.landing-footer i { background:#b9dc9a; box-shadow:0 0 0 6px rgba(185,220,154,.08); }
.landing-footer p { max-width:420px; margin:14px 0 0; color:rgba(255,255,255,.48); font-size:9px; line-height:1.65; }
.landing-footer nav { display:grid; gap:9px; }
.landing-footer nav a { color:rgba(255,255,255,.72); text-decoration:none; font-size:9px; font-weight:650; }
.landing-footer>span { color:rgba(255,255,255,.42); font-size:9px; }
@media (max-width:820px) {
  .landing-header,main,.landing-footer { width:calc(100% - 28px); }
  .landing-header { min-height:76px; }
  .landing-brand { font-size:20px; }
  .landing-header-action { min-height:42px; padding:0 15px; font-size:9px; }
  .landing-hero { grid-template-columns:1fr; gap:10px; padding:10px; border-radius:28px; }
  .landing-hero-copy { min-height:0; padding:34px 24px; border-radius:22px; }
  .landing-hero h1 { font-size:45px; }
  .landing-hero-copy>p { margin-top:19px; font-size:13px; }
  .landing-actions { margin-top:25px; }
  .landing-primary,.landing-secondary { width:100%; min-height:51px; }
  .landing-city-card { min-height:230px; padding:27px; border-radius:22px; }
  .landing-city-card::after { width:42px; height:42px; right:22px; top:22px; }
  .landing-city-card strong { font-size:42px; }
  .landing-benefits { grid-template-columns:1fr; }
  .landing-benefits article { min-height:0; padding:23px; }
  .landing-benefits h2 { margin-top:19px; }
  .landing-about { padding:34px 24px; border-radius:26px; }
  .landing-footer { min-height:0; grid-template-columns:1fr 1fr; gap:30px 18px; padding:30px 25px; }
  .landing-footer>div { grid-column:1/-1; }
  .landing-footer>span { align-self:end; text-align:right; }
}
