/* Money Detective, Payday Check and Payday Buffer funnel pages (v32, 27 Sep 2026) */
:root{
  --plum:#2c222d; --plum-soft:#514751; --muted:#655a65;
  --teal:#0097b2; --teal-dark:#006f80;
  --pink:#d887d2; --pink-soft:#f8e7f1;
  --aqua:#c9eff0; --aqua-soft:#e8f7f6;
  --sun:#f6c64a; --sun-soft:#fff4c7;
  --ivory:#fffaf1; --line:rgba(44,34,45,.16);
  --bad:#a3261d; --bad-soft:#fdecea;
  --serif: Georgia, "Iowan Old Style", "Palatino Linotype", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0; background:var(--ivory); color:var(--plum); font-family:var(--sans); font-size:17px; line-height:1.6;}
img{max-width:100%; display:block; height:auto;}
a{color:var(--teal-dark);}
h1,h2,h3{font-family:var(--serif); color:var(--plum); margin:0; line-height:1.12;}
p{margin:0 0 14px;}
:focus-visible{outline:3px solid var(--sun); outline-offset:3px;}
.wrap{max-width:1080px; margin:0 auto; padding:0 20px;}
.narrow{max-width:760px; margin:0 auto; padding:0 20px;}
.sr-only{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap;}

