
/* logo crop: wordmark content sits at x68..1920, y185..452 of the 2000x667 png */
.rrs { --w: 232px; flex: none; width: var(--w); height: calc(var(--w) * 267 / 1852); overflow: hidden; position: relative; }
.rrs img { position: absolute; width: calc(var(--w) * 2000 / 1852); max-width: none; left: calc(var(--w) * -68 / 1852); top: calc(var(--w) * -185 / 1852); }
.m49 { width: 34px; height: 34px; border-radius: 7px; overflow: hidden; flex: none; }

/* header */
header { padding: 22px 0; border-bottom: 1px solid var(--line); background: var(--cream); }
header .wrap { display: flex; align-items: center; justify-content: space-between; }
.brand { display: flex; align-items: center; gap: 18px; }
.by { display: flex; align-items: center; gap: 9px; padding-left: 18px; border-left: 1px solid var(--line); font-size: 13px; font-weight: 600; color: var(--muted); }
.by .m49 { width: 26px; height: 26px; border-radius: 5px; }
nav { display: flex; align-items: center; gap: 34px; font-size: 15px; font-weight: 600; color: var(--body); }

/* hero */
.hero { padding: 96px 0 120px; overflow: hidden; }
.hero::after { content: ''; position: absolute; right: 40px; top: 40px; width: 640px; height: 640px; background: radial-gradient(closest-side, rgba(235,113,59,.13), transparent); pointer-events: none; }
.hero .wrap { display: grid; grid-template-columns: 1fr 400px; gap: 72px; align-items: center; position: relative; z-index: 1; }
.hero h1 { margin: 26px 0 28px; max-width: 760px; }
.hero .lede { max-width: 620px; }
.cta { margin-top: 40px; }
.cta .row { display: flex; align-items: center; gap: 28px; }
.second { margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--line); font-size: 16px; color: var(--body); max-width: 620px; }

