.land{display:grid;gap:10px;align-content:start}
.land-scene{min-height:190px}
.land-hero{min-height:240px;display:flex;align-items:center}
.land-hero .scene-hero{left:auto;right:12%}
.land-hero .cloud.c1{left:46%;top:18%}
.land-hero .cloud.c2{right:8%;top:12%}
.land-copy{position:relative;z-index:2;display:flex;flex-direction:column;align-items:flex-start;gap:10px;
  width:100%;max-width:440px;padding:14px 16px;border:2px solid var(--line);background:var(--paper);
  box-shadow:3px 3px 0 var(--shadow)}
.land-logo{margin:0;font-size:15px;font-weight:500;line-height:1}
.land-hook{margin:0;font-size:13px;line-height:1.6;color:var(--ink);text-wrap:pretty}
.land-cta{display:flex;gap:8px;width:100%}
.land-cta .act{flex:1 1 0;min-width:0}
.land-free{margin:0;font-size:11px;line-height:1.6;color:var(--muted);text-wrap:pretty}

.land-feats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.feat{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:10px;
  align-content:start;border:2px solid var(--line);background:var(--white);padding:12px;
  box-shadow:2px 2px 0 var(--shadow)}
.feat-i{grid-row:1 / 3;align-self:start}
.feat b{font-weight:500;font-size:14px;align-self:end}
.feat p{font-size:11px;color:var(--muted);line-height:1.6;margin-top:2px;max-width:44em;text-wrap:pretty}

.looks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.look,.look:visited{display:flex;align-items:center;gap:9px;min-height:44px;
  padding:9px 11px;border:2px solid var(--line);background:var(--white);
  color:var(--ink);box-shadow:2px 2px 0 var(--shadow)}
.look .spr{flex:none}
.look > span{min-width:0;flex:1 1 auto;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.look i{font-style:normal;font-size:11px;color:var(--muted);white-space:nowrap;
  }
.look.shut{background:var(--stone);color:var(--muted);box-shadow:none}
.look.shut .spr{opacity:.55}
@media (hover:hover){
  a.look:hover{text-decoration:none;color:var(--ink);background:var(--mint2);
    transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--shadow)}
}

@media (max-width:760px){
  .land-hero{flex-direction:column;align-items:stretch;min-height:0;padding-bottom:130px}
  .land-hero .scene-hero{right:auto;left:50%;transform:translateX(-50%);bottom:16px}
  .land-copy{max-width:none;align-items:center;text-align:center}
  .land-feats{grid-template-columns:minmax(0,1fr)}
  .looks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .look i{display:none}
}
