:root {
  --ink: #10213f;
  --ink-soft: #42536f;
  --muted: #687792;
  --blue: #1769e0;
  --blue-dark: #1056bc;
  --blue-pale: #edf5ff;
  --blue-wash: #f6f9fd;
  --line: #dce5f1;
  --white: #ffffff;
  --green: #13956a;
  --green-pale: #e8f8f1;
  --amber: #c87c06;
  --amber-pale: #fff5de;
  --red: #d63b4a;
  --red-pale: #fff0f1;
  --navy: #0b1c37;
  --shadow: 0 18px 45px rgba(29, 61, 108, .12);
  --shadow-soft: 0 8px 28px rgba(22, 50, 91, .08);
  --radius: 18px;
  --font: "DM Sans", Arial, sans-serif;
  --display: "Manrope", "DM Sans", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--white); font-family: var(--font); font-size: 16px; line-height: 1.5; }
body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
button { cursor: pointer; }

.shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }
.skip-link { position: fixed; z-index: 100; top: -4rem; left: 1rem; padding: .75rem 1rem; background: var(--ink); color: #fff; border-radius: 8px; }
.skip-link:focus { top: 1rem; }
.sr-only { width: 1px; height: 1px; margin: -1px; position: absolute; overflow: hidden; clip: rect(0, 0, 0, 0); }

h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--display); letter-spacing: -.045em; line-height: 1.06; }
h1 { max-width: 640px; margin-bottom: 1.35rem; font-size: clamp(3rem, 5.3vw, 5.25rem); font-weight: 800; }
h2 { margin-bottom: 1rem; font-size: clamp(2rem, 3.7vw, 3.4rem); font-weight: 800; }
h3 { font-size: 1.36rem; font-weight: 800; }