/* phone */
.phonewrap { position: relative; justify-self: center; }
.phonewrap .example { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); z-index: 3; }
.phone { width: 340px; border-radius: 46px; background: var(--ink); padding: 12px; box-shadow: 0 40px 80px rgba(0,27,55,.25), 0 8px 20px rgba(0,27,55,.12); }
.screen { border-radius: 36px; background: #fff; overflow: hidden; height: 640px; display: flex; flex-direction: column; }
.status { display: flex; justify-content: space-between; align-items: center; padding: 14px 26px 6px; font-size: 13px; font-weight: 700; color: var(--ink); }
.status .pill { width: 96px; height: 26px; border-radius: 20px; background: var(--ink); }
.status .bat { width: 24px; height: 11px; border: 1.5px solid var(--ink); border-radius: 3px; position: relative; }
.status .bat::after { content: ''; position: absolute; inset: 1.5px 5px 1.5px 1.5px; background: var(--ink); border-radius: 1px; }
.chathead { text-align: center; padding: 10px 0 14px; border-bottom: 1px solid #ECEAE4; }
.av { width: 46px; height: 46px; border-radius: 50%; margin: 0 auto 6px; display: grid; place-items: center; font-weight: 700; font-size: 15px; background: var(--sand); color: var(--navy); }
.chathead b { font-size: 14px; display: block; }
.chathead span { font-size: 11.5px; color: var(--muted); }
.thread { padding: 16px 16px; display: flex; flex-direction: column; gap: 10px; font-size: 14.5px; line-height: 1.4; flex: 1; background: #FCFBF9; }
.ts { text-align: center; font-size: 11px; color: var(--muted); font-weight: 600; margin: 2px 0; }
.sys { align-self: stretch; background: #fff; border: 1px solid #E6E2D8; border-radius: 14px; padding: 11px 13px; font-size: 13px; box-shadow: 0 2px 6px rgba(0,27,55,.04); }
.sys .k { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--orange-ink); display: flex; justify-content: space-between; }
.sys .k em { font-style: normal; color: var(--muted); letter-spacing: .04em; }
.sys b { display: block; font-size: 14px; margin-top: 3px; }
.sys span { color: var(--body); }
.out { align-self: flex-end; background: var(--navy); color: #fff; padding: 10px 14px; border-radius: 18px 18px 4px 18px; max-width: 82%; }
.in { align-self: flex-start; background: #ECEAE4; color: var(--ink); padding: 10px 14px; border-radius: 18px 18px 18px 4px; max-width: 75%; }
.meta { font-size: 11px; color: var(--muted); align-self: flex-end; margin-top: -4px; }
.booked { display: flex; gap: 10px; align-items: center; background: #EEF5EC; border: 1px solid #CFE3CA; color: #1F4A23; border-radius: 14px; padding: 10px 13px; font-size: 13px; }
.booked b { display: block; font-size: 14px; }
.chk { width: 26px; height: 26px; border-radius: 50%; background: #2F7A39; display: grid; place-items: center; flex: none; }
.chk svg { width: 14px; height: 14px; }
.float { position: absolute; left: -100px; bottom: -34px; width: 230px; background: #fff; border-radius: 14px; padding: 14px 16px; box-shadow: 0 18px 40px rgba(0,27,55,.18); border: 1px solid #ECE8DE; }
.float .k { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.float b { display: block; font-size: 15px; margin-top: 4px; }
.float .row { display: flex; align-items: center; gap: 8px; margin-top: 8px; font-size: 13px; color: var(--body); }
.dot { width: 8px; height: 8px; border-radius: 50%; background: #2F7A39; flex: none; }

/* gaps */
.gaps h2 { max-width: 860px; margin: 22px 0 22px; color: #fff; }
.gaps .lede { max-width: 640px; }
.gapgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 72px; border-top: 1px solid var(--line-d); }
.gap { padding: 40px 32px 8px 0; }
.gap + .gap { padding-left: 32px; border-left: 1px solid var(--line-d); }
.gap .n { font-family: var(--display); font-size: 64px; font-weight: 700; line-height: 1; color: var(--orange); }
.gap h3 { font-family: var(--display); font-size: 29px; white-space: nowrap; font-weight: 600; line-height: 1.1; color: #fff; margin: 18px 0 14px; }
.gap p { font-size: 17px; line-height: 1.6; }
.stamp { display: inline-flex; align-items: center; gap: 8px; margin-top: 26px; padding: 7px 12px; border-radius: 8px; background: rgba(245,243,238,.07); border: 1px solid var(--line-d); font-size: 13px; font-weight: 600; color: rgba(245,243,238,.85); }
.stamp i { width: 8px; height: 8px; border-radius: 50%; background: #F2B44B; }
.gaps .after { margin-top: 64px; padding-top: 32px; border-top: 1px solid var(--line-d); display: flex; justify-content: space-between; align-items: center; font-size: 18px; color: rgba(245,243,238,.86); }

.rail3 { margin-top: 64px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.m3 .when { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 14px; }
.m3 .when b { width: 28px; height: 28px; border-radius: 50%; background: var(--orange); color: #fff; display: grid; place-items: center; font-size: 13px; letter-spacing: 0; font-family: var(--display); flex: none; }
.m3 .ui { height: 232px; padding: 20px; }
.m3 .ui .out, .m3 .ui .in { font-size: 14px; }
.m3 .rep div { padding: 9px 12px; font-size: 14px; }
.m3 h3 { margin: 24px 0 8px; font-size: 24px; }
.m3 p { font-size: 16.5px; line-height: 1.55; max-width: 380px; }
@media (max-width: 600px) { .rail3 { grid-template-columns: 1fr; gap: 44px; margin-top: 40px; } .m3 .ui { height: auto; } }
/* walkthrough */
.walk .head { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: end; }
.walk h2 { margin-top: 22px; }
.rail { margin-top: 76px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 56px 24px; }
.step { position: relative; }
.step .when { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-bottom: 14px; }
.step .when b { width: 28px; height: 28px; border-radius: 50%; background: var(--ink); color: var(--cream); display: grid; place-items: center; font-size: 13px; letter-spacing: 0; font-family: var(--display); }
.step .when::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.ui { height: 196px; background: #fff; border: 1px solid #E6E2D8; border-radius: 16px; padding: 16px; box-shadow: 0 10px 28px rgba(0,27,55,.06); position: relative; overflow: hidden; font-size: 13px; }
.ui .tag { position: absolute; top: 12px; right: 12px; font-size: 9.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); background: var(--cream); border-radius: 5px; padding: 2px 6px; }
.ui .k { font-size: 10.5px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--orange-ink); }
.step h3 { margin: 22px 0 8px; font-size: 20px; }
.step p { font-size: 15.5px; line-height: 1.55; }
.fld { height: 30px; border: 1px solid #DEDAD0; border-radius: 7px; margin-top: 8px; padding: 0 10px; display: flex; align-items: center; color: var(--body); font-size: 12.5px; background: #FCFBF9; }
.fbtn { height: 30px; margin-top: 10px; border-radius: 7px; background: var(--orange); color: var(--ink); font-weight: 700; font-size: 12.5px; display: grid; place-items: center; }
.ui .out, .ui .in { font-size: 13px; padding: 8px 11px; max-width: 92%; }
.ui .thread2 { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.cal { display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; margin-top: 10px; }
.cal div { height: 22px; border-radius: 4px; background: #F1EEE7; font-size: 10px; display: grid; place-items: center; color: var(--muted); font-weight: 600; }
.cal .on { background: var(--navy); color: #fff; }
.rem { display: flex; align-items: center; gap: 7px; margin-top: 8px; font-size: 12px; color: var(--body); }
.bar { height: 7px; border-radius: 4px; background: #ECE9E2; margin-top: 8px; }
.prop { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding: 8px 10px; background: #F6F4EF; border-radius: 8px; font-size: 12.5px; }
.prop b { font-size: 13px; }
.sent { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; font-size: 12px; font-weight: 600; color: #1F4A23; }
.tl { margin-top: 10px; display: flex; flex-direction: column; gap: 7px; }
.tl div { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
.tl .d { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; background: #2F7A39; flex: none; }
.tl .d svg { width: 10px; height: 10px; }
.tl .d.wait { background: #fff; border: 2px solid #CFC9BC; }
.nudge { margin-top: 10px; display: flex; align-items: center; gap: 8px; padding: 7px 10px; background: #FDEEE6; border: 1px solid #F6CDB7; border-radius: 8px; font-size: 12.5px; font-weight: 600; color: #7A3412; }
.sig { margin-top: 10px; height: 44px; border-bottom: 1.5px solid #CFC9BC; position: relative; }
.sig svg { position: absolute; left: 6px; bottom: 4px; width: 130px; height: 38px; }
.pills { display: flex; gap: 6px; margin-top: 10px; flex-wrap: wrap; }
.pill2 { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px; border-radius: 999px; background: #EEF5EC; color: #1F4A23; font-size: 12px; font-weight: 600; border: 1px solid #CFE3CA; }
.board { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 10px; }
.board .col { background: #F6F4EF; border-radius: 7px; padding: 6px; min-height: 120px; }
.board .col span { font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); display: block; margin-bottom: 6px; }
.board .card { height: 26px; border-radius: 5px; background: #fff; border: 1px solid #E6E2D8; margin-bottom: 5px; }
.board .card.me { background: #fff; border: 1.5px solid var(--orange); font-size: 10.5px; font-weight: 700; padding: 3px 5px; line-height: 1.15; height: auto; }
.rep { margin-top: 10px; border: 1px solid #E6E2D8; border-radius: 8px; overflow: hidden; }
.rep div { display: flex; justify-content: space-between; padding: 6px 10px; font-size: 12.5px; border-bottom: 1px solid #EFECE5; }
.rep div:last-child { border-bottom: 0; }
.rep span { color: var(--muted); }
.rep b { font-weight: 600; }
.walk .close { margin-top: 88px; padding: 44px 48px; border-radius: 18px; background: var(--paper); border: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; gap: 40px; }
.walk .close .display { font-size: 38px; line-height: 1.08; max-width: 640px; }

/* install */
.install h2 { margin-top: 22px; max-width: 720px; }
.blocks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 64px; }
.block { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 34px 32px 32px; }
.fix { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--orange-ink); }
.fix b { font-family: var(--display); font-size: 15px; letter-spacing: 0; width: 26px; height: 26px; border-radius: 6px; background: var(--orange); color: var(--ink); display: grid; place-items: center; }
.block .sub { font-size: 14px; color: var(--muted); margin-top: 6px; }
.block h3 { font-family: var(--display); font-size: 31px; font-weight: 600; line-height: 1.08; margin: 26px 0 14px; }
.block p { font-size: 16.5px; line-height: 1.6; }
.chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line); }
.chip { font-size: 13px; font-weight: 600; padding: 5px 11px; border-radius: 999px; background: var(--cream); color: var(--navy); border: 1px solid #E2DDD1; }
.install .after { margin-top: 44px; text-align: center; font-family: var(--display); font-size: 28px; font-weight: 600; color: var(--navy); }

/* how we work */
.how .top { display: grid; grid-template-columns: 1fr 1.1fr; gap: 80px; align-items: end; }
.how h2 { margin-top: 22px; color: #fff; }
.steps3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 64px; }
.s3 { border: 1px solid var(--line-d); border-radius: 18px; padding: 32px; background: rgba(255,255,255,.03); }
.s3 .n { display: flex; align-items: center; justify-content: space-between; font-family: var(--display); font-size: 15px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: #F4A57F; }
.s3 .n b { font-size: 46px; line-height: 1; color: var(--orange); letter-spacing: 0; }
.s3 h3 { color: #fff; font-family: var(--display); font-size: 30px; font-weight: 600; margin: 22px 0 10px; line-height: 1.1; }
.s3 p { font-size: 16.5px; }
.money { margin-top: 24px; display: grid; grid-template-columns: 1.35fr 1fr; gap: 24px; }
.pay { border-radius: 18px; background: var(--cream); color: var(--ink); padding: 44px 48px; position: relative; overflow: hidden; }
.pay::after { content: ''; position: absolute; right: -40px; top: -10px; width: 150px; height: 120%; background: repeating-linear-gradient(-58deg, transparent 0 22px, rgba(235,113,59,.14) 22px 34px); }
.pay .display { font-size: 46px; line-height: 1.02; max-width: 500px; position: relative; z-index: 1; }
.pay p { color: var(--body); margin-top: 18px; font-size: 17px; max-width: 470px; position: relative; z-index: 1; }
.data { border-radius: 18px; border: 1px solid var(--line-d); padding: 44px 40px; display: flex; flex-direction: column; justify-content: center; }
.data .ic { width: 48px; height: 48px; border-radius: 12px; background: rgba(235,113,59,.16); display: grid; place-items: center; margin-bottom: 22px; }
.data .ic svg { width: 24px; height: 24px; }
.data .display { font-size: 32px; color: #fff; line-height: 1.08; }
.data p { margin-top: 12px; font-size: 16.5px; }

/* lead magnet */
.magnet .wrap { display: grid; grid-template-columns: 500px 1fr; gap: 96px; align-items: center; }
.coverbox { position: relative; }
.coverbox::before { content: ''; position: absolute; inset: 40px -28px -28px 40px; border-radius: 10px; background: var(--sand); }
.coverbox img { position: relative; border-radius: 6px; box-shadow: 0 30px 60px rgba(0,27,55,.22), 0 4px 12px rgba(0,27,55,.1); }
.magnet h2 { margin: 22px 0 20px; }
.inside { margin: 30px 0 34px; display: flex; flex-direction: column; gap: 14px; }
.inside li { list-style: none; display: flex; gap: 14px; font-size: 17px; line-height: 1.5; color: var(--body); }
.inside li b { color: var(--ink); }
.inside .tick { width: 24px; height: 24px; border-radius: 6px; background: var(--ink); display: grid; place-items: center; flex: none; margin-top: 1px; }
.inside .tick svg { width: 13px; height: 13px; }
.optin { display: flex; gap: 12px; }
.input { flex: 1; height: 62px; border-radius: 10px; border: 1.5px solid #D6D1C4; background: #fff; display: flex; align-items: center; padding: 0 20px; color: #8A96A3; font-size: 17px; }
.optin .btn { background: var(--ink); color: var(--cream); box-shadow: none; }
.fine { margin-top: 14px; font-size: 14px; color: var(--muted); display: flex; align-items: center; gap: 10px; }

/* faq */
.faq .wrap { display: grid; grid-template-columns: 360px 1fr; gap: 96px; }
.faq h2 { margin-top: 22px; }
.faq .side p { margin-top: 20px; font-size: 17px; }
.qa { border-top: 1px solid var(--line); }
.qa div { padding: 28px 0; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 1fr 28px; column-gap: 24px; }
.qa h3 { font-size: 21px; }
.qa p { grid-column: 1; margin-top: 10px; font-size: 16.5px; line-height: 1.62; max-width: 680px; }
.qa .pm { grid-row: 1; grid-column: 2; width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid var(--line); display: grid; place-items: center; color: var(--navy); font-weight: 700; font-size: 16px; line-height: 1; }

/* quiz */
.quiz { text-align: center; }
.quiz h2 { color: #fff; margin: 22px auto 14px; max-width: 900px; }
.quiz .lede { margin: 0 auto; }
.qcard { width: 760px; max-width: 100%; margin: 56px auto 0; background: var(--cream); border-radius: 22px; padding: 40px 44px 44px; text-align: left; color: var(--ink); box-shadow: 0 24px 48px rgba(0,10,25,.35); }
.prog { display: flex; align-items: center; gap: 16px; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.prog .track { flex: 1; height: 6px; border-radius: 3px; background: #E2DDD1; overflow: hidden; }
.prog .track i { display: block; width: 33.3%; height: 100%; background: var(--orange); }
.qcard .q { font-family: var(--display); font-weight: 600; font-size: 38px; line-height: 1.08; margin: 28px 0 26px; }
.opts { display: flex; flex-direction: column; gap: 12px; }
.opt { display: flex; align-items: center; gap: 16px; padding: 18px 20px; background: #fff; border: 1.5px solid #E2DDD1; border-radius: 12px; font-size: 18px; font-weight: 600; }
.opt .key { width: 30px; height: 30px; border-radius: 7px; border: 1.5px solid #D6D1C4; display: grid; place-items: center; font-size: 13px; font-weight: 700; color: var(--muted); flex: none; }
.qnote { margin-top: 22px; font-size: 14px; color: var(--muted); text-align: center; }

/* footer */
footer { background: var(--ink); color: rgba(245,243,238,.7); padding: 56px 0; font-size: 14px; }
footer .wrap { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
footer .l { display: flex; align-items: center; gap: 16px; }
footer .l .m49 { width: 44px; height: 44px; border-radius: 9px; border: 1px solid var(--line-d); }
footer .l b { color: var(--cream); font-size: 15px; display: block; }
footer .r { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; justify-content: flex-end; }
.sticky { display: none; }
.sticky .note { position: absolute; top: -30px; left: 12px; background: #E3E9EE; color: #33475B; border: 1px solid #C3CFD9; border-radius: 5px; padding: 2px 8px; font-size: 11.5px; font-weight: 700; }

/* ---------- phone width ---------- */
@media (max-width: 600px) {
  :root { --pad: 80px; }
  body { font-size: 17px; }
  .wrap, .narrow { max-width: calc(100% - 40px); }
  header { padding: 16px 0; }
  .rrs { --w: 172px; }
  .by, nav a { display: none; }
  nav { gap: 0; }
  h1 { font-size: 40px; line-height: 1.03; }
  h2 { font-size: 38px; line-height: 1.06; }
  .lede { font-size: 18px; }
  .eyebrow { font-size: 11.5px; letter-spacing: .12em; }
  .hero { padding: 48px 0 72px; }
  .hero::after { display: none; }
  .hero .wrap { grid-template-columns: 1fr; gap: 56px; }
  .hero h1 { margin: 20px 0 20px; }
  .cta { margin-top: 30px; }
  .cta .row { flex-direction: column; align-items: stretch; gap: 0; }
  .btn { width: 100%; height: 60px; }
  .micro { justify-content: center; }
  .second { font-size: 15.5px; text-align: center; }
  .phonewrap { justify-self: center; }
  .phone { width: 300px; border-radius: 42px; padding: 10px; }
  .screen { height: 560px; border-radius: 33px; }
  .float { left: auto; right: -14px; bottom: -64px; width: 210px; }
  .gaps h2 { margin: 18px 0 18px; }
  .gapgrid { grid-template-columns: 1fr; margin-top: 44px; }
  .gap, .gap + .gap { padding: 32px 0 32px; border-left: 0; }
  .gap + .gap { border-top: 1px solid var(--line-d); }
  .gap .n { font-size: 48px; }
  .gap h3 { font-size: 30px; margin: 12px 0 10px; }
  .gaps .after { margin-top: 24px; flex-direction: column; align-items: stretch; gap: 22px; font-size: 17px; }
  .walk .head { grid-template-columns: 1fr; gap: 20px; }
  .rail { grid-template-columns: 1fr; gap: 48px; margin-top: 48px; }
  .walk .close { flex-direction: column; align-items: stretch; padding: 32px 24px; margin-top: 56px; gap: 26px; }
  .walk .close .display { font-size: 32px; }
  .blocks { grid-template-columns: 1fr; margin-top: 40px; gap: 16px; }
  .block { padding: 28px 24px; }
  .block h3 { font-size: 30px; margin-top: 20px; }
  .install .after { font-size: 24px; text-wrap: balance; }
  .how .top { grid-template-columns: 1fr; gap: 20px; }
  .steps3 { grid-template-columns: 1fr; margin-top: 40px; gap: 16px; }
  .s3 { padding: 28px 24px; }
  .money { grid-template-columns: 1fr; gap: 16px; margin-top: 16px; }
  .pay { padding: 34px 26px; }
  .pay .display { font-size: 36px; }
  .data { padding: 32px 26px; }
  .magnet .wrap { grid-template-columns: 1fr; gap: 64px; }
  .coverbox { width: 82%; margin: 0 auto; }
  .coverbox::before { inset: 24px -16px -16px 24px; }
  .optin { flex-direction: column; }
  .input { flex: none; }
  .optin .btn { width: 100%; }
  .fine { flex-wrap: wrap; justify-content: center; text-align: center; gap: 6px 10px; }
  .faq .wrap { grid-template-columns: 1fr; gap: 36px; }
  .qa div { padding: 24px 0; column-gap: 16px; }
  .qa h3 { font-size: 19px; }
  .qa p { font-size: 16px; }
  .qcard { padding: 28px 20px 28px; margin-top: 40px; }
  .qcard .q { font-size: 31px; margin: 22px 0 20px; }
  .opt { font-size: 16.5px; padding: 15px 14px; gap: 12px; }
  footer { padding: 44px 0 48px; }
  footer .wrap { flex-direction: column; align-items: flex-start; }
  footer .r { justify-content: flex-start; }
  body { position: relative; }
  /* drawn where it sits after two screens of scrolling; in the build it is position: fixed */
  .sticky { display: block; position: absolute; left: 0; right: 0; top: calc(844px * 2 - 108px); z-index: 50; background: rgba(251,250,247,.97); border-top: 1px solid var(--line); box-shadow: 0 -10px 30px rgba(0,27,55,.14); padding: 12px 16px 16px; text-align: center; }
  .sticky .btn { height: 54px; font-size: 17px; }
  .sticky .micro { margin-top: 7px; font-size: 13px; }
}
