.hero{padding-top:48px;padding-bottom:54px;overflow:hidden}
.hero .grid2{grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:42px}
.hero h1{font-size:44px;line-height:1.5;color:white;font-weight:800;margin:0}
.hero h1 em{font-style:normal;color:var(--bright)}
.hero .value{border-left:3px solid var(--bright);padding-left:16px;margin-top:26px;font-weight:700}
.hero .lead{color:#c7d6ce;font-size:16px;margin-top:24px}
.hero .cta{gap:12px}.hero .cta .button{padding:15px 10px;font-size:12px}
.hero .cta .button strong{font-size:21px}.hero .cta .button small{font-size:10px}
.browser{border:1px solid #8da99b;background:#f0f5f2;color:var(--ink);border-radius:6px;overflow:hidden;box-shadow:0 24px 60px #0003}
.chrome{padding:13px 14px;border-bottom:1px solid var(--line);background:white;font-size:10px;display:flex;justify-content:space-between}
.toolbar{margin:14px;background:white;border:1px solid var(--line);padding:10px 12px;font-size:10px;display:flex;justify-content:space-between;gap:12px}
.toolbar b{background:var(--green);color:white;padding:2px 10px}
.shots{padding:0 14px 16px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}
.shot{background:white;border:1px solid var(--line);padding:5px;min-width:0}
.shot small{font-size:7px;display:block;white-space:nowrap;overflow:hidden}
.shots .shot{height:76px;overflow:hidden}.shots .minihero{height:13px;margin-bottom:4px}.shots .minihead{height:3px;margin-bottom:3px}.shots .line{height:2px;margin:2px 0}.shots .minirow{margin:4px 0}.shots .minirow i{height:8px}.shots .minifoot{height:5px;margin-top:4px}
.minihead{height:5px;background:#285541;margin-bottom:5px;width:45%}
.minihero{height:30px;background:#aac8b8!important;margin-bottom:7px}
.line{height:3px;background:#d5dfd9;margin:4px 0}
.minirow{display:flex;gap:3px;margin:7px 0}.minirow i{background:#dce8e1;height:19px;flex:1}
.minifoot{height:10px;background:#285541;margin-top:6px}
.mockfoot{padding:12px 14px;background:var(--green);color:white;font-size:11px}
.fullshot{height:270px;width:115px;background:white;border:1px solid var(--line);padding:12px;flex-shrink:0;box-shadow:10px 10px 0 #e9f0ec}
.fullshot .minihero{height:45px}.fullshot .minirow i{height:32px}
.webpage{padding:18px}.webpage .minihero{height:100px}.webpage .minirow i{height:70px}
.annotation{font-size:12px;color:var(--muted);margin-top:24px}
.story .portrait{position:static;top:auto}
.story .profile{padding-top:0;margin-top:36px}
.story .profile>p:first-child{color:var(--muted);line-height:1.8}
.story .profile h3{margin:12px 0 26px;font-size:30px;line-height:1.5}
.story .credentials{margin:0 0 24px;padding:24px 0;gap:40px}
.story .profile>p:last-child{line-height:1.9}
@media(max-width:700px){.story .profile{margin-top:30px}.story .profile h3{font-size:28px;margin-bottom:24px}.story .credentials{gap:36px}}
@media(max-width:1000px){.hero .grid2{grid-template-columns:1fr}.hero h1{font-size:44px}.hero .browser{max-width:720px;margin:auto}.hero .cta{max-width:600px}}
@media(max-width:700px){.hero{padding-bottom:48px}.hero h1{font-size:30px}.hero .value{font-size:18px!important}.hero .lead{font-size:14px}.hero .cta{flex-direction:column}.hero .grid2{gap:36px}.shots{gap:5px;padding:0 9px 10px}.shot{padding:3px}.shot small{font-size:5px}.minirow i{height:12px}.minihero{height:20px}.mockfoot{font-size:9px}.chrome{font-size:8px}.fullshot{width:90px}}