:root {
  --blue: #087df4; --blue-deep: #0649c9; --blue-ink: #082b63; --ink: #172744; --muted: #687790;
  --cream: #fbfaf6; --white: #fff; --line: #dce6f3; --coral: #ff826f; --yellow: #ffd45c;
  --mint: #69d7b0; --lilac: #a995f8; --danger: #bd3d35; --success: #08784b;
  --shadow: 0 22px 70px rgba(17, 62, 126, .11);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; color: var(--ink);
  background: radial-gradient(circle at 5% 10%, rgba(255,212,92,.18), transparent 22rem), radial-gradient(circle at 94% 20%, rgba(105,215,176,.17), transparent 25rem), var(--cream);
  font-family: "Segoe UI Variable", "Segoe UI", system-ui, sans-serif; -webkit-font-smoothing: antialiased;
}
.site-header { position: relative; z-index: 20; padding: 17px 24px; background: rgba(255,255,255,.9); border-bottom: 1px solid rgba(220,230,243,.8); backdrop-filter: blur(18px); }
.header-inner { width: min(1180px,100%); margin: auto; display:flex; align-items:center; justify-content:space-between; gap:28px; }
.brand { display:inline-flex; align-items:center; flex:0 0 auto; }.brand img { display:block; width:clamp(168px,19vw,226px); height:auto; }
.header-nav { display:flex; align-items:center; gap:25px; }.header-nav a:not(.header-button) { color:var(--ink); font-size:.92rem; font-weight:700; text-decoration:none; }.header-nav form { margin:0; }
.header-button { min-height:42px; padding:0 18px; display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:999px; background:#eaf3ff; color:var(--blue-deep); font:800 .88rem "Segoe UI Variable","Segoe UI",sans-serif; text-decoration:none; cursor:pointer; }
.container { width:min(1180px,calc(100% - 36px)); margin:0 auto; }
h1,h2,h3 { font-family:ui-rounded,"Arial Rounded MT Bold","Trebuchet MS","Segoe UI",sans-serif; color:var(--blue-ink); }
h1 { margin:.2em 0 .35em; font-size:clamp(2.35rem,5.2vw,4.8rem); line-height:.98; letter-spacing:-.055em; }
h2 { margin:.25em 0 .45em; font-size:clamp(2rem,4vw,3.35rem); line-height:1.05; letter-spacing:-.045em; }
h3 { margin:.35em 0; font-size:1.18rem; } p { line-height:1.65; }.muted { color:var(--muted); }.eyebrow { margin:0; color:var(--blue-deep); font-size:.75rem; font-weight:900; letter-spacing:.14em; }
.consumer-hero { min-height:620px; padding:clamp(65px,8vw,105px) 0 70px; display:grid; grid-template-columns:1.03fr .97fr; align-items:center; gap:20px; }
.hero-copy { position:relative; z-index:2; max-width:650px; }
.friendly-badge { width:fit-content; margin-bottom:23px; padding:9px 14px; border:1px solid #c7e0ff; border-radius:999px; background:rgba(255,255,255,.8); color:var(--blue-ink); font-size:.82rem; font-weight:800; box-shadow:0 7px 24px rgba(31,101,195,.08); }.friendly-badge span { margin-right:6px; color:var(--mint); }
.hero-copy h1 em { position:relative; color:var(--blue); font-style:normal; }.hero-copy h1 em::after { content:""; position:absolute; left:2%; right:-2%; bottom:-5px; height:9px; border-radius:50%; background:var(--yellow); opacity:.75; transform:rotate(-2deg); z-index:-1; }
.hero-lead { max-width:590px; margin:24px 0 28px; color:#50617d; font-size:clamp(1rem,1.5vw,1.17rem); }
.hero-actions { display:flex; align-items:center; gap:24px; flex-wrap:wrap; }
.button { min-height:52px; padding:0 24px; display:inline-flex; align-items:center; justify-content:center; border:0; border-radius:15px; background:linear-gradient(135deg,var(--blue),var(--blue-deep)); color:white; font:800 .96rem "Segoe UI Variable","Segoe UI",sans-serif; text-decoration:none; box-shadow:0 12px 28px rgba(8,91,218,.23); cursor:pointer; transition:transform .18s ease,box-shadow .18s ease; }
.button:hover { transform:translateY(-2px); box-shadow:0 16px 35px rgba(8,91,218,.28); }.button.secondary { background:#e7f1ff; color:var(--blue-deep); box-shadow:none; }.button.danger { background:linear-gradient(135deg,#d65b4f,var(--danger)); }
.text-link { color:var(--blue-ink); font-size:.93rem; font-weight:800; text-decoration:none; }.text-link span { color:var(--blue); }
.trust-row { margin-top:28px; display:flex; gap:17px; flex-wrap:wrap; color:#667791; font-size:.75rem; font-weight:700; }
.hero-visual { min-height:490px; position:relative; display:grid; place-items:center; }.hero-visual::before { content:""; position:absolute; width:min(40vw,480px); aspect-ratio:1; border-radius:46% 54% 63% 37% / 47% 37% 63% 53%; background:linear-gradient(145deg,#dceeff,#f1f7ff 65%); transform:rotate(-7deg); }
.hero-visual img { position:relative; z-index:2; width:min(108%,650px); max-height:530px; object-fit:contain; filter:drop-shadow(0 28px 35px rgba(32,70,130,.13)); }.visual-orbit { position:absolute; z-index:4; padding:9px 14px; border-radius:999px; background:white; color:var(--blue-ink); font-size:.78rem; font-weight:800; box-shadow:0 12px 35px rgba(15,56,115,.14); }.orbit-one { top:23%; right:2%; transform:rotate(4deg); }.orbit-two { bottom:23%; left:0; transform:rotate(-5deg); }
.public-section { padding:85px 0 105px; }.section-heading { max-width:790px; margin:0 auto 45px; text-align:center; }.section-heading>p:last-child { max-width:620px; margin:0 auto; color:var(--muted); }.section-heading.compact { max-width:650px; }
.problem-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }.problem-card { min-height:250px; padding:26px; position:relative; overflow:hidden; border:1px solid rgba(255,255,255,.8); border-radius:25px; box-shadow:0 15px 45px rgba(31,65,111,.08); transition:transform .2s ease; }.problem-card:hover { transform:translateY(-5px) rotate(-.4deg); }.problem-card::after { content:""; width:90px; height:90px; position:absolute; right:-25px; bottom:-28px; border:2px dashed rgba(8,43,99,.16); border-radius:50%; }
.problem-card.coral { background:#fff0ec; }.problem-card.yellow { background:#fff8d8; }.problem-card.mint { background:#e7faf3; }.problem-card.lilac { background:#f0edff; }.problem-icon { width:54px; height:54px; margin-bottom:23px; display:grid; place-items:center; border-radius:18px; background:rgba(255,255,255,.85); color:var(--blue-ink); font:900 1.55rem ui-rounded,"Arial Rounded MT Bold",sans-serif; box-shadow:0 8px 20px rgba(30,70,120,.08); }.problem-card p { color:#5a6980; font-size:.9rem; }
.how-section { margin:0 0 105px; padding:clamp(40px,6vw,75px); border-radius:36px; background:var(--blue-ink); color:white; position:relative; overflow:hidden; }.how-section::before { content:""; position:absolute; width:260px; height:260px; top:-170px; right:-80px; border:45px solid rgba(105,215,176,.16); border-radius:50%; }.how-section h2,.how-section h3 { color:white; }.how-section .eyebrow { color:#80c5ff; }.how-section .section-heading { position:relative; }
.steps-grid { position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.steps-grid article { padding:25px; display:flex; align-items:flex-start; gap:16px; border:1px solid rgba(255,255,255,.13); border-radius:22px; background:rgba(255,255,255,.07); }.steps-grid p { margin:.4em 0 0; color:#bfcce0; font-size:.88rem; }.step-number { flex:0 0 42px; height:42px; display:grid; place-items:center; border-radius:14px; background:var(--yellow); color:var(--blue-ink); font:900 1.1rem ui-rounded,"Arial Rounded MT Bold",sans-serif; transform:rotate(-4deg); }
.scan-callout { max-width:690px; margin:36px auto 0; padding:18px 22px; position:relative; display:flex; gap:17px; align-items:center; border-radius:19px; background:white; color:var(--ink); }.scan-callout p { margin:2px 0 0; color:var(--muted); font-size:.84rem; }.scan-symbol,.form-spot-icon { flex:0 0 48px; width:48px; height:48px; display:grid; place-items:center; border-radius:15px; background:#e8f3ff; color:var(--blue-deep); font:900 1.45rem ui-rounded,"Arial Rounded MT Bold",sans-serif; }
.card-panel { margin:42px auto; padding:clamp(25px,5vw,48px); background:rgba(255,255,255,.96); border:1px solid var(--line); border-radius:26px; box-shadow:var(--shadow); }.card-panel>h1,.page-heading h1 { font-size:clamp(2.1rem,4vw,3.2rem); }.narrow { max-width:620px; }.centered { text-align:center; }.form-spot-icon { margin-bottom:17px; }.form-spot-icon.warning { margin-left:auto; margin-right:auto; background:#fff0ec; color:var(--danger); }
.page-heading { padding-top:48px; display:flex; gap:24px; align-items:center; justify-content:space-between; }.form-stack { display:grid; gap:12px; margin-top:24px; }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:30px; }.field { display:grid; gap:8px; }.full { grid-column:1/-1; }
label { color:var(--blue-ink); font-size:.88rem; font-weight:800; } input:not([type=checkbox]),select,textarea { width:100%; min-height:49px; padding:12px 13px; border:1px solid #bac9db; border-radius:12px; background:#fff; color:var(--ink); font:inherit; } textarea { min-height:130px; resize:vertical; } input:focus,select:focus,textarea:focus { outline:4px solid #d9eaff; border-color:var(--blue); }.check { display:flex; align-items:flex-start; gap:10px; }.check input { margin-top:4px; }.field-error { color:var(--danger); font-size:.86rem; }
.submit-row { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:10px; border-top:1px solid var(--line); }.submit-row p { margin:0; font-size:.84rem; }.redeem-intro { max-width:790px; margin:75px auto 20px; text-align:center; }.redeem-intro .friendly-badge { margin-left:auto; margin-right:auto; }.redeem-intro>p:last-child { max-width:600px; margin:20px auto; color:var(--muted); }.redeem-panel { max-width:900px; }
.mini-steps { margin:-10px 0 32px; padding-bottom:18px; display:flex; gap:25px; border-bottom:1px solid var(--line); color:#8c98aa; font-size:.78rem; font-weight:800; }.mini-steps .active { color:var(--blue); }.success-mark { width:76px; height:76px; margin:0 auto 18px; display:grid; place-items:center; border-radius:24px; background:#dff9ed; color:var(--success); font:900 2rem ui-rounded,"Arial Rounded MT Bold",sans-serif; transform:rotate(-4deg); }.case-number { padding:18px; margin:14px 0; border-radius:13px; background:#edf5ff; color:var(--blue-deep); font:800 1.6rem ui-monospace,monospace; }.back-link { display:inline-block; margin-top:24px; color:var(--blue-deep); font-weight:700; }
.message { margin:22px auto 0; padding:14px 16px; border-radius:12px; background:#e9eef7; }.message.success { color:var(--success); background:#dcfaea; }.message.error { color:var(--danger); background:#fee9e7; }.metric-grid { margin:24px 0; display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }.metric { padding:22px; background:white; border:1px solid var(--line); border-radius:18px; box-shadow:0 10px 30px rgba(30,60,100,.05); }.metric strong { display:block; color:var(--blue-ink); font:900 2rem ui-rounded,"Arial Rounded MT Bold",sans-serif; }.metric span { color:var(--muted); }
.table-scroll { overflow:auto; } table { width:100%; border-collapse:collapse; } th,td { padding:13px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap; } th { color:var(--muted); font-size:.75rem; text-transform:uppercase; }.badge { padding:4px 8px; border-radius:99px; background:#e9eef7; font-size:.78rem; }.badge.success { color:var(--success); background:#dcfaea; }.scanner { width:100%; max-height:300px; border-radius:14px; background:#000; }.inline-form { display:inline; margin-left:8px; }.small-link { border:0; padding:0; background:none; color:var(--danger); text-decoration:underline; cursor:pointer; } code { font-size:.9em; }
.site-footer { padding:30px 24px 40px; border-top:1px solid var(--line); background:rgba(255,255,255,.75); }.site-footer>div { width:min(1180px,100%); margin:auto; display:flex; align-items:center; justify-content:space-between; gap:25px; color:var(--muted); font-size:.82rem; }.site-footer img { width:145px; height:auto; opacity:.76; }
@media (max-width:940px) { .consumer-hero { min-height:0; grid-template-columns:1fr; padding-top:60px; text-align:center; }.hero-copy { margin:auto; }.friendly-badge,.hero-actions { margin-left:auto; margin-right:auto; }.hero-actions,.trust-row { justify-content:center; }.hero-visual { min-height:410px; }.hero-visual::before { width:min(80vw,440px); }.problem-grid { grid-template-columns:repeat(2,1fr); }.steps-grid { grid-template-columns:1fr; } }
@media (max-width:650px) { .site-header { padding:14px 17px; }.header-nav>a:not(.header-button) { display:none; }.header-button { min-height:38px; padding:0 13px; font-size:.76rem; }.brand img { width:155px; }.container { width:min(100% - 26px,1180px); }.consumer-hero { padding-top:42px; }.consumer-hero h1 { font-size:clamp(2.45rem,13vw,3.5rem); }.hero-lead { font-size:.96rem; }.hero-actions { flex-direction:column; gap:15px; }.hero-actions .button { width:100%; }.trust-row { gap:9px 14px; }.hero-visual { min-height:335px; }.hero-visual img { width:112%; }.orbit-one { right:0; }.orbit-two { left:0; }.public-section { padding:60px 0 75px; }.problem-grid { grid-template-columns:1fr; }.problem-card { min-height:215px; }.how-section { margin-bottom:65px; padding:34px 20px; border-radius:25px; }.steps-grid article { padding:20px; }.scan-callout { align-items:flex-start; }.form-grid,.metric-grid { grid-template-columns:1fr; }.full { grid-column:auto; }.submit-row,.page-heading,.site-footer>div { align-items:stretch; flex-direction:column; }.submit-row .button { width:100%; }.card-panel { margin:25px auto; border-radius:20px; }.redeem-intro { margin-top:45px; }.mini-steps { justify-content:space-between; gap:8px; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition:none !important; } }