.site-header { position: sticky; z-index: 20; top: 0; border-bottom: 1px solid rgba(220, 229, 241, .7); background: rgba(255, 255, 255, .92); backdrop-filter: blur(16px); }
.header-inner { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 1.25rem; }
.brand { display: inline-flex; gap: .65rem; align-items: center; flex-shrink: 0; }
.brand-mark { display: block; width: 34px; height: 34px; overflow: hidden; flex: 0 0 auto; border-radius: 10px; background: #06132d; box-shadow: 0 2px 7px rgba(17, 65, 155, .2); }.brand-mark img { display: block; width: 100%; height: 100%; object-fit: cover; }
.brand strong, .brand small { display: block; }
.brand strong { font-family: var(--display); font-size: .94rem; letter-spacing: -.035em; }
.brand small { margin-top: -2px; color: var(--muted); font-size: .67rem; font-weight: 600; }
.site-nav { display: flex; gap: clamp(.8rem, 2vw, 1.65rem); align-items: center; margin-left: auto; }
.site-nav a, .text-link { color: #43526b; font-size: .85rem; font-weight: 600; }
.site-nav a:hover, .text-link:hover { color: var(--blue); }
.header-actions { display: flex; align-items: center; gap: 1.1rem; margin-left: .5rem; }
.menu-toggle { display: none; padding: .55rem; background: transparent; border: 0; }
.menu-toggle span:not(.sr-only) { display: block; width: 21px; height: 2px; margin: 5px 0; background: var(--ink); transition: transform .2s ease; }

.button { min-height: 47px; display: inline-flex; align-items: center; justify-content: center; gap: .6rem; padding: .75rem 1.1rem; border: 1px solid var(--blue); border-radius: 9px; background: var(--blue); color: #fff; font-size: .88rem; font-weight: 700; line-height: 1; transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
.button:hover { background: var(--blue-dark); box-shadow: 0 8px 20px rgba(23, 105, 224, .23); transform: translateY(-1px); }
.button--small { min-height: 38px; padding: .61rem .85rem; font-size: .81rem; }
.button--ghost, .button--outline { border-color: var(--line); background: #fff; color: var(--ink); }
.button--ghost:hover, .button--outline:hover { border-color: #a9c7ef; background: var(--blue-pale); box-shadow: none; }
.button--white { border-color: #fff; background: #fff; color: var(--blue-dark); }
.button--white:hover { background: #eaf3ff; box-shadow: none; }
.button--on-dark { border-color: rgba(255,255,255,.28); background: transparent; color: #fff; }
.button--on-dark:hover { border-color: #fff; background: rgba(255,255,255,.12); box-shadow: none; }
.button:focus-visible, a:focus-visible, input:focus-visible, summary:focus-visible { outline: 3px solid #f0ab30; outline-offset: 3px; }

.hero { overflow: hidden; padding: clamp(4rem, 6vw, 5.6rem) 0 clamp(3.25rem, 5vw, 4.8rem); background: linear-gradient(112deg, #fff 0%, #fff 57%, #f2f7ff 100%); }
.hero-grid { display: grid; grid-template-areas: "copy product" "note product"; grid-template-columns: minmax(0, .93fr) minmax(520px, 1.07fr); align-items: center; column-gap: clamp(3rem, 7vw, 7rem); row-gap: 1rem; }
.hero-copy { grid-area: copy; }
.eyebrow { display: flex; align-items: center; gap: .52rem; margin-bottom: 1rem; color: var(--blue); font-size: .72rem; font-weight: 800; letter-spacing: .11em; line-height: 1; text-transform: uppercase; }
.eyebrow > span { width: 7px; height: 7px; border-radius: 50%; background: var(--blue); }
.eyebrow--light { color: #a9d4ff; }
.eyebrow--light > span { background: #a9d4ff; }
.hero-lede { max-width: 570px; margin-bottom: 1.9rem; color: var(--ink-soft); font-size: 1.08rem; line-height: 1.68; }
.hero-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.hero-note { grid-area: note; display: flex; align-items: center; gap: .5rem; margin: 0; color: var(--muted); font-size: .78rem; font-weight: 600; }
.check-icon { display: grid; width: 17px; height: 17px; place-items: center; border-radius: 50%; background: var(--green-pale); color: var(--green); font-size: .67rem; }

.hero-product { grid-area: product; position: relative; min-height: 470px; padding: 1.25rem 4.2rem 0 0; }
.product-surface { position: absolute; top: 1rem; right: 3rem; left: 0; overflow: hidden; border: 1px solid #cddbf0; border-radius: 15px; background: #fff; box-shadow: var(--shadow); }
.product-surface__bar { display: flex; align-items: center; gap: .5rem; height: 45px; padding: 0 .85rem; border-bottom: 1px solid #e6edf6; color: #4c5e7b; font-size: .69rem; font-weight: 700; }
.tiny-logo { display: grid; width: 21px; height: 21px; place-items: center; border-radius: 6px; background: var(--blue); color: #fff; font-family: var(--display); font-size: .62rem; }
.surface-live { display: flex; align-items: center; gap: .3rem; margin-left: auto; color: var(--green); font-size: .65rem; }
.surface-live i { width: 6px; height: 6px; border-radius: 50%; background: var(--green); }
.surface-body { padding: 1.2rem; }
.surface-heading { display: grid; gap: .08rem; margin-bottom: .9rem; }
.surface-heading span { color: var(--muted); font-size: .68rem; font-weight: 600; }
.surface-heading strong { font-family: var(--display); font-size: 1.02rem; }
.member-alert { display: flex; align-items: center; gap: .63rem; padding: .75rem; border: 1px solid #f3dba9; border-radius: 10px; background: #fffbf1; }
.member-alert > div { display: grid; flex: 1; gap: .06rem; }
.member-alert small { color: #a36d13; font-size: .56rem; font-weight: 800; letter-spacing: .05em; }
.member-alert strong { font-size: .76rem; }
.member-alert span { color: var(--muted); font-size: .63rem; }
.member-alert b { color: #a86c09; font-size: .66rem; }
.avatar { display: grid; width: 31px; height: 31px; place-items: center; flex: 0 0 auto; border-radius: 50%; font-size: .59rem; font-weight: 800; }
.avatar--blue { background: #dcecff; color: #1160c8; }
.avatar--purple { background: #eee5ff; color: #7650be; }
.avatar--pink { background: #ffe4e7; color: #c84157; }
.avatar--green { background: #daf6e9; color: #167a58; }
.surface-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin-top: .85rem; }
.surface-stats div { padding: .65rem; border: 1px solid #e6edf6; border-radius: 8px; }
.surface-stats span, .surface-stats strong { display: block; }
.surface-stats span { color: var(--muted); font-size: .57rem; font-weight: 600; }
.surface-stats strong { margin-top: .1rem; font-family: var(--display); font-size: 1.17rem; letter-spacing: -.07em; }
.amber { color: var(--amber); }.red { color: var(--red); }
.flow-line { position: absolute; z-index: 1; width: 2px; background: #bad6fa; }
.flow-line::after { position: absolute; bottom: -1px; left: -4px; width: 8px; height: 8px; border-right: 2px solid #2c79df; border-bottom: 2px solid #2c79df; content: ""; transform: rotate(45deg); }
.flow-line--one { top: 235px; right: 142px; height: 50px; }.flow-line--two { top: 390px; right: 142px; height: 35px; }
.hero-message { position: absolute; z-index: 2; top: 273px; right: 0; width: 290px; padding: .72rem; border: 1px solid #c7e7d8; border-radius: 13px; background: #fff; box-shadow: var(--shadow-soft); }
.mini-wa__header { display: flex; align-items: center; gap: .45rem; }
.mini-wa__header > span:not(.avatar) { display: grid; line-height: 1.12; }
.mini-wa__header strong { font-size: .66rem; }.mini-wa__header small { color: var(--muted); font-size: .55rem; }
.mini-wa__header time { margin-left: auto; color: var(--muted); font-size: .55rem; }
.hero-message > p { margin: .58rem 0 .45rem; padding: .6rem; border-radius: 8px 8px 2px 8px; background: #d9f6e8; color: #1b4d3a; font-size: .63rem; line-height: 1.45; }
.qr-attachment { display: flex; align-items: center; gap: .5rem; padding: .38rem; border: 1px solid #c7e7d8; border-radius: 6px; }
.qr-attachment img { width: 31px; height: 31px; object-fit: cover; }
.qr-attachment span { display: grid; line-height: 1.1; }
.qr-attachment strong { color: #294f42; font-size: .56rem; }.qr-attachment small { color: #638273; font-size: .52rem; }
.message-state { margin-top: .32rem; color: #5c796c; text-align: right; font-size: .53rem; }.message-state b, .delivery-label b, .phone-message b, .phone-qr b { color: #1681ce; }
.access-card { position: absolute; z-index: 2; right: .2rem; bottom: 0; display: flex; align-items: center; gap: .65rem; width: 315px; padding: .78rem; border: 1px solid #f0c5ca; border-radius: 12px; background: #fff; box-shadow: var(--shadow-soft); }
.access-card__icon { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 8px; background: var(--red-pale); color: var(--red); font-weight: 800; }
.access-card div { display: grid; flex: 1; line-height: 1.1; }.access-card small { color: var(--red); font-size: .55rem; font-weight: 800; letter-spacing: .05em; }.access-card strong { margin: .1rem 0; font-size: .68rem; }.access-card div span { color: var(--muted); font-size: .58rem; }
.status-tag { display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; padding: .27rem .48rem; font-size: .56rem; font-weight: 800; white-space: nowrap; }
.status-tag--red { background: var(--red-pale); color: var(--red); }.status-tag--green { background: var(--green-pale); color: var(--green); }

.proof-strip { padding: 1.35rem 0; border-top: 1px solid #dce9fb; border-bottom: 1px solid #dce9fb; background: var(--blue-wash); }
.proof-strip .shell { display: grid; grid-template-columns: 220px 1fr; gap: 1.25rem 2.2rem; align-items: center; }
.proof-strip__source { margin: 0; color: #3d5172; font-size: .75rem; line-height: 1.4; }.proof-strip__source strong { color: var(--blue); }.meta-dot { display: inline-grid; width: 16px; height: 16px; place-items: center; margin-right: .25rem; border-radius: 4px; background: #0879f9; color: #fff; font-size: .55rem; font-weight: 800; }
.proof-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.proof-grid > div { min-width: 0; padding: .1rem 1.1rem; border-left: 1px solid #d8e5f7; }.proof-grid > div:first-child { border: 0; }
.proof-grid strong { display: block; font-family: var(--display); font-size: 1.28rem; letter-spacing: -.06em; line-height: 1; }.proof-grid small { font-size: .65em; }.proof-grid span { display: block; margin-top: .28rem; color: var(--muted); font-size: .62rem; font-weight: 600; }
.proof-strip__note { grid-column: 2; margin: -1rem 0 0; color: var(--muted); font-size: .62rem; }

.section { padding: clamp(3.6rem, 6vw, 5.8rem) 0; }
.section-intro { max-width: 630px; }.section-intro--center { margin-right: auto; margin-left: auto; text-align: center; }.section-intro--center .eyebrow { justify-content: center; }.section-intro > p:not(.eyebrow):not(.metric-disclaimer) { color: var(--ink-soft); font-size: 1rem; line-height: 1.7; }
.problem-section { background: #fff; }.problem-flow { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr); gap: .7rem; align-items: center; max-width: 1180px; margin: 2.5rem auto 1.25rem; }
.problem-step { min-height: 212px; padding: 1.4rem; border: 1px solid var(--line); border-radius: var(--radius); background: #fff; box-shadow: 0 5px 16px rgba(31, 60, 104, .03); }.step-number { display: block; margin-bottom: .8rem; color: #8b9cb6; font-family: var(--display); font-size: .67rem; font-weight: 800; }.event-icon { display: grid; width: 33px; height: 33px; place-items: center; margin-bottom: 1.1rem; border-radius: 9px; font-weight: 800; }.event-icon--red { background: var(--red-pale); color: var(--red); }.event-icon--amber { background: var(--amber-pale); color: var(--amber); }.problem-step h3 { margin-bottom: .35rem; font-size: 1.05rem; }.problem-step p { margin: 0; color: var(--muted); font-size: .82rem; }.problem-arrow { color: #9cb5d7; font-size: 1.55rem; }.problem-close { margin: 0; color: var(--ink-soft); text-align: center; font-size: 1rem; }.problem-close strong { color: var(--blue); }
.problem-step--result { border-color: #f0d4d8; background: #fffafb; }.problem-solution { max-width: 990px; margin: 0 auto; padding: 1rem 1.15rem; border: 1px solid #cfe2f8; border-radius: 12px; background: var(--blue-pale); text-align: center; }.problem-solution p { margin: 0 0 .65rem; color: var(--blue-dark); font-size: .88rem; }.problem-solution ol { display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem .8rem; margin: 0; padding: 0; list-style: none; }.problem-solution li { display: inline-flex; align-items: center; gap: .45rem; color: #355677; font-size: .7rem; font-weight: 800; }.problem-solution li:not(:last-child)::after { color: #6c9ed9; content: "→"; }

.workflow-section { border-top: 1px solid #edf1f6; background: var(--blue-wash); }.workflow-list { display: grid; gap: 1rem; margin-top: 2.25rem; }.workflow-card { display: grid; grid-template-columns: minmax(0, .85fr) minmax(390px, 1.15fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; padding: clamp(1.5rem, 4vw, 3rem); border: 1px solid #dfe8f4; border-radius: 20px; background: #fff; }.workflow-card--reverse .workflow-card__copy { order: 2; }.workflow-card--reverse .wa-panel, .workflow-card--reverse .expiry-panel, .workflow-card--reverse .door-panel { order: 1; }.card-number { display: inline-grid; width: 27px; height: 27px; place-items: center; margin-bottom: .8rem; border-radius: 7px; background: var(--blue-pale); color: var(--blue); font-size: .67rem; font-weight: 800; }.workflow-card h3 { margin-bottom: .75rem; font-size: clamp(1.45rem, 2.3vw, 2rem); }.workflow-card__copy > p { color: var(--ink-soft); font-size: .92rem; line-height: 1.7; }.inline-link { display: inline-flex; gap: .5rem; margin-top: .65rem; color: var(--blue); font-size: .83rem; font-weight: 800; }.inline-link:hover span { transform: translateX(3px); }.inline-link span { transition: transform .2s ease; }
.expiry-panel, .door-panel { padding: .9rem; border: 1px solid #dce6f2; border-radius: 12px; background: #f9fbfe; }.panel-label, .door-panel__head { display: flex; justify-content: space-between; align-items: center; padding: .3rem .25rem .7rem; color: #5b6d88; font-size: .58rem; font-weight: 800; letter-spacing: .06em; }.panel-label span { color: var(--blue); font-size: .56rem; letter-spacing: 0; }.renewal-row { display: flex; align-items: center; gap: .7rem; padding: .67rem .3rem; border-top: 1px solid #e5ebf3; }.renewal-row > span:not(.avatar) { display: grid; flex: 1; line-height: 1.22; }.renewal-row strong, .door-member strong, .door-restored strong { font-size: .72rem; }.renewal-row small, .door-member small, .door-restored small { color: var(--muted); font-size: .62rem; }.state { border-radius: 999px; padding: .22rem .4rem; font-size: .57rem; }.state--amber { background: var(--amber-pale); color: var(--amber); }.state--red { background: var(--red-pale); color: var(--red); }
.member-entry-panel { padding: .9rem; border: 1px solid #dce6f2; border-radius: 12px; background: #f9fbfe; }.member-entry-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; padding: .2rem 0 .75rem; }.member-entry-grid span { display: grid; gap: .2rem; padding: .62rem; border: 1px solid #e3eaf3; border-radius: 7px; background: #fff; color: var(--muted); font-size: .55rem; font-weight: 700; }.member-entry-grid strong { color: var(--ink); font-size: .67rem; }.member-entry-submit { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .65rem .7rem; border-radius: 7px; background: var(--blue-pale); color: #31537d; font-size: .61rem; font-weight: 700; }.member-entry-submit b { padding: .2rem .38rem; border-radius: 999px; background: var(--green-pale); color: var(--green); font-size: .55rem; }
.smart-note { padding: .75rem .85rem; border-left: 3px solid var(--green); border-radius: 0 8px 8px 0; background: var(--green-pale); color: #34705a !important; font-size: .78rem !important; }.smart-note span { display: inline-grid; width: 16px; height: 16px; place-items: center; margin-right: .3rem; border-radius: 50%; background: var(--green); color: #fff; font-size: .56rem; }.smart-note strong { color: var(--green); }
.wa-panel { overflow: hidden; border: 1px solid #bfe5d1; border-radius: 12px; background: #eff9f3; }.wa-panel__bar { display: flex; align-items: center; gap: .5rem; padding: .7rem .85rem; border-bottom: 1px solid #cce9da; background: #fff; }.wa-panel__bar > span:not(.avatar) { display: grid; }.wa-panel__bar strong { font-size: .7rem; }.wa-panel__bar small { color: var(--green); font-size: .58rem; }.wa-panel__body { padding: .9rem; background-image: radial-gradient(#d4eadb 1px, transparent 1px); background-size: 12px 12px; }.wa-bubble { max-width: 310px; margin: 0 0 .55rem auto; padding: .73rem; border-radius: 10px 10px 2px 10px; background: #d8f6e6; color: #245844; font-size: .73rem; line-height: 1.45; }.qr-attachment--wide { width: min(100%, 310px); margin-left: auto; padding: .5rem; background: #fff; }.qr-attachment--wide img { width: 46px; height: 46px; }.qr-attachment--wide strong { font-size: .63rem; }.delivery-label { margin: .45rem 0 0; color: #648172; text-align: right; font-size: .58rem; }
.door-panel__head { padding-bottom: .65rem; }.door-member, .door-restored { display: flex; align-items: center; gap: .6rem; padding: .65rem .25rem; }.door-member > span:not(.avatar), .door-restored > span:not(.restore-icon):not(.status-tag) { display: grid; flex: 1; }.door-line { height: 1px; margin: .2rem 0; background: #e5ebf3; }.restore-icon { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 50%; background: var(--green-pale); color: var(--green); font-size: .73rem; font-weight: 800; }

.dashboard-section { overflow: hidden; }.dashboard-frame { overflow: hidden; max-width: 1120px; margin: 3rem auto 0; border: 1px solid #cfdceb; border-radius: 16px; background: #fff; box-shadow: var(--shadow); }.browser-bar { display: flex; align-items: center; gap: 1.2rem; padding: .72rem .95rem; border-bottom: 1px solid #dfe7f0; background: #f7f9fc; }.browser-bar span { display: flex; gap: 5px; }.browser-bar i { width: 8px; height: 8px; border-radius: 50%; background: #d4dce7; }.browser-bar i:first-child { background: #ed7781; }.browser-bar i:nth-child(2) { background: #efbd66; }.browser-bar i:nth-child(3) { background: #71c896; }.browser-bar b { flex: 1; padding: .27rem .7rem; border: 1px solid #e1e7ef; border-radius: 6px; background: #fff; color: #76859a; text-align: center; font-family: var(--font); font-size: .62rem; font-weight: 600; }.dashboard-frame img { width: 100%; height: auto; }.dashboard-callouts { display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; margin: 1rem auto 0; color: var(--ink-soft); font-size: .72rem; }.dashboard-callouts span { display: flex; align-items: center; gap: .42rem; }.dashboard-callouts b { display: grid; width: 19px; height: 19px; place-items: center; border-radius: 50%; background: var(--blue-pale); color: var(--blue); font-size: .55rem; }

.dashboard-evidence { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); align-items: start; background: #f8fafd; }.evidence-screen { min-width: 0; background: #fff; }.evidence-screen--meta { border-left: 1px solid #dfe7f0; }.evidence-screen__label { display: flex; align-items: center; justify-content: space-between; gap: .6rem; padding: .62rem .8rem; border-bottom: 1px solid #e2e9f1; color: #3b5272; font-size: .64rem; font-weight: 800; }.evidence-screen__label small { color: var(--muted); font-size: .58rem; font-weight: 700; }.evidence-screen__label .period-label { padding: .22rem .4rem; border-radius: 999px; background: var(--blue-pale); color: var(--blue); white-space: nowrap; }.evidence-screen img { width: 100%; height: auto; }

.biometric-section { position: relative; overflow: hidden; background: var(--navy); color: #fff; }.biometric-section::after { position: absolute; width: 450px; height: 450px; top: -260px; right: -140px; border-radius: 50%; background: rgba(52, 127, 235, .15); content: ""; }.biometric-layout { position: relative; z-index: 1; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(3rem, 7vw, 8rem); align-items: center; }.biometric-copy h2 { color: #fff; }.biometric-copy > p:not(.eyebrow):not(.compatibility-note):not(.biometric-reassurance) { color: #c2d1e6; font-size: 1rem; line-height: 1.7; }.compatibility-note { margin: 1.3rem 0 .75rem; padding: .75rem .85rem; border-left: 2px solid #6bb3ff; background: rgba(255,255,255,.07); color: #c1d9f4; font-size: .72rem; }.biometric-reassurance { margin: 0 0 1.55rem; color: #9acbff; font-size: .72rem; font-weight: 700; }.biometric-flow { display: grid; gap: .4rem; margin: 0; padding: 0; list-style: none; }.biometric-flow li { position: relative; display: grid; grid-template-columns: 30px 1fr; column-gap: .75rem; padding: .72rem .8rem; border: 1px solid rgba(192, 217, 249, .19); border-radius: 10px; background: rgba(7, 30, 60, .56); }.biometric-flow li:not(:last-child)::after { position: absolute; left: 22px; bottom: -8px; z-index: 2; width: 1px; height: 7px; background: #6698cf; content: ""; }.biometric-flow li > span { grid-row: 1 / 3; display: grid; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: #15395f; color: #9acbff; font-size: .63rem; font-weight: 800; }.biometric-flow strong { font-size: .76rem; }.biometric-flow small { color: #9fb6d1; font-size: .63rem; }.biometric-flow__blocked { border-color: rgba(235, 102, 114, .5) !important; }.biometric-flow__blocked > span { background: rgba(214, 59, 74, .2) !important; color: #ffadb6 !important; }.biometric-flow__active { border-color: rgba(80, 205, 153, .45) !important; }.biometric-flow__active > span { background: rgba(19, 149, 106, .24) !important; color: #9cf1cf !important; }

.whatsapp-section { background: #fbfdfc; }.whatsapp-layout { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(3rem, 8vw, 9rem); align-items: center; }.whatsapp-phone { width: min(100%, 320px); margin: 0 auto; overflow: hidden; border: 7px solid #182a3f; border-radius: 28px; background: #eaf5ed; box-shadow: 0 16px 36px rgba(21, 72, 51, .16); }.phone-speaker { width: 80px; height: 19px; margin: 0 auto -19px; border-radius: 0 0 11px 11px; background: #182a3f; }.phone-head { display: flex; align-items: center; gap: .55rem; padding: 2rem .8rem .68rem; background: #f8fffb; }.phone-head > span:not(.avatar) { display: grid; }.phone-head strong { font-size: .71rem; }.phone-head small { color: var(--green); font-size: .58rem; }.phone-body { min-height: 366px; padding: .8rem; background-color: #eaf5ed; background-image: radial-gradient(#d4eadb 1px, transparent 1px); background-size: 13px 13px; }.phone-date { width: max-content; margin: 0 auto .8rem; padding: .2rem .45rem; border-radius: 4px; background: #dbe8df; color: #658071; font-size: .52rem; font-weight: 700; }.phone-message, .phone-reply, .phone-qr { position: relative; margin: 0 0 .58rem auto; padding: .65rem; border-radius: 8px 8px 2px 8px; background: #fff; color: #255841; font-size: .69rem; line-height: 1.45; box-shadow: 0 1px 0 rgba(38, 75, 54, .1); }.phone-message time, .phone-reply time, .phone-qr time { display: block; margin-top: .25rem; color: #7a9687; text-align: right; font-size: .5rem; }.phone-qr { display: flex; align-items: center; gap: .55rem; }.phone-qr img { width: 52px; height: 52px; object-fit: cover; }.phone-qr span { display: grid; gap: .1rem; }.phone-qr strong { font-size: .59rem; }.phone-qr small { color: #718e7e; font-size: .55rem; }.phone-qr time { position: absolute; right: .55rem; bottom: .25rem; }.phone-reply { width: max-content; max-width: 80%; margin-right: 0; border-radius: 8px 8px 8px 2px; background: #fff; }.whatsapp-copy > p:not(.eyebrow) { max-width: 580px; color: var(--ink-soft); font-size: 1rem; line-height: 1.7; }.whatsapp-skip { margin: 1rem 0 0; padding: .75rem .85rem; border-left: 3px solid var(--green); border-radius: 0 8px 8px 0; background: var(--green-pale); color: #34705a !important; font-size: .82rem !important; font-weight: 600; }.whatsapp-skip strong { color: var(--green); }.tick-list { display: grid; gap: .58rem; margin: 1.5rem 0; padding: 0; list-style: none; }.tick-list li { display: flex; gap: .55rem; color: #35516a; font-size: .85rem; }.tick-list span { display: grid; width: 18px; height: 18px; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--green-pale); color: var(--green); font-size: .65rem; font-weight: 800; }

.roi-section { border-top: 1px solid #e8eef6; }.calculator { display: grid; grid-template-columns: 1.03fr .97fr; max-width: 1000px; margin: 2.8rem auto 0; overflow: hidden; border: 1px solid #d7e3f1; border-radius: 17px; background: #fff; box-shadow: var(--shadow-soft); }.calculator-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 1.15rem; padding: clamp(1.5rem, 4vw, 2.5rem); }.calculator label { position: relative; display: grid; gap: .42rem; color: #50627e; font-size: .68rem; font-weight: 800; }.calculator input { width: 100%; padding: .72rem .75rem; border: 1px solid #cddaea; border-radius: 7px; color: var(--ink); background: #fff; font-size: .94rem; font-weight: 700; }.input-suffix { position: absolute; right: .75rem; bottom: .75rem; color: var(--muted); }.calculator-results { padding: clamp(1.5rem, 4vw, 2.5rem); background: var(--blue); color: #fff; }.example-pill { display: inline-block; margin-bottom: 1rem; padding: .25rem .48rem; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; color: #d8eaff; font-size: .58rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }.calculator-results > div { padding: .72rem 0; border-top: 1px solid rgba(255,255,255,.2); }.calculator-results span, .calculator-results strong { display: block; }.calculator-results span { color: #d7eaff; font-size: .68rem; font-weight: 600; }.calculator-results strong { margin-top: .18rem; font-family: var(--display); font-size: 1.65rem; letter-spacing: -.065em; }.calculator-results .result-highlight { margin-top: .4rem; padding: .8rem; border: 1px solid rgba(255,255,255,.3); border-radius: 8px; background: rgba(10, 53, 126, .3); }.calculator-results .result-highlight strong { color: #fff; }

.comparison-section { background: var(--blue-wash); }.comparison-grid { display: grid; grid-template-columns: 1fr 1fr; max-width: 900px; gap: 1rem; margin: 2.75rem auto 0; }.comparison-card { padding: clamp(1.5rem, 4vw, 2.4rem); border: 1px solid var(--line); border-radius: 15px; background: #fff; }.comparison-card--with { border-color: #94bdf2; box-shadow: 0 10px 30px rgba(36, 104, 197, .1); }.comparison-label { margin-bottom: .75rem; color: var(--muted); font-size: .68rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.comparison-card--with .comparison-label { color: var(--blue); }.comparison-card h3 { margin-bottom: 1.4rem; font-size: 1.55rem; }.comparison-card ul { display: grid; gap: .72rem; margin: 0; padding: 0; list-style: none; }.comparison-card li { position: relative; padding-left: 1.2rem; color: var(--ink-soft); font-size: .83rem; }.comparison-card--without li::before { position: absolute; left: 0; color: var(--red); content: "×"; font-weight: 800; }.comparison-card--with li::before { position: absolute; left: 0; color: var(--green); content: "✓"; font-weight: 800; }

.multi-gym-card { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2rem, 7vw, 7rem); align-items: center; max-width: 1050px; padding: clamp(1.5rem, 5vw, 3.5rem); border: 1px solid #d7e4f2; border-radius: 20px; background: #fff; box-shadow: var(--shadow-soft); }.multi-gym-card > div > p:not(.eyebrow) { color: var(--ink-soft); font-size: .94rem; line-height: 1.7; }.location-switcher { display: grid; gap: .45rem; }.location { display: grid; grid-template-columns: 11px 1fr auto; column-gap: .63rem; align-items: center; padding: .85rem .95rem; border: 1px solid #e0e8f2; border-radius: 9px; color: var(--ink-soft); }.location--selected { border-color: #96bdeb; background: var(--blue-pale); }.location-dot { width: 8px; height: 8px; border-radius: 50%; background: #c2cfdd; }.location--selected .location-dot { background: var(--blue); box-shadow: 0 0 0 4px rgba(23,105,224,.12); }.location strong { font-size: .78rem; }.location small { grid-column: 2; color: var(--muted); font-size: .6rem; }.location b { grid-column: 3; grid-row: 1 / 3; color: var(--ink); font-size: .68rem; }

.payment-section { background: #fbfcff; }.payment-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(2.5rem, 8vw, 8rem); align-items: center; }.payment-copy > p:not(.eyebrow) { color: var(--ink-soft); font-size: .98rem; line-height: 1.7; }.payment-steps { display: grid; gap: .2rem; margin: 0; padding: 0; list-style: none; }.payment-steps li { position: relative; display: flex; gap: .8rem; align-items: center; padding: .9rem 0; border-bottom: 1px solid #dde6f0; }.payment-steps b { display: grid; width: 29px; height: 29px; place-items: center; border-radius: 50%; background: var(--blue-pale); color: var(--blue); font-size: .66rem; }.payment-steps span { display: grid; gap: .05rem; }.payment-steps strong { font-size: .78rem; }.payment-steps small { color: var(--muted); font-size: .65rem; }

.testimonial-section { padding-top: 3.2rem; padding-bottom: 3.2rem; background: #fff; }.testimonial-card { max-width: 920px; margin: 0 auto; padding: clamp(1.7rem, 5vw, 3.6rem); border: 1px solid #cfe0f5; border-radius: 19px; background: linear-gradient(135deg, #f7fbff, #fff); box-shadow: var(--shadow-soft); }.testimonial-card__eyebrow { display: flex; align-items: center; gap: .75rem; }.testimonial-card__eyebrow .eyebrow { margin: 0; }.quote-mark { color: var(--blue); font-family: Georgia, serif; font-size: 3rem; line-height: .5; }.testimonial-card blockquote { max-width: 790px; margin: 1.35rem 0 1.5rem; color: #213a60; font-family: var(--display); font-size: clamp(1.2rem, 2.2vw, 1.7rem); font-weight: 700; letter-spacing: -.035em; line-height: 1.48; }.testimonial-card__author { display: flex; align-items: center; gap: .75rem; }.testimonial-avatar { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 50%; background: var(--blue); color: #fff; font-size: .67rem; font-weight: 800; }.testimonial-card cite { display: grid; font-style: normal; line-height: 1.2; }.testimonial-card cite strong { font-size: .8rem; }.testimonial-card cite span { margin-top: .18rem; color: var(--muted); font-size: .69rem; font-weight: 600; }

.founder-section { padding-top: 3rem; padding-bottom: 3rem; }.founder-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1.8rem; max-width: 1030px; padding: clamp(1.5rem, 4vw, 2.6rem); border-top: 1px solid #dce7f2; border-bottom: 1px solid #dce7f2; }.founder-mark { width: 68px; height: 68px; overflow: hidden; border: 2px solid #fff; border-radius: 50%; background: var(--navy); box-shadow: 0 0 0 1px #b8cce4; }.founder-mark img { width: 100%; height: 100%; object-fit: cover; object-position: center; }.founder-card h2 { margin-bottom: .7rem; font-size: clamp(1.5rem, 2.5vw, 2.15rem); }.founder-card > div:nth-child(2) > p:not(.eyebrow):not(.founder-name) { margin-bottom: .65rem; color: var(--ink-soft); font-size: .86rem; line-height: 1.65; }.founder-name { margin-bottom: 0; color: var(--muted); font-size: .72rem; }.founder-name strong { color: var(--ink); }.founder-socials { display: flex; flex-wrap: wrap; gap: .4rem .75rem; margin-top: .85rem; }.founder-socials a, .founder-socials span { color: var(--blue); font-size: .68rem; font-weight: 800; }.founder-socials span { color: var(--muted); }.founder-proof { max-width: 160px; padding-left: 1rem; border-left: 2px solid var(--blue); color: var(--blue); font-size: .72rem; font-weight: 800; }

.pricing-section { background: var(--blue-wash); }.pricing-card { display: grid; grid-template-columns: .9fr 1.1fr auto; gap: 2rem; align-items: center; max-width: 950px; margin: 2.5rem auto 0; padding: clamp(1.5rem, 4vw, 2.6rem); border: 1px solid #a9c9ef; border-radius: 17px; background: #fff; box-shadow: var(--shadow-soft); }.pricing-name { margin-bottom: .4rem; color: var(--blue); font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.pricing-card h3 { margin: 0; font-size: 1.25rem; }.pricing-card ul { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem 1rem; margin: 0; padding: 0; list-style: none; }.pricing-card li { position: relative; padding-left: 1.2rem; color: var(--ink-soft); font-size: .75rem; }.pricing-card li::before { position: absolute; left: 0; color: var(--green); content: "✓"; font-weight: 800; }

.faq-layout { display: grid; grid-template-columns: .7fr 1.3fr; gap: clamp(2.5rem, 8vw, 8rem); }.faq-list { border-top: 1px solid #dbe5f0; }.faq-list details { border-bottom: 1px solid #dbe5f0; }.faq-list summary { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding: 1.1rem 0; color: var(--ink); cursor: pointer; font-family: var(--display); font-size: .9rem; font-weight: 700; list-style: none; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary span { color: var(--blue); font-family: var(--font); font-size: 1.2rem; font-weight: 400; transition: transform .2s ease; }.faq-list details[open] summary span { transform: rotate(45deg); }.faq-list details p { max-width: 690px; margin: -.15rem 0 1.15rem; color: var(--ink-soft); font-size: .82rem; line-height: 1.65; }

.final-cta { padding: clamp(4rem, 7vw, 6rem) 0; background: linear-gradient(118deg, #0a2954, #145fb8); color: #fff; text-align: center; }.final-cta .shell { max-width: 780px; }.final-cta .eyebrow { justify-content: center; }.final-cta h2 { color: #fff; }.final-cta p:not(.eyebrow) { margin-bottom: 1.5rem; color: #c9e1fc; }.final-cta > .shell > div { display: flex; justify-content: center; flex-wrap: wrap; gap: .7rem; }.final-cta small { display: block; margin-top: 1.1rem; color: #a9cdf5; font-size: .67rem; font-weight: 600; }
.site-footer { padding: 3.4rem 0 1.4rem; background: #f8fafd; }.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr .8fr; gap: 2rem; }.site-footer .brand { margin-bottom: .9rem; }.site-footer p { max-width: 250px; margin: 0; color: var(--muted); font-size: .75rem; }.footer-links { display: grid; grid-template-columns: 1fr 1fr; gap: .62rem; align-content: start; }.footer-links a, .footer-contact { color: var(--ink-soft); font-size: .75rem; font-weight: 600; }.footer-links a:hover, .footer-contact a:hover { color: var(--blue); }.footer-contact { display: grid; gap: .55rem; }.footer-contact strong { color: var(--ink); font-size: .8rem; }.footer-contact a { color: var(--blue); }.footer-bottom { margin-top: 2.5rem; padding-top: 1.2rem; border-top: 1px solid #dfe7f0; color: var(--muted); font-size: .65rem; }
.mobile-cta { display: none; }

/* Real product evidence supplied for the page. The earlier composed previews stay
   in the source only as fallback content and are not presented. */
.hero-product { min-height: 425px; padding: 0 0 46px; }
.hero-product > .product-surface, .hero-product > .flow-line, .hero-product > .hero-message, .hero-product > .access-card { display: none; }
.hero-dashboard { position: relative; width: calc(100% - 2.65rem); overflow: hidden; margin: 0; border: 1px solid #c9d8eb; border-radius: 15px; background: #fff; box-shadow: var(--shadow); }
.hero-dashboard .browser-bar { position: relative; z-index: 1; }
.hero-dashboard img { width: 100%; height: auto; }
.hero-dashboard figcaption, .hero-meta-screenshot figcaption { padding: .58rem .8rem; border-top: 1px solid #e0e8f1; color: var(--muted); background: #fff; font-size: .64rem; font-weight: 700; }
.hero-meta-screenshot { position: absolute; z-index: 2; right: 0; bottom: 0; width: min(44%, 290px); overflow: hidden; margin: 0; border: 1px solid #cbd8e7; border-radius: 11px; background: #fff; box-shadow: var(--shadow); }
.hero-meta-screenshot img { width: 100%; height: auto; }
.hero-meta-screenshot figcaption { display: flex; justify-content: space-between; gap: .4rem; font-size: .56rem; }
.hero-meta-screenshot figcaption strong { color: var(--blue); white-space: nowrap; }

.reveal { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }.reveal.is-visible { opacity: 1; transform: translateY(0); }

@media (max-width: 1040px) {
  .site-nav { gap: .85rem; }.site-nav a { font-size: .77rem; }.text-link { display: none; }
  .hero-grid { grid-template-columns: .85fr 1.15fr; gap: 2.5rem; }.hero-product { transform: scale(.91); transform-origin: center right; margin: -22px -25px -22px 0; }
  .proof-strip .shell { grid-template-columns: 1fr; }.proof-strip__note { grid-column: auto; margin: -1rem 0 0; }.proof-grid > div:first-child { padding-left: 0; }
  .biometric-layout, .whatsapp-layout, .payment-layout, .faq-layout { gap: 3rem; }
  .pricing-card { grid-template-columns: 1fr 1fr; }.pricing-card .button { grid-column: 1 / -1; width: max-content; }
}

@media (max-width: 800px) {
  .shell { width: min(100% - 36px, 620px); }.header-inner { min-height: 67px; }
  .site-nav { position: fixed; inset: 67px 0 auto; display: grid; gap: 0; padding: .6rem 18px 1rem; border-bottom: 1px solid var(--line); background: #fff; box-shadow: 0 15px 26px rgba(21,44,80,.1); opacity: 0; pointer-events: none; transform: translateY(-8px); transition: opacity .2s ease, transform .2s ease; }.site-nav.is-open { opacity: 1; pointer-events: auto; transform: translateY(0); }.site-nav a { padding: .85rem 0; border-bottom: 1px solid #edf1f5; font-size: .87rem; }.menu-toggle { display: block; margin-left: auto; }.menu-toggle[aria-expanded="true"] span:first-of-type { transform: translateY(3.5px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:last-of-type { transform: translateY(-3.5px) rotate(-45deg); }.header-actions { margin-left: 0; }.header-actions .button { min-height: 37px; padding: .58rem .7rem; font-size: .74rem; }
  .hero { padding-top: 3.8rem; }.hero-grid, .biometric-layout, .whatsapp-layout, .payment-layout, .faq-layout { grid-template-columns: 1fr; }.hero-copy { text-align: center; }.hero-copy .eyebrow, .hero-actions, .hero-note { justify-content: center; }.hero-copy h1, .hero-lede { margin-right: auto; margin-left: auto; }.hero-product { width: min(100%, 580px); min-height: 460px; margin: -5px auto -20px; transform: scale(1); transform-origin: center; }.product-surface { right: 3rem; }.workflow-card, .workflow-card--reverse { grid-template-columns: 1fr; gap: 2rem; }.workflow-card--reverse .workflow-card__copy { order: 1; }.workflow-card--reverse .wa-panel { order: 2; }.problem-flow { grid-template-columns: 1fr; gap: .55rem; }.problem-step { min-height: 0; display: grid; grid-template-columns: auto 38px 1fr; gap: 0 1rem; align-items: center; padding: 1rem; }.step-number { grid-row: 1 / 3; margin: 0; }.event-icon { grid-row: 1 / 3; margin: 0; }.problem-step h3 { margin: 0; }.problem-step p { grid-column: 3; margin: .1rem 0 0; }.problem-arrow { justify-self: center; transform: rotate(90deg); }.problem-solution { text-align: left; }.problem-solution ol { justify-content: flex-start; }
  .dashboard-callouts { grid-template-columns: 1fr 1fr; }.account-metric-grid { grid-template-columns: repeat(4, 1fr); }.biometric-copy { text-align: center; }.biometric-copy .eyebrow { justify-content: center; }.biometric-copy .compatibility-note { text-align: left; }.biometric-copy .button { margin: auto; }.whatsapp-phone { order: 2; }.whatsapp-copy { order: 1; }.calculator { grid-template-columns: 1fr; }.comparison-grid, .multi-gym-card, .founder-card { grid-template-columns: 1fr; }.founder-card { text-align: center; }.founder-mark { margin: auto; }.founder-card .eyebrow { justify-content: center; }.founder-proof { max-width: none; padding: .8rem; border-top: 2px solid var(--blue); border-left: 0; background: var(--blue-pale); }.pricing-card { grid-template-columns: 1fr; }.pricing-card .button { grid-column: auto; width: 100%; }.footer-grid { grid-template-columns: 1fr 1fr; }.footer-grid > :first-child { grid-column: 1 / -1; }
}

@media (max-width: 800px) {
  .menu-toggle[aria-expanded="true"] span:not(.sr-only):nth-child(2) { transform: translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:not(.sr-only):nth-child(3) { transform: translateY(-3.5px) rotate(-45deg); }
}

@media (max-width: 560px) {
  body { padding-bottom: 57px; }.shell { width: min(100% - 32px, 480px); } h1 { font-size: clamp(2.55rem, 12vw, 3.55rem); }.header-actions .button { display: none; }.brand-mark { width: 31px; height: 31px; }.hero { padding: 3.4rem 0 3.8rem; }.hero-lede { font-size: .96rem; }.hero-actions { display: grid; grid-template-columns: 1fr; }.hero-actions .button { width: 100%; }.hero-note { align-items: flex-start; text-align: left; font-size: .7rem; }.hero-product { min-height: 412px; margin-top: 1rem; padding-right: 1.4rem; }.product-surface { right: 1rem; }.surface-body { padding: .85rem; }.flow-line--one, .flow-line--two { right: 112px; }.flow-line--one { top: 211px; height: 39px; }.flow-line--two { top: 351px; height: 26px; }.hero-message { top: 245px; width: 235px; }.access-card { right: -.15rem; width: 255px; }.access-card__icon { width: 27px; height: 27px; }.access-card strong { font-size: .62rem; }.status-tag { padding: .23rem .35rem; font-size: .5rem; }
  .proof-strip { padding: 1rem 0; }.proof-strip .shell { gap: .8rem; }.proof-grid { grid-template-columns: 1fr 1fr; gap: .75rem 0; }.proof-grid > div { padding: .1rem .7rem; }.proof-grid > div:nth-child(3) { border-left: 0; }.proof-grid > div:nth-child(odd) { padding-left: 0; }.proof-strip__note { margin: 0; }
  .section { padding: 4.2rem 0; }.section-intro > p:not(.eyebrow):not(.metric-disclaimer) { font-size: .92rem; }.workflow-list { margin-top: 2rem; }.workflow-card { padding: 1.25rem; }.workflow-card h3 { font-size: 1.45rem; }.dashboard-frame { margin-top: 2rem; border-radius: 10px; }.browser-bar { gap: .5rem; padding: .55rem; }.browser-bar b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }.dashboard-callouts { grid-template-columns: 1fr; gap: .45rem; }.biometric-section::after { width: 320px; height: 320px; }.whatsapp-layout { gap: 2.4rem; }.calculator-inputs { grid-template-columns: 1fr; gap: .9rem; }.comparison-grid { grid-template-columns: 1fr; }.location { padding: .75rem; }.pricing-card ul { grid-template-columns: 1fr; }.faq-list summary { font-size: .83rem; }.final-cta { padding: 4rem 0; }.final-cta > .shell > div { display: grid; }.final-cta .button { width: 100%; }.footer-grid { grid-template-columns: 1fr; }.footer-grid > :first-child { grid-column: auto; }.footer-links { grid-template-columns: 1fr 1fr; }
  .mobile-cta { position: fixed; z-index: 30; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: 1fr 1fr; padding: 7px 12px; gap: 8px; border-top: 1px solid #cbd9eb; background: rgba(255,255,255,.97); box-shadow: 0 -6px 18px rgba(31,61,100,.1); }.mobile-cta a { display: grid; min-height: 38px; place-items: center; border-radius: 7px; background: var(--blue); color: #fff; font-size: .74rem; font-weight: 800; }.mobile-cta a:last-child { border: 1px solid #b8d3c4; background: #ebf8f1; color: var(--green); }
}

@media (max-width: 1040px) {
  .hero-product { transform: none; margin: 0; }
}

@media (max-width: 800px) {
  .hero-product { width: min(100%, 580px); min-height: 425px; margin: 0 auto; transform: none; padding: 0 0 46px; }
  .hero-grid { grid-template-areas: "copy" "product" "note"; grid-template-columns: 1fr; row-gap: 1.25rem; }
  .hero-note { justify-content: center; text-align: center; }
  .workflow-card--reverse .expiry-panel, .workflow-card--reverse .door-panel { order: 2; }
  .dashboard-evidence { grid-template-columns: 1fr; }
  .evidence-screen--meta { border-top: 1px solid #dfe7f0; border-left: 0; }
}

@media (max-width: 560px) {
  .hero-product { min-height: 355px; margin-top: .25rem; padding: 0 0 36px; }
  .hero-dashboard { width: calc(100% - 1.4rem); }
  .hero-meta-screenshot { width: 48%; }
  .section { padding: 3.5rem 0; }
  .member-entry-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }.reveal { opacity: 1; transform: none; transition: none; } *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}