/* Fairstride homepage: the company and its apps. Reuses site.css tokens and
   the two apps' own illustration cards (engine from site.css, shopper pane
   from gift-wrap.css). */
/* the page measure stays on .wrap so the head lines up with the rows below */
.home-head{padding-top:96px;padding-bottom:72px}
.home-head h1{max-width:16ch;font-size:clamp(42px,5.4vw,68px);line-height:1.04;letter-spacing:-.014em}
.home-head h1 em{font-style:italic;font-weight:400;color:var(--coral)}
.home-head .lede{max-width:52ch;margin-bottom:0}

.apps{padding-top:0;padding-bottom:40px}
.app{display:grid;grid-template-columns:5fr 6fr;gap:72px;align-items:center;
  border-top:1px solid var(--ink);padding:72px 0}
.app-name{font:500 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--coral-ink);margin-bottom:16px}
.app h2{font-size:clamp(30px,3.6vw,44px);line-height:1.08}
.app h2 em{font-style:italic;font-weight:400;color:var(--coral)}
.app p{color:var(--sub);font-size:16.5px;margin:18px 0 26px;max-width:44ch}
.app .ctas{gap:14px}
.app-art{min-width:0}
.app-art .gw-pane{max-width:440px;margin-left:auto}

.ways{padding-top:48px}

@media (max-width:900px){
  .home-head{padding-top:56px;padding-bottom:48px}
  .app{grid-template-columns:1fr;gap:40px;padding:52px 0}
  .app-art .gw-pane{margin-left:0;max-width:none}
}