:root { color-scheme: light; --ink: #0b2417; --muted: #617467; --green: #0aa957; --dark: #052e1c; --line: #dce8e0; --soft: #f3f8f4; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; color: var(--ink); background: radial-gradient(circle at 85% 5%, #d7fbe4, transparent 24rem), #f8fbf9; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.test-header { width: min(1120px, calc(100% - 40px)); margin: 0 auto; min-height: 96px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--dark); text-decoration: none; font-size: 19px; font-weight: 900; letter-spacing: -.04em; }
.brand img { border-radius: 13px; }
.back-link { color: #316044; text-decoration: none; font-weight: 750; }
main { width: min(1120px, calc(100% - 40px)); margin: 0 auto; padding: 58px 0 90px; }
.intro { max-width: 790px; margin-bottom: 46px; }
.eyebrow { display: inline-flex; padding: 8px 12px; border-radius: 999px; color: #087540; background: #dcfce7; font-size: 11px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
h1 { margin: 20px 0 18px; font-size: clamp(45px, 7vw, 82px); line-height: .96; letter-spacing: -.065em; }
.intro p { max-width: 680px; margin: 0; color: var(--muted); font-size: 19px; line-height: 1.6; }
.platform-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.platform-card { position: relative; min-height: 530px; display: flex; flex-direction: column; padding: 38px; overflow: hidden; border: 1px solid var(--line); border-radius: 34px; background: rgba(255,255,255,.92); box-shadow: 0 24px 70px rgba(3, 55, 30, .09); }
.platform-card::after { content: ""; position: absolute; width: 220px; height: 220px; right: -90px; top: -100px; border-radius: 50%; background: #c8f8d8; filter: blur(4px); opacity: .65; }
.platform-heading { position: relative; z-index: 1; display: flex; align-items: center; gap: 17px; }
.platform-icon { width: 64px; height: 64px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 19px; color: #fff; background: #111; font-size: 35px; font-weight: 900; }
.platform-icon img { display: block; max-width: 38px; max-height: 38px; object-fit: contain; }
.apple-icon { background: #111; }
.apple-icon img { filter: invert(1); }
.google-icon { background: #fff; border: 1px solid #e5e7eb; }
.google-icon { overflow: hidden; }
.google-icon img { width: 43px; height: 43px; max-width: 43px; max-height: 43px; transform: none; }
.platform-heading small { color: var(--muted); font-weight: 750; }
h2 { margin: 2px 0 0; font-size: 33px; letter-spacing: -.045em; }
.platform-card > p { min-height: 75px; margin: 28px 0 24px; color: var(--muted); line-height: 1.55; }
.qr-code { width: 180px; height: 180px; display: block; margin: 0 auto 27px; overflow: hidden; border: 10px solid #fff; border-radius: 22px; background: #fff; box-shadow: 0 12px 34px rgba(3,55,30,.13); }
.qr-code img { display: block; width: 100%; height: 100%; }
.primary-button { width: 100%; min-height: 58px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 999px; color: #fff; background: var(--green); font: inherit; font-weight: 900; text-decoration: none; cursor: pointer; box-shadow: 0 12px 26px rgba(10,169,87,.22); }
.primary-button:disabled { color: #63756a; background: #e3ebe6; box-shadow: none; cursor: not-allowed; }
.helper { display: block; margin-top: 16px; color: #718178; font-size: 12px; line-height: 1.5; text-align: center; }
form { margin-top: auto; }
.form-honey { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; }
label { display: block; margin-bottom: 8px; font-size: 13px; font-weight: 900; }
input { width: 100%; height: 58px; margin-bottom: 12px; padding: 0 18px; border: 1px solid #cbdad1; border-radius: 16px; color: var(--ink); background: #fff; font: inherit; outline: none; }
input:focus { border-color: var(--green); box-shadow: 0 0 0 4px rgba(10,169,87,.12); }
.form-status { min-height: 20px !important; margin: 10px 0 0 !important; color: #a13b27 !important; font-size: 12px; text-align: center; }
.form-status.is-success { color: #087540 !important; }
footer { padding: 28px 20px 40px; color: #718178; font-size: 12px; text-align: center; }
@media (max-width: 760px) { main { padding-top: 35px; } .platform-grid { grid-template-columns: 1fr; } .platform-card { min-height: 0; padding: 28px; } .platform-card > p { min-height: 0; } h1 { font-size: 49px; } }