.how-hero { background: #071a2d; color: #fff; min-height: 625px; overflow: hidden; position: relative; }.how-hero-inner { max-width: 970px; padding: 116px 0 145px; position: relative; z-index: 1; }.how-hero h1 { font-size: clamp(54px, 7vw, 98px); letter-spacing: -.08em; line-height: .9; margin: 0 0 28px; max-width: 800px; }.how-hero h1 em, .how-cta h2 em { color: #ffd12a; }.how-hero p:not(.eyebrow) { color: #b9c7ce; font-size: 18px; line-height: 1.6; max-width: 610px; }.how-hero .button { margin-top: 22px; }.how-grid-mark { background-image: linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size: 55px 55px; height: 620px; opacity: .65; position: absolute; right: -115px; top: 70px; transform: rotate(15deg); width: 560px; }.how-grid-mark:after { background: #ffd12a; content: ''; height: 210px; position: absolute; right: 120px; top: 120px; width: 210px; }.intro-grid { align-items: end; display: grid; gap: 100px; grid-template-columns: 1fr 1fr; }.intro-grid h2, .how-cta h2 { color: #14202b; font-size: clamp(42px,5vw,70px); letter-spacing: -.07em; line-height: .94; margin: 0; }.intro-grid h2 em { color: #e78722; }.intro-grid p:not(.eyebrow) { color: #58656d; font-size: 16px; line-height: 1.65; }.walkthrough { background: #fff; padding: 20px 0 120px; }.walk-step { align-items: center; border-top: 1px solid #c5c9c7; display: grid; gap: 90px; grid-template-columns: 1fr 1fr; padding: 85px 0; }.walk-step.reverse .walk-copy { grid-column: 2; grid-row: 1; }.walk-step.reverse figure { grid-column: 1; grid-row: 1; }.walk-number { color: #e78722; font: 60px Georgia,serif; letter-spacing: -.08em; }.walk-label { color: #a86320; font-size: 10px; font-weight: 800; letter-spacing: .14em; margin: 14px 0; text-transform: uppercase; }.walk-copy h2 { color: #14202b; font-size: clamp(31px,3vw,43px); letter-spacing: -.065em; line-height: .97; margin: 0 0 20px; }.walk-copy p:not(.walk-label) { color: #58656d; font-size: 15px; line-height: 1.65; max-width: 500px; }.walk-copy em { color: #d9771c; }.walk-step figure { background: #e9ebea; margin: 0; padding: 18px; position: relative; }.walk-step figure:before { background: #ffd12a; content: ''; height: 100%; left: -8px; position: absolute; top: 8px; width: 8px; }.walk-step img { display: block; height: 475px; object-fit: cover; object-position: top; width: 100%; }.walk-step figcaption { color: #516069; font-size: 11px; line-height: 1.45; padding: 13px 3px 0; }.how-cta { background: #d9781b; color: #fff; padding: 110px 0; }.how-cta h2 { color: #fff; margin-bottom: 34px; }.how-contact { border-bottom: 1px solid rgba(255,255,255,.55); display: inline-block; font-size: 12px; font-weight: 800; letter-spacing: .07em; margin-left: 25px; padding-bottom: 4px; text-transform: uppercase; }.how-contact:hover { border-color: #fff; }@media(max-width:850px){.how-hero{min-height:0}.how-hero-inner{padding:82px 0 100px}.how-grid-mark{height:370px;opacity:.35;right:-270px;top:155px;width:450px}.intro-grid,.walk-step{display:block}.intro-grid p:not(.eyebrow){margin-top:31px}.walk-step,.walk-step.reverse{padding:60px 0}.walk-step.reverse .walk-copy,.walk-step.reverse figure{grid-column:auto;grid-row:auto}.walk-step figure{margin-top:36px}.walk-step img{height:430px}.how-cta{padding:80px 0}.how-contact{display:block;margin:27px 0 0;width:max-content}}@media(max-width:460px){.how-hero h1{font-size:54px}.walk-step img{height:370px}.walkthrough{padding-bottom:60px}.how-contact{font-size:10px}}