/* Header and footer */
.fn-header{background:var(--ivory); border-bottom:2px solid var(--line); position:sticky; top:0; z-index:40;}
.fn-header .wrap{display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:84px;}
.fn-header img{height:70px; width:auto;}
.fn-header nav{display:flex; gap:20px; align-items:center;}
.fn-header nav a{font-size:14.5px; font-weight:750; color:var(--plum); text-decoration:none;}
.fn-header nav a.btn{color:#fff;}
@media(max-width:700px){ .fn-header{position:relative;} .fn-header img{height:58px;} .fn-header nav a.hide-sm{display:none;} .fn-header .wrap{min-height:72px;} }
.fn-footer{background:var(--plum); color:rgba(255,255,255,.78); border-top:9px solid var(--teal); padding:34px 0; font-size:14px; text-align:center;}
.fn-footer a{color:#fff; font-weight:650;}
.fn-footer nav{display:flex; flex-wrap:wrap; justify-content:center; gap:8px 20px; margin-bottom:12px;}

/* Buttons */
.btn{display:inline-block; font:inherit; font-weight:800; font-size:16.5px; line-height:1.25; text-align:center; text-decoration:none; color:#fff; background:var(--teal); border:2px solid var(--plum); border-radius:999px; padding:14px 26px; box-shadow:4px 4px 0 var(--pink); cursor:pointer; transition:transform .15s ease, box-shadow .15s ease, background .15s ease;}
.btn:hover{background:var(--teal-dark); transform:translate(-1px,-2px); box-shadow:6px 6px 0 var(--pink);}
.btn:active{transform:translate(2px,2px); box-shadow:2px 2px 0 var(--pink);}
.btn.small{font-size:14px; padding:9px 16px; box-shadow:3px 3px 0 var(--pink);}
.btn.sun{background:var(--sun); color:var(--plum);}
.btn.sun:hover{background:#f0b92a;}
.btn.ghost{background:#fff; color:var(--plum); box-shadow:3px 3px 0 var(--aqua);}
.btn.ghost:hover{background:var(--aqua-soft);}
.btn[disabled]{opacity:.7; cursor:wait;}
.linkbtn{background:none; border:0; padding:6px 2px; font:inherit; font-size:15px; font-weight:700; color:var(--teal-dark); text-decoration:underline; cursor:pointer;}
.cta-note{font-size:14px; color:var(--muted); margin-top:10px; font-weight:600;}
@media(prefers-reduced-motion:reduce){ .btn{transition:none;} }

/* Labels */
.tag{display:inline-block; padding:6px 11px; border-radius:4px; background:var(--sun); color:var(--plum); font-size:11.5px; font-weight:850; letter-spacing:.1em; text-transform:uppercase; transform:rotate(-1deg); margin-bottom:14px;}
.tag.pink{background:var(--pink-soft); border:1px solid var(--pink);}
.tag.aqua{background:var(--aqua);}

/* Sections */
.sec{padding:70px 0;}
.sec.white{background:#fff;}
.sec.aqua{background:var(--aqua-soft);}
.sec.pink{background:var(--pink-soft);}
.sec.sun{background:var(--sun-soft);}
.sec-head{text-align:center; max-width:680px; margin:0 auto 36px;}
.sec-head h2{font-size:clamp(30px,4vw,44px); letter-spacing:-.03em; margin-bottom:12px;}
.sec-head p{color:var(--plum-soft); font-size:17.5px;}
@media(max-width:700px){ .sec{padding:54px 0;} }

/* Hero */
.fn-hero{position:relative; overflow:hidden; padding:72px 0 70px; border-bottom:9px solid var(--plum); background:linear-gradient(145deg,#fff8e9 0%,#fff8e9 58%,#f4dcea 58%,#f4dcea 100%);}
.fn-hero:before{content:""; position:absolute; width:260px; height:260px; left:-165px; top:-120px; border:36px solid var(--aqua); border-radius:50%;}
.fn-hero .wrap{position:relative; z-index:1;}
.fn-hero h1{font-size:clamp(40px,5.4vw,64px); letter-spacing:-.045em; line-height:1.03; margin-bottom:18px;}
.fn-hero .sub{font-size:19px; color:var(--plum-soft); max-width:60ch; margin-bottom:26px;}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:54px; align-items:center;}
@media(max-width:860px){ .hero-grid{grid-template-columns:1fr; gap:36px;} .fn-hero{padding:50px 0 56px; background:linear-gradient(160deg,#fff8e9 0%,#fff8e9 66%,#f4dcea 66%);} }
.hero-shot{position:relative; border:3px solid var(--plum); border-radius:20px; overflow:hidden; box-shadow:11px 13px 0 var(--teal); background:#fff; transform:rotate(1deg);}
@media(max-width:860px){ .hero-shot{transform:none; box-shadow:7px 8px 0 var(--teal);} }
.callouts{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:26px;}
.callouts span{display:block; font-size:14px; font-weight:700; padding:10px 12px 10px 34px; position:relative; background:#fff; border:2px solid var(--plum); border-radius:12px;}
.callouts span:before{content:"✓"; position:absolute; left:12px; top:9px; color:var(--teal-dark); font-weight:900;}
@media(max-width:460px){ .callouts{grid-template-columns:1fr;} }

/* Cards */
.card{background:#fff; border:2px solid var(--plum); border-radius:18px; padding:26px; box-shadow:6px 7px 0 rgba(44,34,45,.12);}
.card h3{font-size:21px; margin-bottom:8px;}
.card p{color:var(--plum-soft); font-size:15.5px; margin:0;}
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:22px;}
@media(max-width:800px){ .grid-3,.grid-2{grid-template-columns:1fr;} }
.card.sun{background:var(--sun-soft);} .card.pink{background:var(--pink-soft);} .card.aqua{background:var(--aqua-soft);}

/* Maths table */
.calc{background:#fff; border:3px solid var(--plum); border-radius:20px; box-shadow:9px 10px 0 var(--pink); overflow:hidden;}
.calc table{width:100%; border-collapse:collapse; font-size:17px;}
.calc caption{text-align:left; padding:18px 22px 4px; font-family:var(--serif); font-size:20px; font-weight:700;}
.calc th,.calc td{padding:13px 22px; text-align:left; border-bottom:1px solid var(--line);}
.calc th{font-weight:600;}
.calc td{text-align:right; font-variant-numeric:tabular-nums; font-weight:700; white-space:nowrap;}
.calc tr.minus td{color:var(--plum-soft);}
.calc tr.total th,.calc tr.total td{background:var(--aqua); font-size:19px; font-weight:850; border-bottom:0; border-top:3px solid var(--plum);}
.calc tr.total.neg th,.calc tr.total.neg td{background:var(--bad-soft); color:var(--bad);}
.calc thead th{font-size:13px; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); background:var(--ivory);}
.calc thead th:last-child{text-align:right;}
@media(max-width:460px){ .calc th,.calc td{padding:12px 14px; font-size:15.5px;} .calc tr.total th,.calc tr.total td{font-size:17px;} }

/* Definition box */
.defn{border-left:6px solid var(--teal); background:var(--aqua-soft); border-radius:0 14px 14px 0; padding:18px 22px; font-size:15.5px; color:var(--plum-soft);}
.defn p:last-child{margin-bottom:0;}
.defn strong{color:var(--plum);}

/* Steps list */
.steps{list-style:none; counter-reset:s; margin:0; padding:0; display:grid; gap:14px;}
.steps li{counter-increment:s; position:relative; padding:16px 18px 16px 70px; background:#fff; border:2px solid var(--plum); border-radius:14px; font-size:16.5px;}
.steps li:before{content:counter(s); position:absolute; left:16px; top:50%; transform:translateY(-50%); width:38px; height:38px; border-radius:50%; background:var(--sun); border:2px solid var(--plum); display:grid; place-items:center; font-weight:850; box-shadow:3px 3px 0 var(--pink);}

/* Tick list */
.ticks{list-style:none; margin:0; padding:0;}
.ticks li{position:relative; padding:9px 0 9px 30px; border-bottom:1px solid var(--line); font-size:16px;}
.ticks li:before{content:"✓"; position:absolute; left:4px; top:9px; color:var(--teal-dark); font-weight:900;}
.ticks.cross li:before{content:"×"; color:var(--muted); font-size:19px; top:6px;}
.ticks li:last-child{border-bottom:0;}

/* Comparison table */
.compare{width:100%; border-collapse:separate; border-spacing:0; background:#fff; border:3px solid var(--plum); border-radius:18px; overflow:hidden; font-size:15.5px;}
.compare th,.compare td{padding:13px 16px; border-bottom:1px solid var(--line); vertical-align:top; text-align:left;}
.compare thead th{font-family:var(--serif); font-size:18px; background:var(--ivory);}
.compare thead th.pb{background:var(--sun-soft);}
.compare td.pb{background:#fffcf0; font-weight:650;}
.compare tr:last-child td{border-bottom:0; font-weight:800;}
@media(max-width:560px){ .compare{font-size:14.5px;} .compare th,.compare td{padding:11px 10px;} }

/* FAQ */
.faq details{background:#fff; border:2px solid var(--plum); border-radius:14px; margin-bottom:10px;}
.faq summary{cursor:pointer; list-style:none; padding:16px 50px 16px 18px; font-weight:750; position:relative; font-size:16.5px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary:after{content:"+"; position:absolute; right:18px; top:12px; font-size:24px; color:var(--teal-dark); font-weight:700;}
.faq details[open] summary:after{content:"−";}
.faq details > div{padding:0 18px 16px; color:var(--plum-soft); font-size:15.5px;}
.faq details > div p:last-child{margin-bottom:0;}

/* Compatibility */
.compat{width:100%; border-collapse:collapse; background:#fff; border:2px solid var(--plum); border-radius:14px; overflow:hidden; font-size:15px;}
.compat th,.compat td{padding:12px 14px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top;}
.compat thead th{background:var(--ivory); font-size:13px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted);}
.pill{display:inline-block; font-size:12.5px; font-weight:800; padding:3px 9px; border-radius:999px; white-space:nowrap;}
.pill.ok{background:var(--aqua); color:#004c58;}
.pill.wait{background:var(--sun-soft); color:#6b4e00; border:1px solid #e8c25b;}
@media(max-width:560px){ .compat thead{display:none;} .compat tr{display:block; border-bottom:1px solid var(--line); padding:8px 0;} .compat td,.compat th{display:block; border:0; padding:4px 14px;} }

/* Final CTA */
.final{background:linear-gradient(120deg,var(--plum),#47314a 62%,var(--teal-dark)); border:3px solid var(--plum); border-radius:24px; padding:50px 26px; text-align:center; color:#fff; box-shadow:8px 9px 0 var(--sun);}
.final h2{color:#fff; font-size:clamp(28px,3.6vw,40px); margin-bottom:12px;}
.final p{color:rgba(255,255,255,.9); max-width:560px; margin:0 auto 24px;}
.final .cta-note{color:rgba(255,255,255,.85);}
.final .btn{background:var(--sun); color:var(--plum); box-shadow:4px 4px 0 var(--pink);}

/* Small print */
.fine{font-size:13.5px; color:var(--muted);}
.fine a{color:var(--teal-dark);}
.placeholder{border:2px dashed var(--pink); background:#fff; border-radius:14px; padding:18px; color:var(--muted); font-size:14.5px;}

/* ===== Payday Check form ===== */
.check-shell{background:#fff; border:3px solid var(--plum); border-radius:22px; box-shadow:10px 11px 0 var(--teal); padding:30px 30px 26px;}
@media(max-width:560px){ .check-shell{padding:22px 18px; box-shadow:6px 7px 0 var(--teal);} }
.progress{margin-bottom:22px;}
.progress-label{display:flex; justify-content:space-between; font-size:13.5px; font-weight:750; color:var(--muted); margin-bottom:8px;}
.progress-bar{height:12px; background:var(--ivory); border:2px solid var(--plum); border-radius:999px; overflow:hidden;}
.progress-bar span{display:block; height:100%; width:20%; background:var(--teal); transition:width .25s ease;}
.step-panel h2{font-size:clamp(26px,3.2vw,34px); letter-spacing:-.02em; margin-bottom:8px;}
.step-panel .intro{color:var(--plum-soft); margin-bottom:22px;}
.field{margin-bottom:22px;}
.field > label,.field legend{display:block; font-weight:800; font-size:16.5px; margin-bottom:6px; padding:0;}
.field fieldset{border:0; margin:0; padding:0; min-width:0;}
.help{font-size:14.5px; color:var(--muted); margin:0 0 10px;}
.eg{font-size:14px; color:var(--muted); margin:8px 0 0;}
.eg strong{color:var(--plum-soft);}
.money{position:relative; max-width:320px;}
.money:before{content:"$"; position:absolute; left:15px; top:50%; transform:translateY(-50%); font-weight:800; font-size:19px; color:var(--plum-soft);}
.field input[type=text],.field input[type=email],.field input[type=date],.money input{width:100%; font:inherit; font-size:19px; padding:13px 15px; border:2px solid var(--plum); border-radius:12px; background:var(--ivory); color:var(--plum);}
.field .money input,.money input{padding-left:36px; font-variant-numeric:tabular-nums;}
.field input[type=date]{max-width:320px; font-size:17px;}
.field input:focus{outline:none; box-shadow:4px 4px 0 var(--sun); background:#fff;}
.field input[aria-invalid=true]{border-color:var(--bad); background:var(--bad-soft);}
.err{color:var(--bad); font-size:14.5px; font-weight:700; margin:8px 0 0; min-height:0;}
.err:empty{display:none;}
.choices{display:grid; grid-template-columns:repeat(4,1fr); gap:10px;}
@media(max-width:640px){ .choices{grid-template-columns:1fr 1fr;} }
.choices label{position:relative; display:block; cursor:pointer;}
.choices input{position:absolute; opacity:0; pointer-events:none;}
.choices span{display:block; text-align:center; font-weight:750; font-size:15.5px; padding:13px 8px; border:2px solid var(--plum); border-radius:12px; background:var(--ivory);}
.choices input:checked + span{background:var(--aqua); box-shadow:3px 3px 0 var(--plum);}
.choices input:focus-visible + span{outline:3px solid var(--sun); outline-offset:2px;}
.check-row{display:flex; gap:12px; align-items:flex-start; padding:14px 16px; background:var(--sun-soft); border:2px solid var(--plum); border-radius:12px; cursor:pointer; font-weight:700;}
.check-row input{width:22px; height:22px; margin:2px 0 0; accent-color:var(--teal-dark); flex:0 0 auto;}
.check-row small{display:block; font-weight:400; color:var(--muted); font-size:14px;}
.optional{font-weight:600; font-size:13px; color:var(--muted); background:var(--ivory); border:1px solid var(--line); border-radius:999px; padding:2px 8px; margin-left:6px; vertical-align:2px;}
.nav-row{display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-top:8px; padding-top:18px; border-top:1px solid var(--line);}
.nav-row .btn{min-width:170px;}
@media(max-width:460px){ .nav-row{flex-direction:column-reverse; align-items:stretch;} .nav-row .btn{width:100%;} }
.running{display:flex; justify-content:space-between; gap:10px; margin:0 0 20px; padding:12px 16px; background:var(--aqua-soft); border-radius:12px; font-size:15px; font-weight:700;}
.running span:last-child{font-variant-numeric:tabular-nums;}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}
.consent{display:flex; gap:10px; align-items:flex-start; font-size:14.5px; color:var(--plum-soft); margin:4px 0 18px;}
.consent input{width:20px; height:20px; margin-top:2px; accent-color:var(--teal-dark); flex:0 0 auto;}
.msg{font-size:15px; font-weight:700; margin:10px 0 0;}
.msg:empty{display:none;}
.msg.ok{padding:13px 15px; background:var(--aqua); border:2px solid var(--plum); border-radius:12px;}
.msg.bad{color:var(--bad);}

/* Result page */
.result-msg{border:2px solid var(--plum); border-radius:16px; padding:20px 22px; margin:0 0 26px; font-size:17px;}
.result-msg.pos{background:var(--aqua-soft);}
.result-msg.near{background:var(--sun-soft);}
.result-msg.neg{background:var(--pink-soft);}
.result-msg p:last-child{margin-bottom:0;}
.big-num{font-family:var(--serif); font-size:clamp(46px,8vw,76px); font-weight:800; letter-spacing:-.04em; line-height:1; margin:6px 0 10px; font-variant-numeric:tabular-nums;}
.big-num.neg{color:var(--bad);}
.hardship{font-size:14.5px; color:var(--plum-soft); background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 16px;}
.cta-box{text-align:center; background:#fff; border:3px solid var(--plum); border-radius:22px; padding:30px 22px; box-shadow:9px 10px 0 var(--teal);}
.cta-box .price{font-size:44px; font-weight:850; letter-spacing:-.04em; margin:4px 0 2px;}

[hidden]{display:none !important